/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
:root {
  scroll-behavior: smooth;
}

body {
   font-family: "Lato", sans-serif;
  color: #000;
}

a {
  color: #4154f1;
  text-decoration: none;
}

a:hover {
  color: rgba(16,106,254,1);
  text-decoration: none;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "Lato", sans-serif; line-height: 140%; 
}

p { font-size: 12pt}

h5 {
    font-weight: 600;
    font-size: 1.15rem;
}
h6 {font-weight: 400}

.text-light-blue {color: #1BBBEB}
.text-blue {color: #1B64EB}

.section-header h2 {color: rgba(29, 29, 27, 0.74)}
.link-more:before {content: ">"; color: #1BBBEB; margin-right: 5px; font-size: 20px; font-weight: 600}
.link-plus:before {content: "\F4F9"; color: #1BBBEB; font-family: "Bootstrap-icons"}
.rounded-1 {border-radius: 1.5rem !important}
.bg-grey {background: rgba(217, 217, 217, 0.4)}
.bg-light-blue {background: #29AEE1}
.h-270 {height: 270px}
a.ligth-blue:hover {color:#fff}

/*--------------------------------------------------------------
# Sections
--------------------------------------------------------------*/
section {
  padding: 50px 0;
  overflow: hidden;
}

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

.section-header h2 {
  font-size: 38px;
  letter-spacing: 1px;
  margin: 0;
}

.section-header p {
  padding: 0;
  font-size: 14pt;
  color: #000;
}

.home .section-header  h2 {
    font-size: 25pt;
    letter-spacing: .5pt;
}



.section h3 {
    font-size: 24px;
    font-weight: 400;
}




/*--------------------------------------------------------------
# Disable aos animation delay on mobile devices
--------------------------------------------------------------*/
@media screen and (max-width: 768px) {
  [data-aos-delay] {
    transition-delay: 0 !important;
  }
}

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
.header {
  transition: all 0.5s;
  z-index: 9;
  background: #fff;
}

.header.header-scrolled {
  box-shadow: 0px 2px 20px rgba(1, 41, 112, 0.1);
  z-index: 10;
}

.header .logo {
  line-height: 0;
}

.header .logo img {
  width: 220px;    
  margin-right: 6px;
}



/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
/**
* Desktop Navigation 
*/
.navbar {
  padding: 0;
}

.navbar ul {
  margin: 0;
  padding: 0;
  list-style: none;
  align-items: center;
}

.navbar li {
  position: relative; margin: 0 8px;
}

.navbar a {
  display: flex; 
  align-items: center;
  justify-content: space-between;
  font-size: 16px;
  font-weight: 400;
  color:#000;
  white-space: nowrap;
  transition: 0.3s;
}

.navbar a i {
  font-size: 12px;
  line-height: 0;
  margin-left: 5px;
}

.navbar a:hover, .navbar .active, .navbar li:hover > a {
  color:#0d6efd;
}




/**
* Mobile Navigation 
*/
.mobile-nav-toggle {
  color: #012970;
  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;
  }
}
@media only screen and (min-width: 992px) {
  .dropdown:hover .dropdown-menu {
    display: block;
  }
  .dropdown-menu.show {
    display: block;
  }
}
.dropdown-menu ul {}
.dropdown-menu ul li {background: none}
.dropdown-menu ul li a {background: none}
.dropdown-menu .dropdown-item:hover {background: none}
.navbar-mobile {
  position: fixed;
  overflow: hidden;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  background: #0d6efd ;
  transition: 0.3s;
}

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

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

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

.navbar-mobile a:hover, .navbar-mobile .active, .navbar-mobile li:hover > a {
  color: #4154f1;
}

.navbar-mobile .getstarted {
  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: #4154f1;
}

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

#bartop {background: #1BBBEB; color: #fff}
#bartop a {color: #fff}
#bartop a i {color: #000}

/*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/
.hero {width: 100%;
    margin-top: 100px;
    background: url("../img/bg-hero.jpg");
    background-size: auto;
    background-size: cover;
}
.hero i {color: #1B64EB; position: absolute; top: 5px;
  left: 5px;}



@media (max-width: 768px) {
  .hero h1 {
    font-size: 35px;
  }
  .hero h5 {
    font-size: 14px;
  }

}



/*--------------------------------------------------------------
# Index Page
--------------------------------------------------------------*/



.datepicker {
  width: auto;
  position: relative;
  padding: 1px 0;
}

.datepicker input {
  width: 100%;
  box-sizing: border-box; border: 0;
  padding: 5px;
}
.datepicker input::placeholder {opacity: 1; color: #000}
.datepicker input[type='date'] {
  position: absolute; top:0; left: 0;
  inset: 0;
  z-index: -1;
}
.datepicker input:focus, .datepicker input:active {box-shadow: none}

input.age {width: 60px !important; display: inline-flex; margin-right: 10px; margin-bottom: 10px}
a.repeat {display: block; color: #fff; font-size: 13px; cursor: pointer}
.ligth-blue {color: #A2E9FF}

.ic-plane:before {content: url("../img/ic-plane.svg"); }
.ic-hotel:before {content: url("../img/ic-hotel.svg")}
.ic-car:before {content: url("../img/ic-car.svg")}
.ic-beach:before {content: url("../img/ic-beach.svg")}


.list-check li {font-size: 14px; list-style: none; position: relative; padding-left: 20px; color: #000000}
.list-check li:before {content: "\F633"; font-family: "Bootstrap-icons"; color: #1BBBEB; position: absolute; left: 0; top: 0; font-weight: 800}

.pict.h-40 {overflow: hidden; width: 100%; height: 200px}
.pict.h-40 img {width: 100%}


.swiper-prods-1 .swiper-slide, 
.swiper-prods-2 .swiper-slide,
.swiper-blog .swiper-slide{padding: 0 3%}
.swiper-button-next::after, .swiper-button-prev::after {opacity: .3; font-size: 22px}

.card .caption {background: rgba(29, 29, 27, 0.8); position: absolute; bottom: 0; color: #fff; width: 100%}
.card .caption a {color: #fff}

.bg-testimonials {background: url("../img/bg-feedback.jpg"); background-size: cover; border-top:5px solid #D9D9D9; border-bottom:5px solid #D9D9D9}

.swiper-testimonials .card {background: #A2E9FF; border-radius: 1.5rem; padding: 20px}
.swiper-testimonials .card h4 {font-size: 20px}
.swiper-testimonials .card p {font-size: 14px}
.swiper-testimonials .card i {color: #1B64EB}
.swiper-testimonials .swiper-pagination-bullet {background-color:  #fff}
.swiper-blog p {margin-bottom: 0}

.bg-faqs {background: url("../img/bg-faqs.jpg"); background-size: cover }
#faqs .accordion-body {line-height: 130%; color: #000;}

.anim1 {animation: myAnim1 6s ease 2s infinite normal forwards;}
.anim2 {animation: myAnim2 6s ease 2s infinite normal forwards;}
.anim3 {animation: myAnim3 6s ease 2s infinite normal forwards;}
.anim4 {animation: myAnim4 6s ease 2s infinite normal forwards;}

#wap {position: fixed; right: 3%; bottom: 3%; display: block; z-index: 999}
#wap:hover:before {content: "Consultar Ahora"; color: #fff; display: block; position: absolute;
  left: -140px; background: #60D669; padding: 5px 20px; border-radius: 10px;
  top: 12px;}

.quote-sm .card i {position: absolute; top: 5px; left: 5px; color: #0d6efd}
.quote-sm .age {width: 50px !important; margin: 0 5px; font-size: 12px; margin: 0 3px 5px; padding: 5px}

.brand img {mix-blend-mode: multiply}
.card.product.offer {background: rgba(217, 217, 217, 0.4)}
.card.product span {font-size: 12px}
.card.product .old-price {text-decoration: line-through}
.card.product .discount {color: #F80408; font-weight: 700}
.card.product a {color: #000; }
.card.product:hover {transform: scale(1.02)}

.cobertura .modal-body,
.cobertura .modal-body li,
.cobertura .modal-body p {font-size: 12px; margin: 0}

.card.compra,
.card.compra span {font-size: 12px}

.anim1 {animation: myAnim1 6s ease 2s infinite normal forwards;}

#compra ::placeholder {font-size: 13px}
#compra .form-select {font-size: 13px; padding: 8.5px;}
#compra .fs-13 {font-size: 13px; padding: 8.5px;}
@keyframes myAnim1 {
    12.5% {transform: scale(1.1);filter: brightness(1.5);}
    25% {transform: scale(1);filter: brightness(1);}
}
@keyframes myAnim2 {
    25% {transform: scale(1);filter: brightness(1);}
    37.5% {transform: scale(1.1);filter: brightness(1.5);}
    50% {transform: scale(1);filter: brightness(1);}
}
@keyframes myAnim3 {
    50% {transform: scale(1);filter: brightness(1);}
    62.5% {transform: scale(1.1);filter: brightness(1.5);}
    75% {transform: scale(1);filter: brightness(1);}
}
@keyframes myAnim4 {
    75% {transform: scale(1);filter: brightness(1);}
    87.5% {transform: scale(1.1);filter: brightness(1.5);}
    100% {transform: scale(1);filter: brightness(1);}
}

/*--------------------------------------------------------------
# Contact
--------------------------------------------------------------*/

body .form-control::placeholder {color: #000}

@-webkit-keyframes animate-loading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes animate-loading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}


/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/

.footer {background: #2BB2E3; color: #fff}
.footer .logo {max-width: 230px; width: 100%; }
.footer h4 {font-size: 16px; font-weight: 700}
.footer h4 a {color:rgba(255,255,255,1);}
.footer p {font-size: 12px}
.footer a {color:rgba(255,255,255,0.7);}
.footer a:hover {color:rgba(255,255,255,1);}
.footer a.nav-link {font-size: 16px; padding: 0; margin: 10px 0}
.footer .social a {font-size: 24px; padding: 0; margin:0 10px;}
.footer span {line-height: 120%}

.copyright p {font-size: 14px}

#faqs .accordion-button {line-height: 200%}
.accordion-button {background: none !important; border: none !important; color: #101828 !important; box-shadow: none !important; padding: 0 10px; }
.accordion-button:not(.collapsed)::after {content: "\F2E6";
  font-family: "Bootstrap-icons";
  background-image: none;
  transform: none; top: 0; height: auto;
  margin-left: 10px; color: rgba(27, 187, 235, 1)}
.accordion-button.collapsed::after {content: "\F4FA"; font-family: "Bootstrap-icons"; background-image: none;   transform: none;
  margin-left: 10px; top: 0; height: auto; color: rgba(27, 187, 235, 1)}
.accordion-body {padding: 0 10px; color: #667085; font-weight: 300}
.accordion-flush .accordion-item {padding: 20px 0;}
.accordion-item a {font-weight: 500; text-decoration: underline; margin: 10px 0}
.fs-11 {font-size: 11px}
.fs-12 {font-size: 12px}

#faqs .accordion-item {border-bottom: 1px solid #ccc; border-right: 0; border-left: 0; border-top: 0; padding: 10px 0}
#faqs .accordion-item:last-child {border-bottom: 0;}
#faqs .accordion-item button {margin: 0 !important}

/*--------------------------------------------------------------
# Mobile
--------------------------------------------------------------*/

.responsive-background {
  background-image: url("../img/home-video-posterM.jpg");
  background-position: center;
  background-size: cover;
}
@media (min-width: 75rem) {
  .responsive-background {
    background-image: url("../img/home-video-poster.jpg");
  }
}


@media (max-width: 768px) {
    body {width: 100%; overflow-x: hidden; padding: 0}
    #bartop a {font-size: 12px}
    .navbar-mobile {width: 70%; left: inherit}
    .navbar.navbar-mobile ul {background-color: transparent !important; padding: 0 5%;}
   .navbar.navbar-mobile li a {color: #fff}
    .dropdown-menu.dropdown-active ul {display: block; box-shadow: none; padding: 0}
    .dropdown-menu.dropdown-active ul li {margin: 0}
    .dropdown-menu.dropdown-active ul .dropdown-item {color: #000; padding: 0}
    .navbar-mobile .dropdown ul a {color: #000}
    
    #video1 {height: 500px; width: 100%; overflow-x: hidden}
    #video1 video {height: 100%; width: auto}
    
    .header {z-index: 999; position: absolute}
    .mobile-nav-toggle.open:after {content: url("../img/ic-bar-nested.svg"); width: 40px; height: 40px; display: block;}
    .mobile-nav-toggle.close:after {content: "\F659"; font-family: "Bootstrap-icons"; color: #fff; transform: skew(20deg, -5deg) rotate(5deg);
    display: block;
    top: 10px;
    position: relative;}
    .home .section-header h2 {font-size: 20pt;}
     .section-header p {font-size: 14pt;line-height: 120%;}
    footer {width: 100%; overflow-x: hidden}
    .bg-gestiona {background: url("../img/bg-gestionaM.jpg"); background-size: 100% 100%}
    .accordion-button {line-height: 170%;}
    .hero {background-size: cover}
    .swiper-button-prev, .swiper-button-next {display: none}
    .swiper-brands .swiper-slide {text-align: center}
    .swiper-testimonials .swiper-slide .card {width: 90%; margin: 0 auto}
    #faqs .accordion-button {font-size: 14px; margin: 10px 0; line-height: 140%;}
}

.bg-newsletter {background: url("../../assets/img/bg-travel2.jpg")}