/* >>> ELEMENTS <<< */

* {
	margin: 0;
	padding: 0;
}

html {
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	font:11px Arial, Helvetica, Geneva, Swiss, sans-serif;
}

body {
	font-size:1em;
	color:#333;
	width:100%;
	height:100%;
	margin:0;
	padding:0;
}


/* >>> CONTAINERS <<< */


div#container {
	width: 740px;
	margin: 10px auto;
	text-align: left;
}

div#muestra_pie {
	text-align: center;
}

div#cabecera-wrap {
	margin: 8px 0;
}

div#cabecera-programacion {
	height: 280px; 
	background-image: url(images/cabecera_programacion.jpg);
	background-repeat: no-repeat;
}

div#cabecera-trabajos {
	height: 280px; 
	background-image: url(images/cabecera_trabajos.jpg);
	background-repeat: no-repeat;
}

div#cabecera-clientes {
	height: 280px; 
	background-image: url(images/cabecera_clientes.jpg);
	background-repeat: no-repeat;
}
						
div#cabecera-diseno {
	height: 280px; 
	background-image: url(images/cabecera_disenyo.jpg);
	background-repeat: no-repeat;
}
			
div#cabecera-presentacion {
	height: 280px; 
	background-image: url(images/cabecera_presentacion.jpg);
	background-repeat: no-repeat;
}			
			
div#cabecera-presupuesto {
	height: 280px; 
	background-image: url(images/cabecera_presupuesto.jpg);
	background-repeat: no-repeat;
}
		
div#cabecera-contacto {
	height: 280px; 
	background-image: url(images/cabecera_contacto.jpg);
	background-repeat: no-repeat;
}

div#experiencia {
	margin-left: 260px;


}
		

div#contenido-wrap {

		

		}

		div#center {

			margin: 0 0 0 220px;

			color: inherit;

			background-color: #fff;

			border-width: 0 2px 2px 0;

			}

			div#center-in {

				padding: 20px;
				border: solid #000065;
				border-width: 1px 1px 1px 1px;

				}

		div#left {
			float: left;
			width: 210px;
			color: inherit;
			background-color: #fff;
			border: solid #000065;
			border-width: 1px 1px 1px 1px;
		}

			div#left-in {

				padding: 1px;

				}

	div#footer-wrap {

		clear: both;

		}

		div#footer-in {

			

			}
			

/*------------------------------MENU----------------------------*/

.experiencia {

	list-style: none;
	padding: 0;
}

.experiencia li {
	list-style: square;
	margin-top: 8px;
	margin-left: 25px;
	padding: 0;

}

.texto_tabulado{
	margin-top: 6px;
	margin-left: 20px;

}


.menu_principal {

	list-style: none;
	height: 80px;
	padding: 0;

}



.menu_principal li {
	list-style: none;
	height: 80px;
	margin: 0;
	padding: 0;

}


li.presentacion {
	width: 190px;
	background: url(images/menu/ic_presentacion.gif) no-repeat 0 0;
}



li.programacion {

	width: 190px;

	background: url(images/menu/ic_programacion.gif) no-repeat 0 0;

}


li.trabajos {

	width: 190px;

	background: url(images/menu/ic_trabajos.gif) no-repeat 0 0;

}



li.clientes{

	width: 190px;

	background: url(images/menu/ic_clientes.gif) no-repeat 0 0;
}



li.disenoweb {

	width: 190px;
	
	background: url(images/menu/ic_disenoweb.gif) no-repeat 0 0;
}



li.contacto {

	width: 190px;

	background: url(images/menu/ic_contacto.gif) no-repeat 0 0;

}



li.presupuesto {

	width: 190px;

	background: url(images/menu/ic_presupuesto.gif) no-repeat 0 0;

}





.menu_principal a {

	float: left;

	height: 58px;

}



.menu_principal a:link {}

.menu_principal a:visited {}

.menu_principal a:hover {}

.menu_principal a:active {}





li.presentacion a {

	width: 190px;

	background: url(images/menu/ic_presentacion.gif) no-repeat 0 0;

}

li.presentacion a:hover, li.presentacion a.qui {
	background-image: url(images/menu/ic_presentacion2.gif);
	background-repeat: no-repeat;
	background-position: 0 0%;
}





li.programacion a {

	width: 190px;

	background: url(images/menu/ic_programacion.gif) no-repeat 0 0;

}

li.programacion a:hover, li.programacion a.qui {background: url(images/menu/ic_programacion2.gif) no-repeat 0 00%;}





li.trabajos a {

	width: 190px;

	background: url(images/menu/ic_trabajos.gif) no-repeat 0 0;

}

li.trabajos a:hover, li.trabajos a.qui {background: url(images/menu/ic_trabajos2.gif) no-repeat 0 0%;}






li.clientes a {

	width: 190px;

	background: url(images/menu/ic_clientes.gif) no-repeat 0 0;

}

li.clientes a:hover, li.clientes a.qui {background: url(images/menu/ic_clientes2.gif) no-repeat 0 0%;}





li.disenoweb a {

	width: 190px;

	background: url(images/menu/ic_disenoweb.gif) no-repeat 0 0;
}

li.disenoweb a:hover, li.disenoweb a.qui {background: url(images/menu/ic_disenoweb2.gif) no-repeat 0 0%;}





li.contacto a {
	width: 190px;

	line-height: 11px;

	background: url(images/menu/ic_contacto.gif) no-repeat 0 0;

}

li.contacto a:hover, li.contacto a.qui {background: url(images/menu/ic_contacto2.gif) no-repeat 0 0%;}




li.presupuesto a {

	width: 190px;

	background: url(images/menu/ic_presupuesto.gif) no-repeat 0 0;
}

li.presupuesto a:hover, li.presupuesto a.qui {background: url(images/menu/ic_presupuesto2.gif) no-repeat 0 0%;}


/*-----------------------------GLOBALES-----------------------*/

h1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.5em;
	font-weight: bold;
	text-transform: uppercase;
	color: #000065;
}

h2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.2em;
	font-weight: bold;
	text-transform: uppercase;
	color: #000065;
}

h3 {
	color: #3d3d3d;
	text-align: justify;
	font-family: Arial, Helvetica, Verdana, Sans-serif;
	font-size: 10px;
	line-height: normal;
	
}

.negrita_subr{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-weight: bold;
	text-decoration: underline;
}

.negrita{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-weight: bold;
}

.ul_margin{
	margin-left: 20px;
}


.img {

  border: 0;

}

.img1 {
  border: 2px solid #FFCC03;
}

.amenu_inf{
	font-size:1em;
	color:#333;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
}


.amenu_inf:hover {
	font-size:1em;
	color:#333;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: underline;
}

#tamanyo_texto{

	float:right;
}

.enlace2{
	font-size:1em;
	color:#000;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: underline;
}


.enlace2:hover {
	font-size:1em;
	color:#000000;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: underline;
}

/*------------PROGRAMADOR FREELANCE-----------------*/
#banda {
	position: fixed;
	right: 0;
	bottom: 0;
	display: block;
	height: 80px;
	width: 80px;
	background: url(images/banda.png) bottom right no-repeat;
	text-indent: -999em;
	text-decoration: none;
  	z-index:3;
}

#banda2 {
	position: fixed;
	left: 0;
	top: 0;
	display: block;
	height: 80px;
	width: 80px;
	background: url(images/banda2.jpg) top left no-repeat;
	text-indent: -999em;
	text-decoration: none;
  z-index:3;
}

#anuncio{
	float: right;
	font-family: Arial, Helvetica, sans-serif;
	color:#9F9F9F;
	font-size: 0.9em;
	font-weight: bold;
	font-style: italic;
}

#anuncio2{
	float: right;
	font-family: Arial, Helvetica, sans-serif;
	color:#9F9F9F;
	font-size: 0.9em;
	font-weight: bold;
	font-style: italic;
}




/*------------PORTAFOLIOS-----------------*/
.portafolios {
	height: 169px; 
	width: 421px;
	background: url("images/portafolios_.jpg") no-repeat;
	margin-right: 13px;
	padding-top: 10px;
	padding-left: 10px;
	
}

.trabajo {
	height: 100px; 
	width: 400px;
	margin-right: 13px;
	
}

.imagen{
	float: left;
	border: 0;

}



.descripcion{
	border: 0;
	padding-left: 110px;

}


#lightbox{
	position: absolute;
	top: 40px;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#lightbox a img{ border: none; }

#outerImageContainer{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	}

#imageContainer{
	padding: 10px;
	}

#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
	}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
	}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url(../images/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }


#imageDataContainer{
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	}

#imageData{
	padding:0 10px;
	}
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	}	
		
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	}
	

.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}

* html>body .clearfix {
	display: inline-block; 
	width: 100%;
	}
	
* html .clearfix {
	/* Hides from IE-mac \*/
	height: 1%;
	/* End hide from IE-mac */
	}	


/*------------CONTACTO-----------------*/

.info{
		color:  #000;	
	  background-color: #EEF6FF;
		border: 1px solid #0B639A;
		padding: 0.5em;
		margin: 0em 0.5em 0em 0.5em;
	}
	
	.i{
	  color: #fff;
		background-color: #039;		
		font-weight: bold;
		font-size: 1.2em;
		padding: 0.1em 0.6em 0.1em 0.6em;
		margin-right: 0.6em;
	}
	
.obligatorio{
	  color: #c00;
	}
	
	.campo_form{
	  margin-top: 0.5em;
	}
	
  .campo_form label{
	padding-right: 1em;
    display: block;
    width: 10em;
    float: left;
	text-align: right;
  }
	
	#submit{
	  text-align: right;
	}
 
 
 /*------------PROGRAMACIÓN-----------------*/
 
.niveles {
	height: 41px;
	width: 471px;
	background: url("images/programacion/niveles.jpg") no-repeat;

}

.nivel_avanzado {
	height: 22px;
	width: 437px;
	margin: 2px;

}

.nivel_medio {
	height: 22px;
	width: 332px;
	margin: 2px;

}

.nivel_basico {
	height: 22px;
	width: 261px;
	margin: 2px;

}

.nivel_nose {
	height: 22px;
	width: 172px;
	margin: 2px;

}

 /*------------DISEÑO-----------------*/

.programas {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.2em;
	font-weight: bold;
	text-transform: uppercase;
	color: #000065;
}

 /*------------ZONA CLIENTES-----------------*/
 
#login{
	font-size:0.80em;
	top: 38px;
	float:left;
}

#loggedin{width:240px;}
#loginform{width:230px;height:33px;line-height:1.4em;}
#loginform input{
	font:1.1em "Lucida Grande", "Trebuchet MS", Trebuchet, sans-serif;
	width:100px;
	border:1px solid #245798;
	background:#eee;
	color: #3c3c3c;
}
#loggedin{width:240px;height:69px;padding-top:3px;line-height:3em;}

#loginboton{
	font:1.1em "Lucida Grande", "Trebuchet MS", Trebuchet, sans-serif;
	margin-top: 70px;
}

.boton{
	  font-family: Verdana, geneva, arial, sans-serif;
	  font-size:10px;
	  border: 1px solid #000000;
	  background-color: #B0B0D8;
	  text-align:center;
}



/*------------SITEMAP----------------*/

.asitemap{
	font-size:1.1em;
	color:#000065;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
	font-weight: bold;
	margin-left: 30px;
}

.asitemap:hover {
	font-size:1.1em;
	color:#000065;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: underline;
	font-weight: bold;
	margin-left: 30px;
}

.asitemap2{
	font-size:1.1em;
	color:#000065;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
	margin-left: 30px;
}

.asitemap2:hover {
	font-size:1.1em;
	color:#000065;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: underline;
	margin-left: 30px;
}

textarea{
	font-size:1.1em;
}

.destacado{
	font-size:1.1em;
	font-weight: bold;
	color: #EF8100;

}

.destacado2{
	font-size:1.1em;
	font-weight: bold;
	color: #010066;

}