/* 18 SETIEMBRE 2025 */
/* 13 SETIEMBRE 2025 */
@import url('https://fonts.googleapis.com/css2?family=Roboto+Serif:ital,opsz,wght@0,8..144,100..900;1,8..144,100..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
.serif, .roboto-serif {
font-family: "Roboto Serif", serif;
font-optical-sizing: auto;
font-style: normal;
font-variation-settings:
"wdth" 100,
"GRAD" 0;
}
.san-serif, .roboto {
font-family: "Roboto", sans-serif;
font-optical-sizing: auto;
font-style: normal;
font-variation-settings:
"wdth" 100;
}
:root {
--font-serif: "Roboto Serif";
--font-san-serif: "Roboto";
--font-size-4xlarge : clamp(1.0rem, 1.7rem + 1vw, 1.80rem + 0.2vw);/* H1 */
--font-size-3xlarge : clamp(1.0rem, 1.6rem + 1vw, 1.70rem + 0.2vw);/* H2 */
--font-size-2xlarge : clamp(1.0rem, 1.5rem + 1vw, 1.60rem + 0.2vw);/* H3 */
--font-size-xlarge  : clamp(1.0rem, 1.4rem + 1vw, 1.50rem + 0.2vw);/* H4 */
--font-size-large   : clamp(1.0rem, 1.3rem + 1vw, 1.40rem + 0.2vw);/* H5 */
--font-size-medium  : clamp(1.0rem, 1.2rem + 1vw, 1.30rem + 0.2vw);/* H6 */
--font-size-small   : clamp(1.1rem, 1.3rem + 1vw, 1.20rem + 0.2vw);/* STRONG */
--font-size-xsmall  : clamp(1.1rem, 1.3rem + 1vw, 1.10rem + 0.2vw);/* P */
--font-size-2xsmall : clamp(1.1rem, 0.9rem + 1vw, 0.90rem + 0.2vw);/* SMALL */
--font-size-3xsmall : clamp(1.0rem, 0.8rem + 1vw, 0.70rem + 0.2vw);/* em */
--font-size-4xsmall : clamp(0.8rem, 0.7rem + 1vw, 0.50rem + 0.2vw);/* del */
--lineheight-4xlarge : clamp(1rem, 2.0rem + 1vw, 2.2rem + 0.2vw);
--lineheight-3xlarge : clamp(1rem, 1.9rem + 1vw, 2.1rem + 0.2vw);
--lineheight-2xlarge : clamp(1rem, 1.8rem + 1vw, 2.0rem + 0.2vw);
--lineheight-xlarge  : clamp(1rem, 1.7rem + 1vw, 1.9rem + 0.2vw);
--lineheight-large   : clamp(1rem, 1.6rem + 1vw, 1.8rem + 0.2vw);
--lineheight-medium  : clamp(1rem, 1.4rem + 1vw, 1.7rem + 0.2vw);
--lineheight-small   : clamp(1rem, 1.6rem + 1vw, 1.6rem + 0.2vw);
--lineheight-xsmall  : clamp(1rem, 1.3rem + 1vw, 1.5rem + 0.2vw);
--lineheight-2xsmall : clamp(1rem, 1.2rem + 1vw, 1.4rem + 0.2vw);
--lineheight-3xsmall : clamp(1.3rem, 1.5rem + 1vw, 1.1rem + 0.2vw);
--lineheight-4xsmall : clamp(1rem, 1.0rem + 1vw, 0.8rem + 0.2vw);
--margenes-4xlarge  : calc(2.5% + 55px) ;
--margenes-3xlarge  : calc(2.5% + 50px) ;
--margenes-2xlarge  : calc(2.5% + 45px) ;
--margenes-xlarge   : calc(1.8% + 40px) ;
--margenes-large    : calc(1.6% + 35px) ;
--margenes-medium   : calc(1.5% + 30px) ;
--margenes-small    : calc(0.8% + 25px) ;
--margenes-xsmall   : calc(0.5% + 20px) ;
--margenes-2xsmall  : calc(0.1% + 15px) ;
--margenes-3xsmall  : calc(0.1% + 10px) ;
--margenes-4xsmall  : calc(0.1% + 05px) ;
--margenes-gap-4xlarge : 55px;
--margenes-gap-3xlarge : 50px;
--margenes-gap-2xlarge : 45px;
--margenes-gap-xlarge  : 40px;
--margenes-gap-large   : 35px;
--margenes-gap-medium  : 30px;
--margenes-gap-small   : 25px;
--margenes-gap-xsmall  : 20px;
--margenes-gap-2xsmall : 15px;
--margenes-gap-3xsmall : 10px;
--margenes-gap-4xsmall : 05px;
--border-radius-4xlarge   : calc(1.1% + 22px) ;
--border-radius-3xlarge   : calc(1.0% + 20px) ;
--border-radius-2xlarge   : calc(0.9% + 18px) ;
--border-radius-xlarge    : calc(0.8% + 16px) ;
--border-radius-large     : calc(0.7% + 14px) ;
--border-radius-medium    : calc(0.6% + 12px) ;
--border-radius-small     : calc(0.5% + 10px) ;
--border-radius-xsmall    : calc(0.4% + 08px) ;
--border-radius-2xsmall   : calc(0.3% + 06px) ;
--border-radius-3xsmall   : calc(0.2% + 04px) ;
--border-radius-4xsmall   : calc(0.1% + 02px) ;
--col-magenta   : #ff4077 ;
--col-fucsia    : #da2e58 ;
--col-rojo      : #db0e15 ;
--col-marron    : #6b3b2a ;
--col-pardo     : #8b5e3c ;
--col-greige    : #aa9280 ;
--col-crema     : #f3ede6 ;
--col-pino      : #1c381a ;
--col-salvia    : #6f7467 ;
--col-naranja   : #ff812e ;
--col-anaranjado: #ffb422 ;
--col-mostaza   : #ffdb00 ;
--col-limon     : #91f369 ;
--col-manzana   : #74b52e ;
--col-verde     : #00a651 ;
--col-esmeralda : #029274 ;
--col-turquesa  : #31d4c5 ;
--col-celeste   : #54bcf6 ;
--col-cielo     : #087cbf ;
--col-azul      : #064878 ;
--col-indigo    : #3f3f7f ;
--col-purpura   : #a142b3 ;
--col-violeta   : #7445be ;
--col-noche     : #1a2630 ;
--col-azulado   : #2f475e ;
--col-metal     : #4a6585 ;
--col-acero     : #788ca3 ;
--col-aluminio  : #a5b2c2 ;
--col-plateado  : #d1d8e0 ;
--col-humo      : #e7ebee ;
--col-blanco    : #ffffff ;
--col-gris05    : #f7f7f7 ;
--col-gris10    : #e7e7e7 ;
--col-gris20    : #cfd0d0 ;
--col-gris30    : #b7b8b9 ;
--col-gris40    : #9fa1a2 ;
--col-gris50    : #87898b ;
--col-gris60    : #6f7274 ;
--col-gris70    : #575a5d ;
--col-gris80    : #3e4246 ;
--col-gris90    : #262b2f ;
--col-negro     : #000000 ;
--col-fuente    : #212529 ;
--col-oscuro    : #262b2f ;
--col-grisoscuro: #404449 ;
--col-grismedio : #5c6368 ;
--col-grisclaro : #b6babf ;
--col-gristenue : #ebebed ;
--svg-magenta: invert(30%) sepia(100%) saturate(1000%) hue-rotate(300deg) brightness(100%) contrast(100%);
--svg-fucsia: invert(25%) sepia(100%) saturate(1000%) hue-rotate(310deg) brightness(100%) contrast(100%);
--svg-rojo: invert(13%) sepia(100%) saturate(1000%) hue-rotate(320deg) brightness(150%) contrast(110%);
--svg-marron: invert(13%) sepia(100%) saturate(1000%) hue-rotate(376deg) brightness(150%) contrast(110%);
--svg-pardo: invert(20%) sepia(100%) saturate(1000%) hue-rotate(373deg) brightness(122%) contrast(71%);
--svg-greige: invert(37%) sepia(100%) saturate(1000%) hue-rotate(343deg) brightness(196%) contrast(31%);
--svg-crema: invert(110%) sepia(100%) saturate(847%) hue-rotate(298deg) brightness(110%) contrast(85%);
--svg-pino: invert(22%) sepia(100%) saturate(1000%) hue-rotate(427deg) brightness(48%) contrast(86%);
--svg-salvia: invert(16%) sepia(100%) saturate(1000%) hue-rotate(393deg) brightness(122%) contrast(29%);
--svg-naranja: invert(16%) sepia(100%) saturate(500%) hue-rotate(340deg) brightness(300%) contrast(100%);
--svg-anaranjado: invert(22%) sepia(100%) saturate(500%) hue-rotate(350deg) brightness(300%) contrast(100%);
--svg-mostaza: invert(23%) sepia(100%) saturate(500%) hue-rotate(370deg) brightness(300%) contrast(100%);
--svg-limon: invert(22%) sepia(142%) saturate(315%) hue-rotate(406deg) brightness(329%) contrast(86%);
--svg-manzana: invert(16%) sepia(102%) saturate(634%) hue-rotate(401deg) brightness(284%) contrast(110%);
--svg-verde: invert(14%) sepia(94%) saturate(207%) hue-rotate(428deg) brightness(308%) contrast(154%);
--svg-esmeralda: invert(12%) sepia(100%) saturate(205%) hue-rotate(474deg) brightness(315%) contrast(160%);
--svg-turquesa: invert(17%) sepia(96%) saturate(204%) hue-rotate(484deg) brightness(301%) contrast(160%);
--svg-celeste: invert(16%) sepia(100%) saturate(200%) hue-rotate(520deg) brightness(310%) contrast(160%);
--svg-cielo: invert(12%) sepia(100%) saturate(201%) hue-rotate(514deg) brightness(312%) contrast(177%);
--svg-azul: invert(8%) sepia(100%) saturate(463%) hue-rotate(524deg) brightness(251%) contrast(99%);
--svg-indigo: invert(15%) sepia(54%) saturate(274%) hue-rotate(555deg) brightness(222%) contrast(182%);
--svg-purpura: invert(16%) sepia(70%) saturate(307%) hue-rotate(244deg) brightness(232%) contrast(166%);
--svg-violeta: invert(17%) sepia(78%) saturate(275%) hue-rotate(217deg) brightness(212%) contrast(180%);
--svg-noche: invert(8%) sepia(437%) saturate(35%) hue-rotate(522deg) brightness(347%) contrast(223%);
--svg-azulado: invert(8%) sepia(458%) saturate(90%) hue-rotate(527deg) brightness(373%) contrast(168%);
--svg-metal: invert(8%) sepia(536%) saturate(113%) hue-rotate(532deg) brightness(423%) contrast(130%);
--svg-acero: invert(10%) sepia(556%) saturate(89%) hue-rotate(535deg) brightness(447%) contrast(105%);
--svg-aluminio: invert(11%) sepia(515%) saturate(55%) hue-rotate(535deg) brightness(555%) contrast(78%);
--svg-blanco : invert(100%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(300%) contrast(300%);
--svg-gris05: invert(96%) saturate(0%);
--svg-gris10: invert(91%) saturate(0%);
--svg-gris20: invert(81%) saturate(0%);
--svg-gris30: invert(72%) saturate(0%);
--svg-gris40: invert(63%) saturate(0%);
--svg-gris50: invert(54%) saturate(0%);
--svg-gris60: invert(42%) saturate(0%);
--svg-gris70: invert(35%) saturate(0%);
--svg-gris80: invert(26%) saturate(0%);
--svg-gris90: invert(17%) saturate(0%);
--svg-plateado: invert(11%) sepia(510%) saturate(24%) hue-rotate(535deg) brightness(609%) contrast(103%);
--svg-humo: invert(11%) sepia(510%) saturate(11%) hue-rotate(535deg) brightness(635%) contrast(118%);
--svg-fuente : invert(5%) sepia(100%) saturate(100%) hue-rotate(81deg) brightness(100%) contrast(79%);
--svg-oscuro: invert(7%) sepia(495%) saturate(29%) hue-rotate(538deg) brightness(335%) contrast(153%);
--svg-grisoscuro : invert(7%) sepia(154%) saturate(159%) hue-rotate(182deg) brightness(128%) contrast(61%);
--svg-grismedio : invert(14%) sepia(72%) saturate(154%) hue-rotate(159deg) brightness(116%) contrast(37%);
--svg-grisclaro : invert(46%) sepia(76%) saturate(108%) hue-rotate(161deg) brightness(201%) contrast(20%) ;
--svg-gristenue : invert(52%) sepia(92%) saturate(99%) hue-rotate(146deg) brightness(203%) contrast(88%) ;
--trans-10      : #00000010 ;
--trans-20      : #00000020 ;
--trans-30      : #00000030 ;
--trans-40      : #00000040 ;
--trans-50      : #00000050 ;
--trans-60      : #00000060 ;
--trans-70      : #00000070 ;
--trans-80      : #00000080 ;
--trans-90      : #00000090 ;
--trans-blanco-10      : #ffffff10 ;
--trans-blanco-20      : #ffffff20 ;
--trans-blanco-30      : #ffffff30 ;
--trans-blanco-40      : #ffffff40 ;
--trans-blanco-50      : #ffffff50 ;
--trans-blanco-60      : #ffffff60 ;
--trans-blanco-70      : #ffffff70 ;
--trans-blanco-80      : #ffffff80 ;
--trans-blanco-90      : #ffffff90 ;
}
* {
box-sizing: border-box;
padding: 0;
margin: 0;
padding: 0;
}
html{
color:var(--col-fuente);
}
body {
font-family: var(--font-san-serif);
display: flex;
min-height: 100vh;
flex-direction: column;
}
main{
margin: var(--margenes-4xsmall) 0;
flex: 1 0 auto;
overflow: hidden;
}
h1 {
font-size: var(--font-size-4xlarge);
line-height: var(--lineheight-xlarge);
margin-bottom: var(--margenes-4xsmall);
font-weight: 400;
display: block;
}
h2 {
font-size: var(--font-size-3xlarge);
line-height: var(--lineheight-large);
margin-bottom: var(--margenes-4xsmall);
font-weight: 400;
display: block;
}
h3 {
font-size: var(--font-size-2xlarge);
line-height: var(--lineheight-large);
margin-bottom: var(--margenes-4xsmall);
font-weight: 400;
display: block;
}
h4 {
font-size: var(--font-size-xlarge)!important;
line-height: var(--lineheight-medium);
margin-bottom: var(--margenes-4xsmall);
font-weight: 600;
display: block;
}
h5 {
font-size: var(--font-size-large);
line-height: var(--lineheight-small);
margin-bottom: var(--margenes-4xsmall);
font-weight: 400;
display: block;
}
h6 {
font-size: var(--font-size-2xsmall)!important;
line-height: var(--lineheight-3xsmall);
margin-bottom: var(--margenes-4xsmall);
font-weight: 600;
display: block;
}
strong {
font-size: var(--font-size-small);
line-height: var(--lineheight-xsmall);
margin-bottom: var(--margenes-small);
font-weight: 600;
display: block;
}
p {
font-size: var(--font-size-xsmall);
line-height: var(--lineheight-2xsmall);
margin-bottom: var(--margenes-small);
font-weight: 400;
display: block;
}
small {
font-size: var(--font-size-3xsmall)!important;
line-height: var(--lineheight-4xsmall);
margin: var(--margenes-3xsmall) 0;
font-weight: 400;
display: block;
}
em {
font-size: var(--font-size-2xsmall);
line-height: var(--lineheight-3xsmall);
margin-bottom: var(--margenes-3xsmall);
font-weight: 400;
font-style: normal;
display: block;
}
del {
font-size: var(--font-size-3xsmall);
line-height: var(--lineheight-3xsmall);
margin-bottom: var(--margenes-4xsmall);
font-weight: 500;
display: block;
font-style: normal;
text-decoration: none;
}
svg{
width:100%;
}
button{
color: var(--col-blanco)!important;
padding: var(--margenes-3xsmall) var(--margenes-2xsmall);
box-sizing: border-box;
display: inline-block;
font-size: var(--font-size-3xsmall);
border-block-start-width: 4px;
border-block-end-width: 4px;
border-block-start-style: solid;
border-block-end-style: solid;
border-block-start-color: var(--trans-blanco-20);
border-block-end-color: var(--trans-30);
border-inline-start-width: 4px;
border-inline-end-width: 4px;
border-inline-start-style: solid;
border-inline-end-style: solid;
border-inline-start-color:  var(--trans-blanco-20);
border-inline-end-color: var(--trans-40);
}
button:hover{
background: var(--trans-90)!important;
border-block-start-width: 4px;
border-block-end-width: 4px;
border-block-start-style: solid;
border-block-end-style: solid;
border-block-start-color: var(--trans-60);
border-block-end-color: var(--trans-blanco-30);
border-inline-start-width: 4px;
border-inline-end-width: 4px;
border-inline-start-style: solid;
border-inline-end-style: solid;
border-inline-start-color:  var(--trans-20);
border-inline-end-color: var(--trans-blanco-40);
}
span {
font-size: var(--font-size-4xsmall);
line-height: var(--lineheight-4xsmall);
display: block;
}
figure{
position: relative;
}
figure figcaption {
font-size: var(--font-size-4xsmall);
line-height: var(--lineheight-4xsmall);
padding: var(--margenes-4xsmall) var(--margenes-3xsmall);
width: 100%;
z-index: 1;
background: var(--trans-40);
color: var(--col-blanco);
position: absolute;
bottom: 0;
}
sub {
line-height: 140%;
display: block;
}
mark {
background: #ffc60054;
padding: 0 var(--margenes-4xsmall);
border-radius: var(--margenes-4xsmall);
display: inline-block;
}
hr {
display: block;
width: 100%;
height: 1px;
background: var(--col-grisclaro)!important;
border: none;
    display: inline-block;
}
ul{
list-style: none ;
}
a {
color: var(--col-fuente);
text-decoration: none;
}
a:hover {
color: var(--col-cielo);
text-decoration: underline;
}
a:link {
color: var(--col-cielo);
}
a:active {
color: var(--col-cielo);
}
/* a:visited {
color: var(--col-fuente);
}
a:focus {
color:var(--col-fuente);
}
img {
width: 100%;
display: block;
} */
img {
max-width: 100%;
width: 100%;
height: auto;
vertical-align: middle;
display: inline-block;
}
/* ///////////////// CONTENEDORES ///////////////// */
.container          { max-width: 1200px; width: 100%;margin: auto;}
.container-full     { max-width: 100% !important; width: 100% !important; margin: auto; display: block; padding: 0 var(--margenes-3xsmall);}
.container-2xlarge  { max-width: 1920px !important; width: 100% !important; margin: auto; display: block; padding: 0 var(--margenes-3xsmall);}
.container-xlarge   { max-width: 1600px !important; width: 100% !important; margin: auto; display: block; padding: 0 var(--margenes-3xsmall);}
.container-large    { max-width: 1440px !important; width: 100% !important; margin: auto; display: block; padding: 0 var(--margenes-3xsmall); }
.container-medium   { max-width: 1366px !important; width: 100% !important; margin: auto; display: block; padding: 0 var(--margenes-3xsmall);}
.container-small    { max-width: 1200px !important; width: 100% !important; margin: auto; display: block; padding: 0 var(--margenes-3xsmall);}
.container-xsmall   { max-width: 1024px !important; width: 100% !important; margin: auto; display: block; padding: 0 var(--margenes-3xsmall);}
.container-2xsmall  { max-width: 800px !important; width: 100% !important; margin: auto; display: block; padding: 0 var(--margenes-3xsmall);}
.container-3xsmall  { max-width: 603px !important; width: 100% !important; margin: auto; display: block; padding: 0 var(--margenes-3xsmall);}
/* ///////////////// COLORES BACK ///////////////// */
.magenta { background: var(--col-magenta )}
.fucsia { background: var(--col-fucsia)}
.rojo { background: var(--col-rojo)}
.marron { background: var(--col-marron )}
.pardo { background: var(--col-pardo)}
.greige { background: var(--col-greige )}
.crema { background: var(--col-crema)}
.pino { background: var(--col-pino)}
.salvia { background: var(--col-salvia)}
.naranja { background: var(--col-naranja )}
.mostaza { background: var(--col-mostaza)}
.limon { background: var(--col-limon)}
.manzana { background: var(--col-manzana )}
.verde { background: var(--col-verde)}
.esmeralda { background: var(--col-esmeralda)}
.turquesa { background: var(--col-turquesa)}
.celeste { background: var(--col-celeste)}
.cielo { background: var(--col-cielo)}
.azul { background: var(--col-azul)}
.indigo { background: var(--col-indigo)}
.purpura { background: var(--col-purpura )}
.violeta { background: var(--col-violeta)}
.noche { background: var(--col-noche)}
.azulado { background: var(--col-azulado)}
.metal { background: var(--col-metal)}
.acero { background: var(--col-acero)}
.aluminio { background: var(--col-aluminio)}
.plateado { background: var(--col-plateado)}
.humo { background: var(--col-humo)}
.blanco { background: var(--col-blanco)}
.gris05 { background: var(--col-gris05)}
.gris10 { background: var(--col-gris10)}
.gris20 { background: var(--col-gris20)}
.gris30 { background: var(--col-gris30)}
.gris40 { background: var(--col-gris40)}
.gris50 { background: var(--col-gris50)}
.gris60 { background: var(--col-gris60)}
.gris70 { background: var(--col-gris70)}
.gris80 { background: var(--col-gris80)}
.gris90 { background: var(--col-gris90)}
.negro { background: var(--col-negro)}
.fuente { background: var(--col-fuente)}
.oscuro { background: var(--col-oscuro)!important}
.grisoscuro { background: var(--col-grisoscuro)}
.grismedio { background: var(--col-grismedio)}
.grisclaro { background: var(--col-grisclaro)}
.gristenue { background: var(--col-gristenue)}
/* ///////////////// COLORES TEXT ///////////////// */
.text-magenta { color: var(--col-magenta )}
.text-fucsia { color: var(--col-fucsia)}
.text-rojo { color: var(--col-rojo)}
.text-marron { color: var(--col-marron )}
.text-pardo { color: var(--col-pardo)}
.text-greige { color: var(--col-greige )}
.text-crema { color: var(--col-crema)}
.text-pino { color: var(--col-pino)}
.text-salvia { color: var(--col-salvia)}
.text-naranja { color: var(--col-naranja )}
.text-mostaza { color: var(--col-mostaza)}
.text-limon { color: var(--col-limon)}
.text-manzana { color: var(--col-manzana )}
.text-verde { color: var(--col-verde)}
.text-esmeralda { color: var(--col-esmeralda)}
.text-turquesa { color: var(--col-turquesa)}
.text-celeste { color: var(--col-celeste)}
.text-cielo { color: var(--col-cielo)}
.text-azul { color: var(--col-azul)}
.text-indigo { color: var(--col-indigo)}
.text-purpura { color: var(--col-purpura )}
.text-violeta { color: var(--col-violeta)}
.text-noche { color: var(--col-noche)}
.text-azulado { color: var(--col-azulado)}
.text-metal { color: var(--col-metal)}
.text-acero { color: var(--col-acero)}
.text-aluminio { color: var(--col-aluminio)}
.text-plateado { color: var(--col-plateado)}
.text-humo { color: var(--col-humo)}
.text-blanco { color: var(--col-blanco)!important}
.text-gris05 { color: var(--col-gris05)}
.text-gris10 { color: var(--col-gris10)}
.text-gris20 { color: var(--col-gris20)}
.text-gris30 { color: var(--col-gris30)}
.text-gris40 { color: var(--col-gris40)}
.text-gris50 { color: var(--col-gris50)}
.text-gris60 { color: var(--col-gris60)}
.text-gris70 { color: var(--col-gris70)}
.text-gris80 { color: var(--col-gris80)}
.text-gris90 { color: var(--col-gris90)}
.text-negro { color: var(--col-negro)}
.text-fuente { color: var(--col-fuente)}
.text-oscuro { color: var(--col-oscuro)}
.text-grisoscuro { color: var(--col-grisoscuro)}
.text-grismedio { color: var(--col-grismedio)}
.text-grisclaro { color: var(--col-grisclaro)}
.text-gristenue { color: var(--col-gristenue)}
/* ///////////////// BORDER COLORES ///////////////// */
.border-magenta { border-color: var(--col-magenta )}
.border-fucsia { border-color: var(--col-fucsia)}
.border-rojo { border-color: var(--col-rojo)}
.border-marron { border-color: var(--col-marron )}
.border-pardo { border-color: var(--col-pardo)}
.border-greige { border-color: var(--col-greige )}
.border-crema { border-color: var(--col-crema)}
.border-pino { border-color: var(--col-pino)}
.border-salvia { border-color: var(--col-salvia)}
.border-naranja { border-color: var(--col-naranja )}
.border-mostaza { border-color: var(--col-mostaza)}
.border-limon { border-color: var(--col-limon)}
.border-manzana { border-color: var(--col-manzana )}
.border-verde { border-color: var(--col-verde)}
.border-esmeralda { border-color: var(--col-esmeralda)}
.border-turquesa { border-color: var(--col-turquesa)}
.border-celeste { border-color: var(--col-celeste)}
.border-cielo { border-color: var(--col-cielo)}
.border-azul { border-color: var(--col-azul)}
.border-indigo { border-color: var(--col-indigo)}
.border-purpura { border-color: var(--col-purpura )}
.border-violeta { border-color: var(--col-violeta)}
.border-noche { border-color: var(--col-noche)}
.border-azulado { border-color: var(--col-azulado)}
.border-metal { border-color: var(--col-metal)}
.border-acero { border-color: var(--col-acero)}
.border-aluminio { border-color: var(--col-aluminio)}
.border-plateado { border-color: var(--col-plateado)}
.border-humo { border-color: var(--col-humo)}
.border-blanco { border-color: var(--col-blanco)}
.border-gris05 { border-color: var(--col-gris05)}
.border-gris10 { border-color: var(--col-gris10)}
.border-gris20 { border-color: var(--col-gris20)}
.border-gris30 { border-color: var(--col-gris30)}
.border-gris40 { border-color: var(--col-gris40)}
.border-gris50 { border-color: var(--col-gris50)}
.border-gris60 { border-color: var(--col-gris60)}
.border-gris70 { border-color: var(--col-gris70)}
.border-gris80 { border-color: var(--col-gris80)}
.border-gris90 { border-color: var(--col-gris90)}
.border-negro { border-color: var(--col-negro)}
.border-fuente { border-color: var(--col-fuente)}
.border-oscuro { border-color: var(--col-oscuro)}
.border-grisoscuro { border-color: var(--col-grisoscuro)}
.border-grismedio { border-color: var(--col-grismedio)}
.border-grisclaro { border-color: var(--col-grisclaro)}
.border-gristenue { border-color: var(--col-gristenue)}
/* ///////////////// COLORES SVG ///////////////// */
.svg-magenta { filter: var(--svg-magenta) }
.svg-fucsia { filter: var(--svg-fucsia) }
.svg-rojo { filter: var(--svg-rojo) }
.svg-marron { filter: var(--svg-marron) }
.svg-pardo { filter: var(--svg-pardo) }
.svg-greige { filter: var(--svg-greige) }
.svg-crema { filter: var(--svg-crema) }
.svg-pino { filter: var(--svg-pino) }
.svg-salvia { filter: var(--svg-salvia) }
.svg-naranja { filter: var(--svg-naranja) }
.svg-anaranjado { filter: var(--svg-anaranjado) }
.svg-mostaza { filter: var(--svg-mostaza) }
.svg-limon { filter: var(--svg-limon) }
.svg-manzana { filter: var(--svg-manzana) }
.svg-verde { filter: var(--svg-verde) }
.svg-esmeralda { filter: var(--svg-esmeralda) }
.svg-turquesa { filter: var(--svg-turquesa) }
.svg-celeste { filter: var(--svg-celeste) }
.svg-cielo { filter: var(--svg-cielo) }
.svg-azul { filter: var(--svg-azul) }
.svg-indigo { filter: var(--svg-indigo) }
.svg-purpura { filter: var(--svg-purpura) }
.svg-violeta { filter: var(--svg-violeta) }
.svg-noche { filter: var(--svg-noche) }
.svg-azulado { filter: var(--svg-azulado) }
.svg-metal { filter: var(--svg-metal) }
.svg-acero { filter: var(--svg-acero) }
.svg-aluminio { filter: var(--svg-aluminio) }
.svg-plateado { filter: var(--svg-plateado) }
.svg-humo { filter: var(--svg-humo) }
.svg-blanco { filter:var(--svg-blanco)!important; }
.svg-gris05 { filter:var(--svg-gris05); }
.svg-gris10 { filter:var(--svg-gris10); }
.svg-gris20 { filter:var(--svg-gris20); }
.svg-gris30 { filter:var(--svg-gris30); }
.svg-gris40 { filter:var(--svg-gris40); }
.svg-gris50 { filter:var(--svg-gris50); }
.svg-gris60 { filter:var(--svg-gris60); }
.svg-gris70 { filter:var(--svg-gris70); }
.svg-gris80 { filter:var(--svg-gris80); }
.svg-gris90 { filter:var(--svg-gris90); }
.svg-negro { filter:var(--svg-negro); }
.svg-fuente { filter:var(--svg-fuente); }
.svg-oscuro { filter: var(--svg-oscuro) }
.svg-grisoscuro { filter:var(--svg-grisoscuro); }
.svg-grismedio { filter:var(--svg-grismedio); }
.svg-grisclaro { filter:var(--svg-grisclaro); }
.svg-gristenue { filter:var(--svg-gristenue); }
/* ///////////////////////////////////// */
.fz-4xlarge { font-size: var(--font-size-4xlarge); }
.fz-3xlarge { font-size: var(--font-size-3xlarge); }
.fz-2xlarge { font-size: var(--font-size-2xlarge); }
.fz-xlarge  { font-size: var(--font-size-xlarge); }
.fz-large   { font-size: var(--font-size-large); }
.fz-medium  { font-size: var(--font-size-medium); }
.fz-small   { font-size: var(--font-size-small); }
.fz-xsmall  { font-size: var(--font-size-xsmall)!important; }
.fz-2xsmall { font-size: var(--font-size-2xsmall); }
.fz-4xsmall { font-size: var(--font-size-3xsmall); }
.fz-4xsmall { font-size: var(--font-size-4xsmall); }
.fw-100 { font-weight: 100 !important; }
.fw-200 { font-weight: 200 !important; }
.fw-300 { font-weight: 300 !important; }
.fw-400 { font-weight: 400 !important; }
.fw-500 { font-weight: 500 !important; }
.fw-600 { font-weight: 600 !important; }
.fw-700 { font-weight: 700 !important; }
.fw-800 { font-weight: 800 !important; }
.fw-900 { font-weight: 900 !important; }
/* ///////////////// WIDTH ///////////////// */
.wd-10 { width: 10px; }
.wd-15 { width: 15px; }
.wd-20 { width: 20px!important; }
.wd-25 { width: 25px; }
.wd-30 { width: 30px!important; }
.wd-35 { width: 35px; }
.wd-40 { width: 40px; }
.wd-45 { width: 45px; }
.wd-50 { width: 50px; }
.wd-55 { width: 55px; }
.wd-60 { width: 60px; }
.wd-65 { width: 65px; }
.wd-70 { width: 70px; }
.wd-75 { width: 75px; }
.wd-80 { width: 80px; }
.wd-85 { width: 85px; }
.wd-90 { width: 90px; }
.wd-95 { width: 95px; }
.wd-100 { width: 100px; }
.wd-105 { width: 105px; }
.wd-110 { width: 110px; }
.wd-115 { width: 115px; }
.wd-120 { width: 120px; }
.wd-125 { width: 125px; }
.wd-130 { width: 130px; }
.wd-135 { width: 135px; }
.wd-140 { width: 140px; }
.wd-145 { width: 145px; }
.wd-150 { width: 150px; }
.wd-155 { width: 155px; }
.wd-160 { width: 160px; }
.wd-165 { width: 165px; }
.wd-170 { width: 170px; }
.wd-175 { width: 175px; }
.wd-180 { width: 180px; }
.wd-185 { width: 185px; }
.wd-190 { width: 190px; }
.wd-195 { width: 195px; }
.wd-200 { width: 200px; }
.wd-250 { width: 250px; }
.wd-300 { width: 300px; }
.wd-350 { width: 350px; }
/* ///////////////// LINE-HEIGHT ///////////////// */
.lh-4xlarge { line-height: var(--lineheight-4xlarge); }
.lh-3xlarge { line-height: var(--lineheight-3xlarge); }
.lh-2xlarge { line-height: var(--lineheight-2xlarge); }
.lh-xlarge  { line-height: var(--lineheight-xlarge); }
.lh-large   { line-height: var(--lineheight-large ); }
.lh-medium  { line-height: var(--lineheight-medium); }
.lh-small   { line-height: var(--lineheight-small); }
.lh-xsmall  { line-height: var(--lineheight-xsmall ); }
.lh-2xsmall { line-height: var(--lineheight-2xsmall); }
.lh-4xsmall { line-height: var(--lineheight-3xsmall); }
.lh-4xsmall { line-height: var(--lineheight-4xsmall); }
/* ///////////////// HEIGHT ///////////////// */
.hg-10 { height: 10px; }
.hg-15 { height: 15px; }
.hg-20 { height: 20px; }
.hg-25 { height: 25px; }
.hg-30 { height: 30px; }
.hg-35 { height: 35px; }
.hg-40 { height: 40px; }
.hg-45 { height: 45px; }
.hg-50 { height: 50px; }
.hg-55 { height: 55px; }
.hg-60 { height: 60px; }
.hg-65 { height: 65px; }
.hg-70 { height: 70px; }
.hg-75 { height: 75px; }
.hg-80 { height: 80px; }
.hg-85 { height: 85px; }
.hg-90 { height: 90px; }
.hg-95 { height: 95px; }
.hg-100 { height: 100px; }
.hg-105 { height: 105px; }
.hg-110 { height: 110px; }
.hg-115 { height: 115px; }
.hg-120 { height: 120px; }
.hg-125 { height: 125px; }
.hg-130 { height: 130px; }
.hg-135 { height: 135px; }
.hg-140 { height: 140px; }
.hg-145 { height: 145px; }
.hg-150 { height: 150px; }
.hg-155 { height: 155px; }
.hg-160 { height: 160px; }
.hg-165 { height: 165px; }
.hg-170 { height: 170px; }
.hg-175 { height: 175px; }
.hg-180 { height: 180px; }
.hg-185 { height: 185px; }
.hg-190 { height: 190px; }
.hg-195 { height: 195px; }
.hg-200 { height: 200px; }
.hg-250 { height: 250px; }
.hg-300 { height: 300px; }
.hg-350 { height: 350px; }
/* ///////////////// ICON ///////////////// */
.icon-10 { width: 10px;height: 10px!important; }
.icon-15 { width: 15px;height: 15px!important; }
.icon-20 { width: 20px;height: 20px!important; }
.icon-25 { width: 25px;height: 25px!important; }
.icon-30 { width: 30px;height: 25px!important; }
.icon-35 { width: 35px;height: 35px!important; }
.icon-40 { width: 40px;height: 40px!important; }
.icon-45 { width: 45px;height: 45px!important; }
.icon-50 { width: 50px;height: 40px!important; }
.icon-55 { width: 55px;height: 55px!important; }
.icon-60 { width: 60px;height: 60px!important; }
.icon-65 { width: 65px;height: 65px!important; }
.icon-70 { width: 70px;height: 70px!important; }
.icon-75 { width: 75px;height: 75px!important; }
.icon-80 { width: 80px;height: 80px; }
.icon-85 { width: 85px;height: 85px; }
.icon-90 { width: 90px;height: 90px; }
.icon-95 { width: 95px;height: 95px; }
.icon-100 { width: 100px;height: 100px; }
.icon-105 { width: 105px;height: 105px; }
.icon-110 { width: 110px;height: 110px; }
.icon-115 { width: 115px;height: 115px; }
.icon-120 { width: 120px;height: 120px; }
.icon-125 { width: 125px;height: 125px; }
.icon-130 { width: 130px;height: 130px; }
.icon-135 { width: 135px;height: 135px; }
.icon-140 { width: 140px;height: 140px; }
.icon-145 { width: 145px;height: 145px; }
.icon-150 { width: 150px;height: 150px; }
.icon-155 { width: 155px;height: 155px; }
.icon-160 { width: 160px;height: 160px; }
.icon-165 { width: 165px;height: 165px; }
.icon-170 { width: 170px;height: 170px; }
.icon-175 { width: 175px;height: 175px; }
.icon-180 { width: 180px;height: 180px; }
.icon-185 { width: 185px;height: 185px; }
.icon-190 { width: 190px;height: 190px; }
.icon-195 { width: 195px;height: 195px; }
.icon-200 { width: 200px;height: 200px; }
.icon-250 { width: 250px;height: 250px; }
.icon-300 { width: 300px;height: 300px; }
.icon-350 { width: 350px;height: 350px; }
/* ///////////////// BORDER RADIUS ///////////////// */
.brs-4xlarge        { border-radius: var(--margenes-4xlarge) }
.brs-3xlarge        { border-radius: var(--margenes-3xlarge) }
.brs-2xlarge        { border-radius: var(--margenes-2xlarge) }
.brs-xlarge         { border-radius: var(--margenes-xlarge) }
.brs-large          { border-radius: var(--margenes-large) }
.brs-medium         { border-radius: var(--margenes-medium) }
.brs-small          { border-radius: var(--margenes-small) }
.brs-xsmall         { border-radius: var(--margenes-xsmall) }
.brs-2xsmall        { border-radius: var(--margenes-2xsmall) }
.brs-3xsmall        { border-radius: var(--margenes-3xsmall) }
.brs-4xsmall        { border-radius: var(--margenes-4xsmall) }
/* ///////////////// PADDING ///////////////// */
.padding-4xlarge        { padding: var(--margenes-4xlarge) }
.padding-3xlarge        { padding: var(--margenes-3xlarge) }
.padding-2xlarge        { padding: var(--margenes-2xlarge) }
.padding-xlarge         { padding: var(--margenes-xlarge) }
.padding-large          { padding: var(--margenes-large) }
.padding-medium         { padding: var(--margenes-medium) }
.padding-small          { padding: var(--margenes-small) }
.padding-xsmall         { padding: var(--margenes-xsmall) }
.padding-2xsmall        { padding: var(--margenes-2xsmall)!important }
.padding-3xsmall        { padding: var(--margenes-3xsmall)!important }
.padding-4xsmall        { padding: var(--margenes-4xsmall) }
.paddinglat-4xlarge     { padding: 0 var(--margenes-4xlarge) }
.paddinglat-3xlarge     { padding: 0 var(--margenes-3xlarge) }
.paddinglat-2xlarge     { padding: 0 var(--margenes-2xlarge) }
.paddinglat-xlarge      { padding: 0 var(--margenes-xlarge) }
.paddinglat-large       { padding: 0 var(--margenes-large) }
.paddinglat-medium      { padding: 0 var(--margenes-medium) }
.paddinglat-small       { padding: 0 var(--margenes-small) }
.paddinglat-xsmall      { padding: 0 var(--margenes-xsmall) }
.paddinglat-2xsmall     { padding: 0 var(--margenes-2xsmall) }
.paddinglat-3xsmall     { padding: 0 var(--margenes-3xsmall) }
.paddinglat-4xsmall     { padding: 0 var(--margenes-4xsmall) }
.paddingtopbott-4xlarge { padding: var(--margenes-4xlarge) 0 }
.paddingtopbott-3xlarge { padding: var(--margenes-3xlarge) 0 }
.paddingtopbott-2xlarge { padding: var(--margenes-2xlarge) 0 }
.paddingtopbott-xlarge  { padding: var(--margenes-xlarge) 0 }
.paddingtopbott-large   { padding: var(--margenes-large) 0 }
.paddingtopbott-medium  { padding: var(--margenes-medium) 0 }
.paddingtopbott-small   { padding: var(--margenes-small) 0 }
.paddingtopbott-xsmall  { padding: var(--margenes-xsmall) 0 }
.paddingtopbott-2xsmall { padding: var(--margenes-2xsmall) 0 }
.paddingtopbott-3xsmall { padding: var(--margenes-3xsmall) 0 }
.paddingtopbott-4xsmall { padding: var(--margenes-4xsmall) 0 }
.paddingtop-4xlarge     { padding: var(--margenes-4xlarge) 0 0 0 }
.paddingtop-3xlarge     { padding: var(--margenes-3xlarge) 0 0 0 }
.paddingtop-2xlarge     { padding: var(--margenes-2xlarge) 0 0 0 }
.paddingtop-xlarge      { padding: var(--margenes-xlarge) 0 0 0 }
.paddingtop-large       { padding: var(--margenes-large) 0 0 0 }
.paddingtop-medium      { padding: var(--margenes-medium) 0 0 0 }
.paddingtop-small       { padding: var(--margenes-small) 0 0 0 }
.paddingtop-xsmall      { padding: var(--margenes-xsmall) 0 0 0 }
.paddingtop-2xsmall     { padding: var(--margenes-2xsmall) 0 0 0 }
.paddingtop-3xsmall     { padding: var(--margenes-3xsmall) 0 0 0 }
.paddingtop-4xsmall     { padding: var(--margenes-4xsmall) 0 0 0 }
.paddingright-4xlarge   { padding: 0 var(--margenes-4xlarge) 0 0 }
.paddingright-3xlarge   { padding: 0 var(--margenes-3xlarge) 0 0 }
.paddingright-2xlarge   { padding: 0 var(--margenes-2xlarge) 0 0 }
.paddingright-xlarge    { padding: 0 var(--margenes-xlarge) 0 0 }
.paddingright-large     { padding: 0 var(--margenes-large) 0 0 }
.paddingright-medium    { padding: 0 var(--margenes-medium) 0 0 }
.paddingright-small     { padding: 0 var(--margenes-small) 0 0 }
.paddingright-xsmall    { padding: 0 var(--margenes-xsmall) 0 0 }
.paddingright-2xsmall   { padding: 0 var(--margenes-2xsmall) 0 0 }
.paddingright-3xsmall   { padding: 0 var(--margenes-3xsmall) 0 0 }
.paddingright-4xsmall   { padding: 0 var(--margenes-4xsmall) 0 0 }
.paddingbottom-4xlarge  { padding: 0 0 var(--margenes-4xlarge) 0 }
.paddingbottom-3xlarge  { padding: 0 0 var(--margenes-3xlarge) 0 }
.paddingbottom-2xlarge  { padding: 0 0 var(--margenes-2xlarge) 0 }
.paddingbottom-xlarge   { padding: 0 0 var(--margenes-xlarge) 0 }
.paddingbottom-large    { padding: 0 0 var(--margenes-large) 0 }
.paddingbottom-medium   { padding: 0 0 var(--margenes-medium) 0 }
.paddingbottom-small    { padding: 0 0 var(--margenes-small) 0 }
.paddingbottom-xsmall   { padding: 0 0 var(--margenes-xsmall) 0 }
.paddingbottom-2xsmall  { padding: 0 0 var(--margenes-2xsmall) 0 }
.paddingbottom-3xsmall  { padding: 0 0 var(--margenes-3xsmall) 0 }
.paddingbottom-4xsmall  { padding: 0 0 var(--margenes-4xsmall) 0 }
.paddingleft-4xlarge    { padding: 0 0 0 var(--margenes-4xlarge) }
.paddingleft-3xlarge    { padding: 0 0 0 var(--margenes-3xlarge) }
.paddingleft-2xlarge    { padding: 0 0 0 var(--margenes-2xlarge) }
.paddingleft-xlarge     { padding: 0 0 0 var(--margenes-xlarge) }
.paddingleft-large      { padding: 0 0 0 var(--margenes-large) }
.paddingleft-medium     { padding: 0 0 0 var(--margenes-medium) }
.paddingleft-small      { padding: 0 0 0 var(--margenes-small) }
.paddingleft-xsmall     { padding: 0 0 0 var(--margenes-xsmall) }
.paddingleft-2xsmall    { padding: 0 0 0 var(--margenes-2xsmall) }
.paddingleft-3xsmall    { padding: 0 0 0 var(--margenes-3xsmall) }
.paddingleft-4xsmall    { padding: 0 0 0 var(--margenes-4xsmall) }
/* ///////////////// MARGIN ///////////////// */
.margin-4xlarge        { margin: var(--margenes-4xlarge) }
.margin-3xlarge        { margin: var(--margenes-3xlarge) }
.margin-2xlarge        { margin: var(--margenes-2xlarge) }
.margin-xlarge         { margin: var(--margenes-xlarge) }
.margin-large          { margin: var(--margenes-large) }
.margin-medium         { margin: var(--margenes-medium) }
.margin-small          { margin: var(--margenes-small) }
.margin-xsmall         { margin: var(--margenes-xsmall) }
.margin-2xsmall        { margin: var(--margenes-2xsmall) }
.margin-3xsmall        { margin: var(--margenes-3xsmall) }
.margin-4xsmall        { margin: var(--margenes-4xsmall) }
.marginlat-4xlarge     { margin: 0 var(--margenes-4xlarge) }
.marginlat-3xlarge     { margin: 0 var(--margenes-3xlarge) }
.marginlat-2xlarge     { margin: 0 var(--margenes-2xlarge) }
.marginlat-xlarge      { margin: 0 var(--margenes-xlarge) }
.marginlat-large       { margin: 0 var(--margenes-large) }
.marginlat-medium      { margin: 0 var(--margenes-medium) }
.marginlat-small       { margin: 0 var(--margenes-small) }
.marginlat-xsmall      { margin: 0 var(--margenes-xsmall) }
.marginlat-2xsmall     { margin: 0 var(--margenes-2xsmall) }
.marginlat-3xsmall     { margin: 0 var(--margenes-3xsmall) }
.marginlat-4xsmall     { margin: 0 var(--margenes-4xsmall) }
.margintopbott-4xlarge { margin: var(--margenes-4xlarge) 0 }
.margintopbott-3xlarge { margin: var(--margenes-3xlarge) 0 }
.margintopbott-2xlarge { margin: var(--margenes-2xlarge) 0 }
.margintopbott-xlarge  { margin: var(--margenes-xlarge) 0 }
.margintopbott-large   { margin: var(--margenes-large) 0 }
.margintopbott-medium  { margin: var(--margenes-medium) 0 }
.margintopbott-small   { margin: var(--margenes-small) 0 }
.margintopbott-xsmall  { margin: var(--margenes-xsmall) 0 }
.margintopbott-2xsmall { margin: var(--margenes-2xsmall) 0 }
.margintopbott-3xsmall { margin: var(--margenes-3xsmall) 0 }
.margintopbott-4xsmall { margin: var(--margenes-4xsmall) 0 }
.margintop-4xlarge     { margin: var(--margenes-4xlarge) 0 0 0 }
.margintop-3xlarge     { margin: var(--margenes-3xlarge) 0 0 0 }
.margintop-2xlarge     { margin: var(--margenes-2xlarge) 0 0 0 }
.margintop-xlarge      { margin: var(--margenes-xlarge) 0 0 0 }
.margintop-large       { margin: var(--margenes-large) 0 0 0 }
.margintop-medium      { margin: var(--margenes-medium) 0 0 0 }
.margintop-small       { margin: var(--margenes-small) 0 0 0 }
.margintop-xsmall      { margin: var(--margenes-xsmall) 0 0 0 }
.margintop-2xsmall     { margin: var(--margenes-2xsmall) 0 0 0 }
.margintop-3xsmall     { margin: var(--margenes-3xsmall) 0 0 0 }
.margintop-4xsmall     { margin: var(--margenes-4xsmall) 0 0 0 }
.marginright-4xlarge   { margin: 0 var(--margenes-4xlarge) 0 0 }
.marginright-3xlarge   { margin: 0 var(--margenes-3xlarge) 0 0 }
.marginright-2xlarge   { margin: 0 var(--margenes-2xlarge) 0 0 }
.marginright-xlarge    { margin: 0 var(--margenes-xlarge) 0 0 }
.marginright-large     { margin: 0 var(--margenes-large) 0 0 }
.marginright-medium    { margin: 0 var(--margenes-medium) 0 0 }
.marginright-small     { margin: 0 var(--margenes-small) 0 0 }
.marginright-xsmall    { margin: 0 var(--margenes-xsmall) 0 0 }
.marginright-2xsmall   { margin: 0 var(--margenes-2xsmall) 0 0 }
.marginright-3xsmall   { margin: 0 var(--margenes-3xsmall) 0 0 }
.marginright-4xsmall   { margin: 0 var(--margenes-4xsmall) 0 0 }
.marginbottom-4xlarge  { margin: 0 0 var(--margenes-4xlarge) 0 }
.marginbottom-3xlarge  { margin: 0 0 var(--margenes-3xlarge) 0 }
.marginbottom-2xlarge  { margin: 0 0 var(--margenes-2xlarge) 0 }
.marginbottom-xlarge   { margin: 0 0 var(--margenes-xlarge) 0 }
.marginbottom-large    { margin: 0 0 var(--margenes-large) 0 }
.marginbottom-medium   { margin: 0 0 var(--margenes-medium) 0 }
.marginbottom-small    { margin: 0 0 var(--margenes-small) 0 }
.marginbottom-xsmall   { margin: 0 0 var(--margenes-xsmall) 0 }
.marginbottom-2xsmall  { margin: 0 0 var(--margenes-2xsmall) 0 }
.marginbottom-3xsmall  { margin: 0 0 var(--margenes-3xsmall) 0 }
.marginbottom-4xsmall  { margin: 0 0 var(--margenes-4xsmall) 0 }
.marginleft-4xlarge    { margin: 0 0 0 var(--margenes-4xlarge) }
.marginleft-3xlarge    { margin: 0 0 0 var(--margenes-3xlarge) }
.marginleft-2xlarge    { margin: 0 0 0 var(--margenes-2xlarge) }
.marginleft-xlarge     { margin: 0 0 0 var(--margenes-xlarge) }
.marginleft-large      { margin: 0 0 0 var(--margenes-large) }
.marginleft-medium     { margin: 0 0 0 var(--margenes-medium) }
.marginleft-small      { margin: 0 0 0 var(--margenes-small) }
.marginleft-xsmall     { margin: 0 0 0 var(--margenes-xsmall) }
.marginleft-2xsmall    { margin: 0 0 0 var(--margenes-2xsmall) }
.marginleft-3xsmall    { margin: 0 0 0 var(--margenes-3xsmall) }
.marginleft-4xsmall    { margin: 0 0 0 var(--margenes-4xsmall) }
/* ///////////////// RESETEO ///////////////// */
.widthfull { width: 100%}
.fullwidth { width: 100%}
.widthauto { width: auto; }
.widthinherit { width: inherit; }
.heightauto { height: auto!important; }
.heightinherit { height: inherit; }
.top { top: 0; }
.bottom { bottom: 0; }
.left { left: 0; }
.right {right: 0; }
.block { display: block; }
.inline { display: inline; }
.inlineblock { display: inline-block; }
.contents { display: contents!important;}
.displaynone { display: none; }
.displayinherit { display: inherit; }
.absolute { position: absolute; }
.relative { position: relative; }
.fixed { position: fixed; }
.inherit { position: inherit; }
.zindex1 { z-index: 1; }
.zindex-1 { z-index: -1; }
.overflowhidden { overflow: hidden; }
.no-overflowhidden { overflow: visible; }
.boxsizing { box-sizing: border-box; }
.border1 { border: 1px solid rgb(0 0 0 / 27%); }
.no-border { border: none!important; }
.no-borderadius { border-radius: 0; }
.no-lh {line-height: inherit ; }
.no-padding {padding: 0!important; }
.no-paddingtop {padding-top: 0; }
.no-paddingbottom {padding-bottom: 0; }
.no-paddingleft {padding-left: 0; }
.no-paddingright {padding-right: 0; }
.no-margin {margin: 0!important; }
.no-margintop {margin-top: 0; }
.no-marginbottom {margin-bottom: 0; }
.no-marginleft {margin-left: 0; }
.no-marginright {margin-right: 0; }
.marginauto {margin: auto; }
.borderwhite { border: solid 1px var(--col-blanco); }
.displayflex { display: flex!important; }
.none { display:none; }
.flex { display: flex!important; }
.no-borderbottom { border-bottom: none;}
.grilla { display: flex; flex-direction: row; flex-wrap: wrap; }
.bordertop { border-top: 1px solid var(--col-020); }
.borderleft { border-left: 1px solid var(--col-020); }
.borderright { border-right: 1px solid var(--col-020); }
.borderbottom { border-bottom: 1px solid var(--col-020); }
.borderbottom-negro { border-bottom: 1px solid var(--col-negro)!important; }
.center { text-align: center;}
.centrado { display: flex; justify-content: space-evenly; align-items: center; }
.center-v { display: flex!important; justify-content: center; }
.centrado3 { display: flex; justify-content: center; align-items: center;align-content: center; }
.centradoleft { display: flex; justify-content: flex-start; align-items: center; }
.centradohorizontal { display: flex; align-content: center; align-items: center; }
.text-left { text-align: left; }
.degradeblack {
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  background: #030000;
  background: -webkit-linear-gradient(0deg, rgba(3, 0, 0, 0.71) 10%, rgba(3, 0, 0, 0.18) 40%, rgba(3, 0, 0, 0) 70%, rgba(8, 0, 0, 0) 100%);
  background: -moz-linear-gradient(0deg, rgba(3, 0, 0, 0.71) 10%, rgba(3, 0, 0, 0.18) 40%, rgba(3, 0, 0, 0) 70%, rgba(8, 0, 0, 0) 100%);
  background: linear-gradient(0deg, rgba(3, 0, 0, 0.71) 10%, rgba(3, 0, 0, 0.18) 40%, rgba(3, 0, 0, 0) 70%, rgba(8, 0, 0, 0) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#030000", endColorstr="#080000", GradientType=0);
}
/* //////////// COLUMNAS //////////// */
.columnas {
  display: grid;
  row-gap: var(--margenes-gap-4xsmall);
  column-gap:var(--margenes-gap-4xsmall);
}
.col-6 {
  grid-template-columns: repeat(6, 1fr);
  row-gap: var(--margenes-gap-xsmall);
  column-gap: var(--margenes-gap-xsmall);
}
.col-12 {
  grid-template-columns: repeat(12, 1fr);
  row-gap: var(--margenes-gap-xsmall);
  column-gap: var(--margenes-gap-xsmall);
}
.col-13 {
  grid-template-columns: repeat(13, 1fr);
  row-gap: var(--margenes-gap-xsmall);
  column-gap: var(--margenes-gap-xsmall);
}
.col-14 {
  grid-template-columns: repeat(14, 1fr);
  row-gap: var(--margenes-gap-xsmall);
  column-gap: var(--margenes-gap-xsmall);
}
.col-15 {
  grid-template-columns: repeat(15, 1fr);
  row-gap: var(--margenes-gap-xsmall);
  column-gap: var(--margenes-gap-xsmall);
}
.col-16 {
  grid-template-columns: repeat(16, 1fr);
  row-gap: var(--margenes-gap-xsmall);
  column-gap: var(--margenes-gap-xsmall);
}
.col-17 {
  grid-template-columns: repeat(17, 1fr);
  row-gap: var(--margenes-gap-xsmall);
  column-gap: var(--margenes-gap-xsmall);
}
.col-18 {
  grid-template-columns: repeat(18, 1fr);
  row-gap: var(--margenes-gap-xsmall);
  column-gap: var(--margenes-gap-xsmall);
}
.col-19 {
  grid-template-columns: repeat(19, 1fr);
  row-gap: var(--margenes-gap-xsmall);
  column-gap: var(--margenes-gap-xsmall);
}
.col-20 {
  grid-template-columns: repeat(20, 1fr);
  row-gap: var(--margenes-gap-4xsmall);
  column-gap: var(--margenes-gap-4xsmall);
}
.col-21 {
  grid-template-columns: repeat(21, 1fr);
  row-gap: var(--margenes-gap-4xsmall);
  column-gap: var(--margenes-gap-4xsmall);
}
.col-22 {
  grid-template-columns: repeat(22, 1fr);
  row-gap: var(--margenes-gap-2xsmall);
  column-gap: var(--margenes-gap-2xsmall);
}
.col-23 {
  grid-template-columns: repeat(23, 1fr);
  row-gap: var(--margenes-gap-4xsmall);
  column-gap: var(--margenes-gap-4xsmall);
}
.col-24 {
  grid-template-columns: repeat(24, 1fr);
  row-gap: var(--margenes-gap-4xsmall);
  column-gap: var(--margenes-gap-4xsmall);
}
.col-25 {
  grid-template-columns: repeat(25, 1fr);
  row-gap: var(--margenes-gap-4xsmall);
  column-gap: var(--margenes-gap-4xsmall);
}
.col-26 {
  grid-template-columns: repeat(26, 1fr);
  row-gap: var(--margenes-gap-4xsmall);
  column-gap: var(--margenes-gap-4xsmall);
}
.col-27 {
  grid-template-columns: repeat(27, 1fr);
  row-gap: var(--margenes-gap-4xsmall);
  column-gap: var(--margenes-gap-4xsmall);
}
.col-28 {
  grid-template-columns: repeat(28, 1fr);
  row-gap: var(--margenes-gap-4xsmall);
  column-gap: var(--margenes-gap-4xsmall);
}
.col-29 {
  grid-template-columns: repeat(29, 1fr);
  row-gap: var(--margenes-gap-4xsmall);
  column-gap: var(--margenes-gap-4xsmall);
}
.col-30 {
  grid-template-columns: repeat(30, 1fr);
  row-gap: var(--margenes-gap-4xsmall);
  column-gap: var(--margenes-gap-4xsmall);
}
.col-31 {
  grid-template-columns: repeat(31, 1fr);
  row-gap: var(--margenes-gap-4xsmall);
  column-gap: var(--margenes-gap-4xsmall);
}
.col-32 {
  grid-template-columns: repeat(32, 1fr);
  row-gap: var(--margenes-gap-4xsmall);
  column-gap: var(--margenes-gap-4xsmall);
}
.col-33 {
  grid-template-columns: repeat(33, 1fr);
  row-gap: var(--margenes-gap-4xsmall);
  column-gap: var(--margenes-gap-4xsmall);
}
.col-34 {
  grid-template-columns: repeat(34, 1fr);
  row-gap: var(--margenes-gap-4xsmall);
  column-gap: var(--margenes-gap-4xsmall);
}
.col-35 {
  grid-template-columns: repeat(35, 1fr);
  row-gap: var(--margenes-gap-4xsmall);
  column-gap: var(--margenes-gap-4xsmall);
}
.una-columna {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  row-gap: var(--margenes-gap-4xsmall);
  column-gap: var(--margenes-gap-xsmall);
}
.dos-columna {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  row-gap: var(--margenes-gap-4xsmall);
  column-gap: var(--margenes-gap-4xlarge);
}
.tres-columna {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  row-gap: var(--margenes-gap-4xsmall);
  column-gap: var(--margenes-gap-4xlarge);
}
.cuatro-columna {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  row-gap: var(--margenes-gap-4xsmall);
  column-gap: var(--margenes-gap-xsmall);
}
.cinco-columna {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  row-gap: var(--margenes-gap-4xsmall);
  column-gap: var(--margenes-gap-xsmall);
}
.grid-span2 {
  grid-column: span 2;
}
@media only screen and (min-width: 1201px) {
  .oculto-full-desktop {
    display: none !important;
  }
  .ver-full-desktop {
    display: block !important;
  }
}
@media only screen and (min-width: 993px) {
  .oculto-desktop {
    display: none !important;
  }
  .ver-desktop {
    display: block !important;
  }
}
@media only screen and (min-width: 801px) {
  .oculto-desktop-medium {
    display: none !important;
  }
}
@media only screen and (min-width: 601px) {
  .oculto-tablet-desktop {
    display: none !important;
  }
  .ver-tablet-desktop {
    display: block !important;
  }
}
@media only screen and (min-width: 600px) and (max-width: 992px) {
  .oculto-tablet {
    display: none !important;
  }
  .ver-tablet {
    display: block !important;
  }
}
@media only screen and (max-width: 992px) {
  .oculto-tablet-movil {
    display: none !important;
  }
  .oculto-desktop {
    display: inline-block !important ;
  }
  .ver-tablet-movil {
    display: block !important;
  }
  .sticky {
    position: sticky;
    top: 0;
    z-index: 2;
  }
}
@media only screen and (max-width: 970px) {
  .carrusell-stop .flex {
    display: inline-block;
  }
  .carrusell-stop {
    display: inline-block !important;
  }
  .stopp,
  .stopp * {
    touch-action: none !important;
    pointer-events: none !important;
  }
  .stopp span.arrows a,
  .stopp ol.carruindi li {
    pointer-events: auto !important;
  }

  .carrusell-stop-970 .flex {
    display: inline-block;
  }
  .carrusell-stop-970 {
    display: inline-block !important;
  }
  .stopp-970,
  .stopp-970 * {
    touch-action: none !important;
    pointer-events: none !important;
  }
  .stopp-970 span.arrows a,
  .stopp-970 ol.carruindi li {
    pointer-events: auto !important;
  }

  .cuatro-columna {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media only screen and (max-width: 600px) {
  .oculto-movil {
    display: none !important;
  }
  .ver-movil {
    display: block !important;
  }
  .col-24 {
    row-gap: unset;
    column-gap: unset;
  }
  .center-600{
    text-align:center;
  }
}



/* //////////// HEADER //////////// */
.header {
display: inline-block;
width: 100%;
}
.header section {
display: flex;
align-items: center;
justify-content: space-between;
margin:var(--margenes-4xsmall) 0;
position: relative;
}
.header section a{
margin: auto;
}
.header section span{
display: flex;
align-items: center;
}
.header section span svg{
width: 20px;
height: 20px;
}
.header section span button.line {
display: flex;
align-items: center;
border-radius: var(--margenes-4xsmall);
border: 1px solid var(--col-blanco);
background: var(--col-rojo);
color: var(--col-blanco)
}
.header section span button.line:hover {
border: 1px solid var(--col-blanco);
background: var(--trans-20);
color: var(--col-blanco);
}
.header section svg {
height: 70px;
width: 100%;
max-width: 200px;
}
.header section ul {
display: flex;
align-items: center;
}
.header section ul li {
margin: 0 ;
}
.header section ul li button {
background: var(--col-blanco);
border: none;
border-radius: var(--margenes-4xsmall);
cursor: pointer;
margin: 0;
display: flex;
padding: var(--margenes-4xsmall) var(--margenes-4xsmall);
}
.header section ul li button:hover {
background: var(--trans-20);
}
.header section ul li button:active {
background: var(--trans-40);
}
.header section ul li button svg{
height: 30px;
width: 30px;
}
.header section ul li button svg:hover{
height: 30px;
width: 30px;
filter: invert(1) opacity(0.7);
}
.header section ul li button svg:active{
height: 30px;
width: 30px;
filter: invert(1) opacity(0.5);
}
button:hover {
background: var(--trans-20);
}
button:active {
background: var(--trans-40);
}
button svg{
height: 30px;
width: 30px;
}
button svg:hover{
height: 30px;
width: 30px;
filter: invert(1) opacity(0.7);
}
button svg:active{
height: 30px;
width: 30px;
filter: invert(1) opacity(0.5);
}
/* //////////// HEADER FLOATING //////////// */
.floating-btn {
position: absolute;
right: 0;
width: 50px;
overflow: hidden;
text-align: center;
z-index: 1;
transition: width 0.7s;
background: var(--col-blanco);
}
.floating-btn .anchor {
position: absolute;
right: 0;
z-index: 1;
background: var(--col-blanco);
}
.floating-btn:hover {
width: 360px;
}
/* //////////// NAVEGADOR //////////// */
.navbar-fixed{
position:sticky!important;
position: -webkit-sticky;
top:-1px;
left:0;
transition: all 0.3s ease-in-out;
display: block;
height: 65px !important;
line-height: 65px!important;
z-index: 2;
display: flex!important;
}
.nav-rojo {
background: var(--col-rojo);
display: inline-block;
width: 100%;
}
.nav-rojo section {
display: flex;
justify-content: space-between;
align-items: center;
}
.nav-rojo section svg{
width: 20px;
height: 20px;
filter:var(--svg-blanco)
}
.nav-rojo section ul li svg{
width: 10px;
height: 10px;
filter:var(--svg-blanco)
}
.nav-rojo section ul li{
color:var(--col-blanco);
display: contents;
}
.nav-rojo section ul li a{
color:var(--col-blanco);
padding: 0 var(--margenes-2xsmall) !important;
}
.nav-rojo section ul li a:link{
color:var(--col-blanco);
padding: var(--margenes-2xsmall) 20px;
display: inline-block;
text-decoration: none;
}
.nav-rojo section ul li a:hover{
color:var(--col-blanco);
padding: var(--margenes-2xsmall) 20px;
display: inline-block;
background: var(--trans-10);
}
.nav-rojo section ul li ul{
display: flex;
flex-direction: column;
text-align: left;
}
.nav-rojo section ul li ul li {
color:var(--col-oscuro);
width: 100%;
}
.nav-rojo section ul li ul li a{
color:var(--col-oscuro);
background: var(--col-blanco);
display: inline-block;
width: 100%;
}
.nav-rojo section ul li ul li a:link{
color:var(--col-oscuro);
background:var(--col-gristenue);
display: inline-block;
}
.nav-rojo section ul li ul li a:hover{
color:var(--col-oscuro);
background: var(--col-gristenue);
display: inline-block;
}
#nav-submenu{
overflow: hidden;
text-align: right !important;
margin: 0 var(--margenes-2xsmall);
overflow-x: auto;
white-space: nowrap;
width: 100%;
max-width: 1900px;
display: flex;
justify-content: center;
}
#nav-submenu li{
display: inline-block;
height: 65px!important;
}
#nav-submenu li ul{
position: absolute;
z-index: 2;
-webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
}
/* ///////////////// SIDE-BAR LATERAL ///////////////// */
.menu-button {
cursor: pointer;
display:flex;
}
.menu-sidebar {
position: fixed;
top: 0;
left: 0;
width: 80vw;
max-width: 380px;
height: 100vh;
background: var(--col-blanco);
box-shadow: 4px 0 12px rgba(0,0,0,.25);
transform: translateX(-110%);
transition: transform .28s cubic-bezier(.2,.9,.2,1);
z-index: 1200;
overflow-y: auto;
list-style: none;
}
.menu-sidebar ul li{
border-bottom:1px solid rgba(0,0,0,.07);
}
.menu-sidebar ul li a{
display:block;
color:#222;
text-decoration:none;
padding: var(--margenes-3xsmall )
}
.menu-sidebar ul li a:hover{
background: var(--col-gristenue);
}
#menu-toggle { display: none; }
#menu-toggle:checked ~ .menu-sidebar {
transform: translateX(0);
z-index: 1111;
}
#menu-toggle:checked ~ .menu-overlay{
opacity: 1;
pointer-events: auto;
}
.menu-overlay {
position: fixed;
inset: 0;
background: rgba(0,0,0,.45);
opacity: 0;
pointer-events: none;
transition: opacity .28s ease;
z-index: 1100;
}
.menu-sidebar header {
text-align: center;
padding: 0 var(--margenes-2xlarge);
display:flex;
flex-direction: column;
margin: var(--margenes-small) 0;
}
.menu-sidebar header a svg {
  width: 100%;
  height: 50px;
  max-width: 200px;
  margin: var(--margenes-3xsmall) 0;
}
.menu-sidebar .cinta {
padding: 0 var(--margenes-4xsmall);
margin-bottom: var(--margenes-3xsmall);
background: none;
}
.menu-sidebar .cinta ul li {
display: inline-block;
border: 1px solid var(--col-oscuro);
border-radius: var(--margenes-4xsmall);
margin: 3px;
overflow: hidden;
background: var(--col-oscuro);
}
.menu-sidebar .cinta ul li a{
text-decoration: none;
padding: var(--margenes-4xsmall) var(--margenes-3xsmall);
color: var(--col-blanco);
white-space: nowrap;
}
.menu-sidebar .cinta ul li a:hover{
text-decoration: none;
padding: var(--margenes-4xsmall) var(--margenes-3xsmall);
background:var(--col-grismedio);
color: var(--col-blanco);
}
.menu-sidebar nav {
padding: 0 var(--margenes-4xsmall);
margin-bottom: var(--margenes-3xsmall);
}
.menu-sidebar nav ul li {
display: inline-block;
border: 1px solid var(--col-oscuro);
border-radius: var(--margenes-4xsmall);
margin: 3px;
overflow: hidden;
}
.menu-sidebar nav ul li a {
text-decoration: none;
padding: var(--margenes-4xsmall) var(--margenes-3xsmall);
white-space: nowrap;
}
.menu-sidebar section {
padding: 0 var(--margenes-3xsmall);
margin-bottom: var(--margenes-3xsmall);
}
.menu-sidebar section ul {
list-style:disc;
padding: 0 20px;
}
.menu-sidebar section ul li{
display: inline-block;
padding: 0;
border: none;
border-radius: var(--margenes-4xsmall);
margin: var(--margenes-3xsmall) 0;
line-height: 20px;
display: list-item;
}
.menu-sidebar section ul li a:hover {
background: none;
text-decoration: underline;
}
.menu-sidebar .descargueapp {
padding: 0  var(--margenes-3xsmall);
margin: var(--margenes-2xsmall) 0;
}
.menu-sidebar .descargueapp section {
border: 1px solid #000000;
padding:  var(--margenes-xsmall)  var(--margenes-2xsmall);
border-radius: var(--margenes-4xsmall);
text-align: center;
}
.menu-sidebar .descargueapp h6 {
margin-bottom: var(--margenes-2xsmall);
}
.menu-sidebar .descargueapp span {
display: flex;
}
/* //////////// COLUMNA //////////// */
.online,.portada,.subportada,.videoandina,.galeria,.subgaleria,.masdestacadas,.miscelanea,.secciones,.pubmedium01,.pubmedium02,.pubmedium03 {
grid-column: 1 / 23;
}
/* ///////////////// DELAY ///////////////// */
.delay{
transition: all 0.6s ease;
opacity: 0;
visibility: hidden;
}
.delay-click:hover .delay{
opacity: 1;
visibility: visible;
}
@keyframes slideLeft{
0%{
opacity: 0;
transform: translateX(100%);
}
100%{
opacity: 1;
transform: translateX(0%);
}
}
@keyframes slideRight{
0%{
opacity: 1;
transform: translateX(0%);
}
100%{
opacity: 0;
transform: translateX(100%);
}
}
/* //////////// BODY //////////// */
.index a {
color: var(--col-fuente);
text-decoration: none;
}
.index a:hover {
color: var(--col-grismedio)!important;
text-decoration: underline;
}
.index a:link {
color: var(--col-fuente);
}
.index a:active {
color: var(--col-fuente);
}
.index a:visited {
color: var(--col-fuente);
}
.index a:focus {
color:var(--col-fuente);
}
.tarjeta{
display: grid;
grid-template-columns: repeat(1, 1fr);
grid-auto-flow: dense;
row-gap: 0;
column-gap: 0;
}
.tarjeta-horizontal {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(min(100%, 30rem), 1fr));
grid-auto-flow: dense;
row-gap: var(--margenes-2xsmall);
column-gap: var(--margenes-4xsmall);
/* align-content: stretch;
align-items: start; */
}
.tarjeta-horizontal span figure, figure{
height: 100%;
position: relative;
border-radius: var(--margenes-4xsmall);
overflow: hidden;
}
.tarjeta-horizontal span figure img{
object-fit: cover;
height: 100%;
}
.tarjeta-horizontal span svg.icon{
  position: absolute;
    display: block;
    bottom: 0;
    right: 0;
    width: 40px;
    height: 40px;
    margin: 10px;
    filter: var(--svg-blanco)!important;
    z-index: 1;
}
.icon {
position: absolute;
    display: flex;
    bottom: 0;
    color: #ffffff;
    right: 0;
    margin: 10px;
}
.icon p{
margin-right:10px;
margin-bottom:0;
}
.icon svg{
    filter: var(--svg-blanco)!important;
}
.tarjeta span, .tarjeta-horizontal span{
padding: 0 var(--margenes-4xsmall);
margin: var(--margenes-4xsmall) 0;
display: flex;
flex-direction: column;
/* display: inline-grid; */
}
.tarjeta-horizontal span ul,.tarjeta span ul{
display: flex;
margin: var(--margenes-4xsmall) 0;
}
.tarjeta-horizontal span ul li svg,.tarjeta span ul li svg{
display: flex;
width: 15px;
height: 15px;
filter: var(--svg-grismedio);
}
.tarjeta-horizontal span ul li,.tarjeta span ul li{
margin-right: var(--margenes-3xsmall);
}
.tarjeta-horizontal span .time-redes{
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.tarjeta span .time-redes {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.titulos{
  grid-column-start: 1;
  grid-column-end: -1;
  margin-bottom:var(--margenes-xsmall);
  font-weight: 800;
  font-size: 3rem;
  line-height: 100%;}

.titulos b{
display: inline;
padding-bottom: 3px;
margin-bottom: 20px;
}
.titulos b:after {
content: "";
width: 100%;
max-width: 100%;
background: var(--col-grisoscuro);
display: block;
margin-bottom: 15px;
margin-top: 8px;
}
.grid-columns-repeat3 {
grid-template-columns: repeat(3, 1fr) !important;
}
/* //////////// LISTA //////////// */
ul.lista  {
margin: var(--margenes-2xsmall) 0;
font-size: var(--font-size-3xsmall);
line-height: var(--lineheight-3xsmall);
padding: 0 var(--margenes-4xsmall);
}
ul.lista  li {
border-top: var(--col-grisclaro) 1px solid;
padding: var(--margenes-3xsmall) 0;
}
ul.lista  li:nth-last-child(-n + 0) {
border-bottom: var(--col-grisclaro) 3px solid;
}
/* //////////// FOOTER //////////// */
.footer aside ul{
margin: var(--margenes-4xsmall) 0;
}
.footer aside ul li{
vertical-align: middle;
display: inline-block;
width: 100%;
max-width: 230px;
margin: var(--margenes-2xsmall) 0;
text-align: center;
}
.footer aside ul li a{
display: flex!important;
    justify-content: center;
}
.footer section {
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-gap: 1.1rem;
align-items: start;
margin: var(--margenes-xsmall) 0;
padding: 0 var(--margenes-3xsmall);
}
.footer section span a{
display: block;
}
.footer section span button{
margin-bottom: var(--margenes-3xsmall);
}
.footer section span a svg{
display: block;
margin-bottom: var(--margenes-3xsmall);
}
.footer section .liststyle {
padding-left: 20px;
}
.footer section ul.liststyle li {
list-style: circle!important;
display: list-item;
}
.footer article  {
display: flex;
flex-direction: column;
align-items: center;
margin: var(--margenes-3xsmall) 0;
padding: 0 var(--margenes-3xsmall);
text-align: center;
}
.footer article small {
margin: var(--margenes-4xsmall) 0;
}
.footer .columnas {
display: block;
column-count: 3;
column-gap: 2.5em;
column-rule: 0.1em solid var(--col-grisclaro);
}
/* //////////// MEDIA //////////// */
@media only screen and (max-width: 1220px) {
  .dos-columna,.tres-columna,.cinco-columna,.cinco-columna{
    grid-template-columns: repeat(3, 1fr);
    }
    .grid-columns-repeat2-1220 { 
    grid-template-columns: repeat(2, 1fr) !important;
    }
  }
@media only screen and (max-width: 992px) {
  header.header-fixed{
    height: 56px !important;
    }
  header section .row{
    margin: 0 !important;
    }
  .header-fixed{
    position:sticky;
    top: 0;
    left:0;
    transition: all 0.3s ease-in-out;
    height: 70px !important;
    z-index: 2;
    }
  }
@media only screen and (max-width: 970px) {
  .dos-columna,.tres-columna,.cinco-columna,.cinco-columna{
    grid-template-columns: repeat(2, 1fr);
    }
  .footer section {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 520px;
    margin: var(--margenes-xsmall) auto;
    }
  .footer .columnas {
    column-gap: 2em;
    }
  .header-rojo section svg {
    height: 40px;
    }
  .position-initial-970 {
  position: initial!important;
  }
  }
@media only screen and (max-width: 600px) {
  .hg600-150{ height: 150px; }
  .hg600-160{ height: 160px; }
  .hg600-170{ height: 170px; }
  .hg600-180{ height: 180px; grid-template-columns: repeat(2, 1fr) !important;}
  .hg600-190{ height: 190px; }
  .hg600-200{ height: 200px; }
  .hg600-210{ height: 210px; }
  .hg600-220{ height: 220px; }
  .hg600-230{ height: 230px; }
  .tarjeta-horizontal span, .tarjeta span {
    padding: 0 var(--margenes-4xsmall);
    margin: var(--margenes-4xsmall) 0;
    display: inline-grid;
    }
  .cuatro-columna{
    grid-template-columns: repeat(1, 1fr);
    }
  .online,.portada,.subportada,.videoandina,.galeria,.subgaleria,.masdestacadas,.miscelanea,.secciones,.pubmedium01,.pubmedium02,.pubmedium03{
    grid-column: 1 / 23 !important;
    grid-template-columns: repeat(1, 1fr);
    }
  }
@media only screen and (min-width: 993px) {
  .floating-btn {
    width: 365px;
    overflow: initial;
    justify-content: flex-end;
    position: relative;
    }
}




[type="checkbox"]+label {
    position: fixed !important;
    height: auto !important;
}
    .button {
      border-radius: 50px;
      padding: 10px 30px;
      margin: auto;
      background: var(--col-grisclaro);
      display: inline-block;
    }
    .button-radius {
      border-radius: 90px;
    }
    .borderline-blanco {
      border: 1px solid #ffffff;
      border-radius: 20px;
      padding: 30px 20px;
    }
    .borderline-negro {
      border: 1px solid #000000;
      border-radius: 20px;
      padding: 50px 20px;
    }
    .borderline-gris {
      border: 1px solid #CC9 !important;
      margin: 0 5px !important;
    }
    .circulo-negro {
      background: var(--col-negro);
      margin: auto;
      font-size: 2rem;
      font-weight: 800;
      width: 50px;
      height: 50px;
      border-radius: 50%;
      display: flex;
      justify-content: center;
      align-items: center;
    }
    .background1 {
      background-image: url(../img/back-01.jpg);
      background-position: center;
      background-repeat: no-repeat;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
    }
    .plan {
      width: 100%;
      max-width: 300px;
      margin: var(--margenes-small) auto;
    }
    .logo200 {
      width: 100%;
      max-width: 500px !important;
      margin: auto;
    }
    @media only screen and (max-width: 600px) {
      .logo200 {
        width: 100%;
                max-width: 280px !important;
        margin: initial;
      }
      .titulos {
    font-size: 2.3rem;
    text-align: center;
}
    .marginlat-2xsmall-600 {
    margin: 0 var(--margenes-4xlarge);
}
    }
:root {
  --color-primario: #004aad;
  --color-texto: #222;
  --color-borde: #999;
  --color-fondo: #ffffff;
  --color-pagina: #f2f2f2;
}


.form-container {
  margin-top: 40px;
  padding: 30px;
  border: 1px solid #ccc;
  background: var(--color-fondo);
  box-shadow: none;
  border-radius: 0;
}

/* ===== CAMPOS CLÁSICOS ===== */
.field-classic {
  margin-bottom: 18px;
}

.field-classic label {
  display: block;
  margin-bottom: 6px;
  font-size: 14px;
  font-weight: 600;
  color: var(--color-texto);
}

/* INPUTS Y TEXTAREA */
.field-classic input,
.field-classic textarea {
  width: 100%;
  padding: 8px 10px;
  font-size: 14px;
  border: 1px solid var(--color-borde);
  border-radius: 0;
  background-color: #fff;
  box-shadow: none;
  outline: none;
  transition: none;
}

/* FOCUS */
.field-classic input:focus,
.field-classic textarea:focus {
  border-color: var(--color-primario);
}

/* TEXTAREA */
.field-classic textarea {
  min-height: 100px;
  resize: vertical;
}

/* CHECKBOX CLÁSICO */
[type="checkbox"] + span:not(.lever) {
  font-size: 14px;
  padding-left: 26px;
}

/* BOTÓN */
.btn-custom {
  background-color: var(--color-primario);
  border-radius: 0;
  box-shadow: none;
  text-transform: none;
  font-size: 14px;
  padding: 0 24px;
}

.btn-custom:hover {
  background-color: #00327a;
}
[type="checkbox"]:not(:checked), [type="checkbox"]:checked {
    opacity: 1!important;

}
input,textarea {
    border: 1px solid #cccccc!important;
    border-radius: 8px!important;
    padding: 2px 20px!important;
    box-sizing: border-box!important;
}

