@charset "utf-8";
/* Author: Danny Yataco */

#contenedorcontacto{
	width:920px;
	background:url(../imagenes/pie-index-2.png);
	margin:0 auto;
	padding:0;
}

#contenedorenviado{
	width:920px;
	height:900px;
	background:url(../imagenes/pie-index-2.png);
	margin:0 auto;
	padding:0;
}

#formulario{
	width:580px;
	height:385px;
	padding-top:15px;
	margin:0 auto;
	margin-bottom:30px;
	background-color:#666666;
	border-radius:10px;
	-o-border-radius:10px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
}

#mapa{
	width:580px;
	height:385px;
	padding:0;
	display:block;
	margin:0 auto;
	margin-top:30px;
	margin-bottom:30px;
}


.rotulo{
	width:100px;
	padding-top:12px;
	padding-bottom:12px;
	padding-right:10px;
	margin-right:20px;
	float:left;
	font-family: 'Oswald', sans-serif;
	font-size:16px;
	text-align:right;
	color:#FFFFFF;
}

.campos{
	width:420px;
	padding:8px 5px;
	float:left;
	color:#FFFFFF;
	display:block;
	margin-bottom:0;
}


input{
	width:380px;
	height:30px;
	font-size:16px;
	color:#371B1A;
	margin-right:4px;
	border-radius:5px;
	-moz-border-radius:5px;
	-o-border-radius:5px;
	-ms-border-radius:5px;
	-webkit-border-radius:5px;
}

.boton{
	width:128px;
	height:42px;
	margin-top:4px;
	background:url(../imagenes/boton-form.png);
	color:#371B1A;
	font-weight:bold;
	border:none;
	font-size:16px;
	cursor:pointer;
}



textarea{
	width:360px;
	height:75px;
	font-size:16px;
	border:2px solid #FFFFFF;
	background-color:#FCDB96;
	padding:10px;
}

[required]{
	border:#F8AB07 2px solid;
}

:invalid{
	background:#FFFFFF;
}

#enviado{
	width:300px;
	height:150px;
	margin:0 auto;
	margin-top:25px;
}

@media only screen and (max-width: 800px){

#contenedorcontacto{
	width:780px;
}

#contenedorenviado{
	width:780px;
	height:850px;
}

}

@media only screen and (max-width: 720px){

#contenedorcontacto{
	width:700px;
}

#contenedorenviado{
	width:700px;
	height:850px;
}

}

@media only screen and (max-width: 600px){

#mapa{
	width:500px;
}

#contenedorcontacto{
	width:580px;
}

#contenedorenviado{
	width:580px;
	height:750px;
}

#formulario{
	width:500px;
	height:385px;
}

.rotulo{
	width:80px;
}


.campos{
	width:380px;
}

input{
	width:350px;
}

textarea{
	width:340px;
}

}

@media only screen and (max-width: 480px){

#mapa{
	width:400px;
}

#contenedorcontacto{
	width:460px;
}

#contenedorenviado{
	width:460px;
	height:650px;
}

.rotulo{
	width:80px;
	float:none;
}

.campos{
	width:350px;
	float:none;
}

input{
	width:320px;
}

#formulario{
	width:380px;
	height:542px;
	margin-top:10px;
	padding-top:8px;
	padding-left:20px;
}

textarea{
	width:320px;
}

}

@media only screen and (max-width: 400px){

#mapa{
	width:340px;
}

#contenedorcontacto{
	width:380px;
}

#contenedorenviado{
	width:380px;
	height:650px;
}

.campos{
	width:330px;
	float:none;
}

input{
	width:300px;
}

textarea{
	width:300px;
}

#formulario{
	width:340px;
	height:542px;
	margin-top:10px;
	padding-top:8px;
	padding-left:15px;
}

}

@media only screen and (max-width: 320px){

#contenedorcontacto{
	width:300px;
}

#formulario{
	width:280px;
	height:600px;
}

.campos{
	width:200px;
	float:none;
}

input{
	width:230px;
}
#mapa{
	width:290px;
}

textarea{
	width:250px;
}

}