/*
	CSS personalizado para 03 CONTACTO
*/

/**************************************** GAMA DE COLORES ****************************************/

/*    Azul oscuro: 236089 rgb( 35, 96,137)*/
/*           Gris: 999999 rgb(153,153,153)*/
/*     Azul medio: 95A3BB rgb(149,163,187)*/
/*     Azul claro: CAD1DD rgb(202,209,221)*/
/* Azul muy claro: E4E8EE rgb(228,232,238)*/

/*           Azul: 4691B0 rgb( 70,145,176)*/
/*          Beige: E3C4A7 rgb(227,196,167)*/
/*        Magenta: 883848 rgb(136, 56, 72)*/

/************************************ MODIFICADOS DE syle-home ***********************************/

/****************************************** #rowContacto *****************************************/

#rowContacto .divContacto   { margin: auto; max-width: 1180px; }
#rowContacto .divHeading    { margin: 50px 0px 100px 0px; }
#rowContacto .divHeading h1 { color: #FFFFFF; border-bottom: solid 2px #FFFFFF; }

#rowContacto .divContenido { margin: 0px 30px 100px 30px; display: flex; }
#rowContacto .divForm      { margin-right: 30px; width: calc(50% - 30px); }
#rowContacto .divDatos     { margin-left:  30px; width: calc(50% - 30px); }

#rowContacto ul { margin: 0px !important; list-style-type: none; }
#rowContacto li { margin: 0px 0px 10px 0px; display: flex; align-items: flex-start; }
#rowContacto i  { margin-right: 10px; width: 40px; height: 40px; font-size: 30px; color: var(--colorAzul-hex); }
#rowContacto i  { background: #FFFFFF; display: flex; align-items: center; justify-content: center; }
#rowContacto .divForm .wpcf7-form-control-wrap { width: calc(100% - 50px); }

/* FORMULARIO */

#rowContacto .divForm input                 { padding: 0px 15px; width: 100%; height: 40px; }
#rowContacto .divForm input                 { font-size: 20px; color: #FFFFFF; background: none; border-radius: 0px; }
#rowContacto .divForm input::placeholder    { color: var(--color4-hex); }
#rowContacto .divForm textarea              { padding: 5px 15px; width: 100%; height: 120px; }
#rowContacto .divForm textarea              { font-size: 20px; color: #FFFFFF; background: none; border-radius: 0px; }
#rowContacto .divForm textarea::placeholder { color: var(--color4-hex); }

#rowContacto .divForm .liAcepto       { margin-left: 50px; font-size: 16px; color: #FFFFFF; align-items: center; }
#rowContacto .divForm .liAcepto span  { margin: 0px 10px 0px 0px; width: 18px; height: 18px; display: block; }
#rowContacto .divForm .liAcepto input { width: 18px; height: 18px; }
#rowContacto .divForm .liAcepto a     { margin-left: 5px; color: #FFFFFF; text-decoration: underline; }

#rowContacto .divForm .liSubmit              { position: relative; margin: 15px 0px 0px 50px; }
#rowContacto .divForm .liSubmit input        { font-weight: normal; color: var(--color1-hex); background: var(--colorBeige-hex); border: none; }
#rowContacto .divForm .liSubmit .ajax-loader { margin: 0px; position: absolute; top: 50%; right: 15px; transform: translateY(-50%); }

#rowContacto .divForm .liNota   { margin: 10px 0px 0px 50px; }
#rowContacto .divForm .liNota p { margin: 0px; font-family: var(--font-family-narrow); font-size: 10px; }
#rowContacto .divForm .liNota p { font-weight: 300; color: #FFFFFF; text-align: justify; line-height: 100%; }
#rowContacto .divForm .liNota a { color: #FFFFFF; text-decoration: underline; }

#rowContacto .divForm span[role="alert"]        { margin-top: 5px; font-family: var(--font-family-narrow); font-size: 13px; font-weight: 300; color: #FFFF66; }
#rowContacto .divForm span[role="alert"]:before { content: "\f071"; margin-right: 5px; font-family: "FontAwesome"; }

/* DATOS */

#rowContacto .divDatos li                         { font-size: 20px; color: #FFFFFF; }
#rowContacto .divDatos .liAt                      { margin-bottom: 0px; }
#rowContacto .divDatos p                          { margin: 6px 0px; }
#rowContacto .divDatos p span:first-of-type       { border-bottom: solid 1px #FFFFFF; }
#rowContacto .divDatos p span:last-of-type        { display: block; }
#rowContacto .divDatos .liProfesionales           { margin-left: 50px; display: block; }
#rowContacto .divDatos .liHorarios                { margin-left: 50px; display: block; }
#rowContacto .divDatos .liHorarios p:last-of-type { font-size: 16px; }
#rowContacto .divDatos .divRRSS                   { margin-top: 50px; }
#rowContacto .divDatos .divRRSS h3                { margin-bottom: 20px !important; padding-bottom: 10px; font-size: 20px; }
#rowContacto .divDatos .divRRSS h3                { color: #FFFFFF; border-bottom: solid 4px #FFFFFF; }
#rowContacto .divDatos .divRRSS a                 { display: inline-block; }
#rowContacto .divDatos a                          { color: #FFFFFF !important; }
#rowContacto .divDatos a:hover                    { color: var(--color4-hex) !important; }

@media (max-width: 980px) {
	#rowContacto .divHeading                          { margin: 40px 0px 60px 0px; }
	#rowContacto .divForm                             { margin-right: 20px; width: calc(50% - 20px); }
	#rowContacto .divDatos                            { margin-left:  20px; width: calc(50% - 20px); }
	#rowContacto i                                    { width: 30px; height: 30px; font-size: 20px; }
	#rowContacto .divForm .wpcf7-form-control-wrap    { width: calc(100% - 40px); }
	#rowContacto .divForm input                       { height: 30px; font-size: 16px; }
	#rowContacto .divForm textarea                    { height: 100px; font-size: 16px; }
	#rowContacto .divForm .liAcepto                   { margin-left: 40px; }
	#rowContacto .divForm .liSubmit                   { margin: 15px 0px 0px 40px; }
	#rowContacto .divForm .liNota                     { margin: 10px 0px 0px 40px; }
	#rowContacto .divDatos li                         { font-size: 16px; }
	#rowContacto .divDatos p                          { margin: 4px 0px; }
	#rowContacto .divDatos .liHorarios p:last-of-type { font-size: 14px; }
	#rowContacto .divDatos .liProfesionales           { margin-left: 40px; }
	#rowContacto .divDatos .liHorarios                { margin-left: 40px; }
}

@media (max-width: 780px) {
	#rowContacto .divContenido      { margin: 0px auto 60px auto; width: 90%; max-width: 400px; display: block; }
	#rowContacto .divForm           { margin-right: 0px; width: 100%; }
	#rowContacto .divDatos          { margin-left:  0px; width: 100%; margin-top: 40px; }
	#rowContacto .divHeading        { margin: 30px }
	#rowContacto .divDatos .divRRSS { margin-top: 40px; }
}

@media (max-width: 480px) {
	#rowContacto i                                    { width: 24px; height: 24px; font-size: 16px; }
	#rowContacto .divForm .wpcf7-form-control-wrap    { width: calc(100% - 34px); }
	#rowContacto .divForm input                       { padding: 0px 10px; height: 24px; font-size: 14px; }
	#rowContacto .divForm textarea                    { padding: 5px 10px; font-size: 14px; }
	#rowContacto .divForm .liAcepto                   { margin-left: 34px; font-size: 14px; }
	#rowContacto .divForm .liSubmit                   { margin: 15px 0px 0px 34px; }
	#rowContacto .divForm .liNota                     { margin: 10px 0px 0px 34px; }
	#rowContacto .divDatos li                         { font-size: 14px; }
	#rowContacto .divDatos p                          { margin: 2px 0px; }
	#rowContacto .divDatos .liHorarios p:last-of-type { font-size: 13px; }
	#rowContacto .divDatos .liProfesionales           { margin-left: 34px; }
	#rowContacto .divDatos .liHorarios                { margin-left: 34px; }
}

/******************************************** #rowMapa *******************************************/

@media (max-width: 980px) {	#rowMapa .divMapa iframe { height: 400px; } }
@media (max-width: 780px) {	#rowMapa .divMapa iframe { height: 360px; } }
@media (max-width: 580px) {	#rowMapa .divMapa iframe { height: 320px; } }
@media (max-width: 480px) {	#rowMapa .divMapa iframe { height: 300px; } }