:root {
    /* --primary: #935E10    #fdf98d */
    --primary: #DFB62C;
    --primaryTwo: #DFB62C;
    --primary-hov-dark: #d2a920;
    --primary-hov-light: #bba53d;
    --primary-grad: linear-gradient(220deg, rgba(124,75,8,1) 0%, rgba(199,150,45,1) 100%);
    --white: #fff;
    --black: #0a0802;
    --gray: #6c757d;
    --gray-dark: #343a40;
    --dark: #253241;
    --black-light: #151618;
    --text-gray: #8b9097;
    --font-family-heading: 'Montserrat', sans-serif;
    --font-family-para: 'Lato', sans-serif;
}
@media only screen and (max-width:1034px){
    .header-el .info-container .left-top-header-con .widget .social-media ul li a{
        font-size: 13px;
    }
    .header-el .info-container .left-top-header-con .widget .social-media ul li{
        margin-right: 2px;
        padding: 8px;
    }
}

/*---------------Tablet DEVICE--------------- */
@media only screen and (max-width: 991px){
    .header-el .el-top-header-content div#custom_html-6{
        display: none;
    }
    .navbar-nav a.nav-link{
        color: var(--black);
    }
    .header-el .el-bottom-header-conten .navbar .header-contact .header-contact-inner a{
        color: var(--black);
    }
    #herosection .hero-text-con .content-con h2{
        font-size: 30px;
        text-align: left;
    }
    #herosection .hero-text-con .content-con p{
        padding-left: 0 !important;
        text-align: left;
    }
    #herosection{
        height: 75vh;
    }
    .hero-sec-form-con{
        margin-top: -200px;
        margin-bottom: 100px;
    }
    #herosection .hero-text-con{
        padding:3% 80px 5%;
        height: 100%;
    }
    #ourServices .card .serCardHeading h2{
        font-size: 24px;
    }
    #ourServices .card .serCardHeading img{
        width: 30px;
        height: 30px;
    }

    #ourServices .card .serCardPara , #ourServices .card .serCardbtn{
        display: block;
        animation:fadeInUp .5s ease backwards;
        animation-delay: .3s
    }
    #ourServices .card .overlay{
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        left: 0;
        background-color: rgba(0, 0, 0, .6);
        transition: .3s all ease-in-out;
    }
    .mtnv65{
        margin-top: 20px !important;
    }
    .revonmb{
        flex-direction: column-reverse;
    }
    .booking-page .form-navigation ul li > div{
        left: 71%;
    }
    .about-page .howWeWork-sec div[class*='col-12'] .hww-con .icon-box::after{
        left: 70px;
    }
    .about-page .howWeWork-sec .dotimg.mdpynon::after{
        content: "";
    }
    #section_counter .counter-item{
        margin-bottom: 25px;
    }
}

@media only screen and (min-width:599px){
    .homepage .cars-sec #carselection{
        display: none;
    }
}
@media only screen and (max-width:599px){
    .homepage .owl-nav{
        position: absolute;
        top: -55px;
        right: -60px;
        display: flex;
    }
    .homepage .owl-nav button span{
        font-size: 18px;
    }
    .homepage .cars-sec .owl-carousel .owl-nav button.owl-next, .cars-sec .owl-carousel .owl-nav button.owl-prev {
        padding: 0px !important;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 45px;
        height: 45px;
    }
    .cars-sec .carsnav {
        display: none;
    }
}


@media  only screen and (max-width:500px) {
    #herosection{
        height: 80vh;
    }
    #herosection .hero-text-con{
        background-image: none;
        position: relative;
        z-index: 1;
    }
    /*#herosection .hero-text-con{
        background-image: url(../imgs/base-1.png);
        background-size: 100%;
        background-repeat: no-repeat;
        padding:20% 20px 5%;
        z-index: 0;
    }*/
}

@media only screen and (max-width: 767px) and (min-width: 576px)  {
    #herosection .hero-text-con{
        padding: 5% 80px 5% !important;
    }
}
@media only screen and (max-width: 576px) and (min-width: 501px)  {
    #herosection .hero-text-con{
        padding: 5% 130px 5% 80px !important;
    }
}


/*---------------MOBILE DEVICE--------------- */
@media only screen and (max-width:767px) {
    .header-el .info-container::before,
    .header-el .info-container::after,
    .header-el .el-top-header-content div#custom_html-2,
    .header-el .el-top-header-content div#custom_html-6{
        display: none;
    }
    .header-el .info-container.offset-2{
        margin-left: 0 !important;
    }
    .header-el .info-container .right-top-header-con a.header-btn{
        font-size: 12px;
        padding: 0 15px;
    }
    .header-el .info-container .right-top-header-con .header-btn.veh{
        padding: 0 30px;
    }
    #herosection .hero-text-con .content-con h2{
        font-size: 24px;
        text-align: left;
        margin: 0px 0px 10px 0px;
    }
    #herosection .hero-text-con{
        padding: 13% 40px 5%;
        height: 100%;
    }
    .hero-sec-form-con .oneRe-form-container{
        z-index: 2;
    }
    .hero-sec-form-con{
        margin-top: -215px;
    }
    #aboutsec .about-content-con{
        margin-bottom: 15px;
    }
    #whyChoose .whyChoosebg{
        padding: 132px 15px;
    }
    #whyChoose .whyChooseContent{
        padding: 64px 25px;
    }
    #reviewSection .testimonal-col{
        padding: 70px 40px 70px 40px;
    }
    #reviewSection .testimonal-col h2{
        font-size: 18px;
    }
    #reviewSection .testimonial-cta{
        margin-top: 50px;
    }
    .booking-page .form-navigation ul{
        padding: 0 !important;
    }
    .booking-page .form-navigation ul li > div.secondline{
        display: none;
    }
    .booking-page .form-navigation ul li > div{
        width: 85%;
        left: 64%;
    }
    .mtnv65{
        margin-top: 30px !important;
    }
    .booking-page .vehicles-con .single-veh-con .veh-desc .top-desc .name span{
        font-size: 20px;
        font-weight: 600;
        margin-bottom: 8px;
        display: inline-block;
    }
    .booking-page .vehicles-con .single-veh-con .veh-desc .top-desc button{
        width: 100%;
        justify-content: center;
        margin-bottom: 8px;
    }
    .booking-page .vehicles-con .single-veh-con .veh-desc .top-desc{
        flex-direction: column;
        justify-content: center !important;
    }
    .revonmb{
        flex-direction: column-reverse;
    }
    /* .homepage .vehiclesPage .owl-carousel.allCarsCarousel .owl-item{
        width: 324.75px !important;
    } */
    .cars-sec #nav-allCars,
    .cars-sec #nav-coach,
    .cars-sec #nav-stylish{
        max-width: 72% !important;
        margin: 0 auto;
    }
    .cars-sec .nav-tabs button.nav-link{
        margin-bottom: 10px;
    }
    .about-page .benefits-sec .bf-icon-box .bf-icon-box-inner{
        margin-bottom: 12px;
    }
    .about-page .howWeWork-sec .dotimg::after{
        left: 50%;
        top: -17px;
        transform: rotate(90deg);
    }
    .about-page .howWeWork-sec .dotimg.mdpynon::after{
        content: url(../imgs/icons/arrow.png);
        display: block;
        position: absolute;
    }
    .about-page .howWeWork-sec .heading h2{
        font-size: 32px;
    }
    .about-page .howWeWork-sec .heading{
        max-width: 90%;
    }
    .about-page .howWeWork-sec div[class*='col-12'] .hww-con .icon-box::after{
        left: 150px;
        top: 35px;
    }
    .about-page .howWeWork-sec .hww-con .icon-box .content{
        width: 55%;
        margin: 0 auto;
    }
    .about-page .aboutSection .rightsec{
        margin: 15px 30px;
    }
    .hero-sec-form ul li{
        width: 50%;
    }
    .hero-sec-form ul li button.nav-link{
        width: 100% !important;
    }
}



/* ---------------Extre Small Devices----------------- */
@media only screen and (max-width:576px){
    .about-page .aboutSection .img-video-wrapper .video-icon-wrapper{
        bottom: 6px;
        right: 36px;
    }
    #section_counter .counter-item{
        margin-bottom: 25px;
    }
    .about-page .howWeWork-sec .heading h2{
        font-size: 24px;
    }
    .about-page .howWeWork-sec .heading{
        max-width: 90%;
    }
    .vehiclesPage .vehicles-sec .filterbtnCon{
        padding: 10px 30px;
    }
}