@font-face{
    font-family:Raleway;src:url(/fonts/Raleway.woff2) format("woff2");
    font-display:swap;
    font-style:normal;
    unicode-range:U+020-007F U+00A0-00F
}
@font-face{
    font-family:CerebriSans;src:url(/fonts/CerebriSans.woff2) format("woff2");
    font-display:swap;unicode-range:U+020-007F;
}
*{
    margin:0;padding:0;box-sizing:border-box;outline:0
}
input,select{
    font-family:Raleway,Helvetica,sans-serif!important;
    font-weight:500
}
html{
    -webkit-text-size-adjust:100%;
    -moz-tab-size:4;
    -o-tab-size:4;
    tab-size:4;
    font-family:Raleway,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";
}
body{
    --color-nutrisa: #ff6900;
    --color-lazy: #f8f8f8;
    padding:0;
    line-height:inherit;
    display:flex;
    flex-direction:column;
    gap:10px;
    line-height:1.6;
    letter-spacing:.04em;
}
.close-icon{
    width:18px
}
::-webkit-scrollbar{
    width:10px
}
::-webkit-scrollbar-track{
    box-shadow:inset 0 0 5px #ddd;
}
::-webkit-scrollbar-thumb{
    background:var(--color-nutrisa)
}
.box-inputs input,.box-input .input,.box-inputs select,.box-input .select{
    -moz-appearance:none;
    appearance:none;
    -webkit-appearance:none;
    border-radius:0;
    color:#707070;
    font-weight:500;
    border:1px solid #939393;
    background-color:#fff
}
dialog{
    position:relative;
    margin:15px auto!important;
    border:none;
    background:transparent
}
dialog::backdrop{
    background-color:#00000070
}
dialog header{
    text-align:right!important;
    display:flex;
    flex-direction:row;
    justify-content:flex-end
}
main{
    position: relative;
}
h1{
    position: relative;
    width: 90%;
    margin: auto;
}
#language{
    font-size: 14px;
    font-weight: normal;
    text-decoration: none;
    width: auto;
    display: inline-block;
    position: absolute;
    padding: 5px 25px 5px 25px;
    right: 0;
    top: 10px;
    margin: 0 !important;
    text-align: center;
    border-radius: 10px;
    color: white;
    border:white 2px solid;
    background-color: var(--color-nutrisa);
    z-index: 9999;
    text-decoration: none;
    font-size: 0.8rem;
  }
  #language:hover{
    border:#FFF 2px solid;
  }
  #language svg{
    margin-top: 5px !important;
    margin-right: 10px;
  }



swiper-container{
    width:100%;
    height:100%
}
swiper-slide{
    text-align:center;
    font-size:18px;
    background:#fff;
    display:flex;
    justify-content:center;
    align-items:center;
    height:fit-content
}
swiper-slide img{
    display:block;
    width:100%;
    height:auto;
    object-fit:contain
}
a.wapp-container{
    width:60px;
    margin-right:20px;
    right:0;
    bottom:0;
    position:fixed;
    margin-bottom:80px;
    transition:.3s all ease;
    cursor:pointer;z-index:999
}
.wapp-desk-img{
    display:none
}
.wapp-mobile-img{
    display:block;
    background-image:url(/img/wpp-icon-mob.webp);
    background-position:center;
    background-repeat:no-repeat;
    background-size:contain;
    height:60px;
    width:60px
}
@media (min-width:900px){
    .wapp-mobile-img{
        display:none
    }
    .wapp-desk-img{
        display:block;
        background-image:url(/img/wpp-icon-desk.webp);
        background-position:center;
        background-repeat:no-repeat;
        background-size:contain;
        height:50px;
        width:160px
    }
    a.wapp-container{
        width:160px;
        margin-right:30px
    }
}
img{
    position:relative
}
/*img:before{
    content:" ";
    display:block!important;
    position:absolute;
    height:100%!important;
    width:100%!important;
    background-size:cover;
    background-repeat:no-repeat!important;
    background-image:url(https://storage.googleapis.com/ghdz-nutri-ecom-dev/productos/ABEJA-A.webp)!important;
    -o-background-size:cover;
    -moz-background-size:cover;
    -webkit-background-size:cover
}*/

.open{
    display:flex
}
.box-header{
    width:100%;
    position:sticky;
    top:0;
    z-index:999;
    border-top:1px solid white
}
.header{
    background-color:#fff;
    display:grid;
    grid-template-columns:25px 1fr 90px;
    grid-template-rows:22px 35px;
    padding:20px 20px 10px;
    gap:20px
}
.header img{
    height:22px
}

@media (min-width: 1235px){
    .header{
        grid-template-columns:100%;
        grid-template-rows:1fr
    }
    .logo-container{
        display:flex;
        justify-content:center
    }
    .search-bar-icon{
        display:block
    }
    .header .options{
        display:flex;
        flex-direction:row
    }
    .logged-user{
        text-decoration:none;
        display:grid;
        grid-template-columns:22px 1fr;
        gap:8px
    }
    .logged-user span{
        display:block;
        font: 600 14px/16px Raleway;
        letter-spacing:0px;
        color:#707070;
        padding:3px 0 0
    }
    .cart-container{
        display:flex;
        flex-direction:row;
        gap:10px
    }
    .cart-label{
        display:block
    }
    .search-bar-container,.menu-button{
        display:none
    }
    .header>nav{
        position:relative;
        box-shadow:none;
        height:100%
    }
    .cart-info{
        display:flex
    }
    .cart-label{
        color:#707070;
        font-size:14px;
        font-weight:600
    }
    .cart-mount{
        color:#616161;
        font-size:14px;
        margin-left:11px;
        font-weight:700
    }
}

.nav{display:flex;flex-direction:column;grid-column:auto;z-index:999}.nav ul{width:100%;padding:0;margin:0;list-style:none;overflow:auto}.nav>div:first-child{display:flex;flex-direction:row;height:50px;background-color:var(--color-nutrisa);align-items:center;padding:10px;justify-content:space-between;align-content:center}.nav>div:first-child span{display:grid;place-items:center}.nav ul li.m-inicio,.nav ul li.m-all{padding:15px}.nav>div:first-child>img{height:23px}.nav ul li{border-bottom:1px solid #ddd;min-height:44px;display:flex;flex-direction:column;align-items:flex-start;width:100%;font-weight:700;justify-content:center}.nav li ul{display:none}.nav ul li ul li ul li{border-bottom:none}.nav a,.nav li{color:#707070;text-decoration:none;font-weight:500;font-size:14px}.list-item{display:flex;width:100%;justify-content:space-between;padding:0 0 0 15px;align-items:center}.arrow-container{width:40%;display:flex;justify-content:end;padding:17px}.nav li .arrow{--border: 2px solid #aaa8a8;border-bottom:var(--border);border-left:var(--border);height:12px;width:12px;transform:rotate(-45deg)}.nav li .arrow.open{transform:rotate(135deg)}.nav ul>ul{margin-left:30px}.nav>ul>li>ul>li{color:#0c5fb1;padding-left:40px}.nav>ul>li>ul>li .list-item{padding:0 0 9px;width:95%}.nav>ul>li>ul>li>ul>li{font-weight:600;color:#707070}.category-banner{display:none}@media (max-width: 1235px){.nav li.open-menu>ul{display:block}}@media (min-width: 1235px){.nav li:hover>ul{display:flex}.arrow-container{padding:0;width:20%}.nav li .arrow{display:none}.nav ul ul li:hover>ul{display:flex;flex-direction:column;padding:0 15px}.m-inicio,.m-all{position:fixed!important;top:-100%}.nav{display:flex!important;grid-row:1;grid-column:span 1}.nav>div:first-child{display:none}.nav ul li{display:flex;flex-direction:row;justify-content:left;align-items:baseline;width:auto;font-size:11px;line-height:1.6;letter-spacing:.04em;padding:15px 0;font-weight:600}.nav ul li span{cursor:pointer}.nav>ul{display:flex!important;flex-direction:row;gap:15px;align-items:center;margin:0;position:relative;overflow:inherit}.nav>ul>li>ul{top:100%;left:0;overflow:inherit}.nav>ul>li>ul>li{margin-left:15px;display:flex;flex-direction:column;align-items:flex-start;padding:0 0 15px}.nav li ul{position:absolute;background-color:#fff;top:0;left:0;width:auto;min-width:100%;padding:15px 15px 0 0}.nav>ul>li>ul>li .list-item{width:100%;display:flex;flex-direction:column;align-items:flex-start;padding:0}.list-item{padding:0;height:100%;align-items:stretch}.list-item span{display:flex}.list-item span:after{content:"";position:relative;right:0;top:7px;margin-left:5px;width:0;height:0;border-left:4.95px solid transparent;border-right:4.95px solid transparent;border-top:6.1px solid #707070;clear:both;transition:all .5s}li.parent-list:hover>div.list-item>span:after{transform:rotate(180deg)}.nav ul li{border:none;padding:0}.nav li{height:35px;position:relative}.nav ul li ul li{height:auto}.nav ul ul{height:auto;white-space:nowrap}.nav ul li ul li .list-item span:after{border-top:6.1px solid #0C5FB1}.nav ul ul ul{position:absolute;top:100%;left:-15px;width:calc(100% + 15px)}.nav ul ul ul li{transition:all .3s}.nav ul ul ul li:hover{color:#f37921}.category-banner img{width:200px;height:auto}.nav>ul>li>ul>li>div.category-banner,.nav>ul>li>ul>li>div.list-item>div.category-banner{display:block;cursor:auto}}@media (min-width: 1600px){.nav>ul{gap:30px}.category-banner img{width:250px}}

.toast-container{max-width:400px;background-color:#fff;box-shadow:-1px 3px 6px 4px #c1c1c19e;-webkit-box-shadow:-1px 3px 6px 4px #c1c1c19e;-moz-box-shadow:-1px 3px 6px 4px #c1c1c19e;position:fixed;top:110px;right:10px;z-index:999;padding:15px;display:none}.toast-box-text{width:100%;font-size:.8rem;text-align:left;background-color:#fcdfd4;color:#535353;padding:10px;margin:0 auto;gap:7px;display:grid;grid-template-columns:11px 1fr}.toast-box-text svg{margin-top:7px;width:11px;height:8px}.toast-box-text span{font-weight:600}.toast-box-text a{color:#000;font-weight:700}.show{display:block}.hide{animation:fade-out .5s forwards}@keyframes fade-out{to{opacity:0;display:none}}@media (min-width: 1024px){.toast-box-text{grid-template-columns:20px 1fr}.toast-box-text svg{margin-top:2px;width:16px;height:14px}}

.toTop{
    position:absolute;
    padding:10px;
    right:10px;
    bottom:10px
}
.arribaContainer{
    background:white;
    height:30px;
    width:30px;
    border-radius:100px;
    display:flex;
    justify-content:center;
    padding-top:2px
}
.arrowArriba{
    background-color:#fff;
    --border: 2px solid #f79b30;
    border-top:var(--border);
    border-left:var(--border);
    height:11px;
    width:11px;
    transform:rotate(45deg);
    color:transparent
}
.section-container{
    padding-bottom:80px;
    position:relative
}
.footer .section-container li a,.footer .section-container li span{
    color:#fff!important;
    text-decoration:none;
    gap:5px;
    display:flex
}
ul{
    margin-left:10px;
    margin-right:10px;
    list-style:none
}
li.title{
    font-weight:800;
    font-size:16px
}
li.option{
    font-weight:700;
    font-size:14px;
    padding-top:15px
}
.footerArrow{
    --border: 2px solid #fff;
    border-bottom:var(--border);
    border-left:var(--border);
    height:12px;
    width:12px;
    transform:rotate(-45deg)
}
.arrow.open{
    transform:rotate(135deg)
}
.section li.title{
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:space-between
}
.footer .section-container .section{
    width:100%!important;
    padding:10px
}
.footer .section-container{
    min-height:50px;
    background-color:#f79b30
}
.cardTimeLine .textColumnRight{
    text-align:start!important
}
@media (min-width: 768px){
    .toTop{
        display:none!important
    }
    .footer .section-container{
        display:grid;
        grid-template-columns:1fr 1fr 1fr;
        gap:10px;
        padding:10px
    }
    .footer .subscribeSection{
        grid-column:span 3
    }
    .footer .section li.option{
        display:list-item!important
    }
    .socialNetworks{
        display:block
    }
    .footerArrow{
        display:none!important
    }
}
@media (min-width: 990px){
    .footer .section-container{
        display:grid;
        grid-template-columns:1fr 1fr 1fr 1fr 1fr;
        gap:30px;
        padding-left:6%;
        padding-right:6%
    }
    .footer .section-container>div{
        grid-row:1
    }
    .footer .subscribeSection{
        grid-column-start:4;
        grid-column-end:6
    }
    li.option:hover{
        text-decoration:underline white
    }
    li.option{
        font-size:14px
    }
}
@media (min-width: 1500px){
    li.option{
        font-size:16px
    }
}

.footerBottom a{
    text-decoration:none
}
.footerBottom a:hover{
    text-decoration:underline #707070
}
footerBottom span{
    font-size:10px;
    color:#707070
}
footerBottom{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:0px
}
footerBottom>div{
    grid-column:span 1;
    text-align:center
}
footerBottom>div.marca,footerBottom>div.derechos{
    grid-column:span 2
}
.marca span{
    display:flex;
    align-items:center;
    justify-content:center
}
.marca svg{
    margin-left:10px
}
@media (min-width:400px){
    embed{
        width: 90%;
        margin: 0 5%;
    }
    h1{
        width: 100%;
    }
    #language{
        position: relative;
        top: -3px;
    }
}
@media (min-width: 768px){
    footerBottom{
        grid-template-columns:1fr 1fr 1fr
    }
    footerBottom>div.marca{
        grid-column:span 1
    }
    footerBottom>div.derechos{
        grid-column:span 3
    }
    h1{
        width: 60%;
    }
    #language{
        position: relative;
        top: -3px;
    }
}
@media (min-width: 1200px){
    footerBottom span{
        font-size:13px
    }
    footerBottom{
        display:flex;
        justify-content:space-between
    }
    footerBottom>div.marca{
        display:flex;
        align-items:center
    }
    .footerBottom{
        padding:15px 7% 12px
    }
    .footerBottom>div{
        text-align:center
    }
    h1{
        width: 60%;
    }
    #language{
        position: absolute;
        top: 10px;
    }
}
@media (min-width: 1570px){
    footerBottom span{
        font-size:14px
    }
    h1{
        width: 60%;
    }
    #language{
        position: absolute;
        top: 10px;
    }
}


.logo-container{
    padding-top: 25px;
    padding-bottom: 25px;
}

embed{
    width: 60%;
    margin: 0 20%;
}

.logo{
    text-align: center;
    padding-top: 20px;
}
.logo img{
    width: 30%;
}
footer{
    border-top: solid 20px #f79b30;
}