*
{
	margin:0;
	padding:0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box; 
}

body
{
	background:#fff;
}

.menu_bar
{
	display:none; 
}


.header nav
{
	width:100%;
}

nav
{
	width:1000px;
	max-width:100%;
	margin:0px auto;
	background:#9b9b9c;    
	z-index:1000;
	padding-left:0px;
	height:45px;
}

.center   /* para centrar el menu */
{
	width:820px; 
	margin:0px auto;
	height:45px;  
}

.header nav ul
{
	list-style:none;   
}

.header nav ul li
{
	display:inline-block;
	position:relative;
	width:160px;
	-webkit-transition:all 400ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 400ms ease;
	transition:all 400ms ease; 

}

.header nav ul li a
{
	color:#fff;
	padding:20px;
	display:block;
	text-decoration:none; 
	height: 45px;   
}

.header nav ul li a span
{
	margin-right:10px; 
}

.header nav ul li:hover
{
	background:#f39200;
	height: 45px; 
}

.header nav ul li:hover .children
{
	display:;  
}

.header nav ul li .children
{
	display:none;
	background:#706f6f;
	position:absolute;
	width:100%;
	z-index:1000;  	 
}

.header nav ul li .children li
{
	display:block;
	overflow:hidden;
	border-bottom:1px solid rgba(255,255,255,.5);  /* se aplica transparencia*/
}

.header nav ul li .children li a 
{
	float:left;
	position:relative;
	top:3px;
	margin-left:10px;
	margin-right:0; 
}

/*    CODIGO PARA MENU RESPONSE    */

@media screen and (max-width:800px) {
	body
	{
		padding-top:80px;  
	}


	.header nav ul li 
	{
		display:block;
		float:none;
		border-bottom:rgba(255,255,255, .3);    
	}


	.menu_bar
	{
		display:block;
		width:100%;
		background:#CCC;
		position:absolute;
		top:0;    
	}

	.menu_bar .bt-menu
	{
		display:block;
		padding:24px;
		background:#706f6f;
		color:#fff;
		text-decoration:none;
		font-weight: bold;
		font-size:23px;
		overflow:hidden; 
     
	}

	.menu_bar span
	{
		float:right;
		font-size:30px;  
	}

	.header nav 
	{
		width: 80%;
		height: calc(100% - 80px); /* funcion calc para darle un tamaño de altura */
		position: absolute;
		right:100%;
		margin: 0;
		overflow: scroll;
	}


	.header nav ul li 
	{
		display: block;
		border-bottom:1px solid rgba(255,255,255,.5);
	}
 
	.header nav ul li a 
	{
		display: block;
	}
 
	.header nav ul li:hover .children 
	{
		display:;    /* al pasar el mouse no se va a desplegar solo dandole click */
	}
 
	.header nav ul li .children 
	{
		width: 100%;
		position: relative; /* al desplazar el submenu las demas opciones bajan */
	}
 
	.header nav ul li .children li a 
	{
		margin-left:20px;
	}
 
}


/* FIN DEL MENU */



.main
{
	background:#E95B43;
	width:90%;
	max-width:1000px; 
	margin:5px auto; 
}

.main .articles
{
	width:72.5%;
	margin-right:1.5%;
	float:right;
	  
}

.main .articles article
{
	border: 1px;
	border-style: solid;
	border-color: #B2B2B2;
	border-radius: 10px;
	padding:25px; 
	background:#fff;
	margin-bottom:20px;
	text-align:justify; 

}

aside
{
	border: 1px;
	border-style: solid;
	border-color: #B2B2B2;
	border-radius: 25px;
	width:24%;
	background:#fff;
	float:left; 
	padding:20px;
	margin-bottom: 10px;
	box-sizing:border-box;  
}

footer
{
	background:#E95B43;
	color:#fff;  
	clear:both;		/* ayuda a limpiar los floats left y a darle un salto de linea al footer */
	padding: 6px 0px;
	text-align:center;
}



/* MENU DE BOTONES EN BLOQUE */


.menu
{
	width: 70%;
	margin: 10px auto;
	border-radius: 20px;
	background: #afca0b;
	padding: 8px;
	font-size: 60px;
	text-align: center;
	color:#ffffff;
	position: relative;
	-webkit-transition:all 300ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 300ms ease;
	transition:all 300ms ease;
}



.menu:hover
{
	background:#dadada;
	color: #9ac31c;
}



.menu6
{
	width: 70%;
	margin: 10px auto;
	border-radius: 20px;
	background: #1244B9;
	padding: 8px;
	font-size: 60px;
	text-align: center;
	color:#ffffff;
	position: relative;
	-webkit-transition:all 300ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 300ms ease;
	transition:all 300ms ease;
}



.menu6:hover
{
	background:#dadada;
	color: #9ac31c;
}




.link
{
	text-decoration: none;
}


.icon-arrow-down
{
	color: #9b9b9c;
	margin-left:20px; 

}

.header nav ul li:hover .icon-arrow-down
 {
	color: #1e71b8;
	margin-left:20px; 
}


/* para resaltar donde nos encontramos */


.enfoque1
	{
	background: #f39200;
	}

.enfoque2 a .menu
	{
	background:#dadada;
	color: #9ac31c;
	}
	

ul
{
	list-style: none;
}

h3
{
	font-family:helvetica;
	color:#e94e1b;
	font-size: 17px;
	line-height: 30px; 
}


h4
{
	text-align: center;
	color: #5b9828;
	font-family: arial;
	font-size: 16px;
}



/* ESTILOS HOJA DE TEMARIOS */

.temario
{
	background:#ffffff;
	clear:both;		/* ayuda a limpiar los floats left y a darle un salto de linea al section */
	width: 65%;
	margin: 10px auto;
	border-bottom: 1px solid;
	border-color: #9bc31e;
	padding-bottom: 35px;
}
	

.temario1
{
	color:#3c3c3b;
	font-size: 55px;
	width:13%;
	display: inline-block;
	margin: auto 40px;
	text-align: center; 
	-webkit-transition:all 500ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 500ms ease;
	transition:all 500ms ease;  
}

.temario1:hover
{
	color:#70b8e7;	
}

.texto
{
	width:100%;
	font-size: 18px;
	color: #575756;
	text-align: center; 
}

.icon-pencil2 ,.icon-pencil ,.icon-pen ,.icon-camera ,.icon-image ,.icon-checkmark
{
	font-size: 28px;
	color: #3c3c3b;
}

h5
{
	display: inline-block;
	font-size: 17px;
	margin-left: 10px;
	margin-bottom: 10px;
	font-family: helvetica; 
	color: #1d1d1b;
}


/* ESTILO HOJA DE PROMOCIONES */
.fotos
{
	text-decoration: none;
	line-height: 45px;
}

.fotos:hover span
{
	color: #70b8e7;
	margin-left: 30px;
	border-bottom: 1px solid;
	border-color: #1d71b8; 
	-webkit-transition:all 500ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 500ms ease;
	transition:all 500ms ease;
}

.fotos:hover h5
{
	color: #70b8e7;
	margin-left: 10px;
	-webkit-transition:all 500ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 500ms ease;
	transition:all 500ms ease;
}

.cronograma1
{
	color:#3c3c3b;
	font-size: 60px;
	margin: 10px auto;
	width: 15%;
	-webkit-transition:all 500ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 500ms ease;
	transition:all 500ms ease;
}


.cronograma1:hover
{
	color:#70b8e7;	
}

/* ESTILOS SECUNDARIA */

.menu1
{
	width: 70%;
	margin: 10px auto;
	border-radius: 20px;
	background: #4292D0;
	padding: 8px;
	font-size: 60px;
	text-align: center;
	color:#ffffff;
	position: relative;
	-webkit-transition:all 300ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 300ms ease;
	transition:all 300ms ease;
}

.menu1:hover
{
	background:#dadada;
	color: #1d71b8;
}

.texto1
{
	text-align: center;
	color: #1d71b8;
	font-family: arial;
	font-size: 16px;
}

.enfoque3 a .menu1
	{
	background:#dadada;
	color: #1d71b8;
	}

.temario2
{
	color:#3c3c3b;
	font-size: 55px;
	width:13%;
	display: inline-block;
	margin: auto 13px;
	text-align: center; 
	-webkit-transition:all 500ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 500ms ease;
	transition:all 500ms ease;  
}

.temario2:hover
{
	color:#9bc31e;
}


.temario3
{
	color:#3c3c3b;
	font-size: 60px;
	width:23%;
	display: inline-block;
	margin: auto 13px;
	text-align: center; 
	-webkit-transition:all 500ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 500ms ease;
	transition:all 500ms ease;  
}

.temario3:hover
{
	color:#9bc31e;
}

.temario4
{
	color:#3c3c3b;
	font-size: 60px;
	width:12%;
	display: inline-block;
	margin-left: 90px;
	text-align: center; 
	-webkit-transition:all 500ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 500ms ease;
	transition:all 500ms ease;  
}

.temario4:hover
{
	color:#9bc31e;
}


.temario5
{
	background:#ffffff;
	clear:both;		/* ayuda a limpiar los floats left y a darle un salto de linea al section */
	width: 65%;
	margin: 5px auto;
	border-bottom: 1px solid;
	border-color: #9bc31e;
	padding-bottom: 15px;
}


.fotos1
{
	text-decoration: none;
	line-height: 20px;
}

.fotos1:hover span
{
	color: #9bc31e;
	margin-left: 30px;
	border-bottom: 1px solid;
	border-color: #1d71b8; 
	-webkit-transition:all 500ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 500ms ease;
	transition:all 500ms ease;
}

.fotos1:hover h5
{
	color: #9bc31e;
	margin-left: 10px;
	-webkit-transition:all 500ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 500ms ease;
	transition:all 500ms ease;
}

.cronogra
{
	text-decoration: none;
}

.cronograma
{
	color:#3c3c3b;
	font-size: 60px;
	margin: 10px auto;
	width: 15%;
	-webkit-transition:all 500ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 500ms ease;
	transition:all 500ms ease;
}

.cronograma:hover
{
	color:#9bc31e;
}

/* ESTILOS INICIAL */

.menu2
{
	width: 70%;
	margin: 10px auto;
	border-radius: 20px;
	background: #97529a;
	padding: 8px;
	font-size: 60px;
	text-align: center;
	color:#ffffff;
	position: relative;
	-webkit-transition:all 300ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 300ms ease;
	transition:all 300ms ease;
}

.menu2:hover
{
	background:#dadada;
	color: #82368c;
}

.texto2
{
	text-align: center;
	color: #82368c;
	font-family: arial;
	font-size: 16px;
}

.enfoque4 a .menu2
{
	color: #82368c;
	background:#dadada;
}

.fotos2
{
	text-decoration: none;
	line-height: 20px;
}

.fotos2:hover span
{
	color: #d60b52;
	margin-left: 30px;
	border-bottom: 1px solid;
	border-color: #1d71b8; 
	-webkit-transition:all 500ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 500ms ease;
	transition:all 500ms ease;
}

.fotos2:hover h5
{
	color: #d60b52;
	margin-left: 10px;
	-webkit-transition:all 500ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 500ms ease;
	transition:all 500ms ease;
}

.s-fotos
{
	width: 320px;
	margin: 28px 8px;
}


.s-fotos
{
	opacity: 0.8;
    filter: alpha(opacity=40); /* For IE8 and earlier */
}

.s-fotos:hover
{
	opacity: 1.0;
    filter: alpha(opacity=100); /* For IE8 and earlier */
}

/*  MATERIAL */ 


.panel1
{
	width: 80%;
	border-color: #D8D8D8;
	margin:auto;
	padding: 1%;
	
	display: table;

}

.panel2
{
	width: 40%;
	border: 1px solid;
	border-color: #A4A4A4;
	margin: 2% 5%;
	float: left;
	position: relative;
	border-radius: 10px;
}

.panel3
{
	width: 40%;
	border: 1px solid;
	border-color: #A4A4A4;
	margin: 2% 5%;
	float: right;
	position: relative;
	border-radius: 10px;
}	

.panel4
{
	max-width: 85%;
	text-align: center;
	padding: 10px;
	background-color: #848484;
	color: #ffffff;
	margin: 25px auto;
	font-size: 16px;
	font-family: Eurostile;
}

a
{
	text-decoration: none;
}

.panel4:hover
{
	background-color: #2E9AFE;
	-webkit-transition:all 500ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 500ms ease;
	transition:all 500ms ease;
}


.text
{
	font-family: Arial Narrow;
	font-size: 16px;
	font-weight: bold;
	color: #FA5858;
}


/* FOTOS PROMOCIONES */


.inicial0
{
	width: 70%;
	margin-left: 15%;
	margin-top: 4%;
	margin-bottom: 4%;
	border-radius: 7px;
	border: 8px solid #D0A9F5;
	opacity: 0.9;
	filter: alpha(opacity=90); /* For IE8 and earlier */
	 -webkit-transition:all 500ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 500ms ease;
	transition:all 500ms ease;
}

.inicial
{
	width: 70%;
	margin-left: 4%;
	margin-top: 4%;
	margin-bottom: 4%;
	border-radius: 7px;
	border: 8px solid #D0A9F5;
	opacity: 0.9;
	filter: alpha(opacity=90); /* For IE8 and earlier */
	 -webkit-transition:all 500ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 500ms ease;
	transition:all 500ms ease;
}


.inicial:hover, .inicial0:hover
{
	cursor: pointer;
	border:8px solid #AC58FA;
	opacity: 1;
	filter: alpha(opacity=100); /* For IE8 and earlier */
	-ms-transform: rotate(-4deg); /* IE 9 */
    -webkit-transform: rotate(-4deg); /* Chrome, Safari, Opera */
    transform: rotate(-4deg);
    -webkit-transition:all 500ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 500ms ease;
	transition:all 500ms ease;
}


.primaria0
{
	width: 70%;
	margin-left: 15%;
	margin-top: 4%;
	margin-bottom: 4%;
	border-radius: 7px;
	border: 8px solid #ACFA58;
	opacity: 0.9;
	filter: alpha(opacity=90); /* For IE8 and earlier */
	 -webkit-transition:all 500ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 500ms ease;
	transition:all 500ms ease;
}

.primaria
{
	width: 70%;
	margin-left: 4%;
	margin-top: 4%;
	margin-bottom: 4%;
	border-radius: 7px;
	border: 8px solid #ACFA58;
	opacity: 0.9;
	filter: alpha(opacity=90); /* For IE8 and earlier */
	 -webkit-transition:all 500ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 500ms ease;
	transition:all 500ms ease;
}


.primaria:hover, .primaria0:hover
{
	cursor: pointer;
	border:8px solid #9AFE2E;
	opacity: 1;
	filter: alpha(opacity=100); /* For IE8 and earlier */
	-ms-transform: rotate(-4deg); /* IE 9 */
    -webkit-transform: rotate(-4deg); /* Chrome, Safari, Opera */
    transform: rotate(-4deg);
    -webkit-transition:all 500ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 500ms ease;
	transition:all 500ms ease;
}


.secundaria0
{
	width: 70%;
	margin-left: 15%;
	margin-top: 4%;
	margin-bottom: 4%;
	border-radius: 7px;
	border: 8px solid #2E9AFE;
	opacity: 0.9;
	filter: alpha(opacity=90); /* For IE8 and earlier */
	 -webkit-transition:all 500ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 500ms ease;
	transition:all 500ms ease;
}

.secundaria
{
	width: 70%;
	margin-left: 4%;
	margin-top: 4%;
	margin-bottom: 4%;
	border-radius: 7px;
	border: 8px solid #2E9AFE;
	opacity: 0.9;
	filter: alpha(opacity=90); /* For IE8 and earlier */
	 -webkit-transition:all 500ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 500ms ease;
	transition:all 500ms ease;
}


.secundaria:hover, .secundaria0:hover
{
	cursor: pointer;
	border:8px solid #2E9AFE;
	opacity: 1;
	filter: alpha(opacity=100); /* For IE8 and earlier */
	-ms-transform: rotate(-4deg); /* IE 9 */
    -webkit-transform: rotate(-4deg); /* Chrome, Safari, Opera */
    transform: rotate(-4deg);
    -webkit-transition:all 500ms ease;   /* es la transicion al momento de pasar de una opcion a otra */
	-o-transition:all 500ms ease;
	transition:all 500ms ease;
}



.sig
{
	color: #2E9AFE;
	font-size: 15px;
	font-family: Arial Narrow;
	float: right;
	padding: 4px 12px;
	border: 1px solid #ffffff;

}

.ant
{
	color: #2E9AFE;
	font-size: 15px;
	font-family: Arial Narrow;
	float: left;
	padding: 4px 12px;
	border: 1px solid #ffffff;

}


.sig:hover, .ant:hover
{
	border: 1px solid #58ACFA;
	border-radius: 5px;
	cursor: pointer;
}

/* FIN FOTOS PROMOCIONES