/* ------------------------------------------------------------------------------------------------------------------ */
/* corpo */

div#contacts { display: block; position: relative; width: 100%; margin: 0 auto; padding: 0; background: transparent url(../src/img/contacts_bg.jpg) no-repeat center center; background-size: cover; }
div#contacts
{
	min-height: 600px;
	min-height: -webkit-calc( 100vh - 100px - 194px );
	min-height:    -moz-calc( 100vh - 100px - 194px );
	min-height:         calc( 100vh - 100px - 194px );
}
	div#contacts div.container { display: block; position: relative; width: 300px; margin: 0 auto; padding: 50px 0; text-align: left; }


/* ------------------------------------------------------------------------------------------------------------------ */
/* titulo, texto e separador */

div#contacts h1 { display: block; position: relative; font-family: 'bold1', sans-serif; font-size: 16px; color: #ffffff; margin: 0 0 10px 0; line-height: 20px; }
div#contacts h2 { display: block; position: relative; font-family: 'bold1', sans-serif; font-size: 14px; color: #ffffff; line-height: 20px; }
div#contacts p { display: block; position: relative; font-size: 12px; color: #ffffff; line-height: 15px; margin: 0 0 10px 0; }
div#contacts span.separator { display: block; position: relative; width: 100px; height: 3px; border: none; background-color: #ffffff; margin: 25px 0 10px 0; }


/* ------------------------------------------------------------------------------------------------------------------ */
/* paises */

div#contacts div.countries { display: block; position: relative; width: 100%; }
	div#contacts div.countries h2 { display: block; position: relative; font-family: 'bold1', sans-serif; font-size: 14px; color: #ffffff; margin: 15px 0 5px 0; line-height: 20px; }
	div#contacts div.countries p { display: block; position: relative; font-size: 14px; color: #ffffff; margin: 0; line-height: 20px; padding: 0 0 0 10px; cursor: default; }
	div#contacts div.countries p.representations { cursor: pointer; }
	div#contacts div.countries p.representations:hover { text-decoration: underline; }
		div#contacts div.countries p span { display: none; position: absolute; top: 5px; left: 50px; font-size: 12px; line-height: 20px; background-color: #ffffff; padding: 5px 10px; border: 1px solid #2261A5; border-radius: 10px; z-index: 100; }
		div#contacts div.countries p:hover span { display: block; }


/* ------------------------------------------------------------------------------------------------------------------ */
/* formulario */

div#contacts form { display: block; position: relative; width: 100%; margin: 0 auto; padding: 0; text-align: left; font-size: 0; }
	div#contacts form label { display: inline-block; position: relative; width: 100%; text-align: left; margin: 0 0 5px 0; font-size: 12px; line-height: 20px; color: #ffffff; }
	div#contacts form label.left { display: inline-block; width: 145px; margin: 0 5px 0 0; }
	div#contacts form label.right { display: inline-block; width: 145px; margin: 0 0 0 5px; }
		div#contacts form p { display: inline-block; position: relative; width: 100px; vertical-align: top; line-height: 20px; text-align: right; margin: 0 15px 0 0; font-size: 13px; }
		div#contacts form input[type="text"] { display: inline-block; position: relative; width: 100%; vertical-align: top; height: 20px; line-height: 20px; font-size: 12px; border: none; margin: 0; padding: 0; background-color: #ffffff; }
		div#contacts form input[type="text"].captcha { width: 224px; margin: 0 7px 0 0; }
		div#contacts form img.captcha { display: inline-block; position: relative; width: 65px; height: 20px; padding: 0; margin: 0; }
		div#contacts form textarea { display: inline-block; position: relative; width: 100%; vertical-align: top; height: 40px; line-height: 20px; font-size: 12px; border: none; margin: 0; padding: 0; resize: none; background-color: #ffffff; }
		div#contacts form input[type="submit"] { display: block; position: relative; width: auto; height: 24px; line-height: 24px; margin: 0; padding: 0 75px; border: none; background-color: #ffffff; cursor: pointer; font-size: 14px; color: #2162a5; }
		div#contacts form input[type="submit"]:hover { background-color: #2162a5; color: #ffffff; }

		div#contacts form p.terms { display: block; position: relative; font-size: 10px; line-height: 15px; margin: 0 0 15px 0; width: auto; text-align: left; }
			div#contacts form p.terms a { display: inline-block; position: relative; font-size: 10px; line-height: 15px; text-decoration: none; }
			div#contacts form p.terms a:hover { color: #59bad5; }


/* ------------------------------------------------------------------------------------------------------------------ */