h2.section_heading {
    font-size: 45px;
    font-weight: 600;
    line-height: 1.25;
    margin-bottom: 18px;
}

.subMenu {
    display: flex;
    justify-content: center;
    margin-bottom: 40px;
}

.subMenu a {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ffffffb4;
    padding: 10px 16px;
    border-right: 1px solid #a09f9f;
    text-decoration: none;
    color: #333;
    width: 200px;
    line-height: 1.1;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.15);

}

.subMenu a .m {
    display: none;
}

.subMenu a .d {
    display: block;
}

.subMenu a:first-child {
    border-radius: 24px 0 0 24px;
}

.subMenu a:last-child {
    border-radius: 0 24px 24px 0;
    border-right: 0;
}

.subMenu a.selected {
    background-color: rgba(64, 87, 109, .07);
    color: #104e70;
    font-weight: 600;
}

.subMenu a:hover:not(.selected) {
    background-color: rgba(64, 87, 109, .07);
}

.toolkitTop {
    background: linear-gradient(to bottom, #e7f6ff 18%, transparent), linear-gradient(125deg, #8BC6E7 5%, #FEE39E 30%, #FFB3BB 100%);
    padding: 30px 0 120px;
    margin-bottom: 30px;
}

.partnersTop {
    padding-bottom: 0px;
    margin-bottom: 160px;
}

.partnersTop .bageHeaderIcon {
    background-color: #fff;
    border-radius: 100%;
    padding: 20px;
    width: 260px;
    height: 260px;
    margin-bottom: -130px;
}

.programCTA {
    background: linear-gradient(135deg, #eadeff, #dfeaff 25%, #ecf4fa 70%, #e5fffc);
    ;
    border-radius: 20px;
    display: grid;
    grid-template-areas:
        "icon title title link"
        "icon description description link";
    text-decoration: none;
    padding: 20px 20px 0 20px;
    column-gap: 30px;
    align-items: center;
    justify-items: center;
}

.programCTA h3,
.programCTA div {
    max-width: 700px;
    width: 100%;
    text-align: left;
}

.programCTA h3 {
    grid-area: title;
    font-weight: 600;
    font-size: 25px;
}

.programCTA div {
    grid-area: description;
    padding-bottom: 20px;
}

.programCTA img {
    grid-area: icon;
    align-self: end;
}

.programCTA a {
    grid-area: link;
    width: 180px;
    font-weight: bold;
    text-decoration: none;
    font-weight: 600;
    color: #fff;
    background: linear-gradient(135deg, #4600bfdb, #611bdaa7);
    border-radius: 10px;
    padding: 10px;
    box-shadow: 4px 4px #b293e7;
    transition: all .3s ease-in-out;
}

.programCTA a:hover {
    transform: translateY(4px) translateX(4px);
    box-shadow: 0 0 #6c4298;
}

.toolkitTop .container {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.activitiesTop {
    padding: 60px 0 0;
    background: linear-gradient(353deg, rgba(152, 231, 121, 0.00) 45.27%, #b5ddf4 111.76%), linear-gradient(353deg, #d3f3de -6.71%, #e5f9dd 105.57%);
    text-align: center;

}

.LMSTop {
    background: linear-gradient(195deg, rgb(237, 236, 255) 15%, rgb(220, 212, 246) 70%);
}

.whatnewTop {
    margin-bottom: 80px;
    background-color: #F6E9FE;
    background-image: url('../images/dist/new/header.png');
    background-position: bottom;
    background-size: cover;

}

.whatnewTop .container {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.whatnewTop .container {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.whatnewTop .container .sectionSubtitle,
.toolkitTop .container .sectionSubtitle {
    left: 0;
    transform: none;
}

.keyActivities {
    margin: 0 0 60px 0;
    font-size: 16px;
    line-height: 120%;
    width: fit-content;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 10px;
    color: #5c5c5c;
}

.keyActivities img {
    background-color: #6461E0;
    border-radius: 100%;
    padding: 2px;
    width: 38px;
}

.activitiesTop .heroGrid {
    display: grid;
    grid-template-columns: repeat(9, 1fr);
    gap: 35px;
    justify-items: center;
    align-items: center;
}

.activitiesTop .heroImg {
    grid-column: 3/8;
    grid-row: 1/4;
    width: 500px;
    pointer-events: none;
}

.LMSTop .heroGrid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-row-gap: 0px;
    grid-column-gap: 30px;
    justify-items: center;
    align-items: center;
    grid-auto-flow: column;
}

.LMSTop .heroImg {
    grid-column: 2/3;
    grid-row: 1/4;
    width: 500px;
    pointer-events: none;
}

.activitiesTop .activityIcon {
    background: rgba(255, 255, 255, 0.38);
    border-radius: 12px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(2.3px);
    -webkit-backdrop-filter: blur(2.3px);
    border: 1px solid rgba(255, 255, 255, 0.42);
    font-weight: 500;
    padding: 4px;
    color: #5c5c5c;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
    align-items: center;
    width: 100px;
    height: 100px;
    margin-top: -120px;
    justify-items: center;

}

.LMSTop .activityIcon {
    flex-direction: row;
    width: fit-content;
    margin-top: -70px;
    padding: 14px;
    width: 70%;
    height: fit-content;
    gap: 14px;
    text-align: left;
    line-height: 1.4;
}

.LMSTop .activityIcon:nth-child(2n) {
    width: 85%;
}

.activitiesTop .activityIcon img {
    width: 44px;
}

.activitiesTop .activityIconA {
    transform: rotate(-8deg);
}

.activitiesTop .activityIconB {
    transform: rotate(8deg);
}

.activitiesTop .activityIconLogo {
    width: 120px;
    height: 60px;
    transform: rotate(5deg);


}

.activitiesTop .activityIconLogoB {
    width: 80px;
    height: 80px;
    transform: rotate(-5deg);
}

.activitiesTop .activityIconLogo img,
.activitiesTop .activityIconLogoB img {
    width: 80%;
}

.sectionReady {
    margin: 60px 0 100px 0;
    text-align: center;
}

.sectionWhatnew {
    margin: 60px 0 100px 0;
}

.sectionGuides {
    margin: 60px 0 100px 0;
}


.linksGrid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-auto-rows: 1fr;
    gap: 20px;
}

.linksGrid a {
    background: linear-gradient(78deg, #fcdb9d 0%, #fcd8d8 100%);
    border-radius: 24px;
    padding: 10px 20px 10px 20px;
    font-weight: 600;
    color: #333;
    text-decoration: none;
    display: flex;
    align-items: center;
    line-height: 120%;
    gap: 20px;
}

.linksGrid a img {
    width: 28px;
    margin-top: -2px;
}

.linksGrid a:hover {
    background: linear-gradient(78deg, #f26c29 0%, #F36CB6 100%);
    color: #fff;
}

.footerGrid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.instructionsGrid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    margin-top: 50px;
    column-gap: 20px;
    row-gap: 38px;
}

.instructionsGrid .item {
    background-color: #F8F8F8;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    color: #333;
    text-decoration: none;
    position: relative;
    padding: 18px;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    line-height: 1.5;
}


.instructionsGrid .item .title {
    color: #65559a;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
}

.MRGTP .item .title {
    background: linear-gradient(125deg, #0f6492 0%,#409066 95%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.instructionsGrid .title img {
    width: 32px;
}

.instructionsGrid .item a {
    color: #256894;
    text-decoration: none;
    font-weight: 600;
    white-space: nowrap;
}

.instructionsGrid .item a:hover {
    color: #6a4ada;
}

.instructionsGrid .item .stepNum {
    background: linear-gradient(195deg, rgb(237, 236, 255) 15%, rgb(220, 212, 246) 70%);
    color: #381c9d;
    border-radius: 100%;
    width: 36px;
    height: 36px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 18px;
    font-weight: 600;
    margin-top: -32px;
    border: 2px solid white;
}

.MRGTP .item .stepNum {
    background: linear-gradient(195deg, #fec166b8 15%, #e46f3d93 70%);
    color: #4e1d04;
}

.whatsnewReflectIcon {
    background-color: #fff;
    border-radius: 100%;
    padding: 15px;
    width: 100px;
    height: 100px;
    margin-bottom: -50px;
}

.whatsnewGrid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 44px;
    margin-top: 50px;
}

.whatsnewGrid .item {
    display: flex;
    flex-direction: column;
    color: #333;
    text-decoration: none;
    position: relative;
    padding: 0;
    gap: 10px;
}

.whatsnewGrid .itemImg {
    grid-area: icon;
    border-radius: 20px;
    margin-top: 0px;
    overflow: hidden;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.whatsnewGrid .itemImg img {
    pointer-events: none;
    width: 100%;
    height: 100%;
    transition: transform 0.5s ease;
}

.whatsnewGrid .item:hover .itemImg img {
    transform: scale(1.2);
}

.whatsnewGrid .itemTitle {
    font-weight: 600;
    left: 0;
    top: 18px;
    position: absolute;
    background-color: rgba(255, 255, 255, 0.8);
    border-radius: 0 10px 10px 0;
    padding: 6px 16px 6px 16px;
}

.whatsnewGrid .CTA {
    font-weight: 600;
    bottom: 18px;
    position: absolute;
    color: #fff;
    background: rgba(13, 18, 22, .8);
    border-radius: 10px;
    padding: 10px;
    transition: opacity .3s cubic-bezier(.4, 0, 1, 1);
    opacity: 0;
}

.whatsnewGrid .item:hover .CTA {
    opacity: 1;
}


.whatsnewGrid .itemTitle h3 {
    font-size: 20px;
    font-weight: 600;

}

.whatsnewGrid .itemTitle .itemTopic {
    font-size: 16px;
    font-weight: 600;
    color: #6e6e6e;

}

.whatsnewGrid .itemDescription {
    line-height: 140%;
    color: rgba(17, 23, 29, 0.6);
    font-size: 14px;
    padding: 4px 15px;
}



.activitiesGrid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}


.activitiesGrid .item,
.footerGrid .item {
    background-color: #F8F8F8;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    color: #333;
    text-decoration: none;
    position: relative;
    padding: 0;
    transition: box-shadow 0.4s;
}

.footerGrid .item {
    display: flex;
    padding: 14px;
    gap: 14px;
    flex-direction: column;
    align-items: center;
}

.footerGrid .item div {
    max-width: 450px;
}

.footerGrid .item a {
    display: flex;
    align-items: center;
    gap: 8px;
}

.activitiesGrid .item:hover,
.sectionProject .activitiesCTA:hover {
    box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 2px 0px, rgba(0, 0, 0, 0.12) 0px 8px 16px 0px;
}

.activitiesGrid .itemIcon {
    grid-area: icon;
    border-radius: 20px 20px 0 0;
    margin-top: 0px;
    overflow: hidden;
}

.activitiesGrid .itemIcon img {
    pointer-events: none;
    width: 100%;
    height: 100%;
    transition: transform 0.5s ease;
}

.activitiesGrid .item:hover .itemIcon img {
    transform: scale(1.2);
}

.activitiesGrid .itemTitle {
    padding: 14px 14px 0px 14px;
    font-weight: 600;
}

.activitiesGrid .itemTitle img {
    height: 25px;
    margin-bottom: 8px;
}

.activitiesGrid .itemDescription {
    padding: 0 14px 14px 14px;
    line-height: 140%;
    color: #5c5c5c;
}


.activitiesGrid .lockedItem:after {
    background-image: url(../images/dist/activities/lockedActivity.png);
    background-size: 32px 32px;
    width: 32px;
    height: 32px;
    left: 8px;
    top: 8px;
    position: absolute;
    content: "";
}



.toolkitGrid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.toolkitGrid .item {
    background-color: #fff;
    border-radius: 20px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    text-align: center;
}

.toolkitGrid .itemIcon {
    width: 64px;
    align-self: center;
    margin-bottom: -10px;
}

.toolkitGrid a,
.CollageCTA a,
.footerGrid a {
    background: linear-gradient(78deg, #c3e8fe 0%, #8BC6E7 100%);
    border-radius: 24px;
    padding: 8px 20px 8px 20px;
    font-weight: 600;
    color: #333;
    text-decoration: none;
    align-self: center;
    margin-top: auto;

}

.CollageCTA a {
    background: linear-gradient(78deg, #ffffff 0%, #f7effd 100%);
}

.toolkitGrid a:hover,
.footerGrid a:hover {

    background: linear-gradient(78deg, #1E86C2 0%, #8BC6E7 100%);
    color: #fff;
}

.CollageCTA a:hover {
    background: linear-gradient(78deg, #874DE7 0%, #C44ECF 100%);
    color: #fff;
}

.sectionProject {
    margin: 100px 0 100px;
    text-align: center;
}

.sectionProject .activitiesCTA {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-direction: row;
    width: fit-content;
    justify-content: center;
    color: #333;
    margin: 60px auto 0px auto;
    font-weight: 600;
    border-radius: 20px;
    text-decoration: none;
    padding: 12px 20px 12px 28px;
    background: linear-gradient(75deg, #d8d7f7 0%, #ddf3fb 100%);
}


.sectionProject .activitiesCTA .arrow,
.footerGrid .arrow {
    height: 20px;
    width: 20px;
    background-image: url('data:image/svg+xml, <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.00977 16.2402C5.00977 16.0775 5.03906 15.9212 5.09766 15.7715C5.15625 15.6217 5.2474 15.485 5.37109 15.3613L10.7324 10L5.37109 4.62891C5.13021 4.38802 5.00977 4.0918 5.00977 3.74023C5.00977 3.57096 5.04232 3.41146 5.10742 3.26172C5.17253 3.11198 5.26042 2.97852 5.37109 2.86133C5.48177 2.74414 5.61523 2.65299 5.77148 2.58789C5.92773 2.52279 6.09049 2.49023 6.25977 2.49023C6.42253 2.49023 6.58203 2.52279 6.73828 2.58789C6.89453 2.65299 7.02799 2.74414 7.13867 2.86133L13.3887 9.11133C13.4993 9.22201 13.5872 9.35547 13.6523 9.51172C13.7174 9.66797 13.7533 9.82747 13.7598 9.99023C13.7598 10.3353 13.6361 10.6315 13.3887 10.8789L7.13867 17.1289C7.02148 17.2461 6.88802 17.3372 6.73828 17.4023C6.58854 17.4674 6.42578 17.5 6.25 17.5C6.07422 17.5 5.91146 17.4674 5.76172 17.4023C5.61198 17.3372 5.48177 17.2493 5.37109 17.1387C5.26042 17.028 5.17253 16.8945 5.10742 16.7383C5.04232 16.582 5.00977 16.416 5.00977 16.2402Z" fill="%23333"/></svg>');
}

.footerGrid a:hover .arrow {
    background-image: url('data:image/svg+xml, <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.00977 16.2402C5.00977 16.0775 5.03906 15.9212 5.09766 15.7715C5.15625 15.6217 5.2474 15.485 5.37109 15.3613L10.7324 10L5.37109 4.62891C5.13021 4.38802 5.00977 4.0918 5.00977 3.74023C5.00977 3.57096 5.04232 3.41146 5.10742 3.26172C5.17253 3.11198 5.26042 2.97852 5.37109 2.86133C5.48177 2.74414 5.61523 2.65299 5.77148 2.58789C5.92773 2.52279 6.09049 2.49023 6.25977 2.49023C6.42253 2.49023 6.58203 2.52279 6.73828 2.58789C6.89453 2.65299 7.02799 2.74414 7.13867 2.86133L13.3887 9.11133C13.4993 9.22201 13.5872 9.35547 13.6523 9.51172C13.7174 9.66797 13.7533 9.82747 13.7598 9.99023C13.7598 10.3353 13.6361 10.6315 13.3887 10.8789L7.13867 17.1289C7.02148 17.2461 6.88802 17.3372 6.73828 17.4023C6.58854 17.4674 6.42578 17.5 6.25 17.5C6.07422 17.5 5.91146 17.4674 5.76172 17.4023C5.61198 17.3372 5.48177 17.2493 5.37109 17.1387C5.26042 17.028 5.17253 16.8945 5.10742 16.7383C5.04232 16.582 5.00977 16.416 5.00977 16.2402Z" fill="%23fff"/></svg>');
}

@media screen and (forced-colors: active) {
    .footerGrid .arrow {
        background-color: Highlight;
    }
}

.sectionCalm {
    background: linear-gradient(180deg, #60B4E7 0%, #6461E0 100%);
    padding: 80px 0 80px 0;

}

.sectionPartners {
    background: linear-gradient(135deg, #dde0fe 0%, #e6c8f7 50%, #a5d6f6 100%);
    padding: 80px 0 80px 0;

}


.sectionCalm .section_heading,
.sectionCalm .sectionSubtitle {
    color: #fff;

}

.sectionCalm .activitiesCTA {
    background: linear-gradient(75deg, #c9e5f7 0%, #cac9f4 100%);
}

.sectionTeachers {
    margin: 100px 0 0px 0;
}

.studentsLove {

    background: linear-gradient(215deg, #5E58C7 0%, #16BFDF 100%);
    padding: 80px 0 80px 0;
    text-align: center;
}

.studentsLove .sectionSubtitle,
.studentsLove .section_heading {
    color: #fff;
}

.studentsLove .toolkitGrid .item a {
    background: linear-gradient(135deg, #ddf4e2, #fee4d7);
}

.studentsLove .item a:hover {

    background: linear-gradient(78deg, #1E86C2, #1FB494);
}


.toolkiCollage {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    align-items: stretch;
    grid-gap: 10px;
    margin-top: 60px;
}

.toolkiCollage .CollageCTA {
    border-radius: 10px;
    background: linear-gradient(102deg, #fbddf0 7%, #e7d2f9 83%);
    grid-column: 5/9;
    grid-row: 1/3;

    font-size: 18px;
    line-height: 1.61;

    display: flex;
    flex-direction: column;
    text-align: center;
    padding: 20px;
    gap: 20px;

}




.toolkiCollage img {
    border-radius: 10px;
    padding-top: 5px;
    object-fit: cover;
}

.toolkiCollage .i1 {
    background: linear-gradient(133deg, #fbd388 0%, #f993b5 100%);
}

.toolkiCollage .i2 {
    background: linear-gradient(133deg, #aff2e8 0%, #a1aeeb 100%);
}

.toolkiCollage .i3 {
    background: linear-gradient(133deg, #99f1ac 0%, #9ac9e4 100%);
}

.toolkiCollage .i4 {
    background: linear-gradient(133deg, #f6d7d7 0%, #f1a8f8 100%);
}


.projectHeader {
    display: grid;
    grid-template-columns: 1fr 3fr;
    margin: 50px 0 50px 0;
    gap: 20px;
}

.projectHeader .project_img {
    background: linear-gradient(133deg, #B4EFB2 0%, #B4DCF2 100%);
    border-radius: 20px;

    padding: 0px 20px 0px 20px;
}

.studentsLove .project_img {
    background: linear-gradient(145deg, #b7f3c4 0%, #f6e5c9 100%);
}

.studentsLove .projectHeader .project_text {
    background: #ffffff;
}


.projectHeader .project_img img {
    max-width: 100%;
    max-height: 250px;
    margin: -30px auto -30px auto;
    pointer-events: none;
}

.projectHeader .project_text {

    padding: 24px 24px 24px 24px;
    font-size: 18px;
    line-height: 1.61;

    display: flex;
    justify-content: center;
    align-items: center;

    background: linear-gradient(33deg, #e8fae8, #e8f4fb, #fdf1f5, #fbe0d4);
    border-radius: 20px;
}



.sectionProject .toolkitGrid .item {
    background-color: #F8F8F8;
}

.sectionProject .toolkitGrid .item a {
    background: linear-gradient(135deg, #f9cdbb, #f8cbdb);
}

.sectionProject .toolkitGrid .item a:hover {

    background: linear-gradient(15deg, #e95688, #eb6125);
}

.toolkitGrid .item a span:before,
.CollageCTA a span:before {
    background: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.25 4C3.45507 4 2 5.45507 2 7.25V16.75C2 18.5449 3.45507 20 5.25 20H18.75C20.5449 20 22 18.5449 22 16.75V7.25C22 5.45507 20.5449 4 18.75 4H5.25ZM3.5 7.25C3.5 6.2835 4.2835 5.5 5.25 5.5H18.75C19.7165 5.5 20.5 6.2835 20.5 7.25V16.75C20.5 17.7165 19.7165 18.5 18.75 18.5H5.25C4.2835 18.5 3.5 17.7165 3.5 16.75V7.25ZM18.25 7C17.8358 7 17.5 7.33579 17.5 7.75V8.25C17.5 8.66421 17.8358 9 18.25 9C18.6642 9 19 8.66421 19 8.25V7.75C19 7.33579 18.6642 7 18.25 7ZM17.5 15.75C17.5 15.3358 17.8358 15 18.25 15C18.6642 15 19 15.3358 19 15.75V16.25C19 16.6642 18.6642 17 18.25 17C17.8358 17 17.5 16.6642 17.5 16.25V15.75ZM18.25 11C17.8358 11 17.5 11.3358 17.5 11.75V12.25C17.5 12.6642 17.8358 13 18.25 13C18.6642 13 19 12.6642 19 12.25V11.75C19 11.3358 18.6642 11 18.25 11ZM5 7.75C5 7.33579 5.33579 7 5.75 7C6.16421 7 6.5 7.33579 6.5 7.75V8.25C6.5 8.66421 6.16421 9 5.75 9C5.33579 9 5 8.66421 5 8.25V7.75ZM5.75 15C5.33579 15 5 15.3358 5 15.75V16.25C5 16.6642 5.33579 17 5.75 17C6.16421 17 6.5 16.6642 6.5 16.25V15.75C6.5 15.3358 6.16421 15 5.75 15ZM5 11.75C5 11.3358 5.33579 11 5.75 11C6.16421 11 6.5 11.3358 6.5 11.75V12.25C6.5 12.6642 6.16421 13 5.75 13C5.33579 13 5 12.6642 5 12.25V11.75ZM10 9.75123C10 9.17203 10.5761 8.81137 11.0345 9.10362L14.7089 11.4466C15.097 11.6941 15.097 12.306 14.7089 12.5534L11.0344 14.8964C10.5761 15.1886 10 14.828 10 14.2488V9.75123Z" fill="%23333" /></svg>') no-repeat 50% 50% / contain;
    display: inline-block;
    height: 24px;
    width: 24px;
    margin: 0px 10px -6px 0;
    content: "";
}

.toolkitGrid .item a:hover span:before,
.CollageCTA a:hover span:before {
    background: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.25 4C3.45507 4 2 5.45507 2 7.25V16.75C2 18.5449 3.45507 20 5.25 20H18.75C20.5449 20 22 18.5449 22 16.75V7.25C22 5.45507 20.5449 4 18.75 4H5.25ZM3.5 7.25C3.5 6.2835 4.2835 5.5 5.25 5.5H18.75C19.7165 5.5 20.5 6.2835 20.5 7.25V16.75C20.5 17.7165 19.7165 18.5 18.75 18.5H5.25C4.2835 18.5 3.5 17.7165 3.5 16.75V7.25ZM18.25 7C17.8358 7 17.5 7.33579 17.5 7.75V8.25C17.5 8.66421 17.8358 9 18.25 9C18.6642 9 19 8.66421 19 8.25V7.75C19 7.33579 18.6642 7 18.25 7ZM17.5 15.75C17.5 15.3358 17.8358 15 18.25 15C18.6642 15 19 15.3358 19 15.75V16.25C19 16.6642 18.6642 17 18.25 17C17.8358 17 17.5 16.6642 17.5 16.25V15.75ZM18.25 11C17.8358 11 17.5 11.3358 17.5 11.75V12.25C17.5 12.6642 17.8358 13 18.25 13C18.6642 13 19 12.6642 19 12.25V11.75C19 11.3358 18.6642 11 18.25 11ZM5 7.75C5 7.33579 5.33579 7 5.75 7C6.16421 7 6.5 7.33579 6.5 7.75V8.25C6.5 8.66421 6.16421 9 5.75 9C5.33579 9 5 8.66421 5 8.25V7.75ZM5.75 15C5.33579 15 5 15.3358 5 15.75V16.25C5 16.6642 5.33579 17 5.75 17C6.16421 17 6.5 16.6642 6.5 16.25V15.75C6.5 15.3358 6.16421 15 5.75 15ZM5 11.75C5 11.3358 5.33579 11 5.75 11C6.16421 11 6.5 11.3358 6.5 11.75V12.25C6.5 12.6642 6.16421 13 5.75 13C5.33579 13 5 12.6642 5 12.25V11.75ZM10 9.75123C10 9.17203 10.5761 8.81137 11.0345 9.10362L14.7089 11.4466C15.097 11.6941 15.097 12.306 14.7089 12.5534L11.0344 14.8964C10.5761 15.1886 10 14.828 10 14.2488V9.75123Z" fill="%23fff" /></svg>') no-repeat 50% 50% / contain;
}



.hilightSection h2 {
    margin-bottom: 0px;
    font-size: 32px;
}

.hilightSection {
    display: grid;
    background: linear-gradient(135deg, #ffffff, #F0F8FF 50%);
    border-radius: 20px;
    grid-template-columns: 2fr 1fr;
    text-decoration: none;
    padding: 30px;
    gap: 30px;
    align-items: center;
    justify-items: center;

    
}

.hilightSection .promoContent {
    display: flex;
    gap: 30px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    max-width: 800px;
}

.hilightSection div {
    display: flex;
    gap: 10px;
    align-items: center;
}

.hilightSection .promoContent a , .podcastLinks a{
    background-color: #fff;
    border-radius: 10px;
    padding: 4px 32px 4px 16px;
    color: #1B2D81;
    text-decoration: none;
    background-position: right 10px center;
    background-repeat: no-repeat;
    background-image: url('data:image/svg+xml, <svg width="16" height="16" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.00977 16.2402C5.00977 16.0775 5.03906 15.9212 5.09766 15.7715C5.15625 15.6217 5.2474 15.485 5.37109 15.3613L10.7324 10L5.37109 4.62891C5.13021 4.38802 5.00977 4.0918 5.00977 3.74023C5.00977 3.57096 5.04232 3.41146 5.10742 3.26172C5.17253 3.11198 5.26042 2.97852 5.37109 2.86133C5.48177 2.74414 5.61523 2.65299 5.77148 2.58789C5.92773 2.52279 6.09049 2.49023 6.25977 2.49023C6.42253 2.49023 6.58203 2.52279 6.73828 2.58789C6.89453 2.65299 7.02799 2.74414 7.13867 2.86133L13.3887 9.11133C13.4993 9.22201 13.5872 9.35547 13.6523 9.51172C13.7174 9.66797 13.7533 9.82747 13.7598 9.99023C13.7598 10.3353 13.6361 10.6315 13.3887 10.8789L7.13867 17.1289C7.02148 17.2461 6.88802 17.3372 6.73828 17.4023C6.58854 17.4674 6.42578 17.5 6.25 17.5C6.07422 17.5 5.91146 17.4674 5.76172 17.4023C5.61198 17.3372 5.48177 17.2493 5.37109 17.1387C5.26042 17.028 5.17253 16.8945 5.10742 16.7383C5.04232 16.582 5.00977 16.416 5.00977 16.2402Z" fill="%231B2D81"/></svg>');
}

.hilightSection .promoContent a:hover, .podcastLinks a:hover {
    background-position: right 5px center;
}

@media (min-width: 991px) and (max-width: 1400px) {

    .hilightSection h2 {
        font-size: 26px;
    }

    h2.section_heading {
        font-size: 30px;
    }

    .whatsnewGrid {
        grid-template-columns: repeat(2, 1fr);
    }

    .toolkitGrid,
    .activitiesGrid {
        grid-template-columns: repeat(2, 1fr);
    }

    .sectionProject .section_heading,
    .activitiesTop .section_heading,
    .toolkitTop .section_heading,
    .sectionGuides .section_heading {
        margin-bottom: 16px;
    }

    .projectHeader {
        grid-template-columns: 1fr 2fr;
    }

    .sectionReady .section_heading {
        margin-bottom: 24px;
    }

    .sectionReady .sectionSubtitle {
        margin-bottom: 40px;
    }

    .activitiesTop .heroGrid {
        gap: 10px;
        margin-top: 50px;
    }

    .activitiesTop .activityIcon {
        zoom: 0.9;
        margin-top: -50px;
    }

    .activitiesTop .heroImg {
        width: 420px;
    }
}

@media (max-width: 990px) {
    .hilightSection {
        grid-template-columns: 1fr;
    }
    .hilightSection h2 {
        font-size: 22px;
    }
    .hilightSection div {
        flex-direction: column;
    }

    .sectionProject {
        margin: 80px 0 80px;
    }

    h2.section_heading {
        font-size: 30px;
    }

    .programCTA {
        grid-template-areas:
            "title"
            "description"
            "link"
            "icon";
        margin: 0 20px 0 20px;

    }


    .programCTA a {
        margin-bottom: 30px;
        justify-self: baseline;
    }

    .subMenu {
        gap: 10px;
        flex-wrap: wrap;
        margin-bottom: 20px;
    }

    .subMenu a {
        border-right: 0;
        border-radius: 12px;
        padding: 6px 10px;
        width: fit-content;
    }

    .subMenu a .m {
        display: block;
    }

    .subMenu a .d {
        display: none;
    }

    .subMenu a:first-child,
    .subMenu a:last-child {
        border-radius: 12px;
    }

    .whatsnewGrid {
        grid-template-columns: repeat(1, 1fr);
    }

    .sectionReady {
        margin: 60px 0 60px 0;
    }

    .sectionReady .section_heading {
        margin-bottom: 24px;
    }

    .sectionReady .sectionSubtitle {
        margin-bottom: 40px;
    }

    .footerGrid,
    .instructionsGrid,
    .toolkitGrid,
    .activitiesGrid {
        grid-template-columns: repeat(1, 1fr);
        margin: 0 20px 0 20px;

    }

    .section9 .section_heading,
    .toolkitTop .section_heading,
    .sectionGuides .section_heading {
        margin-bottom: 20px;
    }

    .keyActivities {
        margin: 0 20px 40px 20px;
        left: 0;
        transform: none;
        width: initial;
    }

    .activitiesTop .heroGrid {
        grid-template-columns: repeat(5, 1fr);
        grid-column-gap: 2px;
        grid-row-gap: 40px;
        margin-top: 70px;
    }

    .activitiesTop .heroImg {
        grid-column: 2/5;
        grid-row: 3/5;
        width: 300px;
    }

    .LMSTop .heroGrid {
        grid-template-columns: repeat(1, 1fr);
    }

    .LMSTop .heroImg {
        grid-column: 1/1;
        grid-row: 7/7;
        width: 300px;
    }

    .activitiesTop .activityIcon {
        margin-top: -30px;
    }


    .activitiesTop .activityIconLogo {
        width: 75px;
        height: 35px;
        padding: 2px;
    }

    .activitiesTop .activityIconB,
    .activitiesTop .activityIconA {
        width: 40px;
        height: 40px;
        padding: 2px;
    }

    .activitiesTop .activityIconLogoB {
        width: 45px;
        height: 45px;
        padding: 2px;
    }

    .activitiesTop .activityIcon span {
        display: none;
    }

    .LMSTop .activityIcon {
        padding: 8px;
    }

    .LMSTop .activityIcon span {
        display: block;
    }


    .projectHeader {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .projectHeader .project_img img {
        height: 200px;
    }

    .toolkiCollage {
        grid-template-columns: repeat(4, 1fr);
    }

    .toolkiCollage .CollageCTA {
        grid-column: 1/5;
        grid-row: 3/4;
    }

    .linksGrid {
        grid-template-columns: repeat(2, 1fr);
    }


}


.video-modal,
.video-modal .overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 3000;
}

.video-modal {
    overflow: hidden;
    position: fixed;
    opacity: 0.0;

    -webkit-transform: translate(500%, 0%);
    transform: translate(500%, 0%);

    -webkit-transition: -webkit-transform 0s linear 0s;
    transition: transform 0s linear 0s;


    /* using flexbox for vertical centering */

    /* Flexbox display */
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;

    /* Vertical alignment */
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;

    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.video-modal .overlay {
    z-index: 0;
    background: radial-gradient(circle at 1.8% 4.8%, rgba(17, 23, 58, 0.95) 0%, rgba(58, 85, 148, 0.95) 90%);

    opacity: 0.0;

    -webkit-transition: opacity 0.2s ease-out 0.05s;
    transition: opacity 0.2s ease-out 0.05s;
}


.video-modal-content {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    z-index: 1;

    margin: 0 auto;

    overflow-y: visible;

    background: #000;

    width: calc(100% - 12em);
    height: 0;
    padding-top: calc((100% - 12em) * 0.5625);
    /* 16:9 calc */
}

/* Scaling to fit within the current Viewport size:
When viewport aspect ratio is greater than 16:9
work off the height instead of the width for calc */
@media (min-aspect-ratio: 16/9) {
    .video-modal-content {
        width: 0;
        height: calc(100vh - 10em);
        padding-top: 0;
        padding-left: calc((100vh - 10em) * 1.7778);
        /* 16:9 calc */
    }
}

/* Mobile Layout Tweaks - side margins reduced */
@media (max-width: 640px) {
    .video-modal-content {
        width: calc(100% - 1em);
        padding-top: calc((100% - 1em) * 0.5625);
        /* 16:9 calc */
    }

    .videoSqr {
        height: calc(100vh - 10em);
    }
}

/* modal close button */
.closeModal {

    background: linear-gradient(15deg, #e95688, #eb6125);
    padding: 6px 20px 6px 20px;
    display: block;
    position: absolute;
    right: 0;
    top: -50px;
    text-decoration: none;
    font-weight: bold;
    color: #fff;
    z-index: 5;
    border-radius: 20px;
    cursor: pointer;
}

/* set the iframe element to stretch to fit its parent element */
iframe#youtube {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;

    background: #000;
    box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.5);
}

/* show the modal: 
add class to the body to reveal */
.show-video-modal .video-modal {
    opacity: 1.0;

    transform: translate(0%, 0%);
    -webkit-transform: translate(0%, 0%);
}

.show-video-modal .video-modal .overlay {
    opacity: 1.0;
}

.show-video-modal .video-modal-content {
    transform: translate(0%, 0%);
    -webkit-transform: translate(0%, 0%);
}