:root {
  --font-default: "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --font-primary: "Amatic SC", sans-serif;
  --font-primary: "Amatic SC", sans-serif;
}




iframe[src*="youtube.com"] {
  width: 100%;
  aspect-ratio: 16 / 9;
  height: auto;
  max-width: 100%;
}

.row-equal {
  display: flex;
  align-items: stretch;
}
.flex-fill {
  flex: 1 1 auto;
  height: 100%;
}


.Tour_Privado_Bcn_02_card {
  background: #ededed; /* Fondo gris clásico */
  border-radius: 22px;
  box-shadow: 0 4px 24px rgba(0,156,222,0.08), 0 1.5px 4px rgba(0,0,0,0.04);
  max-width: 420px;
  margin: 0 auto 36px auto;
  padding: 34px 26px 28px 26px;
  font-family: 'Open Sans', Arial, sans-serif;
  color: #1d3557;
  display: flex;
  flex-direction: column;
  gap: 18px;
  position: relative;
}

.Tour_Privado_Bcn_02_header {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px; /* Más espacio entre líneas */
  margin-bottom: 18px;
}

.Tour_Privado_Bcn_02_estrellas {
  font-size: 2rem; /* Más grande para las estrellas */
}

.Tour_Privado_Bcn_02_estrella {
  color: #009cde;
  font-size: inherit;
  margin-right: 2px;
}

.Tour_Privado_Bcn_02_etiqueta {
  font-size: 1.10rem;
  font-weight: 700;
  color: #111;
}

.Tour_Privado_Bcn_02_titulo {
  font-size: 1.4rem;
  font-weight: 800;
  color: #111;
}

.Tour_Privado_Bcn_02_subtitulo {
  font-size: 2.2rem;      /* Tamaño grande para h2 */
  font-weight: 900;
  color: #111;
  margin: 10px 0 0 0;
  line-height: 1.1;
  text-align: left;
	
}

/* Título principal, alineado a la izquierda y compacto */
.Tour_Privado_Bcn_02_titulo {
  font-size: 1.4rem;
  font-weight: 800;
  color: #111;
}

/* Subtítulo más pequeño y alineado a la izquierda */
.Tour_Privado_Bcn_02_subtitulo {
  font-size: 1.8rem;      /* Tamaño grande para h2 */
  font-weight: 900;
  color: #111;
  margin: 10px 0 0 0;
  line-height: 1.1;
  text-align: left;
}

/* Info */
.Tour_Privado_Bcn_02_info {
  background: #e8e8e8;
  border-radius: 12px;
  padding: 13px 16px;
  font-size: 15px;
  color: #111;
  display: flex;
  flex-direction: column;
  gap: 7px;
  margin-bottom: 4px;
}
.Tour_Privado_Bcn_02_info strong {
  color: #009cde;
  font-weight: 700;
}

/* Precio */
.Tour_Privado_Bcn_02_precioBox {
  background: #e8e8e8;
  border-radius: 12px;
  padding: 20px 0 10px 0;
  text-align: center;
  margin-top: 4px;
  margin-bottom: 10px;
}
.Tour_Privado_Bcn_02_precio {
  color: #009cde;
  font-size: 34px;
  font-weight: 800;
  display: block;
  margin-bottom: 2px;
}

.Tour_Privado_Bcn_02_precioPorPersona {
  color: #111;
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 18px; /* Añade más espacio debajo */
  display: block;      /* Asegura que el margen se aplique correctamente */
}

/* Botón centrado con el estilo de appointment2-btn */
.Tour_Privado_Bcn_02_btnBox {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}

.appointment2-btn, .Tour_Privado_Bcn_02_btn {
  background: #009cde;
  color: #fff;
  border-radius: 5px;
  padding: 12px 40px;
  font-size: 18px;
  font-weight: 600;
  display: inline-block;
  transition: 0.5s;
  margin-top: 10px;
  text-decoration: none;
  border: none;
  outline: none;
  box-shadow: 0 2px 8px rgba(0,156,222,0.10);
  letter-spacing: 0.5px;
  text-align: center;
  font-family: "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

.appointment2-btn:hover,
.Tour_Privado_Bcn_02_btn:hover {
  background: #187bcd;
  color: #fff;
}

/* Responsive: igual al botón CTA en móvil */
@media (max-width: 600px) {
  .Tour_Privado_Bcn_02_btn {
    width: 100%;
    padding: 13px 0;
    font-size: 16px;
  }
}

/* Responsive */
@media (max-width: 600px) {
  .Tour_Privado_Bcn_02_card {
    padding: 18px 8px 18px 8px;
    max-width: 98vw;
    border-radius: 14px;
  }
  .Tour_Privado_Bcn_02_subtitulo {
      font-size: 2.2rem;
  }
  .Tour_Privado_Bcn_02_btn {
    width: 100%;
    padding: 13px 0;
    font-size: 16px;
  }
  .Tour_Privado_Bcn_02_card .Tour_Privado_Bcn_02_precio {
    font-size: 28px;
  }
}


.fondo-gris {
  background-color: #ededed; /* Gris claro, puedes usar otro tono si prefieres */
  border-radius: 22px;       /* Opcional: igual que el diseño de tus cards */
  padding: 30px 20px;        /* Espaciado interno para que no quede pegado */
  margin-bottom: 36px;       /* Espacio inferior, opcional */
}



.reservar-grande {
  font-size: 18px !important;
  padding: 20px 60px !important;
  font-weight: 700 !important;
  border-radius: 8px !important;
  min-width: 220px;
}

@media (max-width: 600px) {
  .reservar-grande {
    width: 100% !important;
    padding: 16px 0 !important;
    font-size: 18px !important;
    min-width: unset;
  }
}




/* Tour Barcelona Promo - Estrellas azules alineadas a la izquierda */
.Tour_Bcn_Promo_estrellas {
  text-align: left;
  margin-bottom: 8px;
  padding: 0;
  background: none;
}

.Tour_Bcn_Promo_estrella {
  color: #009cde;
  font-size: 24px;
  margin: 0 2px;
  display: inline-block;
  text-shadow: 0 1px 2px rgba(0,0,0,0.1);
  transition: transform 0.2s ease;
}

.Tour_Bcn_Promo_estrella:hover {
  transform: scale(1.1);
}

/* Tour Barcelona Promo - Título más pequeño alineado a la izquierda */
.Tour_Bcn_Promo_titulo {
  font-size: 16px !important;
  font-weight: 600;
  color: #111;
  margin-bottom: 8px;
  text-align: left;
  line-height: 1.3;
  padding: 0;
  background: none;
}




/* Iconos sociales en la parte inferior del menú móvil */
.mobile-social-icons-container {
    display: none;
    width: 100%;
    padding: 0;
    margin: 0;
    position: absolute;
    bottom: 20px;
    left: 0;
    right: 0;
    /* border-top: 2px solid #ddd; ELIMINAR ESTA LÍNEA */
    background: #f8f9fa;
    margin-top: 50px;
}

.mobile-social-icons {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 15px;
    gap: 30px;
    width: 100%;
}

.mobile-social-icons a {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #009cde;
    font-size: 80px;
    text-decoration: none;
    transition: 0.3s;
}

.mobile-social-icons a i {
    font-size: 80px;
    line-height: 1;
    margin: 0;
    padding: 0;
    display: block;
}

/* Efecto hover sin cuadrados */
.mobile-social-icons a:hover {
    color: #187bcd !important;
    transform: scale(1.1) !important;
}


/* Mostrar solo en móviles cuando el menú esté activo */
@media (max-width: 991px) {
    .navbar-mobile ul {
        position: relative;
        min-height: calc(100vh - 100px);
        padding-bottom: 120px;
    }
    
    .navbar-mobile .mobile-social-icons-container {
        display: block;
    }
    
    /* Agregar espacio extra después del menú de idiomas */
    .dropdown.megamenu.language-menu {
        margin-bottom: 40px;
        padding-bottom: 20px;
        border-bottom: 1px solid #eee;
    }
}

/* Ocultar iconos sociales originales en móvil */
@media (max-width: 991px) {
    #topbar .social-links {
        display: none !important;
    }
}





/* Tour_bcn_info_cssnuevo: Dos columnas, botones más cortos y alineados completamente a la izquierda en móvil */
@media (max-width: 767px) {
  .nav-tabs-custom {
    display: flex !important;
    flex-wrap: wrap;
    flex-direction: row !important;
    width: 100%;
    gap: 0;
    justify-content: flex-start; /* columnas alineadas a la izquierda */
  }
  .nav-tabs-custom .nav-item {
    flex: 0 0 48%;
    max-width: 48%;
    box-sizing: border-box;
    text-align: left;      /* Contenido de la columna a la izquierda */
    padding: 0em 0;
    margin: 0;
  }
  .nav-tabs-custom .feature-btn {
    width: 40%;            /* Botón corto */
    margin-left: 0;        /* Sin margen izquierdo */
    margin-right: 0;       /* Sin margen derecho */
    display: block;
    padding-left: 0em;
    padding-right: 0em;
    font-size: 15px;
    text-align: left;      /* Texto del botón a la izquierda */
  }
}







.sent-message {
  color: #fff;
  background: #009cde;
  text-align: center;
  padding: 15px;
  font-weight: 600;
  margin-bottom: 40px; /* Aumentado de 20px a 30px */
  border-radius: 5px;
}

.error-message {
  color: #fff;
  background: #ed3c0d;
  text-align: center;
  padding: 15px;
  font-weight: 600;
  margin-bottom: 40px;
  border-radius: 5px;
}



/* TOUR PRIVADO MIO BCND */
.tour-card-custom {
  background: #ededed;
  border-radius: 18px;
  padding: 28px 24px 24px 24px;
  max-width: 400px;
  margin: 0 auto 32px auto;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
  color: #111;
  font-family: 'Open Sans', Arial, sans-serif;
}

.tour-experiencia {
  background: #009cde;
  color: #fff;
  font-size: 13px;
  font-weight: 500;
  padding: 7px 14px;
  border-radius: 10px;
  display: inline-block;
  margin-bottom: 18px;
}

.tour-title {
  font-size: 21px;
  font-weight: 700;
  color: #111;
  margin-bottom: 16px;
}

.tour-info-box {
  background: #efefef;
  border-radius: 14px;
  padding: 14px 18px;
  margin-bottom: 18px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px 24px;
  font-size: 15px;
  color: #111;
}

.tour-info-box strong {
  color: #111;
  font-weight: 700;
}


.tour-info-box div {
    display: block;
    width: 100%;
    margin-bottom: 8px; /* Espacio entre cada elemento */
}

/* Si necesitas ajustar el último elemento para que no tenga margen inferior */
.tour-info-box div:last-child {
    margin-bottom: 0;
}



.tour-cancel {
  font-size: 16px;
  color: #111;
  margin-bottom: 18px;
  font-weight: 500;
}

.tour-price-box {
  background: #efefef;
  border-radius: 14px;
  padding: 22px 0;
  text-align: center;
  margin-top: 8px;
  margin-bottom: 14px;
}

.tour-price {
  color: #187bcd;
  font-size: 38px;
  font-weight: bold;
  line-height: 1;
  margin-right: 8px;
}

.tour-price-person {
  color: #111;
  font-size: 18px;
  font-weight: 500;
}

.tour-btn-box {
  display: flex;
  justify-content: center;
}

/* Estilos para el título con fondo azul y letra blanca */
/* Estilos para el título con fondo azul y letra blanca */
.experiencia-sefarad {
  background: #187bcd; /* Azul oscuro para el fondo */
  color: #fff; /* Letra blanca */
  padding: 15px 20px;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 600;
  text-align: center;
  margin-bottom: 10px;
  display: inline-block;
  width: 100%;
}

/* Estilo para el precio destacado */
.tour-price-destacado {
  color: #187bcd;
  font-size: 32px;
  font-weight: 700;
  line-height: 1.2;
  display: block;
  text-align: center;
  margin: 15px 0;
}

.tour-btn {
    background: #009cde !important; /* Mantiene el color azul */
    color: #fff !important;
    border-radius: 5px;
    padding: 15px 40px; /* Aumentado de 12px 32px */
    font-size: 18px; /* Aumentado de 16px */
    font-weight: 600;
    text-decoration: none;
    transition: background 0.3s;
    display: inline-block;
    width: 80%; /* Hace que el botón ocupe más espacio horizontal */
    text-align: center;
    margin: 0 auto;
}

.tour-btn-box {
    display: flex;
    justify-content: center;
    margin-bottom: 24px;
    width: 100%; /* Asegura que el contenedor ocupe todo el ancho disponible */
}

.tour-btn2 {
    background: #009cde !important; /* Mantiene el color azul */
    color: #fff !important;
    border-radius: 5px;
    padding: 15px 40px; /* Aumentado de 12px 32px */
    font-size: 18px; /* Aumentado de 16px */
    font-weight: 600;
    text-decoration: none;
    transition: background 0.3s;
    display: inline-block;
    width: 80%; /* Hace que el botón ocupe más espacio horizontal */
    text-align: center;
    margin: 0 auto;
}

.tour-btn2-box {
    display: flex;
    justify-content: center;
    margin-bottom: 24px;
    width: 100%; /* Asegura que el contenedor ocupe todo el ancho disponible */
}



/* Hacer que el contenedor use flexbox para alinear los elementos horizontalmente */
.tour-bottom-details {
  display: flex;
  justify-content: space-between; /* Distribuye los elementos: precio a la izquierda y botón a la derecha */
  align-items: center; /* Centra los elementos verticalmente */
  width: 100%;
  padding: 10px 0;
	  border-top: none !important;   /* Elimina la línea */
  padding-top: 6px !important;   /* Reduce el espacio superior, puedes ajustar este valor */
  margin-top: 8!important;      /* Elimina cualquier margen extra */
}

/* Ajustar el contenedor del precio */
.tour-price {
  display: flex;
  flex-direction: column; /* Organiza el texto principal y el texto pequeño en columna */
  align-items: flex-start; /* Alinea el contenido a la izquierda */
}

/* Ajustar el contenedor del botón */
.tour-links {
  display: flex;
  justify-content: flex-end; /* Asegura que el botón esté alineado a la derecha */
  align-items: center;
}

/* Estilo para el botón */
.book-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}



.tour-btn:hover {
  background: #187bcd !important; /* Un azul más oscuro al pasar el cursor */
}

.tour-btn2:hover {
  background: #187bcd !important; /* Un azul más oscuro al pasar el cursor */
}


/* Nuevo estilo para los botones de Features con mismo tamaño */
.features .feature-btn {
    background: #009cde;
    color: #fff;
    border-radius: 5px;
    padding: 8px 18px;
    white-space: nowrap;
    transition: 0.3s;
    font-size: 14px;
    display: inline-block;
    width: 180px; /* Ancho fijo para todos los botones */
    text-align: center;
    margin: 0 5px; /* Espacio horizontal entre botones */
    margin-bottom: 10px; /* Espacio vertical si los botones se apilan */
}

.features .feature-btn:hover {
    background: #187bcd;
    color: #fff;
}

/* Contenedor para los botones */
.features .feature-btn-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; /* Centra los botones horizontalmente */
    gap: 15px; /* Espacio uniforme entre botones (alternativa moderna al margin) */
}



/* Estilo para que el portfolio-details tenga el mismo fondo que tour-card-custom */
.portfolio-details {
    background: #ededed;
    padding: 30px 0;
}

.portfolio-details .portfolio-info {
    background: #ededed;
    border-radius: 18px;
    padding: 28px 24px 24px 24px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    color: #111;
    font-family: 'Open Sans', Arial, sans-serif;
}

/* Estilos para el slider de imágenes */
.portfolio-details-slider {
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

.portfolio-details-slider .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Ajustar el contenedor principal */
.portfolio-details .container {
    background: #ededed;
    border-radius: 18px;
}




/* Contenedor principal de destinos */
.destinations-grid {
  display: grid;
  gap: 20px;
  padding: 20px 0;
}

/* Configuración responsive del grid */
/* Móvil: 2 columnas */
.destinations-grid {
  grid-template-columns: repeat(2, 1fr);
}

/* Tablet: 2 columnas */
@media (min-width: 768px) and (max-width: 1023px) {
  .destinations-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 25px;
  }
}

/* Desktop: 5 columnas (2 filas de 5) */
@media (min-width: 1024px) {
  .destinations-grid {
    grid-template-columns: repeat(5, 1fr);
    gap: 30px;
  }
}

/* Estilos para cada item de destino - alturas ajustadas */
.destination-item {
  position: relative;
  height: 100px; /* Base para móvil - más corto */
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
  transition: transform 0.3s ease, box-shadow 0.3s ease, background-size 0.5s ease;
  background-size: 120%; /* Imagen ampliada por defecto */
  background-position: center;
  background-repeat: no-repeat;
}

/* Altura en móvil - más corta */
@media (max-width: 767px) {
  .destination-item {
    height: 100px; /* Más corto que antes (era 120px) */
  }
}

/* Altura en tablet - mantener igual */
@media (min-width: 768px) and (max-width: 1023px) {
  .destination-item {
    height: 150px; /* Mantener altura actual */
  }
}

/* Altura en desktop - un poco más largo */
@media (min-width: 1024px) {
  .destination-item {
    height: 140px; /* Un poco más largo que antes (era 110px) */
  }
}

/* Efecto hover - imagen se reduce (zoom out) y elevación */
.destination-item:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
  background-size: 100%; /* Se reduce en hover - efecto inverso */
}

/* Overlay oscuro para mejorar legibilidad del texto */
.destination-item::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(135deg, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.6) 100%);
  transition: opacity 0.3s ease;
  z-index: 1;
}

.destination-item:hover::before {
  opacity: 0.8;
}

/* Estilos para el enlace */
.destination-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  text-decoration: none;
  position: relative;
  z-index: 2;
  transition: all 0.3s ease;
}

.destination-link:hover {
  text-decoration: none;
}

/* Estilos para el título */
.destination-item h4 {
  color: white;
  font-size: 1.2rem;
  font-weight: 700;
  text-align: center;
  margin: 0;
  padding: 10px;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
  transition: all 0.3s ease;
  line-height: 1.2;
}

/* Efecto hover en el título */
.destination-item:hover h4 {
  transform: scale(1.05);
  text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.9);
}

/* Ajustes de fuente para móvil */
@media (max-width: 767px) {
  .destination-item h4 {
    font-size: 1rem;
  }
}

/* Ajustes de fuente para tablet */
@media (min-width: 768px) and (max-width: 1023px) {
  .destination-item h4 {
    font-size: 1.1rem;
  }
}

/* Ajustes de fuente para desktop */
@media (min-width: 1024px) {
  .destination-item h4 {
    font-size: 1rem;
  }
}

/* Animación de entrada para los items */
.destination-item {
  opacity: 0;
  animation: fadeInUp 0.6s ease forwards;
}

.destination-item:nth-child(1) { animation-delay: 0.1s; }
.destination-item:nth-child(2) { animation-delay: 0.2s; }
.destination-item:nth-child(3) { animation-delay: 0.3s; }
.destination-item:nth-child(4) { animation-delay: 0.4s; }
.destination-item:nth-child(5) { animation-delay: 0.5s; }
.destination-item:nth-child(6) { animation-delay: 0.6s; }
.destination-item:nth-child(7) { animation-delay: 0.7s; }
.destination-item:nth-child(8) { animation-delay: 0.8s; }
.destination-item:nth-child(9) { animation-delay: 0.9s; }
.destination-item:nth-child(10) { animation-delay: 1s; }

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}




















/* Estilos para el Banner de Cookies RGPD */
#cookie-banner {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background: #fff;
  box-shadow: 0 -2px 8px rgba(0,0,0,0.1);
  padding: 20px;
  z-index: 9999;
  border-top: 3px solid #009cde;
  font-family: var(--font-default);
}

#cookie-banner .cookie-container {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}

#cookie-banner p {
  margin-right: 20px;
  color: #333;
  font-size: 14px;
  flex: 1;
}

#cookie-banner a {
  color: #009cde;
  text-decoration: none;
  font-weight: 600;
}

#cookie-banner .cookie-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

#accept-cookies {
  background: #009cde;
  color: #fff;
  border: none;
  border-radius: 5px;
  padding: 8px 18px;
  font-size: 14px;
  cursor: pointer;
  transition: 0.3s;
  font-weight: 600;
}

#accept-cookies:hover {
  background: #187bcd;
}

#reject-cookies {
  background: #e4e4e4;
  color: #333;
  border: none;
  border-radius: 5px;
  padding: 8px 18px;
  font-size: 14px;
  cursor: pointer;
  transition: 0.3s;
  font-weight: 600;
}

#reject-cookies:hover {
  background: #d0d0d0;
}

#customize-cookies {
  background: #fff;
  color: #009cde;
  border: 1px solid #009cde;
  border-radius: 5px;
  padding: 8px 18px;
  font-size: 14px;
  cursor: pointer;
  transition: 0.3s;
  font-weight: 600;
}

#customize-cookies:hover {
  background: #f5f9ff;
}

/* Modal de personalización */
#cookie-customize-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0,0,0,0.5);
  z-index: 10000;
  font-family: var(--font-default);
}

#cookie-customize-modal .modal-content {
  background: #fff;
  padding: 30px;
  max-width: 500px;
  margin: 100px auto;
  border-radius: 10px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.1);
}

#cookie-customize-modal h3 {
  color: #187bcd;
  font-size: 22px;
  margin-bottom: 20px;
  padding-bottom: 15px;
  border-bottom: 1px solid #eee;
}

#cookie-customize-modal .cookie-option {
  display: flex;
  align-items: center;
  margin-bottom: 15px;
  font-size: 14px;
}

#cookie-customize-modal .cookie-option input {
  margin-right: 10px;
}

#cookie-customize-modal .cookie-option .option-info {
  display: block;
}

#cookie-customize-modal .cookie-option strong {
  display: block;
  color: #333;
  margin-bottom: 5px;
}

#cookie-customize-modal .cookie-option span {
  color: #777;
  font-size: 13px;
}

#save-cookies {
  background: #009cde;
  color: #fff;
  border: none;
  border-radius: 5px;
  padding: 10px 25px;
  font-size: 14px;
  cursor: pointer;
  transition: 0.3s;
  font-weight: 600;
  display: block;
  margin: 0 auto;
}

#save-cookies:hover {
  background: #187bcd;
}

/* Estilos responsivos */
@media (max-width: 768px) {
  #cookie-banner p {
    margin-bottom: 15px;
    margin-right: 0;
  }
  
  #cookie-banner .cookie-buttons {
    width: 100%;
    justify-content: center;
  }
  
  #cookie-customize-modal .modal-content {
    margin: 20px;
    max-width: calc(100% - 40px);
  }
}



/*--------------------------------------------------------------
# Blog
--------------------------------------------------------------*/
.flag-icon {
  width: 24px;
  height: 16px;
  margin-right: 8px;
  vertical-align: middle;
}

.language-selector {
  display: flex !important;
  align-items: center;
  justify-content: flex-start !important;
  text-align: left !important;
}

.language-item {
  display: flex !important;
  align-items: center;
  justify-content: flex-start !important;
  text-align: left !important;
}

.dropdown.megamenu.language-menu ul li a {
  display: flex !important;
  align-items: center;
  justify-content: flex-start !important;
  text-align: left !important;
}

.language-flags {
  border: none !important;
  margin-bottom: 0px;
  text-align: left !important;
}

.flag-icon {
  margin-right: 8px;
  vertical-align: middle;
}

/* Eliminar cualquier padding o margen que pueda afectar la alineación */
.x-anchor-content {
  padding-left: 0px !important;
}

.x-anchor-text {
  margin-left: 0px !important;
}





.dropdown.megamenu.language-menu ul li {
  padding: 0;
}

.dropdown.megamenu.language-menu ul li a {
  display: flex;
  align-items: center;
  padding: 8px 15px;
  text-align: left;
}

.dropdown.megamenu.language-menu ul li a img {
  width: 20px;
  height: 14px;
  margin-right: 10px;
  vertical-align: middle;
}

#mini-hero-static {
    width: 100%;
    height: 35vh;
    position: relative;
    padding: 0;
    margin-top: 0;
    overflow: hidden;
}

#mini-hero-static .hero-background {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
}

#mini-hero-static::before {
    content: "";
    background-color: rgba(0, 0, 0, 0.3);
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 1;
}

#mini-hero-static .hero-container {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
    z-index: 2;
}

#mini-hero-static .hero-content {
    text-align: center;
    position: relative;
    z-index: 3;
}

#mini-hero-static h1 {
    color: #fff;
    font-size: 30px;
    font-weight: 700;
    margin: 0;
    margin-top: 100px;
}

/* Estilos responsivos */
@media (max-width: 768px) {
    #mini-hero-static {
        height: 30vh;
    }
    
    #mini-hero-static h1 {
        font-size: 28px;
    }
}

/* === AJUSTES PARA MÓVILES Y TABLETS === */

/* Móviles en vertical - fondo un poco más grande */
@media (max-width: 768px) and (orientation: portrait) {
    #mini-hero-static {
        height: 25vh;
        margin-top: 30px;
    }
    
    #mini-hero-static h1 {
        margin-top: 80px;
		 font-size: 24px;
    }
}

/* Tablets en vertical - fondo un poco más grande */
@media (min-width: 769px) and (max-width: 1024px) and (orientation: portrait) {
    #mini-hero-static {
        height: 30vh;
        margin-top: 25px;
    }
    
    #mini-hero-static h1 {
        margin-top: 90px;
		 font-size: 24px;
    }
}

/* Móviles en horizontal - más grande para ver toda la foto */
@media (max-width: 768px) and (orientation: landscape) {
    #mini-hero-static {
        height: 60vh;
        margin-top: 50px;
    }
    
    #mini-hero-static h1 {
        margin-top: 80px;
        font-size: 20px;
    }
}

/* Tablets en horizontal - más grande para ver toda la foto */
@media (min-width: 769px) and (max-width: 1024px) and (orientation: landscape) {
    #mini-hero-static {
        height: 50vh;
        margin-top: 40px;
    }
    
    #mini-hero-static h1 {
        margin-top: 70px;
        font-size: 24px;
    }
}



/* Estilos para hacer que toda la tarjeta sea clickable */
.hotel-card {
  position: relative;
}

.hotel-card .tour-link {
  text-decoration: none;
  color: inherit;
  display: block;
}

/* Efecto de zoom en la imagen */
.zoom-effect {
  overflow: hidden;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.zoom-effect img {
  width: 100%;
  height: auto;
  transition: transform 0.5s ease;
}

.hotel-card:hover .zoom-effect img {
  transform: scale(1.2);
}



.tour-card {
  display: flex;
  flex-direction: column;
  height: 100%;
}


/* Cambiar .hotel-top-details por .tour-top-details */
.tour-top-details {
    overflow: hidden;
    border-top: 0px solid #eee;
    padding-top: 0px;
    margin-bottom: 15px;
}


.tour-top-details div {
    float: left;
    width: 50%;
}

/* Cambiar .hotel-price por .tour-price */
.tour-price {
    font-size: 18px;
    color: #187bcd;
    font-weight: 600;
}

.tour-price small {
    font-size: 80%;
    font-weight: 400;
    color: #2c2c2c;
    display: inline-block;
    margin-right: 5px;
    margin-top: 5px;
}

/* Cambiar .hotel-links por .tour-links */
.tour-links {
    text-align: right;
}

.tour-links a {
    background: #009cde;
    color: #187bcd;
    border-radius: 5px;
    padding: 8px 18px;
    white-space: nowrap;
    transition: 0.3s;
    font-size: 14px;
    display: inline-block;
}


/* Estilo para el botón de reserva */
.book-button {
  background: #009cde;
  color: #fff;
  border-radius: 5px;
  padding: 8px 18px;
  white-space: nowrap;
  transition: 0.3s;
  font-size: 14px;
  display: inline-block;
}

.book-button, .tour-links a {
  padding: 8px 12px; /* Reducido de 18px a 12px en los lados */
  font-size: 13px; /* Reducir ligeramente el tamaño de fuente */
}


.hotel-card:hover .book-button {
  background: #187bcd;
}


@media (max-width: 576px) {
  .tour-links {
    flex-wrap: nowrap; /* Evita que los elementos se apilen */
  }
  
  .book-button {
    padding: 6px 12px; /* Botón más pequeño en móviles */
    font-size: 12px;
  }
}







.alignbutton .gb-inside-container {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.alignbutton .gb-inside-container > *:last-child {
  margin-top: auto;
}

.hotel-card:hover .book-button {
  background: #187bcd;
}

.tour-tittle {
    font-size: 21px;
    color: #009cde; /* Cambiamos de #fff a #009cde */
    font-weight: 600;
    margin-bottom: 15px;
    margin-top: 15px;
}

.tour-tittle a {
    color: #009cde; /* Aseguramos que los enlaces también tengan el color azul */
    text-decoration: none;
    transition: 0.3s;
}

.tour-tittle a:hover {
    color: #187bcd; /* Color más oscuro al pasar el cursor */
}








.blog {
  padding: 40px 0 20px 0;

}

.blog .entry {
  padding: 30px;
  margin-bottom: 60px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
	
		border-radius: 10px;
	
}

.blog .entry .entry-img {
  max-height: 440px;
  margin: -30px -30px 20px -30px;
  overflow: hidden;
		border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}

.blog .entry .entry-title {
  font-size: 28px;
  font-weight: bold;
  padding: 0px;
  margin-bottom: 10px;
  margin: 0 0 20px 0;
}

.blog .entry .entry-title a {
  color: #009cde;
  transition: 0.3s;
}

.blog .entry .entry-title a:hover {
  color: #187bcd;;
}

.blog .entry .entry-meta {
  margin-bottom: 15px;
  color: #777777;
}

.blog .entry .entry-meta ul {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  align-items: center;
  padding: 0;
  margin: 0;
}

.blog .entry .entry-meta ul li + li {
  padding-left: 20px;
}

.blog .entry .entry-meta i {
  font-size: 16px;
  margin-right: 8px;
  line-height: 0;
}

.blog .entry .entry-meta a {
  color: #847872;
  font-size: 14px;
  display: inline-block;
  line-height: 1;
}

.blog .entry .entry-content p {
  line-height: 24px;
}

.blog .entry .entry-content .read-more {
  -moz-text-align-last: right;
  text-align-last: right;
}

.blog .entry .entry-content .read-more a {
  display: inline-block;
  background: #009cde;
  color: #fff;
  padding: 6px 20px;
  transition: 0.3s;
  font-size: 14px;
  border-radius: 4px;
}

.blog .entry .entry-content .read-more a:hover {
  background: #009cde;
}

.blog .entry .entry-content h3 {
  font-size: 22px;
  margin-top: 30px;
  font-weight: bold;
}

.blog .entry .entry-content blockquote {
  overflow: hidden;
  background-color: #fafafa;
  padding: 60px;
  position: relative;
  text-align: center;
  margin: 20px 0;
}

.blog .entry .entry-content blockquote p {
  color: #4d4643;
  line-height: 1.6;
  margin-bottom: 0;
  font-style: italic;
  font-weight: 500;
  font-size: 22px;
}

.blog .entry .entry-content blockquote::after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background-color: #009cde;
  margin-top: 20px;
  margin-bottom: 20px;
}

.blog .entry .entry-footer {
  padding-top: 10px;
  border-top: 1px solid #e6e6e6;
}

.blog .entry .entry-footer i {
  color: #5e5e5e;
  display: inline;
}

.blog .entry .entry-footer a {
  color: #1e1e1e;
  transition: 0.3s;
}

.blog .entry .entry-footer a:hover {
  color: #009cde;
}

.blog .entry .entry-footer .cats {
  list-style: none;
  display: inline;
  padding: 0 20px 0 0;
  font-size: 14px;
}

.blog .entry .entry-footer .cats li {
  display: inline-block;
}

.blog .entry .entry-footer .tags {
  list-style: none;
  display: inline;
  padding: 0;
  font-size: 14px;
}

.blog .entry .entry-footer .tags li {
  display: inline-block;
}

.blog .entry .entry-footer .tags li + li::before {
  padding-right: 6px;
  color: #6c757d;
  content: ",";
}

.blog .entry .entry-footer .share {
  font-size: 16px;
}

.blog .entry .entry-footer .share i {
  padding-left: 5px;
}

.blog .entry-single {
  margin-bottom: 30px;
}

.blog .blog-author {
  padding: 20px;
  margin-bottom: 20px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
	
		border-radius: 10px;
}

.blog .blog-author img {
  width: 120px;
  margin-right: 20px;
}

.blog .blog-author h4 {
  font-weight: 600;
  font-size: 22px;
  margin-bottom: 0px;
  padding: 0;
  color: #111;
}

.blog .blog-author .social-links {
  margin: 0 10px 10px 0;
}

.blog .blog-author .social-links a {
  color: rgba(17, 17, 17, 0.5);
  margin-right: 5px;
}

.blog .blog-author p {
  font-style: italic;
  color: #bfb9b6;
}

.blog .blog-comments {
  margin-bottom: 30px;
	
}

.blog .blog-comments .comments-count {
  font-weight: bold;
}

.blog .blog-comments .comment {
  margin-top: 30px;
  position: relative;
	
}

.blog .blog-comments .comment .comment-img {
  margin-right: 14px;
}

.blog .blog-comments .comment .comment-img img {
  width: 60px;
}

.blog .blog-comments .comment h5 {
  font-size: 16px;
  margin-bottom: 2px;
}

.blog .blog-comments .comment h5 a {
  font-weight: bold;
  color: #4d4643;
  transition: 0.3s;
}

.blog .blog-comments .comment h5 a:hover {
  color: #009cde;
}

.blog .blog-comments .comment h5 .reply {
  padding-left: 10px;
  color: #111;
}

.blog .blog-comments .comment h5 .reply i {
  font-size: 20px;
}

.blog .blog-comments .comment time {
  display: block;
  font-size: 14px;
  color: #009cde;
  margin-bottom: 5px;
}

.blog .blog-comments .comment.comment-reply {
  padding-left: 40px;
}

.blog .blog-comments .reply-form {
  margin-top: 30px;
  padding: 30px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

.blog .blog-comments .reply-form h4 {
  font-weight: bold;
  font-size: 22px;
}

.blog .blog-comments .reply-form p {
  font-size: 14px;
}

.blog .blog-comments .reply-form input {
  border-radius: 4px;
  padding: 10px 10px;
  font-size: 14px;
}

.blog .blog-comments .reply-form input:focus {
  box-shadow: none;
  border-color: #009cde;
}

.blog .blog-comments .reply-form textarea {
  border-radius: 4px;
  padding: 10px 10px;
  font-size: 14px;
}

.blog .blog-comments .reply-form textarea:focus {
  box-shadow: none;
  border-color: #009cde;
}

.blog .blog-comments .reply-form .form-group {
  margin-bottom: 25px;
}

.blog .blog-comments .reply-form .btn-primary {
  border-radius: 4px;
  padding: 10px 20px;
  border: 0;
  background-color: #111;
}

.blog .blog-comments .reply-form .btn-primary:hover {
  background-color: #1e1e1e;
}

.blog .blog-pagination {
  color: #444444;
}

.blog .blog-pagination ul {
  display: flex;
  padding: 0;
  margin: 0;
  list-style: none;
}

.blog .blog-pagination li {
  margin: 0 5px;
  transition: 0.3s;
}

.blog .blog-pagination li a {
  color: #111;
  padding: 7px 16px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.blog .blog-pagination li.active, .blog .blog-pagination li:hover {
  background: #1bbd36;
}

.blog .blog-pagination li.active a, .blog .blog-pagination li:hover a {
  color: #fff;
}

.blog .sidebar {
  padding: 20px;
  
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
	
  border-radius: 10px;
  margin-bottom: 30px;
}

.blog .sidebar .sidebar-title {
  font-size: 24px;
  font-weight: 700;
  padding: 0 0 0 0;
  margin: 0 0 15px 0;
  color: #111;
  position: relative;
}

.blog .sidebar .sidebar-item {
  margin-bottom: 30px;
}

.blog .sidebar .search-form form {
  background: #fff;
  border: 1px solid #ddd;
  padding: 3px 10px;
  position: relative;
}

.blog .sidebar .search-form form input[type="text"] {
  border: 0;
  padding: 4px;
  border-radius: 4px;
  width: calc(100% - 40px);
}

.blog .sidebar .search-form form button {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  border: 0;
  background: none;
  font-size: 16px;
  padding: 0 15px;
  margin: -1px;
  color: #fff;
  transition: 0.3s;
  border-radius: 0 4px 4px 0;
  line-height: 0;
}

.blog .sidebar .search-form form button i {
  line-height: 0;
}

.blog .sidebar .search-form form button:hover {
  background: #009cde;
}

.blog .sidebar .categories ul {
  list-style: none;
  padding: 0;
}

.blog .sidebar .categories ul li + li {
  padding-top: 10px;
}

.blog .sidebar .categories ul a {
  color: #111;
  transition: 0.3s;
}

.blog .sidebar .categories ul a:hover {
  color: #009cde;
}

.blog .sidebar .categories ul a span {
  padding-left: 5px;
  color: #b4aca8;
  font-size: 14px;
}

.blog .sidebar .recent-posts .post-item + .post-item {
  margin-top: 30px;
}

.blog .sidebar .recent-posts img {
  width: 80px;
  float: left;
	border-radius: 5px;
}

.blog .sidebar .recent-posts h4 {
  font-size: 15px;
  margin-left: 95px;
  font-weight: bold;
}

.blog .sidebar .recent-posts h4 a {
  color: #111;
  transition: 0.3s;
}

.blog .sidebar .recent-posts h4 a:hover {
  color: #009cde;
}

.blog .sidebar .recent-posts time {
  display: block;
  margin-left: 95px;
  font-style: italic;
  font-size: 14px;
  color: #b4aca8;
}

.blog .sidebar .tags {
  margin-bottom: -10px;
}

.blog .sidebar .tags ul {
  list-style: none;
  padding: 0;
}

.blog .sidebar .tags ul li {
  display: inline-block;
}

.blog .sidebar .tags ul a {
  color: #515151;
  font-size: 14px;
  padding: 6px 14px;
  margin: 0 6px 8px 0;
  border: 1px solid #c4c4c4;
  display: inline-block;
  transition: 0.3s;
}

.blog .sidebar .tags ul a:hover {
  color: #fff;
  border: 1px solid #009cde;
  background: #009cde;
}

.blog .sidebar .tags ul a span {
  padding-left: 5px;
  color: #aaaaaa;
  font-size: 14px;
}




/* Smooth scroll behavior */
:root {
  scroll-behavior: smooth;
}

/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
body {
  font-family: var(--font-default);
  color: #000;
}

a {
  color: #009cde;
  text-decoration: none;
}

a:hover {
  color: #187bcd;
  text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
}


/*--------------------------------------------------------------
# Sections & Section Header
--------------------------------------------------------------*/
section {
  overflow: hidden;
  padding: 80px 0;
}

.section-bg {
  background-color: #eee;
}

.section-header {
  text-align: center;
  padding-bottom: 30px;
}

.section-header h2 {
  font-size: 13px;
  letter-spacing: 1px;
  font-weight: 400;
  margin: 0;
  padding: 0;
  color: #7f7f90;
  text-transform: uppercase;
  font-family: var(--font-default);
}

.section-header p {
  margin: 0;
  font-size: 48px;
  font-weight: 400;
  font-family: var(--font-primary);
}

.section-header p span {
  color: var(--color-primary);
}

/*--------------------------------------------------------------
# Back to top button
--------------------------------------------------------------*/
.back-to-top {
  position: fixed;
  visibility: hidden;
  opacity: 0;
  right: 15px;
  bottom: 15px;
  z-index: 996;
  background: #009cde;
  width: 40px;
  height: 40px;
  border-radius: 4px;
  transition: all 0.4s;
}
.back-to-top i {
  font-size: 28px;
  color: #fff;
  line-height: 0;
}
.back-to-top:hover {
  background: #187bcd;;
  color: #fff;
}
.back-to-top.active {
  visibility: visible;
  opacity: 1;
}

/*--------------------------------------------------------------
# Top Bar
--------------------------------------------------------------*/


#topbar {
  background: #009cde;
  border-bottom: 1px solid #eee;
  font-size: 14px;
  height: 44px;
  padding: 0;
  transition: all 0.5s;
  overflow: hidden;
  z-index: 996;
}

#topbar.topbar-scrolled {
  top: -44px;
}
#topbar .contact-info i {
  font-style: normal;
  color: #C7C6C6;
}
#topbar .contact-info i a, #topbar .contact-info i span {
  padding-left: 5px;
  color: #fff;
}
#topbar .contact-info i a {
  line-height: 0;
  transition: 0.3s;
}
#topbar .contact-info i a:hover {
  color: #C7C6C6;
}

#topbar .social-links a {
    color: #fff;
    padding: 4px 12px;
    display: inline-block;
    line-height: 1px;
    transition: 0.3s;
    border-left: 1px solid #e9e9e9;
}

#topbar .social-links a:hover {
    color: #C7C6C6;
}

#topbar .social-links a:first-child {
    border-left: 0;
}
También necesitas eliminar cualquier código CSS que hayas agregado para móvil relacionado con .social-links o .mobile-social-icons. Busca y elimina estas secciones:

css
/* Elimina cualquier código que contenga esto: */
@media (max-width: 768px) {
    .social-links {
        /* cualquier código aquí */
    }
    
    .mobile-social-icons {
        /* cualquier código aquí */
    }
    
    #topbar .social-links {
        /* cualquier código aquí */
    }
}
Para restaurar completamente tu CSS original:

Elimina todo el código CSS que agregaste para móvil

Mantén solo el CSS original de arriba

Guarda el archivo y limpia la caché del navegador (Ctrl+F5)

Esto debería devolver los iconos de redes sociales a su posición y estilo original tanto en escritorio como en móvil.

Preguntas relacionadas
Cuál sería un CSS original para personalizar mis iconos sociales y que no me guste?
Qué estilos puedo aplicar en CSS para cambiar la apariencia de los iconos sociales en mi barra superior
Cómo puedo modificar el tamaño y el espacio de los iconos sociales usando CSS sin afectar otras partes del sitio
Qué reglas CSS específicas puedo usar para que los iconos sociales tengan un diseño diferente al actual
Cómo puedo obtener un ejemplo completo de CSS original para redes sociales que pueda editar fácilmente



/**
* Appointment Button *
*/
.appointment-btn {
  margin-left: 25px;
  background: #009cde;
  color: #fff;
  border-radius: 5px;
  padding: 8px 25px;
  white-space: nowrap;
  transition: 0.3s;
  font-size: 14px;
  display: inline-block;
	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
}
.appointment-btn:hover {
  background: #187bcd;
  color: #fff;
}


.appointment2-btn {
 
  background: #009cde;
  color: #fff;
  border-radius: 5px;
  padding: 8px 25px;
  white-space: nowrap;
  transition: 0.3s;
  font-size: 14px;
  display: inline-block;
	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
}
.appointment2-btn:hover {
  background: #187bcd;
  color: #fff;
}

.moretours-btn {
 
  background: #009cde;
  color: #fff;
  border-radius: 5px;
  padding: 10px 25px;
  white-space: nowrap;
  transition: 0.3s;
  font-size: 14px;
  display: inline-block;
font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;

}
.moretours-btn:hover {
 background: #187bcd;
  color: #fff;
}

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
#header {
  height: 70px;
  z-index: 997;
  transition: all 0.5s;
  background: #fff;
  top: 44px;
}
#header.header-scrolled {
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
  top: 0;
}
#header .logo h1 {
  font-size: 28px;
  margin: 0;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 1px;
}
#header .logo h1 a, #header .logo h1 a:hover {
  color: #1d5ebc;
  text-decoration: none;
}
#header .logo h1 a span, #header .logo h1 a:hover span {
	color: #009cde;
}
#header .logo img {
  padding: 0;
  margin: 0;
  max-height: 40px;
}

/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
/**
* Desktop Navigation 
*/
.navbar {
  padding: 0;
}
.navbar ul {
  margin: 0;
  padding: 0;
  display: flex;
  list-style: none;
  align-items: center;
}
.navbar li {
  position: relative;
}
.navbar a, .navbar a:focus {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 10px 0 10px 30px;
	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
	font-size: 13px;
	font-weight: 600;
	color: #333333;
	white-space: nowrap;
	text-transform: uppercase;
	transition: 0.3s;
}
.navbar a i, .navbar a:focus i {
  font-size: 12px;
  line-height: 0;
  margin-left: 5px;
}
.navbar a:hover, .navbar .active, .navbar .active:focus, .navbar li:hover > a {
	color: #187bcd;
}
.navbar .dropdown ul {
  display: block;
  position: absolute;
  left: 30px;
  top: calc(100% + 30px);
  margin: 0;
  padding: 10px 0;
  z-index: 99;
  opacity: 0;
  visibility: hidden;
  background: #fff;
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
  transition: 0.3s;
}
.navbar .dropdown ul li {
  min-width: 200px;
}


.navbar .dropdown ul a {
  font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
}

.navbar .dropdown ul a:hover {
  color: #187bcd;
  background-color: #f5f5f5;
}


.navbar .dropdown ul a i {
  font-size: 12px;
}
.navbar .dropdown ul a:hover, .navbar .dropdown ul .active:hover, .navbar .dropdown ul li:hover > a {
  color: #187bcd;
}
.navbar .dropdown:hover > ul {
  opacity: 1;
  top: 100%;
  visibility: visible;
}
.navbar .dropdown .dropdown ul {
  top: 0;
  left: calc(100% - 30px);
  visibility: hidden;
}
.navbar .dropdown .dropdown:hover > ul {
  opacity: 1;
  top: 0;
  left: 100%;
  visibility: visible;
}
@media (max-width: 1366px) {
  .navbar .dropdown .dropdown ul {
    left: -90%;
  }
  .navbar .dropdown .dropdown:hover > ul {
    left: -100%;
  }
}

/**
* Mobile Navigation 


/**
* Mobile Navigation
*/
.mobile-nav-toggle {
  color: #5D5D5D;
  font-size: 28px;
  cursor: pointer;
  display: none;
  line-height: 0;
  transition: 0.5s;
}

.mobile-nav-toggle.bi-x {
  color: #fff;
}

@media (max-width: 991px) {
  .mobile-nav-toggle {
    display: block;
  }

  .navbar ul {
    display: none;
  }
}

.navbar-mobile {
  position: fixed;
  overflow: hidden;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  background: rgba(31, 38, 39, 0.9);
  transition: 0.3s;
  z-index: 999;
}

.navbar-mobile .mobile-nav-toggle {
  position: absolute;
  top: 15px;
  right: 15px;
}

.navbar-mobile ul {
  display: block;
  position: absolute;
  top: 55px;
  right: 15px;
  bottom: 15px;
  left: 15px;
  padding: 10px 0;
  background-color: #fff;
  overflow-y: auto;
  transition: 0.3s;
}

.navbar-mobile a, .navbar-mobile a:focus {
  padding: 10px 20px;
  font-size: 15px;
  color: #354144;
}

.navbar-mobile a:hover, .navbar-mobile .active, .navbar-mobile li:hover > a {
  color: rgba(0,0,0,0.8);
}

.navbar-mobile .getstarted, .navbar-mobile .getstarted:focus {
  margin: 15px;
}

.navbar-mobile .dropdown ul {
  position: static;
  display: none;
  margin: 10px 20px;
  padding: 10px 0;
  z-index: 99;
  opacity: 1;
  visibility: visible;
  background: #fff;
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
}

.navbar-mobile .dropdown ul li {
  min-width: 200px;
}

.navbar-mobile .dropdown ul a {
  padding: 10px 20px;
}

.navbar-mobile .dropdown ul a i {
  font-size: 12px;
}

.navbar-mobile .dropdown ul a:hover, .navbar-mobile .dropdown ul .active:hover, .navbar-mobile .dropdown ul li:hover > a {
  color: rgba(0,0,0,0.8);
}

.navbar-mobile .dropdown > .dropdown-active {
  display: block;
}



/*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/
#hero {
  width: 100%;
  height: 70vh;
  background-color: rgba(31, 38, 39, 0.8);
  overflow: hidden;
  position: relative;
  padding: 0;
  margin-top: 114px;
}
#hero .carousel-item {
  width: 100%;
  height: 70vh;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
}
#hero .carousel-item::before {
  content: "";
  background-color: rgba(0, 0, 0, 0.3);
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
}
#hero .carousel-container {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  bottom: 0;
  top: 0;
  left: 0;
  right: 0;
}
#hero .carousel-content {
  text-align: center;
}
#hero h1 {
  color: #fff;
  margin-bottom: 30px;
  font-size: 48px;
  font-weight: 700;
}
#hero h2 {
  color: #fff;
  margin-bottom: 30px;
  font-size: 48px;
  font-weight: 700;
}
#hero p {
  width: 80%;
  -webkit-animation-delay: 0.4s;
  animation-delay: 0.4s;
  margin: 0 auto 30px auto;
  color: #fff;
}
#hero .carousel-inner .carousel-item {
  transition-property: opacity;
  background-position: center top;
}
#hero .carousel-inner .carousel-item,
#hero .carousel-inner .active.carousel-item-start,
#hero .carousel-inner .active.carousel-item-end {
  opacity: 0;
}
#hero .carousel-inner .active,
#hero .carousel-inner .carousel-item-next.carousel-item-start,
#hero .carousel-inner .carousel-item-prev.carousel-item-end {
  opacity: 6;
  transition: 0.5s;
}
#hero .carousel-inner .carousel-item-next,
#hero .carousel-inner .carousel-item-prev,
#hero .carousel-inner .active.carousel-item-start,
#hero .carousel-inner .active.carousel-item-end {
  left: 0;
  transform: translate3d(0, 0, 0);
}
#hero .carousel-control-prev, #hero .carousel-control-next {
  width: 10%;
}
#hero .carousel-control-next-icon, #hero .carousel-control-prev-icon {
  background: none;
  font-size: 48px;
  line-height: 1;
  width: auto;
  height: auto;
}
#hero .carousel-indicators li {
  cursor: pointer;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  margin: 0 4px;
  transition: ease-in;
  opacity: 0.1;
}
#hero .carousel-indicators li.active {
  opacity: 0.11;
  background-color: #959595;
}
#hero .btn-get-started {
  font-family: "Raleway", sans-serif;
  font-weight: 500;
  font-size: 14px;
  letter-spacing: 1px;
  display: inline-block;
  padding: 14px 32px;
  border-radius: 5px;
  transition: 0.5s;
  line-height: 1;
  margin: 10px;
  color: #fff;
  background: #009cde;
  -webkit-animation-delay: 0.8s;
  animation-delay: 0.8s;
}
#hero .btn-get-started:hover {
  background: #187bcd;
}
@media (max-width: 768px) {
  #hero {
    height: 45vh;
  }
  #hero .carousel-item {
    height: 45vh;
  }
	  #hero h1 {
    font-size: 28px;
  }
  #hero h2 {
    font-size: 28px;
  }
}
@media (min-width: 1024px) {
  #hero p {
    width: 60%;
  }
  #hero .carousel-control-prev, #hero .carousel-control-next {
    width: 5%;
  }
}
@media (max-height: 500px) {
  #hero {
    height: 150vh;
  }
  #hero .carousel-item {
    height: 150vh;
  }
}



/*--------------------------------------------------------------
# Sections General
--------------------------------------------------------------*/
section {
  padding-top: 30px 0;
	padding-botton: 20px;
}

.section-bg {
	background-color: #FBFBFB;
}

/*** Section Title ***/
.section-title {
    position: relative;
    display: inline-block;
    text-transform: uppercase;
}

.section-title::before {
    position: absolute;
    content: "";
    width: calc(100% + 80px);
    height: 2px;
    top: 4px;
    left: -40px;
    background: #187bcd;
    z-index: -1;
}

.section-title::after {
    position: absolute;
    content: "";
    width: calc(100% + 120px);
    height: 2px;
    bottom: 5px;
    left: -60px;
    background: #187bcd;
    z-index: -1;
}

.section-title.text-start::before {
    width: calc(100% + 40px);
    left: 0;
}

.section-title.text-start::after {
    width: calc(100% + 60px);
    left: 0;
}

@media (max-width: 575px) {
  .section-title h2 {
    font-size: 28px;
    margin-bottom: 15px;
  }
  .section-title span {
    font-size: 38px;
  }
}



.section-title2 {
  text-align: center;
  padding-bottom: 20px;
}

.section-title2 h2 {
  font-size: 32px;
  font-weight: 700;
  margin-bottom: 15px;
  padding-bottom: 25px;
  position: relative;
  color: #353535;
	
	
}

.section-title2 h2:after {
  content: "";
  position: absolute;
  display: block;
  width: 60px;
  height: 4px;
  background: #187bcd;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}

.section-title2 p {
  margin-bottom: 0;
  color: #353535;
}





.section-hotel2 {
    padding-bottom: 20px;
}

.section-hotel2 h2 {
  font-size: 32px;
  font-weight: 700;
  margin-bottom: 15px;
  padding-bottom: 25px;
  position: relative;
  color: #353535;
	
	
}

.section-hotel2 h2:after {
  content: "";
  position: absolute;
  display: block;
  width: 60px;
  height: 4px;
  background: #187bcd;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}

.section-hotel2 p {
  margin-bottom: 0PX;
  color: #353535;
}



/*--------------------------------------------------------------
# Card General
--------------------------------------------------------------*/
@media (max-width: 767px) {

  .card-box-a,
  .card-box-b,
  .card-box-c,
  .card-box-d {
    margin-bottom: 2.5rem;
  }
}

.card-box-a span,
.card-box-b span,
.card-box-c span,
.card-box-d span {
  line-height: 0;
}

@media (min-width: 768px) {

  .grid .card-box-a,
  .grid .card-box-b,
  .grid .card-box-c,
  .grid .card-box-d {
    margin-bottom: 2.5rem;
  }
}

.card-box-a,
.card-box-b,
.card-box-d {
  position: relative;
  overflow: hidden;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.card-box-a .img-a,
.card-box-a .img-b,
.card-box-b .img-a,
.card-box-b .img-b {
  transition: 0.8s all ease-in-out;
}

@media (min-width: 768px) {

  .card-box-a:hover .img-a,
  .card-box-a:hover .img-b,
  .card-box-b:hover .img-a,
  .card-box-b:hover .img-b {
    transform: scale(1.2);
  }
	
}

@media (min-width: 768px) {

  .card-box-a .price-a,
  .card-box-b .price-a {
    font-size: 0.9rem;
  }
}

@media (min-width: 992px) {

  .card-box-a .price-a,
  .card-box-b .price-a {
    font-size: 1rem;
  }
}

.card-overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
	botton: 0;
}

.card-shadow {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.card-shadow:before {
  content: " ";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 27%, rgba(0, 0, 0, 0.65) 90%);
}

/*======================================
//--//   PROPERTY - CARD-A
======================================*/
@media (min-width: 768px) {
  .card-box-a:hover .card-overlay-a-content {
    bottom: 60px;
	  
  }
}

@media (min-width: 768px) and (min-width: 768px) {
  .card-box-a:hover .card-overlay-a-content {
    bottom: 60px;
  }
}

@media (min-width: 768px) and (min-width: 992px) {
  .card-box-a:hover .card-overlay-a-content {
    bottom: 64px;
  }
}

@media (min-width: 768px) {
  .card-box-a:hover .card-body-a {
    padding-bottom: 1rem;
  }
}

@media (max-width: 767px) {
  .card-box-a .card-overlay-a-content {
    bottom: 65px;
  }

  .card-box-a .card-body-a {
    padding-bottom: 1rem;
  }
}

.card-overlay-a-content {
  transition: all 0.5s ease-in;
  position: absolute;
  width: 70%;
  bottom: 10px;
  z-index: 2;
	 
}

@media (min-width: 768px) {
  .card-overlay-a-content {
    bottom: 120px;
  }
}

@media (min-width: 992px) {
  .card-overlay-a-content {
    bottom: 0px;
  }
}

.card-header-a {
  padding: 0 1rem;
}

.card-header-a .card-title-a {
  color: #353535;
  margin-bottom: 0;
  padding-bottom: 0.7rem;
	
}

.title-a2 {
  color: #353535;
  margin-bottom: 0;
  padding-bottom: 0.7rem;  
	font-size: 32px;
  font-weight: 700;
  padding-top: 20px;
  position: relative;
  
	
}

@media (min-width: 768px) {
  .card-header-a .card-title-a {
    font-size: 1.3rem;
  }
}

@media (min-width: 992px) {
  .card-header-a .card-title-a {
    font-size: 2rem;
  }
}

.card-header-a .card-title-a a {
  color: #ffffff;
  text-decoration: none;
	
}

.card-body-a {
  z-index: 2;
  transition: all 0.5s ease-in;
  padding: 0rem 1rem 2rem 1rem;
	
}

.card-body-a .price-box {
  padding-bottom: 0.5rem;
}

.price-a {
  color: #ffffff;
  padding: 0.6rem 0.8rem;
  background: #009cde;
  border: 2px solid #009cde;
  border-radius: 6px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.card-footer-a {
  width: 100%;
  position: absolute;
  z-index: 2;
  background-color: #009cde;
}

.card-info {
  list-style: none;
  margin-bottom: 0;
  padding: 0.5rem 0;
}

.card-info .card-info-title {
  font-size: 1rem;
  color: #313131;
}

@media (min-width: 768px) {
  .card-info .card-info-title {
    font-size: 0.9rem;
  }
}

@media (min-width: 992px) {
  .card-info .card-info-title {
    font-size: 1rem;
  }
}

.card-info li span {
  color: #ffffff;
  font-size: 0.9rem;
}

@media (min-width: 768px) {
  .card-info li span {
    font-size: 0.8rem;
  }
}

@media (min-width: 992px) {
  .card-info li span {
    font-size: 1rem;
  }
}

/*------/ Property Grid /-----*/
.property-grid .grid-option {
  text-align: right;
  margin-bottom: 2rem;
}

.property-grid .grid-option .custom-select {
  border-radius: 0;
  width: 200px;
  border-color: #313131;
}

.property-grid .grid-option .custom-select:hover,
.property-grid .grid-option .custom-select:active,
.property-grid .grid-option .custom-select:focus {
  border-color: #313131;
	
}

.property-grid .grid-option .custom-select option {
  border-color: #313131;
}




/*======================================
//--//   NEWS - CARD-B
======================================*/
.card-header-b {
  padding: 1rem;
  color: #ffffff;
  position: absolute;
  bottom: 20px;
  z-index: 2;
	
}

@media (min-width: 768px) {
  .card-header-b {
    bottom: 0px;
  }
}

@media (min-width: 992px) {
  .card-header-b {
    bottom: 20px;
  }
}

.card-header-b .category-b {
  font-size: 0.9rem;
  background-color: #888;
  padding: 0.3rem 0.7rem;
  color: #fff;
  letter-spacing: 0.03em;
  border-radius: 8px;
  text-decoration: none;
	
}

.card-header-b .title-2 {
  margin-bottom: 0;
  padding: 0.6rem 0;
  font-size: 1.5rem;
}

@media (min-width: 768px) {
  .card-header-b .title-2 {
    font-size: 1rem;
  }
}

@media (min-width: 992px) {
  .card-header-b .title-2 {
    font-size: 1.6rem;
  }
}

.card-header-b .title-2 a {
  color: #ffffff;
  text-decoration: none;
}

.card-header-b .date-b {
  color: #d8d8d8;
  font-size: 1rem;
}

@media (min-width: 768px) {
  .card-header-b .date-b {
    font-size: 0.9rem;
  }
}

@media (min-width: 992px) {
  .card-header-b .date-b {
    font-size: 1rem;
  }
}






/*--------------------------------------------------------------
# About
--------------------------------------------------------------*/
.about .icon-boxes h3 {
  font-size: 28px;
  font-weight: 700;
  color: #009cde;;
  margin-bottom: 15px;
}
.about .icon-box {
  margin-top: 40px;
}
.about .icon-box .icon {
  float: left;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border: 2px solid #b9d4ec;
  border-radius: 50px;
  transition: 0.5s;
}
.about .icon-box .icon i {
  color: #009cde;
  font-size: 32px;
}
.about .icon-box:hover .icon {
  background: #009cde;;
  border-color: #009cde;;
}
.about .icon-box:hover .icon i {
  color: #fff;
}
.about .icon-box .title {
  margin-left: 85px;
  font-weight: 700;
  margin-bottom: 10px;
  font-size: 18px;
}
.about .icon-box .title a {
  color: #666;
  transition: 0.3s;
}
.about .icon-box .title a:hover {
  color: #666;
}
.about .icon-box .description {
  margin-left: 85px;
  line-height: 24px;
  font-size: 14px;
}
.about .video-box {
  background: url("../img/about.jpg") center center no-repeat;
  background-size: cover;
  min-height: 500px;
}
.about .play-btn {
  width: 94px;
  height: 94px;
  background: radial-gradient(#009cde 50%, rgba(6, 6, 6, 0.4) 52%);
  border-radius: 50%;
  display: block;
  position: absolute;
  left: calc(50% - 47px);
  top: calc(50% - 47px);
  overflow: hidden;
}
.about .play-btn::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-40%) translateY(-50%);
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 15px solid #fff;
  z-index: 100;
  transition: all 400ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
.about .play-btn::before {
  content: "";
  position: absolute;
  width: 120px;
  height: 120px;
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
  -webkit-animation: pulsate-btn 2s;
  animation: pulsate-btn 2s;
  -webkit-animation-direction: forwards;
  animation-direction: forwards;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-timing-function: steps;
  animation-timing-function: steps;
  opacity: 1;
  border-radius: 50%;
  border: 5px solid rgba(66, 139, 202, 0.7);
  top: -15%;
  left: -15%;
  background: rgba(198, 16, 0, 0);
}
.about .play-btn:hover::after {
  border-left: 15px solid #009cde;
  transform: scale(20);
}
.about .play-btn:hover::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-40%) translateY(-50%);
  width: 0;
  height: 0;
  border: none;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 15px solid #fff;
  z-index: 200;
  -webkit-animation: none;
  animation: none;
  border-radius: 0;
}

@-webkit-keyframes pulsate-btn {
  0% {
    transform: scale(0.6, 0.6);
    opacity: 1;
  }
  100% {
    transform: scale(1, 1);
    opacity: 0;
  }
}

@keyframes pulsate-btn {
  0% {
    transform: scale(0.6, 0.6);
    opacity: 1;
  }
  100% {
    transform: scale(1, 1);
    opacity: 0;
  }
}
/*--------------------------------------------------------------
# About List
--------------------------------------------------------------*/
.about-list {
  padding-top: 0;
}
.about-list .icon-box h4 {
  font-size: 20px;
  font-weight: 700;
  margin: 5px 0 10px 60px;
}
.about-list .icon-box i {
	font-size: 48px;
	float: left;
	color: #009cde;
}
.about-list .icon-box p {
  font-size: 15px;
  color: #009cde;
  margin-left: 60px;
}
.about-list .image {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 400px;
}




/*--------------------------------------------------------------
# MAP
--------------------------------------------------------------*/
.mapa .icon-boxes h3 {
  font-size: 28px;
  font-weight: 700;
  color: #009cde;;
  margin-bottom: 15px;
}
.mapa .icon-box {
  margin-top: 40px;
}
.mapa .icon-box .icon {
  float: left;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border: 2px solid #b9d4ec;
  border-radius: 50px;
  transition: 0.5s;
}
.mapa .icon-box .icon i {
  color: #009cde;
  font-size: 32px;
}
.mapa .icon-box:hover .icon {
  background: #009cde;;
  border-color: #009cde;;
}
.mapa .icon-box:hover .icon i {
  color: #fff;
}
.mapa .icon-box .title {
  margin-left: 85px;
  font-weight: 700;
  margin-bottom: 10px;
  font-size: 18px;
}
.mapa .icon-box .title a {
  color: #666;
  transition: 0.3s;
}
.mapa .icon-box .title a:hover {
  color: #666;
}
.mapa .icon-box .description {
  margin-left: 85px;
  line-height: 24px;
  font-size: 14px;
}



/*--------------------------------------------------------------
# MAP List
--------------------------------------------------------------*/
.mapa-list {
  padding-top: 0;
}
.mapa-list .icon-box h4 {
  font-size: 20px;
  font-weight: 700;
  margin: 5px 0 10px 60px;
}
.mapa-list .icon-box i {
	font-size: 48px;
	float: left;
	color: #009cde;
}
.mapa-list .icon-box p {
  font-size: 15px;
  color: #009cde;
  margin-left: 60px;
}
.mapa-list .image {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 10px;
  min-height: 400px;
}





/*--------------------------------------------------------------
# Counts
--------------------------------------------------------------*/
.counts {
  background: url("../img/counts-bg.jpg") center center no-repeat;
  background-size: cover;
  padding: 80px 0 60px 0;
  position: relative;
}
.counts::before {
  content: "";
  position: absolute;
  background: rgba(0, 0, 0, 0.7);
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}
.counts .title {
  position: relative;
  color: #fff;
  margin-bottom: 40px;
}
.counts .title h3 {
  font-size: 36px;
  font-weight: 700;
}
.counts .counters span {
  font-size: 48px;
  display: block;
  color: #959595;
}
.counts .counters p {
  padding: 0;
  margin: 0 0 20px 0;
  font-family: "Raleway", sans-serif;
  font-size: 14px;
  color: #fff;
}




/*--------------------------------------------------------------
# Featured Services Section
--------------------------------------------------------------*/
.featured-services .service-item {
  padding: 30px;
  transition: all ease-in-out 0.4s;
  background: var(--color-white);
  height: 100%;
}

.featured-services .service-item .icon {
  margin-bottom: 10px;
}

.featured-services .service-item .icon i {
  color: var(--color-primary);
  font-size: 36px;
  transition: 0.3s;
}

.featured-services .service-item h4 {
  font-weight: 600;
  margin-bottom: 15px;
  font-size: 24px;
}

.featured-services .service-item h4 a {
  color: var(--color-secondary);
  transition: ease-in-out 0.3s;
}

.featured-services .service-item p {
  line-height: 24px;
  font-size: 14px;
  margin-bottom: 0;
}

.featured-services .service-item:hover {
  transform: translateY(-10px);
  box-shadow: 0px 0 60px 0 rgba(var(--color-secondary-rgb), 0.1);
}

.featured-services .service-item:hover h4 a {
  color: var(--color-primary);
}





/*--------------------------------------------------------------
# Features Section
--------------------------------------------------------------*/
.features .nav-tabs {
  border: 0;
}

.features .nav-link {
  border: 0;
  padding: 15px 10px;
  color: #fff;
  box-shadow: 5px 5px 25px rgba(var(3DFDS3b), 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  transition: 0s;
  cursor: pointer;
  height: 100%;
background: #009cde;
border-radius: 5px;
	  
}


.features .nav-link i {
  font-size: 14px;
  line-height: 0;
	
}

.features .nav-link h4 {
  font-size: 14px;
  margin: 0px 0 0 0;
  color: #fff;
}

.features .nav-link:hover {
   background: #187bcd;
  color: #fff;
}

.features .nav-link.active {
  transition: 0.3s;
    background: #187bcd;
  color: #fff;
	
}

.features .nav-link.active h4 {
  color: var(--color-white);
}

.features .nav-link.active i {
  color: var(--color-white) !important;
}

.features .tab-content {
  margin-top: 0px;
}

.features .tab-pane.active {
  -webkit-animation: fadeIn 0.5s ease-out;
  animation: fadeIn 0.5s ease-out;
}

.features .tab-pane h3 {
  
  color: var(--color-secondary);
}

.features .tab-pane ul {
  list-style: none;
  padding: 0;
}

.features .tab-pane ul li {
  padding-bottom: 10px;
}

.features .tab-pane ul i {
  font-size: 24px;
  margin-right: 4px;
  color: var(--color-primary);
	
}

.features .tab-pane p:last-child {
  margin-bottom: 0;
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}




/*--------------------------------------------------------------
# Why Us
--------------------------------------------------------------*/
.why-us {
  padding-top: 50px;
}
.why-us .box {
	align: center;
  
}
.why-us .box span {
  font-size: 28px;
  font-weight: 700;
  color: #E8E8E8;;
	 background: #009cde;
}
.why-us .box h4 {
  font-size: 24px;
  font-weight: 600;
  padding: 0;
  margin: 20px 0;
  color: #191919;
	align: center;
}

.why-us .container .box img{
   height: 7rem;
}

.why-us .box p {
	align: center;
	
 
}
.why-us .box:hover {
	
 
}
.why-us .box:hover span, .why-us .box:hover h4, .why-us .box:hover p {

}



/*--------------------------------------------------------------
# Services Section otro
--------------------------------------------------------------*/
.services .img {
  border-radius: 8px;
  overflow: hidden;
}

.services .img img {
  transition: 0.6s;
}

.services .details {
  padding: 50px 30px;
  margin: -100px 30px 0 30px;
  transition: all ease-in-out 0.3s;
  background: rgb(255 255 255 / 0.8);
  position: relative;
  text-align: center;
  border-radius: 8px;
  box-shadow: 0px 0 25px rgba(var(#000), 9.1);
}

.services .details .icon {
  margin: 0;
  width: 72px;
  height: 72px;
  background: #009cde;
  border-radius: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
  color: #fff;
  font-size: 28px;
  transition: ease-in-out 0.3s;
  position: absolute;
  top: -36px;
  left: calc(50% - 36px);
  border: 6px solid #fff;
}

.services .details h3 {
  color: #000;
  font-weight: 700;
  margin: 10px 0 15px 0;
  font-size: 22px;
  transition: ease-in-out 0.3s;
}

.services .details p {
  line-height: 24px;
  font-size: 14px;
  margin-bottom: 0;
}

.services .service-item:hover .details h3 {
  color: #009cde;
}

.services .service-item:hover .details .icon {
  background: #fff;
  border: 2px solid #009cde;
}

.services .service-item:hover .details .icon i {
  color: #009cde;
}

.services .service-item:hover .img img {
  transform: scale(1.2);
}

/*--------------------------------------------------------------
# Services original
--------------------------------------------------------------*/
.services .icon-box {
  margin-bottom: 20px;
  padding: 30px;
  border-radius: 6px;
  background: #fff;
}
.services .icon-box i {
  float: left;
  color: #333;
  font-size: 40px;
  line-height: 0;
}
.services .icon-box h4 {
  margin-left: 70px;
  font-weight: 700;
  margin-bottom: 15px;
  font-size: 18px;
}
.services .icon-box h4 a {
  color: #333;
  transition: 0.3s;
}
.services .icon-box:hover h4 a {
  color: #000;
}
.services .icon-box p {
  margin-left: 70px;
  line-height: 24px;
  font-size: 14px;
}


/*--------------------------------------------------------------
# Portfolio
--------------------------------------------------------------*/
.portfolio .portfolio-item {
  margin-bottom: 30px;
}
.portfolio #portfolio-flters {
  padding: 0;
  margin: 0 0 35px 0;
  list-style: none;
  text-align: center;
}
.portfolio #portfolio-flters li {
  cursor: pointer;
  margin: 0 15px 15px 0;
  display: inline-block;
  padding: 10px 20px;
  font-size: 12px;
  line-height: 20px;
  color: #444444;
  border-radius: 4px;
  text-transform: uppercase;
  background: #fff;
  margin-bottom: 5px;
  transition: all 0.3s ease-in-out;
}
.portfolio #portfolio-flters li:hover, .portfolio #portfolio-flters li.filter-active {
  background: #009cde;
  color: #fff;
}
.portfolio #portfolio-flters li:last-child {
  margin-right: 0;
}
.portfolio .portfolio-wrap {
  box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.08);
  transition: 0.3s;
  position: relative;
  overflow: hidden;
}
.portfolio .portfolio-wrap img {
  transition: 0.3s;
}
.portfolio .portfolio-wrap .portfolio-info {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  opacity: 0;
  position: absolute;
  bottom: 0;
  top: 0;
  left: 0;
  right: 0;
  transition: 0.3s;
  text-align: center;
  background: rgba(53, 65, 68, 0.6);
  padding-bottom: 0px;
}
.portfolio .portfolio-wrap .portfolio-info h4 {
  font-size: 20px;
  color: #fff;
  font-weight: 600;
}
.portfolio .portfolio-wrap .portfolio-info p {
  color: #fff;
  font-size: 14px;
  text-transform: uppercase;
}
.portfolio .portfolio-wrap .portfolio-info .portfolio-links {
  display: flex;
}
.portfolio .portfolio-wrap .portfolio-info .portfolio-links a {
  color: rgba(140, 30, 100, 0.8);
  margin: 0 4px;
  background-color: #fff;
  border-radius: 50px;
  width: 36px;
  height: 36px;
  transition: 0.3s;
  display: flex;
  align-items: center;
  justify-content: center;
}
.portfolio .portfolio-wrap .portfolio-info .portfolio-links a i {
  font-size: 18px;
  line-height: 0;
}
.portfolio .portfolio-wrap .portfolio-info .portfolio-links a:hover {
  background: #000;
  color: #fff;
}
.portfolio .portfolio-wrap:hover {
  box-shadow: 0px 4px 14px rgba(0, 0, 0, 0.16);
}
.portfolio .portfolio-wrap:hover .portfolio-info {
  opacity: 0.2;
  padding-bottom: 0;
}
.portfolio .portfolio-wrap:hover img {
  transform: scale(1.1);
}





/*--------------------------------------------------------------
# Portfolio Details
--------------------------------------------------------------*/
.portfolio-details {
  padding-top: 40px;
}
.portfolio-details .portfolio-details-slider img {
  width: 100%;
}
.portfolio-details .portfolio-details-slider .swiper-pagination {
  margin-top: 20px;
  position: relative;
}
.portfolio-details .portfolio-details-slider .swiper-pagination .swiper-pagination-bullet {
  width: 12px;
  height: 12px;
  background-color: #fff;
  opacity: 1;
  border: 1px solid rgba(140, 30, 100, 0.8);
}
.portfolio-details .portfolio-details-slider .swiper-pagination .swiper-pagination-bullet-active {
  background-color: rgba(140, 30, 100, 0.8);
}
.portfolio-details .portfolio-info {
  padding: 30px;
  box-shadow: 0px 0 30px rgba(53, 65, 68, 0.08);
}
.portfolio-details .portfolio-info h3 {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #eee;
}
.portfolio-details .portfolio-info ul {
  list-style: none;
  padding: 0;
  font-size: 15px;
}
.portfolio-details .portfolio-info ul li + li {
  margin-top: 10px;
}
.portfolio-details .portfolio-description {
  padding-top: 30px;
}
.portfolio-details .portfolio-description h2 {
  font-size: 26px;
  font-weight: 700;
  margin-bottom: 20px;
}
.portfolio-details .portfolio-description p {
  padding: 0;
}


/*--------------------------------------------------------------
# Portfolio Section
--------------------------------------------------------------*/
.portfolio .portfolio-flters {
  padding: 0 0 20px 0;
  margin: 0 auto;
  list-style: none;
  text-align: center;
}

.portfolio .portfolio-flters li {
  cursor: pointer;
  display: inline-block;
  padding: 0;
  font-size: 18px;
  font-weight: 500;
  margin: 0 10px;
  line-height: 1;
  transition: all 0.3s ease-in-out;
}

.portfolio .portfolio-flters li:hover,
.portfolio .portfolio-flters li.filter-active {
  color: var(--color-primary);
}

.portfolio .portfolio-flters li:first-child {
  margin-left: 0;
}

.portfolio .portfolio-flters li:last-child {
  margin-right: 0;
}

@media (max-width: 575px) {
  .portfolio .portfolio-flters li {
    font-size: 14px;
    margin: 0 5px;
  }
}

.portfolio .portfolio-wrap {
  box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.1);
  border-radius: 8px;
  height: 100%;
  overflow: hidden;
}

.portfolio .portfolio-wrap img {
  transition: 0.3s;
  position: relative;
  z-index: 1;
}

.portfolio .portfolio-wrap .portfolio-info {
  padding: 0px 0px;
  background-color: #fff;
  position: relative;
  border-top: 1px solid #f3f3f3;
  z-index: 2;
}

.portfolio .portfolio-wrap .portfolio-info h4 {
  font-size: 18px;
  font-weight: 600;
  padding-right: 50px;
}

.portfolio .portfolio-wrap .portfolio-info h4 a {
  color: var(--color-default);
  transition: 0.3s;
}

.portfolio .portfolio-wrap .portfolio-info h4 a:hover {
  color: var(--color-primary);
}

.portfolio .portfolio-wrap .portfolio-info p {
  color: #6c757d;
  font-size: 14px;
  margin-bottom: 0;
  padding-right: 50px;
}

.portfolio .portfolio-wrap:hover img {
  transform: scale(1.1);
}



/*--------------------------------------------------------------
# Call To Action Section
--------------------------------------------------------------*/
.cta {
  padding: 0;
  margin-bottom: 60px;
}

.cta .container {
  padding: 80px;
  background: #EFEFEF;
  border-radius: 15px;
}

@media (max-width: 992px) {
  .cta .container {
    padding: 60px;
  }
}

.cta .content h3 {
  color: var(--color-secondary);
  font-size: 38px;
  font-weight: 700;
	 padding-bottom: 15px;
}

.cta .content h3 em {
  font-style: normal;
  position: relative;
}

.cta .content h3 em:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 10px;
  height: 10px;
  background: rgba(var(--color-primary-rgb), 0.5);
  z-index: -1;
}

.cta .content p {
  color: var(--color-secondary);
  font-weight: 600;
  font-size: 16px;
}

.cta .content .cta-btn {
  color: #FFF;
  font-weight: 500;
  font-size: 16px;
  display: inline-block;
  padding: 12px 40px;
  border-radius: 5px;
  transition: 0.5s;
  margin-top: 10px;
  background: #009cde;
}

.cta .content .cta-btn:hover {
  background: #187bcd;
}

.cta .img {
  position: relative;
}

.cta .img:before {
  content: "";
  position: absolute;
  inset: 0;
  background: #F4F4F4;
  border-radius: 15px;
  transform: rotate(12deg);
}

.cta .img:after {
  content: "";
  position: absolute;
  inset: 0;
  background: #FFF;
  border-radius: 15px;
  transform: rotate(6deg);
}

.cta .img img {
  position: relative;
  z-index: 3;
  border-radius: 15px;
}



.cta-inverse {
  padding: 0;
  margin-bottom: 60px;
}

.cta-inverse .container {
  padding: 80px;
  background: #EFEFEF;
  border-radius: 15px;
}

@media (max-width: 992px) {
  .cta-inverse .container {
    padding: 60px;
  }
}

.cta-inverse .content h3 {
  color: var(--color-secondary);
  font-size: 38px;
  font-weight: 700;
	
}

.cta-inverse .content h3 em {
  font-style: normal;
  position: relative;
}

.cta-inverse .content h3 em:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 10px;
  height: 10px;
  background: rgba(var(--color-primary-rgb), 0.5);
  z-index: -1;
}

.cta-inverse .content p {
  color: var(--color-secondary);
  font-weight: 600;
  font-size: 16px;
}

.cta-inverse .content .cta-btn {
  color: #FFF;
  font-weight: 500;
  font-size: 16px;
  display: inline-block;
  padding: 12px 40px;
  border-radius: 5px;
  transition: 0.5s;
  margin-top: 10px;
  background: #009cde;
}

.cta-inverse .content .cta-btn:hover {
  background: #187bcd;
}

.cta-inverse .img {
  position: relative;
}

.cta-inverse .img:before {
  content: "";
  position: absolute;
  inset: 0;
  background: #F4F4F4;
  border-radius: 15px;
  transform: rotate(12deg);
}

.cta-inverse .img:after {
  content: "";
  position: absolute;
  inset: 0;
  background: #FFF;
  border-radius: 15px;
  transform: rotate(6deg);
}

.cta-inverse .img img {
  position: relative;
  z-index: 3;
  border-radius: 15px;
}



/*--------------------------------------------------------------
# Team
--------------------------------------------------------------*/
.team {
  background: #fff;
}
.team .member {
  position: relative;
  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
  padding: 30px;
  border-radius: 10px;
}
.team .member .pic {
  overflow: hidden;
  width: 180px;
  border-radius: 50%;
}
.team .member .pic img {
  transition: ease-in-out 0.3s;
}
.team .member:hover img {
  transform: scale(1.1);
}
.team .member .member-info {
  padding-left: 30px;
}
.team .member h4 {
  font-weight: 700;
  margin-bottom: 5px;
  font-size: 20px;
  color: #354144;
}
.team .member span {
  display: block;
  font-size: 15px;
  padding-bottom: 10px;
  position: relative;
  font-weight: 500;
}
.team .member span::after {
  content: "";
  position: absolute;
  display: block;
  width: 50px;
  height: 1px;
  background: #b4c1c4;
  bottom: 0;
  left: 0;
}
.team .member p {
  margin: 10px 0 0 0;
  font-size: 14px;
}
.team .member .social {
  margin-top: 12px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.team .member .social a {
  transition: ease-in-out 0.3s;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50px;
  width: 32px;
  height: 32px;
  background: #000;
}
.team .member .social a i {
  color: #fff;
  font-size: 16px;
  margin: 0 2px;
}
.team .member .social a:hover {
  background: #333;
}
.team .member .social a + a {
  margin-left: 8px;
}

/*--------------------------------------------------------------
# Testimonials
--------------------------------------------------------------*/
.testimonials {
  padding: 80px 0;
  background: url("../img/testimonials-bg.jpg") no-repeat;
  background-position: center center;
  background-size: cover;
  position: relative;
}
.testimonials::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: rgba(8, 10, 11, 0.7);
}
.testimonials .section-header {
  margin-bottom: 40px;
}
.testimonials .testimonials-carousel, .testimonials .testimonials-slider {
  overflow: hidden;
}
.testimonials .testimonial-item {
  text-align: center;
  color: #fff;
}
.testimonials .testimonial-item .testimonial-img {
  width: 100px;
  border-radius: 50%;
  border: 6px solid rgba(255, 255, 255, 0.15);
  margin: 0 auto;
}
.testimonials .testimonial-item h3 {
  font-size: 20px;
  font-weight: bold;
  margin: 10px 0 5px 0;
  color: #fff;
}
.testimonials .testimonial-item h4 {
  font-size: 14px;
  color: #ddd;
  margin: 0 0 15px 0;
}
.testimonials .testimonial-item .quote-icon-left, .testimonials .testimonial-item .quote-icon-right {
  color: rgba(255, 255, 255, 0.4);
  font-size: 26px;
}
.testimonials .testimonial-item .quote-icon-left {
  display: inline-block;
  left: -5px;
  position: relative;
}
.testimonials .testimonial-item .quote-icon-right {
  display: inline-block;
  right: -5px;
  position: relative;
  top: 10px;
}
.testimonials .testimonial-item p {
  font-style: italic;
  margin: 0 auto 15px auto;
  color: #eee;
}
.testimonials .swiper-pagination {
  margin-top: 20px;
  position: relative;
}
.testimonials .swiper-pagination .swiper-pagination-bullet {
  width: 12px;
  height: 12px;
  background-color: rgba(255, 255, 255, 0.5);
  opacity: 1;
}
.testimonials .swiper-pagination .swiper-pagination-bullet-active {
  background-color: #333;
}
@media (min-width: 1024px) {
  .testimonials {
    background-attachment: fixed;
  }
}
@media (min-width: 992px) {
  .testimonials .testimonial-item p {
    width: 80%;
  }
}

/*--------------------------------------------------------------
# Contact
--------------------------------------------------------------*/
.contact .info-wrap {
  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
  padding: 30px;
}
.contact .info {
  background: #fff;
}
.contact .info i {
  font-size: 24px;
  color: #fff;
  float: left;
  width: 48px;
  height: 48px;
  background: #009cde;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50px;
  transition: all 0.3s ease-in-out;
}
.contact .info h4 {
  padding: 0 0 0 60px;
  font-size: 22px;
  font-weight: 600;
  margin-bottom: 5px;
  color: #354144;
}
.contact .info p {
  padding: 0 0 0 60px;
  margin-bottom: 0;
  font-size: 14px;
  color: #62787d;
}
.contact .info:hover i {
  background: #187bcd;
  color: #fff;
}
.contact .php-email-form {
  width: 100%;
  box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.12);
  padding: 30px;
  background: #fff;
}
.contact .php-email-form .form-group {
  padding-bottom: 8px;
}
.contact .php-email-form .error-message {
  display: none;
  color: #fff;
  background: #ed3c0d;
  text-align: left;
  padding: 15px;
}
.contact .php-email-form .error-message br + br {
  margin-top: 25px;
}
.contact .php-email-form .sent-message {
  display: none;
  color: #fff;
  background: #009cde;
  text-align: center;
  padding: 15px;
  font-weight: 600;
}
.contact .php-email-form .loading {
  display: none;
  background: #fff;
  text-align: center;
  padding: 15px;
}
.contact .php-email-form .loading:before {
  content: "";
  display: inline-block;
  border-radius: 50%;
  width: 24px;
  height: 24px;
  margin: 0 10px -6px 0;
  border: 3px solid #18d26e;
  border-top-color: #eee;
  -webkit-animation: animate-loading 1s linear infinite;
  animation: animate-loading 1s linear infinite;
}
.contact .php-email-form input, .contact .php-email-form textarea {
  border-radius: 0;
  box-shadow: none;
  font-size: 14px;
}
.contact .php-email-form input {
  height: 44px;
}
.contact .php-email-form textarea {
  padding: 10px 12px;
}
.contact .php-email-form button[type=submit] {
  background: #009cde;
  border: 0;
  padding: 10px 24px;
  color: #fff;
  transition: 0.4s;
  border-radius: 4px;
}
.contact .php-email-form button[type=submit]:hover {
  background: #187bcd; 
}
@-webkit-keyframes animate-loading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes animate-loading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/*--------------------------------------------------------------
# Breadcrumbs
--------------------------------------------------------------*/
.breadcrumbs {
  padding: 15px 0;
  background: #f6f7f8;
  min-height: 40px;
	
}
.breadcrumbs h2 {
  font-size: 24px;
  font-weight: 400;
}
.breadcrumbs ol {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  padding: 0;
  margin: 0;
}
.breadcrumbs ol li + li {
  padding-left: 10px;
}
.breadcrumbs ol li + li::before {
  display: inline-block;
  padding-right: 10px;
  color: #4b5c61;
  content: "/";
}
@media (max-width: 768px) {
  .breadcrumbs .d-flex {
    display: block !important;
  }
  .breadcrumbs ol {
    display: block;
  }
  .breadcrumbs ol li {
    display: inline-block;
  }
}



/*--------------------------------------------------------------
# Recent Blog Posts Section
--------------------------------------------------------------*/
.recent-posts article {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  background-color: #fff;
  padding: 30px;
  height: 100%;
  border-radius: 10px;
  overflow: hidden;
}

.recent-posts .post-img {
  max-height: 240px;
  margin: -30px -30px 15px -30px;
  overflow: hidden;
}

.recent-posts .post-category {
  font-size: 16px;
  color: #6f6f6f;
  margin-bottom: 10px;
}

.recent-posts .title {
  font-size: 22px;
  font-weight: 700;
  padding: 0;
  margin: 0 0 20px 0;
}

.recent-posts .title a {
  color: #000;
  transition: 0.3s;
}

.recent-posts .title a:hover {
  color: #187bcd;
}

.recent-posts .post-author-img {
  width: 50px;
  border-radius: 50%;
  margin-right: 15px;
}

.recent-posts .post-author {
  font-weight: 600;
  margin-bottom: 5px;
}

.recent-posts .post-date {
  font-size: 14px;
  color: #3c3c3c;
  margin-bottom: 0;
}


/*--------------------------------------------------------------
# Frequently Asked Questions Section
--------------------------------------------------------------*/
.faq .content h3 {
  font-weight: 400;
  font-size: 34px;
}

.faq .content h4 {
  font-size: 20px;
  font-weight: 700;
  margin-top: 5px;
}

.faq .content p {
  font-size: 15px;
  color: #6c757d;
}

.faq .accordion-item {
  border: 0;
  margin-bottom: 20px;
  box-shadow: 0px 5px 25px 0px rgba(0, 0, 0, 0.06);
  border-radius: 10px;
}

.faq .accordion-item:last-child {
  margin-bottom: 0;
}

.faq .accordion-collapse {
  border: 0;
}

.faq .accordion-button {
  padding: 20px 50px 20px 20px;
  font-weight: 600;
  border: 0;
  font-size: 18px;
  line-height: 24px;
  color: var(--color-default);
  text-align: left;
  background: #fff;
  box-shadow: none;
  border-radius: 10px;
}

.faq .accordion-button .num {
  padding-right: 10px;
  font-size: 20px;
  line-height: 0;
  color: var(--color-primary);
}

.faq .accordion-button:not(.collapsed) {
  color: var(--color-primary);
  border-bottom: 0;
  box-shadow: none;
}

.faq .accordion-button:after {
  position: absolute;
  right: 20px;
  top: 20px;
}

.faq .accordion-body {
  padding: 0 40px 30px 45px;
  border: 0;
  border-radius: 10px;
  background: #fff;
  box-shadow: none;
}


/*********************************
8. Courses
*********************************/

.courses
{
	width: 100%;
	padding-top: 30px;
	padding-bottom: 30px;
}
.courses_row
{
	margin-top: 45px;
	width: 100%;
	padding-bottom: 0px;
}
.course
{
	width: 98%;
	
	
	 background: linear-gradient(30deg, #f5f5f5, #fff);
	  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
padding-bottom: -50px;
	
	border-radius: 10px;
	
}
.course_image
{
	width: 100%;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	overflow: hidden;
}
.course_image img
{
	max-width: 100%;
}
.course_body
{
	padding-top: 10px;
	padding-left: 20px;
	padding-right: 20px;
	padding-bottom: 10px;
}
.course_title a
{
	font-family: 'Roboto Slab', serif;
	font-size: 22px;
	color: #000;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.course_title a:hover
{
	color: #187bcd;;
}
.course_teacher
{
	font-size: 15px;
	font-weight: 400;
	color: #384158;
	margin-top: 6px;
	
	
}
.course_text
{
	margin-top: 13px;
}
.course_footer
{
	 background: linear-gradient(230deg, #d8d8d8, #e7e7e7);
	padding-left: 20px;
	padding-right: 20px;
		
	border-botton-radius: 20px;
	
}
.course_footer_content
{
	width: 100%;
	border-top: solid 1px #e5e5e5;
	padding-top: 9px;
	padding-bottom: 10px;
	
}
.course_info
{
	display: inline-block;
	font-size: 14px;
	font-weight: 400;
	color: #55555a;
	padding-right: 20px;
}
.course_info:first-child
{
	margin-right: 45px;
}

.course_info i
{
	color: #187bcd;
}


.course_info2
{
	display: inline-block;
	font-size: 14px;
	font-weight: 400;
	color: #55555a;
}
.course_info2:first-child
{
	margin-right: 28px;
}

.course_info2 i
{
	color: #187bcd;
}


.course_price
{
	font-family: 'Roboto Slab', serif;
	font-size: 20px;
	font-weight: 400;
	color: #187bcd;
	text-align: right;
}
.course_price span
{
	font-family: 'Roboto Slab', serif;
	font-size: 14px;
	font-weight: 400;
	text-decoration: line-through;
	color: #b5b8be;
	
	margin-right: 20px;
	margin-left: 28px;
}
.courses_button
{
	width: 210px;
	height: 46px;
	border-radius: 8px;
	background: #14bdee;
	text-align: center;
	margin: 0 auto;
	margin-top: 41px;
	box-shadow: 0px 5px 40px rgba(29,34,47,0.15);
}
.courses_button:hover
{
	box-shadow: 0px 5px 40px rgba(29,34,47,0.45);
}
.courses_button a
{
	display: block;
	font-size: 14px;
	font-weight: 500;
	text-transform: uppercase;
	line-height: 46px;
	color: #FFFFFF;
}




/*--------------------------------------------------------------
# PRODUCTOS NUEVO
--------------------------------------------------------------*/



a
{
    text-decoration: none;
}
.product-card {
    width: 100%;
    position: relative;
    box-shadow: 0 2px 7px #dfdfdf;
    margin-bottom: 20px;
    background: #fafafa;
	border-radius: 10px;
	 padding: 1px;
	
}

.badge {
    position: absolute;
    left: 10px;
    top: 20px;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 700;
    background: #187bcd;
    color: #fff;
    padding: 4px 10px;
}

.product-tumb {
    display: flex;
    align-items: center;
    justify-content: center;
     max-width: 100%;
    max-height: 100%;
    padding: 0px;
    background: #f0f0f0;
}

.product-tumb img {
    max-width: 100%;
    max-height: 100%;
		border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}

.product-details {
    padding: 30px;
}

.product-catagory {
    display: block;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    color: #333;
    margin-bottom: 18px;
}

.product-details h4 a {
    font-weight: 500;
    display: block;
    margin-bottom: 18px;
    text-transform: uppercase;
    color: #363636;
    text-decoration: none;
    transition: 0.3s;
}

.product-details h4 a:hover {
    color: #187bcd;
}

.product-details p {
    font-size: 15px;
    line-height: 22px;
    margin-bottom: 18px;
    color: #000;
}

.product-bottom-details {
    overflow: hidden;
    border-top: 1px solid #eee;
    padding-top: 20px;
}

.product-bottom-details div {
    float: left;
    width: 50%;
}

.product-price {
    font-size: 18px;
    color: #187bcd;
    font-weight: 600;
}

.product-price small {
    font-size: 80%;
    font-weight: 400;
    text-decoration: line-through;
    display: inline-block;
    margin-right: 5px;
}

.product-links {
    text-align: right;
}

.product-links a {
    display: inline-block;
    margin-left: 5px;
    color: #e1e1e1;
    transition: 0.3s;
    font-size: 17px;
}

.product-links a:hover {
    color: #187bcd;
}





/*--------------------------------------------------------------
# TOURS NUEVO
--------------------------------------------------------------*/

.badgetourmio {
    position: absolute;
    left: 14px;
    top: 16px;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 700;
    background: linear-gradient(to bottom, #187bcd, #187bcd);
    color: #fff;
    padding: 4px 10px;
    border-radius: 5px;
    z-index: 10;
    opacity: 1;
    pointer-events: none;
}

/* Cambiar .badgehotel por .badgetour */
.badgetour {
    position: absolute;
    left: 14px;
    top: 16px;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 700;
    background: linear-gradient(to bottom, #009cde, #009cde);
    color: #fff;
    padding: 4px 10px;
    border-radius: 5px;
    z-index: 10;
    opacity: 1;
    pointer-events: none;
}

.badgetourkosh {
    position: absolute;
    left: 14px;
    top: 16px;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 700;
    background: linear-gradient(to bottom, #7a7a7a, #7a7a7a);
    color: #fff;
    padding: 4px 10px;
    border-radius: 5px;
    z-index: 10;
    opacity: 1;
    pointer-events: none;
}

.badgetourpri {
    position: absolute;
    left: 14px;
    top: 16px;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 700;
    background: linear-gradient(to bottom, #003d5b, #003d5b);
    color: #fff;
    padding: 4px 10px;
    border-radius: 5px;
    z-index: 10;
    opacity: 1;
    pointer-events: none;
}


.badgetourexc {
    position: absolute;
    left: 14px;
    top: 16px;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 700;
    background: linear-gradient(to bottom, #4a4dd0, #4a4dd0);
    color: #fff;
    padding: 4px 10px;
    border-radius: 5px;
    z-index: 10;
    opacity: 1;
    pointer-events: none;
}

.badgetourgru {
    position: absolute;
    left: 14px;
    top: 16px;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 700;
    background: linear-gradient(to bottom, #30638e, #30638e);
    color: #fff;
    padding: 4px 10px;
    border-radius: 5px;
    z-index: 10;
    opacity: 1;
    pointer-events: none;
}

.badgetourfree {
    position: absolute;
    left: 14px;
    top: 16px;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 700;
    background: linear-gradient(to bottom, #5abcff, #5abcff);
    color: #fff;
    padding: 4px 10px;
    border-radius: 5px;
    z-index: 10;
    opacity: 1;
    pointer-events: none;
}



/* Cambiar .hotel-tumb por .tour-tumb */
.tour-tumb img {
    max-width: 100%;
    height: 180px; /* Altura fija */
    object-fit: cover;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    display: block; /* Elimina el espacio fantasma */
}

.tour-tumb img {
    max-width: 100%;
    max-height: 100%;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

/* Cambiar .hotel-details por .tours-details */
.tours-details {
  padding-top: 5px !important;   /* Menos padding arriba */
  padding-bottom: 5px !important; /* Mantén el padding inferior para que no quede todo pegado */
	 margin-bottom: 5px;
}


/* Cambiar .hotel-catagory por .tour-catagory */
.tour-catagory {
    display: block;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    color: #333;
    margin-bottom: 10px;
}

/* Cambiar .hotel-details h4 a por .tours-details h4 a */
.tours-details h4 a {
    font-weight: 500;
    display: block;
    text-transform: uppercase;
    color: #000;
    text-decoration: none;
    transition: 0.3s;
}

.tours-details h4 a:hover {
    color: #187bcd;
}


.tours-details p {
    font-size: 14px;
    line-height: 22px;
    margin-bottom: 15px;
    color: #000;
}

/* Cambiar .hotel-bottom-details por .tour-bottom-details */
.tour-bottom-details {
    overflow: hidden;
    border-top: 1px solid #eee;
    padding-top: 15px;
}

.tour-bottom-details div {
    float: left;
    width: 50%;
}

/* Cambiar .hotel-top-details por .tour-top-details */
.tour-top-details {
    overflow: hidden;
    border-top: 0px solid #eee;
    padding-top: 0px;
    margin-bottom: 15px;
}


.tour-top-details div {
    float: left;
    width: 50%;
}

/* Cambiar .hotel-price por .tour-price */
.tour-price {
    font-size: 18px;
    color: #187bcd;
    font-weight: 600;
}

.tour-price small {
    font-size: 80%;
    font-weight: 400;
    color: #2c2c2c;
    display: inline-block;
    margin-right: 5px;
    margin-top: 5px;
}

/* Cambiar .hotel-links por .tour-links */
.tour-links {
    text-align: right;
}

.tour-links a {
    background: #009cde;
    color: #187bcd;
    border-radius: 5px;
    padding: 8px 18px;
    white-space: nowrap;
    transition: 0.3s;
    font-size: 14px;
    display: inline-block;
}

.tour-links a:hover {
    background: #187bcd;
    color: #187bcd;
}

/* Cambiar .hotel-location por .tour-location */
.tour-location small {
    font-size: 80%;
    font-weight: 400;
    color: #187bcd;
    display: inline-block;
    margin-right: 5px;
}

.tour-location {
    display: block;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    color: #4a4a4a;
}

/* Cambiar .hotel-stars por .tour-stars */
.tour-stars {
    display: block;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    color: #2b2b2b;
    margin-rigth: 14px;
    text-align: right;
}

.tour-stars a {
    display: block;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    color: #4a4a4a;
}

.tour-stars a:hover {
    background: #187bcd;
    color: #fff;
}

/* Cambiar .hotel-btn por .tour-btn */
.tour-btn {
    margin-top: 10px;
    background: #e4e4e4;
    color: #333;
    border-radius: 5px;
    padding: 10px 25px;
    white-space: nowrap;
    transition: 0.3s;
    font-size: 14px;
    display: inline-block;
}

.tour-btn:hover {
    background: #009cde;
    color: #fff;
}

/* Cambiar .hotel-card por .tour-card */
.tour-card {
    margin-top: 0px;
    width: 100%;
    position: relative;
    box-shadow: 0 2px 7px #dfdfdf;
   
    background: linear-gradient(to bottom, #f0f0f0, #fbfbfb);
    border-radius: 10px;
    padding: 1px;
	   height: 100%;
    display: flex;
    flex-direction: column;

    overflow: hidden;
    margin-bottom: 26px;
}


.carousel-item-c.swiper-slide {
  padding-bottom: 4px; /* Ajusta el valor a tu gusto */
  box-sizing: border-box; /* Para que el padding no rompa el diseño */
}



/* Aseguramos que los enlaces dentro del título también sean azules */
.tour-tittle2 {
	font-size: 21px;
    color: #187bcd;
    font-weight: 600;
    margin-bottom: 15px;
    margin-top: 15px;
}

.tour-tittle, .tour-tittle2 {
  margin-top: 10px; /* Reducido de 15px */
  margin-bottom: 10px; /* Reducido de 15px */
}

/* Efecto de zoom en la imagen */
.zoom-effect {
    overflow: hidden;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.zoom-effect img {
    width: 100%;
    height: auto;
    transition: transform 0.5s ease;
}

.tour-card:hover .zoom-effect img {
    transform: scale(1.2);
}

.packages-info small {
  color: #777777; /* Tono de gris medio */
  padding-top: 5px; /* Reducir el padding vertical */
  padding-bottom: 5px;
}

.packages-info.d-flex {
  margin-top: -5px; /* Espacio negativo para acercar a la imagen */
}

.carousel-item-c.swiper-slide {
  height: auto;
}

.card-box-bcard-shadow.news-box {
  height: 100%;
  display: flex;
}

.tour-card {
  height: 100%;
  display: flex;
  flex-direction: column;
  width: 100%;
}

.tour-card .tour-link {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.tours-details {
    padding: 8px 14px;
    display: flex;
    flex-direction: column;
    flex: 1;
}

.tour-bottom-details {
    margin-top: auto;
    padding-top: 10px;
    border-top: 1px solid #eee;
}



/* Eliminar línea debajo de las banderas */
.language-flags {
  border: none !important;
  border-bottom: none !important;
  text-decoration: none !important;

  margin-bottom: 0px;
}

.language-flags img {
  width: 22px;
  height: auto;
  margin-right: 5px;
  vertical-align: middle;
}

.language-flags img:last-child {
  margin-right: 0;
}


.swiper-container {
  overflow: visible;
}


/*--------------------------------------------------------------
# HOTELES NUEVO
--------------------------------------------------------------*/



a
{
    text-decoration: none;
}
.hotel-card {
   margin-top: 0px;
	width: 100%;
    position: relative;
    box-shadow: 0 2px 7px #dfdfdf;
    margin-bottom: 10px;
    background: linear-gradient(to bottom, #f1f1f1, #f8f8f8);
	border-radius: 10px;
	 padding: 1px;
	
}

.badgehotel {
    position: absolute;
    left: 14px;
    top: 16px;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 700;
    background: linear-gradient(to bottom, #009cde, #009cde);
    color: #fff;
    padding: 4px 10px;
    border-radius: 5px;
    z-index: 10; /* Añadimos z-index para asegurar que esté por encima de otros elementos */
    opacity: 1; /* Aseguramos que sea completamente opaco */
    pointer-events: none; /* Para que no interfiera con los clics en elementos subyacentes */
}

.badgetourscities {
    position: absolute;
    width: 40%; 
    top: 0; 
    left: 50%; 
    transform: translateX(-50%);
    display: inline-block;
    background: #009cde;
    color: #fff;
	text-align: center;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px; 
    z-index: 15;
	 font-size: 16px;
    font-weight: 700;
}


.hotel-tumb {
    display: flex;
    align-items: center;
    justify-content: center;
     max-width: 100%;
    max-height: 100%;
    padding: 0px;
    background: #f0f0f0;
}

.hotel-tumb img {
    max-width: 100%;
    max-height: 100%;
		border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}

.hotel-details {
    padding: 14px;
}

.hotel-catagory {
    display: block;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    color: #333;
    margin-bottom: 10px;
	
}

.hotel-details h4 a {
    font-weight: 500;
    display: block;
    text-transform: uppercase;
    color: #000;
    text-decoration: none;
    transition: 0.3s;

	
}

.hotel-details h4 a:hover {
    color: #187bcd;
}

.hotel-details p {
    font-size: 14px;
    line-height: 22px;
    margin-bottom: 15px;
    color: #000;
}

.hotel-bottom-details {
    overflow: hidden;
    border-top: 1px solid #eee;
    padding-top: 15px;
}

.hotel-bottom-details div {
    float: left;
    width: 50%;
}

.hotel-top-details {
    overflow: hidden;
    border-top: 0px solid #eee;
    padding-top: 0px;
	margin-bottom: 15px;
}

.hotel-top-details div {
    float: left;
    width: 50%;
}
.hotel-price {
    font-size: 20px;
    color: #187bcd;
    font-weight: 600;
	
}

.tour-tittle {
    font-size: 21px;
    color: #fff;
    font-weight: 600;
	margin-bottom: 15px;
	margin-top: 15px;
	
}

.hotel-price small {
    font-size: 80%;
    font-weight: 400;
    color: #999;
    display: inline-block;
    margin-right: 5px;
	margin-top: 5px;
}

.hotel-links {
    text-align: right;
}

.hotel-links a {

  background: #009cde;
  color: #fff;
  border-radius: 5px;
  padding: 8px 18px;
  white-space: nowrap;
  transition: 0.3s;
  font-size: 14px;
  display: inline-block;
}

.hotel-links a:hover {
     background: #187bcd;
  color: #fff;
}



.hotel-location small {
    font-size: 80%;
    font-weight: 400;
    color: #187bcd;
    display: inline-block;
    margin-right: 5px;
	
}
.hotel-location {
      display: block;
font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    color: #444;
}



.hotel-stars {
    display: block;
	
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    color: #444;
	
	margin-rigth: 14px;
	text-align: right;
	
	
}

.hotel-stars a {
   display: block;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    color: #777;
	
}

.hotel-stars a:hover {
     background: #187bcd;
  color: #fff;
}
.hotel-btn {
  
	margin-top: 10px;
  background: #e4e4e4;
  color: #333;
  border-radius: 5px;
  padding: 10px 25px;
  white-space: nowrap;
  transition: 0.3s;
  font-size: 14px;
  display: inline-block;
}
.hotel-btn:hover {
  background: #009cde;
  color: #fff;
}




/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
#footer {
  background: #187bcd;
  padding: 0 0 30px 0;
  color: #fff;
  font-size: 14px;
}
#footer .footer-top {
  background: #009cde;
  border-bottom: 1px solid #187bcd;
  padding: 60px 0 30px 0;
}
#footer .footer-top .footer-info {
  margin-bottom: 30px;
}
#footer .footer-top .footer-info h3 {
  font-size: 24px;
  margin: 0 0 20px 0;
  padding: 2px 0 2px 0;
  line-height: 1;
  font-weight: 700;
}
#footer .footer-top .footer-info p {
  font-size: 14px;
  line-height: 24px;
  margin-bottom: 0;
  
  color: #fff;
}
#footer .footer-top .social-links a {
  font-size: 18px;
  display: inline-block;
  background: #187bcd;
  color: #fff;
  line-height: 1;
  padding: 8px 0;
  margin-right: 4px;
  border-radius: 5px;
  text-align: center;
  width: 36px;
  height: 36px;
  transition: 0.3s;
}
#footer .footer-top .social-links a:hover {
  background: #3eb0e1;
  color: #fff;
  text-decoration: none;
}
#footer .footer-top h4 {
  font-size: 16px;
  font-weight: 600;
  color: #fff;
  position: relative;
  padding-bottom: 12px;
}
#footer .footer-top .footer-links {
  margin-bottom: 30px;
}
#footer .footer-top .footer-links ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
#footer .footer-top .footer-links ul i {
	padding-right: 2px;
	color: #FFF;
	font-size: 18px;
	line-height: 1;
}
#footer .footer-top .footer-links ul li {
  padding: 10px 0;
  display: flex;
  align-items: center;
}
#footer .footer-top .footer-links ul li:first-child {
  padding-top: 0;
}
#footer .footer-top .footer-links ul a {
  color: #fff;
  transition: 0.3s;
  display: inline-block;
  line-height: 1;
}
#footer .footer-top .footer-links ul a:hover {
	color: #CACACA;
}
#footer .footer-top .footer-newsletter form {
  margin-top: 30px;
  background: #fff;
  padding: 6px 10px;
  position: relative;
  border-radius: 4px;
}
#footer .footer-top .footer-newsletter form input[type=email] {
  border: 0;
  padding: 4px;
  width: calc(100% - 110px);
}
#footer .footer-top .footer-newsletter form input[type=submit] {
  position: absolute;
  top: 0;
  right: -2px;
  bottom: 0;
  border: 0;
  font-size: 16px;
  padding: 0 20px;
  background: #187bcd;
  color: #fff;
  transition: 0.3s;
  border-radius: 0 5px 5px 0;
}
#footer .footer-top .footer-newsletter form input[type=submit]:hover {
  background: #3eb0e1;
}
#footer .copyright {
  text-align: center;
  padding-top: 30px;
}
#footer .credits {
  padding-top: 10px;
  text-align: center;
  font-size: 13px;
  color: #fff;
}
#footer .credits  a {
  padding-top: 10px;
  text-align: center;
  font-size: 13px;
  color: #fff;
}
#footer .credits a:hover {
  padding-top: 10px;
  text-align: center;
  font-size: 13px;
  color: #CACACA;
}