/*
	CSS personalizado para 07 CONTACT
*/

/**************************************** GAMA DE COLORES ****************************************/

/*      Azul Oscuro: 0087CB rgb(  0,135,203) */
/*             Gris: 999999 rgb(153,153,153) */
/*       Azul Medio: 7FC3E5 rgb(127,195,229) */
/*       Azul Claro: BFE1F2 rgb(191,225,242) */
/*   Azul Muy Claro: DFF0F8 rgb(223,240,248) */

/*     Verde Oscuro: 56AF31 rgb( 86,175, 49) */
/*      Verde Medio: AAD798 rgb(170,215,152) */
/*      Verde Claro: D4EBCB rgb(212,235,203) */
/*  Verde Muy Claro: E9F5E5 rgb(233,245,229) */

/*   Naranja Oscuro: EF7D29 rgb(239,125, 41) */
/*    Naranja Medio: F7BE94 rgb(247,190,148) */
/*    Naranja Claro: FBDEC9 rgb(251,222,201) */
/*Naranja Muy Claro: FDEEE4 rgb(253,238,228) */

/************************************ MODIFICADOS DE syle-home ***********************************/

/****************************************** #rowCabecera *****************************************/

#rowCabecera .divCabecera { background-image: url("/wp-content/uploads/header_contact.jpg?q=20220422"); }

/****************************************** #rowContact ******************************************/

#rowContact .divContact { margin: auto; max-width: 980px; display: flex; flex-wrap: wrap; justify-content: space-between; }
#rowContact .divHeading { margin-bottom: 20px; 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; }

#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       { border: none; }
#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: 0px 0px 0px 30px; list-style-type: none; }
#rowContact .divDatos li         { margin: 0px 0px 15px 30px; font-size: 20px; line-height: 120%; }
#rowContact .divDatos li a       { color: var(--color1-hex) !important; }
#rowContact .divDatos li a:hover { color: var(--color3-hex) !important; text-decoration: none; }

@media (max-width: 1180px) { #rowContact .divContact { padding: 0px 20px; } }

@media (max-width: 1080px) {
	#rowContact .divForm    { width: calc(100% - 340px); }
	#rowContact .divDatos   { width: 300px; }
}

@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: 0px; }
	#rowContact .divDatos li                      { margin: 0px 0px 10px 25px; font-size: 18px; }
}

@media (max-width:  780px) {
	#rowContact .divContact                 { justify-content: center; }
	#rowContact .divForm                    { width: 100%; }
	#rowContact .divFormCF7 .divGrupoSubmit { flex-direction: column; align-items: center; }
	#rowContact .divDatos                   { width: 300px; }
}

@media (max-width:  580px) { #rowContact .divHeading h3 { font-size: 20px; } }

@media (max-width:  480px) {
	#rowContact .divContact  { padding: 0px; }
	#rowContact .divDatos    { width: 240px; }
	#rowContact .divDatos ul { margin: 0px 0px 0px 15px; }
	#rowContact .divDatos li { font-size: 16px; }
}

@media (max-width:  380px) {
	#rowContact .divDatos                         { width: 200px; }
	#rowContact .divFormCF7 .divFieldNombre       { width: 100%; }
	#rowContact .divFormCF7 .divFieldApellidos    { width: 100%; }
	#rowContact .divFormCF7 .divFieldMail         { width: 100%; }
	#rowContact .divFormCF7 .divFieldOrganizacion { width: 100%; }	
	#rowContact .divDatos ul                      { margin: 0px; }
	#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; } }
