/*
  Theme Name: eBusiness
  Theme URL: https://bootstrapmade.com/ebusiness-bootstrap-corporate-template/
  Author: BootstrapMade.com
  License: https://bootstrapmade.com/license/
*/

/*-----------------------------------------------------------------------------------
   CSS INDEX
  ===================

  1. Theme Default CSS (body, link color, section etc)
  2. Header Area
   2.1 Stick menu Area
  3. About Area
  4.Services Area
  5.Skill Area
  6.Faq Area
  7.Wellcome Area
  8.Team Area (Comentado en el original, no incluido en la optimización)
  9.Review Area (Comentado en el original, no incluido en la optimización)
  10.Portfolio Area (Comentado en el original, no incluido en la optimización)
  11. Pricing Table (Comentado en el original, no incluido en la optimización)
  11-a. Competence Area
  12. Testimonials area
  13. Review Area (Duplicado de 9, no incluido en la optimización)
  14. Quote area (Comentado en el original, no incluido en la optimización)
  15.Footer Area
  16.Home Page-2 Area
  17.Home Page 3  CSS
  18.Blog CSS (Comentado en el original, no incluido en la optimización)
  19.Blog Details CSS (Comentado en el original, no incluido en la optimización)

-----------------------------------------------------------------------------------*/

/*----------------------------------------*/
/* 1.  Theme default CSS
/*----------------------------------------*/

html, body {
	height: 100%;
	margin: 0;
	padding: 0;
}

.floatleft {
	float: left;
}

.floatright {
	float: right;
}

.alignleft {
	float: left;
	margin-right: 15px;
	margin-bottom: 15px;
}

.alignright {
	float: right;
	margin-left: 15px;
	margin-bottom: 15px;
}

.imgFaq-right {
	height: 100%;
	float: right;
	display: inline-block;
	padding-right: 0;
}

.aligncenter {
	text-align: center;
	display: block;
	margin: 0 auto 15px;
}

a:focus {
	outline: 0px solid;
}

img {
	max-width: 100%;
	height: auto;
}

.fix { /* Corregido de 'fix' a '.fix' */
	overflow: hidden;
}

p {
	margin: 0 0 0px;
	color: #000;
	font-family: "Open Sans", sans-serif;
	text-align: left;
	font-weight: 500;
	margin-bottom: 0.5em;
}

ul {
    list-style-type: none; /* Elimina los estilos predeterminados */
    padding-left: 0;
}

li > b::before {
	list-style-type: none;
    content: "✔ "; /* Puedes cambiar esto por otro símbolo o icono */
    color: #007bff; /* Color del icono o marcador */
    font-weight: bold;
    margin-right: 8px;
}

li > b {
    font-weight: bold !important;
}

h1, h2, h3, h4, h5, h6 {
	font-family: 'Raleway', sans-serif;
	margin: 0 0 15px;
	color: #444;
	font-weight: 500;
}

h1 {
	font-size: 48px;
	line-height: 50px;
}

h2 {
	font-size: 38px;
	line-height: 40px;
}

h3 {
	font-size: 30px;
	line-height: 32px;
}

h4 {
	font-size: 24px;
	line-height: 26px;
}

h5 {
	font-size: 16px;
	line-height: 22px;
	font-family: "Open Sans", sans-serif;
	text-align: justify;
}

h6 {
	font-size: 16px;
	line-height: 20px;
}

a {
	transition: all 0.3s ease 0s;
	text-decoration: none;
}

a:hover { /* Consolidado */
	color: #3EC1D5;
	text-decoration: none;
}

a:active, a:focus { /* Consolidado */
	outline: 0 none;
}

body {
	background: #fff none repeat scroll 0 0;
	color: #FFF;
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	text-align: left;
	overflow-x: hidden;
	line-height: 22px;
	padding-top: 0; /* igual a la altura de .header-area inicial */
}

/* Back to top button */
.back-to-top {
	position: fixed;
	display: none;
	background: #3EC1D5;
	color: #fff;
	padding: 6px 12px 9px 12px;
	font-size: 16px;
	border-radius: 2px;
	right: 15px;
	bottom: 15px;
	transition: background 0.5s;
}
@media (max-width: 768px) {
    .back-to-top {
        bottom: 15px;
    }
}

.back-to-top:focus {
	background: #3EC1D5;
	color: #fff;
	outline: none;
}

.back-to-top:hover {
	background: #3cd6ed;
	color: #fff;
}

.clear {
	clear: both;
}

/* Duplicado de 'ul' eliminado, se mantiene la primera definición. */

input, select, textarea, input[type="text"], input[type="date"], input[type="url"], input[type="email"], input[type="password"], input[type="tel"], button, button[type="submit"] {
	-moz-appearance: none;
	box-shadow: none !important;
}

#preloader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(200, 240, 220, 0.8); /* azul pastel con transparencia */
  z-index: 9999;
  opacity: 1;
  visibility: visible;
  transition: opacity 0.6s ease, visibility 0.6s ease;
  overflow: hidden;
}

#preloader img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 80px;
}

#preloader.hide {
  opacity: 0;
  visibility: hidden;
}

::-moz-selection {
 background: #3EC1D5;
 text-shadow: none;
}

::selection {
	background: #3EC1D5;
	text-shadow: none;
}

.area-padding {
	padding: 20px 0px 40px;
}

.padding-txt-intro {
	font-size: 16px;
	padding-bottom: 15px;
	line-height: 1.2;
	margin-bottom: 15px;
}

.area-padding-d {
	padding: 10px 0px 80px;
}

.area-padding-u {
	padding: 70px 0px 70px 0px;
}

.area-padding-h {
	padding: 70px 0px 30px 0px;
}

.area-padding-f {
	padding: 30px 0px 15px 0px;
}

.section-headline h2 {
	display: inline-block;
	font-size: 40px;
	font-weight: 600;
	margin-bottom: 30px;
	position: relative;
	text-transform: capitalize;
}

.section-intro h4 {
	display: inline-block;
	font-size: 40px;
	font-weight: 600;
	margin-bottom: 70px;
	position: relative;
}

.section-resume h3 {
	display: inline-block;
	font-size: 60px;
	margin-bottom: 70px;
	position: relative;
}

.section-resume contact { /* Posible error tipográfico, 'contact' no es un elemento HTML estándar aquí */
	display: inline-block;
	font-size: 60px;
	margin-bottom: 70px;
	position: relative;
}

.text-left {
	text-align: left;
}

.section-headline h2::after {
	border: 1px solid #2e2b28;
	bottom: -15px;
	content: "";
	left: 0;
	margin: 0 auto;
	position: absolute;
	right: 0;
	width: 80%;
}

.section-headline-wh h2::after {
	border: 1px solid #E1E1E1;
	bottom: -15px;
	content: "";
	left: 0;
	margin: 0 auto;
	position: absolute;
	right: 0;
	width: 80%;
}

.sec-head {
	display: inline-block;
	font-size: 17px;
	font-weight: 600;
	margin-bottom: 0;
	padding: 10px 0 5px;
	text-transform: uppercase;
	transition: all 0.4s ease 0s;
}

.etiqueta {
	font-weight: bold;
	list-style-type: disc;
	display: inline;
	color: #333;
	margin-bottom: 3px;
	font-size: 16px;
}

.subEtiqueta {
	font-weight: bold;
	list-style-type: disc;
	color: #333;
	padding-bottom: 0;
	margin-bottom: 0;
	padding-top: 10px;
	font-size: 16px;
}

.contenido {
	font-weight: normal;
	color: rgb(51,51,51);
	list-style-type: disc;
	display: inline;
	letter-spacing: 0.7px;
}

.listDisc {
	color: rgb(51,51,51);
	list-style: circle;
	margin-left: 10px;
	padding-left: 10px;
	padding-bottom: 10px;
	margin-bottom: 5px;
	letter-spacing: 0.7px;
}

.styled-logo {
	max-width: 100%;
	image-rendering: optimizeQuality; /* Prioriza la calidad de la imagen */
    image-rendering: -moz-crisp-edges;
    image-rendering: -webkit-optimize-contrast;
    border-radius: 10px;
    overflow: hidden;
}

/*--------------------------------*/
/* 2. Header top Area
/*--------------------------------*/

.header-area {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 70px; /* Altura de la navbar */
  background: rgba(0, 0, 0, 0.6);
  z-index: 9999;
  opacity: 1;
  visibility: visible;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25);
  transition:
    top 0.4s ease,
    background 0.4s ease,
    opacity 0.4s ease,
    visibility 0.4s ease,
    box-shadow 0.4s ease;
}

/* Fade-out con elevación suave */
.header-area.hide {
  opacity: 0;
  visibility: hidden;
  top: -90px; /* Desplazamiento para ocultar completamente */
  box-shadow: none;
}

/* Fondo pastel + sombra difusa + halo de resplandor */
.header-area.compact {
  background: linear-gradient(to right, rgba(230,240,255,0.95), rgba(210,230,255,0.95)) !important;
  box-shadow:
    0 4px 16px rgba(100,150,255,0.2),
    0 0 12px rgba(180,200,255,0.3),
    0 0 6px rgba(255,255,255,0.15);
  opacity: 1;
  visibility: visible;
  top: 0 !important; /* Asegura que la navbar se mantenga fija en su posición y altura */
  height: 70px !important;
}

/* Logo: solo transiciones y proporciones. El tamaño (width/height) lo controla JS. */
.logo-image img {
  opacity: 1;
  transform: scale(1);
  height: auto; /* Asegura que la altura se ajuste automáticamente para mantener proporción */
  object-fit: contain; /* Mantiene la proporción de la imagen dentro de su contenedor, evitando deformación */
  max-width: 100%; /* Asegura que el logo no exceda el ancho de su contenedor */
  transition:
    width 0.4s ease, /* Transición para el ancho, que será controlado por JS */
    height 0.4s ease, /* Transición para la altura, que será controlado por JS */
    opacity 0.3s ease,
    transform 0.3s ease;
}

/* Contenedor del logo: Estilos por defecto (posición inicial) */
.navbar-header a.navbar-brand {
	display: flex; /* Usar flexbox para centrado vertical */
	align-items: center; /* Centrar verticalmente el contenido (el logo) */
	height: 100%; /* Altura del contenedor del logo, igual a la navbar (70px) */
	padding-top: 22px; /* Padding superior para la posición inicial del logo en escritorio */
	transition: padding 0.4s ease, height 0.4s ease; /* Transición para el padding y la altura */
}

.main-menu ul.navbar-nav li {
	display: inline-block;
	padding: 0px 13px;
}

.main-menu ul.navbar-nav li a {
	background: rgba(0, 0, 0, 0) none repeat scroll 0 0; /* no cambiar */
	color: #FFF; /* Color blanco para el estado inicial */
	font-size: 15px;
	font-weight: 500;
	padding: 24px 0px;
	text-transform: capitalize;
	letter-spacing: 1px;
	transition: color 0.3s ease, font-weight 0.3s ease; /* Añadida transición para el color y el peso de la fuente */
}

.main-menu ul.navbar-nav li.active a::after {
	border: 1px solid #fff;
	bottom: 0px;
	content: "";
	left: 0;
	position: absolute;
	width: 100%;
}

.main-menu ul.navbar-nav li.active a:hover {
	background: none;
	color: #9F6;
}

.main-menu ul.navbar-nav li.active a:focus {
	color: #FFF;
}

.main-menu ul.navbar-nav li.active a {
	background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
	color: #FFF; /* no cambiar */
	position: relative;
	font-weight: bold; /* Texto en negrita cuando está activo en estado inicial */
}

.main-menu ul.navbar-nav li a:hover {
	color: #99FF99; /* Mantiene el color actual de hover */
	font-weight: bold; /* Texto en negrita al pasar el ratón en estado inicial */
}

.navbar {
	border: medium none;
	margin-bottom: 0;
}

.navbar-default {
	background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
}

.main-menu ul.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:hover, .navbar-default .navbar-nav>.active>a:focus {
	background: none;
	color: rgba(0, 0, 0, 0.6);
}

.navbar-default .navbar-toggle {
	background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
	border: medium none;
	border-radius: 0;
	padding: 25px 0px;
}

.navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a:focus {
	background-color: transparent;
	color: rgb(2, 99, 196);
}

.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
	background: none;
}

.navbar-default .navbar-toggle .icon-bar {
	background-color: #069;
	width: 30px;
	height: 2px;
}

.top-right.text-right {
	float: right;
	position: relative;
	top: 24px;
	margin-left: 20px;
}

.top-right.text-right>li {
	float: right;
	margin: 0px 8px;
}

.top-right.text-right li a {
	color: #fff;
}

/*--------------------------------*/
/* 2.1. Stick menu
/*--------------------------------*/
.header-area.stick {
	background-color: rgba(2, 36, 91, 0.819) background 0.4s ease, opacity 0.4s ease, visibility 0.4s ease, box-shadow 0.4s ease !important;;
	height: 70px;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 999999;
}

/* Contenedor del logo en modo stick/compacto: Ajusta padding y altura para centrado */
.stick .navbar-header a.navbar-brand,
.header-area.compact .navbar-header a.navbar-brand {
	display: flex; /* Asegura el centrado vertical */
	align-items: center;
	height: 100%; /* La altura de la navbar es 70px */
	padding: 5px 0; /* Padding superior e inferior de 5px para el logo compacto */
	transition: padding 0.4s ease, height 0.4s ease; /* Transición para el padding y la altura */
}

/* Color de los enlaces de la navbar en modo compacto (escritorio) */
.header-area.compact .main-menu ul.navbar-nav li a {
    color: #1865b1dc; /* MODIFICADO: Azul oscuro para los enlaces en modo compacto */
}

/* Color de los enlaces de la navbar en modo compacto al pasar el ratón (hover) */
.header-area.compact .main-menu ul.navbar-nav li a:hover {
    color: #0056b3; /* MODIFICADO: Azul medio para el hover */
	font-weight: bold;
}

/* Color de los enlaces de la navbar en modo compacto cuando están activos/seleccionados */
.header-area.compact .main-menu ul.navbar-nav li.active a {
    color: #007bff; /* MODIFICADO: Azul brillante para el estado activo/seleccionado */
	font-weight: bold;
}

/* Color de los enlaces de la navbar en modo stick (si es diferente al compacto) */
.stick .main-menu ul.nav>li>a {
	color: #fff; /* Mantener blanco si el fondo del stick es oscuro */
}

.stick .navbar-brand>img {
	display: none;
}

.stick .navbar-brand.sticky-logo>img {
	display: block;
}

.sticky-logo h1 {
	color: #fff;
	padding: 0;
	margin: 0;
	font-size: 36px;
	font-weight: bold;
	line-height: 1.2;
}

.sticky-logo h1 span {
	color: #3ec1d5;
}

.stick .main-menu ul.navbar-nav li.active a::after {
	border: 1px solid #fff;
	bottom: 0px;
	content: "";
	left: 0;
	position: absolute;
	width: 100%;
}

.stick .main-menu ul.nav>li>a:hover {
	color: #fff;
}

.stick .main-menu ul.navbar-nav li.active a {
	background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
	color: rgba(0, 51, 102, 0.6);
	position: relative;
}

.stick .mainmenu ul#nav>li:hover>a, .stick .mainmenu ul#nav li .mega-menu, .stick .mainmenu ul#nav li ul.sub-menu {
	background-color: #f5f5f5;
	color: #fff;
	outline: medium none;
}

.stick .mainmenu ul#nav li:hover ul.sub-menu li a:hover, .mainmenu ul#nav li .mega-menu span>a:hover, .stick .mainmenu ul#nav li .mega-menu-shop a.mega-menu-title:hover {
	color: #fff;
}

.stick .logo {
	height: 20px;
}

.stick .logo a {
	margin-top: 0px;
}

.stick .main-menu ul.nav>li>a {
	color: #fff;
	line-height: 22px;
	padding: 24px 0px;
	text-transform: capitalize;
	letter-spacing: 1px;
}

.stick .navbar-default .navbar-toggle .icon-bar {
	background-color: #fff;
	width: 30px;
	height: 2px;
}

.stick .navbar-default .navbar-toggle {
	padding: 10px 0px;
}

.language-selector .flag-icon { /* Añadido .language-selector */
	width: 20px; /* Tamaño aumentado */
	height: auto; /* Mantiene la proporción */
	vertical-align: middle; /* Alineación vertical */
	margin-right: 8px; /* Espacio aumentado */
	border-radius: 4px; /* Bordes más redondeados */
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15); /* Sombra más pronunciada */
	transition: transform 0.2s ease; /* Transición más rápida */
}

/* Ajustes para pantallas más pequeñas */
@media (max-width: 768px) {
    .language-selector .flag-icon { /* Añadido .language-selector */
        width: 18px; /* Tamaño reducido para móviles */
        margin-right: 5px; /* Espacio reducido para móviles */
    }

    /* MODIFICACIÓN: Asegura que el padding y altura del contenedor del logo sean consistentes en móvil */
    .navbar-header a.navbar-brand {
        height: 70px; /* La altura de la navbar en móvil es 70px */
        padding: 5px 0; /* Padding consistente de 5px arriba y abajo para el logo en móvil */
    }

    /* MODIFICACIÓN CLAVE: En móvil, la navbar siempre debe estar fija y a su altura,
       sin importar si tiene la clase 'compact' o 'hide'. */
    .header-area,
    .header-area.compact,
    .header-area.hide,
    .header-area.stick {
        top: 0 !important;
        height: 70px !important;
        position: fixed !important; /* Asegura que siempre esté fija */
        transition: background 0.4s ease, opacity 0.4s ease, visibility 0.4s ease, box-shadow 0.4s ease !important;
        /* Eliminada la transición de color aquí, ya que no aplica al contenedor del header */
    }

    /* --- MODIFICACIONES PARA EL MENÚ DE NAVEGACIÓN MÓVIL --- */
    /* Estilos para el contenedor del menú desplegable cuando está abierto */
    .navbar-collapse.collapse.in {
        background-color: rgba(2, 1, 78, 0.7); /* MODIFICADO: Fondo azul oscuro con 70% de transparencia */
        width: fit-content; /* El ancho se ajusta al contenido (texto) */
        position: fixed; /* Mantiene el menú fijo en la pantalla */
        top: 70px; /* Se posiciona justo debajo del header fijo de 70px */
        left: 15px; /* Margen de 15px a la izquierda de la página */
        right: 15px; /* Margen de 15px a la derecha de la página */
        height: auto; /* El alto del fondo se ajusta al contenido */
        max-height: calc(100vh - 70px - 15px); /* Altura máxima para evitar desbordamiento, manteniendo margen inferior */
        overflow-y: auto; /* Permite scroll si el contenido es muy largo */
        box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2); /* Sombra para destacarlo */
        z-index: 9998; /* Un z-index alto, pero menor que el header */
        padding: 0 5px; /* Añade 5px de espacio a los bordes izquierdo y derecho del fondo del menú */
        min-width: 150px; /* Opcional: Ancho mínimo para que no sea demasiado estrecho */
        margin-bottom: 15px; /* Margen inferior de 15px para el fondo del menú */
    }

    /* Colores de los enlaces del menú móvil para contrastar con el fondo oscuro */
    .navbar-collapse.collapse.in .main-menu ul.navbar-nav li a {
        color: #C0E0FF !important; /* Azul cielo claro para el menú móvil (normal) */
        padding: 15px 20px; /* Ajusta el padding para los ítems del menú móvil */
        display: block; /* Asegura que cada enlace ocupe su propia línea */
        border-bottom: 1px solid rgba(255, 255, 255, 0.1); /* Separador suave entre ítems (claro para fondo oscuro) */
        padding-left: 10px; /* MODIFICADO: Separación del texto del borde izquierdo del menú a 10px */
    }

    /* Color de los enlaces del menú móvil al pasar el ratón (hover) */
    .navbar-collapse.collapse.in .main-menu ul.navbar-nav li a:hover {
        color: #E0FFFF !important; /* Azul claro más brillante para el hover */
        background-color: rgba(255, 255, 255, 0.05); /* Fondo ligero al pasar el ratón */
        font-weight: bold !important; /* Texto en negrita al pasar el ratón en móvil */
    }

    /* Color de los enlaces del menú móvil cuando están activos/seleccionados */
    .navbar-collapse.collapse.in .main-menu ul.navbar-nav li.active a {
        color: #A0D0FF !important; /* Azul claro medio para el estado activo, más claro */
        background-color: rgba(255, 255, 255, 0.1); /* Fondo ligeramente más oscuro para el activo */
        font-weight: bold !important; /* Texto en negrita cuando está activo en móvil */
    }

    /* Eliminar el borde inferior del último elemento para una mejor estética */
    .navbar-collapse.collapse.in .main-menu ul.navbar-nav li:last-child a {
        border-bottom: none;
    }
}

/* Estilos adicionales para mejorar la apariencia */
.language-selector .flag-icon:hover { /* Añadido .language-selector */
	transform: scale(1.15); /* Aumento más pronunciado */
	transition: transform 0.2s ease; /* Transición más rápida */
}

/* Estado oculto durante el scroll inicial */
.header-area.hide {
  top: -90px;
  transition: top 0.4s ease;
}

/* Estado compacto tras scroll prolongado */
.header-area.compact {
  background: linear-gradient(to right, rgba(230,240,255,0.95), rgba(210,230,255,0.95)) !important;
  transition: background 0.4s ease;
}

/* Estas reglas de ancho para el logo ya no son necesarias si JS las maneja */
.header-area.compact .logo-image img,
.logo-image img {
  /* width: auto !important; */ /* Comentado para evitar conflicto, JS controla el tamaño */
  /* height: auto !important; */ /* Comentado para evitar conflicto, JS controla el tamaño */
  transition: width 0.3s ease, height 0.3s ease; /* Mantener transiciones suaves */
}

/*------------------------------
  3. About Area
--------------------------------*/
.about-area {
	background-color: #f9f9f9;
	padding: 50px 0;
}

.section-differ {
	padding: 50px 0 70px 0;
	}

.about-headline h2 {
	display: inline-block;
	font-size: 40px;
	font-weight: 600;
	margin-bottom: 70px;
	position: relative;
	text-transform: capitalize;
}

.about-headline h2::after {
	border: 1px solid #333;
	bottom: -20px;
	content: "";
	left: 0;
	margin: 0 auto;
	position: absolute;
	right: 0;
	width: 90%;
	text-align: center;
}

.single-well {
	width: 100%;
	overflow: hidden;
	color: rgba(51,51,51,1);
}

.single-well-spc {
	padding-top: 10px;
	padding-bottom: 10px;
	width: 100%;
	overflow: hidden;
	color: rgb(204,204,204);
}

.single-well .imagen-contenedor {
	width: 100%;
}

.single-well img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 8px;
}

.single-well ul {
	list-style: none;
	padding-left: 0;
}

.single-well ul li {
	color: #444;
	padding: 5px 0;
}

.single-well ul li i {
	color: #3EC1D5;
	padding-right: 10px;
	font-size: 12px;
}

.single-well h4.sec-head {
	color: #333;
	margin-bottom: 15px;
	font-size: 18px;
}

/* Posicionamiento de elementos */
.imagen-izquierda .imagen-contenedor {
	float: left;
	width: 100%;
	height: 100%;
}

.imagen-izquierda + .texto-derecha {
	float: right;
	width: 100%;
	padding-left: 20px;
}

.imagen-derecha .imagen-contenedor {
	float: right;
	width: 100%;
}

.imagen-derecha + .texto-izquierda {
	float: left;
	width: 100%;
	padding-right: 20px;
}

/* Responsividad */
@media (max-width: 768px) {
    .imagen-izquierda .imagen-contenedor,
    .imagen-derecha .imagen-contenedor,
    .imagen-izquierda + .texto-derecha,
    .imagen-derecha + .texto-izquierda {
        width: 100%;
        float: none;
        text-align: center;
    }

    .imagen-izquierda + .texto-derecha,
    .imagen-derecha + .texto-izquierda {
        padding: 20px 0;
    }
}

.about-block {
  margin-bottom: 1em;
}

.about-title {
  font-size: 26px;
  font-weight: 700;
  color: #262626;
  text-align: left;
  padding-left: 10px;
}

.about-subtitle {
	font-size: 34px;
	font-weight:800;
	color: #2D2D2D; /* cian apagado */
}

.about-paragraph {
	font-size: 15px;
	color: #1E1E1E;
	line-height: 1.3;
	padding-bottom: 15px;
}

@media (max-width: 768px) {
  .about-title {
    font-size: 20px;
	text-align: left;
	padding-left: 5px;
  }

  .about-subtitle {
    font-size: 16px;
    text-align: center;
  }

  .about-paragraph {
    font-size: 13px;
    text-align: justify;
  }
}

/*--------------------------------------*/
/*SECTION WHY CHOOSE US
/*-------------------------------------*/
.whyChoose-area {
	background-color: #f9f9f9;
	padding: 30px 0;
}

/*-------------------------------*/
/*SECTION OUR DIFFERNCE
/*----------------------------------*/
.section-differ {
	padding: 30px 0;
	}

/*--------------------------------*/
/* 4.Services Area
/*--------------------------------*/
.services-icon {
	color: #444;
	display: inline-block;
	font-size: 36px;
	line-height: 36px;
	margin-bottom: 20px;
}

.section-headline.services-head>h2 {
	margin-bottom: 25px;
}

.services-details {
	padding-top: 40px;
	transition: all 0.5s ease 0s;
}

.services-details:hover h4, .services-details:hover .services-icon {
	color: #3EC1D5;
}

.row.second-row {
	margin-top: 40px;
}

.section-head>h2 {
	color: #333;
}

.single-services>h4 {
	color: #444;
	font-size: 24px;
	font-weight: 500;
}

.single-services>p {
	color: #333;
	font-size: 15px;
}

.title-resalt {
	font-size: 40px;
	font-style: normal;
	line-height: bold;
	font-weight: 800;
	color: rgba(255,255,255,1);
	font-family: "Calibri";
	text-align: center;
	color: #069;
}

#devel-credit {
	color: #699;
}

/* Duplicado de #devel-credit eliminado */

.title-resalt >h2 {
	font-size: 40px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	color: rgb(153,153,153);
	font-family: "Courier New", Courier, monospace;
	text-align: center;
}

.text-contact p{
	font-size: 25px;
	font-style: normal;
	line-height: normal;
	color: rgba(102,153,204,1);
	font-family: Calibri;
	text-align: center;
	padding: 10px;
}

/*----------------------------------------
  5.Skill Area
----------------------------------------*/
.our-skill-area {
	position: relative;
	background: rgba(0, 0, 0, 0.8) url("../img/background/dall-e005_skill.jpg") no-repeat fixed center top / cover;
	padding: 30px 0;
	height: auto;
	width: 100%;
	z-index: 1;
}

.skill-overly {
	background: rgba(0, 0, 0, 0.80) none repeat scroll 0 0;
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
}

.single-skill {
	background-color: rgba(255,255,255,0.05);
    padding: 10px;
    border-radius: 12px;
    width: 100%;
    text-align: center;
	display: inline-block;
	vertical-align: top;
	margin: 5px;
}

.titSkill {
	color: rgba(182,240,226,1);
	font-weight: 500;
	font-size: 26px;
	letter-spacing: 1.2px;
	text-transform: uppercase;
}

.skil-det-frt {
	padding-left: 7px;
	padding-right: 7px;
	color: rgb(233,227,253);
	letter-spacing: 1px;
	text-align: left;
	font-size: 14px;
	line-height: 1.2;
	margin-top: 8px;
}

@media (max-width: 768px) {
  .our-skill-area {
    background-attachment: scroll; /* evita parpadeos en móviles */
    padding: 30px 10px;
  }

  .single-skill {
    width: 100%;
    margin: 15px 0;
    display: block;
  }

  .titSkill {
    font-size: 18px;
	text-align: center;
  }

  .skil-det-frt {
    font-size: 14px;
	padding-right: 2px; /* Corregido doble padding-right */
    padding-left: 2px;
    text-align: left;
  }
}
/*----------------------------------------
  6.Faq Area
----------------------------------------*/
.faq-details .panel-heading {
	padding: 0;
}

.fa-evalBrand {
	/* Hacer que la imagen sea responsiva */
	width: 75px;
	height: 75px;
	max-width: 100%;
	max-height: 100%;
	/* Centrar la imagen en su contenedor */
	display: block;
	margin-left: auto;
	margin-right: auto;
	/* Añadir bordes redondeados (opcional) */
	border-radius: 8px;
	/* Añadir una sombra suave (opcional) */
	box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
	/* Asegurar una apariencia nítida en pantallas de alta resolución */
	image-rendering: -webkit-optimize-contrast;
	image-rendering: crisp-edges;
	/* Suavizar transiciones en estados hover */
	transition: transform 0.3s ease;
	/* Ajustes específicos para diferentes navegadores (prefijos) */
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
}

/* Efecto al pasar el cursor por encima */
.fa-evalBrand:hover {
	transform: scale(1.05);
}

.panel-default>.panel-heading {
	background-color: transparent;
	border: medium none;
	color: #333;
}

.faq-details h4.check-title a {
	color: #333;
	display: block;
	font-weight: 700;
	letter-spacing: 2px;
	margin-left: 40px;
	padding: 6px 10px;
	text-decoration: none;
}

.panel-body {
  padding: 15px 15px 0px 50px;
}

.faq-details h4.check-title {
  color: #444;
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 0;
}

.faq-details a span.acc-icons {
  position: relative;
}

.faq-details a span.acc-icons::before {
  color: #333;
  content: "";
  font-family: fontawesome;
  font-size: 24px;
  height: 40px;
  left: -51px;
  line-height: 39px;
  position: absolute;
  text-align: center;
  top: -10px;
  width: 42px;
}

.faq-details h4.check-title a.active, .faq-details a.active span.acc-icons::before {
  color: #3EC1D5;
}

.faq-details a.active span.acc-icons::before {
  content: "";
  font-family: fontawesome;
  font-size: 24px;
  height: 40px;
  left: -51px;
  line-height: 39px;
  position: absolute;
  text-align: center;
  top: -10px;
  width: 42px;
}

.second-row {
  margin-top: 30px;
}

.event-content.head-team h4 {
  background: transparent none repeat scroll 0 0;
  color: #333;
  padding: 30px 0 10px;
  font-weight: 500;
  text-transform: capitalize;
}

.tab-menu .nav-tabs>li>a:hover {
  border-color: #eee #eee #ddd;
}

.tab-menu {
  display: block;
  text-align: center;
}

.tab-menu ul.nav {
  margin: 0;
  padding: 0;
}

.tab-menu ul.nav li {
  border: medium none;
  font-weight: 800;
  display: inline-block;
}

.tab-content {
  border: 1px solid #b3d4ff;
  padding: 0 15px 15px;
}

.tab-menu ul.nav li a {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  border-radius: 0;
  color: #444;
  display: block;
  font-weight: 400;
  margin-right: 5px;
  padding: 10px 20px;
  font-family: raleway;
  font-size: 18px;
}

.tab-menu ul li.active a, .tab-menu ul li.hover a, .tab-menu ul li.focus a {
  border-bottom: 1px solid #fff;
  font-weight: 600;
  color: #3EC1D5 !important;
}

.tab-menu .nav-tabs {
  border-bottom: none;
}

.tab-main-img a {
  position: relative;
  display: block;
}

.tab-main-img a:hover span.events-offer {
  height: 20%;
}

.tab-main-img a span.events-offer {
  background: rgba(0, 0, 0, 0.8) none repeat scroll 0 0;
  bottom: 0;
  color: #fff;
  content: "";
  font-size: 20px;
  font-weight: 700;
  height: 0%;
  left: 0;
  line-height: 70px;
  padding: 0;
  position: absolute;
  text-align: left;
  transition: all 0.5s ease 0s;
  width: 100%;
  padding: 0px 10px;
}

.whychoose-head {
	margin-top: 10px;
	font-weight:500;
	}

.whyChoose-content p {
    font-family: Arial, sans-serif;
    font-size: 16px;
    color: #333; /* Color del texto */
    line-height: 1.2; /* Espaciado entre líneas */
    margin-bottom: 10px; /* Espacio entre párrafos */
}

/* Estilo para los párrafos con viñetas tipo disco */
.whyChoose-content ul {
    list-style-type: disc; /* Viñetas de disco */
    padding-left: 20px; /* Espaciado para alineación */
}

.whyChoose-content ul li {
	font-size: 16px;
	color: #333;
	margin-bottom: 5px;
}

/*----------------------------------------
 7.Wellcome Area Css
----------------------------------------*/
/* Welcome Area */
.wellcome-area {
  background: rgba(248, 248, 248, 0.8) url("../img/background/gem-bgr-002.jpg") no-repeat fixed center top;
  background-size: cover;
}

.well-bg {
  position: relative;
  z-index: 120;
}

.wellcome-text {
  margin: 70px 0;
  padding: 30px 40px;
  text-align: center;
}

.well-text h2 {
  color: #fff;
  font-size: 44px;
  font-weight: 700;
  line-height: 50px;
  z-index: 100;
}

.well-text p,
.well-text b {
  font-size: 18px;
  font-style: italic;
  color: #cff;
  font-stretch: expanded;
  margin-bottom: 20px;
  z-index: 110;
}

.section-headline p {
  margin-bottom: 0;
}

/* Texto principal de bienvenida */
.welcome-heading {
  font-size: 44px;
  font-weight: 700;
  line-height: 1.2;
  color: #fff;
  text-align: center;
  text-transform: uppercase;
  margin-bottom: 20px;
  z-index: 20;
}

/* Texto descriptivo debajo del encabezado */
.welcome-description {
  font-size: 18px;
  font-style: italic;
  color: #CFF;
  text-align: center;
  line-height: 1.2;
  margin-bottom: 30px;
  z-index: 21;
}

/* Suscripción */
.suscribe-wrapper {
  position: relative;
  display: block;
  height: 50px;
  max-width: 500px;
  margin: 30px auto;
  background-color: rgba(255, 255, 255, 0.2);
  border: 1px solid #FFC;
  border-radius: 50px;
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}

.email-input {
  display: inline-block;
  vertical-align: top;
  width: calc(100% - 130px); /* Reservamos espacio para el botón */
  padding: 12px 5px 12px 5px; /* Ajuste de placeholder */
  border: none;
  border-radius: 50px 0 0 50px;
  font-size: 15px;
  background-color: transparent;
  color: #fff;
  outline: none;
}

/* Placeholder visual */
.email-input::placeholder {
  color: rgba(255, 255, 255, 0.7);
  font-size: 15px;
  text-align: left;
  line-height: 1.2;
}

/* Botón suscribirme */
.subscribe-btn {
  display: inline-block;
  vertical-align: top;
  width: 110px;
  height: 100%;
  padding: 12px 0;
  border: none;
  border-radius: 50px;
  background-color: #9FC;
  color: green;
  font-weight: 700;
  font-size: 16px;
  cursor: pointer;
  transition: background-color 0.3s;
  position: absolute;
  right: 0;
  top: 0;
}

.subscribe-btn:hover {
  background-color: #ffc;
}

/* Mensaje de respuesta */
.response-message {
  position: absolute;
  top: 60px;
  left: 50%;
  transform: translateX(-50%);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.5s ease-in-out, visibility 0.5s;
  text-align: center;
  font-size: 16px;
  padding: 10px;
  max-width: 90%;
  margin: 15px auto;
  border-radius: 5px;
}

.response-message.success {
  background-color: #28a745;
  color: white;
}

.response-message.error {
  background-color: #dc3545;
  color: white;
}

.response-message.show {
  opacity: 1;
  visibility: visible;
}

/* Responsive */
@media screen and (max-width: 768px) {
  .suscribe-wrapper {
    height: auto;
    padding: 10px;
    border-radius: 20px;
  }

  .email-input,
  .subscribe-btn {
    width: 100%;
    display: block;
    position: static;
    border-radius: 30px;
    margin-bottom: 10px;
  }

  .subscribe-btn {
    height: auto;
    font-size: 16px;
  }
}

/*----------------------------------------
 11-a. Competence Area
----------------------------------------*/
.competence-area {
  background: rgba(0, 0, 0, 0.02) none repeat scroll 0 0;
}

.competence_table_list {
  border: 1px solid #ccc;
  text-align: center;
  transition: all 0.4s ease 0s;
  background: #fff;
}

.competence_table_list h3 span {
  font-size: 16px;
}

.competence_table_list ol li {
  border-bottom: 1px solid #ccc;
  color: #666;
  padding: 10px 25px;
  position: relative;
  text-align: left;
}

.competence_table_list li.check::before {
  content: "\f00c";
  font-family: fontawesome;
  font-size: 14px;
  position: absolute;
  left: 5px;
  top: 12px;
  color: #3EC1D5;
}

.competence_table_list button {
  background: #444 none repeat scroll 0 0;
  border: 1px solid #444;
  color: #fff;
  margin-bottom: 25px;
  padding: 10px 35px;
  text-transform: uppercase;
  transition: all 0.4s ease 0s;
  border-radius: 30px;
}

.competence_table_list>h3 {
	color: #333;
	font-size: 24px;
	font-weight: 700;
	line-height: 25px;
	padding: 30px 0 20px;
	text-transform: uppercase;
	transition: all 0.4s ease 0s;
	background-color: rgba(204,204,204,0.3);
}

.competence_table_list ol {
  list-style: outside none none;
  margin: 0;
  padding: 0 0 25px;
}

.competence_table_list.active {
  transition: all 0.4s ease 0s;
  position: relative;
  overflow: hidden;
}

.saleon {
  background: #3EC1D5 none repeat scroll 0 0;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  left: -26px;
  padding: 2px 25px;
  position: absolute;
  text-transform: uppercase;
  top: 16px;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
}

/*----------------------------------------
 12.Testimonial Area Css
----------------------------------------*/
.testimonials-area {
	background: rgba(0, 0, 0, 0) url("../img/background/gem-bgr-001.jpg") no-repeat fixed center top / cover;
	height: auto;
	width: 100%;
}

.testi-inner {
	position: relative;
	width: 100%;
	height: auto;
	z-index: 1;
}

.testi-overly {
	background: rgba(0, 0, 0, 0.7) none repeat scroll 0 0;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: -1;
}

.testi-img img {
	border: 1px dotted rgba(0, 0, 0, 0.05);
	border-radius: 2px;
	height: 80px;
	margin: 0 auto;
	padding: 5px;
	transition: background 0.6s ease-out 0s;
	width: 80px !important;
}

.testi-text p {
	color: #fff;
	font-size: 16px;
	line-height: 1.5em;
	margin: 20px 0;
	letter-spacing: 1px;
}

.testi-text h6 {
	color: #fff;
	font-size: 20px;
}

.testimonial-carousel.owl-carousel.owl-theme .owl-controls .owl-dots div.owl-dot>span {
	background: #fff none repeat scroll 0 0;
	display: inline-block;
	height: 8px;
	width: 8px;
	-moz-transition: 0.4s;
	-webkit-transition: 0.4s;
	-o-transition: 0.4s;
	-ms-transition: 0.4s;
	transition: 0.4s;
	border-radius: 50%;
}

.testimonial-carousel.owl-carousel.owl-theme .owl-controls .owl-dots {
	bottom: -30px;
	display: block;
	left: 50%;
	margin-left: -20px;
	position: absolute;
}

.testimonial-content {
	margin-bottom: 15px;
}

.testimonial-carousel.owl-carousel.owl-theme .owl-controls .owl-dots div.owl-dot {
	display: inline-block;
	margin: 0 3px;
}

.testimonial-carousel.owl-carousel.owl-theme .owl-controls .owl-dots div.owl-dot.active span {
	background: #3EC1D5;
}

.testi-text.text-center>h6 {
	color: #fff;
	font-size: 20px;
	font-weight: 700;
	text-transform: uppercase;
}

.guest-rev {
	color: #ddd;
	font-size: 16px;
}

.guest-rev>a {
	color: #3EC1D5;
	font-size: 14px;
}

@keyframes fadeIn {
    from {
        opacity: 0.1;
    }
    to {
        opacity: 1;
    }
}

.testim-image-container {
    position: relative;
    justify-content: center;
    align-items: center;
    width: 100px; /* Ajusta el tamaño del contenedor según necesites */
    height: 100px;
    border-radius: 50%; /* Hace que el contenedor sea circular */
    overflow: hidden; /* Asegura que la imagen mantenga su forma dentro del círculo */
    background-color: transparent;
	text-align: center;
	margin: 0 auto 10px auto;
}

.testim-image {
	display:inline-block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100px;
    height: 100px;
	border-radius: 50%;
    object-fit: cover;
    transform: translate(-50%, -50%); /* Centra la imagen dentro del contenedor */
	opacity: 0.1;
	animation: fadeIn 1s ease-in-out forwards;
}

.testi-text p {
  color: #E3D1F4; /* lavanda pastel */
  font-size: 16px;
  line-height: 1.6em;
  margin: 16px 0;
  letter-spacing: 0.5px;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2); /* mejora legibilidad sobre fondos con textura */
}

.testi-text h6 {
  color: #F9D9CA; /* coral pastel */
  font-size: 20px;
  font-weight: bold;
  margin-top: 10px;
  text-transform: uppercase;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
}

.emphat {
  font-style: italic;
  font-weight: 600;
  color: #D7F2E3;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
}

/* Testimonial Slider - NUEVO */
.testimonial-carousel {
  position: relative;
  overflow: hidden;
  width: 100%;
  max-width: 700px;
  margin: 0 auto;
}

.single-testi {
  display: none;
  animation: fadeIn 0.5s ease-in-out;
}

.single-testi.active {
  display: block;
}

/* @keyframes fadeIn ya está definido arriba */

/*--------------------------------*/
/* 14.Contact Area
/*--------------------------------*/
/* ----------------------------------
   Área de bienvenida
---------------------------------- */
.wellcome-area {
  background: rgba(248, 248, 248, 0.8) url("../img/background/gem-bgr-002.jpg") no-repeat center top fixed;
  background-size: cover;
}
.well-bg {
  position: relative;
}

/* ----------------------------------
   Área de contacto
---------------------------------- */
.contact-area {
  width: 100%;
  height: auto;
  padding-top: 30px;
}
.section-headline-contact h4 {
  font-size: 30px;
  font-weight: 600;
  margin-bottom: 10px;
  text-transform: capitalize;
}
.section-headline-wh h2 {
  font-size: 40px;
  font-weight: 600;
  margin-bottom: 70px;
  text-transform: capitalize;
  color: #E1E1E1;
}

/* ----------------------------------
   Formulario de contacto
---------------------------------- */
.contact-form input[type="text"],
.contact-form input[type="email"] {
  background: transparent;
  border: 1px solid #699;
  color: #444;
  height: 40px;
  margin: 20px 0 16px 20px;
  padding-left: 20px;
  width: 60%;
}
.contact-form textarea {
  background: transparent;
  border: 1px solid #699;
  color: #000;
  padding: 20px;
  margin: 20px 0 0 20px;
  width: 60%;
  height: 180px;
  resize: none;
  transition: height 0.2s ease-in-out;
  overflow-y: hidden;
}
@media screen and (max-width: 768px) {
  .contact-form textarea {
    height: 150px;
  }
}
.contact-form button[type="submit"] {
  background: rgba(51, 204, 204, 0.3);
  border: 1px solid #699;
  color: #033;
  font-size: 16px;
  font-weight: 700;
  margin-top: 8px;
  padding: 12px 30px;
  text-transform: uppercase;
  border-radius: 30px;
  transition: all 0.3s ease;
}
.contact-form button[type="submit"]:hover {
  background-color: rgba(51, 204, 153, 0.5);
  color: rgba(0, 102, 51, 0.8);
  border-color: #033;
}

/* ----------------------------------
   Mensajes dinámicos
---------------------------------- */
.contact-form #sendmessage,
.contact-form #errormessage {
  display: none;
  text-align: center;
  padding: 15px;
  margin-bottom: 15px;
  font-weight: bold;
  border: 1px solid #CFF;
  color: #333;
}
.contact-form #errormessage {
  color: red;
  border-color: red;
  font-weight: 600;
}
.contact-form #sendmessage.show,
.contact-form #errormessage.show,
.contact-form .show {
  display: block;
}
.response-message {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.5s ease-in-out, visibility 0.5s;
  text-align: center;
  font-size: 18px;
  padding: 10px;
  max-width: 90%;
  margin: 10px auto;
  border-radius: 5px;
}
.response-message.success {
  background-color: #28a745;
  color: #fff;
}
.response-message.error {
  background-color: #dc3545;
  color: #fff;
}
.response-message.show {
  opacity: 1;
  visibility: visible;
}

/* ----------------------------------
   Iconos de contacto (si se usan)
---------------------------------- */
.single-icon i,
.single-icon-wh i {
  font-size: 24px;
  width: 50px;
  height: 50px;
  line-height: 46px;
  border-radius: 50%;
  margin-bottom: 20px;
}
.single-icon i {
  border: 1px solid #444;
}
.single-icon-wh i {
  border: 1px solid #CFF;
  color: #FFF;
}
.single-icon p,
.single-icon-wh p {
  font-size: 16px;
  line-height: 30px;
}
.single-icon-wh p {
  color: #366;
}
.contact-icon,
.contact-icon-wh {
  margin-bottom: 40px;
}

/* ----------------------------------
   Mapa responsivo y alineación
---------------------------------- */
.mapUbic {
  width: 100%;
  height: 380px;
  border: 1px solid #699;
  margin: 0 auto;
}
.map-column {
  margin-bottom: 30px;
}
.form-column {
  margin-top: 25px;
}

/* Alineación en escritorio */
@media screen and (min-width: 768px) {
  .contact-area .row {
    display: table;
    table-layout: fixed;
    width: 100%;
  }
  .contact-area .row > div {
    display: table-cell;
    vertical-align: top;
    float: none;
  }
  .map-column,
  .form-column {
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 0;
  }
  .mapUbic {
    margin-top: 0;
  }
}

/* Altura del mapa en móviles */
@media screen and (max-width: 768px) {
  .mapUbic {
    height: 320px;
  }
  .map-column {
    margin-bottom: 40px;
  }
  .form-column {
    margin-top: 0;
  }
}

@media screen and (max-width: 480px) {
  .mapUbic {
    height: 280px;
  }
}

/*----------------------------------------*/
/* 15. Footer Area
/*----------------------------------------*/
.footer-area {
	padding: 40px 0;
	background: #f9f9f9;
}

.footer-head p {
	color: #444;
}

.footer-head h4 {
	color: #444;
	font-size: 24px;
	font-weight: 800;
	letter-spacing: 2px;
	padding-bottom: 10px;
	text-transform: uppercase;
}

.footer-logo {
	padding-bottom: 20px;
}

.footer-logo h2 {
	color: #222;
	padding: 0;
	margin: 0;
	font-size: 36px;
	font-weight: bold;
	line-height: 1;
}

.footer-logo h2 span {
	color: #3ec1d5;
}

.brand_text_edg {
	font-weight: 800;
	color: rgba(19,141,117,1);
}

.brand_text_dv {
	font-weight: 600;
	color: rgba(69,179,157,1);
}

.brand_text_ed {
	font-weight: 800;
	color:rgba(255,153,51,1);
}

.brand_link {
	color: rgba(0,51,51,1);
}

.footer-icons ul li {
	display: inline-block;
}

.footer-icons ul li a {
	color: #444;
	display: block;
	font-size: 16px;
	height: 40px;
	line-height: 38px;
	margin-right: 5px;
	text-align: center;
	width: 40px;
	border-radius: 50%;
}

.flicker-img>a {
	float: left;
	padding: 1px;
	width: 33.33%;
}

.footer-icons {
	margin-top: 30px;
}

.footer-contacts p span {
	color: #3EC1D5;
	font-weight: 700;
}

.popular-tag ul li {
	display: inline-block;
}

.footer-content {
	display: block;
	overflow: hidden;
}

.popular-tag ul li a:hover, .footer-icons ul li a:hover {
	background: #3EC1D5;
	border: 1px solid #3EC1D5;
	color: #fff;
}

.popular-tag ul li a {
	border: 1px solid #444;
	border-radius: 30px;
	color: #444;
	display: block;
	font-size: 13px;
	font-weight: 600;
	margin: 5px 3px;
	padding: 5px 10px;
	position: relative;
	text-decoration: none;
	text-transform: capitalize;
	transition: all 0.4s ease 0s;
	width: 70px;
	text-align: center;
}

.footer-area-bottom {
	background: #f1f1f1 none repeat scroll 0 0;
	padding: 15px 0;
}

.copyright-text a:hover {
	text-decoration: underline;
	color: #3EC1D5;
}

.copyright-text a {
	color: #444;
}

.copyright>p {
	margin-bottom: 0;
	color: #444;
}

.copyright a, .credits a {
	color: #3EC1D5;
}

.credits {
	padding-top: 5px;
	text-align: center;
}

.iconFaceb {
	content: url('../img/icons/iconBlog-eg_facebCw.png');
}

.iconTwee {
	content: url('../img/icons/iconBlog-eg_tweeCw.png');
}

.iconYout {
	content: url('../img/icons/iconBlog-eg_youtCw.png');
}

.iconInsta {
	content: url('../img/icons/iconBlog-eg_instaCw.png');
}

.iconBehanC {
	content: url('../img/icons/iconBlog-eg_behanCw.png');
}

.iconBehanR {
	content: url('../img/icons/iconBlog-eg_behanRw.png');
}

.fa-mark:before {
	content: url('../img/icons/iconToolsV.png');
}

#fechas-web {
  overflow: hidden;
  text-align: center;
}

.fechas-web {
  overflow: hidden;
  text-align: center;
  color:rgb(102,153,153);
}

.devel-credit {
	font-family: 'Raleway', sans-serif;
	font-size:14px;
	color:rgb(51,102,51);
	}

#fechas-web > div {
  float: left;
  width: 50%;
  box-sizing: border-box;
}

@media (max-width: 600px) {
  #fechas-web > div {
    display: block;
    float: none;
    width: 100%;
    margin-bottom: 10px;
  }
}

.padding-footer {
	padding: 5px 0px 5px 0;
	}

.cont-legalCredits {
  text-align: center; /* centra el contenido si hay espacio */
  overflow: hidden;   /* para contener los floats si se usan */
  margin: 10px 0;
  width: 100%;
}

/* Estilo para cada columna */
.legalDocs {
  display: inline-block;
  width: 20%;         /* deja algo de espacio entre columnas */
  margin: 1%;
  vertical-align: top;
  padding: 5px;
}

/* Responsive: en pantallas menores a 768px (tablets/móviles) */
@media (max-width: 768px) {
  .columna {
    display: block;
    width: 100%;
    margin: 10px 0;
  }
}

.msg-error {
  color: red;
  font-size: 0.9em;
  display: none;
}

/*----------------------------------------*/
/* 16.Home Page 2  CSS
/*----------------------------------------*/
.header-bg {
	background: url(../img/slider/slider1.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
	background-attachment: fixed;
}

.header-bg.home-2 {
	width: 100%;
	height: 100%;
	position: relative;
}

.home-overly {
	background: rgba(0, 0, 0, 0.50);
	height: 100%;
	position: absolute;
	width: 100%;
}

.home-2 .layer-1-3, .home-3 .layer-1-3 {
	margin: 10px 0 0;
}

/*----------------------------------------*/
/* 17.Home Page 3  CSS
/*----------------------------------------*/
.home-video {
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: -1;
}

.header-image.home-3 {
	width: 100%;
	height: 100%;
	position: relative;
}

.table {
	width: 100%;
	height: 100%;
	display: table;
}

.table-cell {
	width: 100%;
	height: 100%;
	display: table-cell;
	vertical-align: middle;
}
