﻿@media only screen and (max-width: 600px) { 
    .innerMainContainer {
        max-width: 600px;
        min-width: 500px;
    }

    .homeMainImageContainer {
        height: 385px;
    }

    .familyRow {
        display: block;
    }

    .familyImageContainer {
        margin: auto;
        display: block;
        text-align: center;
        width: 288px;
    }

    .mainContentBlueButton, .regContainer .cancelButton {
        display: block;
        margin: auto;
    }

    .regContainer .cancelButton {
        margin-top: 10px;
        padding-left: 22px;
        padding-right: 22px;
    }

    .blueCard .leftColumn {
        display: block;
        margin: auto;
    }

    video {
        width: 100%;
    }

    .tallIcon {
        height: 150px;
    }

    .mainContainer .lightBlueCardTopRow {
        margin-bottom: 50px;
        display: block;
    }

    .homeMainRow {
        width: 100%;
        height: 100%;
        margin-bottom: 10px;
        display: block;
    }

    .homeMainLeftColumn, .homeMainRightColumn {
        display: block;
        margin: auto;
        width: 95%;
        height: 100%;
        margin-bottom: 10px;
    }

    .mainCard {
        display: block;
    }

    .exploreButton {
        margin: initial;
    }

    .headerContainer {
        text-align: initial;
        min-width: 500px;
    }

    .header {
        max-width: initial;
        transform: initial;
        width: 100%;
    }

        .header .logoContainer {
            margin-left: 10px;
        }

    .headerContentContainer {
        width: initial;
        right: 10%;
    }

    .header .linkRow {
        /*        top: 0%;*/
        position: absolute;
        right: 0%;
    }

    .homeMainRow .mainCard img {
        width: 100%;
    }

    .homeCapstoneImg {
        margin: auto;
        display: block;
    }

    .familyRowRightColumn {
        width: 100%
    }

    .mainContainer .innerMainContainer .lightBlueCard .lightBlueCardTitle {
        width: 100%;
        height: initial;
    }

    .mainContainer .innerMainContainer .blueCard .rightColumn p {
        width: 80%;
    }

    .carouselSideImage {
        width: 100%;
        display: block;
        margin: auto;
    }

    .carouselRightColumn {
        width: 100%;
        display: block;
    }

    .carouselHome {
        display: block;
        width: 85%;
        position: relative;
        margin: auto;
        height: 100%;
        margin-top: -60px;
    }

    .carouselContainer {
        display: block;
        text-align: center;
    }

    .carouselTitle {
        display: block;
        position: relative;
        margin-top: 0;
    }

    .cardWithTopIcon, .cardLikeCardWithTopIcon {
        width: 100%;
    }


    .environmentLabel {
        top: 50px;
    }

    .rz-menu-toggle, .rz-menu-toggle i {
        color: white !important;
    }

    .rz-navigation-item-link:not(:active) {
        background-color: #0077B3;
    }

    .rz-navigation-item-text {
        background-color: inherit;
    }

        .rz-navigation-item-link:hover, .rz-navigation-item-text:hover, .rz-navigation-item-link:active, .rz-navigation-item-text:active {
            background-color: #35a0d7 !important;
        }

            .rz-navigation-item-link:hover > span, .rz-navigation-item-text:hover > span, .rz-navigation-item-link:active > span, .rz-navigation-item-text:active > span {
                background-color: #35a0d7 !important;
            }

    .footer .logoContainer {
        text-align: center;
        display: block;
    }

        .footer .logoContainer img {
            width: initial;
        }

    .footer .smallerLinkRow {
        padding-left: 0;
        margin-left: 0;
    }

        .footer .smallerLinkRow, .footer .smallerLinkRow a, .footer .linkRow {
            display: block;
            border: none;
            text-align: center;
        }

    .footer .linkRow {
        border: none;
        margin-top: 15px;
    }

        .footer .linkRow a {
            width: 100%;
            display: block;
        }

    .footer .description {
        position: relative;
        width: 90%;
    }

    .footerContainer {
        height: initial;
        position: absolute;
        min-width: 500px;
        text-align: center;
    }

        .footerContainer .footer {
            position: relative;
        }
        .footerContainer .mwaLogoRow{
            /*text-align: left;*/
        }
        .footerContainer .description{
            text-align: left;
            margin: auto;
        }
        .footerContainer .externalLinks {
            width: 90%;
            text-align: left;
            margin: auto;
        }
        .footerContainer .externalLinkDisclaimer {
            width: 90%;
            text-align: left;
            margin-left: auto;
        }

    .footer .addressBlock {
        text-align: center;
        width: 100%;
    }

    .footer .copyrightBlock {
        width: 100%;
        text-align: center;
    }

    .footer .footerOptionalLineBreak {
        display: block;
    }

    .footer .hideInMobile {
        display: none;
    }

    .zipc {
        width: 100%;
    }

    .gradeCheckboxColumn {
        min-width: 90%;
        min-height: 40px;
    }

    .otherGradeTextbox {
        min-width: 90%;
        min-height: 40px;
        margin-top: 15px;
    }

    .fullWidthMobile {
        min-width: 100%;
        padding-top: 10px;
    }

    .registrationContainer fullRow {
        width: 90%;
    }

    .leftCancel {
        margin-left: 0px !important;
    }

    .circleImageContainer {
        width: 100%;
    }

        .circleImageContainer img {
            margin: auto;
        }

    .capstoneInnerMainContainer .capstoneTopRightColumn {
        width: 300px;
    }

    .capstoneButtonRow {
        text-align: left;
    }

        .capstoneButtonRow button {
            margin-left: 0;
        }

    .capstoneTopRow {
        text-align: center;
    }

        .capstoneTopRow p {
            text-align: left;
        }

    .faqInterludeParagraph {
        width: 400px;
    }

    .curriculumContainer .mainContentBlueButton, .curriculumContainer .mainContentButton {
        margin-left: 0;
    }

    .curriculumContainer .lightBlueCardTitle, .curriculumContainer .lightGreenCardTitle, .curriculumContainer .lightOrangeCardTitle {
        width: initial;
    }

    .curriculumContainer .bottomHalfCard .lightBlueCardTitle, .curriculumContainer .bottomHalfCard .lightGreenCardTitle, .curriculumContainer .bottomHalfCard .lightOrangeCardTitle {
        position: absolute;
        height: 20px;
    }

/*    .curriculumContainer .bottomHalfCard .rigthHalf {
        padding-left: 10px;
    }*/

        .curriculumContainer .bottomHalfCard .rigthHalf p:first-of-type {
            padding-top: 30px;
        }

    .profileContainer .capstoneTopRow, .curriculumContainer .capstoneTopRow, .helpCenterContainer .capstoneTopRow, .aboutUsContainer .capstoneTopRow, .lessonsContainer .capstoneTopRow, .myDashboardTopRow {
        display: flex;
        flex-direction: column;
    }

    .profileTopLeftColumn, .curriculumContainer .capstoneTopLeftColumn, .helpCenterContainer .capstoneTopLeftColumn, .aboutUsContainer .capstoneTopLeftColumn, .lessonsContainer .capstoneTopLeftColumn, .myDashboardTopLeftColumn {
        order: 2;
        width: 100%;
    }

    .profileTopRightColumn, .curriculumBuilderTopRightColumn, .helpCenterTopRightColumn, .aboutUsTopRightColumn, .lessonsTopRightColumn, .myDashboardTopRightColumn {
        order: 1;
    }

    .profileTopLeftColumn, .curriculumContainer .capstoneTopLeftColumn, .helpCenterContainer .capstoneTopLeftColumn, .aboutUsContainer .capstoneTopLeftColumn {
        text-align: center;
    }

    .myDashboardTopLeftColumn {
        padding-top: 0;
    }

    .myDashboardTopRightColumn {
        margin: auto;
        margin-top: 20px;
        height: 200px;
    }

    .profileContainer .profileTopLeftColumn p {
        text-align: center;
    }

    .profileContainer .profileForm .rz-row {
        display: block !important;
    }

    .profileContainer .profileForm .rz-col {
        width: 100% !important;
        display: block !important;
    }

    .profileContainer .checkboxRow .rz-col {
        min-height: 30px;
    }

    .mobileCheckboxSpecialSpacer {
        min-height: 35px;
    }

    .registrationContainer .rz-row {
        display: block !important;
    }

    .registrationContainer .rz-col {
        width: 100% !important;
        display: block !important;
    }

    .cookieBanner {
        position: fixed;
        bottom: 0;
        width: 100%;
        max-height: 50vh; /* Limit to 50% of viewport height */
        overflow-y: auto; /* Make it scrollable if content exceeds max-height */
        background: #f8f9fa;
        padding: 15px; /* Reduced from 10px 10% */
        box-shadow: 0 -2px 8px rgba(0,0,0,0.1);
        z-index: 9999;
        left: 0;
        right: 0;
    }

        .cookieBanner p {
            margin: 0 0 10px 0; /* Ensure consistent spacing */
            font-size: 14px; /* Slightly smaller on mobile */
            line-height: 1.4;
        }

    .myDashboardTopRow {
        text-align: center;
    }

    .myDashboardTopLeftColumn {
        text-align: left;
    }

    .dashboardContainer .cardLikeCardWithTopIcon {
        display: flex;
        flex-direction: column;
    }

        .dashboardContainer .cardLikeCardWithTopIcon .leftColumn {
            width: 100%;
            order: 2;
            text-align: center;
        }

        .dashboardContainer .cardLikeCardWithTopIcon .rightColumn {
            order: 1;
            width: 50%;
            margin: auto;
        }

    .dashboardContainer .logoContainer {
        margin-left: auto;
        margin-right: auto;
    }

    .contactUsForm .rz-col, .contactUsForm .rz-row {
        width: 100% !important;
        display: block !important;
    }

    .capstoneInnerMainContainer .lightBlueCard {
        text-align: center;
    }

        .capstoneInnerMainContainer .lightBlueCard p {
            text-align: left;
        }

    .regContainer .halfRow {
        width: 100%;
    }

    .regCity {
        width: 100%;
    }

    .labelRow{
        height: initial;
    }
    .tooltipText {
        margin-left: 0 !important;
        margin-top: 10px !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
    }
    .lessonsTopRightColumn {
        width: 80%;
        display: inline-flex;
        height: 235px;
        justify-content: center;
        align-self: center;
        margin: 10px auto;
    }
    .lessonsContainer .capstoneTopLeftColumn {
        padding-top: 10px;
        text-align: left;
    }
    .lessonsAccordionGiantTextContainer {
        width: 100% !important;
        display: block !important;
    }
    .lessonsContainer .bottomHalfCard .rz-row {
        display: block !important;
    }
    .lessonsContainer .bottomHalfCard .rz-col {
        width: 100% !important;
        display: block !important;
        margin-bottom: 15px;
    }
    .whatDrivesUs {
        text-align: center;
        padding-left: 0;
    }
    .homeContainer .blueCard .blueCardTitle {
        text-align: center;
    }
    .homeContainer .blueCard .rightColumn p {
        text-align: left;
        margin: auto;
    }
    .homeContainer .blueCard .rightColumn {
        width: initial;
    }
    .helpCenterContainer .lightBlueCard {
        text-align: center;
    }
        .helpCenterContainer .lightBlueCard p {
            text-align: left;
        }
    .helpCenterContainer .faqInterludeParagraph{
        width: initial;
    }
    .aboutUsContainer .lightBlueCardRightColumn {
        width: initial;
    }
    .curriculumBuilderTopRightColumn{
        margin-left: auto;
        margin-right: auto;
    }
    .curriculumContainer .lightBlueCardLeftColumn { 
        text-align: center;
        width: 100%;
    }
    .curriculumContainer .lightBlueCardLeftColumn img {
        margin-left: auto;
        margin-right: auto;
    }

    .faqInterludeParagraph.specialRequest {
        margin-left: auto;
        margin-right: auto;
    }

    .curriculumBuilderTitleLevelOneExtraRoom h2 {
        margin-left: -15px;
    }
    .regContainer .dropLabel {
        padding-bottom: 15px;
    }
    .mobileLastNameSpacer{
        margin-top:10px;
    }
    .registrationContainer .labelRow {
        height: 40px;
    }
    .profileForm .rz-row {
        margin-bottom: initial !important;
    }
    .profileForm .profileCheckbox {
        height: 35px;
    }
    .mobileFullRow {
        width: 95%;
    }
    .lessonsAccordionGiantTextContainer {
        width: 100% !important;
        margin-left: auto;
        margin-right: auto;
    }
    .lessonIconContainer {
        margin-left: auto;
        margin-right: auto;
        transform: translateX(-20px);
        margin-bottom: 20px;
    }
}
