    @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@600&display=swap');

    * {
        padding: 0;
        top: 0;
        box-sizing: border-box;
    }

    html,
    body {
        margin: 0;
        padding: 0;
        overflow-x: hidden;
        scroll-behavior: smooth;
        font-family: 'Poppins', sans-serif;
    }

    img {
        object-fit: cover;
    }

    /*----------NAVBAR----------*/

    .header {
        width: 1250px;
        border: none;
        display: flex;
        margin: auto !important;
    }

    .top-desc-container {
        width: 1250px;
        margin: auto;
    }

    .logo {
        width: 50%;
        margin: 10px 0px;
    }

    .logo img {
        cursor: pointer;
        height: 50px;
    }

    .profile {
        display: inline-flex;
        justify-content: right;
        margin-left: 15px;
    }

    .nav button {
        background-color: #276BAE;
        border-radius: 5px;
        border: none;
        height: 40px;
        width: 100px;
        font-size: 16px;
        color: aliceblue;
        transition: all 0.3s ease-out;
        cursor: pointer;
        /* border-radius: 4px; */
        width: 25%;
        justify-content: right;
    }

    .nav button:hover {
        background-color: #0A3967;
    }

    .nav {
        width: 50%;
    }

    .nav ul {
        float: right;
        display: inline-flex;
    }

    .nav ul button {
        width: 100px;
    }

    .btn {
        margin-left: 5px;
        font-family: 'Nunito Sans', sans-serif !important;
    }

    /*---------BANNER AND SEARCH ENGINE----------*/

    .image {
        padding: 0;
        top: 0;
        margin-top: -30px;
    }

    .banner {
        width: 100%;
        height: 60vh;
        /* height: 50vh; */
        background-blend-mode: darken;
        background-image: url(../images/tours&travell.jpg), linear-gradient(180deg, rgba(25, 25, 25, .5) 9%, rgba(0, 0, 0, .5) 100%, transparent 0, transparent 0);
        background-size: cover;
        margin-top: 20px;
        position: relative;
    }

    .form i {
        font-size: 23px;
        text-align: center;
    }

    .input-container {
        width: 36%;
        margin-left: 10px;
        position: relative;
    }

    .input-container a {
        color: white !important;
    }

    .input-container:first-child {
        margin-left: 0px;
    }

    .input-search {
        width: 27% !important;
        margin-left: 10px;
    }

    .icon {
        padding: 10px;
        background: #276BAE;
        color: white;
        min-width: 60px;
        text-align: center;
        border-bottom-left-radius: 5px;
        border-top-left-radius: 5px;
    }

    .img-pop-column img {
        object-fit: cover;
    }

    .form input {
        height: 63px;
        border: none;
        font-size: 17px;
        padding-left: 20px;
        font-family: 'Nunito Sans', sans-serif;
        border-bottom-right-radius: 5px;
        border-top-right-radius: 5px;
        width: 100%;
        position: relative;
    }

    .input-container .custom-select select {
        height: 63px;
        width: 100%;
        border: none;
        font-size: 17px;
        padding-left: 20px;
        border-bottom-right-radius: 5px;
        border-top-right-radius: 5px;
        background-color: white;
        color: rgb(129, 129, 129);
        -webkit-appearance: none;
        appearance: none;
        cursor: pointer;
    }

    .daterangepicker .drp-calendar {
        max-width: 100% !important;
    }

    .daterangepicker th {
        width: 10px !important;
    }

    th.next {
        padding: 5px !important;

    }

    th.next span {
        border: solid white !important;

        border-width: 0 2px 2px 0 !important;
    }

    .heading {
        margin-bottom: 10px !important;
    }

    .custom-select {
        position: relative;
        width: 100%;
    }

    .custom-select::after {
        content: "";
        /* font-size: 1rem; */
        top: 30px;
        right: 20px;
        position: absolute;
        border: 7px solid transparent;
        border-color: rgb(124, 122, 122) transparent transparent transparent;
        pointer-events: none;
    }

    select:focus {
        outline: none;
    }

    .form button {
        height: 63px;
        width: 100%;
        font-size: 18px;
        color: white;
        cursor: pointer;
        background-color: #276BAE;
        border: none;
        border-radius: 5px;
        transition: all 0.3s ease-out;
    }

    .form button:hover {
        background-color: #0A3967;
    }

    .top-banner-whole {
        width: 1250px;
    }

    .form {
        width: 100%;
        background: linear-gradient(117.67deg, hsla(0, 0%, 100%, .2) 16.83%, hsla(0, 0%, 100%, .1) 60.85%);
        border-radius: 5px;
        padding: 20px 20px;
    }



    .top-banner-whole {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .form-absolute {
        margin-top: 15px;
    }

    .another-form {
        background: transparent !important;
        padding: 10px 0px;
        width: 1250px;
        margin: auto;
    }

    .form-inline {
        display: inline-flex;
        width: 100%;
    }

    .search-filt {
        background-color: white;
        padding-left: 100px;
        width: 412px;
        margin-left: 40px;
        margin-bottom: 90px
    }

    .search-filt ul li {
        list-style: none;
    }

    .input-searchcombo {
        display: inline-flex;
        width: 100%;
    }

    .abso-display {
        position: relative;
    }

    .search {
        width: 100%;
    }

    .img-background {
        background-color: rgba(255, 255, 255, 0.822);
        width: 40%;
        padding: 15px;
        border-radius: 10px;
        display: flex;
        justify-content: center;
    }

    .img-background img {
        width: 100%;
        object-fit: contain;
    }

    /*auto search*/

    ::-webkit-scrollbar {
        width: 10px;
    }

    ::-webkit-scrollbar-track {
        border: none;
    }

    ::-webkit-scrollbar-thumb {
        background: rgb(209, 209, 209);
        border-radius: 8px;
    }

    .autocombo-search {
        background-color: white;
        width: 88.5%;
        position: absolute;
        pointer-events: none;
        z-index: 9999999999999999999999999999999999;
        margin-top: 68px;
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
        overflow-y: auto;
        margin-left: 60px;
        max-height: 200px;
        height: auto;
        /* display: none; */
    }

    .autocombo-search li {
        list-style: none;
        font-size: 17px;
        color: rgb(54, 54, 54);
        transition: 0.3s;
    }

    .autocombo-search ul {
        margin-top: 0px;
        margin-bottom: 0px;
    }

    .input-searchcombo .autocombo-search {
        pointer-events: auto;
    }

    .input-searchcombo .autocombo-search li {
        display: block;
        cursor: pointer;
        border-bottom: 1px solid #d9d5d5;
        padding: 13px;
    }

    .autocombo-search li:hover {
        background-color: #ebe9e9;
    }

    /*auto search ends*/
    /*--------------------OUR ROOMS CATEGORIES--------------------------*/

    .offer {
        margin-top: 80px;
        margin-bottom: 20px;
    }

    .container1 {
        width: 1250px;
        display: flex;
        flex-wrap: wrap !important;
        margin: 0 auto;
        gap: 20px;
    }

    .box-whole-container {
        width: 100%;
        display: inline-flex;
    }

    .offer .heading {
        width: 1250px;
        margin: auto;
        display: flex;
    }

    .heading h5 {
        font-size: 22px;
        color: #403F3F;
        text-transform: capitalize;
        font-weight: bolder;
        margin-bottom: 0px;
        margin-top: 0px;
        position: relative;
        font-weight: 600;
        padding-top: 10px;
        width: 50%;
        letter-spacing: 1px;

    }

    /* .offer .heading h5::before {
    margin-right: 10px;
    width: 50px;
    height: 2px;
    background: #276BAE;
    content: "";
    display: inline-block;
    vertical-align: middle;
    position: relative;
    top: 50%;
    left: 0;
    -webkit-transform: translate(0, -50%);
} */
    /* .offer .heading h5::after {
    margin-left: 10px;
    width: 50px;
    height: 2px;
    background: #276BAE;
    content: "";
    display: inline-block;
    vertical-align: middle;
    position: relative;
    top: 50%;
    left: 0;
    -webkit-transform: translate(0, -50%);
} */

    .view-all {
        display: inline-flex;
        width: 100%;
    }

    .view-all p {
        font-size: 18px;
        color: #4b4a4a;
        width: 70%;
        margin-bottom: 0px;
        margin-top: 20px;
    }

    .button-view {
        width: 50%;
        text-align: right;
    }

    .button-view button {
        padding: 10px;
        width: 110px;
        font-size: 17px;
        border: none;
        background-color: #276BAE;
        color: white;
        border-radius: 4px;
        cursor: pointer;
        margin-right: 5px;
        transition: 0.5s;
    }

    .button-view button:hover {
        background-color: #0A3967;
    }

    .button-view button i {
        margin-left: 3px;
        font-size: 15px;
    }

    .container1 {
        margin-top: 20px;
    }

    .content2 {
        /* width: 24%; */
        width: 23.7%;
        /* padding-left: 20px; */
        box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
        border-radius: 5px;
    }

    .right {
        width: 100%;
        margin-top: -22px;

    }

    .left {
        width: 100%;
    }

    .left img {
        width: 100%;
        /* height: 26vh; */
        height: 30vh;
        object-fit: cover;
    }

    .right p {
        color: rgb(99, 94, 94);
        margin-top: 0px;
        margin-bottom: 0px;
        font-size: 14px;
        width: 100%;
    }

    .right i {
        color: #403f3f85;
        font-size: 14px;
    }

    .rating {
        width: 50%;
        display: flex;
    }

    .right h4 {
        color: #276BAE;
        letter-spacing: 2px;
        font-size: 18px;
        margin-top: 30px;
        margin-bottom: 0px;
        font-weight: 600;
        text-align: center;
    }

    .right h5 {
        color: rgb(80, 78, 78);
        font-size: 18px;
        margin-top: 10px;
        margin-bottom: 0px;
    }

    .right button {
        height: 40px;
        width: 170px;
        border-radius: 20px;
        border: none;
        background-color: #276BAE;
        color: white;
        letter-spacing: 1px;
        font-size: 16px;
        font-family: 'Poppins', sans-serif;
        cursor: pointer;
        transition: all 0.3s ease-out;
    }

    .category-price {
        margin-bottom: 15px;
    }

    .price-place {
        border-top: 1px solid rgb(212, 212, 212);

    }

    .price {
        border-left: 1px solid rgb(212, 212, 212);
        padding: 15px;

    }

    .rating {
        padding: 15px;
    }

    .book {
        display: none;
    }

    .book i {
        color: white;
        padding-left: 4px;
    }

    .align-right-button {
        display: flex;
        justify-content: right;
    }

    .right button:hover {
        background-color: rgb(45, 76, 83);
    }

    .charge {
        text-align: center;
        width: 100% !important;
        margin-top: 0px !important;
    }


    .charge span {
        color: #0e0d0d85;
        font-size: 15px;
        letter-spacing: 2px;
        padding-left: 2px;
        font-weight: 400;
    }

  

    /*--------------DISCOVER TODAY----------------------*/

    .slider {
        padding: 0;
        margin: 0;
        width: 1250px;
        margin: auto;
        margin-top: 80px;
    }

    .slider .heading h3 {
        font-size: 25px;
        letter-spacing: 2px;
        color: rgb(45, 76, 83);
        margin-bottom: 25px;
    }

    .main {
        width: 100%;
        margin: 10px auto;
        position: relative;
    }

    .main .icon-head {
        height: 20px;
        margin: 0 auto;
        align-items: center;
        display: flex;
        justify-content: right;
        margin-bottom: 20px;
    }

    .icon-head p span {
        font-size: 20px;
        margin: 0 5px;
        cursor: pointer;
        color: white;
        width: 30px;
        height: 30px;
        display: inline-block;
        line-height: 19px;
        text-align: center;
        border-radius: 3px;
        background-color: #276BAE;
        padding-top: 3px;
    }

    .details p {
        margin-top: 0px !important;
        margin-bottom: 15px !important;
    }

    .icon-head p span:hover {
        background-color: #222;
        color: white;
    }

    .sec {
        width: 100%;
        margin: auto;
        display: flex;
        align-items: center;
        overflow-x: auto;
        overflow: hidden;
    }

    .sec::-webkit-scrollbar {
        display: none;
    }

    .product {
        min-width: 24.2%;
        height: 80%;
        max-width: 0 20px 0 0;
        position: relative;
        left: 0;
        transition: 0.5s;
        margin-right: 10px;
        overflow: hidden;
        border-radius: 2px;
        border: 1px solid rgb(218, 217, 217);
    }

    picture {
        width: 100%;
        height: 70%;
        padding: 5px;
        display: flex;
        overflow: hidden;
        margin-bottom: 9px;
        margin-top: 9px;
    }

    picture img {
        width: 100%;
        object-fit: cover;
    }

    .detail,
    .button {
        width: 100%;
        margin: auto;
        padding: 5px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        height: 50px;
        font-size: 20px;
        color: #276BAE;
        justify-content: center;
    }

    .button {
        padding-bottom: 30px;
        font-weight: bold;
    }

    .button a {
        text-decoration: none;
        padding: 6px 14px;
        font-size: 18px;
        margin: 5px 0 0 0px;
        display: inline-block;
        background: #276BAE;
        color: aliceblue;
        width: auto;
        transition: all 0.3s ease-out;
        border-radius: 20px;
        letter-spacing: 1px;
        font-weight: normal;
    }

    .button a:hover {
        background-color: #0A3967;
    }

    .details p.star {
        margin: 5px auto;
        width: 65%;
        font-size: 20px;
        color: #276BAE;
        padding-left: 20px;
    }

    .details {
        font-size: 24px;
        color: #222;
        letter-spacing: 1px;
        text-align: center;
    }

    .details span {
        letter-spacing: 4px;
        font-size: 15px;
        color: #719ECE;
    }

    .star {
        padding-top: 20px;
    }

    @media(max-width:768px) {
        .text h1 {
            font-size: 35px;
        }

        .text p {
            width: 90%;
        }

        .heading h1 {
            font-size: 25px;
        }

        .sec .product {
            min-width: 52%;
            margin: 0 10px 0 0;
        }

        .details,
        button {
            font-size: 16px;
        }

        a {
            padding: 6px 10px;
        }
    }

    /*-------HOTEL DISCOVER TODAY---------*/

    .disc-slider {
        top: 20%;
        left: 20%;
        width: 350px;
        height: 210px;
        border-radius: 5px;
        overflow: hidden;
        margin-left: 20px;
        margin-bottom: 20px;
        cursor: pointer;
    }

    .img-cont img {
        height: 100%;
        width: 100%;
        object-fit: cover;
        opacity: 0.4;
    }

    .img-cont {
        position: relative;
        text-align: center;
        color: white;
        background-color: rgb(0, 0, 0);
    }

    .centered {
        position: absolute;
        top: 55%;
        left: 50%;
        transform: translate(-50%, 50%);
        font-family: 'Nunito Sans', sans-serif;
        font-size: 16px;
        font-weight: bolder;
    }

    .centered2 {
        position: absolute;
        top: 65%;
        left: 50%;
        transform: translate(-50%, 50%);
        font-family: 'Nunito Sans', sans-serif;
        font-size: 25px;
        font-weight: bolder;
        letter-spacing: 2px;
    }

    .slid {
        display: inline-flex;
        overflow: hidden;
    }

    /************APP BANNER***************/

    .whole-background {
        /* background-image: url(../images/app-background.jpg); */
        background-image: radial-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), url(../images/app-background.jpg);

        position: relative;
        margin-top: 60px;
        background-repeat: no-repeat;
        margin-bottom: 20px;

    }

    .banner-apps {
        width: 100%;
        display: inline-flex;
        padding-top: 40px;
        padding-bottom: 40px;
    }

    .app-img {
        width: 40%;
        display: flex;
        justify-content: left;
    }

    .po-abso h3 {
        color: white;
        font-weight: bold;
        font-size: 30px;
        margin-top: 5px;
        margin-bottom: 5px;
    }


    .store {
        width: 60%;
        text-align: center;
    }

    .po-abso {
        margin-top: 70px;
    }

    .po-abso p {
        color: white;
        line-height: 25px;
        font-size: 19px;
    }

    .whole-image-app img {
        height: 60px !important;
        margin-top: 20px;

        cursor: pointer;
    }


    .app-images {
        display: flex;
        width: 100%;
        justify-content: center;
    }

    .qr-scanner-mobile {
        margin-left: 20px;


    }

    .qr-scanner-mobile img {
        width: 135px;
        border-radius: 10px;
        margin-top: 25px;
    }



    .app-img img {
        height: 400px;
    }


    /*register and login*/
    .register-background {

        position: relative;
    }

    .register-background img {
        width: 100%;
    }

    .position-absolute-right {
        position: absolute;
        right: 20%;
        top: 25%;
    }

    .position-absolute-right h3 {
        font-size: 30px;
        margin-bottom: 0px;
        color: white;
    }

    .position-absolute-right p {
        font-weight: bold;
        color: white;
        margin-top: 10px;
    }

    .position-absolute-right button {
        border: 2px solid white;
        background: none;
        padding: 10px;
        color: white;
        font-weight: bold;
        cursor: pointer;
        border-radius: 5px;
        transition: 0.5s;
    }

    .position-absolute-right button:hover {
        background-color: white;
        color: #256baf;
    }

    .left-align {
        margin-left: 10px;
    }

    /*register and login ends here*/

    /**********APP BANNER ENDS HERE******/
    /*footer*/

    .container-fot {
        width: 1250px;
        margin: auto;
    }

    .row-fot {
        display: flex;
        flex-wrap: wrap;
        margin-bottom: 20px;
    }

    .footer-col ul {
        list-style: none;
    }

    .footer {
        /* background:url(../images/footer-background.jpg)  rgb(46, 45, 45) ; */
        background-image: radial-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('../images/foot-image.jpg');
        padding: 45px 0;
    }

    .footer-col {
        width: 25%;
        padding: 0 15px;
    }

    .footer-col h4 {
        font-size: 18px;
        /* color: #ffffff; */
        color: white;
        text-transform: capitalize;
        margin-bottom: 35px;
        font-weight: 500;
        position: relative;
    }

    .footer-col h4::before {
        content: '';
        position: absolute;
        left: 0;
        bottom: -10px;
        background-color: white;
        height: 2px;
        box-sizing: border-box;
        width: 50px;
    }

    .footer-col ul li:not(:last-child) {
        margin-bottom: 10px;
    }

    .footer-col ul li a {
        font-size: 16px;
        text-transform: capitalize;
        color: whitesmoke;
        /* color: #ffffff; */
        text-decoration: none;
        font-weight: 300;
        /* color: #bbbbbb; */
        display: block;
        transition: all 0.3s ease;
    }

    .footer-col ul li a:hover {
        color: #276BAE;
        padding-left: 8px;
    }

    .footer-col .social-links a {
        display: inline-block;
        height: 40px;
        width: 40px;
        background-color: rgba(255, 255, 255, 0.2);
        margin: 0 10px 10px 0;
        text-align: center;
        line-height: 40px;
        border-radius: 50%;
        color: #ffffff;
        transition: all 0.5s ease;
    }

    .footer-col .social-links a:hover {
        color: white;
        background-color: #276BAE;
    }

    .all-right {
        width: 1250px;
        text-align: center;
        border-top: 0.5px solid white;
        margin: auto;
    }

    .all-right h4 {
        font-weight: 500;
        letter-spacing: 1px;
        padding-top: 15px;
        color: white;
    }

    .all-right h4 a {
        color: white;
        text-decoration: none;
        transition: 0.3s all ease;
    }

    .all-right h4 a:hover {
        color: aqua;
    }

    .payment-footer {
        width: 100%;
        display: inline-flex;
        gap: 10px;
    }

    .box-none {
        box-shadow: none !important;
        margin-top: 15px;
    }

    /*responsive*/

    @media(max-width: 767px) {
        .footer-col {
            width: 50%;
            margin-bottom: 30px;
        }

        .all-right {
            margin-left: 0px;
            width: 100%
        }
    }

    @media(max-width: 574px) {
        .footer-col {
            width: 100%;
        }
    }

    /*purchase page starts here*/

    .form-image {
        width: 1250px;
        padding-top: 20px;
        display: flex;
        padding-bottom: 20px;
        margin: auto;
    }

    .image-side {
        width: 34%;
    }

    .form-side {
        width: 65%;
        margin-left: 30px;
    }

    .form-side h2 {
        margin-bottom: 0px;
        color: #282828;
    }

    .form-image-container {
        width: 100%;
    }

    .image-hotels {
        width: 100%;
        border: 1px solid rgb(224, 222, 222);
    }

    .hotel-img-container {
        max-width: 100%;
        width: 100%;
        height: 35vh;
        object-fit: cover;
        background-position: center center;
        background-repeat: no-repeat;
        position: relative;
    }

    .position-relative {
        position: relative !important;
    }

    p.guest {
        padding-top: 10px !important;
    }

    .room-detail h4 {
        font-size: 20px;
        letter-spacing: 1px;
        text-transform: uppercase;
        color: #282828;
        padding-left: 20px;
        padding-right: 20px;
        line-height: normal !important;
        padding-bottom: 20px;
        border-bottom: 1px solid rgb(189, 188, 188);
        border-bottom-style: dashed;
        margin-bottom: 10px;
    }

    .room-detail h4 small {
        color: #7a7a7a;
        font-size: 12px;
    }

    .roomno-details {
        width: 100%;
        padding-left: 20px;
        padding-right: 20px;
        display: flex;
        border-bottom: 1px solid rgb(189, 188, 188);
        border-bottom-style: dashed;
        padding-bottom: 10px;
    }

    .roomno-details h5 {
        text-transform: uppercase;
        font-size: 15px;
        color: #282828;
        line-height: normal !important;
        font-weight: bolder;
        margin-bottom: 10px;
        margin-top: 10px;
    }

    .roomno-details p {
        font-size: 13px;
        line-height: normal !important;
        font-weight: bold;
        letter-spacing: 1px;
        color: #7A7C7E;
        margin-bottom: 5px;
        margin-top: 5px;
    }

    .room-half {
        width: 50%;
    }

    .mar-lef {
        margin-left: 40px;
    }

    .roomno-details:last-child {
        border-bottom: none;
    }

    .fill-up-form {
        border: 1px solid rgb(224, 222, 222);
        line-height: none;
        padding-left: 20px;
        padding-right: 20px;
        padding-bottom: 20px;
        border-radius: 3px;
    }

    .error-payment {
        margin-top: 10px;
        padding-top: 10px;
        padding-bottom: 10px !important;
        position: relative;
    }

    .sucess-payment {
        margin-top: 10px;
        padding-top: 10px;
        padding-bottom: 10px !important;
        position: relative;
    }

    .cross-button {
        position: absolute;
        right: 10px;
        top: 10px;
        cursor: pointer;
    }

    .cross-button i {
        color: rgb(216, 31, 31) !important;
        font-size: 20px;
    }

    .error-payment h3 {
        color: rgb(216, 31, 31) !important;
    }

    .sucess-payment h3 {
        color: rgb(9, 172, 9) !important;
    }

    .sucess-payment p {
        line-height: 29px;
        text-align: justify;
        font-weight: 300 !important;
    }

    .goto-link {
        display: inline-flex;
        width: 100%;
        margin-top: 10px;
    }

    .goto-link a i {
        font-size: 16px !important;
        padding-right: 5px;
    }

    .goto-link a {
        text-decoration: none;
        font-weight: 700;
        color: #276BAE;
    }

    .goto-profile {
        width: 50%;
    }

    .goto-home {
        width: 50%;
    }

    .goto-profile a {
        float: right;
    }

    .fill-up-payment {
        width: 100%;
    }

    .cancle {
        border: 1px solid rgb(224, 222, 222);
        background-color: #f5f7fb;
        line-height: none;
        padding-left: 20px;
        padding-right: 20px;
        padding-bottom: 20px;
        border-radius: 3px;
        margin-top: 20px;
    }

    .cancle h3 {
        color: #7a7a7a;
    }

    .cancle p {
        color: #276BAE;
        font-weight: bolder;
        letter-spacing: 1px;
    }

    .fill-up-form h3 {
        letter-spacing: 1px;
        color: #282828;
        letter-spacing: 1px;
    }

    div.input-block {
        position: relative;
    }

    div.input-block input {
        font-size: 16px;
        padding: 15px 15px;
        border-radius: 5px;
        border: 1px solid #838282;
        outline: none;
        font-family: "Roboto", sans-serif;
        font-weight: normal;
        margin-top: 20px;
        width: 94%;
    }

    div.input-block span.placeholder {
        position: absolute;
        margin: 17px 0;
        padding: 0 2px;
        display: flex;
        align-items: center;
        font-size: 13px;
        top: 9px;
        left: 8px;
        transition: all 0.2s;
        transform-origin: 0% 0%;
        background: none;
        pointer-events: none;
        color: rgb(155, 151, 151);
        font-family: "Roboto", sans-serif;
        font-weight: none;
    }

    div.input-block span.payment-placeholder {
        margin: 30px 0 !important;
        color: #838282;
    }

    div.input-block input:valid+span.placeholder,
    div.input-block input:focus+span.placeholder {
        transform: scale(0.9) translateY(-30px);
        background: #fff;
        letter-spacing: 1px;
    }

    div.input-block input:not(:placeholder-shown)~label,
    div.input-block input:-webkit-autofill~label {
        transform: scale(0.9) translateY(-40px);
        /* background: #fff; */
        color: #276BAE;
        letter-spacing: 1px;
    }

    .input-block {
        margin-top: 10px;
        width: 43%;
    }

    .fill-up-input {
        display: inline-flex;
        width: 120%;
    }

    .radio-button span {
        display: inline-flex;
        width: 100%;
    }

    .radio-button input {
        cursor: pointer;
    }

    .radio-button label {
        cursor: pointer;
    }

    .radio-button label img {
        object-fit: contain;
        width: 150px;
        margin-left: 20px;
    }



    .form-next {
        margin-top: 20px;
    }

    .pay-at-hotel input {
        width: auto !important;
    }

    .pay-through-esewa input {
        background-color: #60bb46 !important;
        color: white !important;
        width: auto !important;
    }

    .pay-through-khalti input {
        background-color: #4d286d !important;
        color: white !important;
        width: auto !important;
    }

    #esewa {
        display: none;
    }

    #hotel {
        display: none;
    }

    #khalti {
        display: none;
    }

    #khalti-payment-display {
        display: none;
    }

    .form-next input {
        background-color: #276BAE;
        border: none;
        color: white;
        padding: 8px;
        width: 100px;
        font-size: 17px;
        cursor: pointer;
        border-radius: 4px;
        transition: 0.3s;
    }

    .form-next input:hover {
        background-color: rgb(6, 109, 134);
        ;
    }

    .otpinput input {
        width: 13%;
        padding: 10px;
        border: 1px solid rgb(231, 228, 228);
        margin-left: 15px;
        border-radius: 8px;
        text-align: center;
        font-size: 17px;
    }

    .otpinput input:first-child {
        margin-left: 0px;
    }

    .otpinput input::placeholder {
        padding-left: 20px;
    }

    .fill-up-form p {
        font-weight: bolder;
        color: rgb(161, 161, 161);
        margin-top: -10px;
    }

    .radio-buttons .radio-button {
        margin-top: 30px;
    }

    .radio-buttons .radio-button:last-child {
        margin-top: 10px;
    }

    /*bill display*/

    .bill-display {
        max-width: 100% !important;
        margin: 0px 80px;
        display: flex;
    }

    .bill-receipt {
        max-width: 100% !important;
        margin: 0px 65px;
        border: 1px solid rgb(173, 173, 173);
        padding: 20px;
        padding-top: 0px;
        border-radius: 6px;
        padding-bottom: 0px;
    }

    .bill-display h2 {
        letter-spacing: 1px;
    }

    .bill-head1 {
        width: 50% !important;
    }

    .bill-head2 {
        width: 50% !important;
    }

    .bill-head2 button {
        float: right;
        margin-top: 40px;
        padding: 8px;
        font-size: 16px;
        width: 100px;
        border: none;
        background-color: #276BAE;
        color: white;
        border-radius: 6px;
        cursor: pointer;
        height: 40px;
    }

    .bill-head2 button:last-child {
        margin-right: 10px;
    }

    .bill-receipt {
        font-size: 18px;
        padding-bottom: 20px;
        line-height: 0px;
    }

    .bill-receipt span {
        color: #276BAE;
    }

    .bill-receipt h5 {
        border-bottom: 1px solid rgb(189, 188, 188);
        border-bottom-style: dashed;
        padding-bottom: 20px;
    }

    .bill-receipt h5:first-child {
        border-bottom: none;
        padding-bottom: 0px;
    }

    .bill-rec-img .img-bill img {
        height: 150px;
        width: 200px;
        border-radius: 6px;
    }

    .bill-hotel-disc {
        margin-left: 40px;
    }

    .bill-rec-img {
        width: 100%;
        display: inline-flex;
        border-bottom: 1px solid rgb(189, 188, 188);
        border-bottom-style: dashed;
        padding-bottom: 10px;
    }

    .bill-hotel-disc {
        font-size: 16px;
        line-height: 0px;
    }

    .bill-hotel-disc i.location {
        padding-right: 10px;
    }

    .gold {
        color: rgb(238, 205, 22);
    }

    .grey {
        color: rgb(97, 96, 96);
    }

    .checked-in-out {
        width: 100%;
        display: inline-flex;
        border-bottom: 1px solid rgb(189, 188, 188);
        border-bottom-style: dashed;
        padding-bottom: 10px;
    }

    .checked-in-out h5 {
        color: #276BAE;
    }

    .checked-in-out p {
        font-size: 14px;
    }

    .check-out {
        padding-top: 5px;
    }

    .room {
        padding-top: 5px;
    }

    .in-out {
        width: 30%;
    }

    .stay-room {
        width: 30%;
    }

    .booked-phone {
        padding-top: 5px;
    }

    .amount-line {
        border-bottom: 1px solid rgb(179, 175, 175);
    }

    .goto-cancel {
        max-width: 100%;
        padding-top: 10px;
        padding-bottom: 20px;
    }

    .goto-cancel button {
        float: right;
        margin-right: 15px;
        padding: 8px;
        font-size: 16px;
        border: none;
        background-color: #276BAE;
        color: white;
        border-radius: 6px;
        cursor: pointer;
    }

    button.cancle-booking {
        background-color: red;
    }

    .esewa-valid-info p {
        padding-top: 5px;
        font-weight: 300;
    }

    .esewa-valid-info p:first-child {
        padding-top: 0px;
    }

    .esewa-info-form input {
        width: 100%;
        height: 45px;
        padding-left: 20px;
        border: 1px solid rgb(175, 175, 175);
        font-size: 16px;
        border-radius: 4px;
    }

    input:focus {
        outline: none !important;
    }

    .checkinout {
        width: 100%;
        display: inline-flex;
        margin-bottom: 20px;
    }

    ::-webkit-calendar-picker-indicator {
        background-color: #ffffff;
        padding: 5px;
        cursor: pointer;
        border-radius: 3px;
    }

    input[type="date"] {
        padding: 15px;
        font-size: 12px;
        border: none;
        outline: none;
        border-radius: 5px;
        border: 1px solid #838282;
        color: #838282;
    }

    .checkinout p {
        padding-left: 15px;
        padding-top: 20px;
        padding-right: 15px;
    }

    .errortext {
        width: 100%;
        margin-left: 42px;
        font-size: 15px;
        margin-top: 5px;
        margin-bottom: 5px;
        color: red;
        height: 25px;
        display: none;
    }

    .margin-errortext {
        margin-bottom: 60px !important;
        /* display: block; */
    }

    /*combobox*/

    .select-box-combo {
        display: flex;
        width: auto;
        flex-direction: column;
    }

    .select-box-combo .options-containercombo {
        color: white;
        max-height: 0;
        opacity: 0;
        transition: all 0.4s;
        border-radius: 5px;
        overflow: hidden;
        order: 1;
        /* box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; */
        position: absolute;
        z-index: 20000;
        top: 70px;
        right: auto;
        width: 150px;
        background-color: #276BAE;
    }

    .selected {
        border-radius: 5px;
        color: #276BAE;
        position: relative;
        order: 0;
        font-weight: bolder;
    }

    .selected::after {
        content: "";
        background: url("../images/arrow-down.png");
        background-size: contain;
        background-repeat: no-repeat;
        position: absolute;
        height: 100%;
        width: 23px;
        transition: all 0.4s;
        margin-left: 10px;
    }

    .select-box-combo .options-containercombo.active2 {
        max-height: 240px;
        opacity: 1;
    }

    .select-box-combo .options-containercombo.active2+.selected::after {
        transform: rotateX(180deg);
        top: -11px;
    }

    .select-box-combo .options-containercombo::-webkit-scrollbar {
        width: 8px;
        background: #0d141f;
        border-radius: 0 8px 8px 0;
    }

    .select-box-combo .options-containercombo::-webkit-scrollbar-thumb {
        background: #525861;
        border-radius: 0 8px 8px 0;
    }

    .select-box-combo .option,
    .selected {
        padding: 12px 15px;
        cursor: pointer;
    }

    .select-box-combo .option:hover {
        background-color: rgb(4, 89, 110);
    }

    .select-box-combo label {
        cursor: pointer;
    }

    .select-box-combo .option .radio {
        display: none;
    }

    /*onclick payment*/

    .onlick-payment-esewa {
        margin-left: 40px;
        display: none;
    }

    .onlick-payment-khalti {
        margin-left: 40px;
    }

    #sos {
        display: none;
    }

    .block-full input {
        width: 95% !important;
    }

    /*data not found*/

    #notfound {
        position: relative;
        height: 50vh;
        margin-top: 80px;
    }

    #notfound .notfound {
        position: absolute;
        left: 50%;
        top: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    .notfound {
        max-width: 520px;
        width: 100%;
        line-height: 1.4;
        text-align: center;
    }

    .notfound .notfound-404 {
        position: relative;
        height: 240px;
    }

    .notfound .notfound-404 h1 {
        font-family: 'Montserrat Alternates', sans-serif;
        font-size: 252px;
        font-weight: 900;
        margin: 0px;
        color: #4e4e4e;
        text-transform: uppercase;
        letter-spacing: -40px;
        margin-left: -20px;
        margin-top: -70px;
    }

    .notfound .notfound-404 h1>span {
        text-shadow: -8px 0px 0px #fff;
    }

    .notfound .notfound-404 h3 {
        font-family: 'Cabin', sans-serif;
        position: relative;
        font-size: 16px;
        font-weight: 700;
        text-transform: uppercase;
        color: #747272;
        margin: 0px;
        letter-spacing: 3px;
        padding-left: 6px;
    }

    .notfound h2 {
        font-family: 'Cabin', sans-serif;
        font-size: 20px;
        font-weight: 400;
        text-transform: uppercase;
        color: #4e4e4e;
        margin-top: 30px !important;
    }

    /*data not found ends*/

    .loader-frame {
        width: 100%;
        height: 90vh;
        margin-left: 35px;
        place-items: center;
        position: relative;
        z-index: 99999;

    }

    .loader1 {
        pointer-events: none;
        width: 120px;
        height: 120px;
        border-radius: 50%;
        border: 10px solid transparent;
        border-top-color: #256baf;
        margin: auto;
        left: 0;
        right: 0;
        top: 0;
        bottom: 20%;
        position: absolute;
        animation: an2 2s ease infinite;
        padding: 10px;
    }

    .loader1 img {
        width: 100%;
        height: 100%;
        animation: spinlogo 2s ease infinite;
    }

    .next-payment {
        position: relative;
        width: 15%;
        background: #276BAE;
        padding: 12px;
        border: none;
        outline: none;
        box-shadow: none;
        font-size: 16px;
        letter-spacing: 1px;
        font-weight: 300;
        border-radius: 4px;
        text-align: center;
        transition: 0.5s;
        cursor: pointer;
        margin-top: 10px;
    }

    .next-payment i {
        margin-left: 10px;
        margin-top: 5px;
    }

    .next-payment:hover {
        background-color: #0A3967;
    }

    .next-payment a {
        color: #fff;
        text-decoration: none;
        display: inline-flex;
    }

    .next-payment a span {
        font-size: 17px;
        font-weight: bold;
    }

    .loader-login {
        pointer-events: none;
        width: 21px;
        height: 21px;
        border-radius: 50%;
        border: 3px solid transparent;
        border-top-color: white;
        margin-left: 10px;
        bottom: 20%;
        animation: an3 2s ease infinite;
    }

    .quick-links {
        display: flex;
        flex-wrap: wrap;
        background-color: white;
        width: 600px;
        padding: 10px;
        border-radius: 50px;
        box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
        gap: 5px;
    }

    .whole-wrap-links {
        display: flex;
        justify-content: center;
    }


    .link-box {
        width: 24%;
        text-align: center;
        cursor: pointer;
    }

    .active1 {
        filter: invert(33%) sepia(22%) saturate(2985%) hue-rotate(180deg) brightness(101%) contrast(85%);
    }

    .active1:hover img,
    .active1:hover p {
        filter: none !important;
    }

    .link-box:hover img,
    .link-box:hover p {
        filter: invert(33%) sepia(22%) saturate(2985%) hue-rotate(180deg) brightness(101%) contrast(85%);
    }

    .link-box:first-child {
        border-left: transparent;
    }

    .link-titles p {
        margin-bottom: 0px;
        margin-top: 0px;
        font-weight: 600;
        transition: 0.5s;
    }

    .link-icons img {
        height: 25px;
        margin-bottom: 3px;
        transition: 0.5s;
    }

    .link-titles {
        font-size: 14px;
    }

    @keyframes an3 {
        0% {
            transform: rotate(0turn);
        }

        100% {
            transform: rotate(1turn);
        }
    }

    @keyframes an2 {
        0% {
            transform: rotate(0turn);
        }

        100% {
            transform: rotate(1turn);
        }
    }


    @keyframes spinlogo {
        0% {
            transform: rotate(1turn);
        }

        100% {
            transform: rotate(0turn);
        }
    }

    /*snack bar*/

    #snackbar {
        visibility: hidden;
        min-width: 250px;
        margin-left: -125px;
        background-color: #276BAE;
        color: #fff;
        text-align: center;
        border-radius: 2px;
        padding: 16px;
        position: fixed;
        z-index: 1;
        right: 10%;
        top: 30px;
        font-size: 17px;
    }

    #snackbar.show {
        visibility: visible;
        -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
        animation: fadein 0.5s, fadeout 0.5s 2.5s;
    }

    /*autosearch*/
    /*skeleton Loader*/

    .loader-card {
        width: 23.7%;
        background: #fff;
        border-radius: 5px;
        box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    }

    .loader-card .skeleton-loader-image img {
        max-width: 100%;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
    }

    .loader-card .skeleton-content {
        padding: 20px 30px;
    }

    .loader-card.is-loading .skeleton-loader-image,
    .loader-card.is-loading h2,
    .loader-card.is-loading p {
        background: #eee;
        background: linear-gradient(110deg, #ececec 8%, #f5f5f5 18%, #ececec 33%);
        border-radius: 5px;
        background-size: 200% 100%;
        -webkit-animation: 1.5s shine linear infinite;
        animation: 1.5s shine linear infinite;
    }

    .loader-card.is-loading .skeleton-loader-image {
        height: 26vh;
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }

    .loader-card.is-loading h2 {
        height: 30px;
    }

    .loader-card.is-loading p {
        height: 70px;
    }

    @-webkit-keyframes shine {
        to {
            background-position-x: -200%;
        }
    }

    @keyframes shine {
        to {
            background-position-x: -200%;
        }
    }

    /*skeleton Loader Ends Here*/

    @-webkit-keyframes fadein {
        from {
            top: 0;
            opacity: 0;
        }

        to {
            top: 30px;
            opacity: 1;
        }
    }

    @keyframes fadein {
        from {
            top: 0;
            opacity: 0;
        }

        to {
            top: 30px;
            opacity: 1;
        }
    }

    @-webkit-keyframes fadeout {
        from {
            top: 30px;
            opacity: 1;
        }

        to {
            top: 0;
            opacity: 0;
        }
    }

    @keyframes fadeout {
        from {
            top: 30px;
            opacity: 1;
        }

        to {
            top: 0;
            opacity: 0;
        }
    }


    /*top container*/

    .heading-containers {
        display: inline-flex;
    }

    .desc-containers {
        padding-right: 35px;
        width: 33.33%;
    }

    .desc-containers p {
        font-size: 15px;
        color: #424242;
        margin-bottom: 0px;
        line-height: 30px;
        text-align: center;
        padding: 20px;
        margin-top: 0px;

    }

    .desc-img img {
        height: 200px;
    }

    .desc-img {
        display: flex;
        justify-content: center;
        margin-bottom: 30px;
    }

    .desc-para h3 {
        margin-bottom: 0px;
        text-align: center;
        color: #424242;
    }

    /*top container ends here*/

    /*rating box*/

    .rating-box{
        background: #276BAE;
  border-radius: 11px 0 11px 11px;
  padding: 2px 6px;
  width: 70px!important;
    }

    .rating-box p{
        color: rgb(230, 229, 229);
    }

.rating-box p span{
    font-size: 15px;
    color: white;
    padding-right: 2px;
    font-weight: bold;
}


p.all-reviews{
    font-weight: bold;
    margin-top: 5px;
    color: #256baf;
    width: 55%;
    margin-left: 10px;
    font-size: 11px;
    
}

.inline-flex-desc{
    display: flex;
}

.inline-flex-desc .rating{
    width: 100%;
}

p.all-reviews span{
    color: grey;
    font-size: 15px!important;
}

.first-span{
    margin-left: 20px;
}

    /*rating box*/


    @media screen and (min-width: 1600px) {
        .header {
            width: 1500px;
        }

        .top-banner-whole {
            width: 1500px;
        }

        .container1 {
            width: 1500px;
        }

        .offer .heading {
            width: 1500px;
        }

        .container-fot {
            width: 1500px;
        }

        .all-right {
            width: 1500px;
        }

        .left img {
            height: 26vh;
        }

        .content2 {
            width: 24%;
        }

        .loader-card {
            width: 24%;
        }

        .form-absolute {
            top: 50%;
        }

        .banner {
            height: 50vh;
        }

        .slider {
            width: 1500px;
        }

        .form-image {
            width: 1500px;
        }

        .top-desc-container {
            width: 1500px;
        }

    }

    @media(max-width:1280px) {

        .header,
        .container1,
        .offer .heading,
        .slider,
        .container-fot,
        .all-right,
        .form-image,
        .another-form,
        .search-results {
            width: 90% !important;
            margin: 0 auto;
        }

        .top-banner-whole {
            width: 90%;
        }

        .results {
            width: 68%;
        }

        .whole-results {
            gap: 16px !important;
        }

        .content2,
        .loader-card {
            width: 23.6%;
        }

        .left img {
            height: 27vh;
        }

        .right button {
            width: auto;
            padding-left: 10px;
            padding-right: 10px;
            font-size: 13px;
        }

        .charge span {
            font-size: 15px;
        }

        .charge i {
            font-size: 15px;
        }
    }

    @media(max-width:1190px) {

        .content2,
        .loader-card {
            width: 23.5%;
        }
    }

    @media(max-width:1116px) {

        .content2,
        .loader-card {
            width: 31.8%;
        }

        .whole-results {
            gap: 14px !important;
        }
    }

    @media(max-width:966px) {

        .content2,
        .loader-card {
            width: 31.6%;
        }

        .button-view button {
            font-size: 13px;
        }

        .button-view button i {
            font-size: 12spx;
        }
    }

    @media(max-width:858px) {

        .content2,
        .loader-card {
            width: 31.4%;
        }

        .banner {
            height: 60vh;
        }

        .form-inline {
            display: block;
        }

        .input-container {
            margin-left: 0px;
            margin-top: 10px;
            width: 100%;
        }

        .input-search {
            width: 100% !important;
        }

        .po-abso p {
            font-size: 15px;
        }

        .app-img img {
            height: 318px;
        }

        .po-abso h3 {
            font-size: 25px;
        }

        .form input,
        .input-container .custom-select select,
        .form button {
            height: 54px;
        }

        .custom-select::after {
            top: 26px;
        }

        .input-searchcombo .fa-xmark {
            font-size: 20px !important;
        }

        .form-image {
            display: block;
        }

        .image-side {
            width: 100%;
            display: flex;
            justify-content: center;
        }

        .form-image-container {
            width: 75%;
        }

        .form-side {
            margin-left: auto;
            margin-right: auto;
            margin-top: 15px;
            width: 75%;
        }
    }

    @media(max-width:800px) {

        .content2,
        .loader-card {
            width: 48.3%;
        }
    }

    @media(max-width:700px) {
        .app-img {
            display: none;
        }

        .store {
            width: 100%;
        }

        .po-abso {
            margin-top: 22px;
        }
    }

    @media(max-width:670px) {
        .quick-links {
            width: 477px;
        }

        .link-icons img {
            height: 20px;
        }

        .link-titles p {
            font-size: 13px;
        }
    }

    @media(max-width:653px) {

        .content2,
        .loader-card {
            width: 48%;
        }

        .heading h5 {
            font-size: 20px;
            height: 26px;
        }
    }

    @media(max-width:584px) {
        .form-image-container {
            width: 100%;
        }

        .form-side {
            width: 100%;
        }
    }

    @media(max-width:555px) {

        .content2,
        .loader-card {
            width: 47.5%;
        }

        ul button.join {
            display: none;
        }

        .logo a {
            padding: 0px 0px;
        }

        .logo img {
            height: 40px;
        }

        .nav ul {
            margin-top: 8px;
        }

        .nav .selected {
            font-size: 15px;
            padding: 9px 15px;
        }

        .nav .selected::after {
            width: 17px;
            margin-left: 5px;
        }

        .profile button {
            font-size: 12px !important;
            width: 33px !important;
            height: 33px;
            margin-top: 3px;
        }

        .footer-col a {
            padding-left: 0px;
        }

        .view-all p {
            display: none;
        }

        .icon-head {
            width: 100% !important;
        }

    }

    @media(max-width:500px) {
        .quick-links {
            width: 100%;
            gap: 0px;
            justify-content: center;
            border-radius: 5px;
        }

        .link-icons img {
            height: 18px;
        }

        .link-titles p {
            font-size: 10px;
        }

        .link-box {
            overflow-y: auto;
        }

        .content2,
        .loader-card {
            width: 100%;
            margin-top: 20px;
        }
    }

    @media(max-width:440px) {
        .heading h5 {
            font-size: 17px;
            height: 23px;
        }

        .app-images img {
            margin-top: 0px;
            height: 47px !important;
        }
    }


    @media(max-width:390px) {
        .logo {
            width: 30%;
        }

        .nav {
            width: 70%;
        }

        .logo img {
            height: 35px;
        }

        .img-pop-column {
            width: 48% !important;
        }
    }

    @media(max-width:326px) {
        .app-images img {
            margin-left: 0px;
        }
    }