:root {
    /*Tipografías*/
    --fuenteT: 'Encode Sans', sans-serif;
    --fuenteP: 'Roboto', sans-serif;
    /*Paleta cromática*/
    --celeste: #33BBED;
    --verde: #D6E031;
    --magenta: #EE3D8F;
    --turquesa: #5DBCC5;
    --naranja: #F79421;
    --violeta: #9283BE;
    --verdeOscuro: #56B6B1;
    --amarillo: #FFD100;
    --gris1: #E7E7E7;
    --gris2: #AAAAAA;
    --gris3: #50535C;
}

/*Utilidades*/

.center{
    text-align: center;
}

.fuenteT{
    font-family: var(--fuenteT);

}


.fadeInLeft{
    left: 0 !important;
}

.fadeInUp{
    bottom: -75% !important;
}

.fadeOutLeft{
    left: -100%;
}

.fondoFijo{
    position: fixed;
}

.selected{
    background-color: var(--gris1);
    color: white !important;
}
/*Globales*/

html {
    box-sizing: border-box;
    font-size: 62.5%;
    /* Now 10px = 1rem! */
}

*,
*:before,
*:after {
    box-sizing: inherit;
}

body {
    font-family: var(--fuenteP);
    font-size: 1.6rem;
}

body,
h2,
ul,
figure,
p {
    margin: 0;
    padding: 0;
}

img {
    max-width: 100%;
    max-height: 100%;
}


a {
    text-decoration: none;
    color: var(--gris3);
}

li {
    list-style: none;
}

h1 {
    font-family: var(--fuenteT);
    font-size: 4rem;
    color: white;
}

h2 {
    font-family: var(--fuenteT);
    font-size: 2.5rem;
}

h3 {
    font-family: var(--fuenteT);
}

sup{
    font-size: 1rem;
}

section.lienzo article p{
    color: var(--gris3);
    padding-bottom: 1rem;
    line-height: 140%;
}

/*section.lienzo article span{
    position: absolute;
    bottom: .5rem;
    font-size: 1.2rem;
    color: var(--gris3);
    font-family: var(--fuenteT);
}*/

section.lienzo article p a i{
    color: var(--celeste);
    font-size: 1.6rem;
}

section.lienzo.prologo article p{
    margin: 0 1rem;
}

/*Estilos*/

/*img.logo-esc{
    width: 80%;
}*/

img.reconstruccion-esc {
    position: fixed;
    z-index: 1001;
    bottom: 9rem;
    right: 1.5rem;
}

img.reconstruccion-movil {
    display: none;
}

img.escudo-movil {
    display: none;
}

#menu-movil {
    display: none;
}

.lienzo-menu-movil{
    display: none;
}

.header-section {
    background-color: var(--gris1);
    display: grid;
    grid-template-columns: 80px 1fr 1fr 1fr 1fr 1fr 1fr 100px;
    grid-template-rows: 120px 1fr 80px;
    height: 100vh;
    grid-template-areas: 
        "vertice titulo titulo titulo titulo titulo isologotipo isologotipo" 
        "izq capitulo capitulo capitulo capitulo capitulo capitulo der"
        "footer footer footer footer footer footer footer footer";
}

.header-section-vertice {
    grid-area: vertice;
    background-color: var(--celeste);
    z-index: 100;
}

.header-section-titulo {
    grid-area: titulo;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    background-color: var(--celeste);
    z-index: 100;
}


/*.header-section-espacio{
	grid-area: espacio;
	background-color: var(--celeste);
}*/

.header-section-isologotipo {
    grid-area: isologotipo;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--celeste);
    z-index: 100;
}

.header-section-izq {
    grid-area: izq;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    background-color: white;
    z-index: 100;
    box-shadow: 0 -.125rem 1rem rgba(0,0,0,.075);
    padding-top: 5rem;
}

.header-section-izq p:nth-child(2) a{
    margin-left: 1.5rem;
}

.header-section-izq p {
    transform: rotate(270deg);
}

.header-section-izq a {
    color: var(--celeste);
    padding: 2rem;
}

.header-section-der {
    grid-area: der;
    /*display: flex;
	flex-direction: column;
	justify-content: space-evenly;*/
    background-color: white;
    z-index: 100;
    box-shadow: 0 -.125rem 1rem rgba(0,0,0,.075);
}

.header-section-capitulo {
    grid-area: capitulo;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr 1fr;
    /*grid-gap: 1rem;*/
    grid-template-areas: 
        "capitulo1 capitulo2 capitulo3 capitulo4 capitulo5" 
        "capitulo6 capitulo7 capitulo8 capitulo9 capitulo10" 
        "capitulo11 capitulo12 capitulo13 capitulo14 capitulo15";
}

.capitulo-cover {
    padding: 1rem;
}

.capitulo-cover h2 {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    height: inherit;
    font-family: var(--fuenteT);
    font-size: 3rem;
    color: white;
    /*line-height: 1.4;*/
}

/*.capitulo-cover h2.-size {
    font-size: 3rem;
}*/

.header-section-bottom {
    grid-area: footer;
    display: flex;
    justify-content: space-around;
    align-items: center;
    font-family: var(--fuenteT);
    font-size: 1.8rem;
    background-color: var(--gris1);
    z-index: 100;
    box-shadow: 0 -0.125rem 1rem rgb(0 0 0 / 8%);
}

.header-section-bottom a {
    color: var(--gris3);
}


/*CONTENIDO*/

section.lienzo.anteriores .contenedor,
section.lienzo.informe-completo .contenedor{
    display: grid;
    grid-template-columns: 80px 1fr 100px;
    grid-template-rows: 1fr 80px;
    height: 100vh;
    background-color: var(--gris1);
    grid-template-areas: 
        /*"arriba arriba arriba"*/
        "izquierda slide derecha" 
        "abajo abajo abajo";
}


section.lienzo.anteriores .contenedor article{
    grid-area: slide;
    
}


section.lienzo.anteriores .contenedor article,
section.lienzo.informe-completo .contenedor article{
    padding: 1rem 3rem 0;
    color: var(--gris3);
}

section.lienzo.anteriores .contenedor article h2,
section.lienzo.informe-completo .contenedor article h2{
    font-size: 2.5rem;
}

section.lienzo.anteriores .contenedor article h2{
    margin-bottom: 1rem;
}

section.lienzo.anteriores .contenedor article ul{
    display: flex;
    flex-wrap: wrap;
    /*justify-content: center;*/
    gap: 3rem;
    /*margin: 3rem 3rem 0;*/
}

section.lienzo.anteriores .contenedor article ul.ul-anteriores li h3{
    width: 4rem;
    height: 4rem;
    background-color: white;
    border-radius: 50%;
    color: var(--gris3);
    font-family: var(--fuenteT);
    font-size: 1.3rem;
    font-weight: 600;
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}


section.lienzo.anteriores .contenedor article p.cerrar-abajo,
section.lienzo.informe-completo .contenedor article p.cerrar-abajo{
    margin-top: 1rem !important;
}

section.lienzo.anteriores .contenedor article p.link-esc,
section.lienzo.informe-completo .contenedor article p.link-esc{
    margin-top: 1rem;
}

section.lienzo.anteriores .contenedor article p,
section.lienzo.informe-completo .contenedor article p{
    padding-bottom: 0 !important;
}

section.lienzo.informe-completo .contenedor article i{
    color: #EB1000;
    font-size: 2rem;
}

section.lienzo.gestion .contenedor,
section.lienzo.cyps .contenedor,
section.lienzo.energia .contenedor,
section.lienzo.quimicos .contenedor,
section.lienzo.socioeconomicos .contenedor,
section.lienzo.acuaticos .contenedor,
section.lienzo.biodiversidad .contenedor,
section.lienzo.mineria .contenedor,
section.lienzo.cclimatico .contenedor,
section.lienzo.suelos .contenedor,
section.lienzo.bosques .contenedor,
section.lienzo.anp .contenedor,
section.lienzo.residuos .contenedor,
section.lienzo.atmosfera .contenedor,
section.lienzo.agyp .contenedor,
section.lienzo.prologo .contenedor {
    display: grid;
    grid-template-columns: 80px 1fr 1fr 1fr 100px;
    grid-template-rows: 120px 1fr 80px;
    height: 100vh;
    grid-template-areas: 
        "arriba arriba arriba arriba arriba"
        "izquierda sidebar slide slide derecha" 
        "abajo abajo abajo abajo abajo";
}

section.lienzo.intro .contenedor{
    display: grid;
    grid-template-columns: 80px 1fr 100px;
    grid-template-rows: 120px 1fr 80px;
    height: 100vh;
    grid-template-areas: 
        "arriba arriba arriba"
        "izquierda slide derecha" 
        "abajo abajo abajo";
}

section.lienzo.autoridades .contenedor,
section.lienzo.realizacion .contenedor{
    display: grid;
    grid-template-columns: 80px 1fr;
    grid-template-rows: 120px 1fr 80px;
    height: 100vh;
    grid-template-areas: 
        "arriba arriba"
        "izquierda slide" 
        "abajo abajo";
}

section.lienzo.gestion,
section.lienzo.cyps,
section.lienzo.energia,
section.lienzo.quimicos,
section.lienzo.socioeconomicos,
section.lienzo.acuaticos,
section.lienzo.biodiversidad,
section.lienzo.mineria,
section.lienzo.cclimatico,
section.lienzo.suelos,
section.lienzo.bosques,
section.lienzo.anp,
section.lienzo.residuos,
section.lienzo.atmosfera,
section.lienzo.agyp{
    display: none;
    position: fixed;
    top: 0;
    width: 100%;
    height: 100vh;
    background-color: white;
}

section.lienzo.prologo,
section.lienzo.intro{
    position: fixed;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100vh;
    background-color: white;
    transition: .5s;
    /*ver si necesita prefijos*/
}

section.lienzo.autoridades{
    position: fixed;
    top: 0;
    left: -100%;
    /*width: 100%;*/
    height: 100vh;
    background-color: white;
    transition: .5s;
    /*ver si necesita prefijos*/
}

section.lienzo.realizacion{
    position: fixed;
    top: 0;
    left: -100%;
    width: 25%;
    height: 100vh;
    background-color: white;
    transition: .5s;
    /*ver si necesita prefijos*/
}

section.lienzo.informe-completo,
section.lienzo.anteriores{
    position: fixed;
    bottom: -100%;
    width: 100%;
    height: 100vh;
    background-color: white;
    transition: .5s;
}



section.lienzo.gestion .contenedor .grid-top,
section.lienzo.cyps .contenedor .grid-top,
section.lienzo.energia .contenedor .grid-top,
section.lienzo.quimicos .contenedor .grid-top,
section.lienzo.socioeconomicos .contenedor .grid-top,
section.lienzo.acuaticos .contenedor .grid-top,
section.lienzo.biodiversidad .contenedor .grid-top,
section.lienzo.mineria .contenedor .grid-top,
section.lienzo.cclimatico .contenedor .grid-top,
section.lienzo.suelos .contenedor .grid-top,
section.lienzo.bosques .contenedor .grid-top,
section.lienzo.anp .contenedor .grid-top,
section.lienzo.residuos .contenedor .grid-top,
section.lienzo.atmosfera .contenedor .grid-top,
section.lienzo.agyp .contenedor .grid-top,
section.lienzo.autoridades .contenedor .grid-top,
section.lienzo.prologo .contenedor .grid-top,
section.lienzo.intro .contenedor .grid-top,
section.lienzo.realizacion .contenedor .grid-top {
    grid-area: arriba;
}

section.lienzo.gestion .contenedor .grid-left,
section.lienzo.cyps .contenedor .grid-left,
section.lienzo.energia .contenedor .grid-left,
section.lienzo.quimicos .contenedor .grid-left,
section.lienzo.socioeconomicos .contenedor .grid-left,
section.lienzo.acuaticos .contenedor .grid-left,
section.lienzo.biodiversidad .contenedor .grid-left,
section.lienzo.mineria .contenedor .grid-left,
section.lienzo.cclimatico .contenedor .grid-left,
section.lienzo.suelos .contenedor .grid-left,
section.lienzo.bosques .contenedor .grid-left,
section.lienzo.anp .contenedor .grid-left,
section.lienzo.residuos .contenedor .grid-left,
section.lienzo.atmosfera .contenedor .grid-left,
section.lienzo.agyp .contenedor .grid-left,
section.lienzo.autoridades .contenedor .grid-left,
section.lienzo.prologo .contenedor .grid-left,
section.lienzo.intro .contenedor .grid-left,
section.lienzo.realizacion .contenedor .grid-left {
    grid-area: izquierda;
}

section.lienzo .contenedor aside p.text-descarga i{
    font-size: 1.6rem !important;
    color: var(--celeste);
}

section.lienzo.suelos .contenedor aside {
    grid-area: sidebar;
    background-color: rgba(215, 223, 035, .5);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1rem;
    margin: 1rem;
    color: var(--gris3);
}

section.lienzo.acuaticos .contenedor aside {
    grid-area: sidebar;
    background-color: rgba(238, 061, 143, .5);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1rem;
    margin: 1rem;
    color: var(--gris3);
}

section.lienzo.anp .contenedor aside {
    grid-area: sidebar;
    background-color: rgba(080,184,177, .5);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1rem;
    margin: 1rem;
    color: var(--gris3);
}

section.lienzo.residuos .contenedor aside {
    grid-area: sidebar;
    background-color: rgba(255,209,000, .5);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1rem;
    margin: 1rem;
    color: var(--gris3);
}

section.lienzo.atmosfera .contenedor aside {
    grid-area: sidebar;
    background-color: rgba(247, 148, 032, .5);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1rem;
    margin: 1rem;
    color: var(--gris3);
}

section.lienzo.biodiversidad .contenedor aside {
    grid-area: sidebar;
    background-color: rgba(080,184,177, .5);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1rem;
    margin: 1rem;
    color: var(--gris3);
}

section.lienzo.quimicos .contenedor aside {
    grid-area: sidebar;
    background-color: rgba(215, 223, 035, .5);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1rem;
    margin: 1rem;
    color: var(--gris3);
}

section.lienzo.bosques .contenedor aside {
    grid-area: sidebar;
    background-color: rgba(238, 061, 143, .5);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1rem;
    margin: 1rem;
    color: var(--gris3);
}

section.lienzo.cyps .contenedor aside {
    grid-area: sidebar;
    background-color: rgba(247, 148, 032, .5);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1rem;
    margin: 1rem;
    color: var(--gris3);
}

section.lienzo.mineria .contenedor aside {
    grid-area: sidebar;
    background-color: rgba(215, 223, 035, .5);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1rem;
    margin: 1rem;
    color: var(--gris3);
}

section.lienzo.socioeconomicos .contenedor aside {
    grid-area: sidebar;
    background-color: rgba(146, 131, 190, .5);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1rem;
    margin: 1rem;
    color: var(--gris3);
}

section.lienzo.agyp .contenedor aside {
    grid-area: sidebar;
    background-color: rgba(080,184,177, .5);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1rem;
    margin: 1rem;
    color: var(--gris3);
}

section.lienzo.cclimatico .contenedor aside {
    grid-area: sidebar;
    background-color: rgba(146, 131, 190, .5);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1rem;
    margin: 1rem;
    color: var(--gris3);
}

section.lienzo.gestion .contenedor aside {
    grid-area: sidebar;
    background-color: rgba(238, 061, 143, .5);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1rem;
    margin: 1rem;
    color: var(--gris3);
}



section.lienzo.energia .contenedor aside {
    grid-area: sidebar;
    background-color: rgba(255,209,000, .5);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1rem;
    margin: 1rem;
    color: var(--gris3);
}


section.lienzo.prologo .contenedor aside{
    grid-area: sidebar;
    background-color: var(--celeste);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1rem;
    margin: 1rem;
}

p.cerrar {
    display: flex;
    justify-content: flex-end;
}

p.cerrar a {
    cursor: pointer;
    font-family: var(--fuenteT);
    font-size: 2.5rem;
    font-weight: 800;
    position: absolute;
       
}

section.lienzo.autoridades .contenedor article p,
section.lienzo.intro .contenedor article p,
section.lienzo.anteriores .contenedor article p,
section.lienzo.realizacion .contenedor article p{
    padding-bottom: 0;
}

section.lienzo.anteriores .contenedor article p.link-esc,
section.lienzo.realizacion .contenedor article p.link-esc{
    /*display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;*/
    margin: 0 3rem;
}

section.lienzo.intro .contenedor article p.parrafo{
    padding-bottom: 1rem;
    margin: 0 3rem;
}

section.lienzo.gestion .contenedor aside h2,
section.lienzo.cyps .contenedor aside h2,
section.lienzo.energia .contenedor aside h2,
section.lienzo.quimicos .contenedor aside h2,
section.lienzo.socioeconomicos .contenedor aside h2,
section.lienzo.acuaticos .contenedor aside h2,
section.lienzo.biodiversidad .contenedor aside h2,
section.lienzo.mineria .contenedor aside h2,
section.lienzo.cclimatico .contenedor aside h2,
section.lienzo.suelos .contenedor aside h2,
section.lienzo.bosques .contenedor aside h2,
section.lienzo.anp .contenedor aside h2,
section.lienzo.residuos .contenedor aside h2,
section.lienzo.atmosfera .contenedor aside h2,
section.lienzo.agyp .contenedor aside h2{
    /*text-align: center;*/
    margin-bottom: 1rem;
}

section.lienzo.prologo .contenedor article h2{
    color: var(--gris3);
    margin: 0 0 1rem 1rem;
}

section.lienzo.autoridades .contenedor article h2,
section.lienzo.intro .contenedor article h2,
section.lienzo.realizacion .contenedor article h2 {
    /*text-align: center;*/
    color: var(--gris3);
    margin: 0 0 1rem 3rem;
   /* margin-bottom: 1rem;
    background-image: url(../img/titulo-bg.jpg);
    background-repeat: repeat-x;
    background-position: center center;*/
}

section.lienzo.realizacion .contenedor article h2{
    font-size: 1.6rem;
}

/*section.lienzo.autoridades .contenedor article h2,
section.lienzo.intro .contenedor article h2,
section.lienzo.anteriores .contenedor article h2{
    margin-right: 3.5rem;
}*/

/*section.lienzo.autoridades .contenedor article h2,
section.lienzo.anteriores .contenedor article h2{
    margin: 0 0 3rem 3rem;
}*/

/*section.lienzo.prologo .contenedor article h2 span,
section.lienzo.autoridades .contenedor article h2 span,
section.lienzo.intro .contenedor article h2 span,
section.lienzo.anteriores .contenedor article h2 span{
    padding: 0 3rem;
    background-color: white;
}*/

section.lienzo.gestion .contenedor aside p i{
    font-size: 1.3rem;
}

section.lienzo.gestion .contenedor aside p.parrafo-esc,
section.lienzo.cyps .contenedor aside p.parrafo-esc,
section.lienzo.energia .contenedor aside p.parrafo-esc,
section.lienzo.quimicos .contenedor aside p.parrafo-esc,
section.lienzo.socioeconomicos .contenedor aside p.parrafo-esc,
section.lienzo.acuaticos .contenedor aside p.parrafo-esc,
section.lienzo.biodiversidad .contenedor aside p.parrafo-esc,
section.lienzo.mineria .contenedor aside p.parrafo-esc,
section.lienzo.cclimatico .contenedor aside p.parrafo-esc,
section.lienzo.suelos .contenedor aside p.parrafo-esc,
section.lienzo.bosques .contenedor aside p.parrafo-esc,
section.lienzo.anp .contenedor aside p.parrafo-esc,
section.lienzo.residuos .contenedor aside p.parrafo-esc,
section.lienzo.atmosfera .contenedor aside p.parrafo-esc,
section.lienzo.agyp .contenedor aside p.parrafo-esc {
    font-size: 1.8rem;
    font-weight: 300;
    line-height: 2.2rem;
    padding-bottom: 1rem;
    /*text-align: center;*/
}

section.lienzo.residuos .contenedor aside p.parrafo-esc span{
    line-height: 3rem;
    font-weight: 700;
    font-family: var(--fuenteT);
    font-size: 2rem;
}
section.lienzo.residuos .contenedor aside p.parrafo-esc:last-child{
    margin-top: .5rem;
}

section.lienzo.gestion .contenedor aside p.text-descarga,
section.lienzo.cyps .contenedor aside p.text-descarga,
section.lienzo.energia .contenedor aside p.text-descarga,
section.lienzo.quimicos .contenedor aside p.text-descarga,
section.lienzo.socioeconomicos .contenedor aside p.text-descarga,
section.lienzo.acuaticos .contenedor aside p.text-descarga,
section.lienzo.biodiversidad .contenedor aside p.text-descarga,
section.lienzo.mineria .contenedor aside p.text-descarga,
section.lienzo.cclimatico .contenedor aside p.text-descarga,
section.lienzo.suelos .contenedor aside p.text-descarga,
section.lienzo.bosques .contenedor aside p.text-descarga,
section.lienzo.anp .contenedor aside p.text-descarga,
section.lienzo.residuos .contenedor aside p.text-descarga,
section.lienzo.atmosfera .contenedor aside p.text-descarga,
section.lienzo.agyp .contenedor aside p.text-descarga {
    font-family: var(--fuenteT);
    font-size: 1.8rem;
    /*text-align: center;*/
    font-weight: 700;
}

section.lienzo.gestion .contenedor article,
section.lienzo.cyps .contenedor article,
section.lienzo.energia .contenedor article,
section.lienzo.quimicos .contenedor article,
section.lienzo.socioeconomicos .contenedor article,
section.lienzo.acuaticos .contenedor article,
section.lienzo.biodiversidad .contenedor article,
section.lienzo.mineria .contenedor article,
section.lienzo.cclimatico .contenedor article,
section.lienzo.suelos .contenedor article,
section.lienzo.bosques .contenedor article,
section.lienzo.anp .contenedor article,
section.lienzo.residuos .contenedor article,
section.lienzo.atmosfera .contenedor article,
section.lienzo.agyp .contenedor article{
    grid-area: slide;
    background-color: var(--gris1);
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    margin: 1rem 1rem 1rem 0;
    padding: 1rem;
}

section.lienzo.autoridades .contenedor article,
section.lienzo.realizacion .contenedor article {
    grid-area: slide;
    /*background-color: white;*/
    padding: 1rem;
}

section.lienzo.realizacion .contenedor article {
    display: flex;
    flex-direction: column;
    justify-content: end;
}
    
section.lienzo.prologo .contenedor article {
    grid-area: slide;
    background-color: white;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    /*margin: 1rem 0;*/
    padding: 1rem;
}

section.lienzo.intro .contenedor article{
    grid-area: slide;
    background-color: white;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    /*margin: 1rem 0;*/
    padding: 1rem;
}


section.lienzo.autoridades .contenedor article ul,
section.lienzo.realizacion .contenedor article ul{
    /*display: flex;*/
    /*flex-wrap: wrap;*/
    /*justify-content: center;*/
    /*gap: 2rem;*/
    margin: 0 3rem;
}


section.lienzo.autoridades .contenedor article ul li{
    flex-basis: 45%;
    font-family: var(--fuenteT);
}

section.lienzo.realizacion .contenedor article ul li{
    margin-bottom: 1rem;
}

section.lienzo.autoridades .contenedor article ul li h3{
    margin: 0 0 1rem;
    font-size: 1.6rem;
}

section.lienzo.realizacion .contenedor article ul li h3{
    margin: 0;
    font-size: 1.6rem;
}

section.lienzo.anteriores .contenedor article ul li h3{
    margin: 0 0 .5rem;
}

section.lienzo.realizacion .contenedor article ul.ul-anteriores li h3{
    width: 5rem;
    height: 5rem;
    background-color: var(--gris1);
    border-radius: 50%;
    color: var(--gris3);
    font-family: var(--fuenteT);
    font-size: 1.4rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

section.lienzo.autoridades .contenedor article ul li p{
    /*padding-bottom: .5rem;*/
    font-size: 1.3rem;
}

section.lienzo.anteriores .contenedor article ul.ul-anteriores li p,
section.lienzo.realizacion .contenedor article ul.ul-anteriores li p{
    font-size: 1.6rem;
    padding-bottom: 1rem;
    font-weight: 700;
}

section.lienzo.anteriores .contenedor article ul.equipo-esc li p{
    font-size: 1.6rem;
    padding-bottom: 1rem;
}

section.lienzo.gestion .grafico-slide,
section.lienzo.cyps .grafico-slide,
section.lienzo.energia .grafico-slide,
section.lienzo.quimicos .grafico-slide,
section.lienzo.socioeconomicos .grafico-slide,
section.lienzo.acuaticos .grafico-slide,
section.lienzo.biodiversidad .grafico-slide,
section.lienzo.mineria .grafico-slide,
section.lienzo.cclimatico .grafico-slide,
section.lienzo.suelos .grafico-slide,
section.lienzo.bosques .grafico-slide,
section.lienzo.anp .grafico-slide,
section.lienzo.residuos .grafico-slide,
section.lienzo.atmosfera .grafico-slide,
section.lienzo.agyp .grafico-slide,
section.lienzo.prologo .grafico-slide {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: white;
    padding: 1rem;
    height: 70%;
    /*margin: 0 5rem;*/
}

section.lienzo.gestion article p,
section.lienzo.cyps article p,
section.lienzo.energia article p,
section.lienzo.quimicos article p,
section.lienzo.socioeconomicos article p,
section.lienzo.acuaticos article p,
section.lienzo.biodiversidad article p,
section.lienzo.mineria article p,
section.lienzo.cclimatico article p,
section.lienzo.suelos article p,
section.lienzo.bosques article p,
section.lienzo.anp article p,
section.lienzo.residuos article p,
section.lienzo.atmosfera article p,
section.lienzo.agyp article p {
    padding: 1rem;
    font-family: var(--fuenteT);
    font-size: 1.8rem;
    color: var(--gris3);
    /*background-color: var(--gris1);*/
    /*text-align: center;*/
}

section.lienzo.gestion .contenedor .grid-right,
section.lienzo.cyps .contenedor .grid-right,
section.lienzo.energia .contenedor .grid-right,
section.lienzo.quimicos .contenedor .grid-right,
section.lienzo.socioeconomicos .contenedor .grid-right,
section.lienzo.acuaticos .contenedor .grid-right,
section.lienzo.biodiversidad .contenedor .grid-right,
section.lienzo.mineria .contenedor .grid-right,
section.lienzo.cclimatico .contenedor .grid-right,
section.lienzo.suelos .contenedor .grid-right,
section.lienzo.bosques .contenedor .grid-right,
section.lienzo.anp .contenedor .grid-right,
section.lienzo.residuos .contenedor .grid-right,
section.lienzo.atmosfera .contenedor .grid-right,
section.lienzo.agyp .contenedor .grid-right,
section.lienzo.prologo .contenedor .grid-right,
section.lienzo.intro .contenedor .grid-right,
section.lienzo.anteriores .contenedor .grid-right{
    grid-area: derecha;
}

section.lienzo.gestion .contenedor .grid-bottom,
section.lienzo.cyps .contenedor .grid-bottom,
section.lienzo.energia .contenedor .grid-bottom,
section.lienzo.quimicos .contenedor .grid-bottom,
section.lienzo.socioeconomicos .contenedor .grid-bottom,
section.lienzo.acuaticos .contenedor .grid-bottom,
section.lienzo.biodiversidad .contenedor .grid-bottom,
section.lienzo.mineria .contenedor .grid-bottom,
section.lienzo.cclimatico .contenedor .grid-bottom,
section.lienzo.suelos .contenedor .grid-bottom,
section.lienzo.bosques .contenedor .grid-bottom,
section.lienzo.anp .contenedor .grid-bottom,
section.lienzo.residuos .contenedor .grid-bottom,
section.lienzo.atmosfera .contenedor .grid-bottom,
section.lienzo.agyp .contenedor .grid-bottom,
section.lienzo.autoridades .contenedor .grid-bottom,
section.lienzo.prologo .contenedor .grid-bottom,
section.lienzo.intro .contenedor .grid-bottom,
section.lienzo.anteriores .contenedor .grid-bottom,
section.lienzo.realizacion .contenedor .grid-bottom {
    grid-area: abajo;
}

ul.slider-gestion,
ul.slider-cyps,
ul.slider-energia,
ul.slider-quimicos,
ul.slider-socioeconomicos,
ul.slider-acuaticos,
ul.slider-biodiversidad,
ul.slider-mineria,
ul.slider-cclimatico,
ul.slider-suelos,
ul.slider-bosques,
ul.slider-anp,
ul.slider-residuos,
ul.slider-atmosfera,
ul.slider-agyp{
    position: relative;
    height: 100%;
}

ul.slider-gestion li,
ul.slider-cyps li,
ul.slider-energia li,
ul.slider-quimicos li,
ul.slider-socioeconomicos li,
ul.slider-acuaticos li,
ul.slider-biodiversidad li,
ul.slider-mineria li,
ul.slider-cclimatico li,
ul.slider-suelos li,
ul.slider-bosques li,
ul.slider-anp li,
ul.slider-residuos li,
ul.slider-atmosfera li,
ul.slider-agyp li{
    height: 100%;
}


.footer-slide{
    height: 30%;
    display: flex;
    align-items: center;
    padding: 0 5rem;
}

.paginador-prologo{
    display: flex;
    margin: 0 auto;
}



.right-slide-prologo i{
    position: relative;
    /*bottom: 12%;*/
    cursor: pointer;
    font-size: 3rem;
    color: var(--gris3)
}

.left-slide-gestion i,
.right-slide-gestion i,
.left-slide-cyps i,
.right-slide-cyps i,
.left-slide-energia i,
.right-slide-energia i,
.left-slide-quimicos i,
.right-slide-quimicos i,
.left-slide-socioeconomicos i,
.right-slide-socioeconomicos i,
.left-slide-acuaticos i,
.right-slide-acuaticos i,
.left-slide-biodiversidad i,
.right-slide-biodiversidad i,
.left-slide-mineria i,
.right-slide-mineria i,
.left-slide-cclimatico i,
.right-slide-cclimatico i,
.left-slide-suelos i,
.right-slide-suelos i,
.left-slide-bosques i,
.right-slide-bosques i,
.left-slide-anp i,
.right-slide-anp i,
.left-slide-residuos i,
.right-slide-residuos i,
.left-slide-atmosfera i,
.right-slide-atmosfera i,
 .left-slide-agyp i,
.right-slide-agyp i{
    position: absolute;
    bottom: 15%;
    cursor: pointer;
    font-size: 3rem;
    color: var(--gris3);
}

.left-slide-gestion i,
.left-slide-cyps i,
.left-slide-energia i,
.left-slide-quimicos i,
.left-slide-socioeconomicos i,
.left-slide-acuaticos i,
.left-slide-biodiversidad i,
.left-slide-mineria i,
.left-slide-cclimatico i,
.left-slide-suelos i,
.left-slide-bosques i,
.left-slide-anp i,
.left-slide-residuos i,
.left-slide-atmosfera i,
.left-slide-agyp i{
    left: 1rem;
}

.right-slide-gestion i,
.right-slide-cyps i,
.right-slide-energia i,
.right-slide-quimicos i,
.right-slide-socioeconomicos i,
.right-slide-acuaticos i,
.right-slide-biodiversidad i,
.right-slide-mineria i,
.right-slide-cclimatico i,
.right-slide-suelos i,
.right-slide-bosques i,
.right-slide-anp i,
.right-slide-residuos i,
.right-slide-atmosfera i,
.right-slide-agyp i{
    right: 1rem;
}


/*CONTENIDO PROLOGO*/


section.lienzo.prologo .contenedor aside h3{
    color: var(--gris3);
    margin-bottom: 1rem;
}

section.lienzo.prologo .contenedor aside img{
    border-radius: 50%;
}

section.lienzo.prologo .contenedor aside p.frase-destaca{
    font-family: var(--fuenteT);
    font-size: 3rem;
    color: white;
    font-weight: 700;
    margin-top: 2rem;
    padding: 0 2rem;
}

/*=============================================
=                   LOADER                   =
=============================================*/

.centrado{
    position: fixed;
    width: 100%;
    height: 100vh;
    background-color: #F1F1F2;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1010;
}

.hidden{
    overflow: hidden;
}

.spin-wrap{
    margin-top: -18px;
}

.preloader {
    position: relative;
    transform: rotate(45deg);
    transform-origin: 18px 18px;
}

.preloader div{
    top: 25px;
    left: 70px;
    position: relative;
    width: 18px;
    height: 18px;
    background: var(--amarillo);
    opacity: .6;
}

.preloader div:after,
.preloader div:before {
    content: " ";
    position: absolute;
    display: block;
    width: 18px;
    height: 18px;
    background: var(--amarillo);
}
.preloader div:before {
    left: -12px;
    border-radius: 50% 0 0 50%;
}
.preloader div:after {
    top: -12px;
    border-radius: 50% 50% 0 0;
}


.preloader2 {
  border: 1.8rem solid var(--celeste);
  border-top: 1.8rem solid white;
  border-radius: 50%;
  width: 10rem;
  height: 10rem;
  animation: spin 1s ease-in-out infinite ;
  opacity: .7;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

