body {
  font-family: 'Manrope', sans-serif;
  font-weight: 200;
  color: #1b161d;
  background-color: #ffffff;
  top: 0 !important;
}

body h1,h2,h3,h4{
  font-family: 'Playfair Display', serif;

}
.skiptranslate {display: none;}


#numero {
  font-size: 48px;
  font-weight: bold;
  color: white;
  top: 80% !important;
}



.body-bg {
  background-image: url(../images/body-bg.png);
  background-size: cover;
  background-repeat: no-repeat;
}

.layout_padding {
  padding: 75px 0;
}

.layout_padding2 {
  padding: 45px 0;
}

.layout_padding2-top {
  padding-top: 45px;
}

.layout_padding2-bottom {
  padding-bottom: 45px;
}

.layout_padding-top {
  padding-top: 75px;
}

.layout_padding-bottom {
  padding-bottom: 75px;
}

.hero-area{
  
}

/*header section*/


.header_section {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  width: 100vw;
  height: 8vh;
  z-index: 50; 
  background-color: #236093; 
 
}

.header_section .container-fluid {
  height: 8vh;
  display: flex;
  position: absolute;
  left: 6vw;
}

.header_section .nav_container {
  margin: 0 auto;
  
}#background-video{
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;

}

#home-section{
  position: relative;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

#slide1{
 width: 100%;
 height: 100%;
}

#slide2{
  width: 100%;
  height: 100%;
}

#slide1 img{
  position: absolute;
  width: 600px;
  top: 45%;
  left: 50%;
  transform: translate(-50%, -50%);
}

#slide2 img{
  position: absolute;
  top: 15%;
  left: 7%;
  width: 7vh;
}

#slide2 span{
  font-family: 'Manrope', sans-serif;
  font-weight: 400;
  position: absolute;
  top: 40%;
  left: 7%;
  font-size: 250%;
  color: white;
}

.slide-activo {
   opacity: 1;
  
  transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out; 
}

.slide-inactivo {
   opacity: 0;
  
  transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out; 
}

.slide-inactivo a {
cursor: default;
}


#slide2 .slide-animales{
  display: none;
}

#home-section .adpa-portada{
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0vh 20vw;
}

#home-section .adpa-portada img{
  width: 35vw;
  margin-bottom: 15vh;
}

#home-section .adpa-portada h3{
  color: white;
  text-align: center;
  margin-bottom: 15vh;
}

.div-marcas{
  height: 80vh;
  display: flex;
    flex-direction: column;
    align-items: center;
    padding: 10vh 0vw;
}

.marcas {
  width: 70vw;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  align-items: center;
  margin-top: 4vh;
}

.marcas a {
  flex: 1 0 calc(25% - 20px);
  height: auto;
  object-fit: contain;
  margin: 10px;
  max-width: 100%;
  max-height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.marcas img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}



.adpa-section2 {
  position: relative;
  height: 100vh;

  max-width: 100vw;
  
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

.adpa-section2 video {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
}

.adpa-section2 .titulo {
  position: absolute;
  top: 20%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  font-size: 3rem;
  font-weight: 600;
  text-align: center;
  font-family: 'Playfair Display', serif;
}


.adpa-section2 .datos {
  position: absolute;
  top: 25%;
  width: 80vw;
  height: 70vh;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

.adpa-section2 .dato {
  width: 40vw;
  padding: 20px;
  color: white;
  text-align: center;
}

.adpa-section2 .datos .dato .signo{
  font-size: 6rem;

}

.adpa-section2 .dato .dato-texto{
  font-size: 3.2vh;
}

.animated-number {
  font-size: 6rem;
  font-weight: bold;
  animation: animateNumber 1.5s ease-in-out;
}

@keyframes animateNumber {
  from {
    opacity: 0;
    transform: scale(0.5);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}



.boton-explorar a{
  position: absolute;
  top: 70%;
  color: white;
  left: 7%;
  padding: 1% 4% 1% 4%;
  font-weight: bold;
  border: 5px #fff solid;
  background-color: transparent;
  text-decoration: none; /* para quitar el subrayado predeterminado */
  transition: all 0.3s ease; /* para agregar una transición suave al pasar el cursor sobre el enlace */
  box-shadow: 2px 2px 5px rgba(0,0,0,0.5); /* para agregar una sombra */
}
.boton-explorar a:focus{
  outline: none;
}

.boton-explorar a:hover {
  background-color: white; /* para cambiar el color de fondo al pasar el cursor */
  color: black; /* para cambiar el color del texto al pasar el cursor */
  border: 5px #333 solid; /* para cambiar el borde al pasar el cursor */
  box-shadow: 2px 2px 10px rgba(0,0,0,0.7); /* para agregar una sombra más pronunciada */
}


.custom_nav-container.navbar-expand-lg .navbar-nav .nav-link img {
  width: 5%;
  margin-right: 15px;
}

.custom_nav-container.navbar-expand-lg .navbar-nav .nav-link {
 
  color: #fefeff;
  text-align: center;
  font-family: 'Manrope', sans-serif;
}
.custom_menu-btn {
position: absolute;
right: 0;
left: 0;
top: 0; /* Cambiado desde top a bottom */
z-index: 11;
margin-right: 2.0vh;
}

.boton-search{
  position: absolute;
right: 0;
left: 0;
bottom: 0; /* Cambiado desde top a bottom */
z-index: 1;

}

.custom_menu-btn button {
margin-top: 1.66vh;
margin-bottom: 1.66vh; /* Agregado para separar los botones verticalmente */
outline: none;
border: none;
background-color: transparent;
padding-left: 0.7vw;
}

.custom_menu-btn button span {
display: block;
width: 1.3vw;
height: 0.5vh;
background-color: #fff;
margin: 8px 0;
transition: all 0.3s;
border-radius: 5px;
}

.custom_menu-btn .s-2 {
width: 1.5vw;
margin-left: auto;
}


.menu_btn-style {
  position: fixed;
  right: 12px;
  top: 0;
  left: 15px;
  z-index: 2;
}



.custom_menu-btn .s-2 {
  transition: all 0.1s;
}

.menu_btn-style button .s-1 {
  transform: rotate(45deg) translateY(17px);
}

.menu_btn-style button .s-2 {
  transform: translateX(-66px);
}

.menu_btn-style button .s-3 {
  transform: rotate(-45deg) translateY(-17px);
}


.overlay {
  height: 0;
  width: 100vw;
  position: fixed;
  z-index: 0;
  top: 8vh;
  left: 0;
  background-image: url(/images/fondo_menu.jpg);
  background-size: cover;
  overflow-x: hidden;
  transition: 0.5s;
}

.overlay .closebtn {
  position: absolute;
  top: 0;
  right: 30px;
  font-size: 60px;
}

.overlay a {
  padding: 10px;
  text-decoration: none;
  font-size: 4.5vh;
  color: #f1f1f1;
  display: block;
  transition: 0.3s;
}

.overlay-content {
  position: relative;
  width: 100%;
  height: 90vh;
  display: flex;
  text-align: center;
  flex-direction: column;
  justify-content: center;
  font-family: 'Playfair Display', serif;
 
}

.menu_width {
  height: 100vh;
}

.menu_text{
z-index: 10;
padding-left: 2vw;
}

.menu_text button {
  background-color: transparent;
  border: none;
}
.menu_text button:focus {
  background-color: transparent;
  outline: none;
}

.menu_text button span{
  background-color: transparent;
  color: white;
  font-size: 1.4rem;
}


a,
a:hover,
a:focus {
  text-decoration: none;
}

a:hover,
a:focus {
  color: white;
  text-decoration-line: underline;
}

.btn,
.btn:focus {
  outline: none !important;
  box-shadow: none;
}

.custom_nav-container .nav_search-btn {
  background-image: url(../images/search-icon.png);
  background-size: 18px;
  background-repeat: no-repeat;
  width: 35px;
  height: 35px;
  padding-bottom: 40px;
  z-index: 1;
  border: none;
  background-position: center;
}

.navbar-brand {
  display: flex;
  align-items: center;
}

.navbar-brand img {
  width: 40px;
  margin-right: 5px;
}

.navbar-brand span {
  font-family: 'Manrope', sans-serif;
  font-size: 24px;
  font-weight: 500;
  color: #fefeff;
  margin-top: 5px;
}


.custom_nav-container .navbar-toggler {
  outline: none;
}

.custom_nav-container .navbar-toggler .navbar-toggler-icon {
  background-image: url(../images/menu.png);
  background-size: 55px;
}

.quote_btn-container a {
  display: inline-block;
  padding: 5px 15px;
  background-color: #fc5d35;
  color: #f7f7f7;
  font-size: 14px;
  text-transform: uppercase;
}

/*end header section*/

/* slider section */

.slider_section {
  padding-top: 75px;
}

.slider_item-box {
  width: 100%;
  height: 100%;
}

.slider_item-box .container {
  height: 100%;
}

.slider_img-box {
  width: 85%;
  margin: 0 auto;
}

.slider_img-box img {
  width: 100%;
}

.slider_item-container {
  width: 90%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.slider_item-detail {
  text-align: center;
  color: #fff;
}

.slider_item-detail h1 {
  font-weight: 600;
}

.slider_item-detail p {
  margin: 40px 0 45px 0;
}

.slider_item-detail a {
  display: inline-block;
  background-color: #fddd33;
  color: #fff;
  font-size: 15px;
  border-radius: 10px;
  padding: 10px 40px;
}

.slider_item-imgbox {
  margin-top: 45px;
  width: 75%;
}

.slider_item-imgbox img {
  width: 100%;
}

.slider_section #carouselExampleControls,
.carousel-inner,
.carousel-item {
  height: 100%;
}

.slider_section .carousel-control-prev,
.slider_section .carousel-control-next {
  position: absolute;
  top: 50%;
  width: 45px;
  height: 45px;
  border: none;
  border-radius: 100%;
  opacity: 1;
  background-repeat: no-repeat;
  background-size: 28px;
  background-position: center;
  background-color: #fff;
  transform: translateY(-50%);
}

.slider_section .carousel-control-prev:hover,
.slider_section .carousel-control-next:hover {
  background-color: #292727;
  background-size: 12px;
}

.slider_section .carousel-control-prev {
  left: 2%;
  background-image: url(../images/left-black-arrow.png);
}

.slider_section .carousel-control-next {
  right: 2%;
  background-image: url(../images/right-black-arrow.png);
}

.slider_section .carousel-control-prev:hover {
  background-image: url(../images/prev.png);
}

.slider_section .carousel-control-next:hover {
  background-image: url(../images/next.png);
}

/* end slider section */

/* about section */
.about_section {
  margin-top: 45px;
  text-align: center;
}

.about_section h2 {
  text-transform: uppercase;
}

.about_section h4 {
  font-size: 22px;
  font-weight: 600;
}

.about_card-container {
  display: flex;
  justify-content: center;
}

.about_card .about-detail {
  padding: 2px 25px 35px 25px;
}

.about_img-container {
  width: 225px;
  background-color: #1ba1b9;
  height: 225px;
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 25px solid #d7daf4;
  margin: 0 auto 45px auto;
}

.about_card .about_img-box {
  width: 75px;
}

.about_card .about-detail p {
  margin-top: 15px;
}

.about_card img {
  width: 100%;
}

/* end about section */

/* client section */

/* who section */
.who_section {
  background-color: #2801b9;
}

.who_container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 15px;
}

.who_section {
  color: #fff;
}

.who_section .who_img-box {
  background-color: #fff;
  border-radius: 100%;
  padding: 50px;
  transform: scale(1.01) translateX(-10%);
  overflow: hidden;
  width: 60%;
}

.who_img-box img {
  width: 100%;
}

.who_section .who_deail-box {
  text-align: right;
  width: 40%;
}

.who_section .who_deail-box p {
  margin: 45px 0 50px 0;
}

.who_section .who_deail-box a {
  display: inline-block;
  background-color: #fddd33;
  color: #fff;
  font-size: 15px;
  border-radius: 10px;
  padding: 12px 32px;
}

.who_container {
  display: flex;
}

/* end who section */

/* feature section */

.feature_section {
  text-align: center;
}

.feature_card-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.feature_img-container {
  background-color: #1ba1b9;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 190px;
  border-radius: 10px;
}

.feature_img-box {
  width: 100px;
}

.feature_card {
  width: 300px;
  padding: 0 15px;
  margin: 35px 0;
}

.feature_card h5 {
  text-transform: uppercase;
}

.feature_card img {
  width: 100%;
}

.feature_detail-box {
  margin: 35px auto 0 auto;
}

.feature_detail-box h4 {
  font-weight: 600;
  font-size: 20px;
}

/* end feature section */

/* contact section */
.contact_section .row {
  align-items: center;
}

.form_bg {
  background-color: #2801b9;
}

.contact_section h2 {
  text-align: center;
  text-transform: uppercase;
}

.contact_section p {
  color: #787877;
  text-align: center;
  font-size: 20px;
  margin-bottom: 0;
}

.contact_section input,
.contact_section textarea {
  outline: none;
  border: 1px solid #c1c1c2;
  width: 100%;
  height: 45px;
  padding: 0 15px;
  margin-top: 5px;
  margin-bottom: 25px;
}

.contact_section .message_input {
  height: 125px;
}

.contact_form-container {
  padding: 45px 35px;
  width: 90%;
}

.contact_form-container button {
  border: none;
  background-color: #fddd33;
  color: #fff;
  padding: 12px 65px;
  font-size: 16px;
  border-radius: 5px;
  text-transform: uppercase;
}

.contact_img-box img {
  width: 100%;
}

/* contact section */

/* info section */
.info_section {
  position: relative;
  background-color: #161616;
  font-family: 'Manrope', sans-serif;
}

.info_section img {
  width: 100%;
}

.info_section ul {
  padding: 0;
}

.info_section ul li {
  list-style-type: none;
  margin: 10px 0;
}

.info_section ul li a,
.info_section ul li a:hover {
  color: #fff;
}

.info_section h5 {
  margin-bottom: 12px;
  font-size: 22px;
  color: #fff;
  border-bottom: 2px solid #feb543;
}

.info_section .social-box {
  margin: 25px 0;
}

.info_section .social-box img {
  width: 35px;
  margin-right: 5px;
}

.form_container form {
  display: flex;
  align-items: center;
}

.info_section .form_container label {
  margin: 0;
  font-size: 18px;
  text-transform: uppercase;
  color: #fff;
}

.info_section .form_container input {
  width: 300px;
  height: 40px;
  border-radius: 5px;
  border: none;
  outline: none;
  padding-left: 15px;
  background-color: #fff;
  margin-left: 45px;
  margin-right: 10px;
}

.info_section .form_container button {
  background-color: #d9c406;
  border: none;
  outline: none;
  color: #fff;
  padding: 8px 50px;
  text-transform: uppercase;
  font-size: 16px;
  border-radius: 5px;
  text-transform: uppercase;
}

/* end info section */

/* footer */

iframe{
  border: none;
  height: 90vh;
}

#player{
  height: 720px;
}

.footer{
  width: 100%;
  background-image: url('../images/jose-americo.jpg');
  background-size: cover;
  display: flex;
  padding: 10vh 9vw 10vh 9vw;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  height: -webkit-fill-available;
  
}

.footer h4{
  font-family: 'Manrope', sans-serif !important;
}

#footer::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: #010f2b;
  opacity: .9;
  z-index: 1;
}

.footer a{
  color: rgba(255, 255, 255, 0.8);
  font-size: 1vw;
  transition: all 0.3s ease;
}

.footer a:hover{
  color: rgb(255, 255, 255);
  font-size: 1vw;
}

.footer h4,h5{
  font-size: 3.1vh;
  color: rgba(255, 255, 255, 0.9);
  font-weight: 600;
}

.colf1{
  width: 30%;
  display: flex;
  flex-direction: row;
  padding: 14vh 2vw 30vh 2vw;
  z-index: 1;
  flex-wrap: wrap;
}

.colf1 .titulof{
  width: 100%;
  padding-bottom: 3vh;
}

.colf1 .col1{
  width: 50%;
  display: flex;
  flex-direction: column;
}

.colf2{
  width: 10%;
  display: flex;
  flex-direction: row;
  z-index: 1;
  padding: 0vh 0vw 30vh 0vw;
}

.colf2 img{
  height: 3vh;
  opacity: 8;
  margin: 0.5vw;
}

.colf4{
  width: 10%;
  z-index: 1;
  padding: 13vh 0vw 30vh 0vw;
}

.colf4 img{
  width: 10vh;
}




/* end footer */


/*secciones informacion*/

.mar-argentino-menu{
  
  width: 100%;
  height: 100vh;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

#mar-argentino::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: #042260c2;
  opacity: .7;
  z-index: 1;
}

#mar-argentino video {
  max-height: 100%;
  position: relative;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.mar-argentino-info{
  width: 55%;
  margin-left: 10vh;
  margin-top: 20vh;
  color: white;
  position: absolute;
  height: 70vh;
  z-index: 2;
}
.mar-argentino-info h4{
  font-size: 2.4vh;
  font-family: 'Manrope', sans-serif;
  font-weight: 600;
}

.mar-argentino-info h1{
  font-family: 'Playfair Display', serif;
  margin-top: 2vh;
  margin-bottom: 2vh;
  font-weight: bold;
  font-size: 7vh;
  }

.mar-argentino-info span{
  font-family: 'Manrope', sans-serif;
  font-size: 1.3vw;
  font-weight: 200;
  line-height: 1.3;
}
.mar-argentino-info img{
  width: 14vh;
  margin-bottom: 8vh;
}

.mar-argentino-link{
  width: 40%;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: space-evenly;
  height: 70vh;
  position: absolute;
  right: 0;
  z-index: 2;
  margin: 10vw 7vw 0vw 0vw;
  font-family: 'Manrope', sans-serif;
  font-weight: 500;
}

.barra-links{
  height: 5vh;
  width: 100vw;
  background-color: #082d4b;
  color: white;
  z-index: 3;
  position: fixed;
  box-shadow: 0px 2px 3px 1px #00000066;
  top: 8vh;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.barra-links a{
  color: white;
  font-size: 1.2rem;
  padding: 0 1vw;
  font-weight: bold;
}

.mar-argentino-link a{
  color: white !important;
  font-size: 1.1vw;
  cursor: pointer;
  transition: text-decoration .3s;
}

.mar-argentino-link a:hover , :focus-visible {
 outline: none;
  text-decoration: underline #236093 4px !important;
  
}

/*secciones video y descripcion*/
.video-seccion{
  
  padding-top: 90px;
  background-color: #082d4b;
  display: flex;
  flex-direction: row;
  justify-content: center;
  height: 300px;
  width: 100%;
  }

.video-seccion video{
  position: relative;
  height: 50vh;
}

.video-seccion img {
  position: initial;
  top: 0px;
  height: 60vh;
  z-index: 1;
  max-width: 100vw;
}

.informacion-seccion{
  width: 100%;
  display: flex;
  
  flex-direction: row;
  flex-wrap: wrap;
}

.expandir-btn{
  display: none;
}

.caracteristicas-seccion{
  width: 26vw;
  display: flex;
  padding: 42vh 11vh 11vh 5.2vw;
  background-color: #eff6f5;
  text-align: center;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;

}

.caracteristicas-seccion h4{
  font-size: 1.1vw;
  font-weight: 600;
  font-family: 'Manrope', sans-serif !important;
}

.caracteristicas-seccion span{
  font-size: 1vw;
  color: #082d4b;
  text-align: initial;
}

.sub-informacion{
  width: 100%;
  display: flex;
  margin: 15vh 0vw 10vh 0vw;

}
.sub-informacion .sub-text{
width: 60%;
font-size: 2.24vh;
line-height: 1.7;
margin: 0vh 5vw 0vh 8vw;
}

.sub-informacion .sub-img{
width: 40%;
}

.sub-informacion .sub-img img{
  max-width: 30vw;
  text-align: center;
  }

  .sub-informacion .sub-img video{
    width: 50vw;
    margin-left: 3vw;
  }




.descripcion-seccion{
  width: 65%;
  padding: 42vh 11vh 11vh 11vh;
  background-color: white;
  display: flex;
    flex-direction: column;
    justify-content: center;
}
.descripcion-seccion h3{
  text-align: center;
  font-family: 'Playfair Display', serif;
}

.descripcion-seccion span{
  font-size: 1.2vw;
  color: #082d4b;
  line-height: 1.7;
}

#comercio-exterior {
  margin: 0;
}

.infografia{
  margin: 8vh 0vw;
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

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

.video-mapa{
  width: 100%;
}


.descripcion-animal{
width: 100%;
height: 100%;

background-color: #082d4b;
padding-top: 90px;
padding-bottom: 90px;
display: flex;
}

.descripcion-animal .texto{
  width: 50%;
  color: white;
  padding: 0vh 4vw 0vh 5vw;
  align-self: center;
}

.descripcion-animal .texto h2{
  font-size: 1.7vw;
  font-weight: 400;
}

.descripcion-animal .texto span{
  font-size: 2.4vh;
  line-height: 1.9;
}

.descripcion-animal .imagen{
  width: 45vw;
  height: auto;
  position: relative;
  text-align: center;
  align-self: center;
}

.descripcion-animal .imagen img{
    width: auto;
    height: auto;
    max-height: 80vh;
    max-width: 40vw;
    object-fit: cover;
}

.descripcion-grid{
  display: flex;
}

.descripcion-grid .descripcion-animal-blanco
.texto{
  padding: 0vh 5vw 0vh 5vw;
}

.descripcion-animal-blanco{
width: 100%;
height: 100%;

background-color: #ffffff;
padding-top: 90px;
padding-bottom: 90px;
display: flex;
justify-content: center;
text-align: center;
}

.descripcion-animal-blanco .texto{
  width: auto;
  text-align: center;
  color: #082d4b;
  padding: 0vh 10vw 0vh 10vw;
}

.descripcion-animal-blanco .texto h2{
  font-size: 1.7vw;
  font-weight: 400;
}

.descripcion-animal-blanco .texto span{
  font-size: 2.4vh;
  line-height: 1.9;
}

.descripcion-animal-blanco .imagen{
  width: 45vw;
  height: 70vh;
  position: relative;
  text-align: center;
}

.descripcion-animal-blanco .imagen img{
  width: 30vw;
  height: 75vh;
  object-fit: cover;
}


.descripcion-animal-sf{
  width: auto;
  height: 100%;
  
  padding: 9vh 15vw 9vh 15vw;
  background-color: #082d4b;
  padding-top: 9vh;
  padding-bottom: 9vh;
  display: flex;
  justify-content: center;
  }
  
  .descripcion-animal-sf .texto{
    width: auto;
    color: white;
    text-align: center;
    padding: 0vh 5vw 0vh 5vw;
  }
  
  .descripcion-animal-sf .texto h2{
    font-size: 1.7vw;
    font-weight: 400;
  }
  
  .descripcion-animal-sf .texto span{
    font-size: 2.4vh;
    line-height: 1.9;
  }



.descripcion-video{
width: 100%;
height: 100%;
display: flex;
padding: 4vh 0vw;
justify-content: center;
background-color: #082d4b;
}

.descripcion-video video{
  padding: 10vh 0px 10vh 0px;
  width: 60%;
}
.descripcion-video img{
  padding: 80px 0px 80px 0px;
  width: 60%;
}


.preparacion1{
  width: 100%;
  height: 100vh;
  
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.preparacion1 img{
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: relative;
}

.preparacion1 .texto{
  width: 40%;
  color: white;
  padding: 3.5vh 2vw 3.5vw 6vw;
  text-align: center;
  position: absolute;
}

.preparacion1 .texto h2{
  font-size: 1.9vw;
  font-weight: 500;
}

.preparacion1 .texto span{
  font-size: 2.7vh;
  line-height: 1.9;
}



.preparacion2{
  width: 100%;
  
  background-color: #ffffff;
  padding-top: 90px;
  padding-bottom: 90px;
  display: flex;
  }
  
  .preparacion2 .texto{
  width: 50%;
  color: #082d4b;
  padding: 0vh 2vw 3vh 3vw;
  }
  
  .preparacion2 .texto h2{
    font-size: 1.7vw;
    font-weight: 400;
  }
  
  .preparacion2 .texto span{
    font-size: 2.4vh;
    line-height: 1.9;
  }
  
  .preparacion2 .imagen{
    width: 50%;
  }




  .preparacion2-sf{
    width: 100%;
    
    background-color: #ffffff;
    padding-top: 8vh;
    padding-bottom: 8vh;
    display: flex;
    justify-content: center;
    }
    
    .preparacion2-sf .texto{
    width: auto;
    color: #082d4b;
    text-align: center;
    padding: 0vh 2vw 3vh 3vw;
    }
    
    .preparacion2-sf .texto h2{
      font-size: 2vw;
      font-weight: bold;
    }
    
    .preparacion2-sf .texto span{
      font-size: 2.4vh;
      line-height: 1.9;
    }



.mapamundi{
  height: 150vh;
  width: 100%;
  position: relative;
  max-height: 100vh;
  overflow-y: hidden;
}

.mapamundi video{

}

.mapamundi img{
  position: absolute;
  z-index: 2;
  width: 70%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.google-translate{
  z-index: 51;
}

.google-translate select {
  display: none !important;
}
.goog-te-gadget{
  display: none !important;
}



.idiomas{
  position: fixed;
  top: 4vh;
  left: 85vw;
  transform: translate(-50%, -50%);
  z-index: 12;
  font-size: 2.2vh;
  font-weight: 400;
}
.idiomas a{
  color: white !important;
}

.boton-flotante {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 99;
}
.boton-flotante img {
  height: 50px;
  width: 50px;
}


.boton-flotante:hover {
  cursor: pointer;
}

.novedades{
width: 100%;
height: 30%;
max-height: 30%;
display: flex;

flex-direction: row;
flex-wrap: wrap;
}
.novedad{
  width: 50%;
  display: flex;
  height: max-content;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  position: relative;
}

.novedad img{
  height: 50vh;
  object-fit: cover;
}

.novedad-container{
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    background: linear-gradient(to top, #2b3f5b, #2b3f5b80); /* Agregar gradiente lineal como fondo */
    color: white;
    transition: background-color 0.5s ease-in-out; /* Agregar transición para el cambio de color */
}

.novedad-container h2{
font-size: 2.2rem;
text-align: center;
margin-bottom: 3vh;
}

.btn-mas-informacion {
  background-color: #4e7fb3;
  color: white;
  border: none;
  padding: 10px 20px;
  font-size: 1vw;
  cursor: pointer;
  transition: background-color 0.3s ease-in-out; /* Agregar transición para el cambio de color */
}
.novedad-container:hover{
  background: linear-gradient(to top, #1f2c3d, #23609359); /* Cambiar el gradiente lineal al hacer hover */
  cursor: pointer;
}

.btn-mas-informacion:hover,
.novedad-container:hover .btn-mas-informacion {
  background-color: #2b3f5b; /* Cambiar el color de fondo al hacer hover */
  
}


.div-puertos{
height: 100vh;
max-height: 100vh;
background-color: #082d4b;

}

.puertos-header{
  height: 25vh;
  width: initial;
  margin-top: 8vh;
  display: flex;
  background-color: #153856;
  font-family: 'Playfair Display', serif;
}

.puertos-header .titulo-puertos img{
  width: 5vw;
    padding: 1vh;
    cursor: pointer;
}

.puertos-header .titulo-puertos a{
  position: absolute;
  left: 6vw;
}

.puertos-header .titulo-puertos{
  height: inherit;
  width: 100%;
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  color: white;
  
}

.puertos-header .titulo-puertos h1{
  font-size: 3rem !important;
}

.puertos{
  display: flex;
  height: 70vh;
  flex-direction: row;
  position: relative;
  width: 100%;
}

.puertos .puerto{
  width: 33.33%;
  height: 70vh;
  position: relative;  

}

.puertos .puerto img{
  position: absolute;
  object-fit: cover;
  height: inherit;
}

.puertos .puerto .puerto-container{
  position: absolute;
  width: -webkit-fill-available;
  height: 100%;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  background: linear-gradient(to top, #2b3f5b, #2b3f5b80);
  color: white;
  transition: background-color 0.5s ease-in-out;
}

.puertos .puerto .puerto-container h2{
font-size: 4vh;
}


.puertos .puerto .puerto-container:hover{
  background: linear-gradient(to top, #1f2c3d, #23609359); /* Cambiar el gradiente lineal al hacer hover */
  cursor: pointer;
}

.btn-mas-informacion:hover,
.puerto-container:hover .btn-mas-informacion {
  background-color: #2b3f5b; /* Cambiar el color de fondo al hacer hover */
  
}
.popup-puerto {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.5);
  display: none; /* Ocultar inicialmente el popup */
  align-items: center;
  justify-content: center;
 

}


.popup-container-puerto {
  height: 90vh;
  max-height: 90vh;
  overflow-y: auto;
  overflow-x: hidden;
}

.popup-content-puerto {
  background-color: #f5f5f5;
  padding: 7vh 7vw;
  border-radius: 5px;
  text-align: center;
  width: 60vw;
  max-width: 60vw;
  margin: 0 auto; /* Centrar horizontalmente */
}

.popup-container-puerto img{
  height: 50vh;
  max-height: 50vh;
  object-fit: cover;
}

.popup-container-puerto a:hover{
  color: #007bff;
}


.valores{
  display: flex;
  
  width: 100%;
  color: #082d4b;
  flex-direction: row;
  justify-content: space-evenly;

}

.valores .valor{
  width: 33%;
  padding: 10vh; 
  font-size: 1.1rem;

}

.valores .valor h3{
  font-size: 4.5vh;
}

.video-centrado{
  display: flex;
  flex-direction: row;
  justify-content: center;
  padding: 12vh 0vw;
}

.video-centrado video{
  width: 90%;
}


#goog-gt-tt{
  display: none !important;
}

.VIpgJd-yAWNEb-VIpgJd-fmcmS-sn54Q{
 background-color: transparent !important;
 box-shadow: 0px 0px 0px #fff0 !important;
/* text-transform: capitalize !important; */
}


.estadisticas{
  display: flex;
  background: #082d4b;
  
  flex-direction: column;
  color: white;
  padding-top: 10vh;
  padding-bottom: 10vh;
}

.estadisticas h1{
  font-size: 8rem;
    font-weight: bold;
    text-align: center;
}

.estadisticas h2{
  width: 100%;
  text-align: center;
}

.estadisticas .informacion{
  width: 100%;
  display: flex;
}

.estadisticas .info{
  display: flex;
  flex-direction: column;
  align-items: center;
}

.estadisticas .info span{
font-size: 1.5rem;
}

.estadisticas .info img{
  width: 33%;
}


.div-novedades{
  
  overflow: auto;
}

.div-novedades .noticia{
  padding: 15vh 28vw 15vh 15vw;
  display: flex;
  flex-direction: column;

}

.div-novedades .noticia .fecha{
  font-weight: bold;
}

.div-novedades .noticia .cuerpo{
  text-indent: 2vw;
  padding: 4vh 0vw;
}

.div-novedades .noticia .cuerpo img{
  width: -webkit-fill-available;
  margin: 3vh 0vw;
}

.grid-novedades{
  padding: 1vw;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.grid-novedades .grid-novedad{
  width: 20vw;
  height: 50vh;
}

.grid-novedades .grid-novedad img{
  width: 20vw;
  height: 35vh;
  margin-bottom: 2vh;
  object-fit: cover;
}

.grid-novedades a{
  color: inherit !important;
  padding: 3vw;
}

.grid-novedades .grid-novedad:hover{
  transition: 0.5s;
  opacity: 0.8;
}


.mesa-directiva{
  background-color: #0f2a40;
  width: 100%;
  height: 100vh;
  color: white;
  display: flex;
  padding: 10vh 10vw;
  flex-direction: column;
  justify-content: center;
  margin-top: 8vh;
}

.mesa-directiva .titulo-mesa{
  text-align: center;
  width: 100%;
  margin-bottom: 5vh;
}

.mesa-directiva .titulo-mesa h2{
  font-size: 2.5rem;
}

.mesa-tabla{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-evenly;
}

.mesa-fila{
  display: flex;
  width: 100%;
}

.persona{
display: block;
text-align: center;
margin: 2vw 0vw;
width: 25%;
}

.persona span{
  font-size: 1.1rem;
}

.persona img{
  width: 3vw;
  margin-bottom: 2vh;
}

.recursos{
  height: auto;
  margin-top: 8vh;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
  flex-direction: column;
}

.recursos h2{
  margin: 5vh 0vw;
  font-size: 2.7rem;
}

.recursos .recurso .recurso-fila img{
padding: 1vh;
height: 20vh;
cursor: pointer;
}

.recursos .recurso .recurso-fila #player{
  height: 200px;
  width: 350px;
  margin: 5vh 0vw;

  }

.recurso{
  display: flex;
  flex-direction: column;
  align-items: center;
}

.recurso-fila{

}



.popup {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 9999;
  animation: fadeIn 0.3s ease;
}


@keyframes fadeIn {
  from {
      opacity: 0;
  }
  to {
      opacity: 1;
  }
}

.popup .mostrar-popup {
  animation: scaleIn 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

@keyframes scaleIn {
  from {
      transform: scale(0);
      opacity: 0;
  }
  to {
      transform: scale(1);
      opacity: 1;
  }
}

.popup #imagen-popup {
  max-height: 80%;
  max-width: 80%;
  display: block;
  margin: 5% auto;
}

.popup .cerrar {
  color: #fff;
  font-size: 2rem;
  position: absolute;
  top: 10px;
  right: 20px;
  cursor: pointer;
}

.popup .cerrar:hover {
  color: #ccc;
}

.slider-container {
  width: 100%;
  overflow: hidden;
  position: relative;
  margin: 6vh 0vw;
}

.slider {
  display: flex;
  animation: slide 10s linear infinite;
  justify-content: space-evenly;
}

.slider img {
  height: 250px;
  width: auto; /* Para que las imágenes se ajusten proporcionalmente */
  margin-right: 10px;
}

@keyframes slide {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(-100%);
  }
}

.export-image-container {
  width: 100%;
  height: 100vh;
  margin-bottom: 4vh;
  box-sizing: border-box; /* Incluye el padding en el tamaño total */
  display: flex;
  flex-direction: row;
  justify-content: center;
  padding: 8vh;
}

.export-image-container img{
  width: 1280px;
  height: fit-content;
}

.mobile-image {
  display: none;
}

.desktop-image {
  display: block;
}




/* Imagen de fondo */


@media only screen and (min-width: 820px) and (max-width: 1300px) {



  .mar-argentino-link a {
    font-size: 1.1rem;
  }

  .mar-argentino-info span{
    font-size: 1.2rem;
  }

  .descripcion-animal .texto h2{
    font-size: 2rem;
  }

  .descripcion-animal-sf .texto h2{
    font-size: 1.7rem;
  }








}



















/* CELULAR */

@media only screen and (min-width: 360px) and (max-width: 768px) {


/* MENU */
  .header_section {
    position: fixed;
    bottom: 0;
    top: revert;
    width: 100%;
    height: 60px;
    z-index: 50;
    width: 100%;
    max-width: 100vw;
    background-color: #236093;
    }
    
  
    .custom_menu-btn {
    position: absolute;
    right: 0;
    left: 0;
    top: 0; 
    z-index: 1;
    margin-right: 15px;
    }

    .menu_btn-style{
      position: fixed;
      bottom: 0;
      top: revert;
      width: 100%;
      height: 60px;
      z-index: 50;
    }
    

    .overlay{
    height: 0;
    width: 100%;
    position: fixed;
    bottom: 0;
    background-image: url(/images/fondo_menu.jpg);
    background-size: cover;
    overflow-y: hidden;
    transition: 0.5s;
    left: 0;
    top: revert;
    bottom: 0;
    }

    .overlay-content {

      width: 100vw;
      height: 100vh;
    
    }


.menu_width {
  height: 100vh;
  width: 100vw;
  bottom: 0;
}


.custom_menu-btn .s-1{
  width: 5vw;
}

.custom_menu-btn .s-2{
  width: 4vw;
}

.custom_menu-btn .s-3{
  width: 5vw;
}


.menu_btn-style button .s-1 {
  transform: rotate(45deg) translateY(5px) translateX(19px);
}

.menu_btn-style button .s-3 {
  transform: rotate(-45deg) translateY(2px) translateX(12px);
  }

  .overlay a{
    font-size: 2rem;
  }

  .boton-flotante {
    bottom: 75px;
    z-index: 15;
    display: none;
}


.barra-links {
  height: 7vh;
  width: 100vw;
  background-color: #082d4b;
  color: white;
  z-index: 3;
  position: fixed;
  bottom: 7vh; /* Posiciona la barra en la parte inferior */
  box-shadow: 0px 2px 3px 1px #00000066;
  display: flex;
  overflow-x: auto; /* Habilita el desplazamiento horizontal para los enlaces */
  justify-content: flex-start; /* Alinea los enlaces al principio de la barra */
  align-items: center;
  padding: 0 1rem; /* Agrega espaciado a los lados de la barra */
  top: auto;
}

.barra-links a {
  color: white;
  font-size: 1rem;
  padding: 0 1rem; /* Agrega espaciado entre los enlaces */
  font-weight: bold;
  white-space: nowrap; /* Evita que el texto de los enlaces se desborde */
  flex: 0 0 auto; /* Permite que los enlaces tengan el ancho necesario sin encogerse */
}




/* FOOTER */


.footer {
  padding: 5vh 5vw;
}

.footer a {
  font-size: 1rem;
}

.footer h4, .footer h5 {
  font-size: 2.5vh;
}

.colf1, .colf2, .colf4 {
  width: 100%;
  padding: 0;
}

.colf1 .col1, .colf2 {
  width: 50%;
  display: flex;
  justify-content: center;
  margin-bottom: 3vh;
}

.colf1 .titulof {
  padding-bottom: 1vh;
}

.colf4, .colf2 {
  display: flex;
  justify-content: center;
  align-items: center;
}

.colf4 img {
  width: 6vh;
}

.colf2 img {
  height: 4.5vh;
  margin: 4vw;
}





/* HOME SECTION */

#home-section{
  display: flex;
}

#home-section2{
  margin-left: 0px;
  height: 100vh;
  width: 100vw;
  background-color: #161616;
}

#home-section2 #background-video{
  display: none;
}

#home-section2 img{
  position: absolute;
  width: 20%;
  top: 10%;
  left: 10%;

}

#home-section2 span {
  display: none;
}

.boton-explorar a {
  position: absolute;
  top: 70%;
  color: white;
  left: 0;
  margin: 0px 10% 0px 10%;
  padding: 7px;
  font-weight: bold;
  font-size: 1.2rem;
  border: 3px #fff solid;
  border-radius: 3px;
  background-color: transparent;
  text-decoration: none;
  transition: none;
  box-shadow: none;
  text-align: center;
}

#slide2 span {
  top: 40%;
  left: 7%;
  font-size: 1.7rem;
  margin-right: 5vh;
}

#home-section2 .slide-animales{
  position: relative;
  height: 2.5em;
  overflow: hidden;
  display: flex;
  top: 80%;
  margin: 0px 10% 0px 10%;
}

.slide-animales a{
  color: white;
  position: absolute;
  font-size: 25px;
  top: 0;
  left: 0;
  opacity: 0;
  transform: translateY(100%);
  transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
}

.slide-animales a.activo{
  opacity: 1;
  transform: translateY(0);
}


#slide1 img{
  width: 300px;
}

.idiomas{
  font-size: 1.1rem;
  position: unset;
  display: flex;
  transform: none;
  height: 8vh;
  flex-direction: row-reverse;
  align-items: center;
  padding-right: 3vw;
}

#home-section .adpa-portada img {
  width: 70vw;
  margin-bottom: 5vh;
}




/* PRODUCTOS MAR ARGENTINO */

.mar-argentino-info {

  margin-left: 4vh;
  margin-top: 7vh;
}

.mar-argentino-menu {
  margin-left: 0 !important;
  width: 100vw;
  height: 90vh;
  display: flex;
  padding-left: 0px;
}

.mar-argentino-info img{
  width: 40%;
  
}

.mar-argentino-info h4{
  display: none;
}

.mar-argentino-info h1{
  font-size: 2.3rem;
  margin-top: 10vh;
  margin-bottom: 2vh;
  text-transform: none;
  font-variant: small-caps;
  text-transform: capitalize;
}
.mar-argentino-info span{
font-size: 16px;
font-weight: normal;
line-height: 1.3;
}

.mar-argentino-link {
  height: 7.7vh;
  overflow-x: scroll;
  display: flex;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  max-width: 100%;
  margin-bottom: 7.1vh;
  flex-direction: row;
  z-index: 10;
  scrollbar-color: #cccccc00;
  padding-left: 23vw;
  padding-right: 4vw;
  padding-top: 10vh;
  padding-bottom: 1vh;
  background: linear-gradient(#f9eeee00 1%, #082d4b 40%);
  flex-wrap: nowrap;
}
.mar-argentino-link a {
  color: white !important;
  font-size: 17px;
  font-weight: normal;
  padding-left: 1vw;
  padding-right: 1vw;
}

.mar-argentino-link a:last-child {
  margin-right: 0;
}

#mar-argentino::before{
  height: 90vh;
}
.video-seccion {
  margin-left: 0px;
  background-color:none;
  display: flex;
  flex-direction: row;
  justify-content: center;
  height: auto;
  width: 100vw;
  padding-left: 0px;
  padding: 0;
}

.video-seccion video {
  position: initial;
  top: 0px;
  height: 250px;
  width: 100%;
}

.video-seccion img{
  height: auto;
}

.informacion-seccion {
  width: 100%;
  display: flex;
  margin-left: 0px;
  flex-direction: column;
  flex-wrap: wrap;
  padding-left: 0px;
}

.descripcion-seccion {
  width: 100%;
  padding: 30px;
  background-color: white;
  font-size: 16px;
  line-height: 1.2;
}

.expandir-btn {
  display: inline-block;
  margin-top: 20px;
  padding: 10px 20px;
  font-size: 18px;
  font-weight: bold;
  color: #fff;
  background-color: #236093;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  position: relative; /* Agregamos esta propiedad para posicionar el icono dentro del botón */
  overflow: hidden; /* Agregamos esta propiedad para ocultar el icono cuando se despliega la sección */
}

.expandir-btn::before {
  transform-origin: center right;
}

.expandir-btn::after {
  transform-origin: center left;
}


.caracteristicas-seccion {
  width: 100%;
  padding: 0px;
  background-color: #eff6f5;
  text-align: center;
  font-size: 14px;
  line-height: 2em;
  overflow: hidden;
  max-height: 0;
  transition: max-height 0.3s, padding 0.3s; /* Agregamos la propiedad de transición para el padding */
}

.caracteristicas-seccion.show {
  max-height: 60vh; /* Cambiamos el valor del max-height cuando la sección está abierta */
  padding: 20px; /* Agregamos un padding para mejorar el espacio entre elementos */
}

/* Ocultar los elementos <br> en la pantalla de celular */
.caracteristicas-seccion.show br {
  display: none;
}

.caracteristicas-seccion h4{
  font-size: 1rem;
  margin: 2vh 0vw;
}

.caracteristicas-seccion span{
  font-size: 1rem;
}

.descripcion-seccion span{
  font-size: 1.1rem;
  text-align: justify;
}

.sub-informacion {
  width: 100%;
  display: flex;
  margin: 0;
  flex-direction: column-reverse;
  flex-wrap: wrap;
  align-content: center;
}

.sub-informacion .sub-img img {
  max-width: 100vw;
}

.sub-informacion .sub-text {
  width: 100vw;
  font-size: 1.1rem;
  line-height: 1.7;
  margin: 0;
  padding: 4vh;
  text-align: justify;
}

.sub-informacion .sub-text h2 {
  text-align: center;
}



.descripcion-animal-sf {
  padding: 4vh;
}

.descripcion-animal-sf br{
  display: none;
}

.descripcion-animal-sf .texto {
  text-align: justify;
  padding: 0; /* Eliminar padding horizontal para dispositivos móviles */
}

.descripcion-animal-sf .texto h2 {
  font-size: 2rem; /* Ajustar el tamaño de fuente del título para dispositivos móviles */
  text-align: center;
  margin-bottom: 2vh;
}

.descripcion-animal-sf .texto span {
  font-size: 1.1rem;
  line-height: 1.7;
 
}


.descripcion-animal {
  flex-direction: column;
  padding: 4vh;
}

.descripcion-animal br {
  display: none;
}

.descripcion-animal .texto {
  width: 100%; /* Take full width on mobile */
  padding: 0;
  margin-bottom: 0;
  text-align: justify;
}

.descripcion-animal .texto h2 {
  font-size: 2rem; /* Adjust the font size to fit better on mobile */
  text-align: center;
  margin-bottom: 2vh;
}

.descripcion-animal .texto span {
  font-size: 1.1rem; /* Adjust the font size to fit better on mobile */
  line-height: 1.7;
}

.descripcion-animal .imagen {
  width: 100%; /* Take full width on mobile */
}

.descripcion-animal .imagen img {
  max-width: 100%; /* Adjust the image width to fit within the container on mobile */
 }

 .descripcion-grid {
  display: flex;
  flex-direction: column;
}

.descripcion-animal-blanco{
  padding: 4vh;
}

.descripcion-animal-blanco .texto {
    padding: 0;
    text-align: justify;
}

.descripcion-animal-blanco .texto span {
  font-size: 1.1rem;
  line-height: 1.7;
}

.descripcion-animal-blanco .texto h2 {
  font-size: 2rem;
  margin-bottom: 2vh;
  text-align: center;
}

.descripcion-animal-blanco .texto br {
display: none;
}

.descripcion-grid .descripcion-animal-blanco .texto {
  padding: 0;
  text-align: justify;
}

.preparacion1{
  background-size: auto;
  width: 100%;
  display: flex;
}

.preparacion1 .texto{
  width: 100%;
  color: white;
  height: inherit;
  padding: 4vh;
  text-align: center;
  display: flex;
  background-color: #000000a6;
  flex-direction: column;
  justify-content: center;
}

.preparacion1 .texto h2{
  font-size: 2rem;
  font-weight: unset;
}

.preparacion1 .texto span{
  font-size: 1.1rem !important;
  line-height: 1.7;
}

#preparacion-caballa{
  text-align: center !important;
}

#preparacion-caballa  #ingredientes{
  text-align: center !important;
  margin: 0;
  font-size: 1.1rem !important;
}
#ficha{
  text-align: center !important;
  font-size: 1.1rem !important;
}


.preparacion2{
  width: 100%;
  padding: 0;
  background-color: #ffffff;
  display: flex;
  }
  
  .preparacion2 .texto{
  width: 100%;
  color: #082d4b;
  padding: 4vh;
  text-align: justify;
  }
  
  .preparacion2 .texto h2{
    font-size: 2rem;
    font-weight: unset;
    text-align: center;
    padding-top: 15px;
  }
  
  .preparacion2 .texto span{
    font-size: 1.1rem;
  }
  
  .preparacion2 .imagen{
   display: none;
  }

  .preparacion2-sf{
    padding: 4vh;

  }

  .preparacion2-sf .texto{
    text-align: justify;
  }

  .preparacion2-sf .texto h2 {
    font-size: 2rem;
    font-weight: unset;
    text-align: center;
}

  .preparacion2-sf .texto span{
    font-size: 1.1rem;
    line-height: 1.7;
  }

  .novedades {
    width: 100%;
    height: auto;
    display: block;
  
  }

  .novedad{
    width: 100%;
  }

  .novedad-container{
    padding: 4vh;
  }

  .novedad-container h2 {
    font-size: 2rem;
    text-align: center;
    margin-bottom: 3vh;
}

.mapamundi{
  height: 100%;
  width: 100%;
  position: relative;
}

.mapamundi video{
width: 100%;
}

.mapamundi img{
  position: absolute;
  z-index: 2;
  width: 70%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.div-marcas {
  padding: 5vh 0vw; /* Reducimos el padding vertical */
  text-align: center;
}

.marcas {
  width: 90vw; /* Reducimos el ancho del contenedor de marcas */
  justify-content: space-between; /* Distribuimos las marcas en el ancho disponible */
}

.marcas a {
  flex-basis: calc(50% - 20px); /* Cada marca ocupará el 50% del ancho disponible menos los márgenes */
  margin: 10px 0; /* Ajustamos el margen vertical para que quede más espaciado */
}

.adpa-section2 {
  flex-direction: column;
  align-items: center;
  height: 70vh;
}

.adpa-section2 video {
  width: 100%;
  height: 70vh;
  object-fit: cover;
}

.adpa-section2 .titulo {
  top: 10%;
  font-size: 2rem;
  width: 100%;
  margin: 4vh 0vw;
}

.adpa-section2 .datos {
  top: 15%;
    width: 90vw;
    height: 90%; /* Adjust the height to occupy the full height of the screen */
    flex-wrap: wrap; /* Add flex-wrap to wrap the .dato elements in a new line */
    align-content: center;
}

.adpa-section2 .dato {
  width: 40vw;
    padding: 10px; /* Reduce the padding for better space utilization */
    color: white;
    text-align: center;
    flex: 1 1 50%; /* Set each .dato to occupy 50% width to display two in a row */
    margin-bottom: 10px; /* Reduce the margin for better space utilization */
}

.animated-number {
  font-size: 2rem;
}

.adpa-section2 .datos .dato .signo {
  font-size: 2rem;
}

.adpa-section2 .dato .dato-texto {
  font-size: 1.3rem;
}

.valores {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.valores .valor {
  width: 80%;
  padding: 5vh;
  font-size: 1.2rem;
  text-align: center;
  margin-bottom: 3vh;
}

.valores .valor h3 {
  font-size: 2rem;
}

.valores .valor img {
  width: 40%;
  max-width: 150px;
  margin: 0 auto 1.5vh;
}

.valores .valor span {
  font-size: 1rem;
}


.mapamundi {
  height: auto; /* Ajustar el alto para dispositivos móviles (puede variar según el diseño deseado) */
  max-height: none; /* Reiniciar el máximo alto establecido para pantallas móviles */
}

.mapamundi video {
  width: 100%; /* Ajustar el ancho del video para que ocupe todo el ancho disponible */
  height: auto; /* Ajustar la altura del video para mantener la proporción */
}

.mapamundi img {
  width: 100%; /* Ajustar el ancho de la imagen para que ocupe todo el ancho disponible */
  top: 0; /* Alinear la imagen en la parte superior */
  left: 0; /* Alinear la imagen a la izquierda */
  transform: none; /* Eliminar la transformación para centrar la imagen */
}
.puertos {
  
    flex-direction: column;
    position: relative;
    width: 100%;
    align-items: center;
  }

.puertos .puerto {
  width: 100%; /* Cada "puerto" ocupa el ancho máximo de la pantalla móvil */
  height: 70vh; /* Ajustamos la altura automáticamente */
 position: relative;
}

.puertos .puerto img {
  height: auto;
  max-height: -webkit-fill-available;
}

.popup-content-puerto {
  padding: 5vh 5vw;
  width: 90vw;
  max-width: 90vw;
}

.puertos-header .titulo-puertos h1{
  font-size: 2rem !important;
}

.puertos-header .titulo-puertos a{
  position: inherit;
}

.puertos-header .titulo-puertos {
  position: inherit;

}

.puertos-header {
  margin-top: 0vh;
}

.btn-mas-informacion {
  padding: 3px 3px;
  font-size: 1rem;
  width: 40vw;
  height: 4vh;
 }

.recursos .recurso .recurso-fila img {
  height: 15vh;
}

.recurso-fila {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
}

.recursos{
  margin-top: 0vh;
}

.popup #imagen-popup {
  height: fit-content;
  max-width: 90%;
}

.mostrar-popup{
  display: flex;
    align-items: center;
}


.puertos-header {
  display: block;
  text-align: center;
  padding: 20px;
  background-color: #153856;
}

.puertos-header .titulo-puertos img {
  width: 80px;
  padding: 5px;
  cursor: pointer;
}

.puertos-header .titulo-puertos h1 {
  font-size: 1.5rem;
}

.infografia {
  margin: 0;

}

.infografia-cel {
  width: 100vw;
  margin-bottom: 5vh;
}

.infografia-cel img {
  width: 100vw;
}

.export-image-container{
  padding: 0;
}

.export-image-container img{
  width: 100vw;
  height: auto;
}

.desktop-image {
  display: none;
}

.mobile-image {
  display: block;
}
  #player{
    width: 100%;
    height: 100%;
}

.grid-novedades {
  padding: 1vh;
}

.grid-novedades a {
  padding: 0;
  width: 50%;
}

.grid-novedades .grid-novedad {
  width: auto;
  height: auto;
  padding: 1vh;
}

.grid-novedades .grid-novedad img {
  width: 100%;
  height: 20vh;
  margin-bottom: 2vh;
  object-fit: cover;
}

.grid-novedades .grid-novedad h4 {
font-size: 1.3rem;
}


.mesa-directiva{
  margin-top: 0;
  height: auto;
}

.mesa-fila {
  flex-direction: column;
}

.persona {
  width: 100%;
}

.persona img {
  width: 15vw;
}


.div-novedades .noticia{
  padding: 4vh;
  font-size: 1.1rem;
  line-height: 1.7;
}



  }