/*!
 * KLEZCAR CSS
 * Copyright 2020 Bootstrap
 * Licensed under MIT (https://github.com/StartBootstrap/startbootstrap-small-business/blob/master/LICENSE)
 */

 .container, .container-fluid, .container-lgx, .container-lg, .container-md, .container-sm {
     width: 100%;
     padding-right: 30px;
     padding-left: 30px;
     margin-right: auto;
     margin-left: auto;
 }

body {
  font-family: Roboto, sans-serif;!
  padding-top: 56px;
  background-color: #fff!important;
}

.navbar-brand {
  margin-right: 0px!important;
}

header {
    font-family: Roboto, sans-serif;
    background-color: #f0f1f3!important;
}

.navbar-dark .navbar-toggler {
    color: rgb(56 62 67);
    border: 0px;
}

header a.active {
    color : #1a11d8!important;
    font-weight: bold;
}

header .btn-signup {
    padding: 6px 16px;;
}

.top-section-margin {
    margin-top: 120px;
}
/*
* =====================================================
*     NAVBAR
* =====================================================
*/
nav.navbar {
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
  background-color: #f0f1f3!important;
}

nav.navbar.active {
  background: #f0f1f3;
  -webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.08);
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.08);
}

nav.navbar .dropdown-menu {
  margin-top: 1.4rem;
}

.navbar {
  padding: 1.1rem 1rem;
}
.nav-link {
    font-family: Roboto,sans-serif;
    font-size: 16px;
    font-weight: 300;
    margin: 0px 20px;
    padding: 0px;
    color : #000000!important;
}

.nav-link:hover {
    color : #1a11d8!important;
}

.lang:hover {
   color : #1a11d8!important;
}

/* NAVBAR MEDIAQUERY */
@media (min-width: 1013px) {
  nav.navbar {
    background: #fff;
    /* -webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.08); */
    /* box-shadow: 0 2px 3px rgba(0, 0, 0, 0.08); */
  }
  nav.navbar .dropdown-menu {
    -webkit-box-shadow: none;
    box-shadow: none;
    margin-top: 0;
    margin-bottom: 1rem;
  }
}

.container .header {
    font-family: Kufam,sans-serif;
    font-weight: 800;
    font-size: 44px;
}

.container .sub_header {
    font-family: Roboto,sans-serif;
    font-size: 20px;
    font-weight: 400;
}

.btn-primary {
    border-radius: 12px;
}

.btn-secondary {
    border-radius: 12px;
}

.text-secondary {
  color: #f8663c !important;
}

.btn-signup {
    padding: 5px 25px;
}

.bg-gray {
    background-color: #f0f1f3!important;
}

.bg-footer {
    background-color: #383e43!important;
}

.btn-link {
    color : #000;
    font-family: Roboto,sans-serif;
    font-weight: 500;
}

text-black {
    color : #000;
}

text-gray {
    color : #f0f1f3;
}

.nav-item.active .nav-link {
    font-weight: 600;
}

.nav-item.active::after {
  content: "";
  width: auto;
  height: 4px;
  background-color: #f8663c;
  left: 0;
  position: relative;
  display: block;
  margin: 0 20px;
  border-radius: 20px;
}

.select2 {
    border-radius: 0px !important;
}



/* Footer */
footer {
    font-family: Roboto, sans-serif;
}
.footer-slogan {
    font-style: italic;
    letter-spacing: 0.05em;
    font-weight: 300;
    font-size: 12px;
}

.footer-details {
    font-style: italic;
    font-size: 14px;
    letter-spacing: 0.05em;
    font-weight: 300;
}

.footer-details > span {
    font-weight: 400;
}

.footer-copyright {
    font-style: italic;
    font-size : 12px;
    letter-spacing: 0.05em;
    font-weight: 300;
}

.footer-link {
    color : #fff;
    font-weight : 200!important;

}
/* GLOBAL MAIN */
.main .form-control {
    border: 0px solid;
    border-bottom: 1px solid #ced4da;
    border-radius: 0px;
}
.main .form-group {
    margin-bottom: 0px;
}

/* GLOBAL SECTION CTA */
.section-cta .description {
    background-color: #f5d60c!important;
}


/* GLOBAL SECTION DOWNLOAD APP */
.section-download-app {
    background-color: #f8663c;
    font-family: Roboto, sans-serif;
}

/* On screens that are 0px or less, */
@media (min-width: 0px) {
    .carousel-indicators {
        bottom : -10px;
    }

    .carousel-indicators li {
        box-sizing: content-box;
        flex: 0 1 auto;
        width: 30px;
        height: 3px;
        margin-right: 3px;
        margin-left: 3px;
        text-indent: -999px;
        cursor: pointer;
        background-color: #b9c3cb;
        background-clip: padding-box;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        opacity: 0.5;
        transition: opacity 0.6s ease;
    }

    .navbar-brand img {
        width: 120px!important;

    }
    .main {
       font-family: Roboto, sans-serif;
       padding: 6.8rem 0;
       background-size: auto;
       background-position-x: 390px!important;
       background-position: bottom;
       background-color: #f0f1f3!important;
       height: 740px;
    }

    .main .lead {
        font-weight: 400;
        font-size : 16px;
    }

    .main .hero-heading {
        font-family: Kufam,sans-serif!important;
        font-weight: 900;
        font-size: 27px!important;
    }

    .main .apps {
        width : 109px!important;
    }

    .search-bar {
        border-radius: 12px;
        background: #fff;
        -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
        box-shadow: 0 0 11px rgb(0 0 0 / 33%);
        padding-left: 20px;
        padding-right: 20px;
        margin-top : 50px!important;
    }

    .main .btn-booknow {
        border-radius: 16px;
        display: block;
        justify-content: center;
        font-size: 20px;
        width: 100%;
        height: 64px;
        margin-top : 10px;
        margin-bottom: 10px;
        margin-left: 10px;
        margin-right: 10px;
    }

    /* Section how-it-works  */
    .section-how-it-works {
        background-color: rgb(210 209 209 / 13%)!important;
    }

    .section-how-it-works .header {
        font-family : Kufam, sans-serif;
        font-weight: 700;
        font-size : 32px;
    }

    .section-how-it-works .sub-header {
        font-size : 20px;
        font-weight: 300;
        color : #777e85!important;
    }

    .section-how-it-works img {
        width :238px!important
    }

    .section-how-it-works .step-header {
        font-family : Kufam, sans-serif;
        font-weight: 700;
        color : #f8663c;
        font-size : 20px;
    }

    .section-how-it-works .step-description {
        font-weight: 400;
        font-size : 16px;
        color : #60676d!important;
    }

    /* Section car  */
    .section-car {
        background-color: #fff;
    }

    .section-car .header {
        font-weight: bold;
        font-size: 32px;
        font-family : Kufam, sans-serif;
        font-weight: 700;
    }

    .section-car .sub-header {
        font-weight: 300;
        font-size: 20px;
        color : #777e85!important;
    }

    .section-car .type {
        color: white;
        font-weight: 500;
        border: 1px solid;
        padding: 5px 10px;
        border-radius: 9px;
    }

    .section-car .title {
        font-size: 12px;
        padding: 5px 10px;
    }

    .section-car .brand {
        font-weight: 500;
        font-size : 16px;
        width: 100px;
    }

    .section-car .name {
        font-weight: 500;
        width: 100px;
        font-size : 12px;
    }

    .section-car .pricing {
        text-align: right;
        padding-right: 29px;
    }

    .section-car .price {
        font-family : Kufam, sans-serif;
        font-weight: 700;
        font-size : 18px;
        color : #f5d60c;
    }

    .section-car .header-pricing {
        font-family : Kufam, sans-serif;
        font-weight: 700;
        font-size : 24px;
        color : #383e43;
    }

    .section-car .img-orang {
        width: 173px!important;
        display: initial!important;
    }

    .section-car .img-car {
        width: 110%!important;
    }

    .section-car .card-check-price {
        /* display: flex!important; */
        padding: 12px!important;
    }

    .section-car .card-check-price .inline {
        margin-right: auto!important;
        padding: 15px 0px 0px 30px;
    }
    .section-car .btn-check-pricing {
        padding: 13px 31px!important;
        border-radius: 22px;
    }

    /* Section cta to action */
    .section-cta .header {
        font-size: 32px;
        font-weight: bold;
        color: #383e43!important;
        text-align: center!important;
        margin-bottom: 20px;
    }

    .section-cta .sub-header {
        font-size: 20px;
        font-weight: normal;
        text-align: center!important;
        color: #383e43!important;
    }

    .section-cta span {
        font-size: 12px;
        padding: 0px 10px;
    }

    .section-cta .header-usp {
        font-family: Kufam, sans-serif!important;
        font-weight: normal!important;
        font-size: 20px!important;
    }
    .section-cta {
        font-size: 16px!important;
    }

    .section-cta .btn-booknow {
        font-size : 16px;
        font-weight: 600;
        border-radius: 16px;
        display: flex;
        justify-content: center;
        padding: 6px 26px;
    }

    .section-cta .img-cta {
        height: 321px;
        object-fit: cover!important;
        width: inherit;
    }

    .section-cta .row-upper {
        display: flex !important;
        flex-direction: column-reverse !important;
    }

    /* Section referral  */
    .section-referral {
        background: url(../../img/landing/svg/joinus-biggerthan-1336.svg) no-repeat;
        background-size: 610px;
        background-position: right bottom;
        height: 582px;
        font-family: Roboto, sans-serif;
        color: #383e43!important;
    }

    .section-referral h1 {
        font-family: Kufam, sans-serif;
        font-weight: bold;
        font-size: 36px;
    }

    .section-referral h4 {
        font-weight: 300;
        font-size: 24px;
    }

    .section-referral span {
        font-size: 20px;
        padding: 0px 10px;
    }

    .section-referral .btn-referral {
        font-weight: 400;
        padding: 10px 26px;
        display: block;
        margin-bottom: 1em;
    }

    .section-referral .btn-partner {
        font-weight: 400;
        padding: 10px 26px;
        display: block;
        margin-bottom: 1em;
    }

    /* Section Donwload App */
    .section-download-app h1 {
        font-weight: bold;
        font-family: Kufam, sans-serif;
        font-size: 32px;
        /* width: 628px; */
    }

    .section-download-app h4 {
        font-weight: 300;
        font-size: 24px;
    }

    .section-download-app .img-download {
        width: 260px;
        height: 310px;
        margin-top : 2em;
    }

    .section-download-app .row-upper {
        display: flex !important;
        flex-direction: column-reverse !important;
        text-align: center!important;
    }
}

/* On screens that are 480px or less, */
@media (min-width: 480px) {

    .main {
       font-family: Roboto, sans-serif;
       padding: 3.5rem 0;
       /* background: url(../../img/landing/svg/desktop-bg-medium.svg) no-repeat; */
       background-size: auto;
       background-position-x: 390px!important;
       background-position: bottom;
       background-color: #f0f1f3!important;
       height: 600px;
       margin-top : 50px;
    }

    .main .lead {
        font-weight: 400;
        font-size : 16px;
    }

    .main .hero-heading {
        font-family: Kufam,sans-serif!important;
        font-weight: 900;
        font-size: 27px!important;
    }

    .main .apps {
        width : 109px!important;
    }

    .search-bar {
        border-radius: 12px;
        background: #fff;
        -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
        box-shadow: 0 0 11px rgb(0 0 0 / 33%);
        padding-left: 20px;
        padding-right: 20px;
        margin-top : 50px!important;
    }

    .main .btn-booknow {
        border-radius: 12px;
        display: block;
        justify-content: center;
        font-size: 20px;
        width: 100%;
        margin-top : 10px;
        margin-bottom: 10px;
    }

    /* Section how-it-works  */
    .section-how-it-works .header {
        font-family : Kufam, sans-serif;
        font-weight: 700;
        font-size : 32px;
    }

    .section-how-it-works .sub-header {
        font-size : 20px;
        font-weight: 300;
        color : #777e85!important;
    }

    .section-how-it-works img {
        width :238px!important
    }

    .section-how-it-works .step-header {
        font-family : Kufam, sans-serif;
        font-weight: 700;
        color : #f8663c;
        font-size : 20px;
    }

    .section-how-it-works .step-description {
        font-weight: 400;
        font-size : 16px;
        color : #60676d!important;
    }

    /* Section car  */
    .section-car {
        background-color: #fff;
    }

    .section-car .header {
        font-weight: bold;
        font-size: 32px;
        font-family : Kufam, sans-serif;
        font-weight: 700;
    }

    .section-car .sub-header {
        font-weight: 300;
        font-size: 20px;
        color : #777e85!important;
    }

    .section-car .type {
        color: white;
        font-weight: 500;
        border: 1px solid;
        padding: 5px 10px;
        border-radius: 9px;
    }

    .section-car .title {
        font-size: 12px;
        padding: 5px 10px;
    }

    .section-car .brand {
        font-weight: 500;
        font-size : 18px;
        width: 100px;
    }

    .section-car .name {
        font-weight: 500;
        width: 100px;
        font-size : 12px;
    }

    .section-car .pricing {
        text-align: right;
        padding-right: 29px;
    }

    .section-car .price {
        font-family : Kufam, sans-serif;
        font-weight: 700;
        font-size : 17px;
        color : #f5d60c;
    }

    .section-car .header-pricing {
        font-family : Kufam, sans-serif;
        font-weight: 700;
        font-size : 24px;
        color : #383e43;
    }

    .section-car .img-orang {

    }

    .section-car .img-car {
        width: 114%;
    }

    .section-car .card-check-price {
        padding: 12px!important;
    }

    .section-car .card-check-price .inline {
        margin-right: auto!important;
        padding: 15px 0px 0px 30px;
    }
    .section-car .btn-check-pricing {
        padding: 13px 31px!important;
        border-radius: 22px;
    }

    /* Section cta to action */
    .section-cta .header {
        font-size: 46px;
        font-weight: bold;
        color: #383e43!important;
        margin-bottom: 20px;
    }

    .section-cta .sub-header {
        font-size: 24px;
        font-weight: normal;
        color: #383e43!important;
    }

    .section-cta span {
        font-size: 12px;
        padding: 0px 10px;
    }

    .section-cta .header-usp {
        font-family: Kufam, sans-serif!important;
        font-weight: normal!important;
        font-size: 20px!important;
    }
    .section-cta {
        font-size: 16px!important;
    }

    .section-cta .btn-booknow {
        font-size : 16px;
        font-weight: 600;
        border-radius: 16px;
        display: flex;
        justify-content: center;
        padding: 6px 26px;
    }

    .section-cta .img-cta {
        height: 321px;
        object-fit: cover!important;
        width: inherit;
    }

    .section-cta .row-upper {
        display: flex !important;
        flex-direction: column-reverse !important;
    }

    /* Section referral  */
    .section-referral h1 {
        font-family: Kufam, sans-serif;
        font-weight: bold;
        font-size: 36px;
    }

    .section-referral h4 {
        font-weight: 300;
        font-size: 24px;
    }

    .section-referral span {
        font-size: 20px;
        padding: 0px 10px;
    }

    .section-referral .btn-referral {
        font-weight: 400;
        padding: 10px 26px;
    }

    .section-referral .btn-partner {
        font-weight: 400;
        padding: 10px 26px;
    }

    /* Section Donwload App */
    .section-download-app h1 {
        font-weight: bold;
        font-family: Kufam, sans-serif;
        font-size: 32px;
        /* width: 628px; */
    }

    .section-download-app h4 {
        font-weight: 300;
        font-size: 24px;
    }

    .section-download-app .img-download {
        width: 260px;
        height: 310px;
    }

}

@media (max-width: 1013px){
    .nav-item.active::after {
        height: 0px;
        background-color: #fff;
    }
}
@media (min-width: 0px) {
    .nav-item {
        padding-bottom: 10px;
        padding-top: 10px;
    }
    .nav-link {
        font-size: 22px!important;
    }

    .navbar-collapse.show {
        position: fixed;
        background-color: #fff;
        top: 0px;
        left: 0;
        padding-left: 15px;
        padding-right: 15px;
        padding-bottom: 15px;
        width: 75%;
        height: 100%;
        z-index: 100;
    }


        .navbar-collapse.show {
            left: 0;
            transition: left 300ms ease-in-out;
        }

        .navbar-collapse.collapsing {
            left: -80%;
            transition: height 0s ease!important;
        }

        .navbar-toggler.collapsed ~ .navbar-collapse {
            transition: left 500ms ease-in-out;
        }

        .ml-auto .lang {
            margin: 0px 20px;
            font-size: 22px;
        }
        .ml-auto .divider {
            font-size: 22px;
        }

        .close-navbar .navbar-toggler {
            font-size: 56px;
            font-weight: 100;
            margin : 10px 10px;
            -webkit-text-stroke: 1px background-color;
        }
        .btn-next {
            width: 100%;
            display: block;
            height : 64px;
            line-height: 44px;
            font-size: 20px;
        }
}
@media (min-width: 480px) {
    .navbar-collapse.show {
        position: fixed;
        background-color: #fff;
        top: 0px;
        left: 0;
        padding-left: 15px;
        padding-right: 15px;
        padding-bottom: 15px;
        width: 50%;
        height: 100%;
    }
}
/* On screens that are 768px or less, */
@media (min-width: 768px) {
    .carousel-indicators li {
        box-sizing: content-box;
        flex: 0 1 auto;
        width: 30px;
        height: 3px;
        margin-right: 3px;
        margin-left: 3px;
        text-indent: -999px;
        cursor: pointer;
        background-color: #fff;
        background-clip: padding-box;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        opacity: 0.5;
        transition: opacity 0.6s ease;
    }

    .navbar-brand img {
        width: 120px!important;
    }

    .main {
       font-family: Roboto, sans-serif;
       padding: 3.5rem 0;
       background: url(../../img/landing/svg/desktop-bg-medium.svg) no-repeat;
       background-size: cover;
       background-position-x: 100px!important;
       background-position: bottom;
       background-color: #f0f1f3!important;
       height: 400px;
    }

    /* .main .form-control {
        border: 0px solid;
        border-bottom: 1px solid #ced4da;
        border-radius: 0px;
        font-size: 13px;
    } */

    .main .lead {
        font-weight: 400;
        font-size : 16px;
    }

    .main .hero-heading {
        font-family: Kufam,sans-serif!important;
        font-weight: 900;
        font-size: 27px!important;
        width: 345px;
    }

    .main .apps {
        width : 109px!important;
    }

    .search-bar {
        border-radius: 12px;
        background: #fff;
        -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
        box-shadow: 0 0 11px rgb(0 0 0 / 33%);
        padding-left: 20px;
        margin-top : 20px!important;
    }

    .main .btn-booknow {
        border-radius: 12px;
        display: flex;
        justify-content: center;
        padding: 21px 12px;
        font-size: 14px;
    }

    /* Section how-it-works  */
    .section-how-it-works .header {
        font-family : Kufam, sans-serif;
        font-weight: 700;
        font-size : 32px;
    }

    .section-how-it-works .sub-header {
        font-size : 20px;
        font-weight: 300;
        color : #777e85!important;
    }

    .section-how-it-works img {
        width :238px!important
    }

    .section-how-it-works .step-header {
        font-family : Kufam, sans-serif;
        font-weight: 700;
        color : #f8663c;
        font-size : 20px;
    }

    .section-how-it-works .step-description {
        font-weight: 400;
        font-size : 16px;
        color : #60676d!important;
    }

    /* Section car  */
    .section-car {
        background-color: #fff;
    }

    .section-car .header {
        font-weight: bold;
        font-size: 32px;
        font-family : Kufam, sans-serif;
        font-weight: 700;
    }

    .section-car .sub-header {
        font-weight: 300;
        font-size: 20px;
        color : #777e85!important;
    }

    .section-car .type {
        color: white;
        font-weight: 500;
        border: 1px solid;
        padding: 5px 10px;
        border-radius: 9px;
    }

    .section-car .title {
        font-size: 12px;
        padding: 5px 10px;
    }

    .section-car .brand {
        font-weight: 500;
        font-size : 16px;
        width: 100px;
    }

    .section-car .name {
        font-weight: 500;
        width: 100px;
        font-size : 12px;
    }

    .section-car .pricing {
        text-align: right;
        padding-right: 29px;
    }

    .section-car .price {
        font-family : Kufam, sans-serif;
        font-weight: 700;
        font-size : 16px;
        color : #f5d60c;
    }

    .section-car .header-pricing {
        font-family : Kufam, sans-serif;
        font-weight: 700;
        font-size : 24px;
        color : #383e43;
    }

    .section-car .img-orang {
        display : none!important;
    }

    .section-car .img-car {
        width: 114%;
    }

    .section-car .card-check-price {
        display: flex!important;
        padding: 12px!important;
    }

    .section-car .card-check-price .inline {
        margin-right: auto!important;
        padding: 15px 0px 0px 30px;
    }
    .section-car .btn-check-pricing {
        padding: 13px 31px!important;
        border-radius: 22px;
    }

    /* Section cta to action */
    .section-cta .header {
        font-size: 46px;
        font-weight: bold;
        text-align: left!important;
        color: #383e43!important;
        margin-bottom: 20px;
    }

    .section-cta .sub-header {
        font-size: 24px;
        text-align: left!important;
        font-weight: normal;
        color: #383e43!important;
    }

    .section-cta span {
        font-size: 12px;
        padding: 0px 10px;
    }

    .section-cta .header-usp {
        font-family: Kufam, sans-serif!important;
        font-weight: normal!important;
        font-size: 20px!important;
    }
    .section-cta {
        font-size: 16px!important;
    }

    .section-cta .btn-booknow {
        font-size : 16px;
        font-weight: 600;
        border-radius: 16px;
        display: flex;
        justify-content: center;
        padding: 6px 26px;
    }

    .section-cta .img-cta {
        height: 321px;
        object-fit: cover!important;
        width: inherit;
    }

    .section-cta .row-upper {
        display: flex !important;
        flex-direction: column-reverse !important;
    }

    /* Section referral  */
    .section-referral {
        background: url(../../img/landing/svg/joinus-biggerthan-1336.svg) no-repeat;
        background-size: contain;
        background-position: bottom;
        height: 400px;
        margin-bottom: 0px;
        font-family: Roboto, sans-serif;
        color : #383e43!important;
    }

    .section-referral h1 {
        font-family: Kufam, sans-serif;
        font-weight: bold;
        font-size: 36px;
    }

    .section-referral h4 {
        font-weight: 300;
        font-size: 24px;
    }

    .section-referral span {
        font-size: 20px;
        padding: 0px 10px;
    }

    .section-referral .btn-referral {
        font-weight: 400;
        padding: 10px 26px;
        display: inline-block!important;
    }

    .section-referral .btn-partner {
        font-weight: 400;
        padding: 10px 26px;
        display: inline-block!important;
    }

    /* Section Donwload App */
    .section-download-app h1 {
        font-weight: bold;
        font-family: Kufam, sans-serif;
        font-size: 32px;
        /* width: 628px; */
    }

    .section-download-app h4 {
        font-weight: 300;
        font-size: 24px;
    }

    .section-download-app .img-download {
        width: 240px;
        height: 310px;
        margin-top: inherit!important;
    }

    .section-download-app .row-upper {
        display: flex !important;
        flex-direction: inherit!important;
        text-align: unset!important;
    }

    .btn-next {
        width: 100%;
        display: block;
        height : 64px;
        line-height: 44px;
        font-size: 20px;
    }
}

/* On screens that are 1014px or less, */
@media (min-width: 1014px) {

    /* SECTION MAIN */
    .nav-link {
        font-size: 16px!important;
    }

    .ml-auto .lang {
        margin: 0px 2px;
        font-size: 16px;
    }
    .ml-auto .divider {
        font-size: 16px;
    }

    .main {
        font-family: Roboto, sans-serif;
        padding: 3.5rem 0;
        background: url(../../img/landing/svg/desktop-bg-big-2.svg) no-repeat;
        background-size: auto;
        background-position-x: 239px!important;
        background-position-y: 82px!important;
        background-color: #f0f1f3!important;
        height: 500px;
    }

    .main .lead {
        font-weight: 400;
        font-size : 20px;
        width: 412px;
    }

    .main .hero-heading {
        font-family: Kufam,sans-serif!important;
        font-weight: 900;
        font-size: 36px!important;
        width : 412px;
    }

    .main .apps {
        width : 160px!important;
    }

    .search-bar {
        border-radius: 12px;
        background: #fff;
        -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
        box-shadow: 0 0 11px rgb(0 0 0 / 33%);
        padding-left: 20px;
        margin-top : 50px!important;
    }

    .main .btn-booknow {

        border-radius: 12px;
        display: flex;
        justify-content: center;
        padding: 16px 18px;
        font-size: 17px;
    }

    /* Section how-it-works  */
    .section-how-it-works .header {
        font-family : Kufam, sans-serif;
        font-weight: 700;
        font-size : 36px;
    }

    .section-how-it-works .sub-header {
        font-size : 24px;
        font-weight: 300;
        color : #777e85!important;
    }

    .section-how-it-works img {
        width :324px!important
    }

    .section-how-it-works .step-header {
        font-family : Kufam, sans-serif;
        font-weight: 700;
        color : #f8663c;
        font-size : 20px;
    }

    .section-how-it-works .step-description {
        font-weight: 400;
        font-size : 16px;
        color : #60676d!important;
    }

    /* Section car  */
    .section-car {
        background-color: #fff;
    }

    .section-car .header {
        font-weight: bold;
        font-size: 36px;
    }

    .section-car .type {
        color: white;
        font-weight: 500;
        border: 1px solid;
        padding: 5px 10px;
        border-radius: 9px;
    }

    .section-car .title {
        padding: 5px 19px;
    }

    .section-car .brand {
        font-weight: 500;
        font-size : 16px;
    }

    .section-car .pricing {
        text-align: right;
        padding-right: 36px;
    }

    .section-car .price {
        font-family : Kufam, sans-serif;
        font-weight: 700;
        font-size : 18px;
        color : #f5d60c;
    }

    .section-car .header {
        font-family : Kufam, sans-serif;
        font-weight: 700;
    }

    .section-car .sub-header {
        font-weight: 300;
        color : #777e85!important;
    }

    .section-car .header-pricing {
        font-family : Kufam, sans-serif;
        font-weight: 700;
        font-size : 24px;
        color : #383e43;
    }

    .section-car .img-orang {
        display : none;
    }

    .section-car .img-car {
        width: 291px;
        height: 195px;
    }

    .section-car .card-check-price {
        display: flex!important;
        padding: 12px!important;
    }

    .section-car .card-check-price .inline {
        margin-right: auto!important;
        padding: 15px 0px 0px 30px;
    }
    .section-car .btn-check-pricing {
        padding: 13px 31px!important;
        border-radius: 22px;
    }

    .section-cta .row-upper {
        display: flex !important;
        flex-direction: row!important;
    }

    /* Section cta to action */
    .section-cta .header {
        font-size: 36px;
        font-weight: bold;
        color: #383e43!important;
    }

    .section-cta .sub-header {
        font-size: 24px;
        font-weight: normal;
        color: #383e43!important;
    }

    .section-cta span {
        font-size: 12px;
        padding: 0px 10px;
    }

    .section-cta .header-usp {
        font-family: Kufam, sans-serif!important;
        font-weight: normal!important;
        font-size: 20px!important;
    }
    .section-cta {
        font-size: 16px!important;
    }

    .section-cta .btn-booknow {
        font-size : 16px;
        font-weight: 600;
        border-radius: 16px;
        display: flex;
        justify-content: center;
        padding: 6px 26px;
    }

    .section-cta .img-cta {
        height: 670px;
        width: inherit;
    }

    /* Section referral  */
    .section-referral h1 {
        font-family: Kufam, sans-serif;
        font-weight: bold;
        font-size: 36px;
    }

    .section-referral h4 {
        font-weight: 300;
        font-size: 24px;
    }

    .section-referral span {
        font-size: 20px;
        padding: 0px 10px;
    }

    .section-referral .btn-referral {
        font-weight: 400;
        padding: 10px 26px;
    }

    .section-referral .btn-partner {
        font-weight: 400;
        padding: 10px 26px;
    }

    /* Section Donwload App */
    .section-download-app h1 {
        font-weight: bold;
        font-family: Kufam, sans-serif;
        font-size: 36px;
        width: 628px;
    }

    .section-download-app h4 {
        font-weight: 300;
        font-size: 24px;
    }

    .section-download-app .img-download {
        width: 260px;
        height: 310px;
    }

    .btn-next {
        width: 260px;
        height : 64px;
        line-height: 44px;
        font-size: 20px;
    }

}

/* On screens that are 1336px or less,*/
@media (min-width: 1336px) {
    /*
    * =====================================================
    *     main
    * =====================================================
    */
    .main {
       font-family: Roboto, sans-serif;
       padding: 3.5rem 0;
       background: url(../../img/landing/svg/desktop-bg-medium.svg) no-repeat;
       background-size: cover;
       background-position-x: 390px!important;
       background-position: bottom right;
       background-color: #f0f1f3!important;
       height: 600px;
    }

    .main .lead {
        font-weight: 400;
        font-size : 20px;
    }

    .main .hero-heading {
        font-family: Kufam,sans-serif;
        font-weight: 800;
        font-size: 44px!important;
        width: 520px;
    }

    .search-bar {
        border-radius: 12px;
        background: #fff;
        -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
        box-shadow: 0 0 11px rgb(0 0 0 / 33%);
        padding-left: 20px;
        margin-top : 0px!important;
    }

    .main .btn-booknow {
        /* padding: 10px; */
        border-radius: 12px;
        display: flex;
        justify-content: center;
        padding: 15px 21px;
        font-size: 20px;
    }

    /* Section how-it-works  */
    .section-how-it-works .header {
        font-family : Kufam, sans-serif;
        font-weight: 700;
        font-size : 44px;
    }

    .section-how-it-works .sub-header {
        font-size : 28px;
        font-weight: 300;
        color : #777e85!important;
    }

    .section-how-it-works .step-header {
        font-family : Kufam, sans-serif;
        font-weight: 700;
        color : #f8663c;
        font-size : 24px;
    }

    .section-how-it-works .step-description {
        font-weight: 400;
        font-size : 16px;
        color : #60676d!important;
    }

    /* Section car  */
    .section-car {
        background-color: #fff;
        padding-bottom: 3rem!important;
    }

    .section-car .header {
        font-weight: bold;
    }

    .section-car .type {
        color: white;
        font-weight: 500;
        border: 1px solid;
        padding: 5px 10px;
        border-radius: 9px;
    }

    .section-car .title {
        padding: 5px 19px;
    }

    .section-car .brand {
        font-weight: 500;
        font-size : 16px;
    }

    .section-car .pricing {
        text-align: right;
        padding-right: 36px;
    }

    .section-car .price {
        font-family : Kufam, sans-serif;
        font-weight: 700;
        font-size : 18px;
        color : #f5d60c;
    }

    .section-car .header {
        font-family : Kufam, sans-serif;
        font-weight: 700;
    }

    .section-car .sub-header {
        font-weight: 300;
        color : #777e85!important;
    }

    .section-car .header-pricing {
        font-family : Kufam, sans-serif;
        font-weight: 700;
        font-size : 18px;
        color : #383e43;
    }

    .section-car .img-orang {
        width: 163px!important;
        display: initial!important;
    }

    .section-car .img-car {
        width: 296px;
        height: 195px;
    }

    .section-car .card-check-price {
        padding: 1.45rem!important;
        display: initial!important;
    }

    .section-car .card-check-price .inline {
        /* margin-right: auto!important; */
        padding: 0.5rem!important;
    }

    .section-car .btn-check-pricing {
        padding: 1rem !important;
        border-radius: 12px;
    }

    /* Section cta to action */
    .section-cta .header {
        font-family: Kufam, sans-serif;
        font-size: 44px;
        font-weight: bold;
        color: #383e43!important;
    }

    .section-cta .sub-header {
        font-size: 28px;
        font-weight: normal;
        color: #383e43!important;
    }

    .section-cta span {
        font-size: 12px;
        padding: 0px 10px;
    }

    .section-cta .header-usp {
        font-family: Kufam, sans-serif!important;
        font-weight: normal!important;
        font-size: 20px!important;
    }
    .section-cta {
        font-size: 16px!important;
    }

    .section-cta .btn-booknow {
        font-size : 16px;
        font-weight: 600;
        border-radius: 16px;
        display: flex;
        justify-content: center;
        padding: 6px 26px;
    }

    .section-cta .img-cta {
        height: 600px!important;
        width: inherit;
    }

    /* Section referral  */
    .section-referral h1 {
        font-family: Kufam, sans-serif;
        font-weight: bold;
        font-size: 44px
    }

    .section-referral h4 {
        font-weight: 300;
        font-size: 24px;
    }

    .section-referral span {
        font-size: 20px;
        padding: 0px 10px;
    }

    .section-referral .btn-referral {
        font-weight: 400;
        padding: 10px 26px;
    }

    .section-referral .btn-partner {
        font-weight: 400;
        padding: 10px 26px;
    }

    /* Section Donwload App */
    .section-download-app h1 {
        font-weight: bold;
        font-family: Kufam, sans-serif;
        font-size: 44px;
    }

    .section-download-app h4 {
        font-weight: 300;
        font-size: 24px;
    }

    .section-download-app .img-download {
        width: 400px;
        height: 400px;
    }

}
