/* CSS Document */

div#contacto_izquierda { float: left; width: 70%; margin-top: 20px; padding-right: 20px; }
div#contacto_derecha { float: left; width: 30%; margin-top: 20px; }

p.telefono, p.email, p.direccion { border-radius: 4px; float: left; margin: 10px; background-color: #3C4ACC; color: #ddd; padding: 10px; font-size: 1.1em; text-indent: 0px; }
p.telefono a, p.email a { color: inherit; text-decoration: none; }
	p.telefono a:hover, p.email a:hover { color: white; text-decoration: underline; }


div#contacto_derecha h2 { text-transform: uppercase; font-size: 1.1em; }
div#contacto_derecha em { font-size: 0.75em; }


label { color: #ddd; font-size: 0.9em; }
input[type=text], input[type=email], input[type=tel], textarea {  border-radius: 4px; width: 100%; margin: 5px 0px; margin-top: 2px; border: none; color: #313131; padding: 5px; background-color: #9CDAEC; }
textarea { height: 100px; }
input[type=submit] { border-radius: 4px; margin: 10px 0px; cursor: pointer; width: auto; padding: 10px 20px; float: left; font-weight: bold; background-color: #3C4ACC; color: #9CDAEC; border: none; }
	input[type=submit]:hover { background-color: white; color: #313131; }

p.error { color: #C00; font-size: 0.95em; padding-bottom: 10px; }


@media screen and (max-width: 750px){
	div#contacto_derecha { float: left; width: 300px; clear: both; }
	div#contacto_izquierda { float: none; width: 100%; padding-right: 0px; }
}
@media screen and (max-width: 400px){
	div#contacto_derecha { float: left; width: 100%; clear: both; }
}