/*
                                        
         #   #   #       #   #          
### # #  #  ###     ###  #      ###  ## 
### # #  #   #   #  # #  #   #  #   # # 
# # ###  ##  ##  ## ###  ##  #  ### #### 
                    #  

Proyecto: Sodexo pass
Resumen: Estilos landing clientes
Version: 1.0
css ninja: Claudio Merino / www.requiem.cl
Descripcion:
	1.- estilos para carrusel de clientes
	2.- estilos para landing clientes
	3.- estilos para lightbox clientes
	
----- PALETA COLORES ------
TEXTOS
Azul Link y Titulos: #014665
Gris: #333333
Fucsia Link Visited: #72A1B7

*/

/*estilos para carrusel de clientes*/
#banner_aso{float:left;position: relative; width:780px;}
#carrusel_clientes_1{width: 780px; height: 334px; background: transparent url(../gral/images/fondo_carrousel_clientes_1.png) no-repeat; margin: 10px auto;}
#carrusel_clientes_2{width: 780px; height: 334px; background: transparent url(../gral/images/fondo_carrousel_clientes_2.png) no-repeat; margin: 10px auto;}
#carrusel_clientes_3{width: 780px; height: 334px; background: transparent url(../gral/images/fondo_carrousel_clientes_3.png) no-repeat; margin: 10px auto;}
#carrusel_clientes_4{width: 780px; height: 334px; background: transparent url(../gral/images/fondo_carrousel_clientes_4.png) no-repeat; margin: 10px auto;}
#carrusel_clientes_4 h2{margin-left: 130px;}
.carrusel{width: 780px; height: auto;}
.carrusel h2{margin-top: 100px; margin-left: 50px; font-size: 24px;}
.carrusel h2 strong{font-weight: bold;}
.carrusel h3{display: block; margin-top: 5px; margin-left: 50px; font-size: 14px;}
.carrusel h3 a{color: #034865;}
.carrusel p{width: 420px; font-size: 12px; margin-left: 50px; line-height: 1.3em;}
.ver_mas{position: absolute; top:10px; left: 160px; width: 20px; height: 20px; z-index:10;}
.numero_promo{position: absolute; top:39px; left: 0px; width: 320px; height: 30px; color: white; margin-left: 10px; font-size: 15px; font-weight: bold; margin-top: 12px; z-index: 10;}
.numero_promo p{background-color: #00A0C6; height: 12px; padding: 9px 5px; width: 80px; margin-right: 1px; float: left;}
.numero_promo #pager{ display: inline; float: left;}
.numero_promo li {float: left; display: block; width: 24px; margin-right: 1px; height: 12px}
.numero_promo li a{background-color: #00A0C6; display: block; width: 8px; padding: 8px 8px 7px;}
.numero_promo_activa, .activeSlide{background-color: #034865!important;}
.numero_promo li a{color: white;}
.botones{position: absolute; margin-top: 250px; margin-left: 40px;}
.botones p{float: left; margin-right: 5px;}
.promo_embed{position: absolute; margin-top: 40px; margin-left: 480px; font-size: 11px;}
.promo_embed h4{display: block; font-weight: bold; font-size: 12px; margin-bottom: 5px;}
.promo_embed p{margin-left: 130px;}
.promo_embed img{border: 5px solid white;}
.promo_embed a{color: #034865;}


a.btn_funciona {background-image: url(../gral/images/boton_izq_2.png); background-position: left top; height: 28px; text-decoration: none; width: 110px; text-align: center; background-repeat: no-repeat; color: #fff; display: block;}
a.btn_funciona span {background-image: url(../gral/images/boton_der_2.png); background-position: right top; height: 20px; padding-top: 8px; font-size: 10px; width: auto; font-weight: bold; background-repeat: no-repeat; color: #fff; display: block;}
a.btn_funciona:hover {background-position: left bottom; text-decoration: underline;}
a.btn_funciona:hover span {background-position: right bottom;}
a.btn_simule {background-image: url(../gral/images/boton_izq.png); background-position: left top; height: 28px; text-decoration: none; width: 300px; text-align: center; background-repeat: no-repeat; color: #fff; display: block;}
a.btn_simule span {background-image: url(../gral/images/boton_der.png); background-position: right top; height: 20px; padding-top: 8px; font-size: 10px; width: auto; font-weight: bold; background-repeat: no-repeat; color: #fff; display: block;}
a.btn_simule:hover {background-position: left bottom; text-decoration: underline;}
a.btn_simule:hover span {background-position: right bottom;}


.title{float: left; width: 400px; height: auto; margin-left: 10px;}
.title h1{color:#729FB7; font-size: 22px;}
.title h2{color: #004665; font-size: 14px; margin-top: 5px;}


.estadistica{width: 255px; float: right; font-size: 11px; color: #4C5259; background:transparent url(../gral/images/fondo_estadisticas.gif) no-repeat top right;}
.estadistica p{padding:0 10px;margin:10px 0 0 0;float:left;}
.estadistica strong{font-weight: bold;}
.estadistica_final{width:255px; height: 4px; float: right; background: transparent url(../gral/images/fondo_estadisticas_final.gif) no-repeat bottom;}

.contenido{width: 780px; background: url(../gral/images/fondo_clientes.png) no-repeat top !important; margin-top: 10px;}
.contenido{width: 780px; background: url(../gral/images/fondo_clientes.png) no-repeat top; margin-top: 10px;float:left;}

.contacto{width: 260px; margin-left: 30px; padding-top: 40px; font-size: 12px; float: left;display:inline;}
.contacto h3{font-size: 19px; color: white; display: block; margin-bottom: 5px;}
.contacto h4{font-size: 12px; display: block;}
.contacto h4 strong{font-weight: bold;}
.contacto label{font-weight: bold; width: 260px; display: block; margin-top: 20px;}
.contacto input{width: 230px; height: 15px; padding: 4px; margin-top: 3px; border: 1px solid white; background: white url(../gral/images/fondo_input_clientes.gif) repeat-x top; font-size: 12px; font-family: Arial, Helvetica, sans-serif;}
.input_150{width: 160px!important; height: 18px; padding: 4px; margin-top: 3px; border: 1px solid white; background: white url(../gral/images/fondo_input_clientes.gif) repeat-x top;}

a.btn_contacto {background-image: url(../gral/images/boton_izq.png); background-position: left top; height: 28px; text-decoration: none; width: 240px; text-align: center; background-repeat: no-repeat; color: #fff; display: block;}
a.btn_contacto span {background-image: url(../gral/images/boton_der.png); background-position: right top; height: 20px; padding-top: 8px; font-size: 10px; width: auto; font-weight: bold; background-repeat: no-repeat; color: #fff; display: block;}
a.btn_contacto:hover {background-position: left bottom; text-decoration: underline;}
a.btn_contacto:hover span {background-position: right bottom;}
.datos_contacto{font-size: 13px; margin-top: 27px; margin-left: 30px; line-height: 140%;}
* html .datos_contacto{margin-top:15px;}
.datos_contacto{margin-top:15px !important¡;}

.datos_contacto p a{ font-weight: bold; color: #333;}
.datos_contacto p a:hover{ text-decoration: underline;}
.identifica{width: 260px; margin-left: 30px; padding-top: 40px; font-size: 12px; float: left;display:inline;}
.identifica h3{font-size: 19px; color: white; display: block; margin-bottom: 5px; margin-left: 5px;}
.identifica p{font-size: 14px; font-weight: bold; margin-top: 15px;}
.identifica a{color: #004665; font-weight: bold;}
.identifica img{width: 25px; height: 25px; margin-right: 10px; float: left; margin-top: 12px;}
.restaurant_destaca{width: 260px; height: 260px; background: transparent url(../gral/images/fondo_identifica_clientes.png) no-repeat; margin-left: 5px;}
.restaurant_destaca p{padding-top: 195px; padding-left: 20px; width: 120px; font-size: 11px;}
.restaurant_destaca a{color: #004665; font-weight: bold;}

.sidebar{float: right; width: 160px; margin-right: 20px; margin-top: 50px; background: white url(../gral/images/fondo_sidebar_clientes.gif) repeat-y;display:inline;}
.encuesta{width: 140px; height: 188px; padding: 0 10px; background: white url(../gral/images/fondo_encuesta_clientes.gif) repeat-y; font-size: 12px; color: #024765;}
.encuesta h3{color: #72A0B7; font-size: 14px;}
.encuesta h4{color: #72A0B7; font-size: 12px; display: block; margin: 10px 0; font-weight: bold;}
.encuesta input{margin-right: 10px; margin-bottom: 5px;}
.encuesta a{color: #024765; font-size: 11px; padding-bottom: 15px; display: block;}
.encuesta p {clear:both;}
.encuesta p span{display: block; width:50px; padding-right: 10px; float:left; text-align:right;}


a.btn_encuesta {background-image: url(../gral/images/boton_izq.png); background-position: left top; height: 28px; text-decoration: none; width: 60px; text-align: center; background-repeat: no-repeat; color: #fff; display: block; padding-bottom: 0!important;}
a.btn_encuesta span {background-image: url(../gral/images/boton_der.png); background-position: right top; height: 20px; padding-top: 8px; font-size: 10px; width: auto; font-weight: bold; background-repeat: no-repeat; color: #fff; display: block; padding-bottom: 0!important; float: none; padding-right: 0; text-align: center;}
a.btn_encuesta:hover {background-position: left bottom; text-decoration: underline;}
a.btn_encuesta:hover span {background-position: right bottom;}
.donde_usar_sidebar{width: 150px; background: transparent url(../gral/images/fondo_donde-usa_sidebar.png) no-repeat; height: 162px; margin-left: 5px;}
.donde_usar_sidebar h3{color: #72A0B7; font-size: 14px; display: block; padding-top: 20px; margin-left: 10px; width: 130px;}
.donde_usar_sidebar p{color: #034865; font-size: 12px; margin-top: 20px; margin-left: 25px; width: 70px;}
.donde_usar_sidebar a{color: #034865;}
.servicios_sidebar {width: 150px; /*background: white url(../gral/images/fondo_servicios_sidebar.gif) repeat-x top;*/ height: auto; margin-left: 5px;}
.servicios_sidebar h3{color: #72A0B7; font-size: 14px; display: block; padding-top: 20px; margin-left: 10px; width: 130px; margin-bottom: 10px;}
.servicios_sidebar ul{width: 130px; margin-left: 10px; padding-bottom: 10px;}
.servicios_sidebar li{background:transparent url(../gral/images/bullet_sidebar.png) no-repeat scroll left 9px; font-size:12px; line-height:25px; margin:0; padding:0 0 0 15px;}
.servicios_sidebar li a{color: #034865;}
.vivir_bien_sidebar{margin-bottom: -5px;}
.otros_productos{margin-top: -100px; margin-left: 30px;}
.otros_productos h3{display: block; margin-bottom: 5px; font-size: 13px; font-weight: bold;}
.otros_productos ul{width: 550px; height: 110px; padding-top: 10px; background: transparent url(../gral/images/fondo_otros_productos.gif) no-repeat; }
.otros_productos li{display: inline; height: 90px; margin-left: 5px;}
.fin_contenido{width: 780px; height: 22px; background: transparent url(../gral/images/final_content.png) no-repeat; margin: 0 auto;float:left;}


.lightbox_cheque{width: 750px; background: transparent url(../gral/images/fondo_lightbox_750.gif) repeat-y;}
.lightbox_cheque h3{padding: 10px 20px 5px; display: block; color: #729FB7; font-weight: bold; font-size: 22px;}
.lightbox_cheque h4{color: #004665; padding: 0 20px; display: block; font-size: 14px;}
.lightbox_cheque p{text-align: center;}
.lightbox_cheque_final{width: 750px; height: 103px; background: transparent url(../gral/images/final_lightbox_cheque.gif) no-repeat;}
.lightbox_cheque_final p{text-align: center; padding-top: 30px;}
.lightbox_cheque_final img{border: 5px solid #004665; margin: 0 5px;}
.borde_gris{border: 5px solid #ccc!important;}

.lightbox_simulador{width: 750px; background: url(../gral/images/fondo_lightbox_750.gif) repeat-y bottom; padding-bottom: 20px; margin:0 auto;}
.lightbox_simulador h3{padding: 0 20px 5px; display: block; color: #729FB7; font-weight: bold; font-size: 22px;}
.lightbox_simulador h4{color: #004665; padding: 0 20px; display: block; font-size: 14px;}
.lightbox_simulador p{margin-left: 20px; font-size: 12px;}
.lightbox_simulador a{color: #004665;}

.costo_simulador{margin: 20px auto;}
.costo_simulador tr{border-bottom: 1px dotted #ccc; margin-top: 5px; padding-bottom: 5px; display: block;}
.costo_simulador td{font-size: 12px;}

a.btn_ahorro {background-image: url(../gral/images/boton_izq.png); background-position: left top; height: 28px; text-decoration: none; width: 190px; text-align: center; background-repeat: no-repeat; color: #fff; display: block; margin-left: 260px;}
a.btn_ahorro span {background-image: url(../gral/images/boton_der.png); background-position: right top; height: 20px; padding-top: 8px; font-size: 10px; width: auto; font-weight: bold; background-repeat: no-repeat; color: #fff; display: block;}
a.btn_ahorro:hover {background-position: left bottom; text-decoration: underline;}
a.btn_ahorro:hover span {background-position: right bottom;}

.consigue_ahorro{width: 670px; background-color: #FFFFCC; height: auto; margin-left: 20px; padding: 20px; margin-top: 20px;}
.consigue_ahorro h4{color: #729FB7; margin-left: -20px; display: block; margin-bottom: 10px;}
.consigue_ahorro p{margin-left: 0; margin-bottom: 10px;}
.consigue_ahorro img{margin-bottom: -8px;}

.tabla_colaboradores{float: left; width: 350px; height: auto; margin-left: 24px; margin-bottom: 20px;}
.ahorro_mensual tr{border-bottom: 1px dotted #ccc; margin-top: 5px; padding-bottom: 5px; display: block;}
.ahorro_mensual td{font-size: 12px;}

.resultado_ahorro{float: right; width: 201px; height: 50px; padding: 15px; background: transparent url(../gral/images/fondo_resultado_ahorro.gif) no-repeat}
.resultado_ahorro p{text-align: right; width: 200px; margin-top: 10px;}

.comofunciona{padding: 10px;}
.comofunciona h1{ font-weight: bold; font-size: 22px;}
.comofunciona h2{ margin-top: 15px; font-weight: bold; font-size: 16px;}
.comofunciona p{padding:5px 0 10px ; font-size: 12px; line-height: 1.3em;}
.comofunciona ul{ margin-top: 10px; font-size: 12px;}
.comofunciona ul li{ padding: 3px 0;} 
.comofunciona .right{float: right;}
.right{float: right;}

#nc{ width: 40px; padding: 5px; border: solid 1px #CCC; background-color: #FFFFCC;}
.alerta{ height: 10px; padding-top:20px;}
.exito{ height: 280px; padding-top:100px;}

.txtc{ text-align: center;}
.centro{margin:0 auto;}
.azul{ background: #014665;}

.sugiere{width: 460px; margin: 0 auto; padding: 20px 10px 0px; font-size: 12px; color: #333;}
.sugiere h3{font-size: 19px; color: white; display: block; margin-bottom: 5px;}
.sugiere h4{font-size: 12px; display: block;}
.sugiere h4 strong{font-weight: bold;}
.sugiere label{font-weight: bold; width: 260px; display: block; margin-top: 20px;}
.sugiere input{width: 230px; height: 15px; padding: 4px; margin-top: 3px; border: 1px solid white; background: white url(../gral/images/fondo_input_clientes.gif) repeat-x top; font-size: 12px; font-family: Arial, Helvetica, sans-serif;}
.input_150{width: 160px!important; height: 18px; padding: 4px; margin-top: 3px; border: 1px solid white; background: white url(../gral/images/fondo_input_clientes.gif) repeat-x top;}

.contacto .error_nombre, .contacto .error_mail, .contacto .error_rut, .contacto .error_empresa, .contacto .error_tel, .contacto .error_dire{border: solid 1px #FF3333;} 

