/*css für den Shop, CompuSense Rodeck Berger GbR, info@compusense.de*/

.red {color:var(--color-brand-primary)}

.product_list {display: flex; flex-wrap: wrap; justify-content: space-between;row-gap: 55px;}
h3.produkt, h2.produkt  {font-family: TemplateGothicBold;}
.produktteaser {color: #E30613; float: left}
.details a {text-decoration: none}
.product_list .formbody {border: 1px solid #dcdcdc;width: 91%;padding: 5% 5% 5% 5%; border-radius: 3%;}
.clear {clear: both;}
.mod_iso_productlist .clear { margin: 100px;}
.offer {float: right}
.details {float: left; width: 27%;}
.submit_container {width: 57%; padding: 0 0 0 10%; float: right; text-align: right}
.product_list .submit_container {display: flex; float: none;justify-content: flex-end; width: 73%}

.m-article.marginO {margin-top: 0}
.m-article.margin2 {margin-top: 2rem;}

.submit_container .o-button-primary {margin-right: 0}
.quantity_container {max-width: 59px;float: left;margin-right: 8px}

.price{font-size: 2em;line-height: 0.5; font-weight: 600; text-align: right}
.zusatz {font-size: 0.3em;}

.rot {color: #E30613; }
.margin0 {margin: 0}
.description {margin-top: 50px;}
.detail.offer{margin-top: -30px;}

.mod_iso_productreader .quantity_container {max-width: unset}
.mod_iso_productreader .quantity_container label {float: left; width: 63px; padding: 10px}
.mod_iso_productreader .quantity_container input{float: left; width: 100px;margin-left: 23px;}
.mod_iso_productreader .submit_container {justify-content: right; margin-top: 50px;display: flex;width: 100%;}
.mod_iso_productreader .options {border-top: 1px solid var(--color-global-brdr); margin-top: 35px;}
.mod_iso_productreader .options .widget {padding: 14px 0 0 0;}
.mod_iso_productreader .options legend {display: none;}

.mod_iso_checkout .steps li {float: left; margin-right: 50px}
.mod_iso_checkout .steps li:before, .mod_iso_checkout .steps li a {color: #48504c;}
.mod_iso_checkout form {clear: both}
.mod_iso_checkout .steps li.active, .mod_iso_checkout .steps li.active:before {color:#E30613 }

.mod_iso_checkout .address  {margin-bottom: 50px;}

.orderconditions .widget-checkbox {padding-left: 0; }
.orderconditions {margin: 50px 0}
.orderconditions.last {margin: 0; width: 30%; float: left}
.orderconditions.last div {padding: 0}

.o-button-primary a, .o-button-primary--small a{color: #fff; text-decoration: none}

/*warenkorb und kasse*/
.mod_iso_cart, .mod_iso_checkout .orderproducts {background: #eee;}
.mod_iso_cart table, .mod_iso_checkout  table{width: 100%; display: block; margin-bottom: 30px;}
.mod_iso_cart table tbody, .mod_iso_cart table tfoot, .mod_iso_checkout table tbody,.mod_iso_checkout table tfoot {width: 98%;display: block;padding-top: 5px;}
.mod_iso_cart tr.product,  .mod_iso_checkout  tr.product{background: #fff;box-shadow: 10px 5px 5px #ddd;display: block;padding: 10px;margin: 10px;width: 100%;}
.mod_iso_cart td,  .mod_iso_checkout td{padding: 10px}
.mod_iso_cart td.image, .mod_iso_checkout td.image  {max-width: 200px}
.mod_iso_cart td.name{vertical-align: top;width: 57%;}
.mod_iso_checkout td.name{vertical-align: top;width: 62%;}
.mod_iso_cart td.name a, .mod_iso_checkout .product td.name {font-weight: bold;text-decoration: none;}
.mod_iso_checkout .product td.name {color:#E30613}
.mod_iso_cart td.name .sku, .mod_iso_checkout  td.name .sku{color: #666; font-size: 85%}
.mod_iso_cart td.actions, .mod_iso_cart td.quantity{  min-width: 56px;}
.mod_iso_cart td.actions img , .mod_iso_checkout td.actions img{width: 35px;}
.mod_iso_cart td.quantity, .mod_iso_checkout td.quantity {width: 100px}
.mod_iso_cart td.quantity input, .mod_iso_checkout td.quantity input {color:#E30613 }
.mod_iso_cart td.image img {min-width: 63px;}
.mod_iso_cart .price, .mod_iso_checkout .price{font-size: 1em;line-height: 1.5; font-weight: 300; text-align: right; width: 13%; min-width: 100px;}
.mod_iso_cart .price .gesamtpreis, .mod_iso_checkout .gesamtpreis{color:#E30613;font-size: 140%; font-weight: bolder}
.mod_iso_cart .price .stueckpreis, .mod_iso_checkout .stueckpreis {color:#666;font-size: 85%}

.mod_iso_cart .foot_0, .mod_iso_cart .foot_1, .mod_iso_checkout .subtotal {display: none}
.mod_iso_cart .foot_2 .col_first, .mod_iso_checkout tfoot .col_first {width: 50%}
.mod_iso_cart .foot_2 .name, .mod_iso_checkout tfoot .name {text-align: right}
.mod_iso_cart .foot_2 .price, .mod_iso_checkout tfoot .total .price {color:#E30613;font-size: 140%; font-weight: bolder}

.mod_iso_cart .submit_container {width: 100%;padding: 0;}
.mod_iso_cart .submit_container .button_update, .mod_iso_cart .submit_container .continue {float: left; margin-left: 10px} 


/* Nur kasse*/
.address .widget {margin-bottom: 10px}
.o-fieldExplanation, .note {color: #666; font-size: 85%}
.mod_iso_checkout .widget-radio {padding: 0}
.shipping.orderconditions.last {margin: 50px 0 0 0; float:none; clear:both}
.mod_iso_checkout .o-fieldRadio__item {align-items: flex-start;}
.mod_iso_checkout .o-fieldRadio__item .radio {margin-top: 3px;}

.mod_iso_checkout .review .info_container {display: flex; padding: 50px 0 0 0;align-items: flex-end;}
.mod_iso_checkout .left, .mod_iso_checkout .right {width: 50%; }
 .mod_iso_checkout .right {margin: 0 0 10px 0;text-align: right;}
.mod_iso_checkout a {text-decoration:none}

/*responsive*/

@media  (max-width: 812px) {
    .mod_iso_productreader .col-9  {flex: 0 0 100%;max-width: 100%;} 
    .orderconditions.last {width: 100%}
    
     #korb .name a, #korb .image figure a , .orderproducts  .name a,  .orderproducts .image figure a {  pointer-events: none;cursor: default; text-decoration: none}

        #korb  table,  #korb tbody,  #korb th, #korb td,   #korb tr ,.orderproducts table, .orderproducts tbody,  .orderproducts th, .orderproducts td,   .orderproducts tr {display: block;}
        #korb th,  .orderproducts th { display: none}
        tr { border-bottom: 1px solid #E30613; }
        td  {border: none;position: relative;padding-left: 200px;margin-left: 150px; }
         #korb td:before, .orderproducts td:before {position: absolute;top: 12px;left: 6px;width: 200px;padding-right: 40px;white-space: nowrap;margin-left: -150px; }
        #korb td:nth-of-type(1):before, .orderproducts td:nth-of-type(1):before { content: "Produkt"; }
        #korb td:nth-of-type(2):before, .orderproducts td:nth-of-type(2):before  { content: "Produktname"; }
        #korb td:nth-of-type(3):before, .orderproducts td:nth-of-type(3):before  { content: "Anzahl."; }
        #korb td:nth-of-type(4):before, .orderproducts td:nth-of-type(4):before  { content: "";}
        #korb td:nth-of-type(5):before, .orderproducts td:nth-of-type(5):before  { content: "Einzelpreis";} 
        #korb td:nth-of-type(6):before, .orderproducts td:nth-of-type(6):before  { content: "Summe";}
        #korb .price, #korb .remove, .orderproducts .price, .orderproducts .total {text-align: left;}
        table tfoot td {background-color: #fff}
        .foot_last  {border-bottom: none}
        .foot_last  .total, .foot_last  .name {font-weight: 900}
        #korb .name, .orderproducts .name {width: auto}
        #korb .remove, .orderproducts .remove {    font-size:1em}
        #korb .quantity input ,.orderproducts .quantity input  {    height: 5px;margin: 0;}

    .mod_iso_cart, .mod_iso_checkout .orderproducts {background: #fff}
    .mod_iso_cart tr.product, .mod_iso_checkout tr.product {box-shadow: none}

        .subtotal ::before,.foot_2 ::before,.foot_1 ::before,.foot_3 ::before,.submit_container ::before{display: none}
        .submit_container::before{display: none}

        .subtotal .col_1, .subtotal .col_4{margin: 0;text-align: right !important;width: 100% !important;}
        .foot_1 .col_1, .foot_1 .col_4 {margin: 0;text-align: right !important;width: 100% !important;}
        .foot_2 .col_1, .foot_2 .col_4 {margin: 0;text-align: right !important;width: 100% !important;}
     .foot_3 .col_1, .foot_3 .col_4 {margin: 0;text-align: right !important;width: 100% !important;}
    
        .subtotal .col_0, .subtotal .col_3, .subtotal .col_5{display: none !important}
        .foot_1 .col_0, .foot_1 .col_3, .foot_1 .col_5 {display: none !important}
        .foot_2 .col_0, .foot_2 .col_3, .foot_2 .col_5{display: none !important}
    .foot_3 .col_0, .foot_3 .col_3, .foot_3 .col_5{display: none !important}

    
    }

@media  (max-width: 767px) {
    .mod_iso_productreader .col-9  {flex: 0 0 100%;max-width: 100%;} 
}
@media  (max-width: 698px) {
        .mod_iso_checkout .steps li {width: 100%}
    .mod_iso_checkout .steps li.address {margin-bottom: 1rem; float: none;}
    .mod_iso_checkout .steps .review   {margin-bottom: 50px}
}

@media  (max-width: 636px) {
        .details {width: 33%}
    .product_list .submit_container {width: 67%;}
    }
@media  (max-width: 575px) {
    .mod_iso_productreader .offer {width: 100%;float: none;margin: 30px 0 auto;} 
    .mod_iso_productreader .submit_container {display: block; padding: 0}
    .mod_iso_productreader .quantity_container {padding: 0 0 5px 0}
        .submit_container .submit {margin:5px 0 5px 0}
    .mod_iso_productreader p.back {margin-top: 0}
    .mod_iso_cart .submit_container .button_update, .mod_iso_cart .submit_container .continue{margin:5px 0 5px 0}
    .product_list .submit_container, .details {width: 100%}
    #iso_ajaxBox {width:  53%; left: 24%;}
    .mod_iso_cart td.name {width: 40%;}
    .mod_iso_cart .price, .mod_iso_checkout .price {vertical-align:bottom ;}
    .product_list .formbody {width: 100%}
    .mod_iso_productlist .quantity_container {display: none}
    .product_list .submit_container {padding: 0}
    .mod_iso_checkout .submit_container {width: 100%; padding: 0; float: none; margin-top: 50px}
    .shipping.orderconditions.last {width: 100%;}
    
    
}
@media  (max-width: 460px) {
    .produktteaser {float: none; margin-bottom: 30px} 
    }