
body {
	/*font-size: 62.5%;*/
    line-height: 150%;
    font-family: 'Noto Sans',sans-serif;
    color: #444;
}
* {
    box-sizing: border-box;
}
img {
    max-width: 100%;
    height: auto;
}
a {
	text-decoration: none;
}
.row:after {
    content: "";
    clear: both;
    display: block;
}
[class*="col-"] {
    float: left;
    padding: 5px;
    width: 100%;
}
/*
.button {
    background-color: #262262; 
    border: none;
    color: white;
    padding: 8px 30px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 12px;
    margin: 4px 2px;
    -webkit-transition-duration: 0.4s; 
    transition-duration: 0.4s;
    cursor: pointer;
}
.button:hover {
    background-color: #413c7c; 
}
*/
.button-green {
	background-color: #4CAF50; /* Green */
    border: none;
    color: white;
}
.button-red {
    background-color: white; 
    color: black; 
    border: 2px solid #f44336;
}

.button-red:hover {
    background-color: #f44336;
    color: white;
}
.button-wide {
	width: 100%;
}
.button-full {
	width: 100%;
}
.right-align {
	text-align: right;
}
.nav .button {
    margin: 0;
}
.checkouttitlebar,
.myaccounttitlebar {
	background-color: #e1e1e1;
	overflow:hidden;
	text-align: left;
	font-weight: bold;
	padding: 5px 0px 5px 5px;
	margin: 0 0 10px 0;
}
.checkoutcrumb img {
	margin:10px 10px 10px 0;
}
.checkoutcrumb {
	background-color: #e1e1e1; /*#f2f2f2;*/
	padding: 0;
	
	border-top-right-radius: 25px;
	border-bottom-right-radius: 25px;
	
}
.checkoutactive {
	background: #4CAF50;
	color: #ffffff;
	/*border-right: 1px solid #000000;*/
	border-top-right-radius: 25px;
	border-bottom-right-radius: 25px;
}
.checkoutinactive {
	display: none;
}

.checkoutform {
	padding: 0px 0 10px 0px;
	background: #f2f2f2;
}
.checkoutform div {
	padding: 5px 5px 5px 5px;
}
.checkoutform label {
	width: 100%;
	float: left;
}
/*** for new checkout design **/
.checkout-form-section {
    float: right;
    width: 100%;
    padding: 0px;
    line-height: 1.5em;
    border-bottom: 1px solid #262262;
    /*box-shadow:  0px 3px 5px #888888;*/
}
.checkout-cart-section {
    float: right;
    width: 100%;
    padding: 0px;
    margin-bottom: 5px;
    line-height: 1.5em;
}

.checkout-section {
   
}
.checkout-header {
    border: 1px solid #f5f5f5;
    background-color: #aaaaaa;
    color: #ffffff;
    padding: 15px;
    /*font-weight: bold;*/
}
.active .checkout-header {
    border: 1px solid var(--primary-color, #0060aa);
    background: var(--primary-color, #0060aa);
    color: #ffffff;
}

.complete .checkout-header {
   /* border: 1px solid #4CAF50;*/
    background: #4CAF50;
    color: #ffffff;
}
.checkout-content {
    /*border-left: 1px solid #e1e1e1;
    border-right: 1px solid #e1e1e1;*/
    background-color: #f5f5f5;
    padding: 25px;
}
.checkout-cart-section .checkout-content {
    border-bottom:  1px solid #e1e1e1;
}
.form-box {
    padding: 25px 15px;
    background-color: #ffffff;
    border: 1px solid #e1e1e1;
}

#payment-form input {
    width: 100%;
}
.form-spacer {
    display: none;
}
.form-row {
    margin-top: 1em;
}
input.input-valid {
    border-color: #4CAF50;
}
input.input-error {
    border-color: red;
}
.error-block {
    color: red;
    text-align: center;
}
.hide {
    display:none;
}
.right {
    float: right;
}
.align-right {
    text-align: right;
}
i:hover,
span.icon {
    cursor:pointer;
}
.co-valid {
    border: 1px solid #4CAF50;
}
.center {
	text-align: center;
}
.important {
	border: 1px solid red;
}
.product-row:not(:last-child) {
    border-bottom: 1px solid #000000;
}
.product-col:not(:last-child) {
    border-right: 1px solid #000000;
}
a.product-col,
a.product-col:hover,
a.product-col:visited {
    text-decoration: none;
    color: #000000;
}
a.material-icons {
    color: #ffffff;
}
div.center label {
	text-align: right;
}
/*********** cart ***********/
.cart-info table{width: 100%; margin-bottom:30px; border-collapse: collapse; border-top: 1px solid #DDDDDD;}
.cart-info td { padding: 7px; }
.cart-info thead td { color: #000; padding:10px 7px; text-transform:uppercase; background-color: #F7F7F7; border-bottom: 1px solid #DDDDDD; }
.cart-info thead .image {text-align:center;}
.cart-info thead .name, .cart-info thead .model, .cart-info thead .quantity { text-align: left; }
.cart-info thead .price, .cart-info thead .total { text-align: right; }
.cart-info tbody td {border-bottom: 1px solid #DDDDDD; background-color:#ffffff;}
.cart-info tbody .image {text-align:center;}
.cart-info tbody .name, .cart-info tbody .model, .cart-info tbody .quantity { text-align: left; }
.cart-info tbody .quantity input[type='image'], .cart-info tbody .quantity img { position: relative; top: 4px; cursor: pointer; }
.cart-info tbody .quantity {min-width: 110px;}
.cart-info tbody .price, .cart-info tbody .total { text-align: right; }
.cart-info tbody span.stock { color: #F00; font-weight: bold; }
.cart-module > div { display: none; }
.cart-total { border-top: 1px solid #DDDDDD; overflow: auto; padding-top: 8px; margin-bottom: 15px; }
.cart-total table { float: right; }
.cart-total td { padding: 3px; text-align:right; }

.cart-info thead .image, .cart-info thead .name, .cart-info tbody .name, .cart-info thead .price, .cart-info tbody .price,.cart-info tbody .image {display:none;}


@media only screen and (min-width: 600px) {
    .col-s-1 {width: 8.33%;}
    .col-s-2 {width: 16.66%;}
    .col-s-3 {width: 25%;}
    .col-s-4 {width: 33.33%;}
    .col-s-5 {width: 41.66%;}
    .col-s-6 {width: 50%;}
    .col-s-7 {width: 58.33%;}
    .col-s-8 {width: 66.66%;}
    .col-s-9 {width: 75%;}
    .col-s-10 {width: 83.33%;}
    .col-s-11 {width: 91.66%;}
    .col-s-12 {width: 100%;}
    
    .checkoutinactive {
		display: block;
	}
	.checkoutform label {
		width: 40%;
	}
	
	.button-wide {
		width: 50%;
	}

}
@media only screen and (min-width: 768px) {
    .col-1 {width: 8.33%;}
    .col-2 {width: 16.66%;}
    .col-3 {width: 25%;}
    .col-4 {width: 33.33%;}
    .col-5 {width: 41.66%;}
    .col-6 {width: 50%;}
    .col-7 {width: 58.33%;}
    .col-8 {width: 66.66%;}
    .col-9 {width: 75%;}
    .col-10 {width: 83.33%;}
    .col-11 {width: 91.66%;}
    .col-12 {width: 100%;}
    
    .cart-info thead .image, .cart-info thead .name, .cart-info tbody .name, .cart-info thead .price, .cart-info tbody .price,.cart-info tbody .image { display:table-cell; }
    
    /*** for new checkout design **/
    .checkout-form-section {
        width: 58.33%;
    }
    .checkout-cart-section {
        width: 41.66%;
        padding-left: 5px;
        margin-bottom: 0px;
    }
    .form-spacer {
        display: block;
        width: 8.33%;
        float: left;
    }
}