/* ************************************************************************************  
   Hoja de estilo
   Por : Javier Saldarriaga Cano.
   Empresa: Tecnoayudas S.A
   Fecha desarrollo : Junio 26 de 2008

 ************************************************************************************ */

* {
	padding: 0;
	margin: 0;
}

 
body{
 
	width:978px;
	padding:13px 1px 13px 2px;
	margin:0 auto;
	background-color:#0099FF;
	font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
	text-align:left;
	background-color:#17718C;
 
   
}


#wrapper {
	width: 978px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}

#wrapper #header #ingenioslogan {
}
#wrapper #header #ingenioslogan {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 24px;
	color: #003399;
	font-weight: bold;
	padding-top: 2px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 2px;
}
#wrapper #header #MensajeSuperior {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #FF3300;
	padding: 5px 0px 0px 310px;
	font-weight: bold;
}


#faux {
	background: url(../images/faux-1-2-col.gif);
	margin-bottom: 1px;
	overflow: auto;
	width: 100%
}
#header {
	color: #333;
	width: 960px;
	padding: 10px;
	height: 215px;
	margin: 1px 0px 1px 0px;
	background: #D1DBDB;
	background-image:url(../images/fondoencabezado.jpg)
}
#header  img.logo{
	position:relative;
	left:3px;
	top:-8px;
	border:0;
}

#navigation {
 color: #333;
 padding: 10px;
 margin: 0px 0px 3px 0px;
 background: #ABBEBE;
}
#leftcolumn { 
 display: inline;
 color: #333;
 margin:0px;
 padding:0;
 width: 250px;
 float: left;

}
#rightcolumn {
	float: right;
	color: #333;
	margin:0px;
	padding:0;
	width: 710px;
	display: inline;
	position: relative;
	text-align: left;
	background-repeat: repeat-x;
}

#rightcolumn  h1{
	font:bold 10pt/10pt verdana, Arial, Helvetica, sans-serif;
	color: #ff8000;
	margin: 10px 12px 0px 0px;
	border-bottom: #d5d5d5 1px solid;
	line-height: 24px;

}
#rightcolumn  p{
	font-size:11px;
	font-family:tahoma, Arial, Helvetica, sans-serif;
	margin: 5px 2px 4px 5px;
	color: #333333;
	text-align: justify;
}

    .Estilo1 {
        color: #FF6633;
        font-size: 1.15em;
        text-transform: uppercase;
        word-spacing: -2.4pt;
        line-height: 1.7;
        font-family: verdana, sans-serif;
        font-weight: bold;
    }
    #wrapper #header #ingenioslogan {
    }
    #wrapper #header #ingenioslogan {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 25px;
	color: #003399;
	font-weight: bold;
	position: absolute;
	top: 160px;
	height: 0px;
	width: 112px;
	left: 363px;
    }
    #wrapper #header #MensajeSuperior {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	color: #FF3300;
	padding: 5px 0px 0px 0px;
	font-weight: bold;
	position: absolute;
	left: 368px;
	top: 194px;
    }


/*------------------------------------------------footer--------------------*/
#footer{
	width:978px;
	height:125px;
	margin:0 auto;
	background:url(../images/footer_bg.gif) 0 0 repeat-x #323232;
	color:#fff;
	position:relative;
}
#footer ul{
	width:402px;
	position:absolute;
	left:287px;
	top:7px;
}
#footer ul li{
	float:left;
	color:#D4D4C6;
	background-color:inherit;
	font:normal 11px/19px Arial, Helvetica, sans-serif;
}
#footer ul li a{
	color:#D4D4C6;
	background-color:inherit;
	font:normal 11px/19px Arial, Helvetica, sans-serif;
	padding:0 7px;
	text-decoration:none;
}
#footer ul li a:hover{
	color:#D4D4C6;
	background-color:#D76E08;
}
#footer p.copyright{
	font:normal 11px/19px Arial, Helvetica, sans-serif;
	color:#D76E08;
	background-color:inherit;
	position:absolute;
	left:189px;
	top:32px;
	width: 577px;
}
#footer a.subscribe{
	background:url(../images/subscribe_icon.gif) 0 2px no-repeat;
	font:normal 11px/12px Arial, Helvetica, sans-serif;
	color:#B9B99D;
	background-color:inherit;
	position:absolute;
	left:19px;
	top:81px;
	text-decoration:underline;
	width:50px;
	padding:0 0 0 18px;
}
#footer a.subscribe:hover{
	color:#9CCC37;
	background-color:inherit;
	text-decoration:none;
}
#footer a.xht{
	width:98px;
	height:20px;
	background:url(../images/xhtml_bg.gif) 0 0 no-repeat;
	position:absolute;
	left:317px;
	top:59px;
}
#footer a.xht:hover{
	background:url(../images/xhtml_bg_hover.gif) 0 0 no-repeat;
}
#footer a.cs{
	width:98px;
	height:20px;
	background:url(../images/css_bg.gif) 0 0 no-repeat;
	position:absolute;
	left:438px;
	top:59px;
}
#footer a.cs:hover{
	background:url(../images/css_bg_hover.gif) 0 0 no-repeat;
}

#footer a.AAA{
	width:98px;
	height:20px;
	background:url(../images/aaa_bg.gif) 0 0 no-repeat;
	position:absolute;
	left:563px;
	top:59px;
}
#footer a.AAA:hover{
	background:url(../images/aaa_bg_hover.gif) 0 0 no-repeat;
}

#footer img{
	position:absolute;
	left:433px;
	top:87px;


}
#footer p.design{
	font:bold 12px/19px Arial, Helvetica, sans-serif;
	color:#C5BE25;
	background-color:inherit;
	position:absolute;
	left:19px;
	top:85px;
}
#footer p.design a{
	color:#FFFFFF; background-color:inherit; text-decoration:none;
	}
#footer p.design a:hover{
	color:#C5BE25; background-color:inherit;
	}
/*------------------------------------------------footer--------------------*/


.clear { clear: both; background: none; }



div, h1, h2, p, form, label, input, textarea, img, span{
	margin:0px;
	border: 0;
	margin-right: 0px;
	float: none;
	
}

ul{
	margin:0; 
	padding:0; 
	list-style-type:none;
	font-size:0;
}
.spacer{
	clear:both; 
	font-size:0; 
	line-height:0;
}
.spacer2{
	clear:both; 
	font-size:0; 
	line-height:2;
	
}

/*------------------------------Menu Accesible Encabezado--------------------*/
#Menu_accesible{
	width:980px;
	height:34px;
	position:relative;
	margin:0 auto;
	background-color:#FFFFFF;
	margin-top:4px;
	
}
#Menu_accesible ul{
	/*	background:url(../images/top_part.gif) 0 0 no-repeat;*/
	width:872px;
	height:29px;
	position:absolute;
	left:8px;   /*  posicion desde borde izquierdo al a barra menu*/
	top:5px;  /*  pocision del texto dentro de la barra*/
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 15px;
}
#Menu_accesible ul li{
	background:url(../images/nav_div.gif) right top no-repeat;
	height:27px;
	float:left;
	padding:0 1px 0 0;
	margin:0 1px 0 0;
}
#Menu_accesible ul li a{
	display:block;
	background:url(../images/nav_bg.gif) 0 0 repeat-x;
	width:102px;
	height:29px;
	display:block;
	font:bold 11px/29px Arial, Helvetica, sans-serif;
	color:#fff;
	text-decoration:none;
	text-transform:uppercase;
	text-align:center;
	background-color:inherit;
}
#Menu_accesible ul li a:hover{
	background:url(../images/nav_hover.gif) 0 0 no-repeat;
	width:102px;
	height:29px;
	color:#4C4C4C;
	background-color:inherit;
}
#Menu_accesible ul li a.hover{
	margin:0 1px 0 0;
	background:url(../images/nav_hover.gif) 0 0 no-repeat;
 	display:block;
	font:bold 11px/29px Arial, Helvetica, sans-serif;
	color:#4C4C4C;
	text-decoration:none;
	text-transform:uppercase;
	text-align:center;
	background-color:inherit;
}
#Menu_accesible ul li.last{
	background-image:none;
	height:27px;
	float:left;
}
/*-------------------- FIN Menu Accesible Encabezador --------------------*/


/*------------------------------------------------right--------------------*/
#right{
	width:45.13em;
	float:left;
	background-color:#FF0066;
}
#right p.rightTop{
	display:block;
	width:50.35em;
	height:22px;
	background-color: #D7D7C7;
	border: 0;
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
	text-indent: 12px;
	margin-top: 0px;
	text-align: left;
	vertical-align: middle;
	padding-top: 2px;
	margin-right: 1px;
}
#right h2{
	font:bold 20px/17px Arial, Helvetica, sans-serif;
	color:#222222;
	background-color:inherit;
	margin:6px 0 10px 0;
	padding:0 0 0 30px;
	display:block;
}
#right p.rightTxt1{
	font:normal 13px/18px Arial, Helvetica, sans-serif;
	color:#62625C;
	background-color:inherit;
	padding:0 3px 10px 30px;
}
#right p.rightTxt1 span{
	font:bold 13px/18px Arial, Helvetica, sans-serif;
	color:#5F860B;
	background-color:inherit;
}
#right p.rightTxt2{
	font:normal 13px/18px Arial, Helvetica, sans-serif;
	color:#62625C;
	background-color:inherit;
	padding:0 0 20px 38px;
	float:left;
	width:349px;
	margin:0 27px 0 0;
}
#right p.rightTxt2 span{
	font:bold 17px/18px Arial, Helvetica, sans-serif;
	color:#D76E08;
	background-color:inherit;
	border-bottom:#BCBCB5 dashed 1px;
	width:340px;
	display:block;
	margin:0 0 15px 0;
}
#right p.rightPic{
	display:block;
	width:166px;
	height:185px;
	float:left;
	margin:0 0 22px 0;
}
#right p.rightBottom{
	display:block;
	background:url(../images/right_bottom.gif) 0 0 no-repeat;
	width:608px;
	height:20px;
	float:left;
}


.titulo{
	font-family: verdana,sans-serif;
	color: #DED283;
	font-size: 1.2em;
	font-weight: bold;
	text-transform: uppercase;
	line-height: 1.7;

}
/*------------------------------------------------right--------------------*/
#estasaqui {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.1em;
	font-style: normal;
	background-color:#FEEFC8;
	height: 22px;
	padding: 4px;
	margin: 0px 0px 3px 0px;
	text-align: left;
}
#estasaqui p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.1em;
  	color:#000033;
}
	

/* =-=-=-=-=-=-=-[varios]-=-=-=-=-=-=-=- */
div#skip_to_content a {
  display: none;
}


/* =-=-=-=-=-=-=-[Menu Five]-=-=-=-=-=-=-=- */

#menu5 {
	width: 22.9em;
	border-style: none solid none solid;
	border-color: #993300;
	border-width: 0px;
	margin: 0px;

	}

#menu5 li a {
  	height: 32px;
  	height: 24px;
	text-decoration: none;
	padding:0 0 0 10px;
	font:bold 14px/14px "Trebuchet MS", Arial, Helvetica, sans-serif;
	color:#47472D;

	}

#menu5 li a:link, #menu5 li a:visited {
	color: #777;
	display: block;
	background: url(../images/menu5.gif);
	padding: 8px 25px 0 10px;
	text-align: left;
	text-indent:22px;
	}
#menu5 img.cuadrito	{
text-indent:2px;

}

#menu5 li a:hover {
	color:#CC3300;
	background: url(../images/menu5.gif) 0 -32px;
	padding: 8px 25px 0 10px;
	text-align: left;
	}

#menu5 li a:active {
	color: #fff;
	background: url(../images/menu5.gif) 0 -64px;
	padding: 8px 25px 0 10px;
	text-align: left;
	}
	
#menu5 li p{
	height: 22px;
	padding: 4px 4px 4px 4px;
	background-color:#FFF001;
	text-decoration: none;
	font-family:Arial, Helvetica, sans-serif;
	font-size:22px;
	font-weight:bold;
	color:#005BAB;
	text-align: center;
	}
/*----------------------------------------------------------------*/
#wrapper #prefooter {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	background-color: #FFFF99;
	background-image: url(../images/barraInferior.gif);
	width: 978px;
	height: 32px;
	
}
#wrapper #Patrocinios {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	background-color: #FFFFFF;
	width: 978px;
	text-align: center;
}
#wrapper #faux #rightcolumn ul {
	list-style-position: outside;
	list-style-type: square;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	margin-left: 20px;
	line-height: 25px;
}

/*-------------------------------CENTRO PPAL---------------------------------*/

 body #container {
	width: 98%;  /* esto creará un contenedor con el 80% del ancho del navegador */
	background: #FFFFFF;
	margin: 0 auto; /* los márgenes automáticos (conjuntamente con un ancho) centran la página */
	border: 0px solid #000000;
	text-align: left; /* esto anula text-align: center en el elemento body. */
    }
     
    /* Sugerencias para barraizquierda:
    1. dado que está trabajando en porcentajes, es conveniente no utilizar relleno en la barra lateral. Se añadirá al ancho en el caso de navegadores que cumplen los estándares, creando un ancho real desconocido. 
    2. El espacio entre el lado del div y los elementos que contiene puede crearse colocando un margen izquierdo y derecho en dichos elementos, como se observa en la regla ".twoColLiqRt #barraizquierda p".
    3. Dado que Explorer calcula los anchos después de mostrarse el elemento padre, puede que ocasionalmente encuentre errores inexplicables con columnas basadas en porcentajes. Si necesita resultados más predecibles, puede optar por cambiar a columnas con tamaño en píxeles.
    */
   body #barraizquierda {
	float: right; /* dado que este elemento es flotante, debe asignarse un ancho */
	width: 40%;
	background: #FFFFFF; /* el color de fondo se mostrará a lo largo de todo el contenido de la columna, pero no más allá */
	padding: 15px 0;
	padding-left: 10px;
    }
   body #barraizquierda h3, .twoColLiqRt #barraizquierda p {
	margin-left: 10px; /* deben asignarse los márgenes izquierdo y derecho de cada elemento que vaya a colocarse en las columnas laterales */
	margin-right: 10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #CC3300;
    }
    
    /* Sugerencias para centroderecha:
    1. el espacio entre el centroderecha y barraizquierda se crea con el margen derecho del div centroderecha.  Con independencia de la cantidad de contenido que incluya el div barraizquierda, permanecerá el espacio de la columna. Puede quitar el margen derecho si desea que el texto del div #centroderecha llene el espacio de #barraizquierda cuando termine el contenido de #barraizquierda.
    2. para evitar la caída de un elemento flotante con una resolución mínima admitida de 800 x 600, los elementos situados dentro del div centroderecha deben tener un tamaño de 430px o inferior (incluidas las imágenes).
    3. en el siguiente comentario condicional de Internet Explorer, la propiedad zoom se utiliza para asignar a centroderecha "hasLayout." Esto evita diversos problemas específicos de IE.
    */
    body  #centroderecha {
	margin: 0 42% 0 10px; /* el margen izquierdo puede asignarse en porcentajes o píxeles. Éste crea el espacio a lo largo de la parte izquierda de la página. */
    }
    
    .fltrt { /* esta clase puede utilizarse para que un elemento flote en la parte derecha de la página. El elemento flotante debe preceder al elemento junto al que debe aparecer en la página. */
    	float: right;
    	margin-left: 8px;
    }
    .fltlft { /* esta clase puede utilizarse para que un elemento flote en la parte izquierda de la página. */
    	float: left;
    	margin-right: 8px;
    }
    .clearfloat { /* esta clase debe colocarse en un elemento div o break y debe ser el último elemento antes del cierre de un contenedor que incluya completamente a un elemento flotante */
    	clear:both;
        height:0;
        font-size: 1px;
        line-height: 0px;
    }
.imagen {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	margin: 0px 8px 5px 0px;
	text-align: left;
	display: block;
	float: left;
}

 body  #centroderecha a{
 	color: #FF6600;
	font-weight: bold;
}

 body  #centroderecha a:hover{
 	color:#9CCC37;
	background-color:inherit;
	text-decoration:none;
}


/**********************************************************************/

div#show3 {
background-color:#efefef;
width:140px;
margin:0 auto;
border:1px solid #444444;
}
div#show3 table td, div#show4 table td {
height:24px;
background-image:url('38.gif');
}
div#show4 table td {
background-image:url('40.gif');
}
div#show3 table input,  div#show4 table input {
outline-style:none;
}

 #barraizquierda #mostrarfotos {
	border-top-style:solid;
	background-image: url(../images/fondoimagenes.gif);
	background-repeat:no-repeat;
	margin: 0px 0px 0px 0px;
	height: 320px;
	padding-top: 10px;
	text-align: left;
	
}
 
  #barraizquierda #telecentros2 {
	background-image: url(../images/fondotelecentros2.jpg);
	background-repeat:no-repeat;
	margin: 10px 0px 0px 10px;
	height: 320px;
	padding-top: 10px;
	text-align: left;
	padding-left: 7px;
	padding-right: 10px;
}
 
 
 #barraizquierda #telecentros {
	background-image: url(../images/fondotelecentros.jpg);
	background-repeat:no-repeat;
	margin: 10x 0px 0px 5px;
	height: 320px;
	padding-top: 8px;
	text-align: left;
	padding-left: 2px;
	padding-right: 2px;
}



 #telecentros #listatelecentros {
	list-style-position: inside;
	list-style-type: square;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	margin-left: 10px;
	color: #993300;
	line-height: 16px;
}

#eventos {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	padding-left: 10px;
	padding-top: 4px;
	background-image: url(../images/fondoeventos.jpg);
	height: 200px;
	margin-left: 10px;
	margin-top: 20px;
}

#eventos #lista_eventos {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 8px;
	list-style-type: circle;
	line-height: 2;
}

#eventos .tituloeventos {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #FFFFCC;
	font-weight: bold;
	text-transform: uppercase;
}
#lista_eventos a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #17718C;
	font-weight: bold;
}

#eventos #lista_eventos a:hover{
	color:#FF9900;
	background-color:inherit;
	text-decoration:none;
} 

#centroderecha h2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	text-transform: uppercase;
	color: #CC9900;
	border-bottom-style: solid;
	border-bottom: 1px;
	padding-top: 10px;
}
 #contenidopaginas {
	
	margin-top: 0px;
}
 #contenidopaginas h1 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 24px;
	font-weight: bold;
	color: #663300;
	margin-left: 15px;
	padding-top: 20px;
}
 #contenidopaginas p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	margin-left: 20px;
	padding-top: 20px;
	margin-right: 20px;
}
 #contenidopaginas h2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #FF6600;
	padding-top: 15px;
	margin-left: 15px;
	text-transform: uppercase;
	text-decoration: underline;
	
}
 #contenidopaginas h3 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 10px;
	font-weight: bold;
	color: #003333;
	margin-left: 15px;
	margin-top: 20px;
}
 #mostrarfotos p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #330000;
	font-size: 11px;
	margin-left: 15px;
	margin-right: 15px;
	text-align: center;
}

#capacitacionVirtual{
width:210px;
font-size:10px;
text-align:center;
background-color:#eeeeFF;
border-style:outset;
border-width: medium;        /* pone el ancho de border para todos los lados */
border-color:#CCCCCC;


}

#capacitacionVirtual p{
font-family:Arial, Helvetica, sans-serif;
}
