@charset "utf-8";
/* --- RESETEO DE CSS ---*/
/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) COMIENZO RECETEO CSS */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
	margin-left: 30px;
}

/* --- FIN RESETEO CSS ---*/

/* --- MIS ESTILOS --- */

/* ---  FUENTES  GOOGLE
font-family: 'Raleway', sans-serif;
font-family: 'Fira Sans Extra Condensed', sans-serif;
font-family: 'Metrophobic', sans-serif;
font-family: 'Belleza', sans-serif;
font-family: 'PT Sans', sans-serif;
---*/

*{
    box-sizing: border-box;
}
/* --- IMAGENES RESPONSIVE ---*/

/* --- GENERALES ---*/

img {
    max-width:100%;
}

body {
    width:100%;
}

p {
   font-family: 'Metrophobic', sans-serif;
	font-size: 16px;
}

h1,h2,h3,h4,h5 {
   font-family: 'Metrophobic', sans-serif;
}

h1 {
   font-size: 36px;
	color: #903;
}
h2 {
   font-size: 28px;
	color: #903;
}
h3 {
   font-size: 24px;
	color: #333;
}
h4 {
   font-size: 18px;
	color: #333;
}
h5 {
   font-size: 14px;
	color: #FFF;
}
h6 {
   font-size: 18px;
	color: #903;
}

a {
    color: #333;
    text-decoration: none;
	cursor: pointer;
}

a:hover {
    color: #333;
    text-decoration: none;
	border-bottom: 0px dotted #903;
}

header {
	border-bottom: 3px solid #903;
	overflow:hidden;
	background: -webkit-linear-gradient(left, rgba(255,255,255,1) 25%, rgba(224,220,203,1) 75%); /* For Safari 5.1 to 6.0 */
background: -o-linear-gradient(left, rgba(255,255,255,1) 20%, rgba(224,220,203,1) 80%); /* For Opera 11.1 to 12.0 */
background: -moz-linear-gradient(left, rgba(255,255,255,1) 20%, rgba(224,220,203,1) 80%); /* For Firefox 3.6 to 15 */
background: linear-gradient(left, rgba(255,255,255,1) 20%, rgba(224,220,203,1) 80%); /* Standard syntax */
}

nav {	
	padding-bottom: 15px;
background: -webkit-linear-gradient(#fff, #fff,#fff,#eee); /* For Safari 5.1 to 6.0 */
background: -o-linear-gradient(#fff,#fff,#fff, #eee); /* For Opera 11.1 to 12.0 */
background: -moz-linear-gradient(#fff,#fff,#fff, #eee); /* For Firefox 3.6 to 15 */
background: linear-gradient(#fff,#fff,#fff, #eee); /* Standard syntax */
}


/* --- ENCABEZADO --- */

.encabezado {
    width:1100px;
	margin: 0 auto;
}

.logo {
    width:30%;
	padding: 20px;
	float:left;
}

.contacto {
    width:70%;
	padding: 15px;
	text-align: right;
	float:left;
}

.contacto img {
 	margin-right: 5px;
}

.contacto p {
 	margin: 7px 0;
}

.redes {
 	padding-top: 5px;
}

.contacto a {
	color:#333;
	text-decoration: none;
}

.contacto a:hover {
	color:#903;
	text-decoration: none;
}

/* ---- BOTONES INCLINADOS #f0a36c---- */

.botoninclinado1 {
	background-color: #f0a36c;
	color: white;
	padding: 5px;
	margin: 0 10px;
	float: left;
	width: 150px;
	text-align: center;
	font-size: 14px;
	 -webkit-transform: skew(-10deg); /* Chrome, Opera */
      -ms-transform: skew(-10deg); /* IE */
          transform: skew(-10deg); /* Padrão */
	}

.botoninclinado1 a {
	color: white;
	text-decoration: none;
	font-size: medium;
	}

.botoninclinado1 a:hover {
	color: white;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.4);
	text-decoration: none;
	}

.botoninclinado2 {
	background-color: #bcb48e;
	color: white;
	padding: 5px;
	margin: 0 10px;
	float: left;
	width: 150px;
	text-align: center;
	font-size: 14px;
	 -webkit-transform: skew(-10deg); /* Chrome, Opera */
      -ms-transform: skew(-10deg); /* IE */
          transform: skew(-10deg); /* Padrão */
	}

.botoninclinado2 a {
	color: white;
	text-decoration: none;
	font-size: medium;
	}

.botoninclinado2 a:hover {
	color: white;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.4);
	text-decoration: none;
	}
.botoninclinado3 {
	background-color: #b7a49e;
	color: white;
	padding: 5px;
	margin: 0 10px;
	float: left;
	width: 150px;
	text-align: center;
	font-size: 14px;
	 -webkit-transform: skew(-10deg); /* Chrome, Opera */
      -ms-transform: skew(-10deg); /* IE */
          transform: skew(-10deg); /* Padrão */
	}

.botoninclinado3 a {
	color: white;
	text-decoration: none;
	font-size: medium;
	}

.botoninclinado3 a:hover {
	color: white;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.4);
	text-decoration: none;
	}
.botoninclinado4 {
	background-color: #c77961;
	color: white;
	padding: 5px;
	margin: 0 10px;
	float: left;
	width: 150px;
	text-align: center;
	font-size: 14px;
	 -webkit-transform: skew(-10deg); /* Chrome, Opera */
      -ms-transform: skew(-10deg); /* IE */
          transform: skew(-10deg); /* Padrão */
	}

.botoninclinado4 a {
	color: white;
	text-decoration: none;
	font-size: medium;
	}

.botoninclinado4 a:hover {
	color: white;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.4);
	text-decoration: none;
	}
.botoninclinado5 {
	background-color: #9cbfb0;
	color: white;
	padding: 5px;
	margin: 0 10px;
	float: left;
	width: 150px;
	text-align: center;
	font-size: 14px;
	 -webkit-transform: skew(-10deg); /* Chrome, Opera */
      -ms-transform: skew(-10deg); /* IE */
          transform: skew(-10deg); /* Padrão */
	}

.botoninclinado5 a {
	color: white;
	text-decoration: none;
	font-size: medium;
	}

.botoninclinado5 a:hover {
	color: white;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.4);
	text-decoration: none;
	}

.container1 {
	padding-top: 20px;
	text-align:center;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 10px;
	width: 860px;
	overflow: hidden;
}	

/* ---- FIN BOTONES INCLINADOS ---- */


.slider {
	width: 100%;
	height: 400px;
	display: block;
}	


/* --- cinco imagenes ---*/
.contenedor5img {
	font-family:'PT Sans';
	width: 900px;
	margin-left: auto;
	margin-right: auto;
	height: 250px;
	padding-top: 30px;
	
}
.cincoimg {
	width: 20%;
	float: left;
	height: 250px;
	text-align: center;
	font-weight: bold;
}

.cincoimg a {
	color: black;
	text-decoration: none;
}

.cincoimg a:hover {
	color: #990033;
	text-decoration: none;
	font-weight: bold;
}

/* ---- quienes somos (en la home)---*/

.qsomos {
	font-size: 18px;
	color: #990033;
	display:inline;
	padding: 10px 0 0 0;

}

.qsomos a {
	font-size: 18px;
	color: #990033;
	text-decoration: none;
	vertical-align: bottom;
	margin-right: 5px;
	cursor: pointer;
}

.qsomos a:hover {
	color: #333;
	text-decoration: none;
	font-weight: normal;
		font-size: 18px;
	
}

/* --- CINCO IMAGENES ---*/
.contenedor5img {
	width: 900px;
	margin-left: auto;
	margin-right: auto;
	height: 280px;
	
}
.cincoimg {
	width: 20%;
	float: left;
	height: 250px;
	text-align: center;
	font-family:'Fira Sans Extra Condensed', sans-serif;
	font-size: 16px;
}

.cincoimg a {
	color: #333;
	text-decoration: none;
	font-family:'Fira Sans Extra Condensed', sans-serif;
    font-size: 19px;
    letter-spacing:0px;
    font-weight: 550;
}

.cincoimg a:hover {
	color: #990033;
	border-bottom: none;
	font-weight: bold;
}

.links5 a {
    color: #333;
}

.links5 a:hover {
    color: #990033;
    border-bottom: 1px dotted #903;
    
}

.bordo {
	background-color: #990033;
	padding: 10px;
   display: block;
	margin-top: 30px 0;
}

.bordo h2 {
	font-size: 36px;
	color: #fff;
	font-family: 'Metrophobic', sans-serif;
	text-align: center;
	margin: 5px;
}

.bordo h3 {
	font-size: 20px;
	color: #fff;
	font-family: 'PT Sans', sans-serif;
	text-align: center;
	margin-top: 0;
}

.blancotemas {
	background-color: #fff;
	width: 1200px;
	font-family: 'PT Sans', sans-serif;
	padding: 20px;
	margin: 30px auto 30px auto;
	border-radius: 10px;
	overflow: hidden;
}

.blancotemas img {
	border-radius: 10px;
}

.blanco {
	background-color: #fff;
	width: 1100px;
	font-family: 'PT Sans', sans-serif;
	padding: 20px;
	margin: 20px auto 30px auto;
	border-radius: 10px;
	overflow: hidden;
}

.blanco img {
	border-radius: 10px;
}

.blanco40 {
	width: 30%;
	float:left;
}

.blanco60 {
	width: 70%;
	float:left;
}

.blanco20 {
	width: 10%;
	float:left;
}

.interno40 {
	width: 60%;
	float:left;
}

.interno20 {
	width: 50%;
	float:left;
	height: 200px;
	padding-top: 50px;
}

.interno33 {
	width: 33%;
	float:left;
	height: 250px;
	padding-top: 10px;
	padding-right: 15px;
}

.interno33b {
	width: 33%;
	float:left;
	height: 250px;
	padding-top: 10px;
	
}

.interno100 {
	width: 40%;
	float:left;
	height: 200px;
}

.interno33 h3 {
	font-size: 15px;
	color: #903;
	text-align: left;
	font-weight: bold;
    line-height: 1.3em;
}
.interno33b h3 {
	font-size: 17px;
	color: #903;
	text-align: left;
	font-weight: bold;
}

.interno33 img {
	float: right;
	margin-top: 0;
	padding-top: 0;
	margin-left: 10px;
}

.tituloscaja {
	height: 120px;
}

.tituloscaja1 {
	font-size: 16px;
	line-height: 1em;
	font-weight: bold;
}

.sintesis{
	line-height: 1.1em
}

.autor {
	font-size: 13px;
	border-bottom: 1px solid #903;
	padding-bottom: 0;
}

.agenda {
	font-size: 13px;
	border-bottom: 1px solid #903;
	padding-bottom: 5px;
}

.agenda a{
	font-weight: bold;
}

.temas {
	color: #903;
	font-size: 25px;
	font-family: 'PT Sans', sans-serif;	
	font-weight: bold;
	text-align: right;
	letter-spacing: 1.6px;
	border-bottom: 1px solid #903;
}

.mes {
	color: #903;
	font-size: 18px;
	font-family: 'Metrophobic', sans-serif;	
}

/* --- botones bordo ---*/
.botonbordo {
	background-color: #903;
	padding: 10px 22px;
	border-radius: 4px;
	float:left;
	margin-left: 37px;
	margin-top: 20px;
    cursor: pointer;
    
}

.botonbordo a {
	color: white;
	text-decoration: none;
	font-size: 16px;
	font-family: 'Metrophobic', sans-serif;
}

.botonbordo a:hover {
	text-decoration: none;
	color: #fff;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.5)
}
.botonbordo2 {
	background-color: #903;
	padding: 1px 210px 1px 2px;
	border-radius: 4px;
	float: left;
	margin-left: 0px;
	margin-top: 0px;
	margin-bottom: 4px;
	cursor: ;
	color: hsla(0,0%,100%,1.00);
    
}

.botonbordo2 a {
	color: white;
	text-decoration: none;
	font-size: 14px;
	font-family: 'Metrophobic', sans-serif;
}

.botonbordo2 a:hover {
	text-decoration: none;
	color: #fff;
	text-shadow: 0px 0px 2px rgba(0,0,0,0.5)

}
.botonbordo3 {
	background-color: #903;
	padding: 4px 30px 4px 8px;
	border-radius: 4px;
	float:left;
	margin-left: 0px;
	margin-top: 0px;
	margin-bottom: 4px;
	cursor: pointer;
    
}

.botonbordo3 a {
	color: white;
	text-decoration: none;
	font-size: 14px;
	font-family: 'Metrophobic', sans-serif;
}

.botonbordo3 a:hover {
	text-decoration: none;
	color: #fff;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.5)
}
.botonbordo4 {
	background-color: #903;
	padding: 4px 20px 4px 8px;
	border-radius: 4px;
	float:left;
	margin-left: 0px;
	margin-top: 0px;
	margin-bottom: 4px;
	cursor: pointer;
    
}

.botonbordo4 a {
	color: white;
	text-decoration: none;
	font-size: 14px;
	font-family: 'Metrophobic', sans-serif;
}

.botonbordo4 a:hover {
	text-decoration: none;
	color: #fff;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.5)
}

footer {
	background-color: #f2f2f2;
	overflow: hidden;
	padding-bottom: 30px;
	width: 100%;
	bottom: 0;
	border-top: 3px solid #903;
   
}

.pie {
	width: 1100px;
	margin: 0 auto;
	padding: 30px 20px;border-top-width: 1px;
	border-top-color: #903;
}

.pie img{
	margin: 0 5px;

}

.pie a{
	color:#333;
	text-decoration: none;
}

.pie a:hover{
	color:#903;
	text-decoration: none;
}

	
.pieiz {
	width: 50%;
	text-align: left;
	float: left;
}

.piede {
	width: 50%;
	text-align: right;
	float: left;
}

.slogan {
	color: #903;
	font-size: 24px;
	font-family: 'Metrophobic', sans-serif;
	font-style: italic;
	font-weight: 500;
}

/*--- PRINCIPAL ---*/

.principal {
	width: 1100px;
	margin: 30px auto;
}

.principal h1 {
	text-align: center;
	font-size: 45px;
	color: #903;
}

.principal p {
	text-align: center;
}

/* --- QUIENES SOMOS INTEGRANTES ---*/

.integrantes {
	width: 33%;
	float: left;
	text-align: center;
	padding: 15px 0;
}
.integrantes img {
	margin-bottom: 20px;
}

.nombreintegrantes {
	font-weight: bold;
	color: #903;
}
.titulares {
	width: 100%;
	float: left;
	text-align: left;
	padding-top: 15px;
	padding-right: 0;
	padding-left: 0;
	padding-bottom: 15px;border-top: 1px solid #903;
}

.foto {
	width: 25%;
	float: left;
	padding: 15px 0;
}	

.descripcioncv {
	width: 65%;
	float: left;
	padding: 5px 0;
}

.descripcioncv h2 {
	font-size: 25px;
	text-align: left;
	font-family: 'Belleza', sans-serif;
	font-weight: 600;
	color: #903;
}

.descripcioncv p {
	font-size: 14px;
	text-align: left;	
}
	
/* --- LIBROS --- */

.libros {
	width: 50%;
	float: left;
	text-align: center;
	padding: 15px 0;
}


.tapa {
	width: 40%;
	float: left;
	padding: 15px 0;
}

.descripcionlibro {
	width: 60%;
	float: left;
	padding: 5px 0;
}

.descripcionlibro h2 {
	font-size: 25px;
	text-align: left;
	font-family: 'Belleza', sans-serif;
	font-weight: 600;
	color: #903;
}

.descripcionlibro p {
	font-size: 14px;
	text-align: left;	
	
}
/* --- TRABAJO EN RED ---*/

.integrantes2 {
	width: 33%;
	float: left;
	text-align: center;
	padding: 15px 0;
}
.integrantes2 img {
	margin-bottom: 20px;
}

.nombreintegrantes2 {
	font-weight: bold;
	color: #903;
}
.titulares2 {
	width: 100%;
	float: left;
	text-align: left;
	padding-top: 15px;
	padding-right: 0;
	padding-left: 0;
	padding-bottom: 15px;
	border-top: 0px solid #903;
}

.foto {
	width: 25%;
	float: left;
	padding: 15px 0;
}	

.descripcion2 {
	width: 33%;
	float: left;
	padding: 5px 0;
}

.descripcioncv2 h2 {
	font-size: 25px;
	text-align: left;
	font-family: 'Belleza', sans-serif;
	font-weight: 600;
	color: #903;
}

.descripcioncv2 p {
	font-size: 14px;
	text-align: left;	
}

/*--- PRENSA ---*/

.integrantes {
	width: 33%;
	float: left;
	text-align: center;
	padding: 15px 0;
	
}
.integrantes img {
	margin-bottom: 20px;
}

.nombreintegrantes {
	font-weight: bold;
	color: #903;
}
.notas {
	width: 100%;
	float: left;
	text-align: left;
	padding-top: 5px;
	padding-right: 0;
	padding-left: 0;
	padding-bottom: 15px;border-top: 1px solid #903;
}

.foto2 {
	width: 40%;
	float: left;
	padding: 10px 5px;
}	

.titularnota {
	width: 60%;
	float: left;
	padding: 0px 10px;
}

.titularnota h2 {
	font-size: 28px;
	text-align: left;
	font-family: 'Belleza', sans-serif;
	font-weight: 600;
	color: #903;
}

.titularnota p {
	font-size: 14px;
	text-align: left;

/*--- BOTONERA RESPONSIVE BEFORE ---*/

}
#btn-menu {
    display: none;
     width: 24px;
    height: 18px;  
}

.navegacion label {
    display:none;
    text-align: center;
   
    /*border-right: 1px solid #fff;*/
}

.navegacio label:hover {
    cursor: pointer;
    
}
.director {
	font-family: 'Belleza', sans-serif;
	font-size: 15px;
}


/* ---fin BOTONERA RESPONSIVE BEFORE --- */


/* ::::::::::: RESPONSIVE :::::::::::*/

@media (max-width:480px) {
    
    nav {	
	padding-bottom: 0;
    background: none; 
	z-index: 20;
     
}
    .container1 {
	padding: 0 30px;
	width: 100%;
	text-align: center;
	 }	
	
	.pieiz {	
	text-align: center;   
	}
	
	.piede {	
	text-align: center;   
}
	 /*--- BOTONERA ---*/
       
     .navegacion label {
        display: block;
    }
    
    label img {
        width: 24px;
        height: 18px;
         margin: 8px auto;
		cursor: pointer;
    }
    
    .menu {
        position: absolute;
        width: 100%;
        margin-left: -100%;
        transition: all 0.5s;
    }
    
    .menu ul {
        flex-direction: column;
        width: 100%;
        padding:0;
                
    }
    
    .menu li {
        display: block;
        padding: 10px 5px;
        text-decoration: none;
        border-top: 1px solid #fff;       
    }
    
    #btn-menu:checked ~ .menu {
        margin: 0;
    }
    
    /* --- FIN BOTONERA ----*/
	
	.botoninclinado1 {
		float: none;
		width: 90%;
	}
	
	.botoninclinado2 {
		float: none;
		width: 90%;
	}
	
	.botoninclinado3 {
		float: none;
		width: 90%;
	}
	
	.botoninclinado4 {
		float: none;
		width: 90%;
	}
	
	.botoninclinado5 {
		float: none;
		width: 90%;
	}
	
	.encabezado {
		width: 100%;
		overflow: hidden;
	}
	
	.logo {
		width: 100%;
		float: none;
		text-align: center;
		padding: 5px 0 0 0;
	}
	
	.contacto {
		width: 100%;
		float: none;
		overflow: hidden;
		padding: 5px 0 10px 0 ;
	}
	
	.contenedor5img {
		width: 100%;
		overflow: hidden;
		height: 1000px;
	  padding-top: 0;
		
	}
	.cincoimg {
		width: 100%;
		float: none;
		overflow: hidden;
		margin: 0;
		padding: 0;
	}
	
	.slider {
	width: 100%;
	height: 150px;
	overflow: hidden;
	}	
	
	.blanco {
	width: 100%;
	overflow: hidden;
	}	
	
	.blanco40 {
	width: 100%;
	float: none;
	overflow: hidden;
	}	
	
	main {
	width: 100%;
	float: none;
	overflow: hidden;
	display: flex;
	}	
	.blanco {
	width: 100%;
	overflow: hidden;
	}	
	
	.blanco40 {
	width: 100%;
	float: none;
	overflow: hidden;
	}	
	
	.blanco60 {
	width: 100%;
	float: none;
	overflow: hidden;
	}	
	
	.pie {
	width: 100%;
	overflow: hidden;
	}	
	
	.pieiz {
	width: 100%;
	float: none;
	overflow: hidden;
	}	
	
	.piede {
	width: 100%;
	float: none;
	overflow: hidden;
	text-align: center;
	margin-top: 10px;
	}	
	
	.botonbordo {
	width: 100%;
	float: none;
	margin: 10px 0;
	text-align: center;
	}
	.botonbordo2 {
	width: 100%;
	float: none;
	margin: 10px 0;
	text-align: center;
	}
	
	.interno33 {
		width: 100%;
		float: none;
		padding-bottom: 5px;
		border-bottom: 1px dashed #333;
		height: 280px;
		overflow: hidden;
	}
	
	.interno33b {
		width: 100%;
		float: none;
		padding-bottom: 5px;
		height: 380px;
		overflow: hidden;
	}
	.tituloscaja	{
		width: 100%;
		float: none;
	}
	.tituloscaja1 {
	width: 100%;
	float: none;
}

	.blanco40 {
	width: 100%;
	float: none;
	}
	.blanco60 {
	width: 100%;
	float: none;
	}
	.blanco100 {
	width: 100%;
	float: none;
	}
	.blancotemas {
	width: 100%;
	float: none;
	}
	.tituloscaja img {
	width: 40%;
	}
	.tituloscaja h3 {
		font-size: 1em;
	}
	.tituloscaja1 {
	font-size: 1em;
	
}
	.autor {
		border-bottom: none;
	}
	.agenda{
		overflow:inherit;
	}
	
}