/* Shoppingcart */

#simplecart {
	position: relative;
}

	#simplecart table {
		width: 95%;
		margin-bottom: 15px;
		border-collapse: collapse;
	}
	
		#simplecart table th,
		#simplecart table td {
			padding: 4px 6px;
		}
		
		#simplecart table th {
			text-align: left;
			background: #cccccc;
		}
		
		#simplecart table tr.odd td {
			
		}
		
		#simplecart table tr.even td {
			background: #ebebeb;
		}
			
			#simplecart table tr td.quantity input {
				width: 30px;
                text-align: center;
			}
			
			#simplecart table tr th.subtotal,
			#simplecart table tr td.subtotal {
                width: 120px;
                text-align: right;
            }

			#simplecart table tr td.actions {
                width: 60px;
                text-align: right;
                padding-right: 10px;
            }
			#simplecart table tr td.actions input[type='submit'] {
                display: inline-block;
				width: 16px;
				height: 16px;
				font-size: 0px;
				line-height: 0px;
				border: 0px;
				background: transparent url(../images/web/icon-remove.png) left center no-repeat;
				cursor: pointer;
			}

		#simplecart table tr.total td.label,
		#simplecart table tr.total td.value,
		#simplecart table tr.total td.extra { text-align: right; padding: 8px 6px; background: #cccccc; }

        #simplecart table tr.total.first td { border-top: 2px solid #cccccc;}

        #simplecart table tr.total td.label { font-weight: bold; }
        #simplecart table tr.total td.extra { text-align: left; }

        #simplecart table tr.vat td { font-size: .9em; font-weight: normal !important; padding: 2px 6px; }

/* Coupon code */

#simplecart #sccoupon.form,
#simplecart #sccoupon.result {
	position: relative;
	width: 40%;
	padding: 6px 10px;
	margin-top: 15px;
	margin-bottom: 15px;
	border: 1px solid #cccccc;
}

/* The checkout form */

#simplecartCheckout {
	position: relative;
	width: auto;
}

	#simplecartCheckout div {
		position: relative;
		width: auto;
	}
	
	#simplecartCheckout div:after {
		height: 0px;
		line-height: 0px;
		content: ".";
		display: block;
		visibility: hidden;
		clear: both;
	}
	
		#simplecartCheckout div label {
			position: relative;
			display: inline-block;
			min-width: 8em;
		}
		
			#simplecartCheckout div label span {
				color: #ff0000;
			}
		
		#simplecartCheckout input[type='text'],
		#simplecartCheckout input[type='email'],
		#simplecartCheckout input[type='number'],
		#simplecartCheckout select,
		#simplecart input[type='text'],
		#simplecart input[type='number'],
		#simplecart select,
		.StripeElement
		{
			position: relative;
			margin-bottom: 1em;
			padding: 0.5em;
			border: 1px solid #ccc;
			border-radius: 5px;
			font-size: 1em;
		}
		
		#simplecartCheckout div label.error {
			position: relative;
			width: 150px;
			display: inline-block;
			color: #ff0000;
		}

/* Order details */

#simplecart.orderdetail .details {
	width: 25%;
	border: 1px solid #cccccc;
}

	#simplecart.orderdetail .details th {
		width: 100px;
	}

#simplecart.orderdetail .addresses {
	width: 50%;
	border: 1px solid #cccccc;
}
	
	#simplecart.orderdetail .addresses td {
		width: 50%;
		vertical-align: top;
	}

#simplecart.orderdetail .products {
	border-bottom: 4px solid #cccccc;
}
	
	#simplecart.orderdetail .products .quantity {
		text-align: center;
	}

	#simplecart.orderdetail .products .price,
	#simplecart.orderdetail .products .subtotal {
		width: 110px;
		text-align: right;
	}

#simplecart.orderdetail .totals th {
	width: 100px;
	text-align: right;
	padding-right: 10px;
}

#simplecart.orderdetail .totals td.costs {
	width: 110px;
	text-align: right;
}

#simplecart.orderdetail .comments {
    width: 95%;
}

    #simplecart.orderdetail .comments .comment {
        margin: 0 0 25px 0;
        border-bottom: 1px solid #cccccc;
    }

        #simplecart.orderdetail .comments .comment .info {
            width: auto;
            padding: 4px 8px;
            background: #ebebeb;
        }

        #simplecart table tr td.number label,
        #simplecart.orderdetail .comments .comment .info label {
            display: inline-block;
            color: #fff;
            padding: 3px 8px;
            margin-left: 10px;
            background: #05ab00;
        }

/* Recently viewed */

#simplecart.recently {
	position: relative;
	width: auto;
}

	#simplecart.recently h3 {
		margin: 0px 0px 15px 0px;
	}
	
	#simplecart.recently div.item {
		width: 180px;
		padding: 10px;
		margin-right: 10px;
		border: 1px solid #cccccc;
		float: left;
	}
	
		#simplecart.recently div.item p {
			margin: 0px;
		}

#simplecart.recently:after {
	height: 0px;
	line-height: 0px;
	content: ".";
	display: block;
	visibility: hidden;
	clear: both;
}

#simplecart input[type="submit"],
#simplecartCheckout input[type="submit"] {
	padding: 0.5em;
	font-size: 1em;
	display: block;
	border: 1px solid #137899;
	border-radius: 5px;
	background: #137899;
	color: #fff;
	cursor: pointer;
}

/* Auth.net-specific styling */
#simplecartCheckout .sc-authnet-field > label, #simplecartCheckout .sc-stripe-gateway > label {
	width: 100%;
	display: block;
}
#authnet_cardNumber, #authnet_fullName {
	width: 18em;
}
#authnet_expMonth {
	width: 3em;
}
#authnet_expYear, #authnet_cardCode {
	width: 5em;
}
/* Stripe styling */
.payment-errors {
	color: #ff0000;
}
.StripeElement--invalid {
	border-color: #ff0000;
}

/* Pending payment confirmation */
.sc-order-pending {
	border: 1px solid #195F91;
	border-radius: 3px;
	padding: 1.5em;
}
.sc-order-pending-spinner {
	display: inline-block;
	width: 40px;
	height: 40px;
	/*line-height: 60px;*/
}
.sc-order-pending-spinner + h2 {
	display: inline-block;
	/*line-height: 40px;*/
	height: 60px;
	vertical-align: middle;
	padding: 0 0 0 0.5em;
	margin: 0;
}
.sk-fading-circle {
	width: 40px;
	height: 40px;
	position: relative;
}

.sk-fading-circle .sk-circle {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
}

.sk-fading-circle .sk-circle:before {
	content: '';
	display: block;
	margin: 0 auto;
	width: 15%;
	height: 15%;
	background-color: #333;
	border-radius: 100%;
	-webkit-animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
	animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
}
.sk-fading-circle .sk-circle2 {
	-webkit-transform: rotate(30deg);
	-ms-transform: rotate(30deg);
	transform: rotate(30deg);
}
.sk-fading-circle .sk-circle3 {
	-webkit-transform: rotate(60deg);
	-ms-transform: rotate(60deg);
	transform: rotate(60deg);
}
.sk-fading-circle .sk-circle4 {
	-webkit-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	transform: rotate(90deg);
}
.sk-fading-circle .sk-circle5 {
	-webkit-transform: rotate(120deg);
	-ms-transform: rotate(120deg);
	transform: rotate(120deg);
}
.sk-fading-circle .sk-circle6 {
	-webkit-transform: rotate(150deg);
	-ms-transform: rotate(150deg);
	transform: rotate(150deg);
}
.sk-fading-circle .sk-circle7 {
	-webkit-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	transform: rotate(180deg);
}
.sk-fading-circle .sk-circle8 {
	-webkit-transform: rotate(210deg);
	-ms-transform: rotate(210deg);
	transform: rotate(210deg);
}
.sk-fading-circle .sk-circle9 {
	-webkit-transform: rotate(240deg);
	-ms-transform: rotate(240deg);
	transform: rotate(240deg);
}
.sk-fading-circle .sk-circle10 {
	-webkit-transform: rotate(270deg);
	-ms-transform: rotate(270deg);
	transform: rotate(270deg);
}
.sk-fading-circle .sk-circle11 {
	-webkit-transform: rotate(300deg);
	-ms-transform: rotate(300deg);
	transform: rotate(300deg);
}
.sk-fading-circle .sk-circle12 {
	-webkit-transform: rotate(330deg);
	-ms-transform: rotate(330deg);
	transform: rotate(330deg);
}
.sk-fading-circle .sk-circle2:before {
	-webkit-animation-delay: -1.1s;
	animation-delay: -1.1s;
}
.sk-fading-circle .sk-circle3:before {
	-webkit-animation-delay: -1s;
	animation-delay: -1s;
}
.sk-fading-circle .sk-circle4:before {
	-webkit-animation-delay: -0.9s;
	animation-delay: -0.9s;
}
.sk-fading-circle .sk-circle5:before {
	-webkit-animation-delay: -0.8s;
	animation-delay: -0.8s;
}
.sk-fading-circle .sk-circle6:before {
	-webkit-animation-delay: -0.7s;
	animation-delay: -0.7s;
}
.sk-fading-circle .sk-circle7:before {
	-webkit-animation-delay: -0.6s;
	animation-delay: -0.6s;
}
.sk-fading-circle .sk-circle8:before {
	-webkit-animation-delay: -0.5s;
	animation-delay: -0.5s;
}
.sk-fading-circle .sk-circle9:before {
	-webkit-animation-delay: -0.4s;
	animation-delay: -0.4s;
}
.sk-fading-circle .sk-circle10:before {
	-webkit-animation-delay: -0.3s;
	animation-delay: -0.3s;
}
.sk-fading-circle .sk-circle11:before {
	-webkit-animation-delay: -0.2s;
	animation-delay: -0.2s;
}
.sk-fading-circle .sk-circle12:before {
	-webkit-animation-delay: -0.1s;
	animation-delay: -0.1s;
}

@-webkit-keyframes sk-circleFadeDelay {
	0%, 39%, 100% { opacity: 0; }
	40% { opacity: 1; }
}

@keyframes sk-circleFadeDelay {
	0%, 39%, 100% { opacity: 0; }
	40% { opacity: 1; }
}