* {
  margin: 0;
  padding: 0;
}

@font-face {
  font-family: 'Montserrat-BlackItalic';
  src: url('Fonts/Montserrat-BlackItalic.ttf') format('truetype');
}

@font-face {
  font-family: 'Montserrat-Black';
  src: url('Fonts/Montserrat-Black.ttf') format('truetype');
}

@font-face {
  font-family: 'Montserrat-Thin';
  src: url('Fonts/Montserrat-Thin.ttf') format('truetype');
}

@font-face {
  font-family: 'Montserrat-Bold';
  src: url('Fonts/Montserrat-Bold.ttf') format('truetype');
}

:root {
  --white-color: #fff;
  --dark-color: #222;
  --body-bg-color: #fff;
  --section-bg-color: #202834;
  --navigation-item-hover-color: #3b5378;
  --text-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
  --box-shadow: 0 5px 25px rgb(0 0 0 /20%);
  --scroll-bar-color: #fff;
  --scroll-thumb-color: #282f4e;
  --scroll-thumb-hover-color: #454f6b;
}

html {
  font-size: 20px; /* Tamaño de fuente base en píxeles */
}

header {
  min-height: 100vh;
  position: relative;
}

header video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* Otros estilos personalizados */
}

#Preloader1
{
  background: white;
  height: 100vh;
  width: 100%;
  position: fixed;
  z-index: 999;
}

.image-container {
  position: absolute;
  top: 40%; /* Ajusta según sea necesario */
  left: 50%;
}

/* Estilo para la imagen de fondo */
.background-image {
  width: 350px;
  height: auto;
  display: block;
  position: absolute;
  top: 50%; /* Ajusta según sea necesario */
  left: 50%; /* Ajusta según sea necesario */
  transform: translate(-50%, -50%);
}

/* Estilo para la imagen que se superpone */
.overlay-image {
  position: absolute;
  top: 50%; /* Ajusta según sea necesario */
  left: 50%; /* Ajusta según sea necesario */
  transform: translate(-50%, -50%);
  width: 200px; /* Ajusta según sea necesario */
  height: auto;
  display: block;
}

#Preloader1.hidden {
  display: none;
}

#Preloader
{
  background: white;
  height: 100vh;
  width: 100%;
  position: fixed;
  z-index: 100;
}

#PreloaderBox
{
  margin-top: 120px;
  display: flex;
  align-items: center;
  flex-direction: column;
}

#PreloaderImg
{
  width: 300px;
}

#PreloaderTitleES
{
  padding-top: 20px;
  text-align: center;
  line-height: 1;
  font-family: 'Montserrat-Bold';
  color: #0d1e01;
  font-size: 2.5rem;
}



#PreloaderLanguageES
{
  text-align: center;
  line-height: 1;
  font-family: Arial, 'Helvetica', sans-serif;
  color: black;
  font-size: 1.5rem;
}

#PreloaderLanguageEN
{
  padding-bottom: 10px;
  text-align: center;
  line-height: 1;
  font-family: Arial, 'Helvetica', sans-serif;
  color: black;
  font-size: 1.3rem;
}

#B-ES, #B-EN 
{
  border: 1px solid black;
  background-color: white;
  font-size: 1.4rem;
  font-weight: 500;
  padding: 8px 25px;
  display: flex;
  align-items: center;
  margin-top: 10px;
  border-radius: 10px;
  cursor: pointer;
  color: #000000;
  text-decoration: none;
}

#B-ES:hover, #B-EN:hover
{
  border: 1px solid white;
  background-color: black;
  color: white;
}

#CookiesBanner
{
  height: 100px;
  width: 100%;
  position: fixed;
  z-index: 80;
  bottom: 0;
  align-items: center;
  text-align: center;
  justify-content: center;
  display: flex;
  
}

#CookiesBannerBox
{
  display: flex;
  align-items: center;
  max-width: 600px;
  padding: 5px;
  border-radius: 10px;
  text-shadow: var(--text-shadow);
  background: rgba(0, 0, 0, 0.5);
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
}

#CenterTextCookies
{
  display: flex;
  align-items: center;
}

#CookiesBannerImg
{
  height: 70px;
  width: 70px;
  fill: white;
  position: relative;
  left: 10px;
}

#CookiesBannerES
{
  text-align: center;
  line-height: 1.1;
  font-family: Arial, 'Helvetica', sans-serif;
  color: white;
  font-size: 0.9rem;
  padding-top: 5px;
  padding-bottom: 5px;
}

#CenterBotonsCookies
{
  display: flex;
  gap: 20px;
  align-items: center;
  justify-content: center;
  padding-bottom: 10px;
}

#CB-Accept, #CB-Reject 
{
  border: 1px solid black;
  background-color: white;
  font-size: 0.9rem;
  font-weight: 500;
  padding: 6px 20px;
  display: flex;
  align-items: center;
  border-radius: 10px;
  cursor: pointer;
  color: #000000;
  text-decoration: none;
}

#CB-Accept:hover, #CB-Reject:hover
{
  border: 1px solid white;
  background-color: black;
  color: white;
}

#BtnWhatsapp {
  position: fixed;
  right: 30px;
  bottom: 30px;
  z-index: 10;
  background: #59CE72;
  border-radius: 50%;
  width: 1px; /* Ancho inicial */
  height: 1px; /* Altura inicial */
  cursor: pointer;
  transition: width 1s, height 1s;
}

#BtnWhatsapp.expanded {
  width: 60px; /* Ancho al hacer scroll */
  height: 60px; /* Altura al hacer scroll */
}

#BtnWhatsapp a {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-decoration: none; /* Si deseas quitar el subrayado */
  opacity: 0; /* Inicialmente oculto */
  transition: opacity 0.5s; /* Transición suave para la opacidad */
}

#BtnWhatsapp.expanded a {
  opacity: 1; /* Mostrar el icono cuando se expande el contenedor */
}

#BtnWhatsapp a i {
  color: white;
  font-size: 2rem;
}

#BtnWhatsapp:hover {
  background: #215C54;
  transition: background 0.6s; /* Solo transición para el color de fondo */
}


.Encabezado {
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  /* Puedes usar 'space-around' en lugar de 'space-between' si quieres un poco más de espacio */
  align-items: center;
  position: relative;
  z-index: 1;
  max-width: 1280px;
  padding-right: 48px;
}


.MenuEncabezado {
  position: relative;
  top: 0.4rem;
}

.mostrar-menu,
.ocultar-menu {
  font-size: 7.5rem;
  display: none;
}

.mostrar-menu {
  order: 1;
  color: rgba(0, 0, 0, 0.8);
  font-weight: bold;
}

.ocultar-menu {
  color: #ffffff;
  position: relative;
  top: 0px;
  font-weight: bold;
}

#check {
  display: none;
}

.LogoEncabezado 
{
  position: relative;
  top: 10px;
  width: 300px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.LogoEncabezado img
{
  max-width: 100%;
  max-height: 100%;
}

nav {
  background-color: none;
}

nav ul {
  list-style: none;
  margin: 0px;
  padding: 0px;
  display: flex;
  justify-content: center;
}

nav li {
  position: relative;
}

nav a {
  display: block;
  padding: 11px;
  text-decoration: none;
  color: black;
  font-size: 1.1rem;
  font-family: Arial, Helvetica, sans-serif;
}

nav a:hover,
nav a:focus {
  text-decoration: underline;
}

/* Estilos para la lista desplegable */
nav ul ul 
{
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background-color: rgba(255, 255, 255, 0.452); /* Cambio de color de fondo a negro */
  color: white; /* Cambio de color de las letras a blanco */
  padding: 0;
  margin: 0;
  border: 1px solid none;
  z-index: 2;
  text-align: center;
}

nav ul ul li {
  width: 100%;
  border-top: 1px solid #cccccc;
}

nav ul li:hover > ul {
  display: inline-block;
}





main 
{
  height: fit-content;
  min-height: 600px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0;
  padding: 0;
}

#CenterAll
{
  margin: 0;
  height: 100%;
  display: flex;
  justify-content: space-between; /* Centramos horizontalmente el contenido */
  max-width: 1280px;
  opacity: 0;
  transform: translateY(75px);
  transition: opacity 0.5s, transform 0.6s;
  pointer-events: none;
}

#CenterAll.show {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

#CenterAll .ImgMain
{
  max-height: 100%;
  min-width: 30%;
  display: flex;
}

#CenterAll .ImgMain img
{
  max-height: 100%;
  max-width: 100%;
}

.VideoSection
{
  height: fit-content;
  justify-content: center;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #0d1e00;
  height: 800px;
}


.TextoMain
{
  text-align:center;
  padding-bottom: 25px;
}

.TextoMain1
{
  text-align:center;
}

.TextoMain2
{
  text-align:center;
}


.SectionParallax1 {
  display: flex;
  background-color: #000000;
  height: 600px;
  position: relative;
  overflow: hidden; /* Agrega posicionamiento relativo al contenedor */
  justify-content: center;
  align-items: center;
}

.SectionParallax1 img {
  opacity: 0.7;
  position: relative;
  align-items: center;
  justify-content: center;
  width: 100%;
}

.SectionParallax1 h2 {
  text-align: center;
  margin-top: 15px;
  line-height: 1;
  font-family: 'Montserrat-Bold';
  color: #ffffff;
  font-size: 4.5rem;
  margin-bottom: 5px;
  max-width: 1280px;
  position: absolute;
}

.Aguila 
{
  height: fit-content;
  min-height: 600px;
  justify-content: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

#B-Aguila 
{
  color: #2B5336; /* Color del texto en rojo oscuro */
  background-color: transparent; /* Fondo transparente */
  border: none; /* Sin bordes */
  font-weight: bold; /* Negrita */
  font-family:'Montserrat-Bold';/* Fuente Helvetica */
  font-size: 1rem;
  cursor: pointer;
}
.BotonAguila:hover {
  text-decoration: underline;
}

.Aguila #CenterAll .ImgAguila
{
  min-width: 30%;
}

.Aguila #CenterAll .ImgAguila img
{
  height: 100%;
  width: 100%;
}

.SectionParallax2 
{
  position: relative;
  display: flex; /* Agrega posicionamiento relativo al contenedor */
  justify-content: center;
  align-items: center;
  max-height: 600px;
  background-color: #000000;
  overflow: hidden;
}

.SectionParallax2 img {
  opacity: 0.65;
  width: 100%;
}

#SCP {
  opacity: 0; /* Inicialmente, establece la opacidad en 0 para que estén ocultas */
  transform: translateY(180px); /* Desplazamiento inicial hacia abajo */
  transition: opacity 0.5s ease, transform 0.5s ease; /* Agrega transiciones para una animación suave */
}


#CenterText
{
  position: absolute;
  display: flex; /* <img class="ParrallaxEffect" src="_MG_5279_SK.jpg" alt="image"> Utilizamos flexbox */
  justify-content: center; /* Centrar horizontalmente */
  align-items: center; 
  z-index: 1;
  height: max-content;
}

 #Title
{
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: center;
  line-height: 1;
  font-family: 'Montserrat-Bold';
  color: #ffffff;
  font-size: 4.5rem;
}

#Title1
{
  padding-top: 15px;
  padding-bottom: 10px;
  text-align: center;
  line-height: 1;
  font-family: 'Montserrat-Bold';
  color: #ffffff;
  font-size: 2.5rem;
  color: #2B5336;
}

#Title2
{
  padding-top: 20px;
  padding-bottom: 5px;
  text-align: center;
  line-height: 1;
  font-family: 'Montserrat-Bold';
  color: #2B5336;
  font-size: 2.5rem;
  justify-content: center;
}

#Title3
{
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: center;
  line-height: 1;
  font-family: 'Montserrat-Bold';
  color: #2B5336;
  font-size: 2.5rem;
}

#Title4
{
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: center;
  line-height: 1;
  font-family: 'Montserrat-Bold';
  color: white;
  font-size: 4.5rem;
}

#Subtitle
{
  line-height: 1.5;
  font-family: 'Helvetica', sans-serif;
  font-size: 1.1rem;
  color: black;
  margin-right: 50px;
  margin-left: 50px;
}

#SubtitleP
{
  line-height: 1.5;
  font-family: 'Helvetica', sans-serif;
  font-size: 1.2rem;
  color: rgb(255, 255, 255);
  padding: 5px;
  max-width: 550px;
  text-align: center;
}

.Lagarto 
{
  height: fit-content;
  min-height: 550px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #fff;
  
}

#CenterAll .ImgLizard
{
  max-height: 100%;
  min-width: 45%;
  max-width: 55%;
  display: flex;
}

#CenterAll .ImgLizard img
{
  max-height: 100%;
  max-width: 100%;
}



.SectionParallax2 .Actividades-btn 
{
  background-color: white;
  color: black;
  font-size: 1.2rem;
  border-radius: 10px;
  padding: 10px 25px;
  align-self: baseline;
  font-weight: bold;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  width: auto;
  margin: 0;
  cursor: pointer;
  position: relative;
  top: -25px;
  border: none;

}

.SectionParallax2 .Actividades-btn i
{
  font-size: 1.4rem;
  transition: 0.3s ease;
  position: relative;
  top: 0px;
  left: 5px;
}
.SectionParallax2 .Actividades-btn:hover
{
  background-color: black;
  color: white;
}

.SectionParallax2 .Actividades-btn:hover i
{
  transform: translateX(8px);
}

footer 
{
  /* Estilos para el footer en general */
  background-color: #157139;
  position: relative;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  display: flex;
  justify-content: space-between;
}

#CenterFooter 
{
  padding-top: 60px;
  padding-left: 10px;
  padding-right: 10px;
  max-width: 1280px;
  display: flex;
  gap: 5%;
  line-height: 0.9rem;
}


#CenterFooter h7 
{ /* Eliminar márgenes por defecto */
  font-size: 1.2rem; /* Tamaño de fuente deseado */
  color: #000000; /* Color de texto deseado */
  font-family: Arial, 'Helvetica', sans-serif;
  font-weight: bold;
  text-decoration: none;
}

#CenterFooter h7 a, #CenterFooter p a
{ /* Eliminar márgenes por defecto */
  text-decoration: none;
  color: #000000;
}

#CenterFooter h7 a:hover, #CenterFooter p a:hover
{ /* Eliminar márgenes por defecto */
  text-decoration: none;
  color: #ffffff;
}

#CenterFooter h8
{ /* Eliminar márgenes por defecto */
  font-size: 0.8rem; /* Tamaño de fuente deseado */
  color: #000000; /* Color de texto deseado */
  font-family: Arial, 'Helvetica', sans-serif;
}

#TextHF
{ /* Eliminar márgenes por defecto */
  font-size: 0.9rem; /* Tamaño de fuente deseado */
  color: #000000; /* Color de texto deseado */
  font-family: Arial, 'Helvetica', sans-serif;
}

.HoursFooter
{
  text-align: left;
  min-width: 30%;
}

.ContactFooter
{
  text-align: left;
  min-width: 20%;
}

#Copyright
{ /* Eliminar márgenes por defecto */
  font-size: 0.7rem; /* Tamaño de fuente deseado */
  color: #000000; /* Color de texto deseado */
  font-family: Arial, 'Helvetica', sans-serif;
  margin-top: 35px;
  margin-bottom: 10px;
}

@media  (max-width: 1023px) 
{

  .Encabezado {
    padding-right: 10px;
    padding-left: 10px;
  }

  .VideoSection
{
  height: fit-content;
  justify-content: center;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #0d1e00;
  height: 650px;
}

  main 
{
  min-height: 550px;
  padding-left: 25px;
}

#Title1
{
  padding-top: 0px;
  padding-bottom: 10px;
  text-align: center;
  line-height: 1;
  font-family: 'Montserrat-Bold';
  color: #ffffff;
  font-size: 2.5rem;
  color: #2B5336;
}

  #Subtitle
{
  line-height: 1.5;
  font-family: 'Helvetica', sans-serif;
  font-size: 1rem;
  color: black;
  margin-right: 25px;
  margin-left: 25px;
}

  .SectionParallax1 {
    height: 400px;
  }
  
  .SectionParallax1 img {
    opacity: 0.7;
    position: relative;
    align-items: center;
    justify-content: center;
    width: 60%;
  }

  .Aguila 
{
  height: fit-content;
  min-height: 550px;
  justify-content: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

.SectionParallax2 {
  height: 400px;
}

.SectionParallax2 img {
  opacity: 0.7;
  position: relative;
  align-items: center;
  justify-content: center;
  width: 58%;
}

.Lagarto 
{
  height: fit-content;
  min-height: 450px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #fff;
}

footer 
{
  padding-left: 10px;
  padding-right: 10px;
}

}