@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
@import url('/index-img/iconos/all.min.css');
@import url('/index-img/iconos/ico.css');

* {box-sizing: border-box; margin: 0; padding: 0}

:root {
    --fuente-titulos: 'Barlow', sans-serif;
    --fuente-texto: 'Roboto', sans-serif;

    --color1: #DE3334; --color2: #F8491C; --color3: #DD195F;
    /* --color1: #0CB6F2; --color2: #0CB6F2; --color3: #004BE1; */
    /* --color1: #ca4fff; --color2: #BF2FFF; --color3: #394FDE; */

    --logocolor1: var(--color2);
    --logocolor2: var(--color3);

    --oscuro1: #0d0e10;
    --oscuro2: #12131a;
    --oscuro2-t: #12131abe;
    --oscuro3: #1a1c26;
    --oscuro3-t: #1a1c26be;
    --oscuro4: #232633;
    
    --claro1: #eaeeff;
    --claro2: #a8acbf;
    --claro3: #808499;
    --claro4: #3b3f50;
    
    --ancho-header: 13.021vw;
    --ancho-aside: 0vw;
    /* --ancho-aside: 16.667vw; */
    --ancho-headeraside: calc(var(--ancho-header) + var(--ancho-aside));
    --ancho-cont: calc(100% - var(--ancho-header));
    --ancho-cont-headeraside: calc(100% - var(--ancho-headeraside));

    --ancho-asideprod: 20vw;
    --ancho-headerasideprod: calc(var(--ancho-header) + var(--ancho-asideprod));
    --ancho-cont-headerasideprod: calc(100% - var(--ancho-headerasideprod));

    scrollbar-width: none;
}

.ocultar, #logo-rde-movil,
::-webkit-scrollbar {display: none}
::selection {color: #fff; background-color: var(--color1)}

body {
    cursor: default;
    color: var(--claro1);
    font-family: var(--fuente-texto);
    background-color: black;
    word-wrap: break-word;
    overflow-wrap: break-word;
    /* user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none; */
}

a, a:visited {
    color: var(--color1);
    text-decoration: none;
    border: none;
    transition: .7s;
}
a:hover {color: var(--color2); transition: .15s}
a:active {filter: brightness(1.2)}

.separador {
    opacity: .5;
    padding: 0 .6em;
    color: var(--claro1);
}

.separadorv {
    opacity: .5;
    margin: 0 .6em;
    width: .052vw;
    height: .92vw;
    background-color: var(--claro2);
}

#avisocukis {
    position: fixed;
    bottom: 0;
    width: var(--ancho-cont);
    border-top: 1px solid #262836;
    z-index: 100;
}
#avisocukis:before,
#avisocukis:after {
    content: '';
    position: absolute;
    top: -1vw;
    width: 1vw; height: 1vw;
    background-color: transparent;
    box-shadow: 0 .3vw 0 0 var(--oscuro3);
    transition: .15s;
}
#avisocukis:before {left: 0; border-radius: 0 0 0 .417vw}
#avisocukis:after {right: 0; border-radius: 0 0 .417vw 0}

.cukis {
    color: var(--claro1);
    text-align: center;
    font-size: .677vw;
    font-weight: 400;
    padding: .781vw;
    background-color: var(--oscuro3);
}
.cukis .fa-cookie-bite {color: var(--color1)}

img, video {
    display: block;
    width: 100%;
    height: auto;
    border: none;
    border-radius: .417vw;
}
img {user-select: none; pointer-events: none}

@supports ((backdrop-filter: blur())) {
    .pantcomp-izq {
        background-color: var(--oscuro3-t) !important;
        backdrop-filter: blur(30px);
    }
    .submenu-div, .cukis {
        background: linear-gradient(90deg, var(--oscuro3) 0%, var(--oscuro3-t) 50%, var(--oscuro3) 100%) !important;
        backdrop-filter: blur(30px);
    }

}

/* PUBLICIDAD
----------------------------------------------------------------------*/
.gad-728x90-div {padding: 10px}

.gad-728x90 {
    width: 728px;
    height: 90px;
    color: var(--oscuro3);
    margin: auto;
    background-color: var(--oscuro3);
}

/* BOTONES
----------------------------------------------------------------------*/
[class*='boton-'] a,
[class*='boton-'] a:visited {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-weight: 500;
    font-size: .833vw;
    padding: .521vw .781vw;
    margin: auto;
    border-radius: .21vw;
    transition: .7s;
}
[class*='boton-'] a:hover,
.boton-cukis:hover {filter: brightness(1.2); transition: .25s}

.boton-rojo,
.boton-borde {cursor: pointer}

.boton-rojo a,
.boton-rojo a:visited {
    background: linear-gradient(135deg, var(--color2) 0%, var(--color3) 100%);
}

.boton-borde a,
.boton-borde a:visited {
    color: var(--claro2);
    outline: .052vw solid var(--oscuro3);
}
.boton-borde a:hover {
    color: var(--claro2) !important;
    background-color: var(--oscuro2);
}
.boton-borde [class*='fa-'] {color: var(--color1)}
.boton-borde .fa-facebook {color: #1877F2}
.boton-borde .fa-x-twitter {color: #1d9bf0}
.boton-borde .fa-whatsapp {color: #25D366}
.boton-borde .fa-telegram {color: #0088cc}

.boton-cukis,
.boton-cukis:visited {
    color: var(--claro1);
    background: linear-gradient(135deg, var(--color2) 0%, var(--color3) 100%);
    border-radius: .21vw;
    padding: .26vw .521vw;
    margin: .208vw;
    cursor: pointer;
    transition: .7s;
}

/* MENÚ
----------------------------------------------------------------------*/
header {
    position: fixed;
    left: 0;
    width: var(--ancho-header);
    height: 100vh;
    background-color: var(--oscuro3);
    z-index: 999;
}

.imagotipo {
    width: 9.333vw;
    height: auto;
    margin-top: 2.083vw;
}

.isotipo {
    width: 2.083vw;
    height: auto;
    margin-top: 1.042vw;
    display: none;
}

nav {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: calc(100vh - 13.281vw);
    margin-top: 2.083vw;
    overflow-y: auto;
}

nav ul {list-style-type: none; margin: 0; padding: 0}
nav ul li {position: relative}
nav span {margin-left: .521vw}

nav a, nav a:visited {
    display: block;
    color: var(--claro2);
    font-size: .833vw;
    font-weight: 500;
    padding: .781vw .938vw;
    margin: .2vw 0 .2vw .521vw;
    border-radius: 1.302vw 0 0 1.302vw;
    border-top: 1px solid #10111600 !important;
    border-bottom: 1px solid #26283600 !important;
    transition: .7s;
}
nav a:hover, .menu-activo {
    color: var(--claro1) !important;
    margin: .2vw 0 .2vw 1.042vw;
    background-color: var(--oscuro2);
    transition: .15s;
}

nav a:active, .menu-activo {
    margin: .2vw 0 .2vw 1.042vw;
    border-top: 1px solid #101116 !important;
    border-bottom: 1px solid #262836 !important;
}

nav a:before, .menu-activo:before,
nav a:after, .menu-activo:after {
    content: '';
    position: absolute;
    right: 0;
    width: .52vw; height: .52vw;
    background-color: transparent;
    transition: .15s;
}

nav a:before, .menu-activo:before {
    top: -.52vw;
    border-radius: 0 0 .26vw 0;
    box-shadow: 0 .26vw 0 0 transparent;
    border-bottom: 1px solid transparent;
}
nav a:hover:before, .menu-activo:before {
    box-shadow: 0 .26vw 0 0 var(--oscuro2);
    transition: .15s;
}

nav a:after, .menu-activo:after {
    bottom: -.52vw;
    border-radius: 0 .26vw 0 0;
    box-shadow: 0 -.26vw 0 0 transparent;    
    border-top: 1px solid transparent;
}
nav a:hover:after, .menu-activo:after {
    box-shadow: 0 -.26vw 0 0 var(--oscuro2);
    transition: .15s;
}

nav a [class*='fa-'] {
    opacity: .55;
    transition: .7s;
}
nav a:hover [class*='fa-'],
.menu-activo > [class*='fa-'] {
    color: var(--color1);
    opacity: 1; transition: .15s;
}

.navegacion {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}

#menuclicmovil, #menuclicmovil:visited {
    color: var(--claro1);
    font-size: 2.083vw;
    cursor: pointer;
}
#menuclicmovil:hover {color: var(--color1)}


/* FOOTER
----------------------------------------------------------------------*/
footer {
    width: 100%;
    text-align: center;
    position: absolute;
    padding: 1.042vw;
    bottom: 0;
}

footer a, footer a:visited {
    color: var(--claro2);
    font-weight: 400;
}
footer a:hover {color: var(--color1)}
footer .iconos {margin-bottom: 1.042vw}
footer .copyright {opacity: .45}

.iconos a, .iconos a:visited {
    color: var(--claro1);
    font-size: 1vw;
    opacity: .6;
    transition: .7s;
}

.iconos a:hover {
    color: var(--color1);
    opacity: 1;
    transition: .15s;
}

.iconos img {width: 1.146vw; vertical-align: middle}

.copyright {font-size: .573vw; font-weight: 500}
.copyright a:hover {color: var(--claro1)}

/* SUBMENÚ
----------------------------------------------------------------------*/
.submenu-div {
    font-size: .729vw;
    padding: .452vw;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: fixed;
    width: var(--ancho-cont);
    background-color: var(--oscuro3);
    z-index: 2;
}
.submenu-div:before,
.submenu-div::after {
    content: '';
    position: absolute;
    bottom: -1vw;
    width: 1vw; height: 1vw;
    background-color: transparent;
    box-shadow: 0 -.3vw 0 0 var(--oscuro3);
    transition: .15s;
}
.submenu-div:before {left: 0; border-radius: .417vw 0 0 0}
.submenu-div::after {right: 0; border-radius: 0 .417vw 0 0}

.submenu {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.submenu-activo {
    color: var(--claro1) !important;
    background-color: var(--oscuro2);
    outline: .052vw solid var(--oscuro4) !important;
    cursor: pointer;
}
.submenu-activo [class*='fa-'],
.submenu-activo [class*='ico-'] {
    color: var(--color1);
    transition: .15s;
}
.submenu a,
.submenu a:visited {
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--claro2);
    padding: .521vw 1.042vw;
    margin: 0 .156vw;
    border-radius: .21vw;
    outline: .052vw solid transparent;
    transition: .7s;
}

.submenu a:hover {
    cursor: pointer;
    color: var(--claro1);
    outline: .052vw solid var(--oscuro4);
    background-color: var(--oscuro2);
    transition: .15s;
}

.submenu [class*='ico-'],
.submenu [class*='fa-'] {margin-right: .365vw; margin-top: .1vw}
.submenu [class*='ico-'] {transform: scale(1.3)}
.submenu h5 {font-size: .417vw}

.submenu-der a,
.submenu-der a:visited {
    color: var(--claro1);
    font-size: 1.042vw;
    margin-right: .521vw;
    transition: .7s;
}
.submenu-der a:hover {color: var(--color1); transition: .15s}

.submenu-gal {
    display: flex;
    align-items: center;
    height: 2.083vw;
}
.submenu-gal-info {
    display: flex;
    align-items: center;
    padding: .521vw .05vw;
    margin: 0 .156vw;
}
.submenu-gal [class*='fa-'] {color: var(--color1)}
.submenu-gal a {margin-right: .6vw; padding: .417vw; border-radius: 50%}
.submenu-gal a:hover {background-color: var(--oscuro2)}
/* .submenu-gal h3 [class*='fa-'] {transform: translateY(.1vw)} */

/* SECCIÓN
----------------------------------------------------------------------*/
.banner {
    display: flex;
    width: 98%; height: 18.28vw;
    padding: 2vw;
    background-size: cover;
    justify-content: center;
    align-items: end;
    margin: auto;
    margin-top: 3.5vw;
    border-radius: .417vw;
    box-shadow: 0 .16vw .5vw #0000002a;
}

/* ASIDE
----------------------------------------------------------------------*/
aside {
    position: fixed;
    right: 0;
    width: var(--ancho-aside);
    height: 100vh;
    background-color: var(--oscuro3);
    z-index: 999;
}
.aside-div {
    width: 100%;
    height: calc(100vh - 15vw);
    padding: .625vw;
    border: 0;
    overflow-y: auto;
}

.aside-titulo {
    padding: .417vw;
    margin-bottom: .521vw;
}
.aside-separador {
    width: 100%;
    height: 1px;
    margin: .521vw 0 0 0;
    background: linear-gradient(135deg, var(--color2) 0%, var(--color3) 100%);
    border-radius: .417vw;
}

.aside-min, .aside-min:visited {
    display: flex;
    align-items: center;
    position: relative;
    color: var(--claro1);
    height: 4.427vw;
    margin-bottom: .521vw;
    border-radius: .417vw;
    background-color: var(--oscuro2);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    outline: .052vw solid transparent;
    transition: .5s;
    overflow: hidden;
}

.aside-min:hover {
    cursor: pointer;
    color: var(--claro1);
    outline: .052vw solid var(--oscuro4);
    box-shadow: 0 .16vw .5vw #00000044;
    transition: .5s;
}

.aside-min:hover .aside-tag,
.aside-min:hover .aside-min-fecha {
    background-color: var(--oscuro4);
    transition: .5s;
}
.aside-min:hover .aside-tag h5 {
    color: var(--claro1);
    transition: .5s;
}

.aside-min-info {padding: .938vw}
.aside-min-info h3 {font-size: 1.042vw}
.aside-min-info h4 {font-size: .677vw; opacity: .7}

.aside-min-fecha {
    position: absolute;
    right: 0; bottom: 0;
    padding: .313vw .313vw .156vw .313vw;
    border-radius: .417vw 0 0 0;
    background-color: var(--oscuro2);
    transition: .5s;
}
.aside-min-fecha h5 {font-size: .521vw}

.aside-tag {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 1.042vw;
    height: 4.427vw;
    background-color: var(--oscuro2);
    transition: .5s;
}
.aside-tag h5 {
    font-size: .573vw;
    float: left;
    transform: rotate(-90deg);
    color: var(--claro3);
    transition: .5s;
}

.aside-gad-div {
    text-align: center;
    position: absolute;
    left: .521vw;
    bottom: .521vw;
    height: 14.896vw;
}

.aside-gad-div h4 {padding: .521vw; opacity: .5}

.aside-gad {
    width: 15.625vw; height: 13.021vw; /* 300x250px */
    background: linear-gradient(135deg, var(--color2) 0%, var(--color3) 100%);
    border-top: 1px solid #101116;
    border-bottom: 1px solid #262836;
    border-radius: .417vw; /* 8px */
    overflow: hidden;
}

/* EMERGENTE
----------------------------------------------------------------------*/
.cargando {
    position: fixed;
    top: 0; bottom: 0; left: 0; right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--oscuro2);
    overflow: hidden;
    z-index: 100000;
}

.cargando img {max-width: 6vw}

.emergenteDiv {
    position: fixed;
    top: 0; bottom: 0; left: 0; right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background-color: #000000a1;
    background-image: url('/index-img/punto.webp');
    backdrop-filter: blur(.3vw);
    visibility: hidden;
    opacity: 0;
    transition: .2s;
    z-index: 1000;
}
.emergenteDiv.active {
    visibility: visible;
    opacity: 1;
    transition: .2s;
}
.emergente,
.emergenteImg  {
    position: relative;
    min-width: 25vw;
    max-width: 40vw; max-height: 90vh;
    padding: 2vw;
    outline: .1vw solid var(--oscuro4);
    border-radius: .417vw;
    background: linear-gradient(170deg, var(--oscuro3) 0%, var(--oscuro2) 40%);
    box-shadow: 0 1vw 1.5vw #000000a1;
    overflow: auto;
    transform: scale(.9) translateY(2vw);
    z-index: 1001; transition: .2s;
}
.emergenteImg {
    max-width: 90vw;
    max-height: 90vh;
    border: 0; padding: 0;
}
.emergente.active,
.emergenteImg.active {
    transition: .2s;
    transform: scale(1) translateY(0);
}

.emergente h3 {
    font-weight: 500;
    line-height: 1.6;
}
.emergente span {color: var(--color1); font-weight: 700}
.emergenteAbrir {cursor: pointer}
.emergenteCerrar,
.emergenteCerrarImg {
    position: absolute;
    top: .5vw; right: .7vw;
    cursor: pointer;
    color: var(--claro1);
    display: flex;
    justify-content: center;
    align-items: center;
    transition: .2s;
}
.emergenteCerrarImg {
    color: var(--oscuro1);
    background-color: var(--claro1);
    width: 1em; height: 1em;
    transform: scale(1.7);
    top: 1.2vw; right: 1.2vw;
    border-radius: 50%;
}
.emergenteCerrar:hover {color: var(--color1) !important}
.emergenteCerrarImg:hover {
    color: var(--oscuro1) !important;
    background-color: var(--color1);
}

body.bloquear {overflow: hidden}

/* COMPARTIR
----------------------------------------------------------------------*/
.compartir,
.copiarenlace {
    color: var(--claro1);
    transition: .7s;
}
.compartir:hover,
.copiarenlace:hover {
    cursor: pointer;
    filter: brightness(1.2);
    transition: .15s;
}
.compartir [class*='fa-share'],
.emergente [class*='fa-share'] {
    color: var(--color1);
    transform: translateY(.05vw);
    transition: .7s;
}

#emergenteCompartir p {
    font-size: 95%;
    margin: 1vw 0 .7vw .4vw;
    opacity: .7;
}

.submenu-div .compartir {
    border-radius: .21vw;
    outline: .052vw solid var(--claro4);
    background-color: var(--oscuro4);
    padding: .35vw .7vw;
}
.submenu-div .compartir h4 {transform: translateY(-.055vw);}

#copiar {text-align: right}
#copiar::after {content: "Copiar"}
#copiar.clic::after {content: "Copiado"}
#copiar.clic [class*='fa-'] {color: var(--color1)}

.enlace {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: var(--claro3);
    outline: .052vw solid var(--oscuro3);
    padding: .6vw;
    margin: 0 .4vw;
    border-radius: .21vw;
}
.enlace > h4 {
    max-width: 19.5vw;
    display: -webkit-box;
    overflow-y: hidden;
    overflow-x: auto;
    white-space: nowrap;
}

.compartir-redes {
    display: flex;
    justify-content: center;
    align-items: center;
}
.compartir-redes .boton-borde {
    margin: 1vw .35vw;
}

.vid-info .compartir h4,
.art-enc .compartir h4 {
    margin-right: .5vw;
    transform: scale(1.2);
    padding: .45vw .65vw;
    outline: .052vw solid var(--oscuro4);
    border-radius: .21vw;
    background-color: var(--oscuro3);
}

/* CONTENEDOR
----------------------------------------------------------------------*/
.contenedor {
    position: absolute;
    width: var(--ancho-cont);
    height: 100vh;
    left: var(--ancho-header);
    background-color: var(--oscuro2);
    background-attachment: fixed;
    overflow: auto;
}

aside + .contenedor,
aside ~ .contenedor .submenu-div {
    width: var(--ancho-cont-headeraside);
}

aside ~ .contenedor > #avisocukis {
    width: var(--ancho-cont-headeraside);
}

.asideprod + .contenedor,
.asideprod ~ .contenedor .submenu-div {
    width: var(--ancho-cont-headerasideprod);
}

.asideprod ~ .contenedor > #avisocukis {
    width: var(--ancho-cont-headerasideprod);
}

/* CONTENIDO
----------------------------------------------------------------------*/
.contenido {
    background-size: cover;
    background-position: top ;
    background-attachment: fixed;
}

.submenu-div + .contenido {margin-top: 2.89vw}

/* ARTÍCULO
----------------------------------------------------------------------*/
article {
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    background-repeat: no-repeat;
    padding: 0 6vw;
    /* padding: 0 2vw; */
}

.art-enc,
.art-wrap,
.prod-enc {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
}
.art-enc {padding: 3vw 4vw .5vw 4vw}
.art-enc-info h1 {max-width: 40vw}
.art-enc-info h4 {opacity: .75; padding: 1vw 0 0 0}

.art-cont {padding: 0 4vw 2vw 4vw}
.art-cont img {margin: 1.2vw 0 1.2vw 0}

.art-wrap {
    padding: 0 2vw;
    justify-content: center;
}
.art-wrap-img,
.art-wrap-text {padding: 2vw}
.art-wrap-text h4 {opacity: .45; padding-top: .4vw}


/* MINIATURAS
----------------------------------------------------------------------*/
.grid {display: grid; padding: .417vw}
.grid-main {grid-template-columns: repeat(auto-fill, minmax(16.667vw, 1fr))}
.grid-prod {grid-template-columns: repeat(auto-fill, minmax(10.416vw, 1fr))}
.grid-prodindiv {grid-template-columns: repeat(auto-fill, minmax(20vw, 1fr))}
.grid-blog {grid-template-columns: repeat(auto-fill, minmax(30vw, 1fr))}
.grid-galeria {grid-template-columns: repeat(auto-fill, minmax(12.865vw, 1fr))}

.min, .min-blog {
    color: var(--claro1) !important;
    position: relative;
    margin: .417vw;
    border-radius: .417vw;
    background: linear-gradient(120deg, var(--oscuro3) 60%, var(--oscuro4) 100%);
    outline: .052vw solid transparent;
    overflow: hidden;
    box-shadow: 0 .16vw .5vw #0000002a;
    transition: .7s;
}

.min:hover, .min-blog:hover {
    background-color: var(--oscuro4);
    outline: .052vw solid var(--claro4);
    box-shadow: 0 .20vw 1vw #0000007a;
    transition: .15s;
}

.min-img {
    position: relative;
    margin: 0 0 .313vw 0;
    overflow: hidden;
}
.min-img img {border-radius: .417vw .417vw 0 0}

.min-overlay {
    position: absolute;
    width: 100%; height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #00000080;
    background-image: url("/index-img/punto.webp");
    opacity: 0;
    transition: .7s;
    z-index: 1;
}
.min-overlay div {width: 25%; height: auto;}
.min:hover .min-overlay {opacity: 1; transition: .15s}

.min-blog {
    display: flex;
    flex-direction: row;
}
.min-blog .min-img {
    min-width: 14.063vw;
    height: 7.292vw;
    margin: .313vw;
    border-radius: .21vw;
    background-size: cover;
    background-position: center;
}
.min-blog .min-titulo {padding: .781vw}

.min-titulo {padding: .75vw; padding-top: .2vw}
.min-titulo h3, .min-titulo h4, .min-titulo p {
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    -webkit-box-orient: vertical;
}

.min-titulo h3 {
    font-size: .85vw;
    font-weight: 500;
    letter-spacing: normal;
}
.min-titulo h4 {
    font-size: .625vw;
    padding-top: .156vw;
    opacity: .5;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    line-height: .85vw;
}
.min-titulo p {
    font-size: .729vw;
    margin: .5em 0;
    opacity: .5;
    line-height: 1.4em;
    -webkit-line-clamp: 3;
    line-clamp: 3;
}

.min-pie {
    color: var(--claro2);
    position: absolute;
    right: 0; bottom: 0;
    text-align: center;
    padding: .26vw .625vw .5vw .625vw;
    display: flex;
    justify-content: center;
    align-items: center;
}
.min-datos {
    position: absolute;
    left: 0; bottom: 0;
    text-align: center;
    padding: .26vw .625vw .4vw .625vw;
}
.min-datos [class*='fa-'] {margin-right: .25vw; transform: translateY(-.04vw)}

.min-pie [class*='fa-'] {color: var(--color1); margin-right: .25vw}
.min-pie .fa-eye {transform: translateY(.02vw)}
.min-pie h3 [class*='fa-'] {font-size: 80%; margin: 0; opacity: .8}
.min-pie h4 {font-size: .6vw}
.min-pie h5 {font-size: .469vw; opacity: .45}
.min-pie .separador {padding: 0 .25vw}
.grid-prod .min-pie {background-color: unset}


.min-duracion, .min-icono {
    position: absolute;
    bottom: 0; right: 0;
    margin: .417vw;
    padding: .16vw .3vw;
    border-radius: .21vw;
    background-color: #000000e0;
}
.min-duracion h4 {
    font-size: .6vw;
    font-weight: 500;
}
.min-icono {
    font-size: 1.15vw;
    background-color: unset;
    opacity: .7;
}

.min-tag,
.min-tag-masvendido {
    position: absolute;
    color: #fff;
    font-size: .573vw;
    padding: .313vw;
    border-radius: 0 0 .417vw 0;
    background: linear-gradient(135deg, var(--color2) 0%, var(--color3) 100%);
    z-index: 1;
}
.min-tag-masvendido {background-color:#e67a00}
.min-tag-oferta {
    position: absolute;
    top: .2vw; right: -.2vw;
    transform: rotate(-25deg);
    display: inline-block;
    font-size: .62vw;
    padding: .26vw .55vw .26vw .313vw;
    border-radius: .21vw;
    background: linear-gradient(135deg, var(--color2) 0%, var(--color3) 100%);
    z-index: 1;
}

.min-precio {
    display: flex;
    align-items: center;
    padding: .5vw .75vw;
    padding-top: 0;
    color: var(--color1);
}
.min-precio h4::before {
    content: 'USD$ ';
    font-size: 85%;
    color: var(--claro1);
    font-weight: 400;
    opacity: .7;
}
.min-precio h4 {font-weight: 700; font-size: .78vw}
.min-precio h5 {
    color: var(--claro1);
    text-decoration: line-through;
    padding-left: .4vw;
    opacity: .35;
}
.preciolibre .min-precio {color: #24a363}
.preciolibre h4::before,
.preciolibre h3::before {content: none !important}

/* PRODUCTOS
----------------------------------------------------------------------*/
.producto-div {
    position: relative;
    display: flex;
    padding: 1.302vw;
    margin: auto;
    justify-content: center;
    align-items: center;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    height: 43vh;
}
.producto-div:nth-of-type(even) {background: linear-gradient(-110deg, var(--oscuro2) 10%, var(--oscuro1) 100%)}
.producto-div:nth-of-type(odd) {background: linear-gradient(110deg, var(--oscuro2) 10%, var(--oscuro1) 100%)}
.producto-div:nth-of-type(even) .producto-video,
.producto-div:nth-of-type(even) .producto-imagen {position: absolute; right: 4vw}
.producto-div:nth-of-type(even) .producto-descripcion {position: absolute; left: 4vw}
.producto-div:nth-of-type(odd) .producto-video,
.producto-div:nth-of-type(odd) .producto-imagen {position: absolute; left: 4vw}
.producto-div:nth-of-type(odd) .producto-descripcion {position: absolute; right: 4vw}

.producto-video,
.producto-imagen,
.producto-descripcion {
    width: 46%;
    box-shadow: .25vw 1vw .75vw #0000002a;
}
.producto-video video,
.producto-imagen img {
    border-radius: .417vw;
    -moz-border-radius:.417vw;
	-webkit-border-radius:.417vw;
}

.producto-descripcion {
    max-width: 26.042vw;
    box-shadow: none;
    position: relative;
}
.producto-descripcion i {opacity: .5; transform: scale(.85)}
.producto-descripcion-nota {
    display: flex;
    position: absolute;
    left: -1vw; bottom: -2.8vw;
}
.producto-descripcion-nota h4 {
    color: var(--color1);
    padding: .1em .3em 0 0;
}
.producto-descripcion-nota h5 {opacity: .75}
.producto-descripcion h1 {line-height: 1em}
.producto-descripcion p {line-height: 1.3em}

.prod-enc {padding: 2vw 4vw; align-items: flex-end}
/* .prod-enc-titulo h1 {font-size: 2.6vw; margin: 0} */
.prod-enc-titulo h3 {
    opacity: .6;
    font-weight: 400;
    font-size: 1vw;
    padding-top: .2vw;
    letter-spacing: normal;
}
.prod-enc-titulo h5 {
    display: inline-block;
    background-color: var(--oscuro4);
    padding: .26vw .417vw;
    margin-bottom: .26vw;
    border-radius: .21vw;
    font-size: .6vw;
}
.prod-enc-nav {display: flex; align-items: center; margin-bottom: .15vw}
.prod-enc-nav a,
.prod-enc-nav a:visited {color: var(--claro2); transition: .7s}
.prod-enc-nav a:hover {color: var(--claro1); transition: .15s}

.prod-enc-nav a .fa-chevron-left {transform: translate(0vw, .03vw); transition: .5s}
.prod-enc-nav a:hover .fa-chevron-left {
    color: var(--color1);
    transform: translate(-.3vw, .03vw);
    transition: .15s;
}

.promo {
    overflow: hidden;
    margin: 0 4vw;
    border-radius: .417vw;
    box-shadow: .25vw 1vw .75vw #0000002a;
    display: none;
}
.promo video,
.producto-video video {user-select: none;pointer-events: none}
.promo.active {display: block}

.promominDiv {
    display: flex;
    justify-content: center;
    margin: 1vw 4vw 2vw 4vw;
}
.promomin {
    cursor: pointer;
    max-width: 5.36vw;
    margin: 0vw .4vw;
    border-radius: .21vw;
    box-shadow: .12vw .25vw .25vw #0000002a;
    outline: .052vw solid transparent;
    opacity: .6;
    transition: .35s;
}
.promomin img {border-radius: .21vw}

.promomin:hover {opacity: 1}
.promomin.active {
    outline: .052vw solid var(--claro2);
    opacity: 1;
    transition: .35s;
}

#compraindiv {margin-bottom: 2.25vw;}

.prod-indiv {
    position: relative;
    display: flex;
    justify-content: flex-start;
    padding-right: .8vw;
    background: linear-gradient(0deg, var(--oscuro1) 36%, var(--oscuro3) 36.08%) !important;
    height: 7.5vw;
}
@supports ((backdrop-filter: blur())) {
    .prod-indiv {
        background: linear-gradient(0deg, var(--oscuro1) 36%, transparent 36.08%) !important;
        backdrop-filter: blur(50px);
    }
}
.prod-indiv-img {width: 10vw; transform: translateX(-.6vw)}

.prod-indiv-info {
    position: absolute;
    top: 1.2vw; left: 9.6vw;
    max-width: 50%;
}
.prod-indiv-info h3 {
    line-height: .9em;
}
.prod-indiv-info h4 {margin: .25vw 0; opacity: .6}
.prod-indiv-info p {
    font-size: .7vw;
    line-height: 1.2;
    margin-top: .8vw;
    margin-bottom: 1.8vw;
}
.prod-indiv-precio {
    position: absolute;
    right: .26vw;
    bottom: .26vw;
    display: flex;
    align-items: center;
}
.prod-indiv-precio h3::before {
    content: 'USD$ ';
    color: var(--claro2);
    font-size: 85%;
    font-weight: 400;
}
.prod-indiv-precio h3 {
    color: #CB9342;
    font-size: .9vw;
    font-weight: 700;
    margin-right: .8vw;
}
.prod-indiv-precio h3 span {font-size: .8vw}

/* ASIDE PRODUCTOS
----------------------------------------------------------------------*/
.asideprod {
    position: fixed;
    right: 0;
    width: var(--ancho-asideprod);
    height: 100vh;
    background-color: var(--oscuro3);
    z-index: 999;
    overflow: auto;
}

.asideprod-div {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1.5vw;
}

.asideprod-logo {
    margin-top: 2.5vw;
    margin-bottom: 2.5vw;
    max-width: 15vw;
}

.asideprod-div h5 {
    color: var(--claro2);
    margin: 1.5vw 0 0 .1vw;
    text-shadow: 0 .052vw .052vw #0000003b;
}
.asideprod-div h5 a,
.asideprod-div h5 a:visited {
    color: var(--claro1);
}

.comprar-div {text-align: center; margin-bottom: 2.5vw}
.comprar-div h4 a,
.comprar-div h4 a:visited {
    cursor: pointer;
    color: var(--claro2);
    transition: .7s;
}
.comprar-div h4 a:hover {color: var(--claro1); transition: .15s}
.comprar-div h4 a .fa-chevron-down {
    transform: translateY(.075vw);
    transition: .5s;
}
.comprar-div h4 a:hover .fa-chevron-down {
    color: var(--color1);
    transform: translateY(.2vw);
    transition: .15s;
}
.comprar-div h5 {margin: .32vw}

.comprar {
    display: inline-flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: row;
    padding: .417vw;
    margin-bottom: .72vw;
    border-radius: .417vw;
    background-color: #000000bb;
    box-shadow: 0 0 0 .1vw var(--oscuro4);
}

.comprar-precio {text-align: left; margin-right: 1.302vw}
.comprar-precio h3 {padding-left: .26vw; margin: 0}
.comprar-precio h3::before {content: 'USD$ '; font-size: 85%}
.comprar-precio h4 {opacity: .6; padding-left: .26vw}
.comprar-precio h5 {
    text-decoration: line-through #d03333;
    font-weight: 700;
    margin: 0;
    padding: .05vw 0 0 .35vw;
}
.comprar-precio-descuento {
    display: flex;
    justify-content: center;
    align-items: center;
}

.comprar-descuento {
    padding: .68vw;
    margin-bottom: 1vw;
    border-radius: .21vw;
}
.comprar-oferta {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: .5vw 0 .2vw 0;
}
.oferta-codigo-div {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: left;
}
.oferta-codigo-porciento {
    padding: .18vw .32vw;
    margin-right: .5vw;
    border-radius: .21vw;
    background: linear-gradient(135deg, var(--color2) 0%, var(--color3) 100%);
}
#oferta1,
#oferta2 {color: #d0b333; margin-left: .30vw}

.prodinfo-div {width: 15vw}
.prodinfo {
    color: var(--claro1);
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .6vw 0;
    border-bottom: 1px solid #ffffff15;
}
.prodinfo h3 {font-size: .9vw}
.prodinfo h4 {color: var(--claro2)}
.prodinfo p {margin: 0; font-size: .7vw}
.prodinfo p span {font-weight: 700}
.prodinfo div {display: flex}
.prodinfo div [class*='ico-'] {margin-right: .26vw}


/* VIDEOS
----------------------------------------------------------------------*/
.vid-cont {
    width: 98%;
    margin: auto;
    background-color: #000;
    margin-top: .834vw;
    margin-bottom: .834vw;
    border-radius: .6vw;
    overflow: hidden;
    box-shadow: 0 .16vw .5vw #0000008a;
}
.vid-cont-ext {width: 100%; margin: auto}
.vid-cont-int {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 42.55%;
    overflow: hidden;
}
.vid {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
}

.vid-info {
    padding: 1vw 4vw 2vw 4vw;
    background-color: var(--oscuro2);
}
.vid-info-titulo {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
}
.vid-info-titulo h1 {
    font-size: 1.8vw;
    letter-spacing: -.03em;
    line-height: .95em;
}
.vid-info-titulo h4 span {opacity: .6}

.descripcion-video h2 {
    margin-bottom: 1vw;
    font-size: 1.3vw;
}
.descripcion-video ul {
    margin-left: 1vw;
}
.descripcion-video ul li {
    line-height: 2em;
}

/* GALERÍA
----------------------------------------------------------------------*/
.galeria-img {
    margin-top: 4vw;
}
.galeria-img img {
    margin: auto;
    margin-bottom: 1vw;
    max-width: 85%;
    max-height: 100vh;
    width: auto;
    height: auto;
}

/* BLOG
----------------------------------------------------------------------*/
.blog-video {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%
}

/* TEXTO
----------------------------------------------------------------------*/
h1, h2 {
    font-family: var(--fuente-titulos);
    font-size: 3.5vw;
    font-weight: 700;
    letter-spacing: -.03em;
    line-height: .95em;
    margin: 0 0 .6vw 0;
}
h1 span {
    font-size: 75%;
    font-weight: 400;
    line-height: 0;
    margin-left: .25vw;
}
h2 {
    font-size: 1.667vw;
    letter-spacing: -.01em;
    line-height: .95em;
}
h3 {font-size: 1.042vw}
h4, h5 {font-size: .677vw; font-weight: 400}
h5 {font-size: .573vw}

p, ol {
    font-size: .938vw;
    line-height: 1.5em;
    margin: 1vw 0;
}

.textocolor-1, .textocolor-2, .textocolor-3 {
    display: inline;
    color: transparent;
    background-clip: text !important;
    -webkit-background-clip: text !important;
}
.textocolor-1 {
    background: linear-gradient(135deg, var(--color2) 0%, var(--color3) 100%);
}

.h1-separador {
    width: 100%;
    max-width: 3.2vw;
    height: .15625vw;
    margin: 1.25vw 0 0 0;
    background: linear-gradient(135deg, var(--color2) 0%, var(--color3) 100%);
    border-radius: .417vw;
}

.nota {
    opacity: .7;
    font-size: .65vw;
    font-style: italic;
    text-align: center;
    margin: 0;
}

.teclas {
    font-size: .833vw;
    /* font-family: var(--fuente-titulos); */
    color:#ffc188;
    font-weight: 700;
    letter-spacing: normal;
    padding: .104vw .417vw;
    border-radius: .21vw;
    outline: .052vw solid var(--oscuro4);
    background-color: var(--oscuro3);
}

.teclamas::after {
    font-weight: 400;
    padding: 0 .104vw;
    color: var(--claro1);
    content: "+";
}

.tarjeta {
    font-size: .8vw;
    text-align: center;
    letter-spacing: normal;
    background-color: #0e0f11;
    outline: .052vw solid var(--oscuro4);
    border-radius: .21vw;
    padding: .521vw 1.302vw;
    max-width: 21.875vw;
    margin: auto;
}

/* INICIO
----------------------------------------------------------------------*/
.pantcomp-div {
    display: flex;
    justify-content: space-between;
}

.pantcomp-izq {
    height: 100vh;
    width: 45vw;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #111111ef;
    clip-path: polygon(0 0, 100% 0, 75% 100%, 0% 100%);
}

.pantcomp-izq h3 {font-family: var(--fuente-titulos)}
.pantcomp-izq a {
    color: var(--claro2);
    transition: .7s;
}
.pantcomp-izq a:hover {
    color: var(--claro1);
    transition: .15s;
}

.pantcomp-titulo {margin-right: 3.646vw}

.pantcomp-der {
    height: 100vh;
    width: 55vw;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.pantcomp-der p {
    width: 100%;
    max-width: 33.333vw;
    text-align: left;
    margin-bottom: .521vw;
    opacity: 1;
}

.pantcomp-contenido {
    width: 100%;
    height: 100%;
    max-width: 33.333vw;
    max-height: 18.75vw;
    border-radius: .21vw;
    background-color: #000;
    background-size: cover;
    background-position: center;
}

/* AJUSTE PARA MÓVILES
----------------------------------------------------------------------*/
@media only screen and (max-width: 710px) {
    .imagotipo, #menu-productos {display: none}
    .isotipo {
        width: 9.5vw;
        height: auto;
        margin: 3vw 0vw 8vw .85vw;
        display: block;
        border-radius: 0;
    }
    footer .iconos, footer .copyright, .cukis {display: none}
    
    header {width: 14vw}
    nav span {display: none}
    nav a, nav a:visited {
        font-size: 7vw;
        padding: 1.781vw .938vw;
        margin: 2vw 0 5vw 2vw;
    }
    nav a:hover, nav a:active, .menu-activo {
        margin: 2vw 0 5vw 2vw;
    }
    .contenedor {
        width: 86%;
        left: 14vw;
    }
    .submenu-div {display: none}
    .submenu-div + .contenido {margin-top: 0vw}

    .banner {
        width: 100%; height: 38.28vw;
        padding: 6vw;
        background-size: cover;
        background-position: center;
        margin: auto;
        margin-top: 0vw;
    }
    .banner .boton-rojo {
        margin-right: 42vw !important;
    }
    [class*='boton-'] a,
    [class*='boton-'] a:visited {
        font-size: 3vw;
        padding: 1.521vw 1.781vw;
        border-radius: 1vw;
    }

    .grid {display:flex; flex-direction: column; padding: 1.417vw}
    .grid-main {grid-template-columns: repeat(auto-fill, minmax(46.667vw, 2fr))}
    .grid-prod {width: 86%;}
    .grid-prodindiv {grid-template-columns: repeat(auto-fill, minmax(20vw, 2fr))}
    .grid-blog {width: 86%;}
    .grid-galeria {grid-template-columns: repeat(auto-fill, minmax(12.865vw, 1fr))}

    .min, .min-blog {
        width: 76vw;
        margin: 4vw;
        border-radius: 2.417vw;
        outline: .052vw solid transparent;
        box-shadow: 0 .16vw .5vw #0000002a;
    }

.min-img {margin: 0 0 1vw 0}
.min-img img {border-radius: 2.417vw 2.417vw 0 0}

.min-blog {
    display: flex;
    flex-direction: column;
}
.min-blog .min-img {
    height: 20vh;
    margin: 0;
    border-radius: 2vw 2vw 0 0;
}
.min-blog .min-titulo {padding: 3vw}

.min-titulo {padding: 3vw; margin-bottom: 7vw;}
.grid-prod .min-titulo {margin-bottom: 0vw;}
.min-titulo h3 {font-size: 6vw}
.min-titulo h4 {
    font-size: 4vw;
    padding-top: 2vw;
    line-height: 6vw;
}
.min-titulo p {
    font-size: 4vw;
    margin: .5em 0;
    opacity: .5;
    line-height: 1.4em;
    -webkit-line-clamp: 3;
    line-clamp: 3;
}
.min-titulo h3, .min-titulo h4 {
    -webkit-line-clamp: 2;
    line-clamp: 2;
}
.min-datos {padding-top: 6vw;}

.min-pie {padding: 1.26vw 1.625vw 1.5vw 1.625vw}
.min-datos {padding: 2.26vw 2.625vw 2.4vw 2.625vw}
.min-datos [class*='fa-'] {margin-right: .25vw; transform: translateY(-.04vw)}

.min-pie [class*='fa-'] {margin-right: .25vw}
.min-pie .fa-eye {transform: translateY(.02vw)}
.min-pie h3 [class*='fa-'] {font-size: 6vw}
.min-pie h4 {font-size: 3.5vw}
.min-pie h5 {font-size: 2.469vw}
.min-pie .separador {padding: 0 2.25vw}

.min-duracion, .min-icono {
    margin: 2.417vw;
    padding: 1.16vw 1.3vw;
    border-radius: 1.21vw;
}
.min-duracion h4 {font-size: 4vw}
.min-icono {font-size: 6vw}

.min-precio {padding: 3vw}
.min-precio h4 {font-size: 6vw}
.min-precio h5 {font-size: 4vw; padding-left: 4vw}

article {padding: 0}
.art-enc {padding: 3vw 4vw .5vw 4vw}
.art-enc-info h1 {max-width: 86vw}
.art-enc-info h4 {padding: 1vw 0 0 0}

.art-cont {padding: 0 4vw 2vw 4vw}
.art-cont img {margin: 1.2vw 0 1.2vw 0}

.art-wrap {
    padding: 0 2vw;
    justify-content: center;
    margin: 2vw 0 5vw 0;
}
.art-wrap-movil {
    flex-direction: column-reverse;
    align-items: center;
}
.art-wrap-img img {
    width: 60vw;
}
.art-wrap-img,
.art-wrap-text {padding: 2vw}
.art-wrap-text p {margin: 3vw 0}
.art-wrap-text h4 {padding-top: .5vw}

.compartirDiv, .compartir {display: none}

.art-wrap-text .iconos a {font-size: 4vw}
.art-wrap-img {display: block}
.imagotipo {width: 80% !important}

/* TEXTO - MOVIL
----------------------------------------------------------------------*/
h1, h2, .vid-info-titulo h1 {
    font-size: 7.5vw;
    letter-spacing: -.03em;
    line-height: .95em;
    margin: 0 0 2vw 0;
}
h1 span {
    font-size: 75%;
    margin-left: .25vw;
}
h2 {
    font-size: 5.5vw;
    letter-spacing: -.01em;
    line-height: 1.4em;
}
h3 {font-size: 1.042vw}
h4, h5 {font-size: 3.5vw; font-weight: 400}
h5 {font-size: .573vw}

p, ol {
    font-size: 4vw;
    line-height: 1.4em;
    margin: 1vw 0;
}

.h1-separador {
    width: 100%;
    max-width: 10vw;
    height: .5vw;
    margin: 3vw 0 3vw 0;
    background: linear-gradient(135deg, var(--color2) 0%, var(--color3) 100%);
    border-radius: .417vw;
}

.teclas {
    font-size: 4vw;
    padding: .5vw 1vw;
    border-radius: 1vw;
    outline: 0;
    background-color: unset;
}
.teclamas::after {padding: 0 1vw}

.tarjeta {
    font-size: 4vw;
    outline: .4vw solid var(--oscuro4);
    border-radius: 2vw;
    padding: 2vw;
    margin: 2vw;
    max-width: 86vw;
}
img, video {border-radius: 2vw}

#logo-rde-movil {
    display: block;
    width: 60vw;
    margin: 3vw auto 6vw auto;
}
.pantcomp-izq {
    height: 100vh;
    width: 100vw;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: #111111ef;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
    text-align: center;
}
.pantcomp-titulo {margin-left: 4vw !important}
.pantcomp-izq h3 {font-size: 3vw;}
.pantcomp-izq .h1-separador {margin: 6vw auto 3vw auto;}

}