@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,800');
* { margin: 0; }
body {text-align: center; background-color:#fff; }
header { background-image: url(img/header.jpg); background-size: cover; width: 100%; height: 3rem; }
nav ul { display: block; padding-left: 0rem; }
nav ul li { list-style-type: none; display: inline-block; padding: 1rem;  }
nav ul li a { color: #ffffff; text-decoration: none; font-family: 'open sans'; font-weight: 800; font-size: 0.8rem; }
nav ul li a:hover { color: #f4c0a0; text-decoration-line: underline; }
#foto { background-image: url(img/landind.jpg); background-size: cover; width: 100%; margin-bottom: 3rem;}
.responsive { width:100%; height: auto; margin-bottom: 3rem; margin-top: 3rem; }
h6 img {max-width: 40rem; width: 80%; margin-bottom: 0rem;  }
section article h1 img {max-width: 25rem; width: 80%; margin-bottom: 2rem; margin-top: 2rem;  }
section article h2 img {max-width: 25rem; width: 70%; }
h2 { max-width: 25rem; width: 70%; text-align: left; display: inline-block; margin-bottom: 0.5rem; color: #e94967; }
section article h3 img {max-width: 20rem; width: 70%;}
section article p {max-width: 25rem; width: 70%; text-align: left; display: inline-block; margin-bottom: 1rem; font-size: 1rem; font-family: 'Open Sans'; font-weight: 400; }
section article h4 img {max-width: 25rem; width: 70%; text-align: left; display: inline-block; margin-bottom: 2rem; margin-top: 1rem; color: #e94967; }

h7 { background-size: cover; max-width: 100rem; width: 100%; text-align: center; display: inline-block; margin-top: 3rem; color: #fff; font-family: 'open sans'; font-weight: 800; font-size: 1.8rem; padding: 1rem; }
.secciones {background-color: #e94967; }
#charla { background-image: url(img/charla1.jpg); background-size: cover; width:24%; height:7rem;   margin-top: 2rem; margin-bottom: 6rem; min-width: 20rem; }
#charla h2 { margin: auto 0; text-align: center; margin-top: 8rem; color: #fff; }
#expo { background-image: url(img/exposicion1.jpg); background-size: cover; width:24%; height: 7rem; margin-top: 2rem; margin-bottom: 6rem; min-width: 20rem;}
#expo h2 { margin: auto 0; text-align: center; margin-top: 8rem; color: #fff; }
#happen { background-image: url(img/workshop1.jpg); background-size: cover; width:24%; height: 7rem; margin-top: 2rem; margin-bottom: 6rem; min-width: 20rem;}
#happen h2 { margin: auto 0; text-align: center; margin-top: 8rem; color: #fff; }
#work { background-image: url(img/workshop2.jpg); background-size: cover; width:24%; height: 7rem; margin-top: 2rem; margin-bottom: 6rem; min-width: 20rem;}
#work h2 { margin: auto 0; text-align: center; margin-top: 8rem; color: #fff; }

h5 img {display: inline-block; max-width: 10rem; width: 35%; margin-top: 1rem; margin-bottom: 2rem; }

article nav ul li { display:list-item; text-align:left; margin:auto 0; padding: 2rem; font-family:'Open Sans'; font-weight:400; font-size:0,5rem; }

article nav ul li img { max-height:2rem; margin-right:0.8rem; }
article nav ul li img:hover { opacity: 0.5; }
.inicio 
#activar ~ .desplegable { display: none; overflow: hidden; } 
#activar:checked ~ .desplegable { display:block; }
#activar { display: none;}
.inputlabel { display: inline-block; height: 20px;}
#activar ~ .inputlabel:before 
#activar ~ .desplegable { display:none; overflow: hidden; padding:10px 0px;  color:#eb2c67; font-size: 0.2rem; }
.desplegable p { color:#eb2c67; font-size: 0.7rem; width: 100%; }
#activar:checked ~ .desplegable { display: block; }
    #activar:checked ~ .inputlabel:before 

article nav ul li img {}
.mapa 
#mapa ~ .texto {display: none;overflow: hidden;} 
#mapa:checked ~ .texto {display: block;}
#mapa {display: none;}
.inputlabel {display: inline-block; height: 20px;  color:#fff; }
#mapa ~ .inputlabel:before 
#mapa ~ .texto {display:none; overflow: hidden; padding: 10px 0px; background: #FFF; color:#eb2c67; font-size: 0.2rem; }
.texto p { color:#eb2c67; font-size: 0.7rem; width: 100%; }
#mapa:checked ~ .texto {display: block;}
#mapa:checked ~ .inputlabel:before 

article nav ul li img {}
.calendario 
#calendario ~ .texto2 {display: none; overflow: hidden;} 
#calendario:checked ~ .texto2 {display: block;}
#calendario {display: none;}
.inputlabel {display: inline-block; height: 20px; }
#calendario ~ .inputlabel:before 
#calendario ~ .texto2 {display:none; overflow: hidden; padding: 10px 0px; color:#eb2c67; font-size: 0.2rem; }
.texto2 p { color:#eb2c67; font-size: 0.7rem; width: 100%; }
#calendario:checked ~ .texto2 {display: block;}
#calendario:checked ~ .inputlabel:before 

article nav ul li img {}
.favoritos 
#corazon ~ .texto3 {display: none;overflow: hidden;} 
#corazon:checked ~ .texto3 {display: block;}
#corazon {display: none;}
.inputlabel {display: inline-block; height: 20px;color:#fff; }
#corazon ~ .inputlabel:before 
#corazon ~ .texto3 {display:none; overflow: hidden; padding: 10px 0px; background: #FFF; color:#eb2c67; font-size: 0.2rem; }
.texto3 p { color:#eb2c67; font-size: 0.7rem; width: 100%; }
#corazon:checked ~ .texto3 {display: block;}
#corazon:checked ~ .inputlabel:before 

article nav ul li img {}
.perfil 
#user ~ .texto4 {display: none;overflow: hidden;} 
#user:checked ~ .texto4 {display: block;}
#user {display: none;}
.inputlabel {display: inline-block; height: 20px; color:#fff; }
#user ~ .inputlabel:before 
#user ~ .texto4 {display:none; overflow: hidden; padding: 10px 0px;color:#eb2c67; font-size: 0.2rem; }
.texto4 p { color:#eb2c67; font-size: 0.7rem; width: 100%; }
#user:checked ~ .texto4 {display: block;}
#user:checked ~ .inputlabel:before 

article nav ul li img:hover { color:#000; }

footer { background-image: url(img/footer.jpg); background-size: cover; width: 100%;  display:inline-block; margin-top: 2rem; } 
footer p {font-size: 0.7rem; font-family: 'Roboto', sans-serif; font-weight: 300; padding: 2rem; display: inline-block; max-width: 50rem; width:70%; }
section {display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	align-content: stretch;}