@import url('https://fonts.googleapis.com/css2?family=League+Spartan:wght@600&display=swap');
@font-face {
    font-family: "League Spartan Light";
    src: url("../fonts/LeagueSpartan-Light.ttf") format("truetype");
}
*{
    box-sizing: border-box;
    margin:0;
    padding:0;
}
a{
    text-decoration: none;
    color:#fff;
}
a:visited{
    text-decoration:none;
    color: #fff;
}
a:hover{
    color: #fff;
    border-color:#000;
}
a:active{
    color: #fff;
}

body{
    background-color: #84bfd8;
    font: normal 16px "League Spartan Light", Sans Serif;
    letter-spacing: 0px;
    line-height:1.6em;
    color:#000;
}

#logo {
    background-color:#D884b0;
    color:#fff;
    font: normal 26px "League Spartan", Sans Serif;
    letter-spacing: 0px;
    text-align:left;
    padding: 14px 00px 10px 10px;

}
/* Navigation Bar Burger Menu */
.navbar {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    background-color: #D884b0;
    color: #FFF;
    height: 50px;
    padding: 1em;
    white-space: nowrap;
    box-shadow: 0 0px 1px 0 #000;
  }
  
  .menu {
    display: flex;
    flex-direction: row;
    list-style-type: none;
    margin: 0;
    padding: 0;
    text-transform:uppercase;
  }
  
  .menu > li {
    margin: 0 1rem;
    overflow: hidden;
  }
  
  .menu-button-container {
    display: none;
    height: 100%;
    width: 30px;
    cursor: pointer;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  
  #menu-toggle {
    display: none;
  }
  
  .menu-button,
  .menu-button::before,
  .menu-button::after {
    display: block;
    background-color: #fff;
    position: absolute;
    height: 4px;
    width: 30px;
    transition: transform 200ms cubic-bezier(0.23, 1, 0.32, 1);
    border-radius: 2px;
  }
  
  .menu-button::before {
    content: '';
    margin-top: -8px;
  }
  
  .menu-button::after {
    content: '';
    margin-top: 8px;
  }
  
  #menu-toggle:checked + .menu-button-container .menu-button::before {
    margin-top: 0px;
    transform: rotate(405deg);
  }
  
  #menu-toggle:checked + .menu-button-container .menu-button {
    background: rgba(255, 255, 255, 0);
  }
  
  #menu-toggle:checked + .menu-button-container .menu-button::after {
    margin-top: 0px;
    transform: rotate(-405deg);
  }
  
  @media (max-width: 1200px) {
    .menu-button-container {
      display: flex;
    }
    .menu {
      position: absolute;
      top: 0;
      margin-top: 50px;
      right: 0;
      flex-direction: column;
      width: 100%;
      justify-content: center;
      align-items: center;
      text-transform:uppercase;
    }
    #menu-toggle ~ .menu li {
      height: 0;
      margin: 0;
      padding: 0;
      border: 0;
      transition: height 200ms cubic-bezier(0.23, 1, 0.32, 1);
    }
    #menu-toggle:checked ~ .menu li {
      border: 1px solid #333;
      height: 2.5em;
      padding: 0.5em;
      transition: height 200ms cubic-bezier(0.23, 1, 0.32, 1);
      z-index:2;
    }
    .menu > li {
      display: flex;
      justify-content: center;
      margin: 0;
      padding: 0.5em 0;
      width: 100%;
      color: white;
      background-color: #222;
    }
    .menu > li:not(:last-child) {
      border-bottom: 1px solid #444;
    }
  }
  /* End of Navigation Bar Burger Menu */
 /*Start of New Search Window */
 .wrapper {
    margin: 3vh 10vw 2vh 10vw;
    height: 30vh;
    background-color: #84bfd8;
    border-radius: 5px;
    box-shadow: 0 0 0px 0 rgba(0, 0, 0, 0.06);
}
.searchforms {
    padding: 0px;
    display: flex;
}
.searchform {
    width:16vw;
    margin: 0 0 0 0;
    transition: all 0s ease-in-out;
}
.searchform:hover .searchform__label {
    background-color: #d884b0;
    transform: scale(1);
    opacity: 1;
}
.searchform__label {
    width: calc(100% - 0.5px);
    border-radius: 10px 10px 0 0;
    border-bottom: 0.5px inset #000;
    padding: 0.4em 0.1em;
    position: relative;
    cursor: pointer;
    background-color: #fff;
    color: #fff;
    font-size: 1em;
    text-transform: capitalize;
    text-align: center;
    transition: all 0s ease-in-out;
}
.searchform__label:after {
    transition: all 0s ease-in-out;
}
.searchform__label .fa {
    width: 100%;
    margin-top: 0em;
}
.searchform__form {
    transition: all 0s ease-in-out;
    background-color: #fff;
    width: 80vw;
    padding: 2vh 2vw;
    border-radius: 0 0 12px 12px;
    display: block; /* ITS SOMETHING TO DO WITH THIS!!!!!! */
    justify-content: left;
    align-items: left;
    text-transform: none;
    color: #000;
    font-size: 1.25em;
}
.searchform .title{
    font-weight:normal;
    font-size: 1em;
    position: relative;
 }
 .searchform .title::after{
    content: '';
    display:block;
    height: 3px;
    width: 30px;
    background: #D884b0;
 }
 .searchform form{
    display:flex;
    flex-wrap: wrap;
    padding: 2px 5px;
 }
 .searchform__form form .input-box{
    padding: 0px 15px;
    width: calc(100% / 3);
 }
 .searchform__form form .input-box .details{
    width:100%;
    padding-top: 7px;
    font-size: 0.8em;
    display:flex;
 }
 .searchform__form form .input-box input{
    font-family: League Spartan Light;
    font-size: 0.7em;
    padding-left:15px;
    display:flex;
    height: 4.5vh;
    width: calc(100%); /* This is the line you need to edit when you return*/
    outline: none;
    border:1px solid #ccc;
    border-radius: 25px;
 }
.searchform.is-collapsed .searchform__label {
    color: #565656;
    opacity: 0.5;
    width:16vw;
}
.searchform.is-collapsed .searchform__label:after {
    content: "";
    opacity: 0.5;
    z-index: 0;
}
.searchform.is-collapsed .searchform__label:hover .searchform__label {
    background-color: #d884b0;
    transform: scale(1);
}
.searchform.is-collapsed .searchform__form {
    max-height: 0;
    min-height: 0;
    width:0;
    display:none;
    overflow: hidden;
    margin-top: 0;
    opacity: 0;
    z-index: 0;
}
.searchform.is-expanded .searchform__label {
    background-color: #d884b0;
    /* box-shadow: 0 -0px 0.5px 0 #000; */
    z-index: 1;
    width: 16vw;
   /* Remove */
}
.searchform.is-expanded .searchform__label::after {
    content: "";
    opacity: 1;
   /* display: block;
    Uncomment */
    height: 0;
    width: 0;
   /* Set back to zero*/
    position: absolute;
    top: 100%;
    left: calc(50% - 15px);
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-top: 15px solid #d884b0;
}
.searchform.is-expanded .searchform__form {
    position: absolute;
    left: 10vw;
   /*Remove*/
    box-shadow: 0 0.5px 0.5px 0 #000;
   /*Remove*/
    max-height: 25vh;
    min-height: 25vh;
    overflow: hidden;
    margin-top: 0px;
}
.searchform.is-expanded::hover .searchform__label {
    transform: scale(1);
    opacity: 1;
}
form .searchbutton{
    margin-top: calc(1.6em);
    width:calc(100% / 4);
}
.searchform form .searchbutton{
    margin-top: calc(1.25em);
    width:calc(100% / 4);
    font-size: 1.25em;
}
form .searchbutton input{
    font-weight: bold;
}
form .searchbutton input:hover{
    cursor:pointer;
    opacity: 1;
    background-color: #Dcc182;
}
.searchbutton::after{
    content: "\f002";
    font: var(--fa-font-solid);
    display: inline-block;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    color: #D884b0;
    position:relative;
    font-size:1.em;
    left: 10vw;
    bottom:3.6vh;
}
  /* Start of Carousel */
  .radio {display: none;}
  .containercarousel {
    position:relative;
    max-width: 100%;
    margin:0% auto;
  }
  .carousel {
    width:100%;
    position: relative;
    height:0;
    padding-top: 56.25%;
    background:none;
    overflow:hidden;
    border: none;
    box-shadow: 0 0 2px #000;
}
.carousel-slide {
    position: absolute;
    width:100%;
    height: 100%;
    top: 0;
    left:0;
    opacity: 0;
}
.carousel-slide img{
    width:100%;
    height:100%;
    object-fit:cover;
    transform: scale(1.1);
    transition: 1.3%;
}
.caption {
    position: absolute;
    width:60%;
    left: 5%;
    top: 5%;
    color: #fff;
    font-size: 25px;
    /* text-transform: uppercase; */
    letter-spacing:0.25px;
    line-height: 80px;
    transition: 0.9%;
}
.caption span {
    display: block;
    text-transform: initial;
    font-size: 25px;
    color: #fff;
    line-height: 15px;
    text-transform: none;
}
.dots {
    width: 100%;
    position: absolute;
    bottom: 5%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.dots label{
    width: 12px;
    height: 12px;
    background: #fff;
    margin: 0 10px;
    border-radius: 50%;
    opacity: 0.3;
    cursor:pointer;
    transition: 0.2s ease-in-out;
}
.dots label:hover {
    opacity: 0.7;
}
#radio-1:checked ~ #slide-1,
#radio-2:checked ~ #slide-2,
#radio-3:checked ~ #slide-3,
#radio-4:checked ~ #slide-4, 
#radio-5:checked ~ #slide-5,
#radio-6:checked ~ #slide-6 {
    opacity: 1;
}
#radio-1:checked ~ #slide-1 img,
#radio-2:checked ~ #slide-2 img,
#radio-3:checked ~ #slide-3 img,
#radio-4:checked ~ #slide-4 img,
#radio-5:checked ~ #slide-5 img,
#radio-6:checked ~ #slide-6 img {
    transform: scale(1);
}
#radio-1:checked ~ #slide-1 .caption, 
#radio-2:checked ~ #slide-2 .caption,
#radio-3:checked ~ #slide-3 .caption,
#radio-4:checked ~ #slide-4 .caption,
#radio-5:checked ~ #slide-5 .caption,
#radio-6:checked ~ #slide-6 .caption {
    opacity: 1;
    top: 7%;
    font-size: 40px;
    text-transform:uppercase;
}
#radio-1:checked ~ .dots #label-1,
#radio-2:checked ~ .dots #label-2,
#radio-3:checked ~ .dots #label-3,
#radio-4:checked ~ .dots #label-4,
#radio-5:checked ~ .dots #label-5,
#radio-6:checked ~ .dots #label-6 {
    background: #808080;
    opacity: 1;
}
 /* End of Carousel */
/*Start of Explore All Rows*/
.explore.title{
    padding: 1vh 2vw 0 2vw;
    margin-bottom:0vh;
    font-size: 1.25em;
    text-transform: uppercase;
    padding-bottom: 1vh;
    background-color: #fff;
}
.explore.title::after{
    content: '';
    display:block;
    height: 3px;
    width: 30px;
    background: #D884b0;
}
.container{
    background-color: #fff;
    padding: 0vh 2vw 0vh 2vw;
    display:flex;
    overflow-x:scroll;
    overflow-y:hidden;
    -ms-overflow-style: none; /* for Internet Explorer, Edge */
    scrollbar-width: none; /* for Firefox */
}
.container::-webkit-scrollbar {
    display: none; /* for Chrome, Safari, and Opera */
  }
#tester {
    text-transform: uppercase;
    
}
.exploreIcon img{
    height: 30vw;
    width:30vw;
    max-height:175px;
    max-width: 175px;
    border-radius:50%;
    border:4px solid #fff;
    box-shadow: 0 0 0 3px #Dcc182;
    object-fit:cover;
    object-position: center center;
}
.exploreIcon {
    margin: 0.4vh 1.5vh 0 1.5vh; 
    text-align: center;
    text-transform: capitalize;
    cursor:pointer;
    
}
.exploreIcon h3{
    padding-bottom: 1.25vh;
}
.exploreIcon.expanded::after {
    content: "";
    opacity: 1;
    display: block;
    height: 0;
    width: 0;
    position: relative;
    top: calc(200% + 2vh);
    left: calc(50% - 15px);
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-top: 15px solid rgb(240, 240, 240);
    transform: rotate(180deg);
    -ms-transform: rotate(180deg);
}
.exploreIcon.active{opacity:1;transition: height 0.15s linear;}
.exploreIcon.inactive{opacity:0.25; pointer-events: none;transition: height 0.1s linear;}
.exploreIcon.inactive img{box-shadow: 0 0 0 3px #fff;}
.exploreDetails.expanded .fa-solid{position:absolute;top:1vh;right:1vw;cursor:pointer;}
.exploreDetails.collapsed{display:block;height:0;width:0; overflow:hidden;transition: height 0.15s linear;}
.exploreDetails.expanded{
    padding: 1vh 1vw 1vh 1vw;
    margin-bottom: 1vh;
    position:relative;
    background-color: rgb(240, 240, 240);
    width:100%;
    height:29vh;
    display:block;
    justify-content:space-between;
    align-items:center;
    transition: height 0.15s linear;
}
.exploreDetails.expanded img{
    margin-right: 1.5vw;
    float:left;
    height:100%;
    width: auto;
    max-width: 50%;
    border-radius: 5px;
    object-fit:cover;
    object-position: center center;
}
.exploreDetails:nth-child(even) img{
    float:right;

}
.exploreText{
    margin: 2vh 0;
    padding:0 1vw;
    display:flex;
    flex-direction: column;
    justify-content:space-between;
    
}
p{font-size: 1.35vh; text-align:justify;
margin-bottom: 0.75vh; line-height: 1.65vh;}

.exploreButton{
    font-family: League Spartan Light;
    font-size: 2.25vh;
    padding:3px 12px;
    margin-bottom: 1vh;
    background-color: #fff;
    outline: none;
    border:1px solid #ccc;
    border-radius: 5px;
    align-self:end;
}
.exploreButton input {
    text-transform: capitalize;
    font-size: 2.25vh;
    font-family: League Spartan Light;
    border:none;
    cursor:pointer;
    background-color: #FFF;
}
.exploreButton::after{
    content: "\f061";
    font: var(--fa-font-solid);
    display: inline-block;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    color: #D884b0;
    position:relative;
    font-size:1em;
    right: 0vw;
    bottom:0vh;
}
/*End of Explore All Rows*/
/*Start of Marketing Messages*/
.marketing {
    background-color: #Dcc182;
    padding:3vh 2vw 0.2vh 2vw;
}
.simpleFlexboxVertical{
text-align:center;
display:flex;
flex-direction:column;
justify-content: space-between;
}
.simpleFlexboxHorizontal{
    display:flex;
    justify-content:space-around;
    align-items: flex-start;
}
.simpleFlexboxHorizontalPoints{
    display:flex;
    justify-content:space-around;
    align-items: flex-end;
}
.marketingPoint{
    margin:1vh 1vw;
    width:calc(86vw / 5);
}
.marketingIcon{
    margin: 1vh 0 2vh 0;
    background-color: #fff;
    border-radius:100%;
    height: 6vw;
    width: 6vw;
    text-align: center;
}
.marketingIcon i{
    position:relative;
    top:1.25vw;
    color:#D884b0;
    font-size: 3.5vw;
}
.simpleFlexboxHorizontal span{
    text-align: justify;
    width:calc(86vw / 5);
    font-size:1.1vw;
    line-height:1.2vw;
}
.marketing p:last-child{
    margin-top:2vh;
}
/*End of Marketing Messages*/
/*Start of Featured Articles & Blog*/
.featuredArticles.title{
    padding: 1vh 2vw 0 2vw;
    margin-bottom:0vh;
    font-size: 1.25em;
    text-transform: uppercase;
    padding-bottom: 1vh;
    background-color: #84bfd8;
}
.featuredArticles.title::after{
    content: '';
    display:block;
    height: 3px;
    width: 30px;
    background: #D884b0;
}
.featuredArticlesFlexbox{
    display:flex;
    flex-wrap:wrap;
    justify-content: space-evenly;
    text-transform: none;
    margin: 1vh 0 2vh 0;
    text-align: center;
}
.article{
    width:30vw;
    min-width:250px;
}
.article img{
    height:15vw;
    width: 28vw;
    border-radius: 3px;
    object-fit:cover;
    object-position: center center;
}
.exploreButton.articles{
    text-transform: none;
    float:right;
    width:18vw;
}
/*End of Featured Articles & Blog */
.dhoverexplore{width: auto;
    height: 8vh;position: relative; top:74%; left:23%;border-radius: 0px;opacity:0; -ms-transform: rotate(330deg); transform: rotate(330deg);}
.destinationbox:hover img{opacity:1; z-index:1;}

/*Start of Main Footer*/
.main-footer{
    background-color: #Dcc182;
    color: #000;
    text-align:center;
    padding: 10px;
}
.main-footer a{
    color:#000;
}
.main-footer a:hover{
    text-decoration: underline;
}
.footerPages{
    margin: 1vh 1vh 0vh 1vh;
    display:flex;
    justify-content: space-around;
    /* align-items: center; */
}
.footerPages ul{
    list-style:none;
    width: calc(98vw / 3);
}
ul.footer li:first-child{
    font-weight:bold;
    line-height: 2.2em;
}
.icons{
    display:flex;
    justify-content: center;
}
.paymenticons{
    margin-top:5vh; 
    width:calc(25vw - 10px);
}
.agencyicons{
    align-items: center;
    margin-top:3vh; 
    width:calc(25vw - 10px);
} 
.socialmediaicons{
    margin-top:3.2vh; 
    width:calc(50vw);
} 
.socialmediaicons i{
    font-size:3em;
    margin: 0 2vw 3vw 2vw;
    color:#D884b0;
}
.paymenticons i{
    font-size:1.8em;
    margin: 0 0.5vw 1vw 0.5vw;
    color:#000;
}
.paymenticons img{
    height:1.2em;
}
.agencyicons #atol{
    height:3em;
}
.agencyicons #abta{
    height:2em;
}
.agencyicons #trustpilot{
    height:3.5em;
}
.main-footer p{
    text-align: center;
    font-size:.9em;
}
.main-footer p:last-child{
    font-size:0.7em;
    line-height:1.1em;
    text-align:justify;
}