/*
	CSS personalizado para 06 CONTACT
*/

/**************************************** GAMA DE COLORES ****************************************/

/*    Azul Oscuro: 017CBA rgb(  1,124,186) */
/*           Gris: 999999 rgb(153,153,153) */
/*     Azul Medio: 80BDDC rgb(128,189,220) */
/*     Azul Claro: BFDEED rgb(191,222,237) */
/* Azul Muy Claro: DFEEF6 rgb(223,238,243) */

/*   Verde Oscuro: 07B289 rgb(  7,178,137) */
/*    Verde Medio: 83D8C4 rgb(131,216,196) */
/*    Verde Claro: C1EBE1 rgb(193,235,225) */
/*Verde Muy Claro: E0F5F0 rgb(224,245,240) */

/************************************ MODIFICADOS DE syle-home ***********************************/

/****************************************** #rowContact ******************************************/

#rowContact .divContact { margin: auto; max-width: 980px; display: flex; flex-wrap: wrap; justify-content: space-between; }
#rowContact .divHeading { margin-bottom: 30px; width: 100%; text-align: left; }
#rowContact .divForm    { width: calc(100% - 380px); }
#rowContact .divDatos   { width: 300px; }

#rowContact .divHeading h3 { font-family: var(--font-family-narrow); font-weight: 500; color: var(--color1-hex); }

#rowContact .divFormCF7 .divFieldNombre       { width: calc(50% - 10px); }
#rowContact .divFormCF7 .divFieldApellidos    { width: calc(50% - 10px); }
#rowContact .divFormCF7 .divFieldMail         { width: calc(50% - 10px); }
#rowContact .divFormCF7 .divFieldOrganizacion { width: calc(50% - 10px); }
#rowContact .divFormCF7 .divFieldAsunto       { width: 100%; }
#rowContact .divFormCF7 .divFieldMensaje      { width: 100%; }
#rowContact .divFormCF7 .divFieldAcepto       { width: auto; }

#rowContact .divFormCF7 .divGrupoMensaje .divGrupoHeading:after { content: "\f069"; position: relative; top: -6px; margin-left: 4px; }
#rowContact .divFormCF7 .divGrupoMensaje .divGrupoHeading:after { font-family: "FontAwesome"; font-size: 10px; color: #FF0000; line-height: 100%; }

#rowContact .divDatos ul         { margin: 30px 0px 0px 30px; list-style-type: none; }
#rowContact .divDatos li         { margin: 0px 0px 15px 30px; font-size: 18px; line-height: 120%; }
#rowContact .divDatos li a       { color: var(--color1-hex) !important; }
#rowContact .divDatos li a:hover { color: var(--color3-hex) !important; }

@media (max-width: 1180px) { #rowContact .divContact { padding: 0px 20px; } }
@media (max-width: 1080px) { #rowContact .divForm    { width: calc(100% - 340px); } }

@media (max-width:  980px) {
	#rowContact .divForm                          { width: calc(100% - 280px); }
	#rowContact .divDatos                         { width: 240px; }
	#rowContact .divFormCF7 .divFieldNombre       { width: calc(50% - 5px); }
	#rowContact .divFormCF7 .divFieldApellidos    { width: calc(50% - 5px); }
	#rowContact .divFormCF7 .divFieldMail         { width: calc(50% - 5px); }
	#rowContact .divFormCF7 .divFieldOrganizacion { width: calc(50% - 5px); }
	#rowContact .divDatos ul                      { margin: 30px 0px 0px  0px; }
	#rowContact .divDatos li                      { margin: 0px 0px 10px 25px; font-size: 16px; }
}

@media (max-width:  780px) {
	#rowContact .divContact  { justify-content: center; }
	#rowContact .divForm     { width: 100%; }
	#rowContact .divDatos    { margin-top: 20px; width: 270px; }
	#rowContact .divDatos ul { margin: 30px 0px 0px 35px; }
}

@media (max-width:  580px) { #rowContact .divHeading  { margin-bottom: 20px; } #rowContact .divHeading h3 { font-size: 20px; } }

@media (max-width:  480px) {
	#rowContact .divContact  { padding: 0px; }
	#rowContact .divDatos ul { margin: 20px 0px 0px 35px; }
	#rowContact .divDatos li { font-size: 16px; }
}

@media (max-width:  380px) {
	#rowContact .divDatos                         { width: 100%; }
	#rowContact .divFormCF7 .divFieldNombre       { width: 100%; }
	#rowContact .divFormCF7 .divFieldApellidos    { width: 100%; }
	#rowContact .divFormCF7 .divFieldMail         { width: 100%; }
	#rowContact .divFormCF7 .divFieldOrganizacion { width: 100%; }	
	#rowContact .divDatos ul                      { margin: 20px auto 0px auto; display: table; }
	#rowContact .divDatos li                      { font-size: 14px; }
}

/******************************************** #rowMap ********************************************/

#rowMap .divMap { height: 400px; line-height: 0px; }

@media (max-width:  980px) { #rowMap .divMap { height: 380px; } }
@media (max-width:  780px) { #rowMap .divMap { height: 360px; } }
@media (max-width:  580px) { #rowMap .divMap { height: 340px; } }
@media (max-width:  480px) { #rowMap .divMap { height: 320px; } }
@media (max-width:  380px) { #rowMap .divMap { height: 300px; } }
