/* //////////// HEADER //////////// */
#headerandina.rojo{
border-bottom: 1px solid var(--trans-50blanco);
}
#headerandina.rojo .cinta {
background: var(--col-noche);
border-bottom: 1px solid var(--trans-50blanco);
}
#headerandina.rojo .cinta svg{
filter:var(--svg-blanco);
}
#headerandina.rojo .cinta ul{
margin: 0 var(--espacio-3xsmall);
}
#headerandina.rojo .cinta ul li:nth-child(1n+2) {
border-left: 1px solid var(--trans-50blanco);
}
#headerandina.rojo .cinta ul li a {
color: var(--col-blanco);
}
#headerandina.rojo .cinta ul li a:hover {
box-shadow: inset -1px -14px 6px var(--trans-20negro), inset 0 -3px 0 var(--trans-20negro);
text-decoration: none !important;
}
#navandina.rojo section svg{
filter:var(--svg-blanco)
}
#navandina.rojo section ul li svg{
filter:var(--svg-blanco)
}
#navandina.rojo section ul li{
color:var(--col-blanco);
display: contents;
}
#navandina.rojo section ul li a{
color:var(--col-blanco);
padding: var(--espacio-2xsmall) 17px;
display: flex;
}
#navandina.rojo section ul li a:hover{
color:var(--col-blanco);
background: var(--trans-10negro);
}
#navandina.rojo section ul li a:link{
color:var(--col-blanco);
text-decoration: none;
}
#navandina.rojo section ul li ul{
display: flex;
flex-direction: column;
text-align: left;
}
#navandina.rojo section ul li ul li {
color:var(--col-oscuro);
width: 100%;
}
#navandina.rojo section ul li ul li a{
color:var(--col-oscuro);
background: var(--col-blanco);
display: inline-block;
width: 100%;
}
#navandina.rojo section ul li ul li a:link{
color:var(--col-oscuro);
display: inline-block;
}
#navandina.rojo section ul li ul li a:hover{
color:var(--col-oscuro);
background: var(--col-gristenue);
display: inline-block;
}
#headerandina.rojo section span button.line{
background: var(--col-rojo);
color: var(--col-blanco);
}
#headerandina.rojo section span svg{
filter:var(--svg-blanco)
}
#headerandina.rojo section span ul li button{
background: var(--col-rojo);
}
/* //////////// HEADER //////////// */
#headerandina{
background: var(--col-blanco);
border-bottom: 1px solid var(--col-aluminio);
}
#headerandina section {
display: flex;
align-items: center;
justify-content: space-between;
overflow: hidden;
position: relative;
padding: var(--espacio-2xsmall) 0;
}
#headerandina section span{
display: flex;
align-items: center;
justify-content: center;
}
#headerandina section span a{
display: flex;
align-items: center;
justify-content: center;
}
#headerandina .cinta {
display: flex;
align-items: center;
justify-content: center;
padding: 0 var(--espacio-3xsmall);
border-bottom: 1px solid var(--col-aluminio);
}
#headerandina .cinta ul{
display: flex;
justify-content: flex-start;
align-items: center;
overflow-x: auto;
white-space: nowrap;
margin: 0 var(--espacio-3xsmall);
}
#headerandina .cinta ul li:nth-child(1n+2) {
border-left: 1px solid var(--col-aluminio);
}
#headerandina .cinta ul li a {
display: inline-block;
text-align: center;
padding: var(--espacio-3xsmall);
text-decoration: none;
transition: box-shadow 0.3s ease;
}
#headerandina .cinta ul li a:hover {
box-shadow: inset -1px -14px 6px var(--trans-10negro), inset 0 -3px 0 var(--trans-10negro);
text-decoration: none !important;
}
#headerandina .cinta ul::-webkit-scrollbar {
height: 0;
}
/* ///////////////// SIDE-BAR LATERAL ///////////////// */
.button-reset {
border: none;
border-width: 0;
padding: initial;
text-transform: initial;
box-shadow: inset 0px 0px 0px 1px #00000029;
letter-spacing: initial;
font-family: inherit;
}
#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-button {
cursor: pointer;
display:flex;
}
section.menu-sidebar {
position: fixed;
top: 0;
left: 0;
width: 80vw;
max-width: 380px;
height: 100vh;
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;
}
section.menu-sidebar ul li a{
display:block;
text-decoration:none;
color: var(--col-fuente);
}
section.menu-sidebar header {
text-align: center;
padding: 0 var(--espacio-xsmall);
display:flex;
flex-direction: column;
justify-content: center;
}
section.menu-sidebar header a svg {
width: 100%;
height: 50px;
max-width: 200px;
margin: var(--espacio-3xsmall) 0;
}
section.menu-sidebar .cinta {
padding: 0 var(--espacio-xsmall);
background: none;
display: flex;
align-items: center;
}
section.menu-sidebar .cinta ul li {
display: inline-block;
border-radius: var(--espacio-4xsmall);
margin: 3px;
overflow: hidden;
background: var(--col-oscuro);
}
section.menu-sidebar .cinta ul li a{
text-decoration: none;
padding: var(--espacio-4xsmall) var(--espacio-3xsmall);
color: var(--col-blanco);
white-space: nowrap;
}
section.menu-sidebar .cinta ul li a:hover{
text-decoration: none;
padding: var(--espacio-4xsmall) var(--espacio-3xsmall);
color: var(--col-blanco);
}
section.menu-sidebar nav {
padding: 0 var(--espacio-xsmall);
display: flex;
align-items: center;
}
section.menu-sidebar nav ul li {
display: inline-block;
margin: 3px;
}
section.menu-sidebar nav ul li a {
text-decoration: none;
padding: var(--espacio-4xsmall) var(--espacio-3xsmall);
white-space: nowrap;
color: var(--col-fuente);
}
section.menu-sidebar section {
padding: 0 var(--espacio-xsmall);
display: flex;
align-items: flex-start;
flex-direction: column;
justify-content: center;
}
section.menu-sidebar section ul {
list-style:disc;
padding: 0 20px;
}
section.menu-sidebar section ul li{
margin: var(--espacio-3xsmall) 0;
line-height: 20px;
display: list-item;
}
section.menu-sidebar section ul li a:hover {
background: none;
text-decoration: underline;
}
section.menu-sidebar .descargueapp {
padding: 0  var(--espacio-xsmall);
display: flex;
align-items: center;
}
section.menu-sidebar .descargueapp section {
border: 1px solid #000000;
padding:  var(--espacio-xsmall)  var(--espacio-2xsmall);
border-radius: var(--espacio-4xsmall);
text-align: center;
}
section.menu-sidebar .descargueapp h6 {
margin-bottom: var(--espacio-2xsmall);
}
section.menu-sidebar .descargueapp span {
display: flex;
}
/* ///////////////// 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%);
}
}
/* //////////// NAVEGADOR //////////// */
nav.navbar-fixed{
position:sticky;
transition: all 0.3s ease-in-out;
top:0;
z-index: 3;
box-shadow: 1px 8px 6px 0px rgb(0 0 0 / 15%);
background: var(--col-blanco)
}
#navandina section {
display: flex;
justify-content: space-between;
align-items: center;
}
#navandina section svg{
filter:var(--svg-fuente)
}
#navandina section ul li svg{
filter:var(--svg-fuente)
}
#navandina section ul li{
color:var(--col-grismedio);
display: contents;
}
#navandina section ul li a{
color:var(--col-grismedio);
padding: var(--espacio-2xsmall) 20px;
display: flex;
}
#navandina section ul li a:hover{
color:var(--col-grismedio);
background: var(--trans-10negro);
}
#navandina section ul li a:link{
color:var(--col-grismedio);
text-decoration: none;
}
#navandina section ul li ul{
display: flex;
flex-direction: column;
text-align: left;
}
#navandina section ul li ul li {
color:var(--col-oscuro);
width: 100%;
}
#navandina section ul li ul li a{
color:var(--col-oscuro);
background: var(--col-blanco);
display: inline-block;
width: 100%;
}
#navandina section ul li ul li a:link{
color:var(--col-oscuro);
display: inline-block;
}
#navandina section ul li ul li a:hover{
color:var(--col-oscuro);
background: var(--col-gristenue);
display: inline-block;
}
nav #nav-submenu{
display: flex;
justify-content: center;
width: 100%;
}
nav #nav-submenu li{
display: inline-block!important;
}
nav #nav-submenu li a{
display: flex;
align-items: center;
}
nav #nav-submenu li a svg{
margin-right: 10px;
}
nav #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);
}
.columnas section{
grid-column: 1 / 18;
grid-row: 1/13;
display: grid;
gap: var(--espacio-small);
align-items: start;
margin-bottom: var(--espacio-2xlarge);
}
.columnas aside{
grid-column: 18 / 23;
grid-row: 1/13;
display: grid;
gap: 20px;
align-items: start;
}
.reset-columnnas{
grid-template-columns: none;
row-gap: var(--espacio-2xsmall);
column-gap: var(--espacio-medium);
}
.secciones .reset-columnnas{
grid-template-columns: none!important;
}
.secciones .trescolumnas {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr));
gap: var(--espacio-medium);
}
article {
display: grid;
gap: var(--espacio-medium);
grid-template-columns: repeat(2, 1fr);
}
article span{
display: grid;
gap: var(--espacio-3xsmall);
}
.trescolumnas{
display: grid;
grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr));
gap: var(--espacio-medium);
}
ul.lista {
display: grid;
gap:var(--espacio-2xsmall);
}
ul.lista  li {
border-top: var(--col-aluminio) 1px solid;
padding-top: var(--espacio-2xsmall);
}
ul.lista  li:nth-last-child(-n + 0) {
border-bottom: var(--col-rojo) 3px solid;
}
.lista-ol {
display: flex;
    flex-direction: column;
gap:0;
background:var(--col-blanco);
}
.lista-ol small{
    padding: 10px;
    text-align: center;
    background: var(--col-noche);
    color: var(--col-blanco);
}
.lista-ol  ol{
        padding: 0 10px 10px 25px;
}
.lista-ol  li {
border-top: var(--col-aluminio) 1px solid;
padding: var(--espacio-xsmall) 0;
}
.lista-ol  li:nth-last-child(-n + 0) {
border-bottom: var(--col-rojo) 3px solid;
}
.titular {
grid-column-start: 1;
width: 100%;
}
.titular b {
display: inline;
border-bottom: 6px solid var(--col-grisoscuro);
padding-bottom: 3px;
margin-bottom: 20px;
}
.titular b:after {
content: "";
width: 100%;
max-width: 100%;
height: .1rem;
background: var(--col-grisoscuro);
display: block;
margin-top: 6px;
}
/* /////////// PUBLICIDAD AVISOS /////////// */
.publateral{
position: relative;
}
.publateral span.derecha,
.publateral span.izquierda {
position: absolute;
width: 160px;
height: 600px;
}
.publateral span.derecha {
left: 49%;
margin-left: -755px;
}
.publateral span.izquierda {
right: 49%;
margin-right: -755px;
}
.publarge{
margin-bottom: var(--espacio-small);
}
.publarge span figure{
max-width: 900px;
width: 100%;
margin: auto;
}
/* //////////// MEDIA //////////// */
@media only screen and (max-width: 722px) {
.trescolumnas article.reset-columnnas {
display: grid;
grid-template-columns: repeat(2, 1fr);
}
.col-10autofill {
grid-template-columns: repeat(auto-fill, minmax(5rem, 1fr));
}
}
@media only screen and (max-width: 600px) {
.columnas section{
grid-column: 1 / 23;
grid-row: inherit;
}
.columnas aside{
grid-column: 1 / 23;
grid-row: inherit;
}
.col-10autofill {
grid-template-columns: repeat(2, 1fr);
display: grid;
}
.floating-btn:hover {
width: 300px;
}
.display-block {
display: block;
}
section.columnas.col-2 {
    display: flex;
    flex-direction: column;
    width: 80%;
    margin: 6% auto;
}
}