/*===================================================

    Media Query

====================================================*/



/* Tablet Devices */

@media (max-width: 992px) {

    .padding{ padding: 50px 0; }

    .sm-padding{ padding: 15px; }

    p br{ display: none; }

    span br{ display: none; }

    .default-btn{ padding: 0 30px; }

    .section-heading h2{

        font-size: 32px;

        line-height: 42px;

    }

    .section-heading br{ display: inherit; }

    .grid-post{ margin: 0; }

    .about-info{

        display: block;

        column-gap: 20px;

    }

    .about-info li h2{margin-top: 25px;}

    .about-img:before{

        right: 90px; 

        bottom: 0;

    }

    .about-img .about-img1 {

        transform: translate(-35px, -40px);

    }

    .about-img .about-img2 {

        right: 30px;

        bottom: -100px;

    }

    .service-section .bg-half{

        height: 496px;

    }

    .swiper-outside .swiper-nav{ display: none; }

    .booking-car,

    .booking-section:before{ display: none;}

    .booking-section:after {

        clip-path: polygon(0 0, 100% 0%, 100% 100%, 20% 100%);

        height: 60px;

    }

    .booking-wrap .section-heading h2{ font-size: 32px; }

    .taxi-holder{

        background-image: none;

    }

    .taxi-holder .mockup,

    .location-marker,

    .taxi-holder .taxi,

    .taxi-holder .charecter{

        display: none;

    }

    .testimonial-section{ padding: 50px 0; }

    .feature-wrap{

        margin-left: 0;

        padding: 50px;

        margin-top: 80px;

    }

    .footer-call p span{

        display: inline-block;

        font-size: 32px;

        line-height: 1;

        margin-bottom: 0;

        margin-right: 20px;

    }

    .cta-men{ display: none; }

    .cta-content h2{ font-size: 36px; }

    .cta-section{ clip-path: inherit; }

    .cta-content{ text-align: center; }

    .cta-content .cta-call{ justify-content: center; }

    .cta-content .cta-call p span{ text-align: left; }

    .booking-form-2{margin-bottom: 50px;}

    .cta-section-2 .cta-content {

        text-align: left;

        margin-bottom: 35px;

        width: 50%;

    }

    .cta-section-2 .cta-men{

        display: block;

        background-size: 90%;

        right: 10px;

        

    }

    .page-header-shape{

        width: 30%;

        height: 60px;

    }

    .page-header-shape:after{ height: 45px; }

    .video-box-inner > img{display: block;}

    .taxi-details .section-heading{margin-top: 40px;}

    .driver-details{ margin-top: 40px; }    

    .testimonial-section-2 .testi-pagination .swiper-pagination{

        bottom: -20px;

    }

    .contact-form-group .default-btn{ font-size: 14px; }



}



/* Mobile Devices */

@media all and (max-width: 768px) {

    .padding{ padding: 50px 0; }

    .xs-padding{ padding: 15px; }

    .section-heading p br,

    br{ display: none; }

    .section-heading h2{

        font-size: 24px;

        line-height: 34px;

    }

    .about-img{

        margin-bottom: 80px;

        margin-top: 15px;

    }

    .about-img:before {

        right: 75px;

        bottom: -35px;

        height: calc(100% + 50px);

    }

    .about-img .about-img1 {

        max-width: 240px;

        transform: translate(20px, 10px);

    }

    .about-img .about-img2 {

        right: 15px;

        bottom: 30px;

    }

    .service-section .bg-half{

        height: 547px;

    }

    .booking-form{

        grid-template-columns: 1fr;

    }

    .booking-section:after{ display: none; }

    .booking-wrap .section-heading h2{ font-size: 24px; }   

    

    .cta-content h2 {

        font-size: 24px;

        line-height: 32px;

    }

    .cta-content .cta-call p a{ font-size: 22px; }

    .footer-top .brand:before{

        clip-path: inherit;

    }

    .footer-top-wrap{

        background-color: #222;

        overflow: hidden;

    }

    .footer-call p span,

    .footer-call p a{

        font-size: 20px;

    }

    .footer-top .brand{

        display: block;

        padding: 50px 30px;

    }

    .footer-top .brand p{

        padding: 0;

        margin-top: 20px;

    }

    .footer-top .brand p:before{

        display: none;

    }

    .footer-mid-wrap{

        padding: 50px 0 100px 0;

    }

    .main-slider-2 .swiper-nav{ display: none; }

    .booking-form-2 .col-lg-8{

        padding: 50px 20px;

    }

    .booking-form-2{clip-path: none;}

    .cta-section-2:before,

    .cta-section-2 .cta-content{width: 100%;}

    .cta-section-2 .cta-men{display: none;}

    .page-header-shape {

        width: 40%;

        height: 50px;

    }

    .page-header-shape:after {

        height: 35px;

        left: -100px;

    }

    .service-details-list,

    .service-features{ grid-template-columns: 1fr; }

    .service-details-list > div{ margin-top: 20px; }

    .taxi-details-img img {

        margin-left: 0;

        margin-top: 30px;

    }

    .taxi-details-img .price{

        right: 35px;

        top: 10px;

    }

    .taxi-features{grid-template-columns: 1fr;}

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

    .contact-form-group{

        display: block;

    }

    .contact-form-group .form-field:not(:last-of-type){

        margin-bottom: 20px;

    }

    .contact-section .contact-details li{display: block;}

    .contact-section .contact-details li i{

        display: block;

        margin-bottom: 15px;

    }

    

}



@media all and (max-width: 580px) {

    #scrollup {

        bottom: 20px;

        right: 20px;

    }

    .pricing-tab-menu li:not(:last-of-type) {

        padding-right: 25px;

    }

    .pricing-tab-menu li:not(:last-of-type):before {

        width: 15px;

        right: 5px;

    }

    #pricing-tab-content .tab-pane{

        margin-top: 15px;

    }

    .app-feature li:not(:last-of-type){

        margin-bottom: 20px;

    }

}


@media (min-width: 320px)and (max-width:400px) {
    .video-box {

        width: 100%;
        position: relative;
        left: 3px !important;
        bottom: 0;
        top: -114px !important;

    }
}

@media (min-width: 401px)and (max-width:767px) {
    .video-box {

        width: 250px;
    border-radius: 5px;
    position: absolute;
    left: 28%;
    top: 0;
    bottom: 0;

    }
}