@charset "utf-8";
/* CSS Document */

/* Menú de navegación de la página */
#NavInicio{
	border-left:1px solid #999;
	border-right:1px solid #999;
	border-bottom:15px solid #999;
	padding-top:15px;
	color:#c33;
}
#NavEmpresas, #NavNoticias, #NavBlog{ /*NavFormación no tiene borde izquierdo porque está puesto con el borde derecho de NavInicio*/
	border-left:1px solid #999;
	border-top:15px solid #999;
}
#NavFormacion{
	border-top:15px solid #999;
}
#NavBlog{
	border-right:1px solid #999;
}


/* PUBLICIDAD PAGINA INICIO */
/* Aquí colocamos las clases que permiten situar dos +info en la imagen publicitaria */
/* #publicidad etá en comun, pues se utilizará en muchas más páginas */
.publiMasInfo1{ /*es necesario para situar el más info en el lugar exacto dentro de la publicidad */
	position:absolute;
	display:block;
	left:534px;
	top:145px;
}
.publiMasInfo2{ /*es necesario para situar el más info en el lugar exacto dentro de la publicidad */
	position:absolute;
	display:block;
	left:680px;
	top:468px;
}


/** ULTIMA HORA **/
#ultimahora{
	margin-top:45px;
	margin-bottom:10px;
	padding-bottom:15px;
	background-color:#f8f8f8;
	border:1px solid #d7d7d7;
}
#ultimahora h1{
	font-size:14px;
	color:#C33;
	font-weight:100;
	margin:2px 0px;
}
#ultimahora h3{
	font-size:12px;
	margin-top:20px; /*Separa cada bloque de noticia, oferta o novedad...*/
	font-weight:100;
}	
#ultimahora p{
	font-size:12px;
	line-height:normal;
	color:#999;
}
#ultimahora p span{
	color:#000;
}


/** CUERPO 1 - TOP 10 Está compuesto de 4 columnas**/
/*#cuerpo1{ /*Características del bloque del cuerpo1. En este caso sólo se controla una separación con el bloque anterior de 15px*/
	/*margin-top:15px;
}*/

#columna1{
	color:#999;
}
#columna1 h1{
	margin-top:20px; /*Separa cada bloque de texto BIENVENIDO y APUESTA*/
	font-size:22px;
	font-weight:100;
}
#columna1 h2{
	font-size:18px;
	color:#333;
	margin-bottom:5px;
	font-weight:100;
}
#columna1 p{
	font-size:13px;
	line-height:18px; /*Interlineado*/
}
#top10{
	margin-top:20px;
}
#top10 h1{
	margin-bottom:20px;
	padding-bottom:6px;
	font-size:18px;
	color:#000;
	border-bottom:1px solid #d7d7d7;
}
#top10 h1 span{ /*Este span es para el texto "Cursos más demandados"*/
	font-size:14px;
	font-weight:100;
	color:#999;
	font-style:italic;
}
#top10 h3{
	font-size:14px;
	font-weight:100;
	color:#c33;
}
#top10 h3 span{ /*Este span es para el nombre del curso, el cual tiene características distintas al resto de h3*/
	font-size:12px;
	font-weight:100;
	color:#333;
}
#top10 h4{
	padding-left:40px;
	margin-top:3px;
	font-weight:100;
	font-size:12px;
	color:#999;
}
#top10 h5{
	padding-left:40px;
	font-weight:100;
	font-size:10px;
	color:#c33;
	margin-bottom:22px;
}


/** CUERPO 2 - CURSOS PROFESONALES, FORMACION CONTINUA, FORMACION SUBVENCIONADA **/
#contenedorcuerpo2{ /*Este id se utiliza con un div externo a container_12 del cuerpo 2 para que 
el fondo acapare todo el ancho de la pantalla, independientemente del tamaño de la misma*/
	background:url(images/Inicio-Cuerpo2-DegradadoGris.jpg) repeat-x;
}
#cuerpo2{
	padding-top:30px; /*controla la separación del texto con el borde del contenedor del bloque*/
	padding-bottom:20px; /*controla separación con el borde inferior*/
	background:url(images/Inicio-Cuerpo2-Reflejo.jpg) no-repeat top; /*Si se quiere se puede sustituir esta imagen por images/Inicio-Cuerpo2-Reflejosingris.jpg para hacer que sólo aparezca el reflejo. En ese caso, sería conveniente quitar la regla anterior para que no aparezca el fondo gris*/
	border-bottom:1px solid #d7d7d7;
}
#cuerpo2 h1, #cuerpo3 h1{ /*Título importante --> Cursos Profesionales (p.ej.)*/
	font-size:20px;
	color:#333;
	font-weight:100;
}
#cuerpo2 h2, #cuerpo3 h2{ /*Título secundario --> Formación a tu medida (p.ej.)*/
	font-size:16px;
	color:#c33;
	font-weight:100;
	margin-bottom:10px; /*Controla la separación con el resto del texto */
}
#cuerpo2 p, #cuerpo3 p{
	font-size:13px;
	color:#999;
	line-height:18px;
	margin-bottom:10px; /*Controla la separación entre párrafos*/
	margin-right:10px; /*Separación con el borde derecho, para que el texto no parezca un "masacote" de letras*/
}
#cuerpo2 img, #cuerpo3 img{
	float:right;
	margin:0px 10px 5px 10px;
}


/** CUERPO 3 - DISEÑO INDUSTRIAL **/
#contenedorfondogris{ /*Este es el fondo gris degradado de la parte inferior*/
	padding-bottom:25px;
	background:url(images/DegradadoGris.jpg) repeat-x bottom left;
}
#cuerpo3{
	margin-top:20px;
}

#cuerpo3 ul{
	margin-top:20px;
}

#cuerpo3 li{
	font-size:13px;
	color:#666;
	height:18px;
	background:url(images/verifRojo.png) no-repeat;
	padding-left:25px; /*Separación entre la viñeta y el texto */
	margin-top:7px;
	margin-left:20px; /*Separación de toda la línea, incluida la viñeta, con respecto al borde izquierdo*/
}
#cuerpo3 .PosicionImagenPortatil{
	margin-top:30px;
}
