.booking-modern-box{
background:#fff;
padding:35px;
border-radius:20px;
}

.booking-modern-box h4{
margin-bottom:20px;
font-weight:600;
}

.home_banner .swiper-slide { position:relative; }

.home_banner .swiper-slide:after {
    content:'';
    position:absolute;
    background:rgba(0,0,0,0.4);
    top:0;
    left:0;
    height:100%;
    width:100%
}
.booking-grid{
display:grid;
grid-template-columns:repeat(5,1fr);
gap:18px;
align-items:center;
}

.booking-field{
display:flex;
align-items:center;
gap:10px;
background:#e8e8e8;
padding:12px 15px;
border-radius:12px;
border:1px solid #E8E8E8;
}

.booking-field input,
.booking-field select{
border:none;
background:transparent;
outline:none;
width:100%;
font-size:14px;
}

.booking-field{
display:flex;
align-items:center;
gap:12px;
background:#f5f5f5;
padding:14px 16px;
border-radius:8px;
height:55px;
}

.booking-field i{
font-size:18px;
color:#777;
}

.room-counter button{
width:28px;
height:28px;
border:none;
background:#ddd;
border-radius:4px;
cursor:pointer;
font-size:18px;
}

.room-counter input{
width:40px;
text-align:center;
border:none;
background:transparent;
font-size:16px;
font-weight:600;
}

.book-btn{
background:#1781fe;
border:none;
padding:14px;
color:white;
border-radius:12px;
font-weight:600;
cursor:pointer;
}

.booking-rating{
margin-top:15px;
color:#666;
}
.date-field{
position:relative;
}

.field-label{
position:absolute;
top:-4px;
left:45px;
font-size:11px;
color:#777;
}
.inner_icon{
    top:-5rem;
}

.hotel-section-title{
    max-width:100% !important;
}

/*Hotel detail page Read more/Read less*/
/*.desc-text{*/
/*    height:120px;*/
/*    overflow:hidden;*/
/*    transition:0.4s ease;*/
/*}*/

/*.read-btn{*/
/*    color:#c19d68;*/
/*    font-weight:600;*/
/*    cursor:pointer;*/
/*    display:inline-block;*/
/*    margin-top:10px;*/
/*}*/
.facilities-list svg rect{
    fill:#007BFF;
}
.facilities-list svg path{
    fill:#fff;
}

.hotel-card .hotel-content .location-area{
    gap:15px;
}



/*1440*/
/*@media (min-width:1440px){*/
/*    .home_banner{*/
/*     height:148vh !important;   */
/*    }*/
/*}*/


/*Banner all pages*/
/*hotel detail page*/
.breadcrumb-section.four .banner-content{
    top:-2rem !important;
}
/*Other pages banner Content*/
.breadcrumb-section .banner-content{
    top: .8rem;
}

/*About page*/
    .section-title{
        margin-top:2rem;
    }
    
.page-top-margin{
    margin-top: 2rem;
}
.destination-page .page-top-margin{
    margin-top 4rem;
}



/*Gallery*/
.gallery-section{
    margin-top: 2rem;
}
/*Banner all pages*/

/*Hotel detail page contact button*/
.contact_btn{
    width:55% !important;
    padding: 11px 24px;
}
.contact_btn .after-txt{
    margin-left: 20px;
}

/*Hotel detail tab section*/
.facility-tabs-wrapper{
overflow-x:auto;
white-space:nowrap;
border-bottom:1px solid #ddd;
margin-bottom:20px;
}

.facility-tabs{
display:inline-flex;
flex-wrap:nowrap;
}

.facility-tabs .nav-item{
flex:0 0 auto;
}

.facility-tabs .nav-link{
border:none;
color:#000;
font-weight:600;
padding:10px 20px;
white-space:nowrap;
}

.facility-tabs .nav-link.active{
border-bottom:3px solid #0d6efd;
color:#0d6efd;
}



.facilities-list li{
list-style:none;
display:flex;
align-items:center;
gap:8px;
font-size:15px;
width:30%;
}

.facility-item svg rect{
fill:#0d6efd;
}

.facility-item svg path{
stroke:#fff;
stroke-width:2;
fill:none;
}

.facility-tabs-wrapper{
overflow-x:auto;
white-space:nowrap;
border-bottom:1px solid #ddd;
margin-bottom:20px;

/* hide scrollbar */
scrollbar-width:none;
}

.facility-tabs-wrapper::-webkit-scrollbar{
display:none;
}

.facility-tabs{
display:inline-flex;
flex-wrap:nowrap;
}

.facility-tabs .nav-item{
flex:0 0 auto;
}

.facility-tabs .nav-link{
border:none;
color:#000;
font-weight:600;
padding:10px 20px;
white-space:nowrap;
}

.facility-tabs .nav-link.active{
border-bottom:3px solid #0d6efd;
color:#0d6efd;
}


.facilities-list li{
list-style:none;
display:flex;
align-items:center;
word-break:normal;
white-space:normal;
gap:8px;
font-size:15px;

/* responsive width */
width:calc(33.33% - 10px);
}

@media (max-width:992px){
.facilities-list li{
width:calc(50% - 10px);
}
}

@media (max-width:576px){
.facilities-list li{
width:100%;
}
}
.facility-tabs-wrapper{
overflow-x:auto;
overflow-y:hidden;
white-space:nowrap;
border-bottom:1px solid #ddd;
margin-bottom:20px;
scrollbar-width:none;
}

.facility-tabs-wrapper::-webkit-scrollbar{
display:none;
}

.facility-tabs {
    display: flex;
    overflow-x: auto;
    overflow-y: hidden;
}

.facility-tabs .nav-item{
flex:0 0 auto;
}

.facilities-list li{
list-style:none;
display:flex;
align-items:center;
gap:8px;
font-size:15px;
line-height:1.4;

/* proper width */
flex:0 0 calc(33.33% - 20px);
}

/* tablet */
@media (max-width:992px){
.facilities-list li{
flex:0 0 calc(50% - 20px);
}
}

/* mobile */
@media (max-width:576px){
.facilities-list li{
flex:0 0 100%;
}
}

.facilities-list{
display:flex;
flex-wrap:wrap;
gap:12px 70px;
padding:0;
margin:0;
width:750px;        /* full width */
flex-basis:100%;   /* parent flex issue fix */
}

.facilities-list li{
list-style:none;
display:inline-flex;
align-items:center;
gap:8px;
font-size:15px;
white-space:nowrap;
}

.facilities-list li svg{
flex-shrink:0;
}

.facilities-list li svg rect{
fill:#1a73e8;
}

.facilities-list li svg path{
stroke:#fff;
stroke-width:2;
fill:none;
}
/*Hotel detail tab section*/

.contact-card{
    box-shadow:none;
    gap:2rem;
}
.contact-card:hover{
    box-shadow:none;
}

.contact-info-box{
background:#fff;
border-radius:8px;
padding:20px;
box-shadow:0 4px 20px rgba(0,0,0,0.08);
}

.contact-card{
display:flex;
align-items:center;
gap:12px;
}

.contact-card .content span{
display:block;
font-size:14px;
color:#666;
}

.contact-card .content a{
font-size:15px;
color:#000;
text-decoration:none;
}

.address-box strong{
display:block;
margin-bottom:5px;
}

.address-box p{
margin:0;
font-size:14px;
}
.location-box{
background:#fff;
padding:20px;
border-radius:10px;
box-shadow:0 8px 25px rgba(0,0,0,0.08);
}

.map-wrapper iframe{
width:100%;
height:260px;
border-radius:8px;
}

.contact-card{
display:flex;
align-items:center;
gap:12px;
}

.address-box strong{
display:block;
margin-bottom:6px;
}

.address-box{
    display:flex;
    justify-content:start;
    align-items:center;
    gap: 12px;
}
.contact-main-card{
    line-height: 0px;
}
/*About page why cwhy-choose-card*/
.why-choose-card .content{
    margin-top: 1rem;
}

/*Contact form*/
.contactFormCenter{
}
#bookingForm select {
    width: 100%;
    height: 55px;
    border-radius: 10px;
    border: none;
    background: #e9e9e9 !important;
    padding: 0 20px;
    outline: 0;
    font-size: 15px;
}

#bookingForm select:focus {
    box-shadow: 0 0 0 2px #ddd;
    background: #fff !important;
}

#hotelSearchForm select:focus, #hotelSearchForm input:focus {
    box-shadow: none;
}


/*Our blog*/
 .banner-content h2{
        font-size:40px;
    }
.blog-content{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.blog-feature-image{
    width: 100%;
}
.blog-feature-image img{
    width: 100%;
    height: 60vh;
    object-fit: cover;
    border-radius: 8px;
}
/* Featured Blog Image */
.blog-feature-image img{
    width:100%;
    height:420px;
    object-fit:cover;
    border-radius:10px;
}

/* Blog Content Area */
.hotel-dt-description-area{
    line-height:1.8;
    font-size:16px;
}

.hotel-dt-description-area h1{
    font-size:32px;
    font-weight:700;
    margin-bottom:20px;
}

.hotel-dt-description-area h2,
.hotel-dt-description-area h3,
.hotel-dt-description-area h4{
    margin-top:25px;
    margin-bottom:12px;
    font-weight:600;
}

/* Paragraph spacing */
.hotel-dt-description-area p{
    margin-bottom:15px;
}

/* Blog content images from editor */
.hotel-dt-description-area img{
    width:100%;
    max-height:500px;
    object-fit:cover;
    border-radius:8px;
    margin:20px 0;
}

/* Lists */
.hotel-dt-description-area ul,
.hotel-dt-description-area ol{
    padding-left:20px;
    margin-bottom:20px;
}

.hotel-dt-description-area li{
    margin-bottom:8px;
}

/* Related Blogs */
.related-blog-item .card{
    border:none;
    box-shadow:0 6px 20px rgba(0,0,0,0.08);
    border-radius:10px;
    overflow:hidden;
    transition:0.3s;
}

.related-blog-item .card:hover{
    transform:translateY(-4px);
}

/* Related Blog Image */
.related-blog-item img{
    width:100%;
    height:160px;
    object-fit:cover;
}

/* Related Blog Text */
.related-blog-item .card-body{
    padding:15px;
}

.related-blog-item h6{
    font-size:16px;
    font-weight:600;
    margin-bottom:5px;
}

.related-blog-item p{
    font-size:14px;
    margin-top:5px;
}
/* Related blog card horizontal */
.related-blog-item .card{
    display:flex;
    flex-direction:row;
    align-items:center;
    border:none;
    border-radius:10px;
    overflow:hidden;
    box-shadow:0 6px 18px rgba(0,0,0,0.08);
    transition:0.3s;
}

.related-blog-item .card:hover{
    transform:translateY(-3px);
}

/* Image */
.related-blog-item .card-img-top{
    width:95px;
    height:85px;
    object-fit:cover;
    border-radius:8px;
    margin:10px;
}

/* Content */
.related-blog-item .card-body{
    padding:10px 10px 10px 0;
}

.related-blog-item .card-body h6{
    font-size:15px;
    font-weight:600;
    margin-bottom:4px;
    line-height:1.3;
}

.related-blog-item .card-body small{
    font-size:12px;
}

.related-blog-item .card-body p{
    font-size:13px;
    margin-top:4px;
    line-height:1.4;
}

.related-blog-item{
    display: flex;
    flex-direction: column;
    gap: 13px;
}

.blog-content .blog-btn{
    padding: 12px 24px !important;
    margin-top: 10px;
}

/*Rooms page*/
.rooms_page{
    margin-top: 2rem;
    margin-bottom: 6rem;
}


ul.list-inline rect {
    fill: var(--white-color);
    stroke: var(--primary-color1);
}

ul.list-inline svg {
    fill: var(--primary-color1);
}
.cardbg-1 {
    background-color: #E6F5A9 !important;
}

.cardbg-3 {
    background: #E2E2FF !important;
}

.cardbg-4 {
    background-color: #BDEBCE !important;
}

.why-choose-card h4 {
    font-size: 20px;
    max-width: 220px;
}

.breadcrumb-section .banner-content {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}
.banner-content.tophotelwrp {
    position: relative;
    transform: none;
    top: 0 !important;
}



/*1024*/
@media(max-width:1024px){
    #tworoom{
        align-items: center;
        left: -7rem !important;
        flex-direction: column;
        gap: 3rem;
    }
    .inner_icon{
       top: -3.5rem; 
    }
    .footer-widget .widget-list iframe{
        width:300px;
    }
    
}

@media(max-width:768px){
    form#bookingForm .col-md-6 {
    margin-top: 6px;
}

.custom-booking-modal input, .custom-booking-modal select {
    height: 36px !important;
    border-radius: 5px;
}

.custom-booking-modal label {
    margin-bottom: 2px;
}

    .hotel-details-page .hotel-details-sidebar {
    position: relative;
    top: 34px;
}
    .tariff-section ul li {
    width: 88%;
}
.facilities-list {
    width: auto;
}
.location-box .contact-card {
    flex-direction: row;
}
    .hdrbtn {
    left: 20px;
    position: relative;
}
    .booking-grid{
        grid-template-columns:1fr 1fr;
    }
    
    .book-btn{
        grid-column:span 2;
    }
    .slide-content{
        width:500px;
    }
    .slide-content h1{
        font-size: 45px !important;
    }
    #tworoom{
        left: 5rem !important;
    }
    .inner_icon {
        top: -5rem;
    }
    .booking-overlay{
        bottom:-24rem !important;
    }
    .home10-hotel-and-room-section {
        
        padding-top: 385px !important;
    }
    .home7-testimonial-section .testimonial-wrapper .testimonial-card.five p{
        padding-inline:11px;
    }
    
    /*Banner contetn*/
    /*.breadcrumb-section .banner-content{*/
    /*    top: 2.6rem !important;*/
    /*}*/
    .banner-content h2{
        font-size:35px;
    }
    
    .breadcrumb-section{
        top: 0rem;
        padding: 0 !important;
    }
    .destination_top_title{
        font-size:32px;
    }
    .tab-content{
        margin-top:2rem !important;
    }
   /*Gallery*/
   .gallery-section{
        margin-top: 3rem;
    }
}

.room_field,.hotel_field{
 padding:18px 15px;   
}



@media (max-width:576px){
    
    .breadcrumb-section.four .banner-content.tophotelwrp {
        flex-wrap: wrap;
        top: 0 !important;
    }
    
    .breadcrumb-section.four .banner-content.tophotelwrp h1 {
        font-size: 24px;
        margin-bottom: 6px;
        margin-top: 10px;
    }
    
    .tophotelwrp .location-area a {
        font-size: 12px !important;
    }
    
    .hoteltop_right .content a {
        font-size: 15px;
    }
    
    .hoteltop_right {
        padding-top: 20px;
    }
    
    .hoteltop_right .content span {
        line-height: normal;
    }
    
    .breadcrumb-section.four .banner-content .rating-area {
        margin-top: 10px;
        margin-bottom: 5px;
    }
    
    .tophotelwrp  .location-area {
        gap: 10px !important;
    }
    

.booking-grid{
display:block;
}

.booking-field{
width:100%;
margin-bottom:12px;
}

.room-counter{
justify-content:space-between;
}

.book-btn{
width:100%;
margin-top:10px;
}

.booking-modern-box h4{
font-size:18px;
text-align:center;
margin-bottom:15px;
}

}

@media (max-width:425px){
    .booking-overlay{
        bottom:none;
    }
        .home10-banner-section {
         margin-bottom: 0px !important; 
    }
    .slide-content{
        width:400px;
    }
    .slide-content h1{
        font-size: 30px !important;
    }
    .home10-hotel-and-room-section {
        padding-top: 495px !important;
    }
    .booking-overlay{
        bottom:-34rem !important;
    }
     #tworoom{
        left: .7rem !important;
    }
    .footer-widget .widget-list {
        text-align: center;
    }
    
    .footer-widget .widget-list iframe{
        width:350px;
    }
    
    /*Gallery*/
    .gallery-section{
        margin: 0;
        padding-bottom:0;
    }
    
    /*Blog section*/
    .blog-cards{
        margin-top: 37px;
    }
    
    .banner-content h2{
        font-size:31px;
    }
}






