@media (min-width:1400px) {

    #mobileNav ul li .mobileItem,
    nav .sf-menu a {
        padding: 15px 28px
    }

    .carRentalDetails .view_all {
        margin-left: 34%
    }

    .tour-slider .caption-body {
        min-height: 260px
    }

    nav .sf-menu a {
        font-size: 14px
    }

    .tempo_inner_section .tempo_slider .card,
    .tempo_slider_home .tempo_box_home .card {
        min-height: 390px
    }

    .tempo_inner_section .tempo_slider .card .card-footer,
    .tempo_slider_home .tempo_box_home .card .card-footer {
        padding: 8px 0
    }

    .sf-menu li:hover .subDropdown-menu {
        transform: translate(-80px, 0);
        -webkit-transform: translate(-80px, 0);
        -moz-transform: translate(-80px, 0);
        -ms-transform: translate(-80px, 0);
        -o-transform: translate(-80px, 0)
    }
}

@media (min-width:1201px) and (max-width:1400px) {

    .tempo_inner_section .tempo_slider .card,
    .tempo_inner_section .tempo_slider_home .card {
        min-height: 330px
    }

    .carRentalDetails .view_all {
        margin-left: 34%
    }

    .tour-slider .caption-body {
        min-height: 240px
    }

    .navbar .enq {
        display: block
    }

    .navbar .enq a {
        margin-top: 10px
    }

    #fh5co-destination-list li .title-bg h3 {
        font-size: 36px
    }
}

@media (max-width:1200px) {
    .pkg-wrap .content-body h3 {
        font-size: 38px
    }

    .pkg-wrap .sub-head {
        font-size: 16px
    }

    nav .sf-menu a {
        padding: 15px;
        font-size: 14px
    }

    #mobileNav ul li .mobileItem {
        padding: 15px
    }

    .sf-arrows .sf-with-ul {
        padding-right: 10px
    }

    nav .sf-menu a:focus {
        outline: 0
    }

    .fh5co-tours>div.imagg {
        height: 260px
    }

    #fh5co-destination-list li .title-bg h3 {
        font-size: 28px
    }

    #mobileNav ul li i {
        padding: 2px 5px 3px;
        margin-top: 0
    }

    .tour-slider .caption-body {
        min-height: 260px
    }
}

@media (min-width:1024px) and (max-width:1199px) {
    nav .sf-menu a {
        padding: 15px 5px;
        font-size: 14px
    }

    .carRentalDetails .view_all {
        margin-left: 34%
    }

    .tour-slider .caption-body {
        min-height: 260px
    }

    #mobileNav ul li .mobileItem {
        padding: 15px 3px
    }

    .navbar .enq {
        display: none
    }

    .pkg-slider .bottom a {
        font-size: 13px;
        padding: 6px
    }

    .fh5co-tours>div .desc h3 {
        font-size: 20px
    }

    .icon-box {
        padding: 0 20px;
        margin: 20px 0
    }

    .contact-details-section .icon-box {
        min-height: 340px
    }

    #fh5co-primary-menu .fh5co-sub-menu {
        left: 0
    }

    #fh5co-primary-menu .fh5co-sub-menu:after {
        left: 48%
    }

    .images-gallery-box {
        grid-template-columns: repeat(4, 1fr)
    }

    .tempo_rental .swiper-button-next,
    .tempo_rental .swiper-button-prev {
        top: 25%
    }
}

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

    #mobileNav ul li .mobileItem,
    nav .sf-menu a {
        padding: 15px 4px
    }

    .carRentalDetails .view_all {
        margin-left: 34%
    }

    .tour-slider .caption-body {
        min-height: 260px
    }

    .navbar .enq {
        display: none
    }

    nav .sf-menu a {
        font-size: 13px
    }

    .sf-arrows .sf-with-ul {
        padding-right: 6px
    }

    #fh5co-primary-menu .fh5co-sub-menu:after {
        display: block;
        left: 48%;
        top: -6px
    }
}

@media (min-width:768px) {
    .car-rental-tour-list {
        column-count: 2
    }

    .tour-operator-section::before {
        content: "";
        width: 53%;
        height: 100%;
        background-color: #ff5722;
        position: absolute;
        left: -6%;
        top: 0;
        transform: skewX(27deg)
    }
}

@media (max-width:992px) {

    #mobileNav ul li .mobileItem,
    nav .sf-menu a {
        padding: 15px 4px
    }

    .tour-slider .caption-body {
        min-height: 210px
    }

    header {
        padding: 5px 0
    }

    #fh5co-features .feature-left {
        margin-bottom: 30px
    }

    #fh5co-features .feature-left .icon,
    .feature-left .icon {
        width: 10%
    }

    #fh5co-primary-menu .fh5co-sub-menu:after,
    .enq,
    .navbar .enq,
    .pkg-wrap .content-body,
    header .info-list li p {
        display: none
    }

    nav .sf-menu a {
        font-size: 14px
    }

    nav .sf-menu a:focus {
        outline: 0
    }

    .pkg-wrap .right-sec .main-col {
        background: 0 0
    }

    header .nav .icon {
        width: 24px
    }

    header .info-list li:first-child {
        margin-right: 6px
    }

    #fh5co-primary-menu .fh5co-sub-menu {
        width: 100%;
        top: 52px
    }

    .wlc {
        margin-top: -39px;
        width: 182px
    }

    .fh5co-tours>div .desc h3 {
        font-size: 20px
    }

    #fh5co-primary-menu .fh5co-sub-menu a h4 {
        font-size: 13px
    }

    .tour-slider .bottom {
        position: static
    }

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

    .pkg-wrap {
        flex-direction: column
    }

    .pkg-wrap .left-sec {
        width: 100%
    }
}

@media (max-width:991px) {

    .hamburger span,
    nav #fh5co-primary-menu>li>ul li:hover {
        background-color: var(--bg-primary)
    }

    #mobileNav ul li i,
    .mobile-info,
    .mobileMenu {
        display: flex;
        background-color: var(--bg-white)
    }

    #fh5co-primary-menu .fh5co-sub-menu a,
    #fh5co-primary-menu .fh5co-sub-menu a h4,
    #mobileNav ul li i {
        color: var(--black-color)
    }

    .enqBtn {
        display: flex;
        margin: 20px auto;
        justify-content: center;
        align-items: center;
        width: 100px
    }

    .mobile-info,
    .mobileMenu {
        height: 48px;
        border-radius: 50%
    }

    #mobileNav,
    .fh5co-tours>div.imagg a img {
        height: 100%
    }

    .sf-menu li:hover .subDropdown-menu {
        min-width: 100%;
        height: auto;
        width: 100%;
        position: static;
        padding: 0
    }

    .sf-menu li .sub-dropdown-menu {
        transform: translateY(0);
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0)
    }

    .sf-menu li:hover .subDropdown-menu .dropdownBox {
        flex-direction: column
    }

    .sf-menu li:hover .subDropdown-menu .dropdownBox .dropdownBoxInner1 .dropdownMenu,
    .sf-menu li:hover .subDropdown-menu .dropdownBox .dropdownBoxInner2 .dropdownMenu {
        width: 100%;
        position: static;
        min-width: 100%;
        margin-top: 0
    }

    .sf-menu li:hover .subDropdown-menu .dropdownBox .dropdownBoxInner1 .menu_title,
    .sf-menu li:hover .subDropdown-menu .dropdownBox .dropdownBoxInner2 .menu_title {
        font-size: 16px;
        padding: 10px
    }

    .tempo_inner_section .tempo_slider .card {
        min-height: 315px
    }

    .tempo_details .tp_left img {
        height: auto
    }

    .sf-menu li .subDropdown-menu .dropdownBox .dropdownBoxInner1 {
        border-right: none
    }

    .tour_package_details .tp_left img {
        width: auto;
        height: auto;
        margin-top: 25px
    }

    .tempo_details .tour_inner_siderbar {
        margin-top: 20px
    }

    .pkg-wrap .wrapper,
    nav #fh5co-primary-menu .fh5co-sub-menu a h4 {
        margin: 0
    }

    .tour-slider .bottom a {
        margin: 5px 0
    }

    #fh5co-primary-menu .fh5co-sub-menu,
    .tour-slider .bottom {
        position: static
    }

    #fh5co-primary-menu .fh5co-sub-menu .view-btn,
    .header_top .hs_right .call img,
    .header_top .hs_right .emailId,
    .header_top .hs_right .mail img,
    .sf-menu .sub-dropdown-menu:after,
    .sf-menu .subDropdown-menu:after,
    header .info-list li:nth-child(2),
    nav #fh5co-primary-menu>li>ul li img {
        display: none
    }

    .header_top .hs_right {
        width: 100%;
        justify-content: end
    }

    .mobileNumber ul li {
        display: inline-block
    }

    .header_top .hs_right .mn .mobileNumber ul {
        display: flex;
        gap: 10px
    }

    .logo a {
        display: block;
        height: 64px
    }

    .header_top .logo img {
        width: 100%
    }

    .mobile-info {
        padding: 8px;
        width: 48px;
        justify-content: center;
        align-items: center;
        margin-bottom: 0;
        list-style: none
    }

    .mobile-info a svg {
        width: 36px;
        height: 36px
    }

    .navbar-collapse {
        padding-left: 0;
        padding-right: 0
    }

    nav #fh5co-primary-menu>li>ul li {
        display: block;
        width: 100%;
        padding: 5px;
        border-bottom: 1px solid #ddd
    }

    #mobileNav .sf-menu .megaDropdown.active .fh5co-sub-menu li.active a h4,
    nav #fh5co-primary-menu>li>ul li:hover a h4 {
        color: var(--white-color)
    }

    .sf-menu,
    .sf-menu>li {
        float: none
    }

    .navbar-header {
        width: 100%;
        padding: 15px 0;
        display: flex;
        justify-content: space-between;
        align-items: center
    }

    .contact-from-wrap {
        margin-top: 40px
    }

    .fh5co-tours>div .desc h3 {
        font-size: 18px;
        text-align: center
    }

    .animate-box {
        margin-bottom: 15px
    }

    .mobileMenu {
        width: 48px;
        justify-content: center;
        padding: 2px 7px;
        box-shadow: 3px 5px 35px rgb(86 68 169 / 10%)
    }

    .hamburger {
        display: block;
        position: relative;
        width: 28px;
        height: 28px;
        margin: 8px 0;
        cursor: pointer;
        border: none;
        float: right;
        outline: 0;
        box-shadow: none;
        background: 0 0
    }

    .hamburger span {
        width: 100%;
        height: 3px;
        display: block;
        position: absolute;
        right: 0;
        transition: .3s
    }

    .hamburger span.h-top {
        top: 0
    }

    .hamburger span.h-middle {
        top: 50%;
        transform: translateY(-50%);
        width: 100%
    }

    .hamburger span.h-bottom {
        bottom: 0;
        width: 100%
    }

    .hamburger.active span.h-top {
        transform: rotate(45deg);
        top: 50%;
        margin-top: -2px
    }

    .hamburger.h-active span {
        width: 80%
    }

    .hamburger.active span.h-middle {
        transform: translateX(-30px);
        opacity: 0
    }

    .hamburger.active span.h-bottom {
        transform: rotate(-45deg);
        bottom: 50%;
        margin-bottom: -1px
    }

    #mobileNav {
        position: fixed;
        top: 0;
        left: 0;
        width: 265px;
        z-index: 99;
        overflow: auto;
        background: #333;
        box-shadow: 0 0 10px rgb(0 0 0 / 75%);
        transition: transform .3s ease-in;
        transform: translateX(-280px);
        -webkit-transform: translateX(-280px);
        -moz-transform: translateX(-280px);
        -ms-transform: translateX(-280px);
        -o-transform: translateX(-280px)
    }

    #mobileNav .sf-menu li {
        border-bottom: 1px solid #777
    }

    #mobileNav .sf-menu .megaDropdown .fh5co-sub-menu li:last-child,
    #mobileNav .sf-menu li:last-child {
        border-bottom: none
    }

    .navbar-collapse.slidenav {
        transform: translateX(0) !important;
        -webkit-transform: translateX(0) !important;
        -moz-transform: translateX(0) !important;
        -ms-transform: translateX(0) !important;
        -o-transform: translateX(0) !important
    }

    #mobileNav ul li .mobileItem {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 10px
    }

    #mobileNav ul li a {
        padding: 15px 10px
    }

    #mobileNav ul li i {
        font-size: 16px;
        width: 30px;
        justify-content: center;
        height: 30px;
        align-items: center;
        margin-top: 0;
        transform: rotate(0);
        -webkit-transform: rotate(0);
        -moz-transform: rotate(0);
        -ms-transform: rotate(0);
        -o-transform: rotate(0)
    }

    .megaDropdown:hover .mobileItem i,
    .sub_menu:hover .mobileItem i {
        transform: rotate(0) !important
    }

    .sf-menu li:hover .sub-dropdown-menu,
    .sf-menu li:hover .subDropdown-menu {
        animation: none;
        -webkit-animation: none
    }

    .sf-menu li .sub-dropdown-menu {
        transition: none;
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0
    }

    #mobileNav .sf-menu li:hover .subDropdown-menu {
        display: none;
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -ms-border-radius: 0;
        -o-border-radius: 0
    }

    #mobileNav .sub-dropdown-menu {
        min-width: 245px;
        position: initial;
        float: none;
        display: none;
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -ms-border-radius: 0;
        -o-border-radius: 0
    }

    #mobileNav .sub-dropdown-menu li a {
        padding: 5px 30px !important
    }

    #mobileNav .sf-menu .megaDropdown:hover .fh5co-sub-menu {
        display: none;
        border-radius: 0
    }

    .sf-menu .sub-dropdown-menu {
        padding: 0
    }

    #fh5co-primary-menu .fh5co-sub-menu a {
        font-size: 14px;
        padding: 10px !important;
        text-align: left
    }

    #fh5co-primary-menu .fh5co-sub-menu {
        padding: 0;
        min-width: 248px !important;
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -ms-border-radius: 0;
        -o-border-radius: 0
    }

    #fh5co-primary-menu .fh5co-sub-menu a .mega_menu_sub_heading {
        margin-top: 0
    }

    .pkg-slider .bottom a {
        font-size: 14px;
        padding: 5px
    }

    .prod_footer {
        padding: 10px 5px
    }

    .wlc {
        margin-top: -50px;
        width: 230px
    }
    .vehicleWrapper .vehicleSlider{
        grid-template-columns: repeat(2,1fr);
    }
    .vehicleWrapper .vehicleSlider .vehicleFooter .vehicleViewDetailsBtn .vehicleMoreBtn {
        padding: 5px
    }
    .vehicleWrapper .vehicleSlider .vehicleContentBody h3 a {
        font-size: 18px !important
    }
    .tempo_box_home .title-head,
    .tempo_slider .title-head {
        padding: 14px
    }

    .car_details .carLeft {
        max-width: 345px;
        width: 100%
    }

    .center-diamond {
        width: 20%
    }

    .center-diamond:before {
        margin: 0 0 0 -5px
    }

    .card-main-box,
    .no-scroll-slide {
        grid-template-columns: repeat(2, 1fr)
    }

    .card-parents,
    .images-gallery-box,
    .tempo_slider_grid {
        grid-template-columns: repeat(3, 1fr)
    }

    .tempo_rental .swiper-button-next,
    .tempo_rental .swiper-button-prev {
        top: 25%
    }
}

.border-top-lg-none,
.border-top-xl-none,
.border-top-xxl-none {
    border-top: none !important
}

@media (max-width:769px) {
    header .info-list {
        padding: 35px 0;
        margin: 0
    }
}

@media (max-width:768px) {

    .mobileMenu,
    .navbar-default .navbar-toggle .icon-bar {
        background-color: var(--bg-white)
    }

    #mobileNav ul li .mobileItem,
    nav .sf-menu a {
        padding: 15px 10px
    }

    .hamburger {
        width: 20px;
        height: 20px;
        margin: 3px 0
    }

    .sf-menu ul {
        position: absolute;
        display: none;
        top: 100%;
        right: 0;
        z-index: 99
    }

    .tour-slider .bottom {
        position: static
    }

    #fh5co-primary-menu .fh5co-sub-menu a {
        padding: 10px 15px !important;
        text-align: left
    }

    #fh5co-features .row,
    #fh5co-primary-menu .fh5co-sub-menu .view-btn,
    nav #fh5co-primary-menu .fh5co-sub-menu .full-widths,
    nav #fh5co-primary-menu .fh5co-sub-menu a h4 {
        margin: 0
    }

    #fh5co-primary-menu .fh5co-sub-menu .view-btn a {
        background-color: var(--bg-primary);
        color: var(--white-color)
    }

    .tour_package_details .tp_left img {
        height: auto;
        margin-top: 20px;
        width: 100%
    }

    .tour_inner_siderbar {
        margin-top: 15px
    }

    .package_details_wrapper {
        padding: 20px 0 0
    }

    .tour_package_details .tab-content {
        padding: 10px
    }

    .tour_package_details .tpi_tab .tpi_tab_content p {
        margin-bottom: 0
    }

    .tour_package_details .tpi_tab .tpi_tab_content p span {
        font-size: 16px
    }

    #fh5co-destination-list li .title-bg h3,
    .main-head p,
    .tour_package_details #nav-itinerary .tpi_tab .tpi_tab_right h2,
    .tour_packages .heading {
        font-size: 18px
    }

    .tour_packages_banner img {
        display: block;
        height: auto
    }

    .header_top .hs_right .call img,
    .header_top .hs_right .ei .emailId,
    .header_top .hs_right .mail img,
    .tour_packages_mobile_banner img,
    header .info-list i,
    nav #fh5co-primary-menu>li>ul li img {
        display: none
    }

    .header_top {
        width: 100%;
        margin: auto
    }

    .mobile-info,
    .mobileMenu {
        margin: 5px 10px
    }

    .header_top .logo {
        max-width: 280px
    }

    .header_top .hs_right {
        width: 100%;
        justify-content: end !important
    }

    .mobile-info li a img {
        width: 27px
    }

    .mobileMenu {
        width: 30px;
        height: 30px;
        margin: 2px 0;
        padding: 2px 0;
        border-radius: 50%;
        box-shadow: 3px 5px 35px rgb(86 68 169 / 10%)
    }

    .mobile-info {
        padding: 0;
        height: 30px;
        width: 30px
    }

    .mobile-info a svg {
        width: 22px;
        height: 22px
    }

    .main-head .heading,
    .tour_packages .tour_package_top h2 {
        font-size: 22px
    }

    .pacakage_heading .breadcrumb,
    .pkg-wrap .main-head,
    .tri-adv {
        width: 100%
    }

    .navbar-header {
        padding: 4px 0;
        float: none
    }

    header .info-list .flex,
    nav .sf-menu a {
        display: block
    }

    header .info-list li {
        float: none;
        width: auto
    }

    header .info-list {
        margin: 20px 0
    }

    header .info-list .space a {
        margin: 0 8px 0 0;
        font-size: 14px;
        font-weight: 600
    }

    .sf-menu {
        float: none !important
    }

    #fh5co-features .feature-left,
    .tri-adv {
        float: none
    }

    .sf-menu li {
        float: none;
        border-bottom: 1px solid #ffffff1f
    }

    #fh5co-primary-menu .fh5co-sub-menu {
        position: static;
        border-radius: 0
    }

    .navbar-collapse {
        padding-left: 0;
        padding-right: 0;
        background: #1a1a1a
    }

    nav #fh5co-primary-menu>li>ul li {
        display: block;
        width: 100%
    }

    .about-section .fig {
        float: left;
        width: 50%
    }

    .animate-box {
        margin-bottom: 15px
    }

    #fh5co-destination {
        margin-top: 0 !important
    }

    #fh5co-features {
        padding-top: 0 !important
    }

    .fh5co-tours {
        width: 50%
    }

    header .navbar-header {
        margin: 0 !important;
        float: left
    }

    header .navbar {
        float: right;
        padding: 20px 0
    }

    .footer-bottom .fh5co-social-icons {
        text-align: center
    }

    .tri-adv {
        text-align: left;
        border-top: 1px solid #ddd;
        padding-top: 5px
    }

    .about-section .about-content h2,
    .pacakage_heading h1 {
        font-size: 24px
    }

    .about-section .icon-box {
        padding: 15px 0;
        margin-bottom: 20px
    }

    .about-banner,
    .contact-banner {
        height: 200px !important
    }

    .about_package {
        padding: 30px 0
    }

    .contact-details-section .icon-box {
        margin: 20px 0;
        min-height: 300px !important
    }

    .contact-details-section .border-icon-box {
        padding-top: 20px !important;
        padding-bottom: 20px !important
    }

    .contact-details-section {
        padding: 15px !important
    }

    .bg-light-grey {
        background-color: #f8f8f8;
        display: block !important
    }

    .section-heading .section-title {
        margin-bottom: 15px;
        font-size: 24px
    }

    .contact-banner h1 {
        margin-top: 0
    }

    .packageSlider {
        text-align: center;
        margin-right: 0;
        margin-top: 20px
    }

    .fh5co-tours>div:hover img {
        transform: scale(1);
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -o-transform: scale(1)
    }

    .fh5co-tours>div:hover:after {
        opacity: 0;
        visibility: hidden
    }

    .prod_footer {
        display: flex;
        justify-content: center
    }

    .car_details .carLeft {
        max-width: 340px
    }

    .tour_package_details .tpi_tab {
        margin-bottom: 20px
    }

    .tour_package_details #nav-itinerary .tpi_tab .tpi_tab_right {
        margin-right: 15px
    }

    .tour_package_details #nav-itinerary .tpi_tab .tpi_tab_left .icon {
        width: 25px;
        height: 25px;
        color: var(--white-color);
        font-size: 16px
    }

    .tour_package_details #nav-itinerary .tpi_tab .tpi_tab_right .itinerary_title,
    .tour_package_details #nav-itinerary .tpi_tab .tpi_tab_right h2,
    .tour_package_details #nav-itinerary .tpi_tab .tpi_tab_right h3,
    .tour_package_details #nav-itinerary .tpi_tab .tpi_tab_right h4,
    .tour_package_details #nav-itinerary .tpi_tab .tpi_tab_right h5,
    .tour_package_details #nav-itinerary .tpi_tab .tpi_tab_right h6 {
        color: var(--primary-color);
        font-size: 16px;
        font-weight: 500;
        margin-bottom: 5px
    }

    .card-parents,
    .no-scroll-slide,
    .three-card .card-parents {
        grid-template-columns: repeat(2, 1fr)
    }

    .card-main-box {
        grid-template-columns: repeat(1, 1fr) !important
    }
}

@media (max-width:767px) {
    .package_details_wrapper .image-wrap .right-sec {
        margin-top: 10px
    }

    .car_details {
        display: flex;
        flex-direction: column;
        gap: 20px
    }

    .car_details .carLeft {
        max-width: 100%;
        width: 100%;
        margin: 0
    }

    section {
        margin: 20px 0 40px
    }

    .parents-card-contra .left-box {
        flex-direction: column
    }

    .card-parents .card-box .img-box img,
    .parents-card-contra .left-box .card-img-box,
    .parents-card-contra .left-box .card-img-box img {
        width: 100%
    }

    .card-parents,
    .images-gallery-box,
    .tempo_details .tempo_dest .destination_card .dest_slider,
    .tempo_slider_grid {
        grid-template-columns: repeat(2, 1fr)
    }
    .vehicleWrapper .vehicleSlider .vehicleBox{
        height: auto;
    }
    .vehicleWrapper .vehicleSlider,
    .no-scroll-slide {
        grid-template-columns: repeat(1, 1fr)
    }
    .vehicleWrapper .vehicleSlider .vehicleFooter{
        position: static;
        margin-top: 10px;
    }
    .card-parents .card-box .img-box img,
    .no-scroll-slide .card figure,
    .no-scroll-slide .card figure img {
        height: auto
    }

    .contact-us-block::before {
        background: 0 0
    }
}

@media (max-width:600px) {
    #fh5co-tours1 .fh5co-tours {
        float: none;
        display: inline-block;
        width: 100%
    }

    #fh5co-tours1 .fh5co-tours .imagg img {
        width: 100%
    }

    .fh5co-tours>div.imagg {
        height: 320px
    }

    .btn.btn-primary {
        width: 180px
    }

    .prod_footer {
        padding: 10px;
        display: flex;
        justify-content: center
    }
}

@media (max-width:580px) {
    .image-wrap .small-gutters {
        gap: 10px
    }

    .image-wrap .full-img,
    .package_details_wrapper .image-wrap .right-sec {
        margin-top: 0
    }

    .tempo_inner_section .tempo_slider .card {
        min-height: 336px
    }

    .hd-title .heading {
        font-size: 18px;
        line-height: 26px
    }
}

@media (max-width:500px) {

    #footer .fh5co-footer-link li a,
    .tri-adv p {
        font-size: 14px
    }

    .mob-slide,
    .tour_packages_mobile_banner img {
        display: block
    }

    .desk,
    .tour_packages_banner img {
        display: none
    }

    .pkg-slider .bottom,
    .prod_footer {
        display: flex
    }

    #fh5co-tours1 .row-bottom-padded-md {
        padding-bottom: 20px
    }

    .package-section .main-head,
    .pkg-wrap .pkg-slider .item img {
        width: 100%
    }

    .pkg-wrap .pkg-slider .slick-arrow {
        top: 50%;
        z-index: 99;
        width: 34px;
        height: 62px
    }

    .main-head {
        text-align: center
    }

    .pkg-wrap .pkg-slider .slick-next {
        right: -11px !important
    }

    .pkg-wrap .pkg-slider .slick-prev {
        left: -15px !important
    }

    .pkg-wrap .wrapper {
        margin: 0
    }

    footer {
        padding: 50px 18px
    }

    .pkg-slider .box {
        background: #e5e5e5
    }

    .pkg-wrap .caption-body {
        padding: 10px 16px !important;
        background: #f2f2f2
    }

    .pkg-slider .bottom a {
        width: 50%;
        text-align: center;
        display: block;
        background-color: var(--bg-primary);
        color: var(--white-color)
    }

    .pkg-slider .bottom a:nth-child(2) {
        background-color: var(--bg-black)
    }

    #fh5co-features {
        padding-bottom: 30px !important
    }

    .tri-adv p {
        font-weight: 500
    }

    .prod_footer {
        padding: 10px 20px;
        justify-content: center
    }

    #fh5co-destination-list li.one-forth {
        width: 50%
    }
}

@media (min-width:480px) and (max-width:767px) {
    .header_top .hs_right .mn .mobileNumber ul {
        display: flex;
        flex-direction: column;
        align-items: end;
        gap: 5px
    }

    .tour-slider .caption-body {
        min-height: 275px
    }

    .fh5co-tours>div.imagg {
        height: 260px
    }

    header img {
        width: 200px
    }

    header .info-list {
        margin: 0
    }

    nav .sf-menu a {
        padding: 15px 8px
    }

    #mobileNav ul li .mobileItem {
        padding: 10px 8px
    }

    .navbar-collapse {
        padding-left: 0;
        padding-right: 0
    }

    .tour_packages .heading_style2 {
        font-size: 22px
    }

    .fancy {
        --w: 30px;
        font-size: 20px
    }
}

@media (max-width:575px) {
    .vehicleSlider .slick-next {
        right: 0
    }

    .vehicleSlider .slick-prev {
        left: 0
    }

    .fancy {
        --w: 30px;
        font-size: 20px
    }

    .card-main-box,
    .card-parents,
    .images-gallery-box,
    .tempo_details .tempo_dest .destination_card .dest_slider,
    .three-card .card-parents {
        grid-template-columns: repeat(1, 1fr)
    }

    .card-main-box .card-box .img-box img,
    .tempo_details .tempo_dest .destination_card .dest_slider .item .box .fig img {
        height: auto !important
    }

    .car-rental-tour-list li a {
        font-size: 16px
    }
    .tour_packages .package_card .p_card_image{
        height: auto;
    }
    .vehicleWrapper {
        padding: 20px 0;
    }
}

@media (max-width:480px) {
    #footer .fh5co-footer-link .lineBarCode {
        justify-content: center
    }

    .col-xxs-12 {
        float: none;
        width: 100%
    }

    #fh5co-destination-list li.one-forth,
    #fh5co-destination-list li.one-half,
    #fh5co-destination-list li.one-third,
    #fh5co-destination-list li.two-third,
    .sliders,
    header img {
        width: 100%
    }

    .nav>li {
        display: inline-block;
        margin-left: 17px;
        width: 43%;
        font-size: 13px
    }

    .nav>li>a {
        display: inline
    }

    .sf-menu li {
        display: block;
        width: 100%
    }

    .footer-bottom .img-responsive {
        max-width: 100%
    }

    .sf-menu li.tripadvisor img {
        bottom: 220px
    }

    .header .info-list .space a {
        font-size: 12px
    }

    #fh5co-destination-list li,
    header .info-list li {
        margin-left: 0
    }

    .tabulation label {
        width: 40%
    }

    .tabulation input[type=text] {
        width: 55%;
        float: right
    }

    .tempo_slider_grid {
        grid-template-columns: repeat(1, 1fr)
    }
}

@media (min-width:320px) and (max-width:480px) {

    .logo a,
    .mobileNumber ul li {
        display: block
    }

    #tour-packages {
        margin: 20px 0
    }

    .header_top .hs_right .mn .mobileNumber ul {
        display: flex;
        flex-direction: column;
        align-items: end;
        gap: 5px
    }

    .mobileNumber ul li:last-child {
        margin-bottom: 0
    }

    .header_top .hs_right .mobileNumber a {
        font-size: 14px
    }

    header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-direction: column
    }

    .mobile-info,
    .mobileMenu {
        margin: 5px 3px
    }

    header img {
        width: 180px
    }

    header .info-list {
        margin: 0
    }

    .tour_packages_banner .pacakage_heading h1 {
        font-size: 18px;
        text-align: center
    }

    .tour_packages_banner .pacakage_heading .breadcrumb {
        width: 100%;
        padding: 2px 5px;
        margin-bottom: 0
    }

    .fh5co-tours>div.imagg {
        height: 260px
    }

    .carRentalDetails .view_all {
        text-align: center
    }

    .tour_packages .heading_style2 {
        font-size: 20px
    }

    .fancy {
        --w: 15px;
        font-size: 15px
    }

    .logo a {
        height: auto
    }
}

@media (max-width:320px) {
    .header_top .hs_right .mn .mobileNumber {
        display: flex;
        flex-direction: column
    }

    .header_top .logo a img {
        width: 100%
    }

    .main-head p,
    .pkg-slider .caption-body h3 {
        font-size: 16px
    }

    #fh5co-destination-list li .title-bg h3,
    .fh5co-tours>div .desc h3,
    .main-head .heading {
        font-size: 18px
    }

    .main-head .subtext {
        font-size: 14px
    }

    .pkg-slider .location {
        margin-bottom: 0;
        color: var(--primary-color)
    }

    .pkg-slider .bottom a {
        padding: 6px 8px
    }

    .fh5co-tours>div .desc,
    .prod-title p {
        padding: 10px
    }

    .fh5co-tours>div.imagg {
        height: 260px
    }

    .header_top .hs_right .mobileNumber a {
        font-size: 13px
    }
}

@media (min-width:280px) and (max-width:320px) {
    .fh5co-tours>div.imagg {
        height: 260px
    }
}