
@media only screen and (max-width: 767px) {

.font-24 {
  font-size: 18px;
}
.contact-text {
  font-size: 14px;

}
.font-40 {
    font-size: 30px;
}

.font-22 {
    font-size: 19px;
}

.footer-slider-list .footer-slide {
  font-size: 18px;
  font-weight: 300;
}

/* The side navigation menu */
.sidenav {
  height: 100%; /* 100% Full-height */
  width: 0; /* 0 width - change this with JavaScript */
  position: fixed; /* Stay in place */
  z-index: 1; /* Stay on top */
  top: 0; /* Stay at the top */
  left: 0;
  background-color: #043732; /* Black*/
  overflow-x: hidden; /* Disable horizontal scroll */
  padding-top: 60px; /* Place content 60px from the top */
  transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
}

/* The navigation menu links */
.sidenav a {
  padding: 15px 10px;
  text-decoration: none;
  font-size: 25px;
  color: #ffffff;
  display: block;
  transition: 0.3s;
  text-align: left;
   font-family: "Poppins", sans-serif;
}

/* When you mouse over the navigation links, change their color */
.sidenav a:hover {
  color: #f1f1f1;
}

/* Position and style the close button (top right corner) */
.sidenav .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
}
.theme-button {
padding: 10px 20px;
    font-size: 14px;

}
#carouselExampleFade .carousel-indicators {
 display:none;
}
.hero-shape-top,  .shape-bottom{
    display: none;
}
.nav-mobile{
    position: absolute;
    z-index: 10000;
    text-align: right;
    left: -2em;
    top: 3em;
}
.header-scrolled .nav-mobile{
   top: 1.4em;
}
.quote-card {
    position: unset;

    margin-bottom: 2em;
}
.room-meta ul li {

    width: calc(50% - 15px);

}
.font-27 {
    font-size: 21px;
}
.header-2.header-scrolled {

    margin-top: 0;
}
.heading-1 {
    font-size: 30px;
}
.slider-heading {
    font-size: 26px;
}
    #carouselExampleFade .carousel-caption {
        top: 27%;
        right: 5%;
        left: 5%;

    }
}

/*vertical*/

@media screen and (min-width: 768px) and (max-width: 991px) {
.room-meta ul li {

    width: calc(50% - 15px);

}
    .sidenav-brand img {
        display: block;
        width: 100%;
        height: auto;
    }
.font-27 {
    font-size: 22px;
}
.theme-button {

    font-size: 14px;
}
.font-16 {
    font-size: 15px;
}
.heading-1 {
    font-size: 36px;
}
.slider-heading {
    font-size: 30px;
}
.d-tab-none{
    display: none !important;
}
.d-tab-block{
    display: block !important;
}
#carouselExampleFade .carousel-caption {
    top: 70%;

}
.about-tabs {

    font-size: 14px;

}
.carousel-item p{
    display: none !important;
}
#carouselExampleFade .carousel-indicators {
 display:none;
}
.hero-shape-top,  .shape-bottom{
    display: none;
}
/* The side navigation menu */
.sidenav {
  height: 100%; /* 100% Full-height */
  width: 0; /* 0 width - change this with JavaScript */
  position: fixed; /* Stay in place */
  z-index: 1; /* Stay on top */
  top: 0; /* Stay at the top */
  left: 0;
  background-color: #043732; /* Black*/
  overflow-x: hidden; /* Disable horizontal scroll */
  padding-top: 60px; /* Place content 60px from the top */
  transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
}

/* The navigation menu links */
.sidenav a {
  padding: 15px 10px;
  text-decoration: none;
  font-size: 25px;
  color: #ffffff;
  display: block;
  transition: 0.3s;
  text-align: left;
   font-family: "Poppins", sans-serif;
}

/* When you mouse over the navigation links, change their color */
.sidenav a:hover {
  color: #f1f1f1;
}

/* Position and style the close button (top right corner) */
.sidenav .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
}
    .nav-mobile {
        position: absolute;
        z-index: 10000;
        text-align: right;
        left: -2em;
        top: 6em;
    }
.header-scrolled .nav-mobile{
   top: 4em;
}
.font-22 {
    font-size: 17px;
}
.font-40 {
    font-size: 30px;
}


.theme-button {

    padding: 10px 20px;
}


}

@media (min-width: 992px) and (max-width: 1199px)
{
.hero-shape-top,  .shape-bottom{
    display: none;
}
.font-18 {
    font-size: 16px;
}
.header-sidebar{
    display: none;
}
.heading-1 {
    font-size: 40px;
}
.slider-heading {
    font-size: 28px;
}
#carouselExampleFade .carousel-caption {
    top: 65%;

}
.header-2.header-scrolled {

    margin-top: -10px;
}
    .navbar-expand-lg .navbar-nav {

        margin-left: -5em;
    }
    .font-22 {
    font-size: 19px;
}



}

/*large*/

@media (min-width: 1400px) {


}

@media only screen and (max-width: 991px) {
    .sidenav {
        width: 0;
        max-width: 360px;
        height: 100vh;
        display: flex;
        flex-direction: column;
        box-sizing: border-box;
        padding: 0;
        background: #fff;
        box-shadow: 12px 0 35px rgb(4 55 50 / 18%);
        overflow-y: auto;
        overflow-x: hidden;
        transition: width .35s ease;
        z-index: 1101;
    }

    .sidenav-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        min-width: 280px;
        padding: 1.25rem 1.25rem 1rem;
        border-bottom: 1px solid rgb(4 55 50 / 10%);
    }

    .sidenav-brand {
        display: block !important;
        width: 112px;
        padding: 0 !important;
    }

    .sidenav-brand img {
        display: block;
        width: 100%;
        height: auto;
    }

    .sidenav-close {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 38px;
        height: 38px;
        border: 1px solid rgb(4 55 50 / 14%);
        border-radius: 50%;
        background: #fff;
        color: #043732;
        font-size: 17px;
    }

    .sidenav-links {
        min-width: 280px;
        padding: 1rem 1rem .5rem;
    }

    .sidenav-links a {
        display: flex !important;
        align-items: center;
        gap: .85rem;
        margin-bottom: .35rem;
        padding: .85rem 1rem !important;
        border-radius: .65rem;
        color: #043732;
        font-size: 16px;
        font-weight: 500;
        text-align: left;
    }

    .sidenav-links a i {
        width: 20px;
        color: #b38a45;
        text-align: center;
    }

    .sidenav-links a:hover,
    .sidenav-links a.active {
        background: #edf3f1;
        color: #043732;
    }

    .sidenav-booking {
        min-width: 280px;
        margin-top: auto;
        padding: 1rem 1.25rem 1.5rem;
    }

    .sidenav-booking a {
        padding: .85rem 1rem;
        border-radius: .35rem;
        color: #fff;
        font-size: 15px;
    }

    .sidenav-backdrop {
        position: fixed;
        inset: 0;
        z-index: 1100;
        background: rgb(4 55 50 / 42%);
        opacity: 0;
        pointer-events: none;
        transition: opacity .35s ease;
    }

    body.mobile-nav-open .sidenav-backdrop {
        opacity: 1;
        pointer-events: auto;
    }
}
