html, body { margin: 0; padding: 0; }
body { color: #231f20; font-size: 10px; font-family: 'Open Sans', sans-serif; }

.pdf-holder { width: 640px; margin: 28px auto; }
.clear { height: 0; display: block; clear: both; }
.fa { font-family: fontawesome; }

/**/header { padding-top: 40px; margin-bottom: 24px; height: 200px; }
	header .logo-holder { width: 50%; padding-right: 2px; float: left; }
	header .logo-holder img { /* Note: Define max-height/max-width as inline style on element */ }
	header .company-info { line-height: 14px; text-align: right; float: right; }
		header .company-info h3 { line-height: 18px; font-size: 12px; font-weight: bold; margin: 0 0 4px 0; padding: 0; }
		header .company-info .address { margin-bottom: 2px; }
		header .company-info .icon-row table { width: 100%; text-align: right; }
/**/			header .company-info .icon-row td { line-height: 14px; font-size: 10px; text-align: right; padding: 2px 0; }
/**/				header .company-info .icon-row td.icon { width: 18px; color: rgba(35, 31, 32, 0.6); font-size: 10px; font-family: fontawesome; font-style: normal; text-align: right; }

.main-info { margin-bottom: 24px; }
.order-number { width: 50%; border-left: 8px solid #e9e8e8; padding-left: 8px; float: left; }
	.order-number h2 { line-height: 18px; font-size: 14px; font-weight: normal; margin: 0 0 4px 0; padding: 0; }
	.order-number .order-number-item { line-height: 14px; color: rgba(35, 31, 32, 0.8); font-size: 10px; padding-right: 16px; vertical-align: top; }
		.order-number .order-number-item h4 { margin: 0 0 2px 0; padding: 0; }
.barcode { width: 40%; text-align: right; float: right; }

.customer-info { width: 50%; font-size: 10px; margin-bottom: 36px; float: left; }
	.customer-info h2 { font-size: 12px; font-weight: bold; margin: 0 0 4px 0; padding: 0; }
		.customer-info .icon-row table,
		.footer-customer .icon-row table { width: 100%; }
		.customer-info .icon-row table tbody tr td,
		.footer-customer .icon-row table tbody tr td  { line-height: 14px; font-size: 10px; padding: 2px 0; }
			.customer-info .icon-row table tbody tr td.icon,
			.footer-customer .icon-row table tbody tr td.icon { width: 14px; color: rgba(35, 31, 32, 0.6); font-size: 10px; font-family: fontawesome; font-style: normal; }
			.footer-customer .icon { font-family: fontawesome; }

.invoice-number-cnt { width: 40%; padding-top: 16px; float: right; }
.invoice-number { border-left: 8px solid #e9e8e8; padding-left: 8px; }
	.invoice-number h2 { line-height: 18px; font-size: 14px; font-weight: normal; margin: 0 0 4px 0; padding: 0; }
	.invoice-number .invoice-number-item { line-height: 14px; color: rgba(35, 31, 32, 0.8); font-size: 10px; padding-right: 16px; vertical-align: top; }
		.invoice-number .invoice-number-item h4 { margin: 0 0 2px 0; padding: 0; }

.info-boxes { margin-bottom: 16px; }
	.info-boxes .info-box { width: 50%; float: left; }
		.info-boxes .info-box .on-left { padding-right: 2px; }
		.info-boxes .info-box .on-right { padding-left: 2px; }
/**/		.info-boxes .info-box .heading,
/**/		.info-boxes .info-box-full .heading { font-size: 12px; font-weight: bold; border-bottom: 4px solid #e9e8e8; margin-bottom: 8px; padding-bottom: 4px; }
		.info-boxes .info-box .address,
		.info-boxes .info-box-full .address { line-height: 14px; margin-bottom: 4px; }
		.info-boxes .info-box .icon-row table { width: 100%; }
			.info-boxes .info-box .icon-row table tbody tr td { line-height: 14px; font-size: 10px; padding: 2px 0; }
				.info-boxes .info-box .icon-row table tbody tr td.icon { width: 14px; color: rgba(35, 31, 32, 0.6); font-size: 10px; font-family: fontawesome; font-style: normal; }

.table-holder { padding-top: 16px; margin-bottom: 24px; }
	.table-holder table { width: 100%; }
		.table-holder table thead tr th { background: #f4f4f4; color: rgba(35, 31, 32, 0.6); font-size: 9px; font-weight: bold; text-align: center; border: 1px solid #e9e8e8; border-left: 0; padding: 6px 4px; }
			.table-holder table thead tr th.first { border-left: 1px solid #e9e8e8; }
			.table-holder table thead tr th.tleft { text-align: left; }
		.table-holder table tbody tr td { color: rgba(35, 31, 32, 0.6); font-size: 10px; text-align: center; border-right: 1px solid #e9e8e8; border-bottom: 1px solid #e9e8e8; padding: 4px; }
			.table-holder table tbody tr td.first { border-left: 1px solid #e9e8e8; }
			.table-holder table tbody tr td.img { width: 32px; border-right: 0; padding-right: 0; }
			.table-holder table tbody tr td.info { text-align: left; }
				.table-holder table tbody tr td.info h4 { font-size: 10px; margin: 0 0 2px 0; padding: 0; }
				.table-holder table tbody tr td.info h5 { font-size: 10px; font-weight: normal; margin: 0 0 2px 0; padding: 0; }
			.table-holder table tbody tr td strong { color: rgba(35, 31, 32); }
		.table-holder table tfoot tr td { color: rgba(35, 31, 32, 0.6); font-size: 10px; text-align: center; padding: 6px 4px; }
			.table-holder table tfoot tr td.label,
			.table-holder table tfoot tr td.value { border-right: 1px solid #e9e8e8; border-bottom: 1px solid #e9e8e8; }
			.table-holder table tfoot tr td.label { text-align: left; }
			.table-holder table tfoot tr td.empty { border-right: 1px solid #e9e8e8; }
			.table-holder table tfoot tr td.final { background: #231f20; color: #fff; }
			.table-holder table tfoot tr td strong { color: rgba(35, 31, 32); }
				.table-holder table tfoot tr td.final strong { color: #fff; }

/**/ footer { padding-bottom: 30px; }
footer table { width: 100%; }
	footer table tr td { vertical-align: bottom; }
footer .footer-customer { font-size: 10px; }
	footer .footer-customer h2 { font-size: 12px; font-weight: bold; margin: 0 0 4px 0; padding: 0; }
footer .title { line-height: 18px; font-size: 14px; font-weight: bold; font-style: italic; text-align: right; }