/* errors */

section.errors {
	border: 0.3m dashed red;
	color: red;
	font-size: 120%;
	font-weight: bold;
	padding: 1em;
}

section.errors p { margin: 0.5em 0; }

/* order form */

form.order {
	margin-bottom: 1em;
}

.order fieldset {
	box-sizing: border-box;
	margin: 0.5em 0;
	width: 100%;
}

.order fieldset.ship { padding: 1em 0.6em 0.6em; }

form.order legend {
	font-size: 120%;
	font-weight: bold;
}

form.order legend aside { font-weight: normal; }

.order header,
.order > div {
	align-items: center;
	display: flex;
}

.order header {
	border-bottom: 1px solid #2f2a1e;
	border-top: 2px solid #2f2a1e;
	font-weight: bold;
	margin-bottom: 0.2em;
	padding-bottom: 0.2em;
}

fieldset.order > div { margin: 0.1em; }

fieldset.order > div:last-of-type {
	border-bottom: 2px solid #2f2a1e;
	padding-bottom: 0.2em;
}

fieldset.order div.total {
	border-top: 1px solid #2f2a1e;
	margin-top: 0.2em;
	padding-top: 0.2em;
}

.order .item { flex: 1; }

.order .price,
.order .qty,
.order .ext {
	text-align: right;
}

.order .price,
.order .ext {
	width: 6em;
}

.order .price { padding: 0 1em; }

.order .ext { margin-right: 0.2em; }

.order span.qty { width: 4.5em; }

@media (max-width: 600px) {
	.order .price {
		padding-left: 0.2em;
		padding-right: 0.3em;
		width: 5em;
	}
}

@media (max-width: 560px) {
	.order .price { width: 4em; }
	.order .ext { width: 5em; }
}

form.order input {
	background-color: #f9fafb;
	color: #716e32;
}

form.order input[type="number"] { padding: 0.33em 0; }

form.order input[type="submit"] {
	display: block;
	font-size: 150%;
	font-weight: bold;
	margin: 0 auto 0.5em;
	padding: 0.5em 1em;
}

form.order select { border-width: 2px; }

input.qty {
	text-align: right;
	width: 4em; 
}

fieldset.ship label { display: block; }

fieldset.ship label,
fieldset.ship input {
	width: calc(100% - 0.5em);
}

fieldset.ship > div {
	align-items: center;
	display: flex;
}

fieldset.ship > div.checkout { align-items: stretch; }

fieldset.ship > div > div.town {
	flex: 1;
	margin-right: 0.4em;
}

fieldset.ship .postcode { width: 5em; }

fieldset.ship .state { width: 7em; }

fieldset.ship .key { width: 8em; }

fieldset.ship .value { flex: 1; }

/* tax invoice */

.ordercomplete h3.taxinvoice, .ordercomplete h5.abn { text-align: center; }

.ordercomplete h3.taxinvoice { margin-bottom: 0; }

.ordercomplete h4.payment { margin-bottom: 0; }

.ordercomplete h5.abn {
	color: #92825d;
	margin: 0;
}

.ordercomplete > header {
	display: flex;
	margin-top: 1em;
}

.ordercomplete header section.customer { flex: 1; }

.ordercomplete header section.invoice { width: 16em; }

section.invoice div { display: flex; }

section.invoice div span:first-of-type {
	flex: 1;
	font-weight: bold;
	margin-right: 1em;
	text-align: right;
}

section.invoice div span:last-of-type {
	text-align: left;
	width: 6em;
}

section.lineitems {
	border-top: 2px solid #2f2a1e;
	border-bottom: 2px solid #2f2a1e;
	margin-top: 1em;
}

section.lineitems header {
	border-bottom: 1px solid #2f2a1e;
	font-weight: bold;
	margin-bottom: 0.1em;
	padding: 0.1em 0 0.2em;
}

section.lineitems header, section.lineitems div { display: flex; }

section.lineitems span {
	text-align: right;
	width: 8em;
}

section.lineitems span.item {
	flex: 1;
	text-align: left;
}

section.lineitems div.total {
	border-top: 1px solid #2f2a1e;
	font-weight: bold;
	margin-top: 0.1em;
}

section.payment {
	display: flex;
	margin-bottom: 1em;
}

section.payment > div {
	border: 1px solid #2f2a1e;
	flex: 1;
	margin: 0.5em;
	padding: 0.5em;
}

section.payment > div:first-of-type { margin-left: 0; }
section.payment > div:last-of-type { margin-right: 0; }

section.payment > div > h5 { margin: 0; }

section.payment div div { display: flex; }

section.payment div div span:first-of-type {
	margin-right: 1em;
	text-align: right;
	width: 8em;
}

section.payment div div span:last-of-type { flex: 1; }

@media (max-width: 640px) {
	section.lineitems span { width: 6em; }
}

@media (max-width: 560px) {
	section.lineitems span.qty { width: 5em; }
}

@media (max-width: 530px) {
	section.lineitems span.qty { width: 4.5em; }
	section.lineitems span.ext { width: 5em; }
}

@media (max-width: 400px) {
	.ordercomplete header { display: block; }
	.ordercomplete header section.invoice { width: auto; }
}

@media (max-width: 367px) {
	section.payment { display: block; }
	section.payment > div:first-of-type { margin: 0.5em; }
	section.payment > div:last-of-type { margin: 0.5em; }
}

@media (max-width: 310px) {
	.ordercomplete { font-size: 80%; }
}

@media print {
	.ordercomplete > p,
	div.breadcrumbs,
	div.holden-postmetadataheader,
	div.holden-sidebar2,
	header.holden-header,
	nav.holden-nav {
		display: none;
	}
	section.invoice { padding-right: 1em; }
	section.payment div div span:first-of-type { width: 9em; }
	.holden-page-footer a,
	.holden-page-footer a:link,
	.holden-page-footer a:visited,
	.holden-page-footer a:hover {
		font-size: 80%;
	}
}