@import url("https://fonts.googleapis.com/css?family=Roboto");

/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */



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

Base styles: opinionated defaults

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



html,

button,

input,

select,

textarea {

    color: #222;

}



html {

    font-size: 1em;

    line-height: 1.4;

}



img {

    -webkit-user-select: none;

    -khtml-user-select: none;

    -moz-user-select: none;

    -o-user-select: none;

    user-select: none;

}

/*

* Remove text-shadow in selection highlight: h5bp.com/i

* These selection rule sets have to be separate.

* Customize the background color to match your design.

*/

::-moz-selection {

    background: #b3d4fc;

    text-shadow: none;

}



::selection {

    background: #b3d4fc;

    text-shadow: none;

}

/*

* A better looking default horizontal rule

*/



hr {

    display: block;

    height: 1px;

    border: 0;

    border-top: 1px solid #ccc;

    margin: 1em 0;

    padding: 0;

}

/*

* Remove the gap between images, videos, audio and canvas and the bottom of

* their containers: h5bp.com/i/440

*/



audio,

canvas,

img,

video {

    vertical-align: middle;

}

/*

* Remove default fieldset styles.

*/

fieldset {

    border: 0;

    margin: 0;

    padding: 0;

}

/*

* Allow only vertical resizing of textareas.

*/

textarea {

    resize: vertical;

}

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

Browse Happy prompt

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

ul,

ol,

p,

h1,

h2,

h3,

h4,

h5 {

    margin: 0;

    padding: 0;

}



ul,

li {

    list-style: none;

}



a {

    text-decoration: none;

    transition: all 0.6s ease-in-out;

}



body {

    margin: 0;

    padding: 0;

    background: #fff;

    color: #000;

    overflow-x: hidden;

    font-family: "Roboto", sans-serif;

    opacity: 0;

}



    body * {

        box-sizing: border-box;

    }



.container {

    width: 100%;

    float: left;

    overflow: hidden;

}



.logo {

    width: 100%;

    float: left;

    text-align: center;

    padding: 20px 0;

}



.banner {

    width: 108%;

    float: left;

    transform: skew(-10deg);

    position: relative;

    left: -5%;

    display: flex;

}



.mobileBanner {

    display: none;

}



.banner .box1 {

    width: 33.33%;

    height: 550px;

    border: 2px solid #fff;

    float: left;

    background: url(../images/New-Maruti-Ciaz.jpg) center top no-repeat;

    background-size: cover;

    transition: 0.8s;

    position: relative;

}



    .banner .box1 span {

        transform: skew(10deg);

        display: inline-block;

        position: absolute;

        z-index: 2;

        bottom: 50px;

        left: 0;

        right: 0;

        margin: auto;

    }



        .banner .box1 span a {

            width: 150px;

            padding: 12px 20px;

            color: #fff;

            font-size: 18px;

            border: 1px solid #fff;

            position: absolute;

            bottom: 0px;

            left: 50%;

            transform: translateX(-50%);

            text-transform: uppercase;

            opacity: 0;

            display: none;

        }



            .banner .box1 span a:hover {

                color: #fff;

                background: #000;

                border: 1px solid #000;

            }



    .banner .box1:hover {

        width: 70%;

    }



        .banner .box1:hover span a {

            opacity: 1;

        }



    .banner .box1.smallWidth {

        width: 15%;

        transition: 0.8s;

    }



.MotorCenterContainer {

    width: 80%;

    margin: 0 auto;

}



.premMotorsDescription {

    width: 100%;

    float: left;

    padding: 40px;

}



    .premMotorsDescription h1 {

        font-size: 42px;

    }



    .premMotorsDescription p {

        font-size: 14px;

    }



.contactCenterContainer {

    width: 100%;

    margin: 0 auto;

}



.contactUsContainer {

    width: 100%;

    float: left;

    background: #f1f1f1;

}



    .contactUsContainer .leftSection {

        width: 50%;

        float: left;

        padding: 40px;

    }



.button_gallery_section {

    width: 100%;

    float: left;

    margin: 30px 0;

}



    .button_gallery_section .navTabs {

        width: 100%;

        float: left;

        text-align: center;

        border-bottom: 9px solid #000;

    }



        .button_gallery_section .navTabs ul {

            position: relative;

            top: 0px;

        }



        .button_gallery_section .navTabs li {

            display: inline-flex;

        }



            .button_gallery_section .navTabs li a {

                /*width: 150px;*/

                float: left;

                text-transform: uppercase;

                font-size: 18px;

                padding: 8px 10px;

                background: #fff;

                color: #000;

            }



                .button_gallery_section .navTabs li a:hover {

                    background: #000;

                    color: #fff;

                }



                .button_gallery_section .navTabs li a.active {

                    background: #000;

                    color: #fff;

                }



    .button_gallery_section .tabContent {

        width: 100%;

        height: 350px;

        float: left;

        margin: 20px 0 0;

        overflow-y: scroll;

        overflow-x: hidden;

    }



#style-1::-webkit-scrollbar-track {

    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);

    border-radius: 10px;

    background-color: #f5f5f5;

}



#style-1::-webkit-scrollbar {

    width: 12px;

    background-color: #f5f5f5;

}



#style-1::-webkit-scrollbar-thumb {

    border-radius: 10px;

    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);

    background-color: #555;

}



.button_gallery_section .tabContent .tabContentContainer {

    width: 98%;

    float: left;

    margin-bottom: 2%;

    background: #fff;

    padding: 15px;

}



    .button_gallery_section .tabContent .tabContentContainer h4 {

        font-size: 15px;

        padding: 3px 0;

    }



    .button_gallery_section .tabContent .tabContentContainer p {

        font-size: 14px;

        color: #666;

    }



    .button_gallery_section .tabContent .tabContentContainer a {

        padding: 10px 20px;

        border: 1px solid #000;

        color: #000;

        margin-top: 10px;

        float: left;

        margin-right: 5px;

    }



        .button_gallery_section .tabContent .tabContentContainer a:hover {

            background: #000;

            color: #fff;

        }



.button_gallery_section .tabContent.ArenaSection {

    display: none;

}



.button_gallery_section .tabContent.TrueValueSection {

    display: none;

}

.button_gallery_section .tabContent.ServiceOutletsSection {

    display: none;

}

.contactUsContainer .rightSection {

    width: 50%;

    float: left;

    padding: 0px;

}



#map_wrapper {

    height: 600px;

}



#map_canvas {

    width: 100%;

    height: 100%;

    border-left: solid 5px #0c0c0c;

}



.socialContainer {

    width: 100%;

    float: left;

    background: #000;

    text-align: center;

    padding: 40px;

    display: none;

}



    .socialContainer h2 {

        font-size: 16px;

        color: #fff;

        padding: 0px 0 15px;

    }



    .socialContainer li {

        display: inline-block;

        padding: 0 5px;

    }



        .socialContainer li img {

            transition: 0.8s;

        }



        .socialContainer li:hover img {

            opacity: 0.5;

            transition: 0.8s;

        }



.footer {

    width: 100%;

    float: left;

    text-align: center;

    background: #0c0c0c;

    padding: 20px 0;

}



    .footer p {

        font-size: 12px;

        color: #8b8b8b;

    }



.popupContainer {

    width: 100%;

    height: 100vh;

    position: fixed;

    top: 0;

    left: 0;

    background: #000000a9;

    z-index: 9999;

    display: none;

}



.popup {

    width: 600px;

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    background: #fff;

    padding: 30px;

}



    .popup .closeIcon {

        position: relative;

    }



    .popup .closeIcon {

        position: absolute;

        top: 20px;

        right: 20px;

        cursor: pointer;

    }



    .popup h1 {

        font-size: 30px;

        padding: 10px 0;

    }



    .popup img {

        width: 100%;

    }



    .popup ul {

        width: 100%;

        float: left;

        margin: 15px 0;

    }



    .popup li {

        width: 100%;

        display: inline-block;

        margin: 10px;

    }



        .popup li a {

            width: 75%;

            display: block;

            padding: 8px 20px;

            font-size: 16px;

            font-weight: bold;

            color: #000;

            border: 3px solid #000;

            text-align: center;

            margin: 0 auto;

        }



            .popup li a:hover {

                background: #000;

                color: #fff;

            }



.mobileimage {

    display: none;

}



@media (max-width: 767px) {

    .inraboutgallery .galeryslider {

        display: block;

    }



    .inraboutgallery ul li {

        width: 50%;

    }

}



@media screen and (max-width: 1366px) {

    .button_gallery_section .tabContent .tabContentContainer {

        padding: 20px;

    }



    .button_gallery_section .navTabs li a {

        padding: 10px 20px;

        font-size: 18px;

    }



    .MotorCenterContainer {

        width: 90%;

    }

}



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

    .banner {

        width: 110%;

    }



    .contactUsContainer .leftSection {

        width: 50%;

    }



    .contactUsContainer .rightSection {

        width: 50%;

    }



    .button_gallery_section .navTabs li a {

        width: 130px;

        padding: 10px 0;

        font-size: 15px;

    }

}



.desktopButton {

    display: block;

}



.mobileButton {

    display: none;

}



@media screen and (max-width: 823px) {

    .popup {

        width: 100%;

    }



        .popup h1 {

            font-size: 18px;

        }



    .abt_team_section {

        padding-bottom: 0 !important;

    }



    .popup li a {

        padding: 7px;

        font-size: 12px;

    }



    .banner {

        display: block;

        width: 100%;

        transform: skew(0);

        left: 0;

    }



    .popup .closeIcon {

        position: absolute;

        top: 10px;

        right: 10px;

        cursor: pointer;

    }



    .banner .box1 .mobileimage {

        display: block;

        width: 100%;

    }



    .banner .box1 {

        width: 100%;

        height: auto;

    }



        .banner .box1:hover {

            width: 100%;

        }



        .banner .box1 span {

            bottom: 30px;

            transform: skew(0deg);

        }



            .banner .box1 span a {

                opacity: 1;

            }



    .mobileBanner {

        display: block;

        width: 100%;

        float: left;

        position: relative;

    }



        .mobileBanner img {

            width: 100%;

        }



        .mobileBanner span {

            width: 100%;

            float: left;

            position: relative;

        }



            .mobileBanner span a {

                padding: 7px 15px;

                color: #fff;

                font-size: 14px;

                border: 1px solid #fff;

                position: absolute;

                bottom: 20px;

                left: 50%;

                transform: translateX(-50%);

                text-transform: uppercase;

            }



                .mobileBanner span a:hover {

                    color: #fff;

                    background: #000;

                    border: 1px solid #000;

                }



    .MotorCenterContainer,

    .contactCenterContainer {

        width: 100%;

    }



    .contactUsContainer .leftSection {

        width: 100%;

    }



    .contactUsContainer .rightSection {

        width: 100%;

        display: none;

    }



    .button_gallery_section .tabContent .tabContentContainer {

        padding: 10px;

    }



        .button_gallery_section .tabContent .tabContentContainer h4 {

            font-size: 13px;

        }



        .button_gallery_section .tabContent .tabContentContainer p {

            font-size: 11px;

        }



    .desktopButton {

        display: none;

    }



    .mobileButton {

        display: block;

    }



    .banner .box1 span a {

        display: block;

        font-size: 14px;

        border: none;

        bottom: -23px;

        left: unset;

        right: -26px;

        transform: inherit;

    }

}



@media screen and (max-width: 567px) {

    .logo img {

        width: 200px;

    }



    .premMotorsDescription {

        padding: 20px;

    }



        .premMotorsDescription h1 {

            font-size: 25px;

        }



    .contactUsContainer .leftSection {

        padding: 20px;

    }



    .footer p {

        font-size: 9px;

    }



    .socialContainer {

        padding: 20px;

    }



    .button_gallery_section .navTabs li {

        margin: 8px 0;

    }



        .button_gallery_section .navTabs li a {

            width: 100px;

            padding: 10px 8px;

            font-size: 12px;

        }



    .button_gallery_section .tabContent .tabContentContainer {

        width: 100%;

        margin-bottom: 10px;

    }



    .inraboutgallery .galeryslider {

        display: block;

    }



    .inraboutgallery ul li {

        width: 50%;

    }

}



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

    .premMotorsDescription h1 {

        font-size: 22px;

    }



    .premMotorsDescription p {

        font-size: 14px;

    }

}



.abt_team_section .owl-stage {

    margin: 0 auto;

}



.abt_team_section {

    width: 100%;

    float: left;

    padding: 40px 0;

}



.team_carousel .team_item {

    background-color: #000;

    text-align: center;

    padding: 25px 15px;

}



    .team_carousel .team_item .team_img {

        width: 160px;

        display: inline-block;

        height: 150px;

        overflow: hidden;

        border: 1px solid #cbdcf0;

        margin-bottom: 20px;

    }



        .team_carousel .team_item .team_img > img {

            width: 100%;

        }



    .team_carousel .team_item h4 {

        color: #e5f3fc;

        font-size: 18px;

        font-weight: 700;

        padding-bottom: 10px;

        line-height: normal;

        min-height: 76px;

    }



        .team_carousel .team_item h4 span {

            display: block;

        }



    .team_carousel .team_item p {

        color: #e5f3fc;

        font-size: 14px;

        line-height: 25px;

        padding-bottom: 20px;

    }



    .team_carousel .team_item h6 {

        color: #e5f3fc;

        font-size: 14px;

        font-weight: 700;

        padding-top: 10px;

    }



        .team_carousel .team_item h6 a {

            color: #e5f3fc;

            font-size: 14px;

            font-weight: 700;

        }



    .team_carousel .team_item .cont {

        max-height: 235px;

    }



.team_carousel .mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail {

    background-color: #8f9cc3;

}



.team_carousel .mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {

    background-color: #e5f3fc;

}



.team_carousel .mCSB_scrollTools {

    opacity: 1;

}



.team_carousel .mCustomScrollBox {

    padding-right: 20px;

}



.team_carousel .owl-nav {

    text-align: center;

    padding-top: 30px;

    display: none;

}



    .team_carousel .owl-nav [class*="owl-"] {

        position: static;

        color: #000;

        display: inline-block;

        margin: 0 0;

        vertical-align: top;

    }



        .team_carousel .owl-nav [class*="owl-"] .fa {

            line-height: 38px;

            font-size: 0;

        }



    .team_carousel .owl-nav .owl-next {

        right: 0;

        position: relative;

    }



    .team_carousel .owl-nav .owl-prev {

        left: 0;

        position: relative;

    }



        .team_carousel .owl-nav .owl-prev::after {

            display: inline-block;

            vertical-align: top;

            content: "\f053";

            font-size: 22px;

            position: static;

            left: 0;

            top: 0;

            color: #000;

            font-family: "FontAwesome";

        }



    .team_carousel .owl-nav .owl-next::after {

        content: "\f054";

        display: inline-block;

        vertical-align: top;

        font-size: 22px;

        position: static;

        right: 0;

        top: 0;

        color: #000;

        font-family: "FontAwesome";

    }



.award_section {

    background-color: #e9e9e9;

    padding: 50px 0;

}



.award_carousel .award_item {

    text-align: center;

    padding: 0 20px;

}



    .award_carousel .award_item .award_img {

        display: inline-block;

        width: 120px;

        margin-bottom: 20px;

    }



    .award_carousel .award_item p {

        font-size: 18px;

        color: #3a3a3a;

        line-height: normal;

    }



.award_carousel .owl-nav {

    text-align: center;

    padding-top: 30px;

}



    .award_carousel .owl-nav [class*="owl-"] {

        position: static;

        color: #979cc0;

        display: inline-block;

        vertical-align: top;

        margin: 0;

    }



        .award_carousel .owl-nav [class*="owl-"] .fa {

            line-height: 38px;

            font-size: 0;

        }



    .award_carousel .owl-nav .owl-next {

        right: 0;

        position: relative;

    }



    .award_carousel .owl-nav .owl-prev {

        left: 0;

        position: relative;

    }



        .award_carousel .owl-nav .owl-prev::after {

            display: inline-block;

            vertical-align: top;

            content: "\f053";

            font-size: 22px;

            position: static;

            left: 0;

            top: 0;

            color: #000;

            font-family: "FontAwesome";

        }



    .award_carousel .owl-nav .owl-next::after {

        content: "\f054";

        display: inline-block;

        vertical-align: top;

        font-size: 22px;

        position: static;

        right: 0;

        top: 0;

        color: #000;

        font-family: "FontAwesome";

    }



.main_heading {

    text-align: center;

    padding-bottom: 30px;

}



    .main_heading h2 {

        color: #000;

        font-size: 46px;

        margin-top: 20px;

    }



.no-js .owl-carousel,

.owl-carousel.owl-loaded {

    display: block;

}



.owl-carousel {

    width: 100%;

    z-index: 1;

}



    .owl-carousel,

    .owl-carousel .owl-item {

        -webkit-tap-highlight-color: transparent;

        position: relative;

        float: left;

    }



        .owl-carousel .owl-dots.disabled,

        .owl-carousel .owl-nav.disabled {

            display: none;

        }



        .owl-carousel.team_carousel .owl-wrapper {

            text-align: center;

            margin: 0 auto;

            float: none;

        }



        .owl-carousel.team_carousel .owl-item {

            float: none;

            display: inline-block;

            margin: 0 15px;

        }



/*#our-team-slider {

    display: none;

}
*/


.owl-carousel-noslide {

    float: left;

    width: 100%;

    text-align: center;

}



    .owl-carousel-noslide .item {

        width: 25%;

        padding: 0 5px;

        box-sizing: border-box;

        float: none;

        display: inline-block;

        vertical-align: top;

    }



    .owl-carousel-noslide .team_item-custom {

        width: 100%;

    }



/*30-july-our-teams-slider*/

.team_item-custom {

    text-align: center;

    background: #fff;

    height: auto;

    color: #000;

/*    width: 80%;*/

    margin: 0 auto;

    padding: 15px 15px;

    border-radius: 3px;

}



    .team_item-custom .team_img {

        display: block;

        text-align: center;

/*        margin: 15px;*/

    }



        .team_item-custom .team_img img {

            width: 100%;

        }



    .team_item-custom h4 {

        font-size: 18px;

        display: block;

        margin: 0px 15px;

        line-height: 31px;

    }



        .team_item-custom h4 span {

            display: block;

        }



div#our-team-slider .owl-buttons {

    position: absolute;

    top: 45%;

    width: 100%;

    z-index: 99;

    padding: 0 20px;

    box-sizing: border-box;

}



    div#our-team-slider .owl-buttons .owl-next {

        float: right;

    }



.owl-controls .owl-page,

.owl-controls .owl-buttons div {

    color: #fff;

    display: inline-block;

}



    .owl-controls .owl-page,

    .owl-controls .owl-buttons div .fa {

        font-size: 25px;

    }

/*30-july-our-teams-slider*/



.dealer_width {

    width: 96% !important;

}



    .dealer_width h4 {

        font-size: 14px !important;

        min-height: 100px;

    }



    .dealer_width .team_img img,

    .team_item-custom .team_img img {

        height: 100%;

    }



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

    div#our-team-slider .owl-buttons {

        display: none;

    }

}



.d-none {

    display: none;

}