.brand-socialmedia .media-wrapper {
    background: #292929;
    padding: 18px 0;
    margin: 0 0 40px;
    color: #e6a705
}

    .brand-socialmedia .media-wrapper h5 {
        float: left;
        margin: 15px 22px 0 0;
        font-size: 14px
    }

@media (max-width: 815px) {
    .brand-socialmedia .media-wrapper h5 {
        display: block;
        width: 100%;
        padding-bottom: 10px
    }
}

.brand-socialmedia .media-wrapper a {
    margin: 0 20px 0 0;
    display: inline-block;
    color: #fff;
    float: left
}

    .brand-socialmedia .media-wrapper a img {
        float: left
    }

@media (max-width: 815px) {
    .brand-socialmedia .media-wrapper a {
        float: left
    }
}

.brand-socialmedia .media-wrapper .social-icons h5 {
    float: left
}

@media (max-width: 815px) {
    .brand-socialmedia .media-wrapper .social-icons h5 {
        display: block;
        width: 100%;
        padding-bottom: 10px
    }
}

.brand-socialmedia .media-wrapper .social-icons a {
    float: left
}

    .brand-socialmedia .media-wrapper .social-icons a img {
        float: left
    }

.brand-youMayLike .brand-youMayLike-slider-wrapper {
    margin-top: 30px
}

@media (max-width: 815px) {
    .brand-youMayLike .brand-youMayLike-slider-wrapper {
        width: 100%
    }
}

.brand-youMayLike .brand-youMayLike-slider-wrapper h2 {
    margin-left: 0;
    font-size: 24px;
    font-weight: 700;
    color: #000;
    padding-left: 20px
}

    .brand-youMayLike .brand-youMayLike-slider-wrapper h2::after {
        height: 0
    }

@media (max-width: 815px) {
    .brand-youMayLike .brand-youMayLike-slider .slideEle {
        margin: 0 2px
    }
}

.brand-youMayLike .brand-youMayLike-slider .slick-next {
    z-index: 99;
    width: 60px;
    height: 60px;
    background: rgba(0,0,0,0.38);
    border: solid 2px #fff;
    border-radius: 50%;
    transition: all 0.4s
}

    .brand-youMayLike .brand-youMayLike-slider .slick-next::before {
        content: "";
        display: block;
        width: 13px;
        height: 23px;
        opacity: 1;
        margin: 0 auto;
        background: url(../img/brands/white-arrow-right.png) 0 0 no-repeat;
        left: 0;
        right: 0;
        top: 15px;
        width: 13px;
        height: 23px
    }

.brand-youMayLike .brand-youMayLike-slider .slick-prev {
    z-index: 99;
    width: 60px;
    height: 60px;
    background: rgba(0,0,0,0.38);
    border: solid 2px #fff;
    border-radius: 50%;
    transition: all 0.4s
}

    .brand-youMayLike .brand-youMayLike-slider .slick-prev::before {
        content: "";
        display: block;
        width: 13px;
        height: 23px;
        opacity: 1;
        margin: 0 auto;
        background: url(../img/brands/white-arrow-left.png) 0 0 no-repeat;
        left: 0;
        right: 0;
        top: 15px;
        width: 13px;
        height: 23px
    }

.brand-youMayLike .brand-youMayLike-slider .card {
    margin: 0 auto;
    background-color: #fff
}

    .brand-youMayLike .brand-youMayLike-slider .card > img {
        width: 100%
    }

.brand-youMayLike .brand-youMayLike-slider .card-body {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px 15px
}

    .brand-youMayLike .brand-youMayLike-slider .card-body .blueBorder {
        padding-top: 10px;
        padding-bottom: 10px;
        padding-left: 12px;
        box-shadow: none
    }

@media (max-width: 815px) {
    .brand-youMayLike .brand-youMayLike-slider .card-body .blueBorder {
        padding: 8px 10px 7px 12px;
        background-image: none;
        font-size: 13px
    }
}

.brand-youMayLike .brand-youMayLike-slider .card-body p {
    margin: 0;
    font-size: 14px;
    font-weight: 700
}

    .brand-youMayLike .brand-youMayLike-slider .card-body p em {
        color: #f12a00;
        font-size: 20px;
        font-family: "Roboto", sans-serif;
        font-weight: 500;
        font-style: normal;
        font-display: swap
    }

.brand-youMayLike .brand-youMayLike-slider .card-body .item-detail .card-title {
    margin: 0;
    color: #000;
    font-weight: 500
}

.brand-youMayLike .brand-youMayLike-slider .card-body .item-detail .card-text {
    margin: 0
}

.scooty-pep {
    padding-top: 96px;
    padding-bottom: 50px
}

@media (max-width: 815px) {
    .scooty-pep {
        padding-top: 130px
    }
}

.scooty-pep .slick-list {
    width: 100%
}

@media (min-width: 815px) {
    .scooty-pep .heroSecondary .brandheroSlider .slick-slide {
        margin: 0
    }
}

.scooty-pep .heroSecondary .brandheroSlider .slick-dots {
    bottom: 70px;
    display: none
}

@media (max-width: 815px) {
    .scooty-pep .heroSecondary .brandheroSlider .slick-dots {
        bottom: 0
    }
}

.scooty-pep .heroSecondary .brandheroSlider .slick-dots li button {
    width: 10px;
    height: 10px
}

    .scooty-pep .heroSecondary .brandheroSlider .slick-dots li button:before {
        border-radius: 20px;
        background: #fff;
        height: 10px;
        width: 10px;
        opacity: 1;
        color: transparent
    }

.scooty-pep .heroSecondary .brandheroSlider .slick-dots li.slick-active button:before {
    background: #01a0c6;
    color: transparent
}

@media (max-width: 815px) {
    .scooty-pep .heroSecondary .brandheroSlider .slick-slide {
        margin: 0
    }
}

.scooty-pep .hero-item {
    position: relative
}

@media (max-width: 815px) {
    .scooty-pep .hero-item {
        width: 100%
    }
}

.scooty-pep .hero-item img {
    width: 100%;
    max-width: 100%
}

@media (max-width: 815px) {
    .scooty-pep .hero-item img {
        width: 100%
    }
}

.scooty-pep .hero-item .slide-content {
    position: absolute;
    z-index: 1;
    top: 0;
    right: 100px;
    transform: translate(0%, 0);
    width: 50%
}

    .scooty-pep .hero-item .slide-content .heading {
        display: flex;
        font-size: 48px;
        align-items: center
    }

        .scooty-pep .hero-item .slide-content .heading img {
            width: auto
        }

        .scooty-pep .hero-item .slide-content .heading h1 {
            font-family: "Gilroy";
            font-size: 48px;
            font-weight: 800;
            color: #333;
            text-transform: inherit;
            line-height: normal
        }

    .scooty-pep .hero-item .slide-content p {
        font-size: 18px;
        color: #333;
        font-family: "Gilroy"
    }

.scooty-pep-about {
    background: url(-/media/scooty-pep/about-bg.png) no-repeat 0 0/cover;
    padding: 100px 0
}

    .scooty-pep-about .row {
        display: flex;
        align-items: center
    }

@media (max-width: 815px) {
    .scooty-pep-about .row {
        display: block
    }
}

.scooty-pep-about .section-title {
    font-family: "Gilroy";
    font-size: 36px;
    font-weight: 400;
    color: #000;
    line-height: normal;
    text-transform: uppercase
}

    .scooty-pep-about .section-title span {
        font-weight: 800;
        background: linear-gradient(180deg, #00c2ff 0%, #01a0c6 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        display: block
    }

.scooty-pep-about p {
    font-family: "Gilroy";
    font-weight: 400;
    color: #4d4d4d
}

.scooty-pep-about .about-img {
    position: relative
}

    .scooty-pep-about .about-img img {
        position: relative;
        z-index: 1;
        max-width: 100%;
        width: 100%
    }

    .scooty-pep-about .about-img:after {
        content: "";
        position: absolute;
        width: calc(100% - 60px);
        height: calc(100% - 60px);
        background: transparent;
        border: solid 1px #01a0c6;
        top: 0;
        right: 10px
    }

.scooty-pep-models {
    background: #fff;
    padding: 50px 0 1px
}

    .scooty-pep-models .section-title {
        font-family: "Gilroy";
        font-size: 36px;
        font-weight: 400;
        color: #000;
        line-height: normal;
        text-transform: uppercase;
        text-align: center
    }

@media (max-width: 815px) {
    .scooty-pep-models .section-title {
        text-align: left;
        padding-left: 20px
    }
}

.scooty-pep-models .section-title span {
    font-weight: 800;
    background: linear-gradient(180deg, #00c2ff 0%, #01a0c6 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

@media (max-width: 815px) {
    .scooty-pep-models .section-title span {
        display: block
    }
}

.scooty-pep-models .section-title img {
    margin: auto
}

.scooty-pep-models .models-slider {
    display: flex
}

    .scooty-pep-models .models-slider .slick-list {
        padding: 0 0px 0 0 !important
    }

@media (max-width: 815px) {
    .scooty-pep-models .models-slider .slick-list {
        padding: 0 30px 0 0 !important
    }
}

.scooty-pep-models .models-wrap {
    width: 50%;
    margin: 0
}

@media (max-width: 815px) {
    .scooty-pep-models .models-wrap {
        width: 100%;
        margin: 0 10px 0 0
    }
}

.scooty-pep-models .models-wrap .models-details-outer {
    padding: 30px;
    background: linear-gradient(180deg, rgba(248,248,248,0) 0%, #ededed 100%)
}

@media (max-width: 815px) {
    .scooty-pep-models .models-wrap .models-details-outer {
        padding: 30px 20px
    }
}

.scooty-pep-models .models-wrap .model-title {
    margin-bottom: 20px;
    font-style: italic;
    font-size: 28px;
    text-align: center
}

.scooty-pep-models .models-wrap .models-details {
    display: flex;
    align-items: flex-end
}

@media (max-width: 815px) {
    .scooty-pep-models .models-wrap .models-details {
        display: block
    }
}

.scooty-pep-models .models-wrap .model-image {
    width: 60%;
    background: url(../../-/media/scooty-pep/circle_bg1.webp) no-repeat 60px 15px;
    padding-top: 50px;
    background-size: 250px
}

@media (max-width: 815px) {
    .scooty-pep-models .models-wrap .model-image {
        width: 100%
    }
}

.scooty-pep-models .models-wrap .model-image.variant {
    background: url(../../-/media/scooty-pep/circle_bg_2.webp) no-repeat 60px 15px
}

.scooty-pep-models .models-wrap .model-description {
    width: 40%;
    padding-left: 20px
}

@media (max-width: 815px) {
    .scooty-pep-models .models-wrap .model-description {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        padding-left: 0
    }
}

.scooty-pep-models .models-wrap .model-info {
    margin-bottom: 15px
}

@media (max-width: 815px) {
    .scooty-pep-models .models-wrap .model-info:first-child {
        width: 30%;
        margin-right: 40px;
        order: 2
    }
}

@media (max-width: 815px) {
    .scooty-pep-models .models-wrap .model-info:nth-child(2) {
        width: 50%;
        margin-right: 10px;
        order: 3
    }
}

@media (max-width: 815px) {
    .scooty-pep-models .models-wrap .model-info:nth-child(3) {
        width: 20%;
        margin-right: 50px;
        order: 4
    }
}

.scooty-pep-models .models-wrap .model-info .label {
    margin: 0;
    padding: 0;
    font-family: "Gilroy";
    font-weight: 500;
    color: #666
}

.scooty-pep-models .models-wrap .model-info .value {
    font-family: "Gilroy";
    font-weight: 600;
    font-size: 18px;
    color: #333;
    line-height: normal
}

@media (max-width: 815px) {
    .scooty-pep-models .models-wrap .model-color {
        order: 1;
        display: flex;
        width: 100%;
        align-items: center;
        justify-content: center;
        margin: 20px 0
    }
}

.scooty-pep-models .models-wrap .model-color .nav-tabs {
    border: 0
}

    .scooty-pep-models .models-wrap .model-color .nav-tabs .nav-item {
        margin-right: 10px
    }

        .scooty-pep-models .models-wrap .model-color .nav-tabs .nav-item .nav-link {
            border: 0;
            padding: 0;
            background: transparent
        }

            .scooty-pep-models .models-wrap .model-color .nav-tabs .nav-item .nav-link span {
                display: block;
                width: 20px;
                height: 20px;
                border-radius: 20px;
                transition: all 0.5s ease-in-out;
                position: relative;
                z-index: 1
            }

            .scooty-pep-models .models-wrap .model-color .nav-tabs .nav-item .nav-link:after {
                content: "";
                width: 26px;
                height: 26px;
                position: absolute;
                left: -3px;
                top: -3px;
                background: #fff;
                box-shadow: 0 4px 4px rgba(0,0,0,0.2);
                border-radius: 50%;
                opacity: 0;
                transition: all 0.5s ease-in-out
            }

        .scooty-pep-models .models-wrap .model-color .nav-tabs .nav-item #color-first span {
            background: #000
        }

        .scooty-pep-models .models-wrap .model-color .nav-tabs .nav-item #color-first.active:after {
            opacity: 1
        }

        .scooty-pep-models .models-wrap .model-color .nav-tabs .nav-item #color-second span {
            background: #00509d
        }

        .scooty-pep-models .models-wrap .model-color .nav-tabs .nav-item #color-second.active:after {
            opacity: 1
        }

        .scooty-pep-models .models-wrap .model-color .nav-tabs .nav-item #color-third span {
            background: #8460a4
        }

        .scooty-pep-models .models-wrap .model-color .nav-tabs .nav-item #color-third.active:after {
            opacity: 1
        }

        .scooty-pep-models .models-wrap .model-color .nav-tabs .nav-item #color-fourth span {
            background: #ce2b35
        }

        .scooty-pep-models .models-wrap .model-color .nav-tabs .nav-item #color-fourth.active:after {
            opacity: 1
        }

        .scooty-pep-models .models-wrap .model-color .nav-tabs .nav-item #color-first-new span {
            background: #1fa2c7
        }

        .scooty-pep-models .models-wrap .model-color .nav-tabs .nav-item #color-first-new.active:after {
            opacity: 1
        }

        .scooty-pep-models .models-wrap .model-color .nav-tabs .nav-item #color-second-new span {
            background: #fff
        }

        .scooty-pep-models .models-wrap .model-color .nav-tabs .nav-item #color-second-new.active:after {
            opacity: 1
        }

.scooty-pep-models .models-wrap .model-more-info {
    padding-top: 50px
}

@media (max-width: 815px) {
    .scooty-pep-models .models-wrap .model-more-info {
        padding-top: 0
    }
}

.scooty-pep-models .models-wrap .model-more-info ul {
    display: flex;
    justify-content: space-around;
    align-items: center
}

@media (max-width: 815px) {
    .scooty-pep-models .models-wrap .model-more-info ul {
        flex-wrap: wrap
    }
}

.scooty-pep-models .models-wrap .model-more-info ul li .explore-btn {
    background: linear-gradient(180deg, #00c2ff 0%, #01a0c6 100%);
    border-radius: 50px;
    padding: 12px 20px;
    box-shadow: 0 8px 12px rgba(0,0,0,0.15);
    color: #fff;
    text-transform: uppercase
}

.scooty-pep-models .models-wrap .model-more-info ul li.brand-vehicle-name {
    color: #333;
    font-size: 24px;
    font-weight: 700;
    font-family: "Gilroy"
}

@media (max-width: 815px) {
    .scooty-pep-models .models-wrap .model-more-info ul li.brand-vehicle-name {
        width: 100%;
        margin-bottom: 10px
    }
}

.scooty-pep-models .models-wrap .model-more-info ul li.brand-vehicle-name span {
    font-family: "Gilroy";
    font-size: 28px;
    font-weight: 800;
    line-height: normal;
    text-transform: uppercase;
    text-align: center;
    background: linear-gradient(180deg, #00c2ff 0%, #01a0c6 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-right: 10px
}

.scooty-pep-models .models-wrap .model-more-info ul li.brand-vehicle-name sub {
    color: #666;
    font-size: 12px;
    bottom: 0
}

.scooty-pep-features {
    padding: 50px 0;
    background: url(../../-/media/scooty-pep/3rd_fold_bg_desktop.webp) no-repeat;
    background-size: cover
}

    .scooty-pep-features .section-title {
        font-family: "Gilroy";
        font-size: 36px;
        font-weight: 400;
        color: #000;
        line-height: normal;
        text-transform: uppercase;
        text-align: center
    }

@media (max-width: 815px) {
    .scooty-pep-features .section-title {
        text-align: left;
        padding-left: 20px
    }
}

.scooty-pep-features .section-title span {
    font-weight: 800;
    background: linear-gradient(180deg, #00c2ff 0%, #01a0c6 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

@media (max-width: 815px) {
    .scooty-pep-features .section-title span {
        display: block
    }
}

.scooty-pep-features .section-sub-heading {
    text-align: center;
    margin: 20px 0 50px;
    color: #4d4d4d;
    font-family: "Gilroy"
}

@media (max-width: 815px) {
    .scooty-pep-features .section-sub-heading {
        text-align: left;
        padding-left: 20px
    }
}

.scooty-pep-features .heading-wrap {
    margin-bottom: 20px
}

.scooty-pep-features .features-slider-card {
    background: #fff;
    display: flex;
    align-items: center;
    height: 315px
}

@media (max-width: 815px) {
    .scooty-pep-features .features-slider-card {
        display: block;
        height: auto
    }
}

.scooty-pep-features .features-slider-card-img {
    min-width: 450px
}

@media (max-width: 815px) {
    .scooty-pep-features .features-slider-card-img {
        min-width: auto
    }
}

.scooty-pep-features .features-slider-card-img img {
    max-width: 100%;
    width: 100%
}

.scooty-pep-features .features-slider-card-body {
    padding: 20px 50px
}

    .scooty-pep-features .features-slider-card-body h3 {
        font-family: "Gilroy";
        font-weight: 700;
        font-size: 32px;
        margin-bottom: 20px;
        color: #333
    }

    .scooty-pep-features .features-slider-card-body p {
        font-family: "Gilroy";
        font-size: 18px;
        color: #666
    }

@media (max-width: 815px) {
    .scooty-pep-features .slick-list {
        padding: 0 30px 0 0
    }
}

.scooty-pep-features .slick-arrow {
    background: #fff;
    border: solid 1px #efefef;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    box-shadow: 0 4px 15px rgba(82,82,82,0.15)
}

    .scooty-pep-features .slick-arrow:before {
        content: "";
        width: 11px;
        height: 11px;
        border-left: solid 1px #01a0c6;
        border-bottom: solid 1px #01a0c6;
        position: absolute;
        background: transparent
    }

    .scooty-pep-features .slick-arrow:after {
        content: "";
        width: 15px;
        height: 1px;
        background: #01a0c6;
        position: absolute
    }

@media (max-width: 815px) {
    .scooty-pep-features .slick-arrow.slick-prev {
        left: 0
    }
}

.scooty-pep-features .slick-arrow.slick-prev:before {
    transform: rotate(45deg)
}

.scooty-pep-features .slick-arrow.slick-prev:after {
    left: 10px;
    top: 18px
}

@media (max-width: 815px) {
    .scooty-pep-features .slick-arrow.slick-next {
        right: 0
    }
}

.scooty-pep-features .slick-arrow.slick-next:before {
    transform: rotate(-130deg);
    left: 15px
}

.scooty-pep-features .slick-arrow.slick-next:after {
    left: 11px;
    top: 18px
}

.scooty-pep-features .slick-arrow:hover:before {
    animation: inherit
}

.scooty-pep-features .slick-dots {
    bottom: -40px
}

    .scooty-pep-features .slick-dots li {
        margin: 0
    }

        .scooty-pep-features .slick-dots li button:before {
            background: #9d9d9d;
            border-radius: 50%;
            height: 12px;
            width: 12px;
            opacity: 1;
            color: transparent
        }

        .scooty-pep-features .slick-dots li.slick-active button:before {
            background: linear-gradient(180deg, #00c2ff 0%, #01a0c6 100%);
            color: transparent
        }

.scooty-pep-features .vehicle-info {
    text-align: center;
    color: #000;
    font-size: 22px;
    font-family: "Gilroy";
    font-size: 36px;
    margin: 70px 0 20px
}

.scooty-pep-features .vehicle-card {
    background: #fff;
    padding: 20px;
    text-align: center;
    position: relative
}

    .scooty-pep-features .vehicle-card:before {
        content: "";
        width: 100%;
        height: 60%;
        left: 0;
        top: 0;
        position: absolute
    }

    .scooty-pep-features .vehicle-card.first-color:before {
        background: #bff3ff
    }

    .scooty-pep-features .vehicle-card.second-color:before {
        background: #bebebe
    }

    .scooty-pep-features .vehicle-card.third-color:before {
        background: #aacdf6
    }

.scooty-pep-features .vehicle-card-inner {
    position: relative;
    z-index: 2
}

.scooty-pep-features .vehicle-card .variant {
    font-family: "Gilroy";
    color: #333;
    font-size: 20px;
    font-style: italic;
    margin-bottom: 20px
}

    .scooty-pep-features .vehicle-card .variant strong {
        font-weight: 800
    }

.scooty-pep-features .vehicle-card .title span {
    font-family: "Gilroy";
    font-size: 28px;
    font-weight: 800;
    line-height: normal;
    text-transform: uppercase;
    text-align: center;
    background: linear-gradient(180deg, #00c2ff 0%, #01a0c6 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.scooty-pep-features .vehicle-card .title sub {
    color: #000;
    font-size: 16px;
    bottom: 0
}

.scooty-pep-features .vehicle-card .explor-cta {
    background: linear-gradient(180deg, #00c2ff 0%, #01a0c6 100%);
    border-radius: 50px;
    padding: 10px 20px;
    box-shadow: 0 8px 12px rgba(0,0,0,0.15);
    color: #fff;
    text-transform: uppercase;
    display: inline-block;
    margin-top: 20px
}

.scooty-pep-video {
    position: relative
}

    .scooty-pep-video .video-btn {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%)
    }

    .scooty-pep-video iframe {
        height: 500px
    }

@media (max-width: 815px) {
    .scooty-pep-video iframe {
        height: 250px
    }
}

.scooty-pep-colors {
    padding: 50px 0 0px;
    background: #fff
}

    .scooty-pep-colors .section-title {
        font-family: "Gilroy";
        font-size: 36px;
        font-weight: 400;
        color: #000;
        line-height: normal;
        text-transform: uppercase;
        text-align: center
    }

        .scooty-pep-colors .section-title span {
            font-weight: 800;
            background: linear-gradient(180deg, #00c2ff 0%, #01a0c6 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent
        }

    .scooty-pep-colors .section-sub-heading {
        text-align: center;
        margin: 20px 0 50px;
        color: #4d4d4d;
        font-family: "Gilroy"
    }

    .scooty-pep-colors .pep-color-slider {
        margin-top: 50px;
        padding-left: 50px;
        padding-bottom: 100px
    }

@media (max-width: 815px) {
    .scooty-pep-colors .pep-color-slider {
        padding-left: 0;
        overflow: hidden
    }

        .scooty-pep-colors .pep-color-slider .slick-list {
            padding: 0 20% 0 0 !important
        }

            .scooty-pep-colors .pep-color-slider .slick-list .slick-slide {
                margin: 0 10px
            }
}

.scooty-pep-colors .pep-color-slider:before {
    content: "";
    width: calc(100% - 15%);
    height: 1px;
    border-bottom: dashed 2px #01a0c6;
    left: 170px;
    top: 90px;
    position: absolute
}

.scooty-pep-colors .pep-color-slider .pep-color-card {
    position: relative;
    padding-top: 20px
}

    .scooty-pep-colors .pep-color-slider .pep-color-card:after {
        content: "";
        width: 196px;
        height: 240px;
        position: absolute;
        left: 80px;
        top: 10px;
        background: #fff;
        border: solid 1px rgba(190,190,190,0.3)
    }

.scooty-pep-colors .pep-color-slider .pep-color-card-inner {
    position: relative
}

    .scooty-pep-colors .pep-color-slider .pep-color-card-inner:after {
        content: "";
        width: 196px;
        height: 260px;
        position: absolute;
        left: 70px;
        top: 0;
        background: #ebebeb;
        z-index: 1
    }

    .scooty-pep-colors .pep-color-slider .pep-color-card-inner:before {
        content: "";
        width: 1px;
        height: 260px;
        background: #bebebe;
        left: 80px;
        top: 0;
        position: absolute;
        z-index: 2
    }

.scooty-pep-colors .pep-color-slider .pep-color-card-year {
    font-family: "Gilroy";
    font-size: 36px;
    font-weight: 700;
    color: #333;
    text-align: center;
    position: relative;
    z-index: 2;
    padding: 30px 30px 0 0;
    line-height: normal
}

.scooty-pep-colors .pep-color-slider .pep-color-card-img {
    position: relative;
    z-index: 2
}

.scooty-pep-colors .pep-color-slider .pep-color-card-detail {
    position: relative;
    z-index: 2;
    font-size: 16px;
    font-family: "Gilroy";
    color: #333
}

.scooty-pep-colors .pep-color-slider .slick-slide:nth-child(odd) .pep-color-card-inner:after {
    background: #e5f0fc
}

.scooty-pep-colors .pep-color-slider .slick-slide:nth-child(odd) .pep-color-card-inner:before {
    background: rgba(60,117,185,0.3)
}

.scooty-pep-colors .pep-color-slider .slick-arrow {
    background: #fff;
    border: solid 1px #efefef;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    box-shadow: 0 4px 15px rgba(82,82,82,0.15);
    top: inherit;
    bottom: 0px
}

    .scooty-pep-colors .pep-color-slider .slick-arrow:before {
        content: "";
        width: 11px;
        height: 11px;
        border-left: solid 1px #01a0c6;
        border-bottom: solid 1px #01a0c6;
        position: absolute;
        background: transparent
    }

    .scooty-pep-colors .pep-color-slider .slick-arrow:after {
        content: "";
        width: 15px;
        height: 1px;
        background: #01a0c6;
        position: absolute
    }

    .scooty-pep-colors .pep-color-slider .slick-arrow.slick-prev {
        left: 47%
    }

@media (max-width: 815px) {
    .scooty-pep-colors .pep-color-slider .slick-arrow.slick-prev {
        left: 39%
    }
}

.scooty-pep-colors .pep-color-slider .slick-arrow.slick-prev:before {
    transform: rotate(45deg)
}

.scooty-pep-colors .pep-color-slider .slick-arrow.slick-prev:after {
    left: 10px;
    top: 18px
}

.scooty-pep-colors .pep-color-slider .slick-arrow.slick-next {
    right: 46%
}

@media (max-width: 815px) {
    .scooty-pep-colors .pep-color-slider .slick-arrow.slick-next {
        right: 39%
    }
}

.scooty-pep-colors .pep-color-slider .slick-arrow.slick-next:before {
    transform: rotate(-130deg);
    left: 15px
}

.scooty-pep-colors .pep-color-slider .slick-arrow.slick-next:after {
    left: 11px;
    top: 18px
}

.scooty-pep-colors .pep-color-slider .slick-arrow:hover:before {
    animation: inherit
}

.scooty-pep-colors .slick-list {
    padding: 0 10% 0 0 !important
}

.scooty-pep-colors .section-cta {
    background: #fff;
    padding: 15px 0;
    text-align: center;
    box-shadow: 0 -8px 20px rgba(82,82,82,0.2)
}

    .scooty-pep-colors .section-cta .explore-zest {
        background: linear-gradient(180deg, #00c2ff 0%, #01a0c6 100%);
        border-radius: 50px;
        padding: 10px 20px;
        box-shadow: 0 8px 12px rgba(0,0,0,0.15);
        color: #fff;
        text-transform: uppercase;
        display: inline-block
    }
