/* =========================
   TABLET / SMALL DESKTOP
========================= */

@media (max-width:1000px){

    .nav-menu{
        gap:15px;
    }

    .hero h1{
        font-size:24px;
    }

    .booking-box{
        grid-template-columns:1fr 1fr;
    }

    .booking-submit{
        min-height:50px;
    }

    .wildlife-grid{
        grid-template-columns:repeat(3,1fr);
    }

    .feature-grid{
        grid-template-columns:1fr 1fr;
    }

    .feature-item:nth-child(2){
        border-right:0;
    }

    .package-grid,
    .hotels-grid{
        grid-template-columns:1fr 1fr;
    }

    .footer-grid{
        grid-template-columns:1fr 1fr;
    }
}


/* =========================
   MOBILE
========================= */

@media (max-width:768px){

    .topbar{
        display:none;
    }
.hotel-banner{height: 150px;}
    .header{
        top:0;
    }
    li.nav-item {
        margin: 0 1px;
        line-height: 20px;
        border-bottom: 1px solid #dfdcdc;
        background: #2b4401;
        z-index: 1;
        color: #000;
    }.navbar-nav .nav-link{color: #fff;}
   
.wildlife-table td{padding: 4px 9px;}
    .menu-toggle{
        display:block;
    }
.about-content, .jeep-content, .experience-content{margin-top: 5px;}
    .nav-menu{
        position:absolute;
        top:70px;
        left:0;
        width:100%;
        background:#26301f;
        padding:20px;
        display:none;
        flex-direction:column;
        align-items:flex-start;
        gap:15px;
    }
.cta-section{padding: 20px 0;}
    .nav-menu.active{
        display:flex;
    }

    .nav-actions{
        display:none;
    }

    .hero{
        min-height:150px;
    }

    .hero-content{
        padding-top:10px;
    }

    .hero h1{
        font-size:24px;
    }

    .hero p{
        font-size:14px;
    }

    .booking-wrap{
        margin-top:0;
        padding-top:20px;
        background:#f4f5f0;
    }

    .booking-box{
        grid-template-columns:1fr;
        box-shadow:none;
        padding:0;
        background:transparent;
    }

    .booking-submit{
        min-height:50px;
    }

    .intro-grid,
    .safari-grid,
    .why-grid{
        grid-template-columns:1fr;
        gap:35px;
    }

    .intro-image img{
        height:370px;
    }

    .experience-badge{
        right:10px;
    }

    .intro-content h2,
    .safari-content h2,
    .why-content h2{
        font-size:34px;
    }

    .wildlife-grid{
        grid-template-columns:1fr 1fr;
    }

    .feature-grid{
        grid-template-columns:1fr;
    }

    .feature-item{
        border-right:0;
        border-bottom:1px solid #dfe2da;
        padding:18px 0;
    }

    .feature-item:last-child{
        border-bottom:0;
    }

    .package-grid,
    .hotels-grid,
    .season-grid{
        grid-template-columns:1fr;
    }

    .why-list,
    .intro-list{
        grid-template-columns:1fr;
    }

    .tips-grid{
        grid-template-columns:1fr 1fr;
    }

    .footer-grid{
        grid-template-columns:1fr;
        gap:30px;
    }

    .section{
        padding:30px 0;
    }

    .section-title h2{
        font-size:20px;
    }
    .section-title h2,.packages-section .section-title h2, .about-content h2, .experience-content h2, .jeep-content h2{
        font-size: 20px;
    }.why-card{padding: 15px;}
}


/* =========================
   SMALL MOBILE
========================= */

@media (max-width:480px){

    .container{
        width:92%;
    }

    .hero h1{
        font-size:24px;
    }

    .hero{
        min-height:150px;
    }

    .wildlife-grid,
    .tips-grid{
        grid-template-columns:1fr;
    }

    .logo-text strong{
        font-size:19px;
    }

    .logo-icon{
        width:38px;
        height:38px;
        font-size:20px;
    }
}
@media (max-width: 767px) {

  .topbar {
                display: none;
            }

            .section-padding {
                padding: 20px 0;
            }

            .hero {
                min-height: 150px;
            }

            .hero-content {
                padding: 10px 0;
            }

            .hero-content h1 {
                font-size: 24px;
            }
         .main-btn,.hero-outline-btn{padding: 5px 3px;}
            .hero-content p {
                font-size: 13px;
                margin-bottom: 0;
            }
             .hero-content .small-title{    font-size: 13px; margin-bottom: 1px;}
            .hero-bottom {
                display: none;
            }

            .hero-info {
                flex-direction: column;
                align-items: flex-start;
            }

            .about-image img,
            .experience-image img,
            .jeep-image img {
                height: 350px;
            }

            .about-badge {
                right: 10px;
            }

            .booking-content {
                padding: 20px 20px;
            }

            .booking-image img {
                min-height: 300px;
                margin-top: 10px;
            }

            .cta-section h2 {
                font-size: 23px;
            }

            .wildlife-table,
            .zones-table {
                overflow-x: auto;
            }

            .package-img,
            .hotel-card img {
                height: 210px;
            }
     

    .packages-section .section-title p {
        margin-bottom: 30px;
    }.zones-table td{font-size: 14px;}
.package-body h3{font-size: 17px;}
    .package-image {
        height: 220px;
    }
.packages-all-btn{margin-top: 10px;}
.packages-all-btn a,.hotel-all-btn a {
    padding: 6px 18px;}
    .package-body {
        padding: 20px;
    }
.wildlife-table th,.wildlife-table td{font-size: 14px;}
    .package-bottom {
        align-items: flex-end;
    }

    .package-btn,.hotel-all-btn {
        padding: 10px 13px;    margin-top: 9px;
    }

}

@media (max-width: 767px) {

    .hotel-section .section-title h2 {
        font-size: 20px;
    }

    .hotel-section .section-title p {
        margin-bottom: 30px;
    }

    .hotel-image {
        height: 220px;
    }

    .hotel-body {
        padding: 20px;
    }

    .hotel-bottom {
        align-items: flex-end;
    }

    .hotel-btn {
        padding: 10px 13px;
    }

}

/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 991px) {

    .tour-feature-row {
        grid-template-columns: repeat(2, 1fr);
    }

}

@media (max-width: 767px) {

    .tour-day-card {
        padding: 14px;
    }

    .tour-day-heading {
        align-items: flex-start;
    }

    .tour-day-heading h3 {
        font-size: 19px;
        line-height: 1.4;
    }

    .tour-day-number {
        min-width: 52px;
        height: 58px;
    }

    .tour-day-image {
        height: 210px;
        margin-bottom: 18px;
    }

    .tour-day-content {
        padding-left: 0;
    }

    .tour-highlight-item {
        padding: 13px 7px;
    }

    .tour-feature-row {
        grid-template-columns: 1fr 1fr;
    }

    .tour-info-box,
    .tour-note-box {
        align-items: flex-start;
    }

}

@media (max-width: 575px) {

    .tour-day-heading {
        gap: 10px;
    }

    .tour-day-heading h3 {
        font-size: 18px;
    }

    .tour-day-number {
        min-width: 48px;
        height: 55px;
    }

    .tour-day-number strong {
        font-size: 24px;
    }

    .tour-day-image {
        height: 200px;
    }

    .tour-day-content p {
        font-size: 14px;
        line-height: 1.65;
    }

    .tour-feature-row {
        grid-template-columns: 1fr;
    }

    .tour-feature-card {
        min-height: auto;
    }


}
@media (max-width: 991px) {

    .info-sidebar {
        position: relative;
        top: auto;
        margin-top: 35px;
    }

    .info-season-content {
        padding: 20px 5px 5px;
    }

}

@media (max-width: 767px) {

    .info-page-section {
        padding: 15px 0;
    }

    .info-page-title h2 {
        font-size: 18px;
    }
    .info-season-card {
        padding: 15px;
    }

    .info-season-image {
        height: 230px;
    }

    .info-season-content h3 {
        font-size: 19px;
    }

}

@media (max-width: 575px) {

    .info-page-title h2 {
        font-size: 18px;
    }

    .info-season-image {
        height: 210px;
    }

    .info-season-content {
        padding: 18px 0 0;
    }

    .info-enquiry-header,
    .info-enquiry-body {
        padding: 16px;
    }

}
@media (max-width: 767px) {

    .gallery {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 220px 140px 140px;
        gap: 8px;
    }
    .gallery .gallery-main {
        grid-column: span 2;
        grid-row: auto;
    }

}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 480px) {

    .tathastu-gallery {
        grid-template-rows: 190px 115px 115px;
        gap: 6px;
    }

}