/* ======================= hotel page style ===================== */



/* ============hotel sidebar-left section ================== */



.hotel_banner h1 {

    font-size: 32px;

    color: var(--white-color);

}

section.hotel .sidebar-left .content-box {

    padding: 20px;

    background: var(--white-color);

    border-bottom: 1px solid var(--border-color);

}

.content-box.rating-filter .filter-container:last-child {

    margin-bottom: 6px;

}

section.hotel .sidebar-left .content-box.top-box .head-title{

    margin: 0 !important;

}

section.hotel .sidebar-left label.check_box {

    display: flex;

    font-weight: 500;

    color: var(--text-color-2);

    align-items: self-start;

    font-size: 14px;

    position: relative;

    padding-left: 27px;

    cursor:pointer;

}

section.hotel .sidebar-left label.check_box .ctm_checkbox {

    position:absolute;

    width:17px;

    height:17px;

    top:2px;

    left:0;

}



/* The custom checkbox styling */

section.hotel .sidebar-left label.check_box .ctm_checkbox:before {

    content: '';

    width: 17px;

    height: 17px;

    border: 1px solid #8a8a8a;

    position: absolute;

    left: 0;

    top: 0px;

    border-radius: 2px;

    background-color: #fff; /* Background color of the checkbox */

    transition: 0.3s; /* Smooth transition */

}



/* The checkmark styling */

section.hotel .sidebar-left label.check_box .ctm_checkbox:after {

    content: '\F272';

    position: absolute;

    left: 1px;

    top: -3px;

    font-family: bootstrap-icons !important;

    font-style: normal;

    font-weight: 700 !important;

    color: var(--black-color);

    opacity: 0;

    visibility: hidden;

    transition: 0.5s;

    transform: scale(0.5);

    font-size: 16px;

}



/* Show the checkmark when the checkbox is checked */

section.hotel .sidebar-left label.check_box input:checked + .ctm_checkbox:after {

    visibility: visible;

    opacity: 1;

    transform: scale(1);

}



/* Hide the default checkbox */

section.hotel .sidebar-left label.check_box input {

  display: none;

}



section.hotel .sidebar-left .count {

    font-size: 12px;

}

section.hotel .sidebar-left .content-box h3.head-title  {

    font-size: 15px;

    color: var(--white-color);

    margin: 0;

    font-weight: 600;

}

section.hotel .sidebar-left .content-box.filter_box{

    padding:12px 20px;

    background:var(--filter-bg);

    color:var(--black-color);

}

.content-box h3.head-title{

    margin-bottom: 8px !important;

}

.content-box .filter-container {

    display: flex;

    justify-content: space-between;

    align-items: center;

    font-size: 14px;

    margin-bottom: 20px;

}

label.check_box {

    display: flex;

    align-items: center;

}

.content-box.rating-filter .filter-container {

    display: flex;

    justify-content: space-between;

    align-items: center;

    font-size: 14px;

    margin-bottom: 20px;

}

section.hotel .sidebar-left .content-box.rating-filter .count{

    border: none !important;

    font-size: 14px;

}

section.hotel .sidebar-left .content-box.rating-filter label.check_box {

    display: flex;

    align-items: center;

}

section.hotel .rating .rating-box  label.star.half-star:before {

    margin-right: 8px;

    font-family: FontAwesome;

    content: "\f5c0" !important;

    display: inline-block;

    font-size: 12px;

}

/* ============hotel sidebar-left section ============== */



/* ============hotel sidebar-right section ============== */

section.hotel .sidebar-right .room-card {

    display: flex;

    border: 1px solid #d9d9d9;

    border-radius: 4px;

    overflow: hidden;

    background: var(--white-color);

    box-shadow: 0px 8px 21px 3px #e9e9e9d1;

    margin-bottom: 20px;

    padding: 14px;

}

.price-box .duration {

    font-size: 12px;

    color: var(--black-color);

}



.price-box .price span {

    font-size: 16px;

    font-weight: 600;

}



.price-box .price {

    margin-bottom: 6px;

    padding-top: 2px;

}



.price-box .price span:first-child {

    color: var(--button-bg);

}



.price-box .price span:last-child {

    font-size: 16px;

    padding-left: 5px;

    color: var(--text-color-1);

}



.price-box {

    margin-top: 10px;

}

section.hotel .sidebar-right .room-card .room-img {

    width: 200px;

    position: relative;

    border-radius: var(--border-radius-4);

    height: 200px;

    overflow: hidden;

}

section.hotel .sidebar-right .room-card .room-img .img-box {

    height: 200px;

}

section.hotel .sidebar-right .room-card .room-img .img-box img{

    height: 100%;

    object-fit: cover;

}

section.hotel .sidebar-right .room-card .owl-theme .owl-nav.disabled+.owl-dots {

    margin-top: 0px;

    position: absolute;

    width: 100%;

    bottom: 13px;

    display: flex;

    justify-content: center;

}



section.hotel .sidebar-right .room-card .owl-theme .owl-dots .owl-dot {

    display: flex !important;

    align-items: center;

    border: 1px solid var(--white-color) !important;

    border-radius: 50% !important;

    height: 13px !important;

    width: 13px !important;

    margin: 0 7px;

    text-align: center;

    justify-content: center;

}

section.hotel .sidebar-right .room-card .owl-theme .owl-dots .owl-dot.active{

    border: 1px solid var(--button-bg) !important;

}

section.hotel .sidebar-right .room-card .owl-theme .owl-dots .owl-dot.active span {

    width: 5px !important;

    height: 5px !important;

    margin: 0 !important;

    background: var(--button-bg);

}



section.hotel .sidebar-right .room-card .room-content {

    width: calc(100% - 200px);

    padding-left: 16px;

    display: flex;

    justify-content: space-between;



}

.hotel .room_content_view {

    text-align: right;

    width: 130px;

    display: flex;

    flex-direction: column;

    justify-content: space-between;

}

.hotel .room_content_title {

    width: calc(100% - 130px);

}

section.hotel .rating{

    display: flex;

    justify-content: left;

    font-size: 12px;

    color: var( --text-color-2);

}

section.hotel .room-card .rating {

    display: flex;

    justify-content: right;

    font-size: 14px;

    color: var( --text-color-2);

    margin-bottom: 2px;

}

section.hotel .rating .rating-box{

    display: flex;

    flex-direction: row-reverse;



}

section.hotel .rating .filter-checkbox{

    display: flex;

}

  section.hotel .rating .rating-box  label:before {

    margin-right: 8px;

    font-family: FontAwesome;

    content: "\f005";

    display: inline-block;

    font-size: 12px;

  }

  section.hotel .rating .rating-box input {

    display: none;

  }

  section.hotel .rating .rating-box  input:checked ~ label,

  section.hotel .rating .rating-box:not(:checked) label:hover,

  section.hotel .rating .rating-box:not(:checked) label:hover ~ label {

  color: #DDA701;

}

section.hotel .rating .rating-box input:checked + label:hover,

section.hotel .rating .rating-box input:checked ~ label:hover,

section.hotel .rating .rating-box label:hover ~ input:checked ~ label,

section.hotel .rating .rating-box  input:checked ~ label:hover ~ label {

  color: #DDA701

  ;

}

section.hotel .sidebar-right .room-content h5.head-title {

    font-size: 15px;

    color: var(--text-color-1);

    font-weight: 700;

}

section.hotel .sidebar-right .room-content h5.head-title a{

    color: var(--text-color-1);

    text-decoration:none;

}

section.hotel .sidebar-right .room-content h5.head-title a:hover{

    text-decoration:underline

}

section.hotel .sidebar-right .room-content .location{

    font-size: 12px;

}

section.hotel .sidebar-right .room-content .location span i{

    margin-right: 5px;

}

section.hotel .sidebar-right .room-content .location span{

    margin-right: 15px;

}

section.hotel .sidebar-right .room-content .location span a{

    text-decoration: none;

    color: var( --text-color-2);

}

section.hotel .sidebar-right .room-content .location span a:hover{

   color:var(--button-bg);

}

section.hotel .sidebar-right .room-content .facility {

    font-size: 13px;

    color: var( --text-color-1);

    margin-top: 8px;

}

section.hotel .sidebar-right .room-content .facility span {

    margin-right: 19px;

    font-weight: 500;

    color: var(--text-color-1);

}

section.hotel .sidebar-right .room-content .facility .mdi{

    color:var(--button-bg);

    margin-right: 8px;

    font-size: 13px;

}

section.hotel .sidebar-right .room-content .facility .mdi:before{

    font-size:14px;

}

section.hotel .sidebar-right .room-content .pricing-container {

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-top: 14px;

}

section.hotel .sidebar-right .room-content .discri span {

    font-size: 12px;

    color: var( --text-color-2);

}

section.hotel .sidebar-right .room-content .content-1 {

    line-height: 0px;

    margin-bottom: 4px;

}

section.hotel .sidebar-right .room-content .content-1 p {

    font-size: 12px;

    line-height: 18px;

    color: var(--black-color);

    margin-bottom: 0px;

}

section.hotel .sidebar-right .room-content .content-1 h6 {

    font-size: 13px;

}



section.hotel .sidebar-right .room-content .content-2 span:first-child{

    color:var(--button-bg);

    display: block;

}

section.hotel .sidebar-right .room-content .pricing-container .duration{

    color: var( --text-color-2);

    font-size: 12px;

    text-align: end;

} 

section.hotel .sidebar-right .room-content .pricing-container .price{

    text-align: end;

}

section.hotel .sidebar-right .room-content .pricing-container .price span{

    font-size: 16px;

    color: var( --text-color-2);

}

section.hotel .sidebar-right .room-content .pricing-container .price span:first-child{

    color:var(--button-bg);

    font-size: 20px;

}

section.hotel .sidebar-right .room-content  a.check-btn {

    padding: 4px 10px;

    margin-bottom: 10px;

    border-radius: 30px;

    width: auto;

    box-shadow: none;

    border:1px solid var(--button-bg);

    font-size: 13px;

    display: inline-block;

    text-decoration: none;

    background:var(--button-bg);

    color:var(--white-color);

    transition:0.5s;

}

section.hotel .sidebar-right .room-content  a.check-btn:hover{

    background:none;

    color:var(--button-bg);

}



section.hotel .sidebar-right .room-content .pricing-container a.check-btn i{

    margin-left: 10px;

    transition: 0.4s;

}

section.hotel .sidebar-right .room-content .pricing-container a.check-btn:hover i{

    transform: translateX(5px);

}









/* ============hotel sidebar-right section ============== */



.hotel_sidebar {

    box-shadow: 0px 8px 21px 3px #e9e9e9d1;

    border-radius: 4px;

    overflow: hidden;

    border:1px solid var(--border-color)

}

section.hotel .sidebar-left .content-box:last-child {

    border-bottom: 0;

}





/* ======================= hotel page style ===================== */





/* ============================== hotel detail 2 page ======================== */



/* ============================== hotel detail page ======================== */

section.hotel-detail{

    padding-bottom: 0;

}

section.hotel-detail .container.detail-container {

    background: #f3f3f5;

    padding: 20px;

    border-radius: 12px;

    box-shadow: 1px;

    box-shadow: 0px 3px 26px 0px #b6b0b0;

}

section.hotel-detail .img-container {

    display: flex;

}



.hotel-detail-title {

    font-size: 30px;

    color: var(--text-color-1);

    font-weight: 600;

}

.hotel_section_title {

    font-size: 18px;

    margin-bottom: 14px;

    font-weight: 600;

}



section.hotel-detail .img-container .img-gallery {



    margin: 0 5px;

}

section.hotel-detail .img-container .img-main{

    width: 100%;

}



section.hotel-detail .img-container .img-gallery .img-box {

    height: 80px;

    width: 80px;

    margin: auto;

    margin-bottom: 5px;

    border-radius: 6px;

    overflow: hidden;

    border: 1px solid transparent;

    padding: 2px;

    transition: 0.3s;

}



section.hotel-detail .img-container .img-gallery .img-box:hover {

    border: 1px solid black;

}



section.hotel-detail .img-container .img-gallery img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    border-radius: 5px;

}



section.hotel-detail .img-container .img-main .img-box {

    height: 384px;

    /* width: 530px; */

    overflow: hidden;

    border-radius: 8px;

}



section.hotel-detail .img-container .img-main .img-box img {

    width: 100%;

    height: 100%;

    object-fit: cover;

}



section.hotel-detail .col-right .detail-content {

    padding: 20px 10px;

}



section.hotel-detail .col-right .title-top h5 {

    font-size: 24px;

    margin: 0;

}



section.hotel-detail .col-right .title-top i {

    color: rgb(190, 190, 29);

    font-size: 12px;

}



section.hotel-detail .col-right .detail-content p.location {

    font-size: 14px;

    font-weight: 500;

    color: var(--text-color-2);

    margin-top: 10px;

}



section.hotel-detail .col-right .detail-content p.location i {

    margin-right: 11px;

}



section.hotel-detail .col-right .detail-content p.location a {

    font-size: 16px;

    color: var(--text-color-1);

}



section.hotel-detail .col-right .detail-content .discri {

    font-size: 15px;

    line-height: 20px;

    color: var(--text-color-2);

}



section.hotel-detail .col-right .detail-content .pricing-container {

    margin-top: 32px;

    display: flex;

    justify-content: space-between;

}



section.hotel-detail .col-right .detail-content .content-1 {

    line-height: 0px;

    margin-bottom: 16px;

    font-size: 14px;

}



section.hotel-detail .col-right .detail-content .content-1 h6 {

    font-size: 18px;

    color: var(--text-color-1);

}



section.hotel-detail .col-right .detail-content .discri span {

    font-size: 14px;

    color: var(--text-color-2);

}



section.hotel-detail .col-right .detail-content .content-2 span:first-child {

    color: var(--button-bg);

    display: block;

    font-size: 17px;

    font-weight: 500;

}



section.hotel-detail .col-right .detail-content .discri span {

    font-size: 14px;

    color: var(--text-color-2);

}



section.hotel-detail .col-right .detail-content .price-box {

    text-align: end;

}



section.hotel-detail .col-right .detail-content .price {

    display: flex;

    align-items: center;

    margin-top: 10px;

}



section.hotel-detail .col-right .detail-content .price span:first-child {

    background: #0b475e;

    padding: 8px 20px;

    font-size: 20px;

    color: white;

    font-weight: 700;

    margin-right: 5px;

    border-radius: 3px;

}



section.hotel-detail .col-right .detail-content .price span:last-child {

    background: var(--button-bg);

    color: white;

    line-height: 1;

    padding: 9px 3px;

    text-align: center;

    font-size: 14px;

    font-weight: 600;

    border-radius: 3px;

}



section.about-hotel .row.r-2 .hightlights {

    display: grid;

    grid-template-columns: repeat(2, 1fr);

    margin-top: 0px;

    grid-column-gap: 30px;

    grid-row-gap: 8px;

}



section.about-hotel .row.r-2 .hightlights .highlight-item {

    font-size: 14px;

    font-weight: 500;

}

section.about-hotel .row.r-2 .hightlights .highlight-item  .mdi {

    margin-right: 5px;

}



section.about-hotel .row.r-2 .hightlights .highlight-item i {

    margin-right: 10px;

    color: var(--button-bg);

}



section.about-hotel .row.r-2 .form-box {

    background: linear-gradient(125deg, rgba(99, 171, 69, .1), rgba(251, 176, 59, .1));

    padding: 40px 20px;

}



section.about-hotel .row.r-2 .col-right .form-heading {

    text-align: center;

    border-bottom: 1px solid #d3d1d1;

    margin-bottom: 15px;

    color: var(--text-color-2);

}



section.about-hotel .row.r-2 .col-right .input-box {

    margin-bottom: 12px;

}

section.about-hotel .row.r-2 .col-right label {

    width: 100%;

    color: var(--text-color-1);

    font-size: 12px;

    font-weight: 700;

}

section.about-hotel .row.r-2 .col-right .form-control {

    border-radius: 2px;

    border: 1px solid #8a8989;

}



section.about-hotel .row.r-2 .col-right .form-control:focus {

    box-shadow: none;

}

section.about-hotel .row.r-2 .col-right .form-heading p {

    margin-bottom: 13px;

    font-size: 14px;

    color: var(--text-color-2);

}

section.about-hotel .row.r-2 .col-right .form-heading h3 {

    font-size: 18px;

    color: var(--text-color-2);

}



section.about-hotel .row.r-2 .col-right label input[type="text"] {

    display: block;

    width: 100%;

    margin-top: 3px;

    padding: 8px 10px;

    border: 1px solid var(--border-color);

}



section.about-hotel .row.r-2 .col-right label input[type="text"]::placeholder {

    color: var(--text-color-1);

    font-size: 13px;

}



section.about-hotel .row.r-2 .col-right label textarea {

    display: block;

    width: 100%;

    margin-top: 3px;

    height: 70px;

    border: 1px solid #d3d1d1;

    padding: 10px 15px;

}



section.about-hotel .row.r-2 .col-right label textarea::placeholder {

    color: var(--text-color-1);

    font-size: 13px;

}



section.about-hotel .row.r-2 .col-right a.form_sbmt-btn {

    text-decoration: none;

    color: white;

    background: var(--button-bg);

    border: 1px solid var(--button-bg);

    display: block;

    text-align: center;

    padding: 8px;

    font-weight: 600;

    transition: 0.3s;

}



section.about-hotel .row.r-2 .col-right a.form_sbmt-btn:hover {

    text-decoration: none;

    color: var(--button-bg);

    background: none;

    display: block;

    text-align: center;

    padding: 8px;

    font-weight: 600;

}



section.about-hotel .room-facilities {

    margin-top: 30px;

}



section.about-hotel .room-facilities ul {

    list-style: none;

    padding: 0;

    display: flex;

    align-items: center;

    gap: 14px;

    flex-wrap: wrap;

}



section.about-hotel .room-facilities ul li {

    border-bottom: 1px solid #d9d9d9;

    width: 32%;

    padding: 10px;

}



section.about-hotel .room-facilities ul li i {

    margin-right: 10px;

    color: var(--button-bg);

}



section.guest-review {

    background: #f3f3f5;

}



section.guest-review .heading-title {

    display: flex;

    justify-content: space-between;

}



section.guest-review .heading-title .review-count {

    display: flex;

    align-items: center;

}



section.guest-review .heading-title .review-count span:first-child {

    background: var(--button-bg);

    height: 31px;

    width: 32px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 4px;

    color: white;

    margin-right: 10px;

}



section.guest-review .heading-title .review-count a {

    text-decoration: none;

    margin-left: 10px;

}



section.guest-review .category-box {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    row-gap: 20px;

    column-gap: 50px;

}



section.guest-review .category-box .category-top {

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-bottom: 5px;

}



section.guest-review .category-box .category-bottom {

    position: relative;

}



section.guest-review .category-box .category-bottom .bg {

    background: #d9d9d9;

    height: 8px;

    border-radius: 20px;

}





section.guest-review .category-box .category-bottom .front {

    position: absolute;

    top: 0;

    width: 70%;

    background: var(--button-bg);

    height: 8px;

    border-radius: 20px;

}



section.available .available-table {

    margin-top: 30px;

    padding: 20px;

    background: #f3f3f5;

    border-radius: 10px;

}



section.available .heading p {

    color: #d4111e;

}



section.available .check_avalable {

    display: flex;

    justify-content: space-between;

    border: 2px solid var(--button-bg);

    color: var(--text-color-2);

}



section.available .check_avalable .check_date {

    padding: 12px 22px;

    width: 38%;

    border-right: 2px solid var(--button-bg);

}



section.available .check_avalable .check-person {

    padding: 12px 22px;

    width: 38%;

}



section.available .check_avalable .check_date i,

section.available .check_avalable .check-person i {

    margin-right: 10px;

    font-size: 18px;

    color: var(--button-bg);

}



section.available .check_avalable .check-btn {

    padding: 12px 22px;

    border: 1px solid var(--button-bg);

    width: 24.2%;

    background: var(--button-bg);

    text-align: center;

}



section.available .check_avalable .check-btn a {

    text-decoration: none;

    color: white;

    font-size: 18px;

}



section.available .check_avalable .check-btn:hover a {

    color: var(--text-color-1)

}



section.available .available-table table {

    width: 100%;

}



section.available .available-table table td {

    vertical-align: middle;

}



section.available .available-table table td a.rm-typ {

    display: block;

    color: var(--black-color);

    font-size: 14px;

}



section.available .available-table table td a.rm-typ i {

    margin-right: 10px;



}



section.available .available-table table td:first-child span {

    font-size: 12px;

}



section.available .available-table table span.children {

    font-size: 13px;

}



 a.ti_button {

    padding: 4px 10px;

    margin-bottom: 10px;

    border-radius: 30px;

    width: auto;

    box-shadow: none;

    border:1px solid var(--button-bg);

    font-size: 13px;

    display: inline-block;

    text-decoration: none;

    background:var(--button-bg);

    color:var(--white-color);

    line-height: 1;

    transition:0.5s;



}



 a.ti_button:hover {

    background: none;

    color: var(--button-bg);

}



/* ============================== hotel detail page ======================== */



/* ============================== hotel detail 2 page ======================== */

section.hotel-detail_2 {

    padding-bottom: 0;

}

/* section.hotel-detail_2 .detail-container_2 {

    background: #f3f3f5;

    padding: 15px;

    border-radius: 13px;

    box-shadow: 0px 3px 26px 0px #b6b0b0;

} */

section.hotel-detail_2 .col-right .img-gallery {

    display: grid;

    grid-template-columns: repeat(5,1fr);

    gap: 4px;

}

section.hotel-detail_2 img{

    width: 100%;

    height: 100%;

    object-fit: cover;

}

section.hotel-detail_2 .row{

    height: 500px;

}

section.hotel-detail_2 .row .col-md-6{

    height: 100%;

}

section.hotel-detail_2 .row .col-left .img-main{

    height: 100%;

    border-radius: 10px;

    overflow: hidden;

    position: relative;

}

section.hotel-detail_2 .row .col-md-6 .view-room {

    position: absolute;

    top: 0;

    left: 0;

    background: #2121217a;

    height: 100%;

    width: 100%;

    color: white;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 10px;

    font-size: 22px;

    transform: scale(0);

    transition: 0.4s;

}

section.hotel-detail_2 .row .col-md-6 .img-main:hover .view-room,

section.hotel-detail_2 .row .col-md-6 .img-box:hover .view-room{

    transform: scale(1);

}

section.hotel-detail_2 .row .col-right .img-box {

    height: 230px;

    border-radius: 0px;

    overflow: hidden;

    position: relative;

}

section.about-hotel .col-left .hotel-discri .location p {

    font-size: 14px;

    font-weight: 500;

    margin-bottom:0px;

}

section.about-hotel .col-left .hotel-discri .location p i:before {

    font-size: 18px;

    margin-right: 5px;

    color: var(--button-bg);

}

section.hotel-detail_2 .row .col-right .img-box a.view-more {

    position: absolute;

    bottom: 10px;

    right: 10px;

    display: flex;

    align-items: center;

    justify-content: center;

    backdrop-filter: blur(2px);

    background: #191b2066;

    border: 2px solid var(--white-color);

    color: var(--white-color);

    font-size: .875rem;

    font-weight: 500;

    line-height: 1.25rem;

    padding: 9px 24px;

    z-index: 1;

    border-radius: 5rem;

    transition:0.5s;

}

section.hotel-detail_2 .row .col-right .img-box a.view-more:hover{

    background: transparent;

    border-color: #dcdfe4;

    color: #dcdfe4;

}

section.about-hotel .col-left .hotel-discri .location {

    display: flex;

    justify-content: space-between;

    align-items: start;

    color: var(--text-color-2);

    font-size: 13px;

    flex-direction: column;

}

section.about-hotel .col-left .hotel-discri .location i.fa-location-dot{

    margin-right: 10px;

}

section.about-hotel .col-left .hotel-discri .location .rating-box {

    font-size: 12px;

    color: #d4d42c;

    margin-bottom: 5px;

    text-align: end;

}

section.about-hotel .col-left .hotel-discri .rating .span-1st {

    background: var(--button-bg);

    color: white;

    line-height: 1;

    padding: 5px 5px;

    text-align: center;

    font-size: 14px;

    font-weight: 600;

    border-radius: 3px;

    display: inline-block;

}

.location span.very_good {

    font-size: 18px;

    display: inline-block;

    padding-left: 5px;

    font-weight: 600;

    color: var(--text-color-1);

}

section.about-hotel .col-left .discri-content{

    margin-bottom: 30px;

}

section.about-hotel .col-left .discri-content .price{

    color: var(--button-bg);

    font-size: 30px;

    font-weight: 600;

}

section.about-hotel .col-left .discri-content .price span:last-child{

    font-size: 16px;

    font-weight: 400;

}



section.hotel-detail_2 {

    padding-bottom: 0;

    padding-top: 0px;

}



section.hotel-detail_2 .col-right .img-gallery .img-box:first-child {

    grid-column-start: 1;

    grid-column-end: 4;

    grid-row-start: 1;

    grid-row-end: 3;

    height: 465px;

}

section.hotel-detail_2 .row .col-right .img-box:nth-child(2) {

    grid-column-start: 4;

    grid-column-end: 6;

}



section.hotel-detail_2 .row .col-md-6 .view-room {

    position: absolute;

    top: 0;

    left: 0;

    background: #2121217a;

    height: 100%;

    width: 100%;

    color: white;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 10px;

    font-size: 22px;

    transform: scale(0);

    transition: 0.4s;

}

section.hotel-detail_2 .row .col-md-6 .img-main:hover .view-room,

section.hotel-detail_2 .row .col-md-6 .img-box:hover .view-room{

    transform: scale(1);

}





/* ============================== hotel detail 2 page ======================== */



section.hotel .sidebar-right .room-card .room-img img {

    height: 100%;

    width: 100%;

    object-fit: cover;

    transition: 0.5s;

}



section.hotel .sidebar-right .room-card .room-img .journey_image {

    height: 100%;

}



section.hotel .sidebar-right .room-card .room-img:hover img {

    transform: scale(1.1);

}

.hotel_sidebar_title {

    font-size: 15px;

    font-weight: 600;

}



.hotelSearch_section form.hotel_search_form {

    padding: 4px;

    background: #c3beb8;

    box-shadow: 0 2px 8px 0 rgba(26,26,26,0.16);

    border-radius: 8px;

    display: flex;

    gap:4px;

}

.hotelSearch_section {

    padding: 0px;

    position: relative;

    margin-top: -30px;

    z-index: 2;

}

.hotelSearch_section form.hotel_search_form .form-group {

    flex: 1 1 auto;

    max-width: 100%;

    position: relative;

    background: #fff;

    padding: 16px;

    border-radius: 4px;

   

}



.hotelSearch_section form.hotel_search_form .form-group.checkInOutGrop,

.hotelSearch_section form.hotel_search_form .form-group.adultGrop {

    width: 27%;

}



.hotelSearch_section form.hotel_search_form .form-group.buttonGrop {

    width: 12%;

    padding:0px;

}



.hotelSearch_section form.hotel_search_form .form-group.destinationGrop {

    width: 34%;

}

.form-group.checkInOutGrop input {

    width: 100%;

    height: 100%;

    border: none;

    padding-left: 43px;

}



.hotelSearch_section .fillterSelect {

    position: relative;

    display: flex;

    align-items: center;

}

.hotelSearch_section .clear-icon {

    cursor: pointer;

    margin-left: 10px;

    font-size: 20px;

    color: #ccc;

}

.hotelSearch_section .clear-icon:hover {

    color: #000;

}

.required-validate {

    border:1px solid red

}



.form-group.checkInOutGrop input:focus {

    outline: none;

    box-shadow: none;

}



.hotelSearch_section form.hotel_search_form .form-group label {

    position: absolute;

    top: 50%;

    left: 16px;

    transform: translateY(-50%);

    font-size: 14px;

    font-weight: 500;

    right: 16px;

}

.hotelLocationDroupDown {

    position: absolute;

    background: #fff;

    width: 430px;

    left: 0;

    padding: 0;

    top: 115%;

    border-radius: 8px;

    box-shadow: 0 2px 16px 0 rgba(26,26,26,0.24);

    list-style: none;

}



.hotelLocationDroupDown .header_list h4 {

    font-size: 14px;

    margin-bottom: 0px;

    font-weight: 600;

}



.hotelLocationDroupDown .header_list {

    padding: 14px;

}



.hotelLocationDroupDown li {

    display: flex;

    padding: 8px;

    border-bottom: 1px solid var(--border-color);

    transition: 0.5s;

    cursor: pointer;

}

.hotelLocationDroupDown li:nth-last-child(2) {

    border-bottom: none;

}

.hotelLocationDroupDown li .countryState span {

    display: block;

}



.hotelLocationDroupDown li span.statName {

    font-size: 14px;

    font-weight: 600;

}



.hotelLocationDroupDown li .countryName {

    font-size: 13px;

}



.hotelLocationDroupDown li .location_icon i:before {

    font-size: 30px;

}



.hotelLocationDroupDown li .location_icon {

    margin-right: 10px;

}



.hotelLocationDroupDown li:hover {

    background: #f6f6f6;

}

.hotelSearch_section form.hotel_search_form .form-group label .mdi:before {

    font-size: 24px;

}

.hotelSearch_section form.hotel_search_form .form-group.buttonGrop input {

    width: 100%;

    height: 100%;

    border: none;

    border-radius: 4px;

    background: var(--button-bg);

    color: #fff;

    font-size: 20px;

    font-weight: 500;

    transition:0.5s;

}

.hotelSearch_section form.hotel_search_form .form-group.buttonGrop input:hover{

    background:#0c4464;

}

.hotelSearch_section form.hotel_search_form .form-group .selects_ad_lists {

    top: 115%;

}



.hotelSearch_section form.hotel_search_form .form-group .selects_ad_lists li label {

    position: initial;

    transform: translateY(0px);

}



.hotelSearch_section form.hotel_search_form .form-group .selects_ad_lists li {

    list-style: none;

    padding: 0px;

}



.hotelSearch_section form.hotel_search_form .form-group .selects_ad_lists {

    padding: 24px;

}



.hotelSearch_section form.hotel_search_form .form-group .selects_ad_lists li .adult_age span {

    color: var(--black-color);

    margin: 0;

}



.hotelSearch_section form.hotel_search_form .form-group .selects_ad_lists li .pets {

    margin-top: 10px;

    padding-top: 10px;

    padding-bottom: 10px;

    border-top: 1px solid var(--border-color);

}



.hotelSearch_section form.hotel_search_form .form-group .selects_ad_lists li .pets label {

    display: flex;

    justify-content: space-between;

}

.inner-banner.about_breadcrumb.hotelbrd {

    background: #1a2b49;

    position: relative;

    z-index: 2;

}



.hotelSearch_section form.hotel_search_form .form-group.destinationGrop .fillterSelect {

    display: flex;

    align-items: center;

}



.hotelSearch_section form.hotel_search_form .form-group.destinationGrop .fillterSelect input {

    width: calc(100% - 60px);

    border: none;

    padding-left: 5px;

}

.hotelSearch_section form.hotel_search_form .form-group.destinationGrop .fillterSelect input:focus{

    outline:none;

}



.hotelSearch_section form.hotel_search_form .form-group.destinationGrop .fillterSelect input::placeholder {

    color: var(--text-color-1);

    font-weight: 500;

}



.form-group.adultGrop {}



label.adult_label {

    display: flex;

    align-items: center;

}



label.adult_label .adultqnty {

    width: 50%;

    margin-left: auto;

    display: flex;

    border: 1px solid var(--border-color);

    padding: 6px 8px;

    border-radius: 4px;

    justify-content: space-between;

}



label.adult_label .adultqnty input {

    width: 50px;

    border: none;

    text-align: center;

}



label.adult_label .adultqnty button {

    width: 25px;

    height: 25px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    font-size: 16px;

    border: 1px solid var(--button-bg);

    background: none;

    color: var(--button-bg);

    transition: 0.5s;

}



label.adult_label .adultqnty button:hover {

    background: var(--button-bg);

    color: #fff;

}

.room-facilities iframe {

    width: 100%;

}



/* =================================== mobile css ============================================ */

@media(max-width:767px){

    .hotelSearch_section form.hotel_search_form{

        flex-direction: column;

        margin-top:15px;

    }

    .hotelSearch_section form.hotel_search_form .form-group.buttonGrop {

        width: 100%;

    }

    .hotelSearch_section form.hotel_search_form .form-group.checkInOutGrop, .hotelSearch_section form.hotel_search_form .form-group.adultGrop {

        width: 100%;

    }

    .hotelSearch_section form.hotel_search_form .form-group.destinationGrop {

        width: 100%;

    }

    .hotelSearch_section form.hotel_search_form .form-group{

        padding:10px;

        height:45px;

    }

    label.adult_label .adultqnty button{

        width:20px;

        height: 20px;

    }

    .hotelLocationDroupDown{

        width: 100%;

        z-index: 9;

    }

    .offcanvas-body .content-box h3.head-title {

        display: none;

    }

    label.check_box input {

        margin-right: 8px;

        width: 15px;

        height: 15px;

    }

    label.check_box input {

        margin-right: 8px;

        width: 15px;

        height: 15px;

    }

    

    section.hotel .sidebar-right .room-card {

        padding:0px;

    }

    

    section.hotel .sidebar-right .room-card .room-img {

        width: 100%;

        height: 100%;

        border-radius: 0px;

    }

    

    section.hotel .sidebar-right .room-card .room-content {

        width: 100%;

        padding: 12px;

        flex-direction: column;

    }

    

    .hotel .room_content_title {

        width: 100%;

    }

    

    .hotel .room_content_view {

        width: 100%;

        text-align: left;

    }

    

    section.hotel .sidebar-right .room-content .content-1 p {

        display: -webkit-box;

        -webkit-line-clamp: 4;

        -webkit-box-orient: vertical;

        overflow: hidden;

    }

    

    section.hotel .room-card .rating {

        color: var(--button-bg);

        font-weight: 500;

        justify-content: right;

    }

    section.hotel .sidebar-right .room-content .pricing-container{

        margin-top:10px;

    }

    section.hotel .sidebar-right .room-content .facility{

        display: none;

    }

    section.hotel .sidebar-right .room-card {

        border-radius: 10px;

        display: grid;

        grid-template-columns: 140px calc(100% - 140px);

    }

    .room-content .price-box {

        position: relative;

        text-align: right;

        margin-top: 2px;

    }

    section.hotel .sidebar-right .room-content .location span {

        margin-right: 0px;

    }

    

    section.hotel .sidebar-right .room-content .location {

        font-size: 12px;

        display: -webkit-box;

        -webkit-line-clamp: 2;

        -webkit-box-orient: vertical;

        overflow: hidden;

    }



    .hotel-detail_2{

        display: none;

    }

    section.about-hotel .col-left .hotel-discri .location {

        flex-direction: column;

        align-items: self-start;

    }

    section.about-hotel .col-left .hotel-discri .location p {

        margin-bottom: 8px;

    }

    .location .rating {

        display: flex;

        align-items: center;

    }

    

    .location .rating .span-1st {

        margin-right: 10px;

    }

    .hotel-detail-title {

        margin-top: 0px;

        font-size: 26px;

    }

    .highlights-container {

        margin-bottom: 24px;

    }

    section.about-hotel .row.r-2 .hightlights {

        display: grid;

        grid-template-columns: repeat(1, 1fr);

        gap: 10px;

        margin-top: 20px;

    }

    .room-facilities iframe {

        width: 100%;

        height: 300px;

    }

    section.about-hotel .row.r-2 .form-box {

        margin-top: 14px;

    }

    .discri-content .price {

        position: fixed;

        bottom: 0;

        left: 0;

        padding: 10px 10px;

        background: #fff;

        z-index: 99;

        width: 100%;

        box-shadow: 2px -2px 6px rgb(0 0 0/15%);

    }

    .discri-content .price.hide{

        display: none;

    }

}

/* =================================== mobile css ============================================ */



/* =================================== tablet css ======================= */

@media(min-width:768px) and (max-width:992px) {

    section.hotel .sidebar-right .room-content .facility{

        display: none;

    }

    .hotelSearch_section form.hotel_search_form .form-group.destinationGrop {

        width: 28%;

    }

    label.adult_label .adultqnty input{

        width:34px;

    }

    label.adult_label .adultqnty button{

        width:20px;

        height: 20px;

    }

    section.hotel-detail_2 .row {

        height: 400px;

    }

    section.hotel-detail_2 img {

        width: 100%;

        height: 100%;

        object-fit: cover;

    }

}

/* =================================== tablet css ======================= */





.room_booking_form {

    box-sizing: border-box;

    border-radius: 4px;

    overflow: hidden;

}



.room_booking_form .ti-form {

    margin: 0;

    padding: 15px 5px;

}
.room_booking_form .ti-form {
    background: #febb02;
}
.room_booking_form .ti-form label{
    margin-bottom:4px;
}
.room_booking_form .ti-form input,
.room_booking_form .ti-form select{
    font-size:12px;
}
.room_booking_form .ti-form::placeholder{
    font-size:12px;
}
.room_booking_form .ti-form .col-6 {

    margin-bottom: 5px;

    margin-top: 0;

}



.room_booking_form .ti-form .col-12 {

    margin-top: 0px;

    margin-bottom: 5px;

}



.room_booking_form .ti-form .col-12:last-child {

    margin-top: 8px;

    margin-bottom: 0;

}



.room_booking_form .room_booking_heading {

    font-size: 18px;

    text-align: center;

    margin-bottom: 0;

    background: #494a4c;

    color: var(--white-color);

    padding: 8px 0;

}

.hotel_map {

    border-radius: 4px;

    overflow: hidden;

    border: 1px solid var(--border-color);

    line-height: 1;

}



.hotel_map p {

    line-height: 1.2;

    padding: 10px;

    margin-bottom: 0;

    font-size: 14px;

}

.discri-content .rating-box {

    font-size: 12px;

    color: #d4d42c;

}

.search_wrapper {

    position: relative;

    max-width: 540px;

    margin: 0 auto;

    margin-top: 18px;

}



.search_wrapper input {

    width: 100%;

    height: 56px;

    border: none;

    border-radius: 30px;

    font-size: 1.25rem;

    font-weight: 600;

    color: var(--text-color-1);

    padding-left: 30px;

    padding-right: 120px;

}

.search_wrapper label.fillterSelect {

    position: relative;

    width: 100%;

}



.search_wrapper span.clear-icon {

    position: absolute;

    right: 124px;

    font-size: 30px;

    top: 21px;

    line-height: 15px;

    cursor: pointer;

}



.search_wrapper input::placeholder {

    color: var(--text-color-1);

}



.search_wrapper input:focus {

    outline: none;

    box-shadow: none;

}

.hotel_search_btn {

    position: absolute;

    right: 10px;

    top: 50%;

    padding: 12px 25px;

    border-radius: 25px;

    background: var(--button-bg);

    color: var(--white-color);

    font-weight: 500;

    font-size: 17px;

    border: none;

    transform: translateY(-50%);

    line-height: 1;

    transition: 0.5s;

}

.hotel_search_btn:hover {

    background: #1a2b49;

}



@media(min-width:768px) and (max-width:1024px){

    section.hotel-detail_2 .col-right .img-gallery .img-box:first-child{

        height:400px;

    }

    section.hotel-detail_2 .row .col-right .img-box{

        height:198px;

    }

}



@media(max-width:767px){

    .search_wrapper input {

        width: 100%;

        height: 44px;

        border: none;

        border-radius: 30px;

        font-size: 1rem;

        font-weight: 600;

        color: var(--text-color-1);

        padding-left: 20px;

        padding-right: 115px;

    }

    .hotel_search_btn{

        padding:8px 20px;

        font-size:15px;

        right:8px;

    }

    .hotelLocationDroupDown .header_list h4{

        text-align: left;

    }

    .search_wrapper span.clear-icon {

        right: 104px;

        top: 14px;

    }

}