@import url('../fonts/roboto/roboto.css');

* {
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-size:16px;
    color:var(--prn-txt-os1);
}

*:not(.icono) {
    font-family:var(--fontNormal);
    line-height:1em;
}



:root {
    --prn-base:#222831;
    --prn-base-cl:#393e46;
    --prn:#ffd369;
    --prn-body:#eeeeee;

    --prn-txt-bl1:#fff;
    --prn-txt-bl2:rgba(255, 255, 255, .8);
    --prn-txt-bl3:rgba(255, 255, 255, .5);
    --prn-txt-os1:#222831;
    --prn-txt-os2:rgba(34, 40, 49, .8);
    --prn-txt-os3:rgba(34, 40, 49, .5);
    --prn-txt-placeholder:rgba(34, 40, 49, .3);

    --arcohiris-verde: #09bb50;
    --arcohiris-verde-cl: #8ce9b1;
    --arcohiris-rojo: #9d1111;
    --arcohiris-rojo-cl: #f0bbbb;
    --arcohiris-naranja: #ff4b00;
    --arcohiris-naranja-cl: #fdbc9f;

    --fontNormal:"Rob-h", sans-serif;

    --menu-boton-alto:50px;
    --shadow-menu:0 0 10px 5px rgba(0,0,0,.3);
    --shadow-producto1:0 0 10px 5px rgba(0,0,0,.06);

    --trans-r:all 0.2s ease;
    --trans-c:all 0.4s ease;
    --trans-l:all 0.8s ease;

    --boton-alto:50px;
    --boton-alto-peq:35px;

    --prod1-alto:95px;

    --gap:20px;

    --estrella-color:#ffe000;

    --boton-tamano:50px;
    --boton-tamano-pequeno:35px;

    --height-input:40px;
    --radio-1:5px;
}




































::-webkit-scrollbar {
    display:none;
}




































h6, .h6 {
    font-size:1.3em;
    font-weight:300;
}
h5, .h5 {
    font-size:1.6em;
    font-weight:300;
}
h4, .h4 {
    font-size:1.9em;
    font-weight:300;
}
h3, .h3 {
    font-size:2.2em;
    font-weight:300;
}
h2, .h2 {
    font-size:2.5em;
    font-weight:300;
}
h1, .h1 {
    font-size:2.8em;
    font-weight:300;
}




































html, body {
    width:100%;
    height:100%;
}
body {
    display:flex;
    align-items:center;
    justify-content:center;
    background:var(--prn-base-cl);
}

.todo {
    width:100%;
    height:100%;
    overflow-x:hidden;
    overflow-y:auto;

    position:relative;
}






































.cont-flex {
    display:flex;
    align-items:flex-start;
    /* justify-content:flex-start; */
    justify-content:space-between;
    flex-wrap:wrap;
}
.cont-flex.prueba {
    border:1px solid blue;
}
.cont-flex.align-left {
    justify-content:flex-start;
}
.cont-flex > .item-flex {
    margin:auto;
    /* margin-right:var(--gap); */
    margin-bottom:var(--gap);
}
.cont-flex.prueba > .item-flex {
    border:1px solid red;
}
/* .item-flex->inner(1) */
.cont-flex[data-inner="1"] > .item-flex { width:100%; }
.cont-flex[data-inner="2"] > .item-flex { width:calc( calc(100% / 2) - calc(var(--gap) * calc(2 - 1) / 2) ); }
.cont-flex[data-inner="3"] > .item-flex { width:calc( calc(100% / 3) - calc(var(--gap) * calc(3 - 1) / 3) ); }
.cont-flex[data-inner="4"] > .item-flex { width:calc( calc(100% / 4) - calc(var(--gap) * calc(4 - 1) / 4) ); }
/* .item-flex->inner(5) */
.cont-flex[data-inner="5"] > .item-flex { width:calc( calc(100% / 5) - calc(var(--gap) * calc(5 - 1) / 5) ); }

/* -item-flex->cambioDeAncho */

.cont-flex[data-inner="2"] > .item-flex[data-weight="2"] { width:100%; }

.cont-flex[data-inner="3"] > .item-flex[data-weight="2"] { width:calc( calc(100% / 3 * 2) - calc( var(--gap) * calc(3 - 2) / 3 ) ); }
.cont-flex[data-inner="3"] > .item-flex[data-weight="3"] { width:100%; }

.cont-flex[data-inner="4"] > .item-flex[data-weight="2"] { width:calc( calc(100% / 4 * 2) - calc( var(--gap) * calc(4 - 2) / 4 ) ); }
.cont-flex[data-inner="4"] > .item-flex[data-weight="3"] { width:calc( calc(100% / 4 * 3) - calc( var(--gap) * calc(4 - 3) / 4 ) ); }
.cont-flex[data-inner="4"] > .item-flex[data-weight="4"] { width:100%; }

.cont-flex[data-inner="5"] > .item-flex[data-weight="2"] { width:calc( calc(100% / 5 * 2) - calc( var(--gap) * calc(5 - 2) / 5 ) ); }
.cont-flex[data-inner="5"] > .item-flex[data-weight="3"] { width:calc( calc(100% / 5 * 3) - calc( var(--gap) * calc(5 - 3) / 5 ) ); }
.cont-flex[data-inner="5"] > .item-flex[data-weight="4"] { width:calc( calc(100% / 5 * 4) - calc( var(--gap) * calc(5 - 4) / 5 ) ); }
.cont-flex[data-inner="5"] > .item-flex[data-weight="5"] { width:100%; }





































.cont-flex > .item-flex .bx-parrafo {
    transition:var(--trans-c);
    font-size:16px;
    line-height:22px;
}
.cont-flex > .item-flex .bx-subtitulo {
    transition:var(--trans-c);
    font-size:22px;
    line-height:30px;
}
.cont-flex > .item-flex .bx-subtitulo-grande {
    transition:var(--trans-c);
    font-size:26px;
    line-height:33px;
}
.cont-flex > .item-flex .bx-titulo {
    transition:var(--trans-c);
    font-size:30px;
    line-height:40px;
}
.cont-flex > .item-flex .bx-titulo-grande {
    transition:var(--trans-c);
    font-size:40px;
    line-height:50px;
}
.cont-flex > .item-flex .bx-imagen {
    transition:var(--trans-c);
    display:block;
    max-width:100%;
}



.todo > .cont-menu.mostrar ~ .cont-main .cont-flex > .item-flex .bx-parrafo ,
.todo > .cont-menu.mostrar ~ .cont-main .cont-flex > .item-flex .bx-subtitulo ,
.todo > .cont-menu.mostrar ~ .cont-main .cont-flex > .item-flex .bx-subtitulo-grande ,
.todo > .cont-menu.mostrar ~ .cont-main .cont-flex > .item-flex .bx-titulo ,
.todo > .cont-menu.mostrar ~ .cont-main .cont-flex > .item-flex .bx-titulo-grande {
    color:var(--prn-txt-bl1);
}




































.modal {
    position:fixed;
    z-index:30;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,.6);
    display:flex;
    align-items:flex-start;
    justify-content:center;
    padding:50px 30px;
    overflow:auto;
    opacity:0;
    visibility:hidden;
    transition:var(--trans-c);
}
.modal#modal-mensaje {
    z-index:31;
}
.modal.mostrar {
    opacity:1;
    visibility:visible;
}
.modal > .box {
    width:100%;
    max-width:500px;
    background:var(--prn-base);
    border-radius:var(--radio-1);
    transform:translate(0, -150%) scale(.7);
    transition:var(--trans-c);
}
.modal.modal-mediano > .box {
    max-width:800px;
}
.modal.mostrar > .box {
    transform:translate(0,0) scale(1);
}
.modal > .box > *:first-child {
    border-top-left-radius:var(--radio-1);
    border-top-right-radius:var(--radio-1);
    overflow:hidden;
}
.modal > .box > *:last-child {
    border-bottom-left-radius:var(--radio-1);
    border-bottom-right-radius:var(--radio-1);
    overflow:hidden;
}
.modal > .box .barra-top {
    display:flex;
    align-items:center;
    justify-content:space-between;
    min-height:40px;
}
.modal > .box .barra-top p {
    color:#fff;
    font-size:16px;
    padding:0 15px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    user-select:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
}
.modal > .box .barra-top .iconos {
    display:flex;
}
.modal > .box .barra-top .iconos .icono {
    display:block;
    line-height:40px;
    height:40px;
    width:40px;
    text-align:center;
    font-size:20px;
    color:#fff;
    cursor:pointer;
}
.modal > .box .barra-top .iconos .icono:hover {
    background:var(--prn-base-cl);
}
.modal > .box .caja-central {
    background:#fff;
    padding:20px;
}
.modal.modal-oscuro > .box .caja-central {
    background:var(--prn-base-cl);
}
.modal > .box .caja-central > * {
    margin-bottom:20px;
}
.modal > .box .caja-central > *:last-child {
    margin-bottom:0;
}
.modal > .box .botones ,
.modal > .box .botones-juntos {
    justify-content:flex-end;
}
.modal > .box .botones-juntos {
    flex-wrap:nowrap;
    display:flex;
}
.modal > .box .botones .boton ,
.modal > .box .botones-juntos .boton {
    margin-bottom:0;
}
.modal > .box .botones-juntos .boton {
    margin-bottom:0;
    margin-right:0;
    width:100%;
    border-radius:0;
}
.modal > .box .botones-juntos .boton:first-child {
    border-bottom-left-radius:var(--radio-1);
}
.modal > .box .botones-juntos .boton:last-child {
    border-bottom-right-radius:var(--radio-1);
}



































.imagen-header {
    width:80%;
    margin:auto;
}




































.todo > .cont-menu {
    position:fixed;
    z-index:22;
    height:100%;
    width:320px;
    max-width:80%;
    background:var(--prn-base-cl);
    box-shadow:0;
    transform:translateX(-100%);

    transition:var(--trans-c);
}
.todo > .cont-menu.mostrar {
    transform:translateX(0);
    box-shadow:var(--shadow-menu);
}
.todo > .cont-menu .flotante {
    position:absolute;
    top:0;
    left:100%;
    margin:15px;
}
.todo > .cont-menu.mostrar .flotante .boton-icono .icono:before {
    content:"\f00d";
}



/* ----------- Menú ----------- */
.menu {
    width:100%;
    height:100%;
    transition:var(--trans-c);
    position:relative;
}
.menu nav {
    width:100%;
    height:100%;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    align-items:flex-start;
}
.menu nav > ul {
    width:100%;
    list-style:none;
}
.menu nav > ul li a {
    width:100%;
    text-decoration:none;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    height:var(--menu-boton-alto);
    padding:0 15px;
}
.menu nav > ul li a:hover {
    background-image:linear-gradient( 90deg, var(--prn-base), transparent );
}
.menu nav > ul li a > * {
    user-select:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    pointer-events:none;
    -webkit-pointer-events:none;
    -moz-pointer-events:none;
    -ms-pointer-events:none;

    color:var(--prn-txt-bl2);
    margin-right:10px;
}
.menu nav > ul li a > *:last-child {
    margin-right:0;
}
.menu nav > ul li a:hover > * {
    color:var(--prn-txt-bl1);
}




.menu nav > ul li .menu-head {
    width:100%;
    padding:20px;
    display:flex;
    justify-content:center;
    align-items:center;
}
.menu nav > ul li .menu-head span .cont-imagen {
    width:120px;
    height:120px;
    overflow:hidden;
    /* border-radius:50%; */
    margin:auto;
}
.menu nav > ul li .menu-head span .cont-imagen img {
    width:100%;
    height:100%;
    object-fit:contain;
    object-position:center;
}
.menu nav > ul li .menu-head span .cont-texto p {
    white-space:nowrap;
    text-align:center;
    color:var(--prn-txt-bl3);
    font-style:italic;
}
.menu nav > ul li .menu-head span .cont-texto .mh-titulo {
    color:var(--prn-txt-bl2);
    font-size:22px;
    font-style:normal;
}







.menu nav > ul li.li-hidden {
    overflow:scroll;
}
.menu nav > ul li .cont-hidden-options {
    width:400%;
    height:var(--menu-boton-alto);
    display:flex;
    overflow:auto;
}
.menu nav > ul li .cont-hidden-options li {
    width:calc(100% / 4);
    border-right:1px solid rgba(0, 0, 0, .3);
}





































.todo > .cont-main {
    transition:var(--trans-l);
    min-height:100%;
    background:var(--prn-body);
    padding-top:50px;
}
.todo > .cont-menu.mostrar ~ .cont-main {
    transform:translateX(220px);
    background:var(--prn-base-cl);
}




































.boton {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 15px;
    height:var(--boton-alto);
    background:var(--prn-base-cl);
    border:1px solid var(--prn-base);
    border-radius:5px;
    color:var(--prn-txt-bl2);
    text-decoration:none;
    margin-right:10px;
}
.boton:last-child {
    margin-right:0;
}
.boton.boton-icono {
    padding:0;
    width:var(--boton-alto);
    border-radius:50%;
}
.boton > * {
    color:var(--prn-txt-bl2);
    user-select:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    pointer-events:none;
    -webkit-pointer-events:none;
    -moz-pointer-events:none;
    -ms-pointer-events:none;
    margin-right:10px;
}
.boton > *:last-child {
    margin-right:0;
}
.boton.boton-blanco > * {
    color:var(--prn-base);
}




































.section {
    width:100%;
    padding:30px 30px;
    padding-top:0;
}
.section:first-child {
    padding-top:80px;
}




































.cont-center {
    width:100%;
    max-width:1200px;
    margin:auto;
    margin-bottom:30px;
}
.cont-center:last-child {
    margin-bottom:0;
}




































.producto-1 {
    width:100%;
    /* max-width:400px; */
    border-radius:12px;
    background:#fff;
    box-shadow:var(--shadow-producto1);
    display:flex;
    align-items:center;
    justify-content:flex-start;
    /* margin-bottom:10px; */
    text-decoration:none;
}
.producto-1 .prod-imagen {
    width:var(--prod1-alto);
    height:var(--prod1-alto);
    background-image:linear-gradient(0deg, rgb(192, 0, 0), red);
    border-radius:12px 0 0 12px;
    padding:10px;
}
.producto-1 .prod-imagen img {
    width:100%;
    height:100%;
    object-fit:contain;
    object-position:cneter;
}
.producto-1 .prod-texto {
    padding:10px 15px;
    max-height:var(--prod1-alto);
    width:calc(100% - var(--prod1-alto));
}
.producto-1 .prod-texto .prod-titulo {
    font-size:18px;
    font-weight:bold;
    white-space:nowrap;
    width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
}
.producto-1 .prod-texto > * {
    margin-bottom:5px;
}
.producto-1 .prod-estrellas {
    display:flex;
}
.producto-1 .prod-estrellas > .icono {
    font-size:13px;
    color:var(--estrella-color);
    margin-right:0;
}




































.cont-categorias {
    width:100%;
    overflow-x:auto;
    padding-left:30px;
}
.cont-categorias .categorias {
    display:inline-flex;
    padding:10px 0;
}



.categoria-1 {
    display:block;
    width:250px;
    height:250px;
    border-radius:30px;
    margin-right:20px;
    overflow:hidden;
    position:relative;
    z-index:1;
    box-shadow:var(--shadow-producto1);
    text-decoration:none;
    margin:auto;
}
.categoria-1 > .cc-imagen {
    width:100%;
    height:100%;
    padding:20px;
}
.categoria-1 .cc-imagen img {
    width:100%;
    height:100%;
    object-fit:contain;
    object-position:center;
}
.categoria-1 .cc-texto {
    position:absolute;
    top:0;
    left:0;
    padding:20px;
    z-index:2;
    width:100%;
    height:100%;
    display:flex;
    align-items:flex-end;
    justify-content:flex-start;
}
.categoria-1 .cc-texto > * {
    color:#fff;
    font-size:20px;
    font-weight:300;
    white-space:nowrap;
    width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
}




































.bold {
    font-weight:bold;
}




































.header-producto {
    height:380px;
    width:100%;
    max-width:90%;
    position:relative;
    z-index:1;
    margin:auto;
    margin-bottom:50px;
    border-radius:20px;
}
.header-producto .hd-imagen {
    height:100%;
    width:100%;
    padding:var(--gap);
}
.header-producto .hd-imagen img {
    height:100%;
    width:100%;
    object-fit:contain;
    object-position:center;
}
.header-producto .hd-texto {
    width:100%;
    position:absolute;
    bottom:0;
    left:0;
    padding:var(--gap);
    padding-bottom:55px;
    background:linear-gradient(0deg, rgba(0, 0, 0, 0.63), transparent);
    border-radius:20px;
}
.header-producto .hd-texto .hd-titulo {
    color:var(--prn-txt-bl1);
}
.header-producto .hd-texto .hd-estrellas {
    display:flex;
}
.header-producto .hd-texto .hd-estrellas .icono {
    color:var(--estrella-color);
    margin-right:5px;
}
.header-producto .hd-botones {
    position:absolute;
    z-index:2;
    top:100%;
    left:0;
    width:100%;
    transform:translateY(-50%);
    padding:var(--gap);
}
.header-producto .hd-botones .boton {
    width:100%;
}





































.boton {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    height:var(--boton-tamano);
    background:var(--prn-base);
    color:var(--prn-txt-bl2);
    font-size:16px;
    margin:0 10px 0 0;
    cursor:pointer;
    text-decoration:none;
    padding:0 15px;
    border-radius:5px;
}
.boton.boton-icono {
    height:var(--boton-tamano);
    width:var(--boton-tamano);
    padding:0;
    border-radius:var(--boton-tamano);
}
.boton.boton-transparente {
    background:transparent;
    color:var(--prn-base);
}
.boton.boton-pequeno {
    height:var(--boton-tamano-pequeno);
    padding:0 10px;
    font-size:14px;
}
.boton > * {
    font-size:16px;
    color:var(--prn-txt-bl2);
    user-select:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    pointer-events:none;
    -webkit-pointer-events:none;
    -moz-pointer-events:none;
    -ms-pointer-events:none;
}
.boton.boton-pequeno > * {
    font-size:14px;
}
.boton.boton-transparente > * {
    color:var(--prn-base);
}
.boton:last-child {
    margin:0;
}



































.marco-imagen {
    display:inline-block;
    margin:auto;
    padding:20px;
    border-radius:15px;
    border:1px solid var(--prn-txt-os3);
    max-width:100;
}
.marco-imagen img {
    width:100%;
}






























input ,
textarea ,
select {
    line-height:var(--height-input);
    height:var(--height-input);
    border:1px solid var(--prn-txt-placeholder);
    outline-color:var(--arcohiris-naranja);
    border-radius:var(--radio-1);
    padding:0 15px;
    background:transparent;
}
input[type="submit"] {
    outline:0;
}
input::placeholder ,
textarea::placeholder ,
select::placeholder {
    color:var(--prn-txt-placeholder);
}
select option {
    color:var(--prn-txt-os1);
}
select option:first-child {
    color:var(--prn-txt-os3);
}
select.vacio {
    color:var(--prn-txt-placeholder);
}
input.mal ,
textarea.mal ,
select.mal {
    background:var(--arcohiris-rojo-cl);
    color:var(--arcohiris-rojo);
    border-color:var(--arcohiris-rojo);
}
input.mal::placeholder ,
textarea.mal::placeholder ,
select.mal::placeholder {
    color:var(--arcohiris-rojo);
}
input.bien ,
textarea.bien ,
select.bien {
    color:var(--arcohiris-verde);
    border-color:var(--arcohiris-verde);
    background:var(--arcohiris-verde-cl);
}
input.bien::placeholder ,
textarea.bien::placeholder ,
select.bien::placeholder {
    color:var(--arcohiris-verde);
}
input:disabled ,
textarea:disabled ,
select:disabled {
    /*background:var(--color-input-deshabilitado);*/
}






.cont-form {
    width:100%;
    display:flex;
    align-items:flex-start;
    justify-content:center;
}
.cont-form.align-left {
    justify-content:flex-start;
}
.cont-form.align-right {
    justify-content:flex-end;
}
.cont-form form {
    width:100%;
    max-width:500px;
}
.cont-form form .cont-campos {
    width:100%;
    display:block;
    margin-bottom:10px;
}
.cont-form form .cont-campos:last-child {
    margin-bottom:0;
}
.cont-form form .cont-campos.hidden {
    display:none;
}
.cont-form form .cont-campos .campo {
    width:100%;
}
.cont-form form .cont-campos .boton {
    width:100%;
}



































.punto-semaforo {
    position:fixed;
    top:0;
    right:0;
    margin:15px;
    width:10px;
    height:10px;
    z-index:40;
    border-radius:50%;
    background:var(--arcohiris-rojo);
    pointer-events:none;
    -webkit-pointer-events:none;
    -moz-pointer-events:none;
    -ms-pointer-events:none;
}
.punto-semaforo.activo {
    background:var(--arcohiris-verde);
}




















































.cont-collapse {
    width:100%;
    display:flex;
    flex-wrap:wrap;
}
.cont-collapse.prueba {
    border:1px solid blue;
}
.cont-collapse > .item-collapse {
    width:100%;
    margin:0;
}
.cont-collapse.prueba > .item-collapse ,
.cont-collapse > .item-collapse.prueba {
    border:1px solid red;
}
.cont-collapse[data-inner="2"] > .item-collapse { width:calc(100% / 2); }
.cont-collapse[data-inner="3"] > .item-collapse { width:calc(100% / 3); }
.cont-collapse[data-inner="4"] > .item-collapse { width:calc(100% / 4); }
.cont-collapse[data-inner="5"] > .item-collapse { width:calc(100% / 5); }
.cont-collapse[data-inner="6"] > .item-collapse { width:calc(100% / 6); }
.cont-collapse[data-inner="7"] > .item-collapse { width:calc(100% / 7); }
.cont-collapse[data-inner="8"] > .item-collapse { width:calc(100% / 8); }
.cont-collapse[data-inner="9"] > .item-collapse { width:calc(100% / 9); }

.cont-collapse[data-inner="2"] > .item-collapse[data-colspan=2] { width:calc(100% / 2 * 2); }
.cont-collapse[data-inner="3"] > .item-collapse[data-colspan=2] { width:calc(100% / 3 * 2); }
.cont-collapse[data-inner="3"] > .item-collapse[data-colspan=3] { width:calc(100% / 3 * 3); }
.cont-collapse[data-inner="4"] > .item-collapse[data-colspan=2] { width:calc(100% / 4 * 2); }
.cont-collapse[data-inner="4"] > .item-collapse[data-colspan=3] { width:calc(100% / 4 * 3); }
.cont-collapse[data-inner="4"] > .item-collapse[data-colspan=4] { width:calc(100% / 4 * 4); }
.cont-collapse[data-inner="5"] > .item-collapse[data-colspan=2] { width:calc(100% / 5 * 2); }
.cont-collapse[data-inner="5"] > .item-collapse[data-colspan=3] { width:calc(100% / 5 * 3); }
.cont-collapse[data-inner="5"] > .item-collapse[data-colspan=4] { width:calc(100% / 5 * 4); }
.cont-collapse[data-inner="5"] > .item-collapse[data-colspan=5] { width:calc(100% / 5 * 5); }
.cont-collapse[data-inner="6"] > .item-collapse[data-colspan=2] { width:calc(100% / 6 * 2); }
.cont-collapse[data-inner="6"] > .item-collapse[data-colspan=3] { width:calc(100% / 6 * 3); }
.cont-collapse[data-inner="6"] > .item-collapse[data-colspan=4] { width:calc(100% / 6 * 4); }
.cont-collapse[data-inner="6"] > .item-collapse[data-colspan=5] { width:calc(100% / 6 * 5); }
.cont-collapse[data-inner="6"] > .item-collapse[data-colspan=6] { width:calc(100% / 6 * 6); }
.cont-collapse[data-inner="7"] > .item-collapse[data-colspan=2] { width:calc(100% / 7 * 2); }
.cont-collapse[data-inner="7"] > .item-collapse[data-colspan=3] { width:calc(100% / 7 * 3); }
.cont-collapse[data-inner="7"] > .item-collapse[data-colspan=4] { width:calc(100% / 7 * 4); }
.cont-collapse[data-inner="7"] > .item-collapse[data-colspan=5] { width:calc(100% / 7 * 5); }
.cont-collapse[data-inner="7"] > .item-collapse[data-colspan=6] { width:calc(100% / 7 * 6); }
.cont-collapse[data-inner="7"] > .item-collapse[data-colspan=7] { width:calc(100% / 7 * 7); }
.cont-collapse[data-inner="8"] > .item-collapse[data-colspan=2] { width:calc(100% / 8 * 2); }
.cont-collapse[data-inner="8"] > .item-collapse[data-colspan=3] { width:calc(100% / 8 * 3); }
.cont-collapse[data-inner="8"] > .item-collapse[data-colspan=4] { width:calc(100% / 8 * 4); }
.cont-collapse[data-inner="8"] > .item-collapse[data-colspan=5] { width:calc(100% / 8 * 5); }
.cont-collapse[data-inner="8"] > .item-collapse[data-colspan=6] { width:calc(100% / 8 * 6); }
.cont-collapse[data-inner="8"] > .item-collapse[data-colspan=7] { width:calc(100% / 8 * 7); }
.cont-collapse[data-inner="8"] > .item-collapse[data-colspan=8] { width:calc(100% / 8 * 8); }
.cont-collapse[data-inner="9"] > .item-collapse[data-colspan=2] { width:calc(100% / 9 * 2); }
.cont-collapse[data-inner="9"] > .item-collapse[data-colspan=3] { width:calc(100% / 9 * 3); }
.cont-collapse[data-inner="9"] > .item-collapse[data-colspan=4] { width:calc(100% / 9 * 4); }
.cont-collapse[data-inner="9"] > .item-collapse[data-colspan=5] { width:calc(100% / 9 * 5); }
.cont-collapse[data-inner="9"] > .item-collapse[data-colspan=6] { width:calc(100% / 9 * 6); }
.cont-collapse[data-inner="9"] > .item-collapse[data-colspan=7] { width:calc(100% / 9 * 7); }
.cont-collapse[data-inner="9"] > .item-collapse[data-colspan=8] { width:calc(100% / 9 * 8); }
.cont-collapse[data-inner="9"] > .item-collapse[data-colspan=9] { width:calc(100% / 9 * 9); }




.cont-collapse > .item-collapse .bx-collapse-video {
    width:100%;
    object-fit:cover;
    display:block;
}




































@media screen and (max-width:1100px) {

    .cont-collapse[data-inner="3"] > .item-collapse { width:calc(100% / 2); }
}
@media screen and (max-width:1000px) {

    .cont-flex[data-inner="3"] > .item-flex { width:calc( calc(100% / 2) - calc(var(--gap) * calc(2 - 1) / 2) ) !important; }
    .cont-flex[data-inner="4"] > .item-flex { width:calc( calc(100% / 3) - calc(var(--gap) * calc(3 - 1) / 3) ) !important; }
}
@media screen and (max-width:800px) {

    .cont-flex[data-inner="4"] > .item-flex { width:calc( calc(100% / 2) - calc(var(--gap) * calc(2 - 1) / 2) ) !important; }

    

    .cont-collapse[data-inner="2"] > .item-collapse { width:calc(100% / 1); }
    .cont-collapse[data-inner="3"] > .item-collapse { width:calc(100% / 1); }
}
@media screen and (min-width:600px) {




    /* .producto-1 {
        display:block;
    }
    .producto-1 .prod-imagen {
        width:100%;
        height:200px;
        border-radius:12px;
    }
    .producto-1 .prod-imagen img {
        width:100%;
        height:100%;
        object-fit:contain;
        object-position:cneter;
    }
    .producto-1 .prod-texto {
        padding:10px 15px;
        max-height:var(--prod1-alto);
        width:calc(100% - var(--prod1-alto));
    }
    .producto-1 .prod-texto .prod-titulo {
        font-size:18px;
        font-weight:bold;
        white-space:nowrap;
        width:100%;
        overflow:hidden;
        text-overflow:ellipsis;
    }
    .producto-1 .prod-texto > * {
        margin-bottom:5px;
    }
    .producto-1 .prod-estrellas {
        display:flex;
    }
    .producto-1 .prod-estrellas > .icono {
        font-size:13px;
        color:var(--estrella-color);
        margin-right:0;
    } */
    .producto-1 .prod-imagen {
        width:500px;
        height:400px;
        border-radius:12px;
    }
    .producto-1 .prod-texto .prod-titulo {
        font-size:40px;
    }
    .producto-1 .prod-estrellas > .icono {
        font-size:25px;
    }


}
@media screen and (max-width:600px) {

    .cont-flex[data-inner="4"] > .item-flex { width:100% !important; }
    .cont-flex[data-inner="3"] > .item-flex { width:100% !important; }
    .cont-flex[data-inner="2"] > .item-flex { width:100% !important; }
}





.cont-flex > .item-flex[data-regla="100"] {
    width:100% !important;
}