﻿.error-message { color: red; }

.checkout { max-width: 750px; margin: auto; padding: 10px; background-color: #fff; position: relative; }
	.checkout .empty-cart { text-align: center; padding: 150px 0; }
		.checkout .empty-cart .button { margin: 20px 0; display: inline-block; background-color: #2980b9; color: #fff; text-decoration: none; text-transform: uppercase; padding: 10px 15px; border-radius: 5px; }
	.checkout .account-links { position: absolute; top: 10px; right: 10px; }
		.checkout .account-links a { color: #003756; text-decoration: none; font-weight: 700; }

	.checkout .products { margin: 10px 0 20px; border: 1px solid rgba(38,36,76,.2); border-radius: 4px; border-radius: 6px; overflow: hidden; }
		.checkout .products .product { position: relative; border-bottom: 1px solid #efefef; clear: both; height: 120px; }
			.checkout .products .product:last-child { border-bottom: none; }
		.checkout .products .image { position: absolute; top: 0; left: 20px; bottom: 0; width: 120px; overflow: hidden; text-align: center; margin: 10px; }
		.checkout .products .product-img { position: absolute; left: 50%; top: 50%; -webkit-transform: translateY(-50%) translateX(-50%); -ms-transform: translateY(-50%) translateX(-50%); transform: translateY(-50%) translateX(-50%); max-width: 110%; max-height: 110%; display: block; }
		.checkout .products .product-info { position: absolute; top: 0; display: flex; align-items: center; left: 160px; bottom: 0; right: 0; padding: 10px 10px 10px 0; }
		.checkout .products .name { max-width: 360px; font-size: 20px; margin: 0; text-align:center;}
			.checkout .products .name a { text-decoration: none; font-size: 15px; }
		.checkout .products .description { max-width: 360px; text-transform: capitalize; }
		.checkout .products .quantity { position: absolute; right: 150px; height: 40px; width: 60px; border: 1px solid #ddd; background-color: #fff; }
		.checkout .products .quantity-label { display: block; position: absolute; width: 50%; top: 0; bottom: 0; left: 0; text-align: center; line-height: 40px; font-size: 18px; }
		.checkout .products .button-change-quantity { display: block; width: 50%; height: 50%; text-align: center; position: absolute; right: 0; font-size: 14px; text-decoration: none; }

			.checkout .products .button-change-quantity.increase { top: 0; border-left: 1px solid #ddd; }

			.checkout .products .button-change-quantity.decrease { bottom: 0; border-top: 1px solid #ddd; border-left: 1px solid #ddd; }
	.checkout .product .price { position: absolute; right: 10px; font-size: 16px; text-align: right; }
	.checkout .product .current-price { font-weight: 700; font-size: 16px; }
	.checkout .product .non-discount-price { display: none; font-size: 14px; margin-top: -5px; text-decoration: line-through; }

	.checkout .product .campaign .current-price { color: red; }
	.checkout .product .campaign .non-discount-price { display: block; }

	.checkout .product .remove-button { position: absolute; top: 50px; left: 10px; width: 18px; height: 18px; display: block; }
		.checkout .product .remove-button img { width: 100%; height: 100%; }
.products .cart-summary { padding: 10px 0 0; }
	.products .cart-summary .summary-row { clear: both; padding: 0px 10px; margin: 0; font-size: 14px; }
		.products .cart-summary .summary-row .label { display: inline-block; width: 590px; max-width: 80%; text-align: right; }
		.products .cart-summary .summary-row .value { float: right; }
		.products .cart-summary .summary-row.total { font-size: 17px; background-color: #f4f4f4; font-weight: 600; margin: 10px 0 0 0; padding: 14px 10px; border-top: 1px solid #ddd; }
.checkout .voucher-field { -webkit-appearance: none; -moz-appearance: none; padding: 9px 5px; border: 1px solid #bbb; }
.checkout-voucher-error { background-color: #ffdede; color: #bb0000; border-radius: 10px; font-size: 14px; padding: 10px 15px; margin: 10px 0; }
	.checkout-voucher-error p { margin: 0; }
.checkout .newsletter-checkbox { display: block; margin-top: 10px; }
	.checkout .newsletter-checkbox input[type="checkbox"] { margin-left: 0; margin-right: 5px; }
.checkout .shipping-options { margin: 5px 0 20px; list-style: none; padding: 0; border: 1px solid #ddd; border-radius: 5px; }
	.checkout .shipping-options li { padding: 10px; border-bottom: 1px solid #ddd; }
		.checkout .shipping-options li:last-child { border-bottom: none; }
	.checkout .shipping-options label { width: 100%; margin-left: 10px; }
	.checkout .shipping-options .price { float: right; font-size: 18px; }

.input-fields { overflow: hidden; }
	.input-fields .input-field { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 0 10px 0 5px; margin: 10px 0; }
		.input-fields .input-field .error { font-size: smaller; }
	.input-fields.col-2 .input-field { float: left; width: 50%; }

		.input-fields.col-2 .input-field.full-width { clear: both; float: none; width: 100%; }

	.input-fields .input-field input[type=text],
	.input-fields .input-field select { width: 100%; padding: 12px; margin: 5px 0 0; display: inline-block; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; -webkit-appearance: none; -moz-appearance: none; }
	.input-fields .input-field select { background-image: url('/gfx/arrow-down-16-black.png'); background-size: 12px; background-repeat: no-repeat; background-position: center right 8px; }
	.input-fields .input-field input[type=text].error { background-color: #ffdede; }

	.input-fields .input-field input[type=submit] { width: 100%; background-color: #dc1935; color: white; font-weight: 700; padding: 14px 20px; margin: 8px 0; border: none; border-radius: 4px; cursor: pointer; text-transform: uppercase; font-size: 18px; }
		.input-fields .input-field input[type=submit]:hover { background-color: #dc1935; }
.input-field.terms-message p { padding-top: 40px; font-size: 14px; margin: 0; }

.checkout-error { background-color: #ffdede; color: #bb0000; border-radius: 10px; font-size: 14px; padding: 10px 15px; }

	.checkout-error p { margin: 0; }

	.orderMarkingDiv {}
		.orderMarkingDiv p { font-weight: bold; font-size: 14px; font-weight: 500; }
.orderMarkingDiv input[type=text] {font-size: 16px; padding: 10px; width: 100%; box-sizing:border-box; border: 1px solid #ddd; border-radius: 5px; }

.checkout-payment-option { visibility: visible; overflow: visible; position: static; height: auto; }
	.checkout-payment-option.hidden { visibility: hidden; overflow: hidden; height: 0; position: absolute; top: 0; z-index: -1; }

.checkout-voucherbutton { display: inline-block; -webkit-appearance: none; -moz-appearance: none; padding: 10px 20px; text-align: center; border-radius: 4px; border: none; background-color: #dc1935; color: #fff; font-weight: 700; text-decoration: none; text-transform: uppercase; position: relative; }
.checkout-paymentoptions { margin: 10px 0 20px; }
.checkout-select-paymentoption { display: block; overflow: hidden; }
	.checkout-select-paymentoption input,
	.checkout-select-paymentoption br { display: none; }
	.checkout-select-paymentoption label { display: block; color: #fff; font-weight: 700; background-color: #2980b9; padding: 10px; margin: 10px 0; cursor: pointer; }
	.checkout-select-paymentoption input:checked + label { background-color: #013c63; }

.invoice-checkout-shippingadress-panel { overflow: hidden; display: none; }

.shipping-expanded .invoice-checkout-shippingadress-panel { display: block; }

.addressContainer { margin-top: 30px; display: flex; justify-content: flex-start; align-items: flex-start; border: 1px solid rgb(225, 225, 225); border-radius: 5px; padding: 0px 20px 20px 25px; }
	.addressContainer .addressDiv { margin: 0px 30px 0px 0px; width: 500%; }
		.addressContainer .addressDiv h3 { line-height: 100%; margin-bottom: 15px; }
		.addressContainer .addressDiv p { line-height: 90%; }
		.addressContainer .addressDiv p,
		.addressContainer .addressDiv label { margin: 0 0 10px 0; font-size: 15px; }
			.addressContainer .addressDiv p a {  }
	.addressContainer .checkoutFields p { margin: 0; font-size: 14px; }
		.addressContainer .checkoutFields p span { color: red; }
	.addressContainer .checkoutFields input { margin: 0 0 10px 0; display: block; width: 100%; }
.button-buy { display: block; margin-top: 15px; background-color: #3a6632; color: #fff; width: 100%; border: none; font-size: 16px; border-radius: 5px; cursor: pointer; padding: 25px; -webkit-appearance: none; }
	.button-buy:hover { background: #4e8545; }


@media only screen and (max-width: 840px) {
	.checkout .products .quantity { right: 100px; }
}

@media only screen and (max-width: 750px) {
	.checkout .products .product { height: auto; min-height: 120px; }
	.checkout .products .image { left: 0; width: 100px; height: 100px; }
	.checkout .products .product-info { margin-left: 110px; position: static; }
	.checkout .products .name { max-width: none; font-size: 14px; margin-right: 20px; }
	.checkout .products .quantity { position: relative; right: auto; top: auto; }
	.checkout .product .price { top: auto; bottom: 10px; font-size: 16px; text-align: right; }
	.checkout .product .remove-button { top: 10px; left: auto; right: 10px; }

	.products .cart-summary .summary-row .label { width: auto; }
}
