.as-pos .series-select {
    width: 100%;
    max-width: 1400px;
    margin: 40px auto 0 auto;
}
    .as-pos .series-select .coverflow {
        margin-top: 80px;
    }
    .as-pos .series-select .item {
        width: 400px;
        height: 400px;
    }
    .as-pos .series-select .item.center {
      height: 500px;
    }

        .as-pos .series-select .item.center .huge {
            font-size: 380px;
            line-height: 250px;
            right: 10px;
        }
        .as-pos .series-select .item.center h4.spaced {
            font-size: 40px;
            left: 40px;
            top: 135px;
        }
        .as-pos .series-select .item[data-id="M_SERIES"] .huge {
            font-size: 150px;
        }
        .as-pos .series-select .item.center[data-id="M_SERIES"] .huge {
            font-size: 280px;
            right: 0;
        }
        .as-pos .series-select .item[data-id="I_SERIES"] .huge {
            text-transform: lowercase;
        }
        .as-pos .series-select .item.center[data-id="I_SERIES"] .huge {
            right: 70px;
        }
        .as-pos .series-select .item[data-id="I_SERIES"] .huge {
            right: 50px;
        }
        .as-pos .series-select .item[data-id="XM"] .huge {
            font-size: 150px;
        }
        .as-pos .series-select .item[data-id="XM"] h4.spaced {
            top: 60px;
        }
        .as-pos .series-select .item.center[data-id="XM"] .huge {
            font-size: 225px;
        }
        .as-pos .series-select .item.center[data-id="XM"] h4.spaced {
            top: 60px;
        }
        .as-pos .series-select .item .mirror,
        .as-pos .series-select .item.center .inner .background {
            background-color: #086acf;
            box-shadow: 0 0 30px RGBA(0, 0, 0, 0.5);
            transition: transform 0.05s ease-in-out;
            height: 80%;
            width: 100%;
        }
        .as-pos .series-select .item.center .huge, .as-pos .series-select .item.center h4 {
            color: #fff;
        }
        .as-pos .series-select .item .huge {
            position: absolute;
            top: 50px;
            right: 50px;
            font-size: 200px;
            line-height: 200px;
            color: #515151;
            margin: 0;
            text-transform: uppercase;
        }
        .as-pos .series-select .item h4 {
          position: absolute;
          font-size: 35px;
          line-height: 30px;
          color: #515151;
          margin: 0;
          left: 20px;
          top: 120px;
        }
        .as-pos .series-select .item h4.spaced {
          letter-spacing: 20px;
          left: 115px;
        }
        .as-pos .series-select .item img {
            position: absolute;
            bottom: 3px;
            left: 3px;
            width: calc(100% - 6px);
        }
        .as-pos .series-letters {
            margin-bottom: 100px;
            background-color: #262626;
            text-align: center;
            margin-top: 40px;
            position: relative;
            z-index: 1000;
            font-family: "BMW_TypeWebBold", Arial, Helvetica, sans-serif;
        }
        .as-pos .series-letters h4 {
            display: inline-block;
            padding: 18px 30px;
            margin: 0;
            cursor: pointer;
            color: #fff;
        }
            .as-pos .series-letters h4:not([data-id="I_SERIES"]) {
                text-transform: uppercase;
            }
            .as-pos .series-letters h4.active {
                border-bottom: #1b68d3 6px solid;
            }
            .as-pos .series-letters h4.disabled {
                cursor: not-allowed;
                opacity: 0.3;
            }
.as-pos .language-selector {
    position: absolute;
    right: 2%;
    top: 3%;
    font-size: 1em;
    z-index: 9;
}
.as-pos .language-selector .selected {
    cursor: default;
}
    .as-pos .language-selector .language, .as-pos .language-selector .language-toggle {
        float: left;
        margin: 0 8px;
        color: #323232;
        font-weight: bold;
    }
        .as-pos .language-selector .language div {
            margin-top: 3px;
        }
        .as-pos .language-selector .language-toggle {
            cursor: pointer;
        }
.as-pos .language-selector .language-toggle img.right {
    transform: scaleX(-1);
}
        .as-pos .language-selector a {
            text-decoration: none;
        }
    .as-pos .language-selector .language:first-child {
        margin-left: 0;
    }
    .as-pos .language-selector .language:last-child {
        margin-right: 0;
    }
.as-pos .vehicle-select {
    max-width: 1280px;
    margin: 0 auto;
    padding: 25px 40px;
}
    .as-pos .vehicle-select .vehicle-select-touch-area {
        position: absolute;
        left: 50%;
        top: 0;
        transform: translateX(-50%);
        width: 100vw;
        height: 115%;
        z-index: 2;
    }
    .as-pos .vehicle-select .arrows {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
    }
        .as-pos .vehicle-select .arrows .right {
            position: absolute;
            bottom: 150px;
            right: 250px;
            -webkit-animation: arrowPulse 1.5s infinite;
            animation: arrowPulse 1.5s infinite;
        }
        .as-pos .vehicle-select .arrows .left {
            transform: rotateY(180deg);
            position: absolute;
            bottom: 150px;
            left: 250px;
            -webkit-animation: arrowPulse 1.5s infinite;
            animation: arrowPulse 1.5s infinite;
        }

.as-pos .variant-select {
    max-width: 1280px;
    margin: 0 auto;
    padding: 25px 40px;
    position: relative;
}
    .as-pos .variant-select .variant-select-touch-area {
        position: absolute;
        left: 50%;
        top: 0;
        transform: translateX(-50%);
        width: 100vw;
        height: 115%;
        z-index: 2;
    }
    .as-pos .variant-select .variant-select-title {
        width: 1400px;
        position: relative;
        left: 50%;
        transform: translateX(-50%);
        padding-bottom: 40px;
    }
    .as-pos .variant-select .series-list {
        position: relative;
    }
        .as-pos .variant-select .series {
            transform-style: preserve-3d;
        }
        .as-pos .variant-select .series-list h4 {
            position: absolute;
            letter-spacing: 20px;
            font-size: 35px;
            line-height: 30px;
            color: #515151;
            left: 480px;
            top: 80px;
        }
        .as-pos .variant-select .series-list .series-title {
            position: absolute;
            top: -30px;
            left: 580px;
            font-size: 250px;
            line-height: 250px;
            color: #262626;
            z-index: 1;
            transform: translateZ(-350px);
            text-transform: uppercase;
        }
        .as-pos .variant-select .series-list .body-style-list {
            position: relative;
            top: 50px;
            z-index: 2;
            padding-top: 150px;
            height: 500px;
            width: 100%;
            max-width: 700px;
            margin: 0 auto;
            transform-style: preserve-3d;
            transform: rotate3d(1, 0, 0, -25deg);
        }
            .as-pos .variant-select .series-list .body-style-list .body-style {
                position: absolute;
                text-align: center;
            }
                .as-pos .variant-select .series-list .body-style-list .body-style img {
                    width: 100vw;
                    max-width: 700px;
                    margin-bottom: 15px;
                    transform: scaleY(1.10);
                }
                .as-pos .variant-select .series-list .body-style-list .body-style h5 {
                    transform: scaleY(1.10);
                }

    .as-pos .variant-select .variant-chooser {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        z-index: 3;
    }
        .as-pos .variant-select .variant-chooser .right {
            fill: #1c69d4;
            position: absolute;
            bottom: 150px;
            right: 250px;
            -webkit-animation: arrowPulse 1.5s infinite;
            animation: arrowPulse 1.5s infinite;
        }
        .as-pos .variant-select .variant-chooser .left {
            transform: rotateY(180deg);
            fill: #1c69d4;
            position: absolute;
            bottom: 150px;
            left: 250px;
            -webkit-animation: arrowPulse 1.5s infinite;
            animation: arrowPulse 1.5s infinite;
        }
        .as-pos .variant-select .variant-chooser .vehicle-name-and-year {
            position: absolute;
            text-align: center;
            bottom: 140px;
            left: 50%;
            transform: translateX(-50%);
            min-width: 350px;
        }
            .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-variant {
                position: absolute;
                top: calc(100% + 35px);
                width: 100vw;
                left: 50%;
                transform: translateX(-50%);
            }
                .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-variant .variant {
                    position: relative;
                    display: inline-block;
                    padding: 10px;
                    border: 1px solid #dcdcdc;
                    margin-right: 10px;
                    cursor: pointer;
                    -webkit-box-shadow: 0px 0px 14px 2px rgba(28,105,212,0);
                    -moz-box-shadow: 0px 0px 14px 2px rgba(28,105,212,0);
                    box-shadow: 0px 0px 14px 2px rgba(28,105,212,0);
                    animation: boxShadowGlow 4s infinite;
                    -webkit-animation: boxShadowGlow 4s infinite;
                }

                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-variant .variant .border-override {
                        display: none;
                        position: absolute;
                        z-index: 2;
                        width: 100%;
                        height: 100%;
                        left: 0;
                        top: 0;
                        -webkit-box-shadow: 0px 0px 14px 2px rgba(28,105,212,1);
                        -moz-box-shadow: 0px 0px 14px 2px rgba(28,105,212,1);
                        box-shadow: 0px 0px 14px 2px rgba(28,105,212,1);
                        white-space: nowrap;
                    }

                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-variant .variant:hover .border-override {
                        display: block;
                    }

                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-variant .variant:nth-child(1) {
                        animation-delay: 1.5s;
                        -webkit-animation-delay: 1.5s;
                    }
                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-variant .variant:nth-child(2) {
                        animation-delay: 3s;
                        -webkit-animation-delay: 3s;
                    }
                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-variant .variant:nth-child(3) {
                        animation-delay: 4.5s;
                        -webkit-animation-delay: 4.5s;
                    }
                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-variant .variant:nth-child(4) {
                        animation-delay: 6s;
                        -webkit-animation-delay: 6s;
                    }
                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-variant .variant:nth-child(5) {
                        animation-delay: 7.5s;
                        -webkit-animation-delay: 7.5s;
                    }
                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-variant .variant:nth-child(6) {
                        animation-delay: 9s;
                        -webkit-animation-delay: 9s;
                    }
                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-variant .variant:nth-child(7) {
                        animation-delay: 10.5s;
                        -webkit-animation-delay: 10.5s;
                    }
                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-variant .variant:nth-child(8) {
                        animation-delay: 12s;
                        -webkit-animation-delay: 12s;
                    }
                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-variant .variant:nth-child(9) {
                        animation-delay: 13.5s;
                        -webkit-animation-delay: 13.5s;
                    }
                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-variant .variant:nth-child(10) {
                        animation-delay: 15s;
                        -webkit-animation-delay: 15s;
                    }
                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-variant .variant:nth-child(11) {
                        animation-delay: 16.5s;
                        -webkit-animation-delay: 16.5s;
                    }
                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-variant .variant:nth-child(12) {
                        animation-delay: 18s;
                        -webkit-animation-delay: 18s;
                    }
                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-variant .variant:nth-child(13) {
                        animation-delay: 19.5s;
                        -webkit-animation-delay: 19.5s;
                    }
                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-variant .variant:nth-child(14) {
                        animation-delay: 21s;
                        -webkit-animation-delay: 21s;
                    }
                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-variant .variant:nth-child(15) {
                        animation-delay: 22.5s;
                        -webkit-animation-delay: 22.5s;
                    }
                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-variant .variant:nth-child(16) {
                        animation-delay: 24s;
                        -webkit-animation-delay: 24s;
                    }
                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-variant .variant:nth-child(17) {
                        animation-delay: 25.5s;
                        -webkit-animation-delay: 25.5s;
                    }
                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-variant .variant:nth-child(18) {
                        animation-delay: 27s;
                        -webkit-animation-delay: 27s;
                    }
                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-variant .variant:nth-child(19) {
                        animation-delay: 28.5s;
                        -webkit-animation-delay: 28.5s;
                    }
                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-variant .variant:nth-child(20) {
                        animation-delay: 30s;
                        -webkit-animation-delay: 30s;
                    }
                .as-pos .variant-select .variant-chooser .vehicle-name-and-year .vehicle-name {
                    margin: 0 0 25px 0;
                    letter-spacing: -0.5px;
                }
                .as-pos .variant-select .variant-chooser .vehicle-name-and-year .line {
                    position: absolute;
                    top: 100%;
                    left: 0;
                    width: 100%;
                    height: 1px;
                    background-color: #000;
                }
                .as-pos .variant-select .variant-chooser .vehicle-name-and-year .year {
                    width: 33.33%;
                    float: left;
                    position: relative;
                    cursor: pointer;
                    font-family: "BMW_TypeWebBold", Arial, Helvetica, sans-serif;
                }
                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .year p {
                        position: absolute;
                        bottom: -10px;
                        left: 50%;
                        transform: translateX(-50%);
                        margin: 0;
                        padding-bottom: 20px;
                        z-index: 3;
                    }
                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .year .ball {
                        position: relative;
                        top: 24px;
                        left: 50%;
                        transform: translateX(-50%);
                        border-radius: 1000px;
                        width: 24px;
                        height: 24px;
                        z-index: 1;
                        border: 1px solid #dfdfdf;
                    }
                    /*.as-pos .variant-select .variant-chooser .vehicle-name-and-year .year .ball-inner {
                        position: absolute;
                        transform: translate(-50%, -50%);
                        left: 50%;
                        top: 50%;
                        background: #fff;
                        border-radius: 1000px;
                        width: 26px;
                        height: 26px;
                        z-index: 2;
                    }*/
                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .year.active .ball {
                        background-color: #086acf;
                    }
                    .as-pos .variant-select .variant-chooser .vehicle-name-and-year .year .ball-inner-active {
                        position: absolute;
                        transform: translate(-50%, -50%);
                        left: 50%;
                        top: 50%;
                        border-radius: 1000px;
                        width: 4px;
                        height: 4px;
                        background: #fff;
                        display: none;
                        z-index: 3;
                    }
                        .as-pos .variant-select .variant-chooser .vehicle-name-and-year .year.active .ball-inner-active {
                            display: block;
                        }


.as-pos .intro {
    position: relative;
    height: calc(100vh - 86px);
    width: 1280px;
    margin: 0 auto;
    padding-top: 40px;
}
    .as-pos .intro .title {
        padding-left: 76px;
    }
    .as-pos .intro .vehicle-image {
        width: 1200px;
        position: absolute;
        top: 45%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
        .as-pos .intro .vehicle-image .vehicle-image-container.i-series {
            height: 719.98px;
        }
            .as-pos .intro .vehicle-image .vehicle-image-container.i-series img {
                width: 1300px;
                max-width: none;
                left: -8%;
                top: 9%;
                position: relative;
            }
        .as-pos .intro .vehicle-image .section-trigger-list {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }
            .as-pos .intro .vehicle-image .section-trigger-list .section-trigger {
                display: inline-block;
                position: relative;
                cursor: pointer;
            }
                .as-pos .intro .vehicle-image .section-trigger-list > .section-trigger {
                    position: absolute;
                }
                    .as-pos .intro .vehicle-image .section-trigger-list .accessories { bottom: 45%; right: 5%; }
                    .as-pos .intro .vehicle-image .section-trigger-list .wheels { bottom: 22%; right: 20%; }
                    .as-pos .intro .vehicle-image .section-trigger-list .colour { bottom: 35%; left: 0; }
                .as-pos .intro .vehicle-image .section-trigger-list .section-trigger h3 {
                    display: inline-block;
                    margin: 0;
                    text-shadow: 2px 2px rgba(50,50,50,0.6);
                }
                .as-pos .intro .vehicle-image .section-trigger-list .section-trigger img {
                    position: absolute;
                    right: calc(100% + 15px);
                    top: 50%;
                    transform: translateY(-50%);
                }
                    .as-pos .intro .vehicle-image .section-trigger-list .section-trigger.colour img {
                        left: calc(100% + 15px);
                    }
                    .as-pos .intro .vehicle-image .section-trigger-list .section-trigger img.on {
                        -webkit-animation: fade 2s infinite;
                        animation: fade 2s infinite;
                    }
                .as-pos .intro .vehicle-image .section-trigger-list .in-a-line {
                    position: absolute;
                    left: 50%;
                    top: 100%;
                    transform: translateX(-50%);
                    width: 100%;
                    text-align: center;
                }
                    .as-pos .intro .vehicle-image .section-trigger-list .in-a-line .line {
                        border-top: 2px solid #a8a8a7;
                        padding-top: 30px;
                        width: 100%;
                        margin: 0 auto;
                    }
                    .as-pos .intro .vehicle-image .section-trigger-list .in-a-line .section-trigger {
                        margin-left: 120px;
                        margin-bottom: 24px;
                    }
                        .as-pos .intro .vehicle-image .section-trigger-list .in-a-line .section-trigger.vsp {
                            margin-left: 60px;
                        }

.as-pos .colour { }
    .as-pos .colour .side-bar .item {
        margin-bottom: 15px;
        cursor: pointer;
    }
        .as-pos .colour .side-bar .item img {
            display: block;
            width: 100%;
            height: 80px;
            margin-bottom: 5px;
        }
            .as-pos .colour .side-bar .item.active img {
                border: 4px solid #1c69d4;
            }
        .as-pos .colour .side-bar .item p {
            color: #666666;
            margin: 0;
        }

.as-pos .wheels { }
    .as-pos .wheels .side-bar p {
        color: #666666;
        font-size: 14px;
        line-height: 14px;
        font-weight: 700;
        margin-bottom: 10px;
    }
    .as-pos .wheels .side-bar .item {
        margin-bottom: 15px;
        cursor: pointer;
    }
        .as-pos .wheels .side-bar .item img {
            display: block;
            width: 100%;
            margin-bottom: 5px;
        }
            .as-pos .wheels .side-bar .item.active img {
                border: 4px solid #1c69d4;
            }

.as-pos .accessories { }
    .as-pos .accessories .side-bar p {
        color: #666666;
        font-size: 14px;
        line-height: 14px;
        font-weight: 700;
        margin: 30px 0 20px 0;
    }
        .as-pos .accessories .side-bar p:first-child {
            margin-top: 0;
        }
    .as-pos .accessories .side-bar .item {
        margin-bottom: 15px;
        cursor: pointer;
    }
        .as-pos .accessories .side-bar .item img {
            display: block;
            width: 100%;
            margin-bottom: 5px;
        }
            .as-pos .accessories .side-bar .item.active img {
                border: 4px solid #1c69d4;
            }
    .as-pos .accessories .copy {
        position: fixed;
        left: 380px;
        top: 126px;
        max-width: 600px;
        z-index: 2;
    }
        .as-pos .accessories .copy h3 {
            color: #FFF;
        }
        .as-pos .accessories .copy p {
            color: #FFF;
            line-height: 18px;
        }

.as-pos .service-packages-section {
    position: fixed;
    bottom: -50%;
    width: calc(100vw - 140px);
    right: 0;
    background-color: #FFF;
    border-bottom: none;
    padding: 30px 0 0 0;
    z-index: 3;
    transition: bottom 0.3s ease-in-out;
}
    .as-pos .service-packages-section.on {
        bottom: 0;
    }
    .as-pos .service-packages-section .cover {
        background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 99%, rgba(255,255,255,1) 100%);
        background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 99%,rgba(255,255,255,1) 100%);
        background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 99%,rgba(255,255,255,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=1 );
        position: absolute;
        top: 0;
        right: 7.5%;
        width: 22.5%;
        height: 100%;
        z-index: 2;
        pointer-events: none;
    }
        .as-pos .service-packages-section .cover::after {
            content: " ";
            display: block;
            position: absolute;
            left: 100%;
            top: 0;
            width: 33.333%;
            height: 100%;
            z-index: 2;
            background-color: #FFF;
        }
    .as-pos .service-packages-section .carousel {
        overflow: hidden;
        padding-right: 30%;
    }
        .as-pos .service-packages-section .carousel .slick-list {
            overflow: visible;
        }
        .as-pos .service-packages-section .carousel .slick-slide {
            padding: 0 30px;
        }
    .as-pos .service-packages-section .carousel .left {
        width: 40%;
        padding: 0 15px;
        float: left;
    }
        .as-pos .service-packages-section .left h3 {
            margin-bottom: 15px;
        }
    .as-pos .service-packages-section .carousel .right {
        width: 60%;
        padding: 0 15px;
        float: left;
    }
    .as-pos .service-packages-section .table-wrapper {
        border-left: 1px solid #DDD;
        padding-left: 40px;
    }
        .as-pos .service-packages-section .table-wrapper .table {
            margin-bottom: 0;
        }
            .as-pos .service-packages-section .table-wrapper .table td {
                height: 35px;
                vertical-align: middle;
                padding: 0 8px;
            }
            .as-pos .service-packages-section .table-wrapper .as-config-checkbox img {
                width: 25px;
                height: 25px;
            }
    .as-pos .service-packages-section .swiper {
        z-index: 2;
    }
    .as-pos .service-packages-section .legal {
        position: relative;
        z-index: 3;
        padding: 15px 30px;
    }

.as-pos .extended-warranty-section {
    position: fixed;
    bottom: -50%;
    width: calc(100vw - 140px);
    right: 0;
    background-color: #FFF;
    z-index: 3;
    transition: bottom 0.3s ease-in-out;
    padding: 30px 30px 0 30px;
}
    .as-pos .extended-warranty-section.on {
        bottom: 0;
    }
    .as-pos .extended-warranty-section .cover {
        background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 99%, rgba(255,255,255,1) 100%);
        background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 99%,rgba(255,255,255,1) 100%);
        background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 99%,rgba(255,255,255,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 );
        position: absolute;
        bottom: 0;
        right: 0;
        width: 100%;
        height: 100px;
        z-index: 2;
        pointer-events: none;
    }
    .as-pos .extended-warranty-section .year-drop {
      margin-top: 25px;
    }
    .as-pos .extended-warranty-section #years {
      width: 350px;
    }
    .as-pos .extended-warranty-section tr[class*="-year"] {
      display: none;
    }
    .as-pos .extended-warranty-section tr[class*="-year"].on {
      display: table-row;
    }
    .as-pos .extended-warranty-section h3 {
        margin-bottom: 20px;
    }
    .as-pos .extended-warranty-section .scroll-wrapper {
        height: 250px;
        overflow: hidden;
    }
        .as-pos .extended-warranty-section .scroll-wrapper .scroller {
            position: relative;
        }
    .as-pos .extended-warranty-section .table-wrapper {
        border-left: 1px solid #DDD;
        padding-left: 40px;
    }
        .as-pos .extended-warranty-section .table-wrapper .table {
            margin-bottom: 0;
        }
            .as-pos .extended-warranty-section .table-wrapper td {
                height: 35px;
                vertical-align: middle;
                padding: 0 8px;
            }
            .as-pos .extended-warranty-section .as-config-checkbox img {
                width: 25px;
                height: 25px;
            }
    .as-pos .extended-warranty-section .swiper-vertical {
        z-index: 2;
    }
    .as-pos .extended-warranty-section .legal {
        position: relative;
        z-index: 3;
        padding: 15px 0;
    }


.as-pos .summary {
    position: fixed;
    top: calc(50% + 43px);
    right: -100%;
    transform: translateY(-50%);
    border: 1px solid #8f8f8f;
    border-right: none;
    background-color: #FFF;
    transition: right 0.3s ease-in-out;
    z-index: 2;
    width: 45%;
    max-height: calc(100% - 166px);
    overflow: hidden;
    padding: 30px 50px;
}
    .as-pos .summary.on {
        right: 0;
    }
    .as-pos .summary .selected-retailer-staff-notice {
        margin-top: 10px;
    }
    .as-pos .summary .scroll-wrapper {
        overflow: hidden;
    }
        .as-pos .summary .scroll-wrapper .scroller {
            position: relative;
        }
    .as-pos .summary .swiper-vertical {
        z-index: 4;
        margin-left: -1px;
    }
    .as-pos .summary > .summary-section > h3 {
        padding-bottom: 15px;
    }
    .as-pos .summary .pdf-only {
        display: none;
    }
    .as-pos .summary .summary-category:not(:first-child) {
        margin-top: 40px;
    }
        .as-pos .summary .summary-category .summary-header {
            width: 100%;
            padding-bottom: 0;
            border-bottom: 1px solid #EEE;
            margin-bottom: 20px;
            position: relative;
        }
            .as-pos .summary .summary-category .summary-header h4 {
                float: left;
                max-width: calc(100% - 120px);
            }
                .as-pos .summary .summary-category .summary-header h4 sup {
                    font-size: 10px;
                    line-height: 10px;
                    top: -10px;
                    right: 2px
                }
            .as-pos .summary .summary-category .summary-header h6 {
                position: absolute;
                right: 40px;
                top: 0;
            }
    .as-pos .summary .summary-item {
        position: relative;
    }
        .as-pos .summary .summary-item::after {
            content: " ";
            display: block;
            clear: both;
        }
        .as-pos .summary .summary-item .remove-item {
            width: 30px;
            height: 30px;
            background-image: URL("/Content/img/static/close.png");
            background-repeat: no-repeat;
            background-position: center center;
            position: absolute;
            top: -10px;
            right: 0;
            cursor: pointer;
        }
    .as-pos .summary .color-item { }
        .as-pos .summary .color-item img {
            display: block;
            float: left;
            margin-right: 20px;
        }
        .as-pos .summary .color-item h6 {
            padding-top: 5px;
        }
    .as-pos .summary .summary-item .img-holder {
        width: 100px;
        display: block;
        float: left;
        margin-right: 50px;
    }
    .as-pos .summary .summary-item .right-side {
        float: left;
        width: calc(100% - 150px);
    }
    .as-pos .summary .summary-item.wheel-item { }
        .as-pos .summary .summary-item.wheel-item .wheel-description {
            float: left;
            max-width: calc(100% - 75px);
        }
        .as-pos .summary .summary-item.wheel-item .msrp {
            float: right;
            margin-right: 40px;
        }
            .as-pos .summary .summary-item.wheel-item .msrp h6 {
                color: #7a7a7a;
                text-align: right;
            }
    .as-pos .summary .summary-item.accessory-item {
        padding-bottom: 12px;
        border-bottom: 1px solid #EEE;
        margin-bottom: 12px;
    }
        .as-pos .summary .summary-item.accessory-item .accessory-name-partno {
            float: left;
            width: 70%;
        }
        .as-pos .summary .summary-item.accessory-item .msrp {
            float: left;
            text-align: right;
            padding-right: 40px;
            width: 30%;
        }
            .as-pos .summary .summary-item.accessory-item .msrp h6 {
                color: #7a7a7a;
            }
    .as-pos .summary .summary-item.siew-item {}
        .as-pos .summary .summary-item.siew-item .siew-name {
            width: 80%;
            float: left;
        }
        .as-pos .summary .summary-item.siew-item .msrp {
            width: 20%;
            float: left;
            text-align: right;
            padding-right: 40px;
        }
            .as-pos .summary .summary-item.siew-item .msrp h6 {
                color: #7a7a7a;
            }
    .as-pos .summary .total-category {
        margin-top: 20px;
        border-top: 2px solid #EEE;
        padding-top: 20px;
        font-size: 18px;
        font-family: "BMW_TypeWebBold", Arial, Helvetica, sans-serif;
        color: #262626;
    }
        .as-pos .summary .total-category .minor-row {
            font-size: 0.8em;
            color: #7a7a7a;
        }
        .as-pos .summary .total-category .total-labour,
        .as-pos .summary .total-category .total-msrp,
        .as-pos .summary .total-category .total {
            text-align: right;
            padding-right: 40px;
        }
    .as-pos .summary .buttons {
        margin-top: 40px;
    }
        .as-pos .summary .buttons .btn:last-child {
            margin-right: 15px;
        }
    .as-pos .summary .summary-legal {
        margin-top: 40px;
    }
    .as-pos .summary .send-to-parts-desk-section h3,
    .as-pos .summary .send-pdf-section h3 {
        padding-bottom: 15px;
        border-bottom: 1px solid #EEE;
        margin-bottom: 40px;
        position: relative;
    }
        .as-pos .summary .send-to-parts-desk-section h3.code {
            padding-bottom: 0;
            border-bottom: 0;
            margin-top: 10px;
        }
    .as-pos .summary .send-pdf-section label {
        line-height: 34px;
    }
        .as-pos .summary .send-pdf-section label p {
            display: inline;
        }
    .as-pos .summary .btn.please-wait::after {
        content: " ";
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: none;
        background-color: RGBA(255, 255, 255, 0.7);
        z-index: 2;
        -webkit-animation: none;
        animation: none;
    }
    .as-pos .summary .btn.please-wait::before {
        content: " ";
        display: block;
        position: absolute;
        width: 30px;
        height: 30px;
        top: calc(50% - 15px);
        left: calc(50% - 15px);
        border-radius: 1000px;
        border: 3px solid #1c69d4;
        border-right-color: RGBA(0, 0, 0, 0);
        z-index: 3;
        -webkit-animation: spin 0.8s infinite linear;
        animation: spin 0.8s infinite linear;
    }
    .as-pos .summary .retailer-staff-choices {
        max-height: 350px;
        border: 1px solid #8e8e8e;
        overflow-y: auto;
    }

.as-pos .vsp-section {
    position: fixed;
    bottom: -50%;
    left: calc(55% - 100px);
    transform: translateX(-50%);
    width: calc(100vw - 530px);
    background-color: #FFF;
    border: 1px solid #8f8f8f;
    border-bottom: none;
    z-index: 3;
    transition: bottom 0.3s ease-in-out;
    padding: 30px 30px 0 30px;
}
    .as-pos .vsp-section.on {
        bottom: 0;
    }

    .as-pos .vsp-section .row > .left {
        position: relative;
        width: 40%;
        padding: 0 15px;
        float: left;
    }
        .as-pos .vsp-section .row > .left h3 {
            margin-bottom: 20px;
        }

    .as-pos .vsp-section .row > .right {
        position: relative;
        width: 60%;
        padding: 0 15px 0 40px;
        float: left;
        border-left: 1px solid #DDD;
    }
    .as-pos .vsp-section .cover {
        background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 99%, rgba(255,255,255,1) 100%);
        background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 99%,rgba(255,255,255,1) 100%);
        background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 99%,rgba(255,255,255,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 );
        position: absolute;
        bottom: 0;
        right: 0;
        width: 100%;
        height: 100px;
        z-index: 2;
        pointer-events: none;
    }
    .as-pos .vsp-section .scroll-wrapper {
        max-height: 400px;
        overflow: hidden;
    }
        .as-pos .vsp-section .scroll-wrapper .scroller {
            position: relative;
        }
    .as-pos .vsp-section .vsp-list {}
        .as-pos .vsp-section .vsp-list .vsp-item {
            padding-bottom: 13px;
            border-bottom: 1px solid #EEE;
            margin-bottom: 13px;
        }
            .as-pos .vsp-section .vsp-list .vsp-item > img:not(.info) {
                float: left;
                width: 120px;
            }
            .as-pos .vsp-section .vsp-list .vsp-item .info {
                display: none;
            }
            .as-pos .vsp-section .vsp-list .vsp-item .name-msrp {
                float: left;
                width: calc((100% - 155px) * 0.3);
                padding: 0 0 0 30px;
            }
                .as-pos .vsp-section .vsp-list .vsp-item .name-msrp h6 sup {
                    font-family: "arial", sans-serif;
                    font-size: 10px;
                    line-height: 12px;
                }
            .as-pos .vsp-section .vsp-list .vsp-item .description {
                float: left;
                width: calc((100% - 155px) * 0.7);
                padding: 0 30px;
            }
            .as-pos .vsp-section .vsp-list .vsp-item .checkbox {
                float: left;
                width: 35px;
            }
    .as-pos .vsp-section .legal {
        position: relative;
        z-index: 3;
        padding: 15px 0;
    }

@media(max-height: 938px) {
    .as-pos .variant-select .variant-chooser .vehicle-name-and-year {
        bottom: 80px;
    }
}


@-webkit-keyframes textGlow {
    0% { text-shadow: 0 0 20px #2176cd, 0 0 15px #2176cd, 0 0 5px #2176cd; }
    50% { text-shadow: 0 0 20px #2c3f52; }
    100% { text-shadow: 0 0 20px #2176cd, 0 0 15px #2176cd, 0 0 5px #2176cd; }
}
@keyframes textGlow {
    0% { text-shadow: 0 0 20px #2176cd, 0 0 15px #2176cd, 0 0 5px #2176cd; }
    50% { text-shadow: 0 0 20px #2c3f52; }
    100% { text-shadow: 0 0 20px #2176cd, 0 0 15px #2176cd, 0 0 5px #2176cd; }
}

@-webkit-keyframes fade {
    0% { opacity: 1; }
    50% { opacity: 0; }
    100% { opacity: 1; }
}
@keyframes fade {
    0% { opacity: 1; }
    50% { opacity: 0; }
    100% { opacity: 1; }
}
@-webkit-keyframes boxShadowGlow {
    0% {
        -webkit-box-shadow: 0px 0px 14px 2px rgba(28,105,212,0);
        -moz-box-shadow: 0px 0px 14px 2px rgba(28,105,212,0);
        box-shadow: 0px 0px 14px 2px rgba(28,105,212,0);
    }

    50% {
        -webkit-box-shadow: 0px 0px 14px 2px rgba(28,105,212,1);
        -moz-box-shadow: 0px 0px 14px 2px rgba(28,105,212,1);
        box-shadow: 0px 0px 14px 2px rgba(28,105,212,1);
    }

    100% {
        -webkit-box-shadow: 0px 0px 14px 2px rgba(28,105,212,0);
        -moz-box-shadow: 0px 0px 14px 2px rgba(28,105,212,0);
        box-shadow: 0px 0px 14px 2px rgba(28,105,212,0);
    }
}
@keyframes boxShadowGlow {
    0% {
        -webkit-box-shadow: 0px 0px 14px 2px rgba(28,105,212,0);
        -moz-box-shadow: 0px 0px 14px 2px rgba(28,105,212,0);
        box-shadow: 0px 0px 14px 2px rgba(28,105,212,0);
    }

    50% {
        -webkit-box-shadow: 0px 0px 14px 2px rgba(28,105,212,1);
        -moz-box-shadow: 0px 0px 14px 2px rgba(28,105,212,1);
        box-shadow: 0px 0px 14px 2px rgba(28,105,212,1);
    }

    100% {
        -webkit-box-shadow: 0px 0px 14px 2px rgba(28,105,212,0);
        -moz-box-shadow: 0px 0px 14px 2px rgba(28,105,212,0);
        box-shadow: 0px 0px 14px 2px rgba(28,105,212,0);
    }
}