/**********************************************
Estilos de la esctructura general de la página

Cada contenedor tiene sus estilos específicos
en archivos CSS independientes.
El archivo CSS de cada contenedor está indicado
debajo del nombre de la etiqueta correspondente
**********************************************/
*
{
	margin: 0px;
	padding: 0px;
	box-sizing: border-box;
}

/****************************** HEADER ******************************/
/*css/estilo_header.css*/

header
{
	float: left;
	width: 100%;
	height: auto;
	padding: 15px 0px;

	border: 2px outset #DDDDDD;
	box-sizing: border-box;

	background: linear-gradient(45deg, #0033BB, #111111, #0033BB);
	background-size: 400% 400%;

	animation: mover_colores 10s ease-in-out infinite;


/*
	background: -webkit-linear-gradient(90deg, rgba(27,84,31,1) 18%, rgba(1,5,1,1) 51%, rgba(0,80,46,1) 100%);
	background: -moz-linear-gradient(90deg, rgba(27,84,31,1) 18%, rgba(1,5,1,1) 51%, rgba(0,80,46,1) 100%);
*/

/*
background: -webkit-linear-gradient(-90deg, rgba(210,244,146,1) 0, rgba(68,89,29,1) 26%, rgba(100,109,84,1) 34%, rgba(68,89,29,1) 39%, rgba(124,188,10,1) 56%, rgba(37,48,17,1) 59%, rgba(124,188,10,1) 76%, rgba(52,71,17,1) 89%, rgba(124,188,10,1) 100%);
background: -moz-linear-gradient(180deg, rgba(210,244,146,1) 0, rgba(68,89,29,1) 26%, rgba(100,109,84,1) 34%, rgba(68,89,29,1) 39%, rgba(124,188,10,1) 56%, rgba(37,48,17,1) 59%, rgba(124,188,10,1) 76%, rgba(52,71,17,1) 89%, rgba(124,188,10,1) 100%);
background: linear-gradient(180deg, rgba(210,244,146,1) 0, rgba(68,89,29,1) 26%, rgba(100,109,84,1) 34%, rgba(68,89,29,1) 39%, rgba(124,188,10,1) 56%, rgba(37,48,17,1) 59%, rgba(124,188,10,1) 76%, rgba(52,71,17,1) 89%, rgba(124,188,10,1) 100%);
*/
}

@keyframes mover_colores
{
	0%{background-position: 0% 50%; }
	50%{background-position: 50% 100%; }
	100%{background-position: 100% 30%; }
}
/****************************** NAV ******************************/
/*css/estilo_contenedor_nav.css*/

/*------------- Diseño 1 -------------*/

/*
nav
{ 
	display: block;
	width: 250px;
	position: fixed;
	top: 35%;
	left: 15px;
	z-index: 1; 
	margin-left: -200px;

	padding-bottom: 4px;
	background: #5A5A5A;
}

	.boton_para_mostrar_menu
	{
	display: block;
	width: 50px;
	height: 42px;
	  position: absolute;
	  top: 10px;
	  right: 10px;
		padding: 10px;
		margin-bottom: 70px;
		box-sizing: border-box;
		cursor: pointer;
		background-color: rgba(240, 240, 240, 0.5);
			-moz-border-radius: 7px;
			-webkit-border-radius: 7px;
			border-radius: 7px;
	}

	.boton_para_mostrar_menu span
	{
		display: block;
		width: 30px;
		height: 3px;
		background: #271E03;
		margin-top:4px;
	}

	#checkbox_para_mostrar_el_menu
	{
		display: none;
	}
*/

/*------------- Diseño 2 -------------*/
nav
{
	float: left;
	display: block;
	width: 100%;
	height: 36px;
	padding-top: 4px;
	padding-bottom: 4px;
	background-color: #333333;

}



/****************************** MAIN  ******************************/
/* header section footer */


main
{
	float: left;
	width: 100%;
	height: auto;
	background-color: #040404;
}

/*
#texto_descripcion_de_la_pagina (sin ASCII)
{
	float: left;
	margin: 10px 30px 10px;
	background-color: #CCCCCC;
		-moz-border-radius: 7px;
		-webkit-border-radius: 7px;
		border-radius: 7px;
}

#texto_descripcion_de_la_pagina p img
{
    width: 30px;
}


@media screen and (max-width: 460px)
{
	#texto_descripcion_de_la_pagina p{font-size: 10px;}
}
@media screen and (max-width: 360px)
{
	#texto_descripcion_de_la_pagina p{font-size: 9px;}
}
@media screen and (max-width: 320px)
{
	#texto_descripcion_de_la_pagina p{font-size: 8px;}
}
*/

/****************************** SECTIONS  ******************************/
/* css/estilo_contenedor_promocion_productos_servicios.css */

#contenedor_dinamico
{
	float: left;
	width: 100%;
	background-color: #222233;
}

#contenedor_promocion_productos_servicios
{
	float: left;
	display: inline-flex;
	width: 100%;
	height: auto;
	padding-top: 5px;
	overflow-x: auto;
	background-color: #333333;
}

/*
#promocion-cursos > img
{}
*/

/*********************************** ARTICLES ***********************************/
/*
css/estilo_contenedor_article_1.css
css/estilo_contenedor_article_2.css
*/

#contenedor_article_1
{
	float: left;
	width: 100%;
	height: auto;
}

#contenedor_article_2
{
	float: left;
	width: 100%;
	height: auto;
}

#contenedor_article_3
{
	float: left;
	width: 100%;
	height: auto;
}

#contenedor_footer
{
	float: left;
	width: 100%;
	height: auto;
	background-color: #333333;
}
