body{
    margin:0px;
    padding:0px;
    overflow-x: hidden;
    width:100%;
    box-sizing: border-box;
    
}
.hideall{
    display:none;
}
/*above nav bar*/
@media (max-width:850px){
    .desktopnavtop{
        display:none;
    }
}
.abovebar > ul li{
    display: inline-block;
    margin:0px;
}
.search{
    float:right;
padding-top: 2%;
  
}

/*desktop view nav bar*/

.desktopnav{
    margin-top: -5px;
}
.new{
    width:100%;

    text-align: center;
   
}
.text{
   
       padding-top:10%;
    padding-bottom:10%;
   
}
.text a{
    text-decoration: none;
    color:black;
}
.text a:hover{
    color:#10A1CC;
}

.nav > ul li{
    list-style-type: none;
    display:inline-block;
    margin-top: 1%;
    float:left;
    margin-left:3%;
    height:100%;
   }

.megadropdown{
width:100%;
   position: absolute;
    margin-left:-10%;
  margin-top: 0.5%;
    z-index: 999;
    padding:1%;
    background-color: white;
    
}
.megadropdown1{
width:100%;
   position: absolute;
    margin-left:-23.5%;
      margin-top: 0.5%;
    z-index: 999;
    padding:1%;
    background-color: white;
    
}
.megadropdown:after {
    position: absolute;
    margin-left:-43%;
    top: -8px;
    width: 0;
    height: 0;
    content: '';
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid grey;
}
.megadropdown1:after {
    position: absolute;
    margin-left:-25%;
    top: -8px;
    width: 0;
    height: 0;
    content: '';
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid grey;
}
#adjust ul li{
    margin-top: 10%;
    text-align: center;
}
/*#adjust a{
    color:white;
    font-size: 15px;
    margin-left:-32%;
   display:block;
    width:5rem;
    padding:5%;
    text-align: center;
  }*/
/*#adjust a:hover{
    color:black;
    background-color: white;
}*/
.hide{
    display:none;
}
@media (max-width:850px){
    .desktopnav{
        display:none;
    }
}
@media (min-width:850px){
    .mobnav{
        display:none;
    }
}
@media (min-width:1200px){
   .col-md-2half{
   width:18.5%;
   margin-left: 1.5%;
    margin:0% auto;
      
    
} 
}
@media (max-width:1200px) {
     .col-md-2half{
   width:30.5%;
   margin-left: 1.5%;
    margin:0% auto;
    
}  
}

@media (min-width:992px){
    .text a{
        font-size: 15px;
    }
    .nav > ul li{
   
    margin-left:3%;
  
   }
}
@media (max-width:992px){
     .text a{
        font-size: 14px;
    }
    .nav > ul li{
   
    margin-left:2%;
  
   } 
}
.dropdowntext{
    text-align: left;
    margin-top: 1%;
}
.rotate{
     -moz-transition: all .5s linear;
    -webkit-transition: all .5s linear;
    transition: all .5s linear;
    color:#10A1CC;
    display:inline-block;
}
.down{
    transform: rotate(-180deg);
}
@media (min-width:1200px){
    .megadropdown1{
        margin-left:-23.5%;
    }
}
@media (max-width:1200px){
    .megadropdown1{
        margin-left:-25.7%;
    }
}
/*carausal*/
@media (min-width:1360px) and (max-width:2444px){
    .sizing{
        height:550px;
        width:100%;
    }
}
@media (max-width:1360px) and (min-width:800px){
    .sizing{
        height:500px;
        width:100%;
    }
}
@media (max-width:800px){
    .sizing{
        height:300px;
        width:100%;
    }
}
/*image overlay on the megadropdown menu*/
.overlaycont{
    position:relative;
    width:100%;
}
.image{
    display:block;
    width:100%;
}
.overlay{
     position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  background-color: #10A1CC;
}
.overlaytext {
  color: white;
  font-size: 2.5vw;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;opacity:0;
}
.col-md-2half:hover .overlay {
  opacity: 0.6;
}
.col-md-2half:hover .overlaytext {
  opacity: 1;
}
/*divider settings*/
.straight{
   
   border-top:1px solid grey;
    opacity: 0.2;
    color:grey;
    cursor:pointer;
}
.straightline{
   cursor:pointer;
    border-top:1px solid #10A1CC; 
}
/*deals and packages*/
.dealsstyle{
     color:#10A1CC;
    text-align: center;
    margin-top: 1%;
}
.dealsstyle1{
     color:#10A1CC;
    text-align: center;
    margin-top: 3%;
}
/*things to do overlay design*/
.overlaycont1{
    position:relative;
    width:100%;
}
.image{
  display:block;
    width:100%;
}
.overlay1{
     position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  background-color: #10A1CC;
   
}
.overlaytext0{
    position:absolute;
    height:18%;
    width:100%;
    top:83%;
    background-color: black;
    opacity:0.5;
}
.overlaytext1{
    position: absolute;
margin-top: 3%;
    color:white;
    width: 100%;
    text-align: center;
 }
.overlaytext2 {
  color: white;
  font-size: 2.5vw;
  position: absolute;
  top: 50%;
  width:100%;
    left:50%;
    text-align: center;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;opacity:0;
}
.animatedivider{
width:0%;
display: block;
border-top:1px solid white;
border-bottom:1px solid transparent;
margin-left: auto;
    margin-right: auto;
    
}
.overlaytext1{
    position: absolute;
    top:80%;
    font-size: 1vw;
}
.hover:hover .overlay1 {
  opacity: 0.6;
}
.hover:hover .overlaytext2 {
  opacity: 1;
}
.hover:hover .overlaytext1,.hover:hover  .overlaytext0{
    display:none;
}
.padding-0{
    padding-left: 0;
    padding-right:0;
}
/*things to do margin design*/
.things{
    margin-top: 3%;
    text-align: center;
    color:#10A1CC;
}
/*what's on part*/
.whats{
    position:relative;
}
.whatsoverlay1{
    width:3.6rem;
    height:3.8rem;
    background-color: black;
    position:absolute;
    top:2%;
    opacity:0.6;
}
.whatsoverlay2{
    position:absolute;
    top:2%;
    color:white;
    text-align: center;
}
.whats:hover{
    opacity:0.8
}
.button0{
    width:100%;
    text-align: center;
    background-color:#10A1CC;
    padding:0.8%;
   border:2px solid #10A1CC;
}
.button0 a{
    color:white;
}
.button0:hover{
    color:#10A1CC;
    background-color: white;
    border:2px solid #10A1CC;
}
.button0:hover a{
    color:#10A1CC;
}
.whatsonpara{
    text-align: justify;
    color:grey;
    font-size: 15px;
}
.things1{
    color:#10A1CC;
    text-align: left;
    margin-top: 3%;
}
/*seasonals attraction*/
@media (min-width:768px){
 .col-md-3sea{
    width:24%;
    height:30%;
    margin: 5% auto;
}   
}
@media (max-width:768px){
 .col-md-3sea{
    width:45%;
    height:30%;
    margin: 5% auto;
}   
}
.season{
    position:relative;
    }
.seasonover{
    position:absolute;
    height:100%;
    width:100%;
    background-color: black;
    top:0%;
    opacity: 0;
z-index: 9;
}
.img-flu{
    display:block;
    width:100%;
    height:100%;
}

.seasonoverlay{
    position:absolute;
  width:100%;
height:20%;
    text-align: center;
margin-top: -30%;
    z-index: 99;
  
}
.seasontext{
    display:block;
   margin:5%
}
.seasontext h6{
    font-size: 15px;
    font-weight: 600;
    color:white;
 
}
.seasonover:hover{
    opacity:0.6;
    z-index: 9;
}
/*social media partition*/
.socialmedia{
    background-color: #10a1cc;
    margin-top: 2%;
    margin-bottom: 3%;
}
.socialmedia1,.socialmedia2 ,.socialmedia3,.socialmedia4,.socialmedia5{
    margin-top: 2%;
    margin-bottom: 2%; 
    text-align: center;
}
@media (min-width:700px){
 .socialmedia1,.socialmedia2 a,.socialmedia3 a,.socialmedia4 a,.socialmedia5 a{
    font-size: 25px;
    font-weight: 800;
    color:white;
}  
}
@media (max-width:700px){
.socialmedia1,.socialmedia2 a,.socialmedia3 a,.socialmedia4 a,.socialmedia5 a{
  
    font-size: 18px;
    font-weight: 800;
    color:white;
}  
}

/*Footer*/
.footer ul li{
    list-style-type: none;
    font-size: 14px;
    color:grey;
    margin-top: 8%;
    margin-left: -35%;
 
}
.footer ul li a{
    color:grey;
}
.footerheader{
font-size: 15px;
color:#10a1cc;
}
.rotate1{
     -moz-transition: all .5s linear;
    -webkit-transition: all .5s linear;
    transition: all .5s linear;
    color:#10A1CC;
    display:inline-block;
    float:right;
}
.mobilefooter ul li{
   list-style-type: none;
    font-size: 14px;
    margin-top: 2%;
    text-align: left;
display:block;
    margin-left: -3.5%;
}
.mobilefooter ul li a{
 color:grey;
}
.hide{
    display:none;
}
#footernavbar1{
    cursor:pointer;
    border-bottom: 1px solid grey;
    height:2rem;
}
#footernavbar2{
    cursor:pointer;
    border-bottom: 1px solid grey;
    height:2rem;
}
#footernavbar3{
    cursor:pointer;
    border-bottom: 1px solid grey;
    height:2rem;
}
.footertext{
    font-size: 16px;
  color:#10a1cc;
}
@media (max-width:768px){
    #visible{
        display:none;
    }
}
@media (min-width:768px){
    #visible1{
        display:none;
    }
}
/*top mobile nav bar part1*/
.movnavicon{
    display:inline-block;
    float:left;
     margin-top:5%;
    cursor:pointer;
   }
.movnavicon i{
    font-size: 40px;
    
    color:
}
.mobnavimg{
    display:block;
    margin: 0% auto;
    width:150px;
    }
.mo{
    display: inline-block;
float:right; 
    text-align: center;
    font-size: 18px;
     margin-top: 8%;
    color:#10a1cc;
    font-weight: 700;
}
/*humberger animation*/
.wrapper-menu {
  width: 30px;
  height: 30px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  cursor: pointer;
  transition: transform 0.5s ease-out;
}
.wrapper-menu.open {
  transform: rotate(-45deg);  
}

.line-menu {
  background-color: #10a1cc;
  border-radius: 5px;
  width: 100%;
  height: 4px;
}

.line-menu.half {
  width: 50%;
}

.line-menu.start {
  transition: transform 0.5s cubic-bezier(0.54, -0.81, 0.57, 0.57);
  transform-origin: right;
}

.open .line-menu.start {
  transform: rotate(-90deg) translateX(3px);
}

.line-menu.end {
  align-self: flex-end;
  transition: transform 0.5s cubic-bezier(0.54, -0.81, 0.57, 0.57);
  transform-origin: left;
}

.open .line-menu.end {
  transform: rotate(-90deg) translateX(-3px);
}

/*top mobile navbar part2*/
@media (min-width:850px){
    .mobnavhide{
        display:none;
    }
}
.hidemovnavpart2{
    z-index: -1;
    position: absolute;
    width:100%;top:0px;bottom: 0px;height:100%;background-color: white;
}
.mobnavhide{
    z-index: 10;background-color: white
}
.absolutemovpart2{
   z-index: 9999
}
.movnavicon1{
       display:inline-block;
    float:left;
}
.mo1{
    display: inline-block;
      margin-top:5%;
    float:right;
    cursor:pointer;
}
.mobnavpart12 > ul li{
    list-style-type: none;
    margin: 0px;
    padding: 0px;
    background-color: skyblue;
    display:block;
   padding: 0.5%;
    border-bottom: 1px solid white;
    color:white;
}
.mobnavpart12 > ul li:hover{
   background-color: #10a1cc;
}
.mobnavpart12 > ul{
    padding: 0px;
    margin: 0px;
    width:100%;
}
.rotate12{
    display: inline-block;
    float:right;
    transition: 0.5s ease-in-out;
     color:#10a1cc;
}
.rotate121{
    transform: rotate(180deg);
    color:white;
}
.headerdiv{
    padding:0.5%;
    font-size:20px;
    background-color: #e5dada;
    margin-top: 0.3%;
}
.rotate13{
    display: inline-block;
    float:right;
    transition: 0.5s ease-in-out;
    color:#10a1cc;
}
.rotate131{
    transform: rotate(180deg);
    color:white;
}
.hidemob{
    display:none;
}
.hidebacker{
     background-color: #10a1cc;
    color:white;
}
.hidemovnav{
    display:none;
}
/*ACCOMODATION PAGE 2ND PAGE*/
.accomodation{
   color:#10a1cc;
    margin-top: 5%;
    margin-bottom: 5%;
}
.accomodationpart2{
    background-color: #10a1cc;
}
.accomodationicon i{
    color:white;
    font-size:18px;
    margin-top:5%;
    margin-bottom:5%;
}
.accomodationpart2text{
    font-size: 17px;
    color:white;
}
.selectback{
    background-color: #10a1cc;
}
.selectitem{
    border:1px solid white;
    padding:2%;
    margin-bottom: 5%;
}
.selectitem:hover{
    border:1px solid white;
}
.selectitemtext{
    color:white;
    margin-top: 5%;
}
.browsers{
     border:1px solid black;
}
.browsers:hover{
    border:1px solid black;
}
.button1{
   display:inline-block; 
    float:left;
    background-color: #57bddb;
    padding-top: 1%;
    padding-bottom: 1%;
    padding-left: 5%;
     padding-right: 5%;
    width:45%;
    text-align: center;
    border:2px solid #57bddb; 
    color: white;
   cursor:pointer;
    text-decoration: none;
}

.button1:hover {
    color:white;
}

.button2{
   display:inline-block; 
    float:right;
    width:45%;
    background-color: #8fd173;
      padding-top: 1%;
    padding-bottom: 1%;
    padding-left: 5%;
    text-align: center;
     padding-right: 5%;
    color: white;
       cursor:pointer;
    text-decoration: none;
  
    }
.button2:hover{
    color:white;
}
/*farmstay page*/
.button21{
    display:inline-block;
    text-align: center;
    width:100%;
    color:white;
   border:2px solid #57bddb; 
    background-color: #57bddb;
      padding-top: 1%;
    padding-bottom: 1%;
      padding-left: 5%;
     padding-right: 5%;
    font-weight: 700;
    }
.button21:hover{
    text-decoration: none;
    color:#57bddb;
    background-color: white;
    
}

.button22{
    display:inline-block;
    text-align: center;
    width:100%;
    color:white;
      padding-top: 1%;
    padding-bottom: 1%;
      padding-left: 5%;
     padding-right: 5%;
     border:2px solid #8fd173;
        background-color:#8fd173;
     font-weight: 700;
}

.button22:hover{
    text-decoration: none;
    color:#8fd173;
    background-color: white;
}
