:root {
            --primary-red: #CF2027;
            --primary-black: #000;
            --primary-white: #fff;
            --secondary-dark-grey: #4E4E4E;
            --tertiary-purple: #783B88;
        }

        /* Font Styles */
        h1 {
            font-family: 'Times New Roman', serif;
            color: var(--primary-black);
            /* Default for H1 */
        }

        h2,
        h3,
        h4,
        h5,
        h6,
        .sub-heading {
            font-family: 'Mulish', sans-serif;
            color: var(--primary-black);
            /* Default for sub-headings */
        }

        p,
        .paragraph {
            font-family: 'Mulish', sans-serif;
            color: var(--secondary-dark-grey);
            /* Default for paragraphs */
        }

        .sub-paragraph {
            font-family: 'Montserrat', sans-serif;
        }

        .about-moon-dance-text {
            font-family: 'Moon Dance', cursive;
        }



        .text-prm {
            color: #CF2027;
        }

        .text-sec {
            color: #4E4E4E;
        }

        .text-ter {
            color: #783B88;
        }

        .bg-prm {
            background: #CF2027;
        }

        .bg-sec {
            background: #4E4E4E;
        }

        .bg-ter {
            background: #783B88;
        }

        .about-mission-hero-section {
            margin-left: 6%;
        }

        .about-mission-hero-section .about-mission-hero-container {
            gap: 20px;
        }

        .about-mission-hero-section .about-mission-hero-container .col1 {
            width: 30%;
        }

        .about-mission-hero-section .about-mission-hero-container .col2 {
            width: 64%;
        }

        .about-mission-about-items {
            border: 1px solid #000000;
            padding: 50px;
            gap: 5px;
        }

        .about-mission-about-vision {
            width: 70%;
            max-width: 70%;
        }
        .about-mission-about-vision ul li::marker {
          color: #CF2027;   
        }
        .about-mission-about-vision ul{
            padding: 30px 75px 0px 60px;
        }

          .about-mission-highlight-box {
      position: relative;
    }

    .about-mission-highlight-box::after {
      content: "";
      position: absolute;
      top: 13px;   /* push it inside on top */
      left: -25px; /* stick out on left */
      right: 25px; /* inside on right */
      bottom: -13px; /* stick out on bottom */
      border: 3px solid #fff;
      pointer-events: none;
    }
    .about-w-40{
        width: 40%
    }
    .about-w-60{
        width: 60%
    }

        .about-mission-images {
            display: flex;
            flex-wrap: wrap;
                justify-content: center;
    align-items: center;
        }

        .about-mission-images .col-fixed {
            flex: 0 0 auto;
        }

        .about-mission-images .custom-col-20 {
            flex-basis: 25%;
        }

        .about-mission-images .custom-col-50 {
            flex-basis: 43%;
        }

        .about-mission-images .custom-col-30 {
            flex-basis: 30%;
        }

        @media (max-width: 768px) {

            .about-mission-images .custom-col-20,
            .about-mission-images .custom-col-50,
            .about-mission-images .custom-col-30 {
                flex-basis: 100%;
            }
              .about-mission-hero-section {
            margin-left: auto;
            margin-right: auto;
            }
            .about-mission-hero-section .about-mission-hero-container .col1 h1{
                text-align: center;
            }
              .about-mission-hero-section .about-mission-hero-container .col1 {
            width: 100%;
        }

        .about-mission-hero-section .about-mission-hero-container .col2 {
            width: 100%;
        }
        .about-mission-about-vision {
            width: 100%;
            max-width: 100%;
            flex-direction: column;
        }

        }
        @media (max-width: 767px) {
             .about-mission-hero-section {
            margin-left: auto;
            margin-right: auto;
            }
                  .about-mission-hero-section .about-mission-hero-container .col1 {
            width: 100%;
        }

        .about-mission-hero-section .about-mission-hero-container .col2 {
            width: 100%;
        }
        .about-mission-about-vision ul{
            padding: 10px 30px 0px 30px;
        }
            .about-w-40 , .about-w-60{
                width: 100%
            }
        }
        @media (max-width: 575.98px) {
             .about-mission-hero-section {
            margin-left: auto;
            margin-right: auto;
            }
                  .about-mission-hero-section .about-mission-hero-container .col1 {
            width: 100%;
        }

        .about-mission-hero-section .about-mission-hero-container .col2 {
            width: 100%;
        }
        }
        
        .about-mission-images .img-box {
            padding: 5px;
            width: 100%;
        }

        .about-mission-images img {
            width: 100%;
            height: auto;
            display: block;
        }