/*
Theme Name: Divi Child - Eweb
Theme URI: http://www.elegantthemes.com/gallery/divi/
Template: Divi
Author: Elegant Themes
Author URI: http://www.elegantthemes.com
Description: Smart. Flexible. Beautiful. Divi is the most powerful theme in our collection.
Tags: responsive-layout,one-column,two-columns,three-columns,four-columns,left-sidebar,right-sidebar,custom-background,custom-colors,featured-images,full-width-template,post-formats,rtl-language-support,theme-options,threaded-comments,translation-ready
Version: 3.0.14.1477321393
Updated: 2016-10-24 15:03:13
Modified by Eweb Diseño y Posicionamiento Web para abogados
*/


/*

	COLORES:
		E7D649	amarillo

*/


/*
						NAVEGACIÓN
*/

/*****Cambiar el tamaño del submenú*****/
	.nav li ul {
  		/*width:300px !important;*/
	}

/*****Cambiar el tamaño del ítem del submenú*****/
	#top-menu li li a, #menu-principal li li a{
  		/*width:260px !important;*/
	}

/*****Corección del color del enlace activo*****/
#top-menu li.current-menu-item>a, #top-menu li.current_page_item>a {
	color: #e7d649 !important;
}

/*****Corección del color del menú al hacer scrolling*****/
	.et-fixed-header ul#top-menu li a {
		color: #3f3f3f !important;
	}

/*****Modificación del tamaño del logo y color de la hamburguesa en móvil*****/
@media (max-width: 980px) {
	#logo {
		max-height: 100% !important;
	}

	.mobile_menu_bar:before {
		color: #000 !important;
	}
}

/*****modificación del submenú en móvil*****/
	#main-header .et_mobile_menu {
		background-color: #fff !important;
		border-color: #000 !important;
	}

	.et_mobile_menu li a{
		color: #666 !important;
	}


/*
                        CUERPO
*/

/*****Alineación horizontal de los elementos en una fila*****/
	.horizontal-align { 
    	display: flex; 
    	flex-direction: column; 
    	justify-content: center;
	}

/*****Modificación del formulario básico de CF7*****/
	.et_pb_contact p input, .et_pb_contact p textarea {
		border: 2px solid #e5e5e5 !important;
		background-color: transparent !important;
	}

	.wpcf7 span {
		font-weight:550 !important;
	}

	.wpcf7 ::-webkit-input-placeholder { /* WebKit, Blink, Edge */
	    font-weight:550 !important;
	    color: #030104 !important;
	}

	.wpcf7 :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	   opacity:  1;
	   font-weight:550 !important;
	   color: #030104 !important;
	}

	.wpcf7 ::-moz-placeholder { /* Mozilla Firefox 19+ */
	   opacity:  1;
	   font-weight:550 !important;
	   color: #030104 !important;
	}

	.wpcf7 :-ms-input-placeholder { /* Internet Explorer 10-11 */
	   font-weight:550 !important;
	   color: #030104 !important;
	}

	.wpcf7o::-ms-input-placeholder { /* Microsoft Edge */
	   font-weight:550 !important;
	   color: #030104 !important;
	}
	
	.wpcf7 .et_pb_button {
		background-color: #000 !important;
		border:2px solid  #000 !important;
		color: #fff !important;
	}

	.wpcf7 .et_pb_button:hover {
		background-color: transparent !important;
		border:2px solid  #000 !important;
		color: #000 !important;
	}

/*****Mejora diseño de los select*****/
	.wpcf7-select {
		border: 2px solid #e5e5e5 !important;
		font-size: 14px !important;
		width:100% !important;
		padding: 15px !important;
	}

/*****Eliminar el fallo que se produce en el botón de envío del formulario*****/
	.wpcf7-submit:hover {
		padding: 0.3em 1em !important;
	}


/*
						PIE DE PÁGINA
*/

	#footer-bottom .container {
		max-width: 100%;
	}

/*****Resaltar enlaces interéss*****/
	.et_pb_widget a:hover {
		color: #E7D649 !important;
	}

/*****Resaltar enlaces footer*****/
	#footer-info a:hover {
  		color: #fff!important;
	}

	.et-social-google-plus a:hover {
		color: #d51f1e !important;
	}

	.et-social-facebook a:hover {
		color: #3b5998 !important;
	}

	.et-social-twitter a:hover {
		color: #1da1f2 !important;
	}

	.et-social-instagram a:hover {
		color: #F5458F !important;
	}

	.et-social-linkedin a:hover {
		color: #0963BC !important;
	}

/*Mover Recaptcha a la izquierda*/
.grecaptcha-badge {
width: 70px !important;
overflow: hidden !important;
transition: all 0.3s ease !important;
left: -2px !important;
bottom: 20px !important;
}
.grecaptcha-badge:hover {
width: 256px !important;
}



/* CARRUSEL */

/*-----------------------------------------------*/ 
/*-----Carrusel de imágenes (o módulos) en Divi----*/ 
/*-----------------------------------------------*/
/*Opciones del carrusel, ajusta testos valores segun necesites*/
:root {
    --ds-module-number: 16; /*Numero total de módulos 8+8=16*/
    --ds-columns-desktop: 6; /*número de módulos que se verán a la vez en escritorio*/
    --ds-columns-tablet: 4; /*número de módulos que se verán a la vez en tablet*/
    --ds-columns-mobile: 2; /*número de módulos que se verán a la vez en moviles*/
    --ds-speed-desktop: 30s; /*velocidad de animación en ordenadores (escritorio)*/
    --ds-speed-tablet: 30s; /*velocidad de animación en tablets)*/
    --ds-speed-mobile: 30s; /*velocidad de animación en móviles*/
}
/**************************************************/
/*No es necesario editar nada debajo de esta línea */
/**************************************************/
/*Variables para escritorio*/
@media all and (min-width: 981px) {
    :root {
        --ds-column-width: auto;
        --ds-module-width: calc(100vw / var(--ds-columns-desktop));
        --ds-column-animation: calc(var(--ds-module-width) - (var(--ds-module-width) * 2));
        --ds-scroll-speed: var(--ds-speed-desktop);
    }
}
/*Variables para tablets*/
@media all and (max-width: 980px) {
    :root {
        --ds-column-width: auto;
        --ds-module-width: calc(100vw / var(--ds-columns-tablet));
        --ds-column-animation: calc(var(--ds-module-width) - (var(--ds-module-width) * 2));
        --ds-scroll-speed: var(--ds-speed-tablet);
    }
}
/*Variables para móvil*/
@media all and (max-width: 479px) {
    :root {
        --ds-module-width: calc(100vw / var(--ds-columns-mobile));
        --ds-scroll-speed: var(--ds-speed-mobile);
    }
}
/*Ocultar el desbordamiento de fila*/
.ds-carousel {
    overflow: hidden;
}
/*Define la cuadrícula y aplica animación */
.ds-carousel .et_pb_column {
    display: grid;
    grid-template-columns: repeat(var(--ds-module-number), var(--ds-module-width));
    width: var(--ds-column-width);
    -webkit-animation: scroll var(--ds-scroll-speed) linear infinite;
    animation: scroll var(--ds-scroll-speed) linear infinite;
}
/*Aplica el ancho del módulo */
.ds-carousel .et_pb_module {
    width: var(--ds-module-width) !important;
}
/*Define la animación*/
@-webkit-keyframes scroll {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
    100% {
        -webkit-transform: translateX(calc(var(--ds-column-animation) * (var(--ds-module-number) / 2)));
        transform: translateX(calc(var(--ds-column-animation) * (var(--ds-module-number) / 2)));
    }
}
@keyframes scroll {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
    100% {
        -webkit-transform: translateX(calc(var(--ds-column-animation) * (var(--ds-module-number) / 2)));
        transform: translateX(calc(var(--ds-column-animation) * (var(--ds-module-number) / 2)));
    }
}
/*Detener la animación on hover*/
.ds-carousel .et_pb_column:hover {
    -webkit-animation-play-state: paused;
    animation-play-state: paused;
}
/*-----------------------------------------------*/ 
/*---Carrusel de imágenes (o módulos) en Divi--*/ 
/*-----------------------------------------------*/
 
/*Opciones del carrusel, ajusta estos valores según necesites*/
:root {
    --ds-module-number: 16; 
    --ds-columns-desktop: 6; 
    --ds-columns-tablet: 4; 
    --ds-columns-mobile: 2; 
    --ds-speed-desktop: 30s; 
    --ds-speed-tablet: 30s; 
    --ds-speed-mobile: 30s;
}

/* ESTILO POPUP */

.popup-auto {
  display: block;
  position: relative;
  margin: 1.5rem auto 0 1.5rem; /* centrado con margen izquierdo */
  z-index: 1;
  background: transparent;
  max-width: 100%;
  box-sizing: border-box;
}

.popup-auto .popup-inner p{
	font-weight:300!important;
	color:#333333!important;
	text-align:justify!important;
	
}

.popup-inner {
  background: #e7d649;
  padding: 1rem 1.5rem;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
  border-radius: 10px;
  font-size: 0.95rem;
  max-width: 340px;
  width: 100%;
  box-sizing: border-box;
  position: relative;
}

.cerrar-popup {
  position: absolute;
  top: 8px;
  right: 10px;
  background: none;
  border: none;
  font-size: 1.2rem;
  font-weight: bold;
  color: #333;
  cursor: pointer;
  transition: color 0.3s ease;
}

.cerrar-popup:hover {
  color: #e60000;
}

.boton-contactar {
  display: inline-block;
  margin-top: 0.75rem;
  padding: 0.6rem 1rem;
  background-color: #000000;
  color: #fff;
  font-size: 0.95rem;
  font-weight: 600;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  text-decoration: none;
  transition: background-color 0.3s ease, transform 0.2s ease;
}

.boton-contactar:hover {
  background-color: #ffffff;
  color: #000000;
  transform: scale(1.05);
}

/* RESPONSIVE */
@media (max-width: 480px) {
  .popup-auto {
    margin: 1rem;
  }

  .popup-inner {
    max-width: 100%;
    font-size: 0.9rem;
    padding: 1rem;
  }

  .boton-contactar {
    width: 100%;
    text-align: center;
  }
}

/* WHATSAPP */
.whatsapp-float {
  position: fixed;
  bottom: 20px;
  right: 20px;
  background-color: #25D366;
  color: white;
  font-size: 28px;
  padding: 14px 16px;
  border-radius: 50%;
  box-shadow: 0 2px 10px rgba(0,0,0,0.2);
  z-index: 9999;
  transition: transform 0.3s ease;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

.whatsapp-float:hover {
  transform: scale(1.1);
}

/* Tooltip */
.whatsapp-tooltip {
  position: absolute;
  right: 60px;
  top: 50%;
  transform: translateY(-50%);
  background-color: #444;
  color: #fff;
  padding: 6px 10px;
  border-radius: 6px;
  white-space: nowrap;
  font-size: 13px;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, right 0.3s ease;
  pointer-events: none;
  z-index: 10000;
}

.whatsapp-float:hover .whatsapp-tooltip {
  opacity: 1;
  visibility: visible;
  right: 70px;
}

