/* Estilo 20243 / 1 de Revista Realidad Educativa, por Consuelo Salas Lamadrid */

@media (min-width: 1200px) {
    body {    
        background-color: #fcf9f7;
        margin: 0 auto;
        max-width: 900px;
        font-family: Garamond, serif; 
        text-align: justify;
        font-size: large;
        display: block;
        }

    #rre {
        width: 7vw;
        margin-top: 0;
        margin-bottom: 0;
        margin-left: -40px;
        margin-right: 0;
    }
    
    #facu {   
        width: 18vw;
        margin-top: 0;
        margin-bottom: 0;
        margin-left: 0;
        margin-right: -50px;
    }
}
 
@media (max-width: 1200px) {

    body {    
        background-color: #fcf9f7;
        margin: 0 8%;
        max-width: 900px;
        font-family: Garamond, serif; 
        text-align: justify;
        font-size: medium;
        display: block;
    }

    #rre {
        width: 9vw;
        margin-top: 0;
        margin-bottom: 0;
        margin-left: -40px;
        margin-right: 0;
    }
    
    #facu {   
        width: 22vw;
        margin-top: 0;
        margin-bottom: 0;
        margin-left: 0;
        margin-right: -50px;
    }
}

@media (max-width: 900px) {
    body {    
        background-color: #fcf9f7;
        margin: 0 8%;
        font-family: Garamond, serif; 
        text-align: justify;
        font-size: medium;
        display: block;
        }
   
    #rre {
        width: 12vw;
        margin-top: 0;
        margin-bottom: 0;
        margin-left: -40px;
        margin-right: 0;
    }
    
    #facu {   
        width: 28vw;
        margin-top: 0;
        margin-bottom: 0;
        margin-left: 0;
        margin-right: -50px;
    }
}


@media (max-width: 300px) {
    body {    
        background-color: #fcf9f7;
        margin: 0 8%;
        font-family: Garamond, serif; 
        text-align: justify;
        font-size: medium;
        display: block;
    }    

    #rre, #facu {
        display: none;
        }
}

:root {
    --color-numero: #C29539;
}

.grilla {
    display: grid;
    grid-template-columns: auto auto;
    grid-template-rows: auto;
}

.grid-imgl {
    grid-row-start: 1;
    grid-row-end: 2;
    grid-column-start: 1;
    grid-column-end: 2;
    justify-self: start;
}
.grid-imgr {
    grid-row-start: 1;
    grid-row-end: 2;
    grid-column-start: 2;
    grid-column-end: 3;
    justify-self: end;
}

header{
    text-align: center;
    font-family: "Barlow", helvetica, sans-serif;
}

h1, h2, h3, h4, h5 {
    font-family: "Barlow", helvetica, sans-serif;
}

h3, h4 {
    margin-top: 2em;
}

h1 {
    font-size: 1.6em;
}

h2 {
    font-size: 1.5em;
}

h3 {
    font-size: 1.2em;
    text-transform: uppercase;
    color: var(--color-numero);
}

h4, h5 {
    font-size: 1.1em;
    color: var(--color-numero);
}

h5 {
    font-size: 1em;
    font-variant: small-caps;
}

h6{
    font-size: 1em;
    font-family: Garamond, serif;    
    color: #696969;
}

blockquote {
    font-size: 0.9em;   
}

tbody {
    font-family: "Barlow", helvetica, sans-serif;
    font-size: 0.8em 
}

table {
    margin-top: 1em;         
    width: 100%;
    border: 1px solid var(--color-numero);  
    color: #696969;  
    padding: 2%;
    text-align: left;
    border-collapse:collapse; 
    border-right: none;   
    border-left: none; 
}

table .borderr {
    border-right: 1px solid var(--color-numero);
}

table .borderl {
    border-left: 1px solid var(--color-numero);
}

th {
    font-weight: bold;
}

td, tr {
    border: 1px solid var(--color-numero); 
}

th, td, tr {
    border-right: none;
    border-left: none; 
    padding: 1.5%;
    vertical-align: super;
}

caption, figcaption {
    font-family: "Barlow", helvetica, sans-serif;
    font-weight: bold;
    color: var(--color-numero);       
    font-size: 0.8em;
    padding-bottom: 1em;
    text-align: right;
}


ol li, ul li {margin-top: 0.8em}

footer {
    text-align: right;
}

footer figure{
    text-align: center;
}

.espanol {
    color: var(--color-numero);
}
.ingles {
    color: #696969;
}
.kw{
    font-family: "Barlow", helvetica, sans-serif;
    font-weight: bold;
}

.fuente {
    margin-bottom: 1em;
    font-size: 0.9em;
    text-align: right;
}

.APA p, h4{
    text-indent: -5%;
	text-align: left;
    margin-top: 1em;
    margin-left: 5%;
}

#signatura {
    text-align: left;
    font-size: 0.8em;
    color: #696969;
    border-top: solid 1px #696969;
    padding-top: 0.5%;  
    border-bottom: solid 1px #696969;
    padding-bottom: 0.5%; 
}

#autores{
    padding-top: 10px;
    border: 1px solid transparent; 
    font-size: 1.1em;
    font-weight: bold;
}

#resumen_kw {
    border-top: solid 1px var(--color-numero);
}

#filiacion {
    margin-top: -1em;
    color: #696969;
    font-size: 0.9em;
}

#articulo {
    border-top: solid 1px var(--color-numero);
}

#articulo p { 
    text-indent: 4%;
}

#articulo figure {
    padding-top: 1.4vw; 
    width: 70%; 
    display: block;
    margin: auto;
}

#articulo img {
    width: 100%; 
    display: block;
    margin: auto;
}
#notas {
    font-size: 0.9em;
}

#anexos {
    border-top: solid 1px var(--color-numero);
}

#contacto {
    font-family: "Barlow", helvetica, sans-serif;
    text-align: left;
    font-size: 0.8em;
    color: #696969;
    border-top: solid 1px #696969;
    padding-top: 0.5%;  
    border-bottom: solid 1px #696969;
    padding-bottom: 0.5%; 
}

#fechas {
    padding-top: 20px;
    border: 1px solid transparent;
    text-align: right;
}