@charset "utf-8";

*{
box-sizing :border-box;
}

body{
    background-color: white;
}
#pagina {
    width: 100%;
}
header {
    background-color: #579bbe;
    color:white;
    height: 3.5em;
    font-family: sans-serif;
    padding: 1em;
    text-align: center;
    font-size: 4em;
    font-weight: bold;
}
nav {
    background-color: #7FC5AA;
    margin:auto;
    text-align: center;
}
nav ul { 
    list-style: none; 
    margin: 0em; 
    padding: 0em;
}
   
nav ul li { 
    display: inline-block;
    padding: 0 3em;
    }
        
nav ul li a {
    display:block;
    background-color:#7FC5AA ;
    color: white;
    padding:  2em;
    text-decoration: none;
    line-height: 0.5em;
    font-family: sans-serif;
    font-size:1.5em;
    height: 3em;
    text-align: center;
    
}
    
nav ul li a:hover { 
    background-color: #7FC5AA;
    color:white;
    font-weight: bold;
}

main, aside {
     float: left;
     padding: 0.5em;
}

article {
   background-color: white;
    color: black;
    width: 100%;
}

aside {
    background-color: #E8D688;
    width: 30%;
    font-family: sans-serif;
    color: black;
}

h1 {
    color: black;
    font-family: sans-serif;
    padding: 0 1em;
    margin:auto;
  text-align: center;
}
main {
    width:70%;
}

footer {
    background-color: #579bbe ;
    color: black;
    padding: 1em;
    margin: 1em;
    font-family: sans-serif;
  text-align: center;
    clear: both;
}
#secciones {
    background-color: white;
    overflow: auto;
    text-align: center;
    color: white;
  
}

#secciones section {
    width:30%;
    float: left;
    margin: 1em 0.5em 0em 0.5em;
    padding: 1em;
    min-height: 30em;
}

aside p {
    text-align: right;
    font-size: 0.9em;
}

#secciones .sec1 {
    background-image: url(img_gato.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}
#secciones .sec1:hover {
   background-image: url(img_gatoh.jpg);
   
}
#secciones .sec1 h3 {
    font-family: sans-serif;
    text-align: left;
    font-size: 1.5em;
    padding: 0;
    margin: 0;
}
#secciones .sec1 p {
font-family: sans-serif;
    font-size: 3em;
    text-align: right;
}
#secciones .sec1 a {
font-family: sans-serif;
    font-size: 1.5em;
    text-align: left;
    text-decoration: none;
    color: white;
}
#secciones .sec1 a:hover {
    font-weight: bold;
}
#secciones .sec2 {
    background-color: #589BBE;
}
#secciones .sec2 h3 {
    font-family: sans-serif;
    text-align: left;
    font-size:1.5em;
    padding: 0;
    margin: 0;
}
#secciones .sec2 p {
font-family: sans-serif;
    font-size: 3em;
    text-align: right;
}
#secciones .sec2 a {
font-family: sans-serif;
    font-size: 1.5em;
    text-align: left;
    text-decoration: none;
    color: white;
}
#secciones .sec2 a:hover {
    font-weight: bold;
}
#secciones .sec3 {
    background-image: url(img_mediluna.png);
    background-repeat: no-repeat;
    background-size: cover;
}
#secciones .sec3:hover {
   background-image: url(img_medilunah.png);
   
}
#secciones .sec3 h3 {
   font-family: sans-serif;
    text-align: left;
    font-size: 1.5em;
    padding: 0;
    margin: 0;
}
#secciones .sec3 p {
font-family: sans-serif;
    font-size: 3em;
    text-align: right;
}
#secciones .sec3 a {
font-family: sans-serif;
    font-size: 1.5em;
    text-align: left;
    text-decoration: none;
    color: white;
}
#secciones .sec3 a:hover {
    font-weight: bold;
}
#secciones .sec4 {
    background-color:#B59AC9; 
}
#secciones .sec4 h3 {
    font-family: sans-serif;
    text-align: left;
    font-size: 1.5em;
    padding: 0;
    margin: 0;
  
}

#secciones .sec4 a {
    font-family: sans-serif;
    line-height: 1em;
    font-size: 1.5em;
    text-align: left;
    text-decoration: none;
    color: white;
}
#secciones .sec4 a:hover {
    font-weight: bold;
}
#secciones .sec5 {
    background-image: url(img_fadu.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}
#secciones .sec5:hover {
   background-image: url(img_faduh.jpg);
}

#secciones .sec5 h3 {
    font-family: sans-serif;
    text-align: left;
    font-size: 1.5em;
    padding: 0;
    margin: 0;
}
#secciones .sec5 p {
font-family: sans-serif;
    font-size: 3em;
    text-align: right;
}
#secciones .sec5 a {
font-family: sans-serif;
    font-size: 1.5em;
    text-align: left;
    text-decoration: none;
    color: white;
}
#secciones .sec5 a:hover {
    font-weight: bold;
}
#secciones .sec6{
    background-color: #7FC5AA;
}
#secciones .sec6 h3 {
    font-family: sans-serif;
    text-align: left;
    font-size: 1.5em;
    padding: 0;
    margin: 0;
}
#secciones .sec6 a {
font-family: sans-serif;
    font-size: 1.5em;
    text-align: left;
    text-decoration: none;
    color: white;
}

#secciones .sec6 a:hover {
    font-weight: bold;
}
aside {
    color: black;
    background-color: white;
}
.sec_preg_frecuentes {
background-color:#E9846D; 
    color:white;
    padding: 1em 0em 0em 1em;
    margin:0em;
    font-size: 1.5em;
}
.sec_preg_frecuentes p{
font-size: 1.5em;    
line-height: 3.5em;
    color: white;
    padding: 0.5em
}

.sec_preg_frecuentes p a {
text-decoration: none;
    color:white;
    font-size: 1em;
    
}
.sec_preg_frecuentes p a:hover {
font-weight: bold;
} 

figure {
    margin-left: 9em;
}
article h1 {
    margin-left: 0.5em;
    color: #7FC5AA;
    font-size: 2em;
}
@media screen and (max-width:60em) {

    nav{
        font-size: 0.5em;
    }
    header {
    font-size: 2em;
    }
}