.main-section{
    background-image: url(../images/about-us-page-bg.webp); 
    background-size: cover;
    background-position: center;   
    background-attachment: fixed;   

}
.about-us-section{
    background-image: url(../images/about-us-banner.webp);
    background-size: cover;
    background-position: center;
    height: 80vh;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
    text-align: left;
    color: #fff;
}
.about-img-row img{
    box-shadow: 25px 25px 0px #000;
    position: sticky;  
    top: 20px;
}
.about-img-row{
        text-align: center;
}       
.the-personalised{
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 20px;
}
.accordion-item:first-of-type .accordion-button {
    font-size: 36px !important;
    font-weight: 500 !important;
}
.accordion-button:not(.collapsed) {
    color: var(--bs-accordion-active-color) !important;
    background-color: white !important;
    box-shadow: inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color) !important;
}
.accordion-button:focus
{

    box-shadow: none !important; 
}
@media screen and (max-width: 768px) {
   .about-img-row{
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .about-img-row img{
        box-shadow: 25px 25px 0px #000 !important; 
        width: 80%;
        height: auto;
        top: 80px;
    }
    .about-us-section{
        height: auto;
        padding: 10px;
    }
    .the-personalised{
        padding: 10px;
    }
    .the-personalised h2{
    font-size: 25px;
    }
   }

@media screen and (max-width: 576px) {
    .about-us-section{
        height: 100vh;
        padding: 10px;
    }
    .the-personalised{
        padding: 10px;
    }
    .about-img-row{
        display: flex;
        flex-direction: column;
        align-items: center;
        padding-bottom: 50px;
    }   
    .about-img-row img{
        width: 80%;
        height: auto;
        top: 0px;
    }
}