@charset "UTF-8";
/* CSS Document */
@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed);
@import url(http://fonts.googleapis.com/css?family=Lato);
*{ 
	margin:0px;
	padding:0px;
}

body{
	background:#fff;
}
	 
#contenido{
	max-width:998px;
	height:auto;
	margin:0px auto;
	box-shadow:10px 5px 10px rgba(0,0,0,0.5);/*sombra a la caja*/
}
/*********************************************************************************/
/* cabecera                                                                 */
/*********************************************************************************/
header{
	max-width:977px;
	height:99px;
	margin: 0px auto;
	overflow: hidden;
	background-color:#fff;
}

/*********************************************************************************/
/* Banner                                                                   */
/*********************************************************************************/
#banner{
	width:100%;
	max-width:960px;
	margin:4px auto;
	position:relative;
}
#banner.slides{
	width:100%;
	overflow: hidden;
	}
#banner.slides img{
	width:100%;
	}
.slidesjs-pagination{
	background:#fff;
	list-style:none;
	overflow:hidden;
	border:solid 1px #fff;
	float:left;
	}
.slidesjs-pagination li{
	float:left;
	}
.slidesjs-pagination li a{
	display:block;
	padding:10px 20px;
	background-color:#fff;
	color:#f6bf28;
	text-decoration:none;
}
.slidesjs-pagination li a:hover{
	background: rgba(228, 108, 11, 0.6);
	color:#984907;
	}
.slides .active{
	background-color:#fff;
	color:#852819;
	}
.slides	a:visited{
    background-color:#fff;
	color:#852819;
}
.slidesjs-navigation{
	background:#fff;
	color:#852819;
	text-decoration:none;
	display:inline-block;
	padding:11.3px 20px;
	float:right;
	}

#banner .caption{
	position:absolute;
	max-width:420px;
	margin-left: 445px;
	margin-top: -190px;
	background: rgba(228, 108, 11, 0.6);
	z-index: 1000;
}
#banner .caption p{
	display: inline-block;
	color: #fff;
	font-family: 'Teko', sans-serif;
	font-weight: lighter;
	font-size: 18px;
	padding: 12px;
	text-align:center;
}

 /*Fin de la programacion del banner*/
 
 
/*********************************************************************************/
/* Menu                                                                  */
/*********************************************************************************/

nav{
	width:162px;
	color:#C53234;
	height:auto;
	float:left;
	margin:5px 15px 5px;
	background:#FFF;
	line-height:20px;
}
.menu{
	width: 100%;
	position:relative;
	float:left;
	font-family: 'Roboto Condensed', sans-serif;
	list-style: none;
	background:#fff;
	border:1px solid #fff;
	cursor:pointer;
}
.menu li{
	display:inline-block;
	font-size:14px;
	margin:0;
	padding:0;
	float:left;
	line-height: 20px;
	position:relative;
}
.menu > li > a{
	padding:20px 22px;
	color:#000;
	text-decoration:none;
	display:block;
	text-transform:uppercase;
	border:1px solid #ffbc08;
}
.menu li:hover > a,.menu li.active a{
	background: #fff;
	color: #000;
}
.menu li.right{
	float: right;
}
.menu ul, .menu ul li ul{
	list-style: none;
	margin: 0;
	padding: 0;
	display: none;
	position: absolute;
	z-index: 99999;
	width: 135px;
	background: #fff;
	color:#000;
	box-shadow: 0 1px 1px rgba(0,0,0,0.1);
	border:1px solid #f6bf28;
	}
.menu ul{
	top: 60px;
	left: 0;
}
.menu ul li ul{
	top: 0;
	left: 100%;
}
.menu ul li{
	clear:both;
	width:100%;
	border:1px solid #f6bf28;
	font-size:14px;
}
.menu ul li a{
	padding:10px 20px;
	width:100%;
	color:#000;
	font-size:14px;
	text-decoration:none;
	display:inline-block;
	float:left;
	clear:both;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-webkit-transition:color 0.2s linear, background 0.2s linear;
	-moz-transition:color 0.2s linear, background 0.2s linear;
	-o-transition:color 0.2s linear, background 0.2s linear;
	transition:color 0.2s linear, background 0.2s linear;
	}

.menu.vertical{
	width: 160px;
}
.menu.vertical li{
	width: 100%;
}
.menu.vertical li a{
	display: inline-block;
	width: 100%;
	padding:18px 15px 16px;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
}
.menu.vertical ul li{
	width: 100%;
}
.menu.vertical ul, .menu.vertical ul li ul{
	width: 150px;
}
.menu.vertical ul{
	top: 0;
	left: 100%;
}
/*.menu.vertical ul li ul{
	top: 0px;
}
.menu.vertical.right{
	float: right;
}
.menu.vertical.right ul{
	left: -150px;
}
.menu.vertical > li .indicator{
	top: 17px;
	right: 15px;
	font-size: 17px;
}
.menu.vertical ul > li .indicator{
	top: 17px;
	right: 15px;
}*/

/*Fin codigo Menu*/


/*********************************************************************************/
/* cuerpo de pagina                                                                   */
/*********************************************************************************/
section{
	max-width:770px;
	height:auto;
	margin:10px 5px 10px 12px;
	float:left;
}

article{
	max-width:745px;
	height:auto;
	background:#FFF;
	margin:8px 5px 10px 9px;
}

article h1{
	font-family: 'Lato', sans-serif;
	font-size: 25px;
	text-align:left;
	color:#f6bf28;
	font-weight:bold;
	letter-spacing: 1px;
	margin:25px 18px;
}

article h2{
	font-family: 'Lato', sans-serif;
	font-size: 18px;
	text-align:left;
	color:#852819;
	font-weight:bold;
	letter-spacing: 1px;
	margin:18px 12px;
}

article p{
	font-family: 'Lato', sans-serif;
	color:#000000;
	font-size:18px;
	text-align:justify;
	line-height:20px;
	letter-spacing:1px;
	margin:4px 40px;
}

article ul{
	font-family: 'Lato', sans-serif;
	font-size:18px;
	color:#000000;
	line-height:20px;
	letter-spacing:1px;
	margin:4px 70px;
}


/*********************************************************************************/
/* Fotos                                                                  */
/*********************************************************************************/
article #foto{
	max-width: 300px;
	margin-left:115px;
	margin-top:50px;
	height: auto; 
	display:inline-block;
 }

#foto img {
	max-width:300px;
	margin-left:115px;
	height: auto;
	overflow: hidden;
	display:inline-block;
}

article .caja{
	max-width:250px;
	margin:12px;
	height:auto;
	background:#fff;
	float:left;
 }
nav #jefe{
	max-width:162px;
	height:auto;
	margin:405px 4px 5px;
 }
 
 nav #jefe #name{
	max-width:158px;
	font-family: 'Lato', sans-serif;
	font-size:12px;
	font-weight:bold;
	color:#000000;
	margin:2px 4px 5px;
 }



/*********************************************************************************/
/* Pie pagina                                                                  */
/*********************************************************************************/
footer{
	max-width:500px;
	height:auto;
	margin:8px 250px;
	clear:both;
}
footer p{
	font-family: 'Lato', sans-serif;
	color: #999999;
	font-weight:bold;
	font-size:10px;
	text-align:center;
	letter-spacing: 1px;
}
footer img{
	max-width:24px;
	margin:4px 245px;
}
footer p a{
	font-family: 'Lato', sans-serif;
	color:#f6bf28;
	font-weight:bold;
	font-size:10px;
	text-align:center;
	letter-spacing: 1px;
}


	
.btn_revistas{
	/*background:#7f8c8d;*/
	color:#000;
	display:inline-block;
	font-size:1.25em;
	margin:20px;
	padding:8px 0;
	border:solid 1px #ffbc08;
	text-align:center;
	max-width:200px;
	text-decoration:none;
	
	}
/*Colores*/
.btn_revistas.white {
	background:#fff;	
}
.btn_revistas.blue {
	background:#3498db;	
}
.btn_revistas.yellow {
	background:#e67e22;
	
}
 
/*Tamaños*/
.btn_revistas.medium {
	width:200px;
}
/*Efectos, Hover*/
.btn_revistas:hover {
	box-shadow:0px 0px 0px;
	padding-top:7px;
}
/*********************************************************************************/
/* responsive                                                                */
/*********************************************************************************/
@media screen and (max-width:800px){
	#contenido{
	width:100%;
	font-size:100%;
	box-shadow:10px 5px 10px rgba(0,0,0,0.5);/*sombra a la caja*/
 	}
	#banner .caption{
	width:61.25%;
	margin-left: 185px;
	margin-top:-180px;
	display:flex;
	} 
	#banner .caption p{
	font-size:1.125em;
	}


	article h1{
	font-family: 'Lato', sans-serif;
	font-size: 1.56em;
	text-align:left;
	letter-spacing: 1px;
	margin:1.125em 0.75em;
	}
	article p{
	font-size:1.125em;
	text-align:justify;
	line-height:1.5em;	
	}
	
	article ul{
	font-size:1.125em;
	text-align:justify;
	}
	
	article #foto {
	width: 100%;
	height: auto; 
	margin:0px 0px;
	display:inline-block;
}

	article #foto img {
	width: 100%;
	height: auto;
	overflow: hidden;
	display:inline-block;
}

	article .caja {
	width: 100%;
	height: auto; 
	margin:0px 0px;
	display:inline-block;
}

	article .caja img {
	width: 100%;
	height: auto;
	overflow: hidden;
	display:inline-block;
}
	nav #jefe{
	width: 100%;
	height:auto;
	margin:0px;
 }
 	nav #jefe img{
	width: 100%;
	height: auto;	   
    overflow: hidden;
	display:inline-block;
 }
  	nav #jefe #name{
	width:100%;
	font-family: 'Lato', sans-serif;
	font-size:0.75em;
	font-weight:bold;
	color:#000000;
	margin:0.125em 0.250em 0.313em;
 }
 .btn_revistas{
	 display:inline-block;
	margin:20px;
	padding:8px 0;
	width:0.57%;
	font-size:1.25em;
	}
.btn_revistas.medium {
	width:0.57%;
}
footer{
	 width:50.10%;
	 clear:both;
	 margin:auto;
	}
	footer p{
	font-size:0.625em;
	}
	footer img{
	width:4.8%;
	height:auto;
	margin:0;
	}

 }
 
@media screen and (max-width:480px){
#contenido{
	width:100%;
	height:auto;
	font-size:100%;
	box-shadow:10px 5px 10px rgba(0,0,0,0.5);/*sombra a la caja*/
}

article h1{
	font-family: 'Lato', sans-serif;
	font-size: 1.5625em;
	text-align:left;
	letter-spacing: 1px;
	margin:1.125em 0.75em;
}
	article p{
	font-size:1.125em;
	text-align:justify;
	line-height:20px;
	letter-spacing:1px;
	margin:auto;
	}
	article ul{
	font-size:1.125em;
	text-align:justify;
	}
	article #foto {
	width: 100%;
	height: auto; 
	margin:0px 0px;
	display:inline-block;
}
	article #foto img {
	width: 50%;
	height: auto;
	overflow: hidden;
	display:inline-block;
}
	article .caja {
	width: 100%;
	height: auto; 
	margin:0px 0px;
	display:inline-block;
}
	article .caja img {
	width: 50%;
	height: auto;
	overflow: hidden;
	display:inline-block;
}
	nav #jefe{
	width: 100%;
	height:auto;
	margin:0px;
 }
	nav #jefe img{
	width: 100%;
	height: auto;	   
    overflow: hidden;
	display:inline-block;
 }
 	nav #jefe #name{
	max-width:100%;
	font-family: 'Lato', sans-serif;
	font-size:0.75em;
	font-weight:bold;
	color:#000000;
	margin:0.125em 0.250em 0.313em;
 }
 .btn_revistas{
	  display:inline-block;
	margin:20px;
	padding:8px 0;
	width:0.57%;
	font-size:0.7em;
	}
 .btn_revistas.medium {
	width:0.57%;
}
footer{
	 width:50.10%;
	 clear:both;
	 margin:auto;
	}
	footer p{
	font-size:0.625em;
	}
	footer img{
	width:4.8%;
	height:auto;
	margin:0;
	}
}
@media screen and (max-width:320px){
#contenido{
	width:100%;
	height:auto;
	font-size:100%;
	box-shadow:10px 5px 10px rgba(0,0,0,0.5);/*sombra a la caja*/
	}
#banner .caption{
	 width:42.08%;
	 margin-left: 178px;
	 margin-top:-180px;
	 }
 #banner .caption p{
	font-size:0.8em;
 }

article h1{
	font-family: 'Lato', sans-serif;
	font-size: 1.25em;
	text-align:left;
	letter-spacing: 1px;
	margin:1.125em 0.75em;
	}
article p{
	font-family: 'Lato', sans-serif;
	color:#000000;
	font-size:0.75em;
	text-align:justify;
	line-height:20px;
	letter-spacing:1px;
	margin:auto;
	}
article ul{
	font-family: 'Lato', sans-serif;
	color:#000000;
	font-size:0.75em;
	text-align:justify;
}
article #foto {
	width: 100%;
	height: auto; 
	margin:0px 0px;
	display:inline-block;
}
article #foto img {
	width: 100%;
	height: auto;
	overflow: hidden;
	display:inline-block;
}
article #caja {
	width: 100%;
	height: auto; 
	margin:0px 0px;
	display:inline-block;
}
article #caja img {
	width: 50%;
	overflow: hidden;
	display:inline-block;
}
nav #jefe{
	width: 100%;
	height:auto;
	margin:0px;
 }

nav #jefe img{
	width: 50%;
	height: auto;	   
    overflow: hidden;
	display:inline-block;
 }
 	nav #jefe #name{
	width:100%;
	font-family: 'Lato', sans-serif;
	font-size:0.75em;
	color:#000000;
	margin:0.125em 0.250em 0.313em;
 }
  .btn_revistas{
	   display:inline-block;
	margin:20px;
	padding:8px 0;
	width:0.57%;
	font-size:0.7em;
	}
 .btn_revistas.medium {
	width:0.57%;
}
footer{
	 width:30%;
	 clear:both;
	 
	}
footer p{
	font-size:0.6em;
	}
footer img{
	width:15%;
	height:auto;
	margin:0px 68px;
	display:inline-block;
}
 }