html {
	background:#1F1F1F url(/images/bg-top-strip.gif) repeat-x scroll 0 0;
}

body {
background: transparent url(/images/bg-body.gif) no-repeat scroll 50% 0;
font: 12px Arial, Helvetica, sans-serif;
}

#wrapper {
width: 770px;
margin: 0 auto;
}

#gracias {
	display: none ;
}

	#header {
	height: 230px;
	}
	
	#home #header {
	height: 100px;
	}
	
		#logo {
		background: url(/images/bg-logo.png) no-repeat 0;
		height: 90px;
		text-indent: -9999px;
		margin-bottom: 10px;
		margin-left: -26px ;
		position: absoulte ;
		
		}
		
		#slogan {
		background: url(/images/txt-slogan.png) no-repeat 0;
		height: 90px;
		text-indent: -9999px;
		margin-bottom: 10px;
		position: absolute ;
		width: 466px ;
		top: 1px;
		margin-left: 264px ;
		z-index: 90000 ;
	
		}


		/* #######################################*/
		/* #          Header's balloons          #*/
		/* #######################################*/
		
		#header h2 {
		position: relative;
		}		

		#header h2.on {
		display: block;
		}		
	
		#header h2.off {
		display: none;
		}
	
		h2.balloon {
		background: url(../img/balloon_bg-trans.png);
		color: #fff;
		width: 318px;
		height: 50px;
		font: 1.8em Trebuchet MS, Arial, Helvetica, sans-serif;
		padding-top: 10px;
		text-align: center;
		margin-bottom: 5px;
		}		
	
		h2.step1 {
		left: 125px;
		}		
	
		h2.step2 {
		left: 175px;
		}
	
		h2.step3 {
		left: 225px;
		}
	
		h2.step4 {
		left: 275px;
		}
	
		h2.step5 {
		left: 325px;
		}
	
		h2.step6 {
		left: 375px;
		}

		/* #########################################*/
		/* #          Header's Step guide          #*/
		/* #########################################*/
		
		#steps {
		background: url(../img/steps_bg-trans.png) no-repeat;
		width: 360px;
		height: 70px;
		padding-left: 110px;
		margin: 0 auto;
		text-align: center;
		}		

			#steps li {
			width: 50px;
			height: 50px;
			display: block;
			float: left;
			text-indent: -9999px;
			}			

			#steps li.on {
			background-position: 0 -50px;
			}			

			#steps li.off {
			background-position: 0 0;
			}

			li.step1 {
			background: url(../img/step1_bg.gif);
			}			

			li.step2 {
			background: url(../img/step2_bg.gif);
			}			

			li.step3 {
			background: url(../img/step3_bg.gif);
			}			

			li.step4 {
			background: url(../img/step4_bg.gif);
			}

			li.step5 {
			background: url(../img/step5_bg.gif);
			}

			li.step6 {
			background: url(../img/step6_bg.gif);
			}
	
	#content {
	position: relative;
	}

		#globos {
		position: relative;
		height: 120px;
		}

		#globos li {
		color: #fff;
		font-size: 1.7em;
		position: absolute;
		width: 310px;
		height: 99px;
		top: 0;

		padding: 15px 30px;
		text-align: center;
		display: none;
		}
		
			#globo_programador {
			background: url(../img/home_globo_izq-trans.png) no-repeat;
			left: 2px;
			}
			
			#globo_diseniador {
			background: url(../img/home_globo_der-trans.png) no-repeat;
			right: 2px;
			}

		#identificacion {
		width: 670px;
		margin: 0 auto;
		}
		
			#identificacion li {
			width: 320px;
			height: 390px;
			}
			
				#identificacion li a {
				width: 320px;
				height: 320px;
				display: block;
				text-indent: -9999px;
				position: relative;
				}
				
					#identificacion li a span {
					width: 196px;
					height: 28px;
					display: block;
					margin: 0 auto;
					position: absolute;
					top: 235px;
					left: 70px;
					}
			
			#programador {
			background: url(../img/programador_bloque-trans.png) no-repeat;
			float: left;
			}
			
				#programador a {}
				
					#programador a span {
					background: url(../img/programador_texto.gif) no-repeat;
					}

			#diseniador {
			background: url(../img/diseniador_bloque-trans.png) no-repeat;
			float: right;
			}
			
				#diseniador a {}
				
					#diseniador a span {
					background: url(../img/diseniador_texto.gif) no-repeat;
					}

		#control {}
	
			#control li.on {
			display: block;
			}
		
			#control li.off {
			display: none;
			}
		
			#control li {
			width: 140px;
			height: 80px;
			position: absolute;
			top: 180px;
			display: none;
			cursor: pointer;
			text-align: center;
			}
	
			#control li a {
			width: 86px;
			height: 46px;
			display: block;
			text-indent: -9999px;
			margin: 0 auto 5px auto;
			cursor: pointer;
			}
			
			#control li p {
			font-size: 1.2em;
			color: #ccc;
			}
			
			#previous {
			left:0;
			}
			
				#previous a {
				background: url(../img/control_previous-trans.png);
				}
						
			#next {
			right: 0;
			}
		
				#next a {
				background: url(../img/control_next-trans.png);
				}
	
		#canvas {
		background: url(../img/canvas_bg.gif) repeat-x;
		width: 460px;
		height: 500px;
		overflow: hidden;
		margin: 0 auto;		
		}

			#wajobs {
			width: 2500px;
			overflow: hidden;
			}
			
				#wajobs fieldset {
				width: 460px;
				float: left;
				font-size: 1.3em;
				}
			
				/* ###########################*/
				/* #          Steps          #*/
				/* ###########################*/

				/* Commons */
				
				label {
				width: 260px;
				height: 25px;
				margin: auto;
				display: block;
				}
				
				p.description {
				width: 360px;
				margin: 0 auto 20px auto;
				display: block;
				}
				
					p.description strong {
					font-weight: bold;
					}
				
				input.text {
				width: 250px;
				height: 22px;
				padding: 3px 5px 0 5px;
				margin: 0 auto;
				display: block;
				border-top: 1px #b8bec9 solid;
				border-left: 1px #b8bec9 solid;
				border-right: 1px #fff solid;
				border-bottom: 1px #fff solid;
				margin-bottom: 15px;
				font: 1em Arial, Helvetica, sans-serif;
				}
				
				textarea.comments {
				border-top: 1px #b8bec9 solid;
				border-left: 1px #b8bec9 solid;
				border-right: 1px #fff solid;
				border-bottom: 1px #fff solid;
				font: 1em Arial, Helvetica, sans-serif;
				height: 70px;			
				}
				
				div.error {
					background: #f00;
					color: #fff;
					width: 253px;
					margin: 0 auto;
					display: none;
					padding: 2px 5px;
					font-size: 0.8em;
					text-align: center;
					margin-bottom: 15px;
				}
				
				/* Step 1 */
				
				fieldset.step1 {
				padding-top: 40px;
				}
				
					fieldset.step1 label {
					height: 20px;
					}
				
				/* Step 2 */
							
				fieldset.step2 {
				padding-top: 40px;
				}
				
					h3.category {
					width: 345px;
					height: 22px;
					/* margin: 0 auto 5px auto; */
					cursor: pointer;
					font-size: 1.1em;
					/* border-bottom: 1px #ccc solid; */
					margin: 0 60px 5px 60px;	
					/* text-align: center; */
					text-indent: 5px;
					padding-top: 3px;
					}
					
						h3.plus {
						background: url(../img/category_plus_bg-trans.png) no-repeat;
						}
						
						h3.category:hover {
						color: #ff7d01;
						}
						
						h3.less {
						background: url(../img/category_less_bg-trans.png) no-repeat;
						}
				
					div.category {
					/* background: url(../img/category_bottom_bg.gif) no-repeat bottom left; */
					width: 360px;
					margin: 10px 65px 15px 65px;
					overflow: hidden;
					}
				
						div.category label, div.category .stars-wrapper {
						height: 20px;
						float: left;
						padding-top: 5px;
						}
						
						div.category label {
						width: 130px;
						font-size: 0.8em;
						}
						
						div.category .stars-wrapper {
						width: 210px;
						overflow: hidden;
						}
						
					fieldset.step2 textarea.comments {
					color: #bdc3cf;
					width: 332px;
					/* margin: 0 65px 0 65px; */
					margin: 10px 0;
					overflow: auto;			
					}
				
				/* Step 3 */
				
				fieldset.step3 {
				padding-top: 40px;
				display: inline;
				}
				
					#sexohombre , #sexomujer {
					width: 110px;
					height: 20px;
					display: inline-block;
					margin-bottom: 20px;
					}
					
					#sexohombre {
					margin-left: 100px;
					}
	
					input#telefono , input#movil {
					width: 104px;
					display: inline;
					}
				
					input#telefono {
					margin-left: 99px;
					}
					
				fieldset.step4 {
				padding-top: 40px;
				}
				
					fieldset.step4 textarea {
					width: 360px;
					height: 150px;
					display: block;
					margin: 0 auto;
					overflow: auto;
					}
					
				fieldset.step5 {
				padding-top: 40px;
				}
	#box-footer {
		background: url(../img/sombra-bloque.png) no-repeat;
		width: 460px;
		height: 76px;
		margin: 0 auto;
	}
	
	
	#home {
	background: none;
	}
	
	
	#footer {
		background:transparent url(/images/bg-footer.gif) repeat-x scroll 0 0;
		height:110px;
		overflow:hidden;
		width:100%;
		clear: both;
	}
	
	#footer div {
		margin:0 auto;
		width:826px;
	}
		#footer div a {
			background:transparent url(/images/bg-footer-logo.png) no-repeat scroll 0 0;
			display:block;
			height:24px;
			margin:39px 0 0  ;
			overflow:hidden;
			text-indent:-9999px;
			width:232px;
		}
	
	
	
	.textboxHover { background: #fcfcfc; }
	.textboxFocus { background: #faf5ef; } 