.secondaryBanner{
    background-image: url('/img/secondaryheader.png');
    background-size: cover;
}
.headtitle{
    padding:6rem 8rem 4rem 8rem;
    color:#1C3B7A;
    font-weight: 400;
    font-size: 34px;
}
.mainbody {
    display: flex;
    flex-direction: column;
}
.sectionAchievements{
    padding:4rem 8rem 2rem 8rem;
    margin-bottom:20rem;
}
.productContainer{
    display: grid;
    grid-template-columns:repeat(4,1fr);
    row-gap: 2rem;
}
.productBox{
    width:25rem;
    height:25rem;
}
.productImg{
    width:100%;
    height:100%;
    object-fit: cover;
}
.Achievementsproduct{
    background: none;
    border:none;
}
.Achievementsproduct:hover{
    cursor: pointer;
}
/* popup */
.diaone{
    border:none;
    background:none;
    width:100vw;
    top:50%;
    left:55%;
    transform: translate(-50%,-50%);
    overflow-y:scroll;
    
    position: relative;
}
.diaone::backdrop{
    background-color: rgba(69, 76, 99, 0.8);
    backdrop-filter:blur(3px);
}
.popupProductimgBox{
    display: flex;
    justify-content: center;
}
.popupProductImg{
    width:40%;
}
.PopUpBox{
    width:80%;
    margin-bottom: 3rem;

    display: flex;
    justify-content:center;
    flex-direction:column;
    align-items:center;
   
    position: relative;
}
.Closeicon{
    background: none;
    border:none;
    font-size:4.5rem;
    color:#ffffff;
    position: absolute;
    top:0rem;
    right:25%;
    
}
.lefticonBox{
    position: absolute;
    top:25rem;
    left:25%;
}
.righticonBox{
    position: absolute;
    top:25rem;
    right:25%;
}
.lefticonBox button,
.righticonBox button{
    border:none;
    background: none;
}
.lefticon,
.righticon{
    color:#fff;
    font-size:4.5rem;
}
.lefticon:hover,
.righticon:hover,
.Closeicon:hover{
    color:#639FFF;
}