@import url('../../../css-3');

*{
    font-family: 'Barlow Semi Condensed',sans-serif;
}


@media screen and (max-width:1100px){
  .navbars{
    display: none!important;
  }
  .details.sticky-top{
    margin-top:0!important;
    padding-top:0!important;
  }
  .menu-icon{
    display: block!important;
  }
  .logo-head{
    padding:8px!important;
  }
  #base{
    margin-top:10px!important;
  }
}
.logo img{
  height: 70px;
}

.footer-color{color:#fff;}

.font-weight-bold {
    font-weight: 700!important
}

.navbars a{
  line-height: 21px;
}
.header .social-icons a{
    color:grey;
    text-decoration: none;
}

.header .contact a{
    text-decoration: none;
    color:grey;
}

.header .contact a:hover,
.header .social-icons a:hover{
    color:green;
}


/* Navbar container */
.navbars {
    overflow: hidden;
    font-family: Arial;
  }
  
  /* Links inside the navbar */
  .navbars a {
    float: left;
    font-size: 20px;
    color: rgb(36, 36, 36);
    text-align: center;
    padding: 20px 16px;
    text-decoration: none;
  }
  
  /* The dropdown container */
  .dropdowns{
    float: left;
    overflow: hidden;
    padding: 5px 0;
  }
  
  /* Dropdown button */
  .dropdowns .dropbtns {
    font-size: 20px!important;
    border: none;
    outline: none;
    color: rgb(36, 36, 36);
    padding: 17px 16px;
    background-color: inherit;
    font: inherit; /* Important for vertical align on mobile phones */
    margin: 0; /* Important for vertical align on mobile phones */
  }
  
  
  /* Add a red background color to navbar links on hover */
  .navbars a:hover, .dropdowns:hover .dropbtns {
    color:green;
    cursor: pointer;
  }
  
  /* Dropdown content (hidden by default) */
  .dropdown-contents {
    border-top: 5px solid green;
    opacity:0;
    visibility:hidden;
    transition:all .5s;
    background-color: #f9f9f9;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    padding: 10px 0;
  }
  .dropdown-contents:hover{
      opacity:1;
      visibility:visible;
  }
  .dropdown-contents  a{
      text-decoration:none;
      cursor: pointer;
      color:black;
      font-size: 18px;
      padding:10px 0;
      text-align: left;
      width: 100%;
  }
  .dropdown-contents  p{
      font-size:18px;
      border-bottom: 2px solid lightgrey;
      padding:20px 0;
      margin-bottom: 10px;
  }

  .dropdowns .cnt-1{
    position: absolute;
    width: 90%;
    left: 50%;
    top: 100%;
    transform: translateX(-50%);
  }
  .dropdowns .cnt-2{
    position: absolute;
    width: 23%;
    left: 50%;
    transform: translateX(-40%);
    top: 100%;
  }
  
  .dropdowns .cnt-3{
    position: absolute;
    width:20%;
    left:48%;
    transform: translateX(-50%);
    top: 100%;
  }
  .dropdowns .cnt-3 li{
      list-style:none;
  }
  .dropdowns .cnt-3 li:hover .drop{
      opacity:1;
      visibility:visible;
  }
  .dropdowns .cnt-3 .ctn3a,
  .dropdowns .cnt-3 .ctn3b,
  .dropdowns .cnt-3 .ctn3c{
    position: absolute;
    right: 100%;
    width: 100%;
    padding: 0 15px;
    opacity:0;
    visibility:hidden;
    transition:all .5s;
    background-color: #f9f9f9;
    border-top:5px solid green;
  }
  .dropdowns .cnt-3 .ctn3b{
      top:25%!important;
  }
  .dropdowns .cnt-3 .ctn3c{
      top:70%!important;
  }
  .dropdowns .cnt-4{
    position: absolute;
    width:20%;
    left: 92%;
    transform: translateX(-80%);
    top: 100%;
  }
  .dropdowns .cnt-5{
    position: absolute;
    width:20%;
    left: 47%;
    top: 100%;
  }

  .dropdowns .cnt-6{
    position: absolute;
    width:20%;
    left: 66%;
    transform: translateX(-50%);
    top: 100%;
  }

  .dropdowns .cnt-7{
    position: absolute;
    width:20%;
    left: 77%;
    transform: translateX(-50%);
    top: 100%;
  }

  /* Show the dropdown menu on hover */
  .dropdowns:hover .dropdown-contents{
    opacity:1;
    visibility:visible;
  }
  
  a.search input{
    width:0;
    opacity:0;
    box-shadow: none!important;
    outline: none;
  }
  
  .topscroll{
     top: 0 !important; 
      
  }
  
  .active-slide,
  .active-inner-slide{
      color: #32b67a !important;
  }
  
.active-slide i,
.active-inner-slide i{
    
    transform: rotate(180deg);  
  }
  
  .menu-content i{
    
    transition:.3s;  
  }
  .menu-content .drop{
      padding: 15px 0;
    color: grey;
}

.menu-content .drop-content,
.menu-content .drop-contents{
    display: none
}
.menu-content .drop-contents a,
.menu-content .drop-content a{
    padding: 15px 0;
    color: grey;
    display: block;
}

  .menu-content .drop,
  .drop-content .drops{
    border-bottom: 1px dashed black;
    color: black;
    font-weight: bold;
  }
  .legal ul a{
    visibility:visible;
    opacity:1;
    display: block;
    padding:5px 10px;
    font-size:1.1em;
    text-decoration: none;
    color:black;
  }

  .legal ul a:hover{
    background:grey;
    color:white;
  }

  .legal .col{
    border-right:1px solid rgba(0, 0, 0, 0.479);
  }

  .listing .package{
    background:linear-gradient(rgba(0, 0, 0, 0.425),rgba(0, 0, 0, 0.438)), url(../images/4.jpg) center no-repeat;
    background-size: cover;
  }

  .listing .about-package p{
    font-size:1.2em;
    line-height: 28px;
  }

  .listing .about-package .middle-text{
    border-right: 2px solid black;
  }

  @media screen and (max-width:700px){
    .listing .about-package .middle-text{
      border-right: none;
    }
    .listing .about-package .detail-card{
      flex-wrap: wrap;
    }
  
  }

  .listing .about-package .detail-card{
    background: #eeeeee;
  }
  .listing .pagination-box a{
    color:white;
    background:grey;
    font-size:1.2em;
    box-shadow: none;
  }
  .listing .pagination-box a:hover{
    background: rgba(0, 0, 0, 0.664);
  }
  .listing .pagination-box a.active{
    background: rgba(0, 0, 0, 0.664)!important;
  }

.about-package .sec-col .que{
    background:url(../images/booking-bg.jpg);
  }

 .about-package .sec-col .book-with-us span{
    border-bottom: 1px solid lightgrey;
    padding: 15px 0;
    visibility:visible;
    opacity:1;
    display: block;
  }
 .latest-article a:last-child{
    border-bottom: none;
  }
 .latest-article a{
    border-bottom:1px solid lightgrey;
  }

.latest-article a img{
    height: 100px;
  }

  .trekking-vdos{
    background:linear-gradient(rgba(0, 0, 0, 0.514), rgba(184, 36, 36, 0.534)), url(../image/5.jpg) center no-repeat;
    background-size: cover;
  }
.trekking-vdos .line i{
    transform: rotate(45deg);
  }

.green-color{
  color:#008001!important;
}

  .itenary-accordion .card .card-header h6{
    font-size: 1.3em;
  }
  
.fa-2x{
    font-size: 1.5em;
    color: grey;
  }  
  
  
#overlay-search{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.8);
    display: none;
    z-index: 9999;
  }    
  
  
  
#overlay-search .input-group{
        width: 90%;
    max-width: 600px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);  
    border-bottom: 2px solid white;
}   

#overlay-search .input-group input{
background: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none;
    outline: none;
    color: white;
    font-size: 1.1rem;
    cursor: default;
}

#overlay-search .input-group input::placeholder{
    color: white;
    font-size: 1.1rem;
    opacity: .8;
}

#overlay-search .input-group button{
border: none;
    background: none;
    color: white;
    font-size: 2rem;
    outline: none;
     cursor: pointer;
}
  
#mobile-search-icon{
font-size: 1.4rem;
    color: grey;  
}
  
 #search-close-icon {
  padding: 20px;
  color: white;
  outline: none;
  cursor: pointer;
  font-size: 1.5rem;
 }
 
 /*.highlights p span{*/
 /*    font-family:Symbol;*/
 /*}*/
 @media only screen and (max-width : 576px) {
  #my_departure table, #my_departure thead, #my_departure tbody, #my_departure th, #my_departure td, #my_departure tr {
    display: block;
  }
  #my_departure thead tr {
    position: absolute;
    top: -9999px;
    left: -9999px;
  }
   #my_departure p {
    margin-bottom: 0;
    line-height: 18px;
  }
  #my_departure tr {
    border-bottom: 1px solid lightgrey;
  }
  #my_departure td {
    border: none;
    position: relative;
    padding-left: 50%;
    text-align: left !important;
  }
  #my_departure td:before {
    position: absolute;
    left: 0;
    width: 45%;
    padding-right: 10px;
    white-space: nowrap;
    font-weight: bold;
  }
  #my_departure td:nth-of-type(1):before {
    content: "Start Date :";
  }
  #my_departure td:nth-of-type(2):before {
    content: "End Date :";
  }
  #my_departure td:nth-of-type(3):before {
    content: "Status :";
  }
  #my_departure td:nth-of-type(4):before {
    content: "Note :";
  }
  #my_departure td:nth-of-type(5):before {
    content: "Price :";
  }
}