@import 'checkout.css';

/* #cart 		{ margin-top: 0; padding:0 30px 50px 30px; position: relative; width: 68%; background: #fff; }
#chkout	{ width:32%; box-sizing:border-box; order:2; background:#fafafa; } */

/* -------------------------------------------------------------------------------------------------------------------- */

/* div#sidebar-left	{ margin-top:10px } */


/* div#prd-content				{ float:right; width:700px; }
 div#product-wrapper		{ float:right; width:600px;background:url(../images/white-bg.png) repeat; padding:40px 50px; border-radius:5px;} */

#cart { width:100%; }
#chkout { float:left; width:100%; background:none;}

#order-items 			{ float:left; width:65%; margin:0 auto 0 auto; padding:0px; 	}
#order-items OL 		{ float:left; list-style-type:none; margin:0; padding:0; width:100%}
#order-items OL LI	{ float:left; margin:0 0 0 0; padding:0; box-sizing:border-box; width: 100%; border-top:none; position:relative;   }


.mobileCap { display:block; font-size:11px; line-height:14px;  font-style:italic;  font-weight:300; }

.art-wrapper 		{ float:left; width:45%; }
.art-thumb   		{ float:left; width:20%; height:120px; padding:0 25px; box-sizing:border-box; margin:0 auto 1rem}
.art-thumb img		{ height:auto!important }

.cart-info{ float:left; width:80%;}

div.art-title		{ float:left;font-weight:normal; margin:0;}

.hItemTitle { float:left; width: calc( 100% - 210px );  font-size:0.95em; }
.hItemTitle a		{  color:#555;}
.hItemTitle a:hover	{ text-decoration:underline; }

div.art-attributes	{ float:left;  margin:15px 0 0 0; /* color:#aaa; */ font-size:0.9em; display:none;}
 .art-attributes DIV	{ float:left; width:100%;  }

 span.prop		{ float:left; width:auto; min-width:100px; font-weight:bolder }
 span.pvalue		{ float:left; }

.show_more { float:left;width:100%;cursor:pointer; padding-bottom:10px;}
.show_more:hover { text-decoration:underline;}
 .show_more:before { content:"mehr anzeigen..."; }
 .show_more.active:before { content:"weniger anzeigen..."; }
 .productdetails { display:none; }
 
 div.deliverytime	{ float:left; margin-top:5px; color:green; }

div.print-data {float:left; width:100%;}
 span.print-data { float:left; width:100%; color:#555; margin-top:5px; font-style:italic; }
 span.print-data:before { content:"\f06a"; font-family: FontAwesome; color:#F2BA36; margin-right:3px; font-size:1.4em; font-style:normal; }
 

div.artTaxeRate		{ float:left; width:70px; height:70px; padding-top:40px; text-align:center; color:#f0f0f0; font-size:12px; }


.hItemLine { float:left; width:100%; padding-top:10px; }

.line { float:left; width:100%; padding:10px 0 10px 0;  }

.qntwrapper { position:relative; float:left; width:116px; margin-top:0px; }

.upd-frm		{ float:right; width:auto;text-align:center;  height:40px; }
input.odrqnt		{ position:absolute; left:32px; width: 50px; height:36px; background:#fff; padding:10px; border:2px solid #f0f0f0; text-align:center; }

.addcartitems {  
    background: #f0f0f0; /* color:#fff; */
    cursor: pointer;
    padding: 6px 12px 6px 12px;
    font-weight: normal;
    font-size: 20px;
    position: absolute;
	left:0;
    top: 0;
	margin-top:0px;
	vertical-align:middle;
}

.addcartitems:hover { background:#555; color:#fff; }
.cartplus 		{  left:82px; border-radius:0 5px 5px 0; }
.cartminus 	{ border-radius:5px 0  0 5px; font-weight:700;  padding: 6px 13px 6px 13px; }


.upd-frm i				{ 	cursor: pointer; color:#ccc;}
.upd-frm i:hover	{	color:#10a19a;}

.hPriceContainer {  position:absolute; width:auto;  right:0; top:5px; }

div.artprice		{ float:left; width:100%;text-align:right; padding-top:0px;}
.artprice small		{ font-size:10px}
.artprice .strike  { color:#c0c0c0; text-decoration:line-through; }

.artsumme		{ float:left; width:100%;text-align:right; padding-top:10px; font-weight:700; }


div.delete		{  float:left; width:25%; float:right;text-align:center; padding-top:0px;  }

.delete a {
	display: inline-block;
	background: #f0f0f0;
	color: #555;
	font-size: 14px;
	padding: 6px 12px 6px 12px;
	border-radius: 5px;
	text-align: center;
}

.delete a:hover { background:#555; color:red;}
.delete i {font-size:1.1em; /* color:#fff; */}
.delete i:hover { color:red/*#10a19a*/;}

span.wrapart, span.unwrapart	{ position:absolute; right:0; top:70px; width:60px; height:34px; cursor:pointer; padding-left:75px; padding-top:5px }

span.wrapart:hover, span.unwrapart:hover {  text-decoration:underline }
span.unwrapart:hover	{ color:#ca2e16 }

div#total-price		{ float:right;width:32%; margin:0 auto 0 auto; padding:2rem; box-sizing:border-box; border-radius:10px; background:#f0f0f0; }
.hcartBottom { padding:0 2rem 0 2rem; position:relative; z-index:1;}

form[name="voucherfrm"] label { float:left; width:100%; font-size:12px; }
#voucher				{ display:flex; width: 100%; margin:0 auto 0 auto; text-align:left; /* border-top:1px solid #ececec */; padding:20px 0px; box-sizing:border-box; background:#fff; }
#voucher input		{ float:left;background:#fff; padding:9px 15px 8px 15px; border:1px solid #878786; color:#878786; margin:0; border-radius:5px 0 0 5px; box-sizing:border-box;}

#voucher input#sbmVoucher		{  float:left; margin:0;cursor:pointer; background:#878786; color:#ececec;padding:10px 35px;  border:none;font-family: 'Lato', sans-serif; font-size:1em; transition:all ease 0.3s;box-sizing:border-box; border-radius:0 5px 5px 0;}
#voucher input#sbmVoucher:hover { background:#555; }
input#sbmVoucher:hover { background:#10a19a;}




#summen TABLE		{ float:right;position:relative; width:100%; border:px solid #ececec; font-size:inherit;}
td.green			{ color:green; font-weight:normal; font-style:italic }
.doubleline	{ border-top:0px solid #ececec; border-bottom:1px solid #ececec; }
.underline		{ border-bottom:0px solid #ececec }
/*td.sum-total-td { color:#10a19a }*/
td.sum-total-td, td.sums-small-td { width:30%; }

.sum-total-th, .sum-total-td { font-size:15pt;}
.sum-total-th, .sums-small-th { text-align:left;}


#failure, #success { display:inherit; clear:all; float:none !important; margin:0px auto 10px auto !important; width:100% !important; }


.checkout-buttons { margin-top:80px; padding-bottom:30px; }

	
#kasse			{ width:20%; min-width:200px; /* height:35px; */  color:#fff;text-align:center;  line-height:36px;  text-transform:uppercase}

#tostart 			  { float:left; background:#707173; display:block; margin:0 auto 0 auto; max-width:600px; }
#tostart:hover { background:#10a19a; }

#kasse{ background:var(--layout-second-contrast-color); display:block; margin:20px auto 0 auto;  width:100%; border-radius:5px;padding:5px; }




/* #kasse:hover { background:#707173;}
#kasse:hover:after { animation: anibtn 2s;}


#kasse:after {content:"\f178"; font-family:FontAwesome; margin-left:5px; } */







.freightweight { float:left; display:block; font-size:12px; }

.countrysel {float:left !important; height:45px; width:230px; border:0px solid #ccc; border-radius:5px; box-shadow: inset 0 0 3px #ddd; position:relative; overflow:hidden; background:#fff; margin-bottom:15px;}
.countrysel ul { list-style:none; margin:0; padding:0; position: absolute; left:1px; top:45px; width:calc(100% - 2px); /* height:200px; */ overflow:auto; background:#fff;  box-shadow: 0 3px 3px #ddd; resize:vertical; }
.countrysel:after { content:"\f107"; font-family:FontAwesome; position:absolute; right:8px; top:10px;  font-size:20px;}

/* .countrysel:hover, */ .countrysel.active { overflow: unset;}
.countrysel ul li { display:block; width:100%; border-bottom:1px dotted #ccc; padding:0 !important; margin:0; position:relative; }
.countrysel ul li label, .countrysel .text { display:block; width:100%; min-height:30px; padding:10px; margin:0; box-sizing:border-box; cursor:pointer; text-align:left; font-size:15px; }
.countrysel ul li label { padding:5px 10px 5px 10px; }
.countrysel ul li label small, .countrysel .text small { font-style:italic; display:inline-block; padding-left:10px; font-size:13px; }
.countrysel ul li input { display:none; }

.countrysel ul li:hover label, .countrysel ul li.selected label, 
.countrysel ul li input:checked + label { background:#fafafa; font-weight:300; }
.countrysel ul li input:checked + label:before { content:"\f00c"; font-family:FontAwesome; position:absolute; right:4px; top:8px; }

.countrysel ul li::before { display:none !important; }

#countrysel-text	{ float:left; position:relative; line-height:26px; width:130px; margin:0 10px 0 0; background:;}

#shippingSelector { float:right; position:relative; }

#selval, #selval2	{ position: absolute; left:0; line-height:30px; width:200px; padding:0 15px; margin:5px 0; text-align:left; }	

#country_bg	 {
	position: relative;	
	left: 0;
	top: 0;
	width: 200px;
	margin:5px 0;
	height: 30px;
	line-height: 30px;
	border: 1px solid #878786;
	border-radius: 3px;
	cursor: pointer;	
	padding: 0 15px;
	display: block;	
}
	

#country_bg::before {
	content: "\F078";
	font: normal normal normal 16px/1 FontAwesome;
	position: absolute;
	right: 10px;
	top: 50%;
	transform: translateY(-50%);
	background: #707173;
	color: #fff;
	padding: 2px;
	border-radius: 50%;
	display: block;
	transition: 0.5s all ease;
}

#country_bg:hover::before  { background: #10a19a; }
#country_bg SELECT 	{ position:absolute; cursor:pointer;left:0; top:0;  height:30px;width:100%;  line-height:30px;opacity:0; filter: alpha(opacity = 0); z-index:3;}
#country_bg OPTION 	{ background:#fff;font-family: 'Raleway', sans-serif; font-size: 1em; padding:0 15px;}


@media screen and (max-width:1400px) {
	#order-items {width:55%;}
	div#total-price { width:41%; padding: 2rem 0rem;}
}
@media screen and (max-width:1100px) {
	/*#order-items {width:55%;}
	div#total-price { width:41%; padding: 2rem 0rem;}
	*/
}
@media screen and (max-width:1024px) {
	/* #cart { background:#fff; }  */
	div#failure, div#success { display:block; margin-top:80px !important; }
	
	.checkout-buttons { margin-top:20px; padding-bottom:30px; }
	#shippingSelector  { float:left; }	
	#signin, #ppexpress-wrap { display:inline-block;  width:250px; padding:0; }
	#ppexpress-wrap { position:relative; top:12px; }
	#kasse { margin-top:0; padding:0;}
	
	/* #checkoutHeader { background: #FAFAFA; position: absolute; left: 0; padding: 15px; } */
	#checkoutHeader h4 { padding:0; text-align:center; margin:0; font-size:1.4em; }
	
	#order-items, div#total-price { width:100%;}
	.hcartBottom {padding:0;}
	div#total-price {padding:0; background:none;}
	#chkout { padding:0;}
	div#failure, div#success { margin-top:10px !important;font-size:0.9em;}
	
}
@media screen and (max-width:600px) {
	#shippingSelector { float:left; position:relative; }
	/* .hItemTitle { font-size:0.80em; } */
	#signin, #ppexpress-wrap { display:block;  width:100%; padding:0; margin:0 auto 0 auto; }
	#signin { margin-top:20px; }
	#kasse { line-height:46px;}
}
@media screen and (max-width:450px) {	
	
	.hItemThumb img { max-width:80px; max-height:80px; }
	.hItemTitle { width: calc( 100% - 90px);  padding-bottom:20px; }
	.hPriceContainer { top:5px; position:relative;float:left; width:100%; }
	div.artprice, .artsumme { width:50%;}
	
	.artprice .strike { float:left; width:100%; }
	.artprice, .artsumme { font-size:0.90em; padding:0; }
	
	#voucher { text-align:center; }
	#voucher input		{ clear:both; float:none; width:80%; min-width:250px; margin:0 auto 0 auto; box-sizing:border-box; border-radius:5px;}
	#voucher input#sbmVoucher { clear:both; float:none; margin-top:5px; border-radius:5px; }
	.qntwrapper { width:116px; }
	td.sum-total-td, d.sums-small-td { width:50%; }	
	
	div.delete { float:left;}
	
}