/*******banner******/

@media (max-width: 1024px) {
    .banner-section .search-form {
        flex-wrap: wrap;
    }
    
    .banner-section .form-group {
        min-width: 45%;
    }

    #jobs.jobs .job-grid {
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    }

    .blogs-sections .blog-grid {
        grid-template-columns: repeat(1, 1fr);
    }
    .job-content .content-grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    .job-content .sidebar {
        order: -1;
    }
}

@media (max-width: 992px) {
    .service-detail {
        flex-direction: column;
    }
    
    .service-sidebar {
        position: static;
        width: 100%;
    }
}

@media (max-width: 968px) {
    .signin-column {
        flex-direction: column;
    }
    
    .signin-section .branding {
        flex: none;
        min-height: 40vh;
        padding: 2rem;
    }
    
    .signin-section .branding-content {
        max-width: 100%;
    }
    
    .signin-section .logo {
        font-size: 2rem;
    }
    
    .signin-section .tagline {
        font-size: 1.2rem;
    }
    
    .signin-section .trust-indicators {
        gap: 1.5rem;
    }
    
    .signin-section .login-container {
        flex: none;
        min-height: 60vh;
    }
    
    .signin-section .login-form {
        max-width: 100%;
    }
}

@media (max-width: 768px) {
    .banner-section .form-group {
        min-width: 100%;
        margin-bottom: 20px;
    }

    .container {
        flex-direction: column;
    }

    .partner-registration-section .sidebar {
        width: 100%;
        position: relative;
        height: auto;
        padding: 20px;
    }
    
    .partner-registration-section .main-content {
        padding: 20px;
    }
    
    .partner-registration-section .options-container {
        flex-direction: column;
    }
    
    .partner-registration-section .form-row {
        flex-direction: column;
        gap: 0;
    }
    
    .partner-registration-section .form-row .form-group {
        margin-bottom: 20px;
    }
    
    .partner-registration-section .review-grid {
        grid-template-columns: 1fr;
    }

    #jobs.jobs .jobs, #apply .process {
        padding: 2rem 0;
    }
    
    #jobs.jobs .section-header h2 {
        font-size: 1.75rem;
    }
    
    #jobs.jobs .section-header p {
        font-size: 1rem;
    }
    
    #jobs.jobs .job-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    #jobs.jobs .job-card {
        padding: 1.25rem;
    }
    
    #apply .timeline::before {
        left: 1.5rem;
    }
    
    #apply .timeline-number {
        width: 3rem;
        height: 3rem;
        font-size: 1rem;
    }
    
    #apply .timeline-item {
        margin-bottom: 2rem;
        gap: 1rem;
    }
    
    #apply .timeline-content h3 {
        font-size: 1.125rem;
    }
    
    #applicationModal .modal-header, #applicationModal .modal-body {
        padding: 1rem;
    }
    
    #applicationModal .form-actions {
        flex-direction: column;
    }
    
    #applicationModal .btn {
        width: 100%;
    }

    .signup-section .signup-column {
        flex-direction: column;
    }
    
    .signup-section .left-section, .right-section {
        padding: 40px 30px;
    }
    
    .signup-section .title {
        font-size: 32px;
    }
    
    .signup-section .form-title {
        font-size: 28px;
    }
    .guide-hero .hero-content {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .guide-hero .hero-stats {
        grid-template-columns: repeat(2, 1fr);
    }

    .guide-hero .hero-actions {
        justify-content: center;
    }

    .guide-details-section .tabs {
        overflow-x: scroll;
    }

    .guide-details-section .contact-grid {
        grid-template-columns: 1fr;
    }

    .guide-details-section .timeline {
        padding-left: 1rem;
    }

    .guide-details-section .timeline::before {
        left: 0;
    }

    .guide-details-section .timeline-item {
        padding-left: 1.5rem;
    }

    .guide-details-section .timeline-item::before {
        left: -0.5rem;
    }
    .service-title {
        font-size: 2rem;
    }

    .guide-list-section .cards-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .guide-list-section .card-actions {
        flex-direction: column;
    }

    #contactModal .modal-content {
        margin: 10% auto;
        width: 95%;
    }

    #contactModal .modal-body {
        padding: 20px;
    }

    /*.blogs-sections .blog-grid {
        grid-template-columns: repeat(2, 1fr);
    }*/

    /*.searchs-sections {
        margin: 1rem;
        padding: 2rem 1rem;
    }*/

    .search-container {
        padding: 1rem;
    }

    .search-button {
        width: 100%;
        justify-content: center;
    }

    .deals-sections  .deals-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    .package-detail-secton .destination-title {
        font-size: 2rem;
    }

    .package-detail-secton .destination-overlay {
        padding: 2rem;
    }

    .package-detail-secton .hotel-header {
        grid-template-columns: 1fr;
    }

    .package-detail-secton .hotel-gallery {
        height: 150px;
    }

    .package-detail-secton .guide-stats {
        gap: 1.5rem;
    }

    .package-detail-secton .stat-item {
        min-width: 100px;
    }

    .package-detail-secton .section-heading {
        font-size: 1.5rem;
    }

    .package-detail-secton .day-item {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .package-detail-secton .day-number {
        margin-bottom: 1rem;
    }

    .package-detail-secton .book-package-btn {
        padding: 1rem 2rem;
        font-size: 1.1rem;
    }
    .job-content .job-header {
        padding: 2rem 0;
    }
    
    .job-content .job-title {
        font-size: 2rem;
    }
    
    .job-content .job-meta {
        gap: 1rem;
    }
    
    .job-content .job-content {
        padding: 2rem 0;
    }
    
    .job-content .main-content, .sidebar-card {
        padding: 1.5rem;
    }
    
    .job-content .section-title {
        font-size: 1.25rem;
    }
    
    #applicationModal .modal-header, #applicationModal .modal-body {
        padding: 1rem;
    }
    
    .job-content .form-actions {
        flex-direction: column;
    }
    
    .job-content .btn {
        width: 100%;
    }
}



@media (max-width: 600px) {    
    .star-rating {
        font-size: 24px;
    }
}

@media (max-width: 480px) {
    .signin-section .branding {
        min-height: 35vh;
        padding: 1.5rem;
    }
    
    .signin-section .tagline {
        font-size: 1.1rem;
    }
    
    .signin-section .description {
        font-size: 0.9rem;
        margin-bottom: 1.5rem;
    }
    
    .signin-section .trust-indicators {
        flex-direction: column;
        gap: 0.8rem;
    }
    
    .signin-section .login-form {
        padding: 1.5rem;
    }
    
    .signin-section .login-title {
        font-size: 1.5rem;
    }
    
    .signin-section .social-login {
        flex-direction: column;
    }

    #jobs .jobs, #apply .process {
        padding: 1.5rem 0;
    }
    
    #jobs .jobs.section-header h2 {
        font-size: 1.5rem;
    }
    
    #jobs .jobs.section-header p {
        font-size: 0.875rem;
    }
    
    #jobs .jobs.job-card {
        padding: 1rem;
    }
    
    #jobs .jobs.job-title {
        font-size: 1rem;
    }
    
    #jobs .jobs.job-description {
        font-size: 0.8rem;
    }
    
    #jobs .jobs.tag {
        font-size: 0.7rem;
        padding: 0.2rem 0.6rem;
    }
    
    #jobs .jobs.job-location {
        font-size: 0.8rem;
    }
    
    #jobs .jobs.job-apply {
        font-size: 0.9rem;
    }
    
    #apply .timeline::before {
        left: 1rem;
    }
    
    #apply .timeline-number {
        width: 2.5rem;
        height: 2.5rem;
        font-size: 0.875rem;
    }
    
    #apply .timeline-item {
        margin-bottom: 1.5rem;
        gap: 0.75rem;
    }
    
    #apply .timeline-content h3 {
        font-size: 1rem;
    }
    
    #apply .timeline-content p {
        font-size: 0.8rem;
    }
    
    #apply .process-cta {
        margin-top: 2rem;
    }
    
    #jobs.jobs .btn-primary {
        padding: 0.75rem 1.5rem;
        font-size: 0.875rem;
    }
    
    #applicationModal .modal-content {
        margin: 1rem;
    }
    
    #applicationModal .modal-header {
        padding: 0.75rem;
    }
    
    #applicationModal .modal-body {
        padding: 0.75rem;
    }
    
    #applicationModal .form-group label {
        font-size: 0.8rem;
    }
    
    #applicationModal .form-control {
        padding: 0.5rem;
        font-size: 0.875rem;
    }
    
    #applicationModal .btn {
        padding: 0.625rem 1rem;
        font-size: 0.875rem;
    }
    .job-content .job-title {
        font-size: 1.5rem;
    }
    
    .job-content .job-meta {
        flex-direction: column;
        align-items: center;
        gap: 0.5rem;
    }
    
    .job-content .main-content, .job-content .sidebar-card {
        padding: 1rem;
    }
    
    .job-content .section-title {
        font-size: 1.125rem;
    }
    
    .job-content .benefit-item {
        flex-direction: column;
        text-align: center;
        gap: 0.5rem;
    }
    
    #applicationModal .modal-content {
        margin: 1rem;
    }
    
    #applicationModal .modal-header {
        padding: 0.75rem;
    }
    
    #applicationModal .modal-body {
        padding: 0.75rem;
    }
    
    #applicationModal .form-group label {
        font-size: 0.8rem;
    }
    
    #applicationModal .form-control {
        padding: 0.5rem;
        font-size: 0.875rem;
    }
    
    #applicationModal .btn {
        padding: 0.625rem 1rem;
        font-size: 0.875rem;
    }
}







/***********BOOKING PAGE**********/

@media (min-width: 768px) {
    .booking-sections .hotel-info {
        flex-direction: row;
    }
}

@media (min-width: 768px) {
    .booking-sections .hotel-image {
        width: 16rem;
        height: 12rem;
    }
}

@media (min-width: 1024px) {
    .booking-sections .booking-grid {
        grid-template-columns: 2fr 1fr;
    }
}

@media (min-width: 768px) {
    .booking-sections .form-grid {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (min-width: 768px) {
    .booking-sections .room-content {
        flex-direction: row;
    }
}

@media (min-width: 768px) {
    .booking-sections .room-image {
        width: 12rem;
        height: 8rem;
    }
}

@media (min-width: 768px) {
    .booking-sections .guest-form-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 768px) {
    .booking-sections .payment-methods {
        grid-template-columns: repeat(3, 1fr);
    }
}


@media (min-width: 1024px) {
    .booking-sections .confirmation-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (min-width: 768px) {
    .booking-sections .card-form-grid {
        grid-template-columns: 2fr 1fr;
    }
}

@media (min-width: 768px) {
    .booking-sections .steps-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (min-width: 640px) {
    .booking-sections .action-buttons {
        flex-direction: row;
    }
}



@media(max-width: 1024px){
    .banner-section .dropdown-toggle{
        overflow: hidden;
    }
    .banner-section .guests-dropdown {
        min-width: auto;
    }
    .guide-section img,
    .hotel-section .carousel-inner img,
    .mission-left img{
        height: 200px;
    }
    .discover-section ul li{
        width: 24%;
    }
    a.btn.btn-deals,
    a.btn.btn-partner{
        font-size: 14px;
    }
}


.booking-sections .booking-summary-container {
    position: fixed;
    bottom: -83px;
    left: 0;
    width: 100%;
    z-index: 1000;
}

.booking-sections .booking-summary {
    background-color: #fff;
    border-top: 1px solid #ddd;
    box-shadow: 0 -2px 10px rgba(0,0,0,0.1);
    overflow: hidden;
    transition: height 0.4s ease;
}

.booking-sections .booking-summary-header {
    padding: 15px 20px;
    background-color: #2b7fff;
    color: white;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.booking-sections .booking-summary-header h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
}

.booking-sections .toggle-icon {
    transition: transform 0.3s ease;
}

.booking-sections .booking-summary-content {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height 0.4s ease, opacity 0.4s ease, padding 0.4s ease;
    background-color: #f9f9f9;
}

.booking-sections .booking-summary.active .booking-summary-content {
    max-height: 500px;
    opacity: 1;
    padding: 20px;
}

.booking-sections .booking-summary.active .toggle-icon {
    transform: rotate(180deg);
}

.booking-sections .booking-details {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 15px;
}

.booking-sections .detail-item {
    margin-bottom: 10px;
}

.booking-sections .detail-label {
    font-size: 12px;
    color: #777;
    margin-bottom: 5px;
    text-transform: uppercase;
}

.booking-sections .detail-value {
    font-size: 14px;
    color: #333;
    font-weight: 500;
}

.booking-sections .price-summary {
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px solid #eee;
}

.booking-sections .price-row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
}

.booking-sections .price-row.total {
    font-weight: 700;
    font-size: 16px;
    color: #333;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dashed #ddd;
}

.booking-sections .book-button {
    background-color: #2b7fff;
    color: white;
    border: none;
    padding: 12px 20px;
    border-radius: 4px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    width: 100%;
    margin-top: 15px;
    transition: background-color 0.2s ease;
}

.booking-sections .book-button:hover {
    background-color: #3a5a9f;
}

.booking-sections .booking-summary-container{
    display: none;
}


@media (max-width: 991px) {
    .booking-sections .booking-summary.active .booking-summary-content {
        max-height: 625px;
        height: 500px;
    }
    .booking-sections .booking-summary-container{
        display: block;
    }
    .booking-sections .card.booking-summary{
        display: none;
    }
}

@media (max-width: 480px) {
    .booking-sections .booking-summary-header h3 {
        font-size: 14px;
    }
    
    .booking-sections .booking-details {
        grid-template-columns: 1fr;
    }
}










.hotel-details-contents .booking-summary-container {
    position: fixed;
    bottom: -3px;
    left: 0;
    width: 100%;
    z-index: 1000;
}

.hotel-details-contents .booking-summary {
    background-color: #fff;
    border-top: 1px solid #ddd;
    box-shadow: 0 -2px 10px rgba(0,0,0,0.1);
    overflow: hidden;
    transition: height 0.4s ease;
}

.hotel-details-contents .booking-summary-header {
    padding: 15px 20px;
    background-color: #2b7fff;
    color: white;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.hotel-details-contents .booking-summary-header h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
}

.hotel-details-contents .toggle-icon {
    transition: transform 0.3s ease;
}

.hotel-details-contents .booking-summary-content {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height 0.4s ease, opacity 0.4s ease, padding 0.4s ease;
    background-color: #f9f9f9;
}

.hotel-details-contents .booking-summary.active .booking-summary-content {
    max-height: 500px;
    opacity: 1;
    padding: 20px;
}

.hotel-details-contents .booking-summary.active .toggle-icon {
    transform: rotate(180deg);
}

.hotel-details-contents .booking-details {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 15px;
}

.hotel-details-contents .detail-item {
    margin-bottom: 10px;
}

.hotel-details-contents .detail-label {
    font-size: 12px;
    color: #777;
    margin-bottom: 5px;
    text-transform: uppercase;
}

.hotel-details-contents .detail-value {
    font-size: 14px;
    color: #333;
    font-weight: 500;
}

.hotel-details-contents .price-summary {
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px solid #eee;
}

.hotel-details-contents .price-row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
}

.hotel-details-contents .price-row.total {
    font-weight: 700;
    font-size: 16px;
    color: #333;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dashed #ddd;
}

.hotel-details-contents .book-button {
    background-color: #2b7fff;
    color: white;
    border: none;
    padding: 12px 20px;
    border-radius: 4px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    width: 100%;
    margin-top: 15px;
    transition: background-color 0.2s ease;
}

.hotel-details-contents .book-button:hover {
    background-color: #3a5a9f;
}

.hotel-details-contents .booking-summary-container{
    display: none;
}


@media (max-width: 991px) {
    .hotel-details-contents .booking-summary.active .booking-summary-content {
        max-height: 625px;
        height: 500px;
    }
    .hotel-details-contents .booking-summary-container{
        display: block;
        padding: 0px;
    }
    .hotel-details-contents .service-sidebar{
        display: none;
    }
    .hotel-details-contents .card.booking-summary{
        display: none;
    }
}

@media (max-width: 480px) {
    .hotel-details-contents .booking-summary-header h3 {
        font-size: 14px;
    }
    
    .hotel-details-contents .booking-details {
        grid-template-columns: 1fr;
    }
}











@media(max-width: 1024px){
    .service-content{
        flex: unset;
        background: white;
        border-radius: 16px;
        overflow: auto;
        box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
        width: 100%;
    }
    .service-sidebar{
        flex: unset;
        position: relative;
        top: 0px;
        height: auto;
        width: 100%;
    }
    .package-detail-secton .info-grid{
        grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    }
    .partner-registration-section .container-fluid{
        display: block;
    }
    .partner-registration-section .step{
        display: inline-block;
    }
    .partner-registration-section .main-content{
        padding: 20px 0;
    }
}





@media(max-width: 991px){
    .nav-righ-box{
        margin-right: 7%;
    }
    .guide-section img,
    .hotel-section .carousel-inner img,
    .mission-left img{
        height: 280px;
    }
    .discover-section ul li{
        width: 31%;
    }
    .discover-section ul{
        padding: 0px;
    }
    p.partner-content,
    .owner-column p,
    .about-body .about-content p{
        padding-left: 0px;
        padding-right: 0px;
    }
    .package-detail-secton .highlights-grid{
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    }
    p.partner-content{
        margin-bottom: 20px;
    }
    .setup-box{
        margin-top: 20px;
    }
    .paths-section ul,
    .impact-box{
        margin-bottom: 30px;
    }
    .search-sidebar{
        display: none;
    }
}

@media(max-width: 834px){
    .blogs-sections .card-footer,
    .blogs-sections .card-meta{
        display: block;
    }
    .blogs-sections .card-meta .separator{
        display: none;
    }
    .package-detail-secton .destination-hero{
        height: 400px;
    }
    .package-detail-secton .info-grid {
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    }
    .partner-registration-section .steps{
        display: flex;  
      overflow-x: auto;
      padding: 0; 
      margin: 0;  
      list-style: none; 
      white-space: nowrap;
      scrollbar-width: thin; 
      scrollbar-color: #2b7fff transparent;
      gap: 15px;
    }
}

@media(max-width: 767px){
    a.btn.btn-partner,
    .subscribe-section form,
    a.btn.btn-deals{
        float: none;
    }
    .guide-section img,
    .hotel-section .carousel-inner img,
    .mission-left img{
        height: 240px;
    }
    .subscribe-section form input {
        width: 100%;
        max-width: 500px;
    }
    .row.top-footer-rows p{
        padding: 0px;
    }
    img.about-imgs{
        height: auto;
        margin-bottom: 20px;
    }
    .blog-details-sections .related-articles{
        padding: 1.5rem 0;
    }
    .blog-details-sections .blog-article{
        padding: 2rem 0;
    }
    .blogs-sections .card-footer,
    .blogs-sections .card-meta{
        display: flex;
    }
    .blogs-sections .card-meta .separator{
        display: block;
    }
    .package-detail-secton .destination-hero,
    .desti-list-section img{
        height: 300px;
    }
    .deals-sections .deal-image,
    .booking-sections .hotel-image,
    .booking-sections .room-image,
    .blogs-sections .card-image-container{
        height: 400px;
    }
    .contact-infos button.btn.btn-primary{
        margin-bottom: 20px;
    }
    .guide-details-section .tabs{
        margin-bottom: 0px;
    }
    .hotel-img-right figure{
        height: 420px;
    }
    .offer-mids h4{
        text-align: left;
        margin-top: 10px;
        margin-bottom: 10px;
    }
    a.btn.btn-checked{
        float: left;
    }
    .room-list-col-left img {
        height: 280px;
        border-radius: 20px;
    }
    .room-list-rows .room-checkbox-container{
        top: -40px;
        left: 2px;
    }
    .room-list-col-right h6{
        position: relative;
        margin-top: 10px;
    }
    .signup-section .form-container{
        max-width: 100%;
    }
}

@media(max-width: 700px){
    .subscribe-section form input{
        width: 100%;
        max-width: 400px;
    }
    .subscribe-section form button{
        padding: 15px 20px;
        position: relative;
        top: 2px;
    }
}

@media(max-width: 600px){
    .nav-righ-box{
        margin-right: 10%;
    }
    .banner-section .header h1{
        font-size: 40px;
        margin-bottom: 10px;
        line-height: 44px;
    }
    .banner-section .tabs,
    .banner-section .header p{
        margin-bottom: 10px;
    }
    .banner-section .tabs{
        width: 100%;
    }
    .banner-section .tab{
        padding: 10px;
    }
    .discover-section,
    .guide-section,
    .hotel-section,
    .destination-header,
    .subscribe-section,
    .row.top-footer-rows,
    .page-banner,
    .summer-section .row,
    .deal-section .container .overlay,
    .partner-section,
    .partner-signup-section,
    .blogs-sections .blog-grid,
    .hotel-details-contents,
    .room-list-section,
    .paths-section,
    .popular-section,
    .banner-section .overlay{
        padding: 30px 0;
    }
    .subscribe-section h4,
    .discover-section h4,
    .row.mid-footer-rows h4,
    .cancellation-section h1,
    .cancellation-section h2,
    .guide-section h4,
    .blog-details-sections .blog-title,
    .hotel-section h4,
    .about-body h3,
    .contact-infos h3, 
    .summer-section h3,
    .desti-list-section h2,
    .destination-header h1,
    .contact-infos h2,
    .deal-section h4,
    .detail-inclusion h4, 
    .detail-review h4, 
    .detail-faqs h4, 
    .detail-policy h4, 
    .detail-choose h3, 
    .package-detail-secton .hotel-info h2,
    .detail-aminity h4, 
    .package-detail-secton .destination-title,
    .detail-about h4,
    .detail-inclusion h4, 
    .detail-review h4, 
    .detail-faqs h4, 
    .detail-policy h4, 
    .detail-choose h3, 
    .detail-aminity h4, 
    .detail-about h4,
    .guide-hero .hero-info h1,
    .package-detail-secton .stat-number,
    .owner-column h2,
    .package-detail-secton .guide-name,
    .signup-section .form-title,
    .signin-section .login-title,
    .about-content h2,
    .popular-section h4{
        font-size: 26px;
        line-height: 30px;
    }
    .deals-sections .deal-image,
    .guide-section img, .hotel-section .carousel-inner img, .mission-left img {
        height: 200px;
    }
    .mission-left h5{
        font-size: 20px;
    }
    .discover-section ul li {
        width: 48%;
    }
    .subscribe-section form{
        margin-top: 20px;
    }
    .include-content .include,
    .row.mid-footer-rows{
        margin-bottom: 30px;
    }
    .partner-registration-section .form-section,
    .row.bootom-footer-rows{
        padding: 20px 0;
    }
    .page-banner .page-content .overlay{
        padding: 70px 0;
    }
    .page-banner .page-content h1{
        font-size: 40px;
        line-height: 46px;
    }
    .owner-column h2,
    .about-body h6,
    .about-body h3{
        margin-bottom: 10px;
    }
    .impact-section,
    .summer-section,
    .desti-list-section,
    .about-body{
        padding-bottom: 30px;
    }
    .blog-details-sections .main-container{
        padding: 0px;
    }
    .hotel-img-right figure,
    .hotel-img-left figure,
    .blogs-sections .card-image-container{
        height: 300px;
    }
    #jobs.jobs .section-header{
        margin-bottom: 15px;
    }
    .desti-list-section img {
        height: 220px;
    }
    .guide-hero .hero-content{
        gap: 1rem;
    }
    .guide-details-section .contact-section {
        padding: 20px;
        margin-top: 0px;
    }
    .detail-inclusion, 
    .detail-review, 
    .locaton-section .row,
    .serenity-section .row,
    .detail-faqs, 
    .package-detail-secton .guide-header,
    .detail-policy, 
    .detail-choose, 
    .partner-signup-section form,
    .package-detail-secton .hotel-header,
    .signup-section .right-section,
    .detail-aminity, 
    .signin-section .login-form,
    .detail-about{
        padding: 20px;
    }
    .detail-about ul.detail-about-lists li,
    .detail-aminity ul li{
        width: 47%;
    }
    a.btn.btn-book-package{
        top: 11%;
    }
    .package-detail-secton .destination-overlay{
        padding: 15px;
    }
    .package-detail-secton .destination-content{
        padding: 20px 0;
    }
    .include-content{
        display: block;
    }
    .package-detail-secton .day-number{
        margin-bottom: 0px;
    }
    .package-detail-secton .guide-header,
    .package-detail-secton .hotel-header{
        border-radius: 10px;
    }
    .package-detail-secton .hotel-gallery{
        height: 240px;
    }
    .package-detail-secton{
        padding-top: 30px;
    }
    p.whyus-content,
    p.impact-content,
    .partner-registration-section .content-header{
        margin-bottom: 20px;
    }
    .signup-section .trust-indicators,
    .signup-section .description,
    .signin-section .trust-indicators,
    .signin-section .description{
        display: none;
    }
    .signin-section .branding{
        min-height: auto;
    }
}

@media(max-width: 575px){
    .guide-section img, .hotel-section .carousel-inner img, .mission-left img {
        height: 240px;
    }
    .subscribe-section form input {
        width: 100%;
        max-width: 100%;
        border-radius: 10px;
    }
    .subscribe-section form button {
        width: 100%;
        border-radius: 10px;
    }
    .row.top-footer-rows h5{
        margin-top: 10px;
        margin-bottom: 10px;
    }
    .discover-section p{
        margin-bottom: 20px;
    }
    .booking-sections .hotel-image,
    .booking-sections .room-image{
        height: 300px;
    }
    .job-header .job-meta{
        gap: 10px;
    }
    .hotel-img-right figure, 
    .hotel-img-left figure, 
    .blogs-sections .card-image-container{
        height: 200px;
    }
}

@media(max-width: 480px){
    .booking-sections .hotel-image,
    .booking-sections .room-image{
        height: 240px;
    }
    .stats{
        padding: 20px;
        font-size: 20px;
    }
    .signin-section .form-footer{
        display: block;
    }
    .signin-section .form-footer a{
        display: block;
        margin-bottom: 10px;
    }
}

@media(max-width: 420px){
    .discover-section ul li {
        width: 100%;
    }
    .discover-section ul li a{
        margin-right: 0px;
        margin-bottom: 15px;
    }
    .nav-righ-box {
        margin-right: 13%;
    }
    .banner-section .header h1 {
        font-size: 30px;
        margin-bottom: 10px;
        line-height: 34px;
    }
    .banner-section .tabs{
        gap: 5px;
    }
    .room-list-col-left img,
    .blogs-sections .card-image-container {
        height: 220px;
    }
    .detail-about ul.detail-about-lists li, 
    .detail-aminity ul li{
        width: 100%;
    }
}

@media(max-width: 410px){
    .menu-section{
        padding: 10px 0;
        height: auto;
    }
    .clickmenus {
        top: 12px;
    }
    .fixed-top .clickmenus{
        top: 13px;
    }
    a.navbar-brand{
        margin-right: 0px;
    }
    .navbar-brand img,
    header.fixed-top .menu-section .navbar-brand img {
        width: 120px;
    }
    .blog-details-sections .blog-meta{
        display: block;
    }
    .booking-sections .step-label{
        font-size: 12px;
    }
    .booking-sections .progress-steps{
        padding: 1rem 0;
    }
}

@media(max-width: 400px){
    a.btn.btn-start{
        width: 100%;
        margin-bottom: 10px;
    }
    a.btn.btn-demo{
        width: 100%;
    }
}