.about-title{
    margin-bottom: 1rem;
    text-align: center;
    font-size: 2.5rem;
    color: #003665;
}

.about-jsa-title h1{
    text-align: center;
    font-size: 2rem;
    margin-bottom: -1.5rem;
    z-index: 1;
}


.grid h2, .grid p{
    color:#eeeeee;
}

.grid div{
    margin-top: -7rem;
}

.about-jsa-title{
   display: grid;
   place-items: center;
}



.about-header-grid{
    display: grid;
    grid-template-columns: 1fr 1fr;
    place-items:center;
    gap: 2rem;
    width: 100%; 
    margin: 8rem auto;
} 

.content2-container-grid{
    display: grid;
    grid-template-columns: 1fr 1fr;
    place-items:center;
   
    margin: 5rem auto;
    gap: 5rem;
    width: 100%; 
    padding:2rem; 
   
} 

/* ======================================= */
.content3-container-grid{
    display: grid;
    grid-template-columns: 1fr 1fr;
    place-items:center;
    margin: 5rem 0;
    gap: 5rem;
    width: 100%;
    padding:2rem; 
   
} 

.content4-container-grid{
    display: grid;
    grid-template-columns: 1fr 1fr;
    place-items:center;
    margin: 5rem 0;
    gap: 5rem;
    width: 100%;
    
}
/* ============================================ */

.about-header-grid, 
.content2-container-grid,
.content3-container-grid{
    margin-bottom: -3rem;
}

.two-media-container{
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 2rem;
 
  margin-bottom: 1rem;
  background-color: #00000060;
}

.two-media-container::before{
    content: "";
    position: absolute;
    inset: 0;
   
    background: url(../images/about2.jpg) 
    center /cover no-repeat;
    background-attachment: fixed;
    z-index: -1;
    
}


/* .content4-container-grid img{
    mask-image: linear-gradient(#fff 90%, transparent);
} */

.content{
    text-align: justify;
    max-width: 90%;
    
}

.content3-container-grid{
    margin-bottom: 1rem;
}


.mission-title{
    margin-bottom: -1rem;
}

.media-placement{
    margin-bottom: -4rem;
    padding: 1rem;
}

.media-placement h2{
    margin-bottom: -5rem;
}

.about-image{
    max-width: 40%;
    margin-bottom: 4rem;
}

.about-content, .about-content2{
    font-size: 1.2rem;
    line-height: 2rem;
}

.about-image1{
    width: 80%;
    border-radius: 1rem;
    margin-bottom: 3rem;
}
.home-media-image{
    margin-bottom: -3rem;
}
.home-media-image img, .digital-media-image img{
    margin-top: 4rem;
}

.about-image3{
    margin-top: 1rem;
    width: 80%;
    border-radius: 1rem;
}
.mission{
    padding: 1rem;
}

.mission-container-grid{
    display: grid;
    grid-template-columns: 1fr 1fr;
    max-width: 1200px;   /* or any width you want */
    margin: 0 auto;
    gap: 8rem;
    width: 100%;
}

.mission-container-grid p{
    font-size: 1.2rem;
    line-height: 2rem;
    border-bottom: 3px solid #ededed;
    border-top: 3px solid #ededed;
}

.about-image2{
   border-radius: 1rem;
   width: 500px;
   margin-top: 3rem;
}
.mission-title{
    font-size: 3rem;
    font-weight: 600;
    color: #003665;
    text-align: center;
    
}