@charset "utf-8";
/* Medios fluidos sencillos
   Nota: Los medios fluidos exigen la eliminación de los atributos de altura y anchura de los medios del código HTML
   http://www.alistapart.com/articles/fluid-images/ 
*/
img, object, embed, video {
	max-width: 100%;
}
/* IE 6 no admite max-width (anchura máxima), por lo que usa de manera predeterminada una anchura del 100% */
.ie6 img {
	width:100%;
}

/*
	Propiedades de cuadrícula fluida de Dreamweaver
	----------------------------------
	dw-num-cols-mobile:		5;
	dw-num-cols-tablet:		8;
	dw-num-cols-desktop:	10;
	dw-gutter-percentage:	25;
	
	Inspiración obtenida de "Responsive Web Design" de Ethan Marcotte 
	http://www.alistapart.com/articles/responsive-web-design
	
	y Golden Grid System de Joni Korpi
	http://goldengridsystem.com/
*/

/* Diseño móvil: 480 px e inferior. */
.bgFormularioServicio{
	width:100%;
	margin:auto;
	padding-top:3em;
	padding-bottom:3em;
	overflow:hidden;
}

.tituloFormularioServicio{
	color:#555;
	font-family:armata, Verdana, Geneva, sans-serif;
	text-transform:uppercase;
	font-size:1.2em;
	text-align:center;
	margin-top:0em;
	margin-bottom:1.2em;
	padding-top:0;

}
.tituloFormularioServicio IMG{
	width:1.5em;
}

.formularioServicio{
	clear:both;
	float:left;
	width:100%;
	display:block;
}

#formulario {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}

#formulario H1 {
	font-family:gabriela, Verdana, Geneva, sans-serif;
	font-size:30px;
	line-height:1.2;
	text-align:center;
	border-bottom:1px solid #000;
	padding-bottom:10px;
}

#formulario P {
	font-family:armata, Verdana, Geneva, sans-serif;
	text-align:center;
}

.verif{display:none;}

#contact_form { 
    text-shadow:0 1px 0 #FFF;
    border-radius:4px;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    background:#F9F9F9;
    padding:25px;
     
}
 
 
label { 
    cursor:pointer;
    margin:4px 0;
    color:#900;
    display:block;
	text-align:center;
	font-family:armata, Verdana, Geneva, sans-serif;
	font-size:1em;
}
.etiqueta{
    cursor:pointer;
    margin:4px 0;
    color:#900;
    display:block;
	text-align:center;
	font-family:armata, Verdana, Geneva, sans-serif;
	font-size:1em;
}
 
input, textArea { 
    display:block;
    width:90%;
    border-radius:4px;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    background-color: #FFF;;
    color:#000;
    border:1px solid #5f5f5f;
    padding:10px;
    margin-bottom:15px;
	margin-left:auto;
	margin-right:auto;
}

select {
    border-radius:4px;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    background-color:#FFF;
    color:#000;
    border:1px solid #5f5f5f;
    padding:10px;
    margin-bottom:15px;
}

.fecha { text-align:center;} 

.EnviarButton{
	display:block;
	padding-left:20px;
	padding-right:20px;
	margin-right:auto;
	margin-left:auto;
	width:auto;
	background:#F00;
	color:#FFF;
}
.EnviarButton:hover{background:#000;}

#DatosContacto{
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	font-family:armata, Verdana, Geneva, sans-serif;
	text-align:center;
	border-top:5px solid #999;
	margin-top:30px;
	margin-bottom:30px;
}

#DatosContacto H2 {
	font-family:gabriela, Verdana, Geneva, sans-serif;
	font-size:30px;
}

#DatosContacto IMG {display:inline;}

/* Diseño tableta: de 481 px a 768 px. Hereda estilos de: Diseño móvil. */

@media only screen and (min-width: 481px) {

#formulario {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#DatosContacto {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
}

/* Diseño escritorio: de 769 px hasta un máximo de 1232 px.  Hereda estilos de: Diseño móvil y Diseño tableta. */

@media only screen and (min-width: 769px) {
.bgFormularioServicio{
	margin:auto;
}
.formularioServicio{
	clear:none;
	float:left;
	width:50%;
	display:inline;
}
.tituloFormularioServicio{
	font-size:2em;
	text-align:center;
	margin-top:0.7em;
	margin-bottom:1.5em;
}	
#formulario {
	clear: both;
	float: left;
	margin-left: 0;
	width: 59.1836%;
	display: block;
}

#formulario H1, #formulario P {
	text-align:left;
	width:95%;
}

label {
	text-align:left;
	clear:both;
	font-weight:normal;
}

input, textArea {
	text-align:left;
	margin-left:0;
	width:90%;
}

.etiqueta {text-align:left;
	font-weight:normal;
	margin-top:2px;
	margin-bottom:2px;
}


select{
	float:left;
	margin-right:15px;	
}

#DatosContacto{
	clear: none;
	float:right;
	margin-left: 2.0408%;
	width: 36.7755%; /* 36.7755%; */
	display: block;
	border:5px solid #CCC;
	border-radius:10px;
	background:#EEE;
	text-align:left;
}

#DatosContacto H2 {
	text-align:center;
}

#DatosContacto P {
	padding-left:15px;
	padding-right:15px;
}


}