/* Estilo 2023 de Cuadernillo 1 Psicología, por Consuelo Salas Lamadrid */

@media (min-width: 1200px) {
    body {    
        background-color: #fffcfb;
        margin: 0 auto;
        max-width: 900px;
        font-family: "Alegreya", serif; 
        text-align: justify;
        font-size: large;
        display: block;
        }

        #apsip {
            width: 17vw;
            margin-top: 0;
            margin-bottom: 0;
            margin-left: -40px;
            margin-right: 0;
        }

    #escuela {   
        width: 15vw;
        margin-top: 0;
        margin-bottom: 0;
        margin-left: 0;
        margin-right: -50px;
    }

}
 
@media (max-width: 1200px) {

    body {    
        background-color: #fffcfb;
        margin: 0 8%;
        max-width: 900px;
        font-family: "Alegreya" serif; 
        text-align: justify;
        font-size: medium;
        display: block;
    }

    #apsip {
        width: 19vw;
        margin-top: 0;
        margin-bottom: 0;
        margin-left: -40px;
        margin-right: 0;
    }
    
    #escuela {   
        width: 17vw;
        margin-top: 0;
        margin-bottom: 0;
        margin-left: 0;
        margin-right: -50px;
    }
}

@media (max-width: 900px) {
    body {    
        background-color: #fffcfb;
        margin: 0 8%;
        font-family: "Alegreya", serif; 
        text-align: justify;
        font-size: medium;
        display: block;
        }
   
    #apsip {
        width: 21vw;
        margin-top: 0;
        margin-bottom: 0;
        margin-left: -40px;
        margin-right: 0;
    }
    
    #escuela {   
        width: 19vw;
        margin-top: 0;
        margin-bottom: 0;
        margin-left: 0;
        margin-right: -50px;
    }
}


@media (max-width: 300px) {
    body {    
        background-color: #fffcfb;
        margin: 0 8%;
        font-family: "Alegreya", serif; 
        text-align: justify;
        font-size: medium;
        display: block;
    }    

    #apsip, #escuela {
        display: none;    
        }
}

:root {
    --color-numero: #ef7a33;
}

.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;
    align-self: center;
   
    
}
.grid-imgr {
    grid-row-start: 1;
    grid-row-end: 2;
    grid-column-start: 2;
    grid-column-end: 3;
    justify-self: end;
    align-self: center;
}


header{
    text-align: center;
    font-family: Nunito, helvetica, sans-serif;
}

#cita {                 /*pequeña cita bajo el título*/
    text-align: left;
    font-style: italic;
    font-size: 0.9em
}

#citaf {                 /*fuente de cita bajo el título*/
    text-align: right;
    font-style: italic;
    font-size: 0.9em
}
 /*tabla de contenidos*/

#toc {
    font-size: 0.9em;
    font-family: "Alegreya", serif;
    text-indent: 8%;
    border-bottom: solid 1px var(--color-numero);
    
}


h3, h4, h5, h6 {
    padding-top: 2vw;
}

h1 {
    color: var(--color-numero);
    font-size: 1.6em;
    font-family: "Alegreya", serif;
}

h1, h2, {
    text-align: center;

}

h2 {
    font-size: 1.5em;
    font-family: Nunito, helvetica, sans-serif;
}

h3 {
    color: var(--color-numero);
    font-size: 1.4em;
    font-family: Nunito, helvetica, sans-serif;
    
}

h4, h5 {
    font-size: 1.2em;
    font-family: "Alegreya", serif;
    color: var(--color-numero);
}

h5 {
    font-size: 1.1em;
    font-style: italic;
}

h6 {
    font-size: 1em;
    color: #696969;
}

blockquote {
    font-size: 0.9em;   
}

tbody {
    font-family: Nunito, helvetica, sans-serif;
    font-size: 0.8em 
}

figure{
    text-align: center;
}

table {                             
    margin: auto;
    width: 100%;
    border: 1px solid var(--color-numero);  
    color: #696969;  
    vertical-align: super;
    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%;
}

caption, figcaption {
    font-family: Nunito, helvetica, sans-serif;
    font-weight: bold;
    color: var(--color-numero);       
    font-size: 0.9em;
    padding-bottom: 2em;
    text-align: right;
}

figcaption {
    font-family: Nunito, helvetica, sans-serif;
    font-weight: bold;
    color: var(--color-numero);       
    font-size: 0.8em;
    padding-bottom: 2em;
    text-align: center;
}

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: Nunito, helvetica, sans-serif;
    font-weight: bold;
}

.fuente {
    margin-top: 0em;
    margin-bottom: 1em;
    font-size: 0.9em;
    text-align: right;
}

.refs {
    text-indent: -5%;
	text-align: left;
    margin-top: 1em;
    margin-left: 5%;

}

/* para las preguntas de entrevista*/
#ques {
    color: #03537b
}

#signatura {
    text-align: left;
    font-size: 0.8em;
    color: var(--color-numero);
    border-top: solid 1px #696969;
    padding-top: 0.5%;  
    border-bottom: solid 1px #696969;
    padding-bottom: 0.5%; 
}

#autores{
    padding-top: 10px;
    padding-bottom: 20px;
    border: 1px solid transparent; 
    font-size: 1.1em;
    font-weight: bold;
    border-bottom: solid 1px var(--color-numero);
}

#resumen_kw {
    border-top: solid 1px var(--color-numero);
}

#filiacion {
    margin-top: -1em;
    color: #696969;
    font-size: 0.9em;
}

#seccion {
    border-top: solid 1px var(--color-numero);
}


#articulo p { 
    text-indent: 4%;
}

#articulo img {
    width: 75%; 
    display: block;
    margin: auto;
}

#notas {
    font-size: 0.8em;
}

#anexos {
    border-top: solid 1px var(--color-numero);
}

#contacto {
    font-family: Nunito, 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;
}  


