/* -------------------------------------------------------------------------------------------------------------*/
/* ------->>> TPL CUSTOM FORM <<<------------------------------------------------------------------------------*/
/* -----------------------------------------------------------------------------------------------------------*/

/*
Proceso Contacto Personalizada

Inserta un formulario personalizado de contacto en la cual el cliente
puede insertar los campos deseados.
*/
#contents { width:754px; padding: 10px 10px 10px 20px;}
#contents h1 {
float: left; width:288px; margin:10px 0 20px; padding:0 0 22px; background:url(../images/backgrounds/pattern_contacth1.gif) no-repeat bottom right;}

/*Párrafo de introducción */

#contents p { width: 288px;}
div.text_container { float:left; width: 275px; clear: left;}

/* Contenedor de todos los campos del formulario */

#contact_content form { float:right; width: 414px; margin: -66px 0 0 0; padding:20px; background: url(../images/backgrounds/bg_contact.gif) bottom right no-repeat #303538; overflow:hidden;}

/* Contenedor de las dos partes del formulario, una la de los campos personalizados
y otra la de los distintos remitentes del formulario */

#contact_content fieldset {  }

#contact_content fieldset.deliver_to { margin: 15px 0 0; padding:0; float:left; width:408px;}

/* Título de cada uno de los contenedores */

fieldset.contact legend { display: none; }

#contents fieldset.deliverto legend { float:left; width:100%; margin: 10px 0 10px; font-size: 11px; font-weight: bold; padding: 0; color: #cccccc; }

/* Elementos del formulario */

#contents input, #contents textarea, #contents select { margin-top: 5px; background: #666666; border:none; color:#cccccc; }

#contents label { color: #cccccc; font-weight: bold; display: block; float: left; margin: 0 0 10px; width: 100%; text-align: left; font-size:11px; }
#contents label input {	float: left; width: 408px; margin: 5px 0 5px; }
#contents label select { float: left; width: 414px; padding: 1px; }
#contents label textarea { overflow: auto; width: 408px; height: 108px; padding: 3px; }

/* Avisos legales */

#contact_content .legal { float:left; width:305px; padding:0 20px 0 0; margin:10px 0 0 0; border-right: 1px solid #666666;  }
#contents .legal p { font-size: 10px; color: #999999; text-align: left; line-height:normal; }

/* Captcha */
#contents #contact_content .captcha { float:left; width:240px; margin: 15px 0 0; height:89px; }
#contents #contact_content .captcha a {
	background:transparent url(../images/captcha_a.gif) no-repeat scroll 0 2px;
	border:0 none;
	color:#cccccc;
	margin:28px 0 9px 9px;
	padding:0 0 0 19px;
	width:auto;
	text-decoration:none;
	}
#contents #contact_content .captcha a:hover { color:#ffffff;} 
#contents #contact_content .captcha label {  width:280px; padding: 0; margin: 10px 0 0; }
#contents #contact_content .captcha label input { float:left; width:280px; padding: 3px;}

#contents #contact_content .captcha img { border: 1px solid #666666; padding:0; width:auto; margin:0 0;}
/* Botones */

div.buttons { margin:85px 0 0; float:right; width:123px;}

.button {  }

button { font-size:11px; color:#fe6533; background: url(../images/ico_send.gif) 0 2px no-repeat; padding: 2px 5px 2px 15px; border:1px solid #666666;}
button.clear {  background: url(../images/ico_cancel.gif) 0 2px no-repeat; }

button:hover { font-size:11px; color:#cccccc; padding: 2px 5px 2px 15px; border:1px solid #666666;}
button.clear:hover {  color:#cccccc; }
/*******
Estilos especiales
*******/

/* Estilos para los grupos que sean checkboxs */

#contents label.cf_checkbox { font-weight: 400; float:left;}
#contents label.cf_checkbox input { clear: left; float: left; width: 20px; margin: 0;  }

/* Estilos para las selecciones múltiples */

#contents ul.cf_multiple { list-style: none; margin: 0 0 10px; padding: 10px 10px 0; float: left; width:392px; background:#666666;}
#contents ul.cf_multiple li { float: left; clear: both; font-weight: 400; color:#fff; width:390px; }
#contents ul.cf_multiple li label { font-weight: 400; font-size: 11px; color:#fff; margin:0; }

#contents label.cf_multiops { cursor: pointer; }
#contents label.cf_multiops input { float: left; width: 20px; margin: 0; }

/* Estilos para la selección de archivo adjunto */

#contents label.cf_file{ cursor: pointer; clear: both; }
#contents label.cf_file input { float: left; width: 400px; margin: 5px 0 0; }

/* Estilos para los distintos remitentes múltiples */

#contents ul.cf_deliverto_list { list-style: none; float: left; margin: 0; padding: 10px 10px 0; float: left; width:392px; background:#666666; }
#contents ul.cf_deliverto_list li { float: left; clear: both; }
#contents ul.cf_deliverto_list li label { font-weight: 400; font-size: 11px; color:#fff; margin:0; width:390px; }

#contents label.cf_deliverto { cursor: pointer; float:left; width:100px;}
#contents label.cf_deliverto input { float: left; width: 20px; margin: 0; }

/*Estilos para eliminar los bordes y el fondo de los radio y los checkboxs en ie*/

#contents label.cf_multiops input, #contents label.cf_deliverto input, #contents label.cf_checkbox input { border: none; background: none; } 
#contents .deliverto { float:left; padding:0; width:397px;}


#contents #contact_content fieldset ul li { list-style-image: none; margin: 0 0 10px; background:none; padding:0; }
#contents #contact_content fieldset ul { padding: 10px; }