@media only screen and (max-width: 768px) {
    /* Global styles - Mobile only */

    h1 {
        font-size: 24px;
        line-height: 32px;
        color: #11181c;
    }

    p {
        font-size: 14px;
        line-height: 20px;
        color: #687076;
    }

    /* Custom Built Classes for Mobile only */

    .mb-mb-0 {
        margin-bottom: 0 !important;
    }

    .mt-mb-0 {
        margin-top: 0 !important;
    }

    .mr-mb-0 {
        margin-right: 0 !important;
    }

    .ml-mb-0 {
        margin-left: 0 !important;
    }

    .mt-mb-1 {
        margin-top: 0.25rem !important;
    }

    .mt-mb-2 {
        margin-top: 0.5rem !important;
    }

    .mt-mb-3 {
        margin-top: 1rem !important;
    }

    .mt-mb-4 {
        margin-top: 1.5rem !important;
    }

    .mt-mb-5 {
        margin-top: 3rem !important;
    }

    .mb-mb-1 {
        margin-bottom: 0.25rem !important;
    }

    .mb-mb-2 {
        margin-bottom: 0.5rem !important;
    }

    .mb-mb-3 {
        margin-bottom: 1rem !important;
    }

    .mb-mb-4 {
        margin-bottom: 1.5rem !important;
    }

    .mb-mb-5 {
        margin-bottom: 3rem !important;
    }

    .mr-mb-1 {
        margin-right: 0.25rem !important;
    }

    .mr-mb-2 {
        margin-right: 0.5rem !important;
    }

    .mr-mb-3 {
        margin-right: 1rem !important;
    }

    .mr-mb-4 {
        margin-right: 1.5rem !important;
    }

    .mr-mb-5 {
        margin-right: 3rem !important;
    }

    .ml-mb-1 {
        margin-left: 0.25rem !important;
    }

    .ml-mb-2 {
        margin-left: 0.5rem !important;
    }

    .ml-mb-3 {
        margin-left: 1rem !important;
    }

    .ml-mb-4 {
        margin-left: 1.5rem !important;
    }

    .ml-mb-5 {
        margin-left: 3rem !important;
    }

    .mb-custom {
        margin-bottom: 96px;
    }

    .w-mb-100 {
        width: 100% !important;
    }

    .w-mb-75 {
        width: 75% !important;
    }

    .w-mb-50 {
        width: 50% !important;
    }

    .align-items-start-mb {
        align-items: flex-start !important;
    }

    .justify-content-between-mb {
        justify-content: space-between !important;
    }

    .display-small-font {
        font-size: 24px;
        line-height: 32px;
    }

    /* Navigation Bar */

    .navbar {
        padding: 16px;
    }
    nav.navbar.navbar-expand-lg.navbar-light, .nav-section {
        height: auto;
    }
    .nav-section .container {
        background-color: #fff;
    }

    /* Floating Action Button */

    /* .fab-parent-div {
        display: none;
    } */

    .st-popup {
        bottom: 5%;
        left: 75%;
    }

    /* Banner Section */

    #banner-section {
        min-height: 564px;
    }

    /* #banner-video {
        height: 88vh;
    } */

    .banner-btns {
        bottom: 37%;
    }

    /* Intro Section */

    #intro-section .intro-blurb p.primary-font-color {
        font-size: 16px;
        line-height: 24px;
    }

    /* Color Section */

    .color-options .color-div-parent-red,
    .color-options .color-div-parent-blue,
    .color-options .color-div-parent-yellow,
    .color-options .color-div-parent-grey,
    .color-options .color-div-parent-black,
    .color-options .color-div-parent-white, 
    .color-options .color-div-parent-ocean-blue{
        width: 42px;
        height: 42px;
        padding: 8px;
        margin-right: 24px;
    }

    .color-options .metallic-red,
    .color-options .galactic-grey,
    .color-options .graphite-black {
        height: 24px;
        width: 24px;
        padding: 8px;
    }

    /* Features Section */

    #features-section .nav-tabs .nav-link.active {
        background-color: #fff;
    }
    .nav-tabs .nav-link
    {
        font-size: 16px;
    }
    #features-section .nav-tabs .nav-link {
        padding: 8px 0px !important;
    }

    #features-section .nav-tabs {
        margin: 32px 0px;
    }

    #features-section p {
        font-weight: 500;
        font-size: 16px;
        line-height: 24px;
        color: #11181c;
    }

    /* Savings Meter Section */

    #savings-meter-section .heading-output-commute,
    #savings-meter-section .heading-output-mileage {
        font-family: Inter;
        font-weight: 500;
        font-size: 16px;
        line-height: 24px;
        color: #11181c;
    }

    #savings-meter-section .monthly,
    #savings-meter-section .yearly {
        font-family: Inter;
        font-style: normal;
        font-weight: 500;
        font-size: 14px;
        line-height: 22px;
        color: #7e868c;
    }

    /* Support Section */

    #support-section {
        padding: 16px;
    }

    #support-section h2 {
        font-size: 20px;
        line-height: 28px;
    }

    #support-section h4 {
        font-weight: 500;
        font-size: 16px;
        line-height: 24px;
        color: #0091ff;
    }

    /* Mobile App Section */

    #mobile-app-section {
        padding: 16px 16px 0px;
    }

    /*** Sitemap Page ***/

    /* Banner Section */

    #sitemap-banner-section {
        padding: 0px 20px;
    }

    #sitemap-banner-section .display-small-font {
        font-size: 24px;
        line-height: 32px;
    }

    /* Sitemap Divs Section */

    #sitemap-divs .electric-scooters-div,
    #sitemap-divs .purchase-div,
    #sitemap-divs .about-div,
    #sitemap-divs .floating-menu-div,
    #sitemap-divs .social-div,
    #sitemap-divs .policies-div {
        border-bottom: 2px solid #eceef0;
        border-radius: 4px;
        padding-top: 1rem;
        padding-bottom: 6rem;
    }

    #sitemap-divs .electric-scooters-div {
        border-top: 2px solid #eceef0;
    }

    /*** Download Page ***/

    #downloads-banner-section {
        padding: 0px 20px;
    }

    #downloads-banner-section .display-small-font {
        font-size: 24px;
        line-height: 32px;
    }

    #downloads-banner-section .ri-folder-download-line {
        font-size: 24px;
        line-height: 32px;
    }

    /*** Support Page ***/

    /* Email Support Section */

    #email-support-section {
        padding: 16px;
    }

    #email-support-section h2 {
        font-size: 20px;
        line-height: 28px;
    }

    #email-support-section h4 {
        font-weight: 500;
        font-size: 16px;
        line-height: 24px;
        color: #0091ff;
    }

    /*** Magnus EX Page ***/

    .pricing-div {
        padding: 16px;
    }

    .pricing-div .title-large-font {
        font-size: 16px;
        line-height: 24px;
    }

    #magnus-ex-benefits-section .right-column .heading-div {
        margin-top: 32px;
    }

    #magnus-ex-benefits-section .right-column img {
        bottom: 0px;
    }

    /*** Zeal EX Page ***/

    /* Color Section */

    .color-options .color-div-parent-burgundy,
    .color-options .color-div-parent-white,
    .color-options .color-div-parent-black {
        width: 42px;
        padding: 8px;
        margin-right: 24px;
    }

    /* zeal ex */
    .color-options .burgundy-red,
    .color-options .pearl-white,
    .color-options .graphite-black,
    /* reo-plus */
    .color-options .reo-red,
    .color-options .reo-blue,
    .color-options .reo-yellow,
    /* magnus */
    .color-options .mettalic-red,
    .color-options .pearl-white,
    .color-options .golden-yellow,
    .color-options .graphite-black,
    .color-options .glacier-white,
    .color-options .ocean-blue

     {
        height: 24px;
        width: 24px;
        padding: 8px;
    }

    /* Expert Review Section */

    #expert-review-section .review-item {
        padding: 16px;
    }

    .review-item-video button {
        top: 36%;
        left: 36%;
    }

    /*** Financing Page ***/

    #financing-cta-section .financing-cta-one,
    #financing-cta-section .financing-cta-two {
        padding: 16px;
    }

    #financing-cta-section .display-small-font,
    .ampere-scooters-div .display-small-font {
        font-size: 24px;
        line-height: 32px;
    }

    .ampere-scooters-div {
        padding: 16px;
    }

    /*** Lease Page ***/

    /* Benefits Section */

    .benefits-card {
        padding: 25px 30px;
    }

    /* Details Section */

    #lease-details-section .body-large-font {
        font-size: 14px;
        line-height: 22px;
    }

    /* Dealership Lease Section */


    .dealership-lease-phone {
        width: 40%;
    }

    .dealership-lease-email {
        width: 60%;
    }

    .dealership-lease-email.w-75 {
        width: 84% !important;
    }
    
    .footer-menu {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
    .headline-xs-font {
        font-family: "Outfit";
        font-size: 20px;
        line-height: 28px;
    }
    

    /*** Thank You Page ***/

    .thank-product-magnus{
        padding: 16px;
    }

    .thank-product-magnus .headline-small-font {
        font-size: 20px;
        line-height: 28px;
    
    }
    .primary-footer .row:first-of-type a {
        margin-right: 16px;
    }

    .secondary-footer 
    {
        text-align: center;
    }
    .clipboard-text p
    {
        font-size: 12px;
    }

    #press-release-section {
        padding: 16px;
    }
    .submit-business-details {
        position: absolute;
        bottom: 16px;
    }

    #dealership-campaign-page .title-medium-font {
        font-size: 16px;
        line-height: 24px;
    }

    .fraudsters-warning i, .documents-info i {
        top: 0px;
    }

    .area-breakdown-table table, .investment-breakdown-table table{
        width: 100%;
    }

    #dealership-campaign-page .headline-small-font {
        font-size: 20px;
        line-height: 28px;
    }

    #dealership-campaign-page .body-medium-font {
        font-size: 14px;
        line-height: 22px;
    }

    #dealership-campaign-page .headline-medium-font {
        font-size: 20px;
        line-height: 28px;
    }

    #dealership-campaign-page .body-large-font {
        font-size: 12px;
        line-height: 20px;
    }

    .submit_business-details {
        width: 94% !important;
        position: absolute;
    }

    .fraudsters-warning .label-xl-font, .documents-info .label-xl-font {
        font-size: 14px;
        line-height: 22px;
    }

    #business-details-banner-section i {
        top: 4px;
    }

    .finance-partner-modal {
        left: 4%;
    }

    .journey-video-modal {
        top: 30%;
        margin-left: 0;
        width: 97%;
    }
}


