/*  ------ PAG THANK ------------  */

.pagThank, .pagTraker {background-image: url(../static/banners/background_slider.jpg);background-color: transparent;}
.pagThank .modThankyou,
.pagTraker .modTraker{background:#fff;padding:20px 0 12px 0;}
.pagThank h1, .pagTraker h1{padding: 14px 0  12px 0;font-family:'SharpSansBold';font-size: 24px;font-weight: bold;font-stretch: normal;font-style: normal;line-height: normal;letter-spacing: normal;color: #231f20;text-align:center;}

.pagThank .modThankyou .modBannerThankyou {margin-bottom:20px;}
.pagThank .modThankyou .modBannerThankyou img{min-height:150px;height:auto;background:#fed03b;margin:0;}

    .pagThank .modThankyou .modOrderProducts,
    .pagThank .modThankyou .modOrderData{text-align:left;}

    .pagThank .modThankyou .modOrderProducts h2{font-family: 'SharpSansSemiBold';font-size: 16px;font-stretch: normal;font-style: normal;line-height: normal;letter-spacing: normal;padding: 17.5px 24px 18px 24px;border-bottom: 1px solid #e9ebee;cursor: pointer;}
    .pagThank .modThankyou .modOrderProducts h2 span:first-of-type{background: url(../static/ico/expandMore.svg) no-repeat 0 0 / 15px 15px;width: 16px;top: 3px;height: 16px;cursor: pointer;position: relative;display: inline-block;margin-left:15px;}
    .pagThank .modThankyou .modOrderProducts h2.touch span:first-of-type{   background: url(../static/ico/expandLess.svg) no-repeat 0 0 / 15px 15px;}


    .pagThank .modThankyou .modOrderProducts h2 span:first-of-type + span {font-weight: bold;float: right;text-align: right;min-width:70px;font-size:15px;padding-left:3px;position: relative;top: -12px;}
    .pagThank .modThankyou .modOrderProducts h2 span:first-of-type + span + span {color: #c8102e;text-decoration: line-through;float: right;text-align: right;font-size:15px;position: relative;top: -7px;}
    
    .pagThank .modThankyou .modOrderProducts h2 + ul,
    .pagThank .modThankyou .modOrderProducts h2 + ul + p,
    .pagThank .modThankyou .modOrderProducts h2 + ul + p + p{display:none;}

    .pagThank .modThankyou .modOrderProducts {width: 100%;background-color: #f5f7f9;}
    .pagThank .modThankyou .modOrderProducts > p:first-of-type {border-bottom: 1px solid #e9ebee;padding: 16px 24px 15.5px 24px;font-family: 'SharpSansBold';font-size: 18px;font-weight: bold;font-stretch: normal;font-style: normal;line-height: normal;letter-spacing: normal;color: #231f20;}  
    .pagThank .modThankyou .modOrderProducts li {padding: 20px 24px 0px 24px;display:inline-block;width:100%;}
    .pagThank .modThankyou .modOrderProducts li:last-of-type {padding:20px 24px 20px 24px;}
    .pagThank .modThankyou .modOrderProducts li p:first-of-type {font-family: 'SharpSansSemiBold';font-size: 16px;font-weight: 600;font-stretch: normal;font-style: normal;line-height: normal;letter-spacing: -0.15px;color: #231f20;float:left;width:60%;}
    .pagThank .modThankyou .modOrderProducts li p:first-of-type + p {font-size: 15px;font-weight: normal;font-stretch: normal;font-style: normal;line-height: normal;letter-spacing: -0.14px;text-align: right;color: #231f20;float:right;width:30%;}
    .pagThank .modThankyou .modOrderProducts li p:first-of-type + p + p {font-size: 13px;font-stretch: normal;font-style: normal;line-height: 1.46;letter-spacing: normal;color: #6b6e79;display:inline-block;width:100%;padding-top:4px;}

    .pagThank .modThankyou .modOrderProducts .prodTotal{border-top:1px solid  #e9ebee;padding:17px 24px 16.5px 24px;}
    .pagThank .modThankyou .modOrderProducts .prodTotal span{font-size: 15px;font-weight: 600;font-stretch: normal;font-style: normal;line-height: normal;letter-spacing: -0.14px;color: #231f20;}
    .pagThank .modThankyou .modOrderProducts .prodTotal span:first-of-type + span{font-weight: bold;float:right;min-width:70px;text-align:right;}
    .pagThank .modThankyou .modOrderProducts .prodTotal span:first-of-type + span + span {color: #c8102e;text-decoration: line-through;float:right;min-width:70px;text-align:right;}
    .pagThank .modThankyou .modOrderProducts .prodTotal + p {padding-right:24px;position:relative;top:-11px;font-size: 12px;font-weight: 600;font-stretch: normal;font-style: normal;line-height: 1.75;letter-spacing: normal;color: #6b6e79;text-align:right;}

    .modOrderData .modDatosEntrega{display:none;}

    .pagThank .modThankyou .modOrderData {width:100%;}
    
    .pagThank .modThankyou .modOrderData > div ,
        .modDatosEntrega{border-bottom:1px solid #e9ebee;}

    .pagThank .modThankyou .modOrderData > div > div ,
        .modDatosEntrega > div {padding:0px 0 20px 0;}

    .pagThank .modThankyou .modOrderData > div > p:first-of-type,
    .modDatosEntrega > p:first-of-type{padding:32px 24px 16px 24px;font-family: 'SharpSansBold';font-size: 18px;font-weight: bold;font-stretch: normal;font-style: normal;line-height: normal;letter-spacing: normal;color: #231f20;}
    .modDatosEntrega > p:first-of-type{padding:20px 24px 16px 24px;}
    .pagThank .modThankyou .modOrderData > div > p:first-of-type + p{font-size: 14px;font-weight: normal;font-stretch: normal;font-style: normal;line-height: 1.5;letter-spacing: normal;color: #231f20;padding:12px 0 16px 56px;}

    .pagThank .modThankyou .modOrderData > div > div li, 
    .modDatosEntrega li {padding: 11px 20px 11px 56px;font-size: 13px;font-weight: normal;font-stretch: normal;font-style: normal;line-height: normal;letter-spacing: normal;color: #231f20;}
    .pagThank .modThankyou .modOrderData > div > div li span, 
    .modDatosEntrega li span {font-weight: bold;}

    .modDatosEntrega > div li.searchLi, 
    .modDatosEntrega li.searchLi{padding-bottom:0!important;padding-left:27px!important;background:none!important;}
    .modDatosEntrega > div li a{position:relative;font-size: 14px;font-weight: normal;font-stretch: normal;font-style: normal;line-height: 1.5;letter-spacing: normal;color: #231f20;}
    .modDatosEntrega > div li a:after{content:"";position:absolute;bottom:-1px;left:0;width:100%;border-bottom:1px solid #dfdfe3}
    .modDatosEntrega > div li a:hover:after {content: '';left: 0;bottom: -2px;width: 100%;border-bottom: 1px solid #231F20 !important;}



    .modDatosEntrega > div li:nth-child(1){background: transparent url(../static/ico/icon-tlinepin_h.svg) no-repeat 27px center;background-size:17px;padding-top:8px;}
    .modDatosEntrega > div li:nth-child(2){background: transparent url(../static/ico/icon-clock_h.svg) no-repeat 27px center;background-size:17px;}
    .modDatosEntrega > div li:nth-child(3){background: transparent url(../static/ico/icon-email_h.svg) no-repeat 27px calc(100% - 10px);background-size:18px;}

    .pagThank .modThankyou .modOrderData > div.modAyuda > div{padding:0;}
    .pagThank .modThankyou .modOrderData > div.modAyuda > div li{background: transparent url(../static/ico/icon-info_h.svg) no-repeat 27px 13px;background-size:16px;padding: 12px 20px 8px 56px;font-size:14px;}
    .pagThank .modThankyou .modOrderData > div.modAyuda > div ul{padding-bottom:8px}


    .modEnlaces {border-top: 1px solid #e9ebee;padding-top: 12px;display: inline-block;width:calc(100% + 48px);left:-24px;margin: 48px auto 60px auto;text-align: center;justify-content: center;position: relative;}

    .modEnlaces ul {display: table;margin: 0 auto;text-align: center;}
    .modEnlaces li {text-align: center;padding:0 12px 16px 12px;display: inline-table;vertical-align: middle;}
    .modEnlaces li + li{margin-left:0px;}
    .modEnlaces li a{font-size: 14px;font-weight: normal;font-stretch: normal;font-style: normal;line-height: normal;letter-spacing: normal;color: #231f20;}

/* metodos pago */
    .pago_1 {background: url(../static/ico/coinp.svg) 20px center no-repeat; background-size: 24px;}
     html:lang(es-ES) .pago_1 {background: url(../static/ico/coin.svg) 20px center no-repeat; background-size: 24px; }
    .pago_32        {background:  url(../static/ico/card.svg) 24px center no-repeat;}
    .pago_20        {background:  url(../static/ico/paypal.svg) 24px center no-repeat;padding-left:95px!important;}
    .pago_dataphone {background:  url(../static/ico/tpv.svg) 24px center no-repeat transparent;}


/*  ------ TRAKEEEEEER ------------  */
    .pagTraker .modTraker {margin: 0 auto;text-align: center;padding: 24px 26px 31px 26px;}
    .modTraker > p{margin:0 auto;margin-bottom:16px;text-align:center;max-width:400px;font-weight: normal;font-size: 13px;font-stretch: normal;font-style: normal;line-height: normal;letter-spacing: normal;text-align: center;color: #231f20;}
    .modTraker > p.first{max-width:inherit;width:100%;}
    .modTraker > p span{ font-weight: bold; }
    
    .mod_order_tracker{padding-top: 32px;}

    .mod_order_tracker dl {position: relative;min-height: 200px;max-width: 805px;margin: 0;text-align:left;}
    .mod_order_tracker dl {background:none;position:relative;min-height: 200px;max-width: 805px;margin:0;text-align:left;width:100%;}
    .mod_order_tracker dl:after{content:"";position:absolute;left:0;width:5px;height:90%;background-color: #dfdfe3;top:7px;left:7px;}

    .mod_order_tracker .received {left: 0px;}

    .mod_order_tracker dt, .mod_order_tracker dt.active, 
    .mod_order_tracker dd, .mod_order_tracker dd.active {-moz-transition: opacity .5s;-webkit-transition: opacity .5s;-o-transition: opacity .5s;transition: opacity .5s;position:relative;}

    .mod_order_tracker dt,
    .mod_order_tracker dt.active{margin: 0;padding-top:0;font-size: 14px;font-weight: 600;font-stretch: normal;font-style: normal;line-height: normal;letter-spacing: -0.13px;color: #231f20;height: 79px;top: 0;width:100%;text-align:left;}
    .mod_order_tracker dt span {width:100%;display:inline-block;padding-left:96px}
    .mod_order_tracker dt span + span{font-size: 12px;font-weight: 400;letter-spacing:0;line-height:21px;padding-top:2px;}

    .mod_order_tracker dt.received,
    .mod_order_tracker dt.received.active{background: url(../static/ico/received.svg) no-repeat 40px top / 32px 32px;left:0;}

    .mod_order_tracker dt.cooking,
    .mod_order_tracker dt.cooking.active {background: url(../static/ico/cooking.svg)  no-repeat 40px top / 32px  32px;left:0;}

    .mod_order_tracker dt.shipping,
    .mod_order_tracker dt.shipping.active{background: url(../static/ico/shipping.svg) no-repeat 40px top / 40px 32px;left:0;}

    .mod_order_tracker dt.enjoy,    
    .mod_order_tracker dt.enjoy.active   {background: url(../static/ico/enjoy.svg)    no-repeat 40px top / 38px  32px;left:0;height:auto;}
    .mod_order_tracker dt.active:before       {content: "";position: absolute;width:4px;height:90%;background-color: #c8102e;z-index: 1;top:-63px;left:7px;}
    .mod_order_tracker dt.enjoy.active:before {height:70px;}


    .mod_order_tracker dt:after ,       
    .mod_order_tracker dt.active:after {content:"";position:absolute;width:9px;height:9px;background: none;left:5px;z-index: 2;top:13px;background-image: none;background: #fff;border-radius: 50%; box-shadow: 0 0 0 6px #c8102e;}
    .mod_order_tracker dt:after{box-shadow: 0 0 0 7px #dfdfe3;}
    .mod_order_tracker dt.received.active:before{display:none;}

    .modEnlaces li.alergeno {display:none;}

    html:lang(es-ES) .modEnlaces li.alergeno {display:inline-table;}


@media (min-width: 374px) {
    .pagThank .modThankyou .modOrderProducts h2 span:first-of-type + span {top: 0px;}
    .pagThank .modThankyou .modOrderProducts h2 span:first-of-type + span + span {top: 0px;}

}



@media (max-width: 767px) {
    .mod_order_tracker dt,
    .mod_order_tracker dt.active{margin: 0;left:0!important;display:block;}
}

 

@media (min-width: 768px) {

    .pagTraker .modTraker {box-shadow: 0 16px 20px 0 rgba(0, 0, 0, 0.2);margin: 0 auto 40px auto;padding: 20px 46px 0 46px;display: inline-block;}
    .mod_order_tracker{padding-top: 80px;}
    .mod_order_tracker dl {background:none;position:relative;}
    .mod_order_tracker dl:after{content:"";position:absolute;left:0;width:100%;height:8px;background-color: #dfdfe3;bottom:40px;top:auto;}

    .mod_order_tracker dl {position: relative;min-height: 200px;max-width: 805px;margin: 0 auto;width:91%;}
    .mod_order_tracker .received {left: 0px;}

    .mod_order_tracker dt, .mod_order_tracker dt.active, 
    .mod_order_tracker dd, .mod_order_tracker dd.active {-moz-transition: opacity .5s;-webkit-transition: opacity .5s;-o-transition: opacity .5s;transition: opacity .5s;position:relative;}
    
    .mod_order_tracker dt,
    .mod_order_tracker dt.active{padding-top:104px;font-size: 14px;font-weight: 600;font-stretch: normal;font-style: normal;line-height: normal;letter-spacing: -0.13px;color: #231f20;height: 79px;top: 0;text-align:center;}

    .mod_order_tracker dt span{width:auto;padding:0;}
    .mod_order_tracker dt span + span{display:none;}

    .mod_order_tracker dd,.mod_order_tracker dt,
    .mod_order_tracker dt.active{width: 138px;display: block;position: absolute;margin-left: -60px;}

    .mod_order_tracker dt:after ,       
    .mod_order_tracker dt.active:after {content:"";position:absolute;width:15px;height:15px;background: none;left: 55px;bottom: -59px;z-index: 2;top: auto;background-image: none;background: #fff;border-radius: 50%; box-shadow: 0 0 0 7px #c8102e;}
    .mod_order_tracker dt:after{box-shadow: 0 0 0 7px #dfdfe3;}

    .mod_order_tracker dt.active:before {content: "";position: absolute;width:150%;height: 8px;background-color: #c8102e;z-index: 1;bottom: -56px;left: -131px;top:auto;}

    .mod_order_tracker dt.received,
    .mod_order_tracker dt.received.active{background: url(../static/ico/received.svg) no-repeat top center / 80px 78px;left:0%}

    .mod_order_tracker dt.cooking,
    .mod_order_tracker dt.cooking.active {background: url(../static/ico/cooking.svg)  no-repeat top center / 80px  80px;left: 33.333%;}

    .mod_order_tracker dt.shipping,
    .mod_order_tracker dt.shipping.active{background: url(../static/ico/shipping.svg) no-repeat top center / 100px 78px;left: 66.666%;}

    .mod_order_tracker dt.enjoy,    
    .mod_order_tracker dt.enjoy.active   {background: url(../static/ico/enjoy.svg)    no-repeat top center / 95px  79px;left: 100%;    height: 79px;}
   
    .mod_order_tracker dt.enjoy.active:before {height: 8px;}

    .pagTraker .modTraker {padding-top: 44px;padding-bottom: 20px;}
    .pagTraker .modTraker p{margin-bottom:16px;}


}
@media (min-width: 770px) {

    .pagThank .modThankyou,
    .pagTraker .modTraker {box-shadow: 0 16px 20px 0 rgba(0, 0, 0, 0.2);margin: 0 auto 40px auto;padding: 20px 46px 0 46px;display: inline-block;}

    .pagThank .modThankyou .modDatosEntrega {display:none}

     .layout {margin: 0 auto;text-align: center;display:inline-block;width:100%}
    .pagThank h1{padding: 22px 0 15px 0;}
    
    .pagThank .modThankyou .modOrderProducts h2{display:none;}
    .pagThank .modThankyou > img{width:100%;min-height:150px;height:auto;background:#fed03b;margin:0 0 20px 0;}

    .modOrderData .modDatosEntrega{display:block!important;}

    .pagThank .modThankyou .modOrderData > div > div {padding:20px 0px;}

    .pagThank .modThankyou .modOrderProducts h2 + ul,
    .pagThank .modThankyou .modOrderProducts h2 + ul + p,
    .pagThank .modThankyou .modOrderProducts h2 + ul + p + p{display: block!important;}

    .pagThank .modThankyou .modOrderProducts {border-radius: 5px;border: 1px solid  #e9ebee;width:49%;float:left}
    .pagThank .modThankyou .modOrderData {width:49%;float:right;}

    .modDatosEntrega li.searchLi{padding-left:24px!important;}

    .pagThank .modThankyou .modOrderData > div > p:first-of-type{padding:16px 24px;}
    .pagThank .modThankyou .modOrderData > div {border-radius: 5px;border: solid 1px #e9ebee;margin-bottom: 20px;}
    .pagThank .modThankyou .modOrderData > div > p:first-of-type{border-bottom:solid 1px #e9ebee;}
    .pagThank .modThankyou .modOrderProducts > p:first-of-type {padding: 18px 24px 18px 60px;background: transparent url(../static/ico/basket_h.svg) no-repeat 21px center;background-size:24px;}
    .pagThank .modThankyou .modOrderProducts .prodTotal + p{padding-bottom:0;}

    .modEnlaces {display:inline-block;width:100%;margin:60px auto 60px auto;text-align:center;border-top:1px solid #e9ebee;padding-top:15px;left:0;}
    /*.modEnlaces ul {width:auto;display:inline-block;}*/

    .pagTraker .modTraker {padding-top: 44px;padding-bottom: 20px;}
    .pagTraker .modTraker p{margin-bottom:16px;}

    
    .modEnlaces {width:100%;left:0px;}
    .modEnlaces li {padding: 0 21px 16px 21px;}
} 

@media (min-width: 964px) {

    .mod_order_tracker dt.active:before {width: 190%;left: -190px;}
    
}
