@import url(../variables/colorVariables.css);
@import url(../variables/variables.css);

:root {

}


#about-us-container{
    height: auto;
    width: 62%;
    padding: var(--pages-main-padding);
}

#about-us{
    height: 100%;
    box-shadow: var(--default-shadow);
    border-radius: var(--default-border-radius);
    border: 1px solid var(--default-border-color);
}

.about-us-details{
    margin-top: var(--default-margin-top);
    margin-bottom: var(--default-margin-top);
    padding: var(--default-text-padding);
}

#about-us-writing-container{
    font-size: 30px !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: unset !important;
    display: inline !important ;
    float: right;
}

#about-us-writing-container *{
    font-size: 30px !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: unset !important;
    display: inline !important;
}


.img{
    float: left;
    margin: 10px 15px 2px 5px;
    border-radius: var(--default-border-radius);
    height: 300px;
    width: 300px;
}



@media screen and (min-width: 0px) and (max-width: 1100px) {
    #about-us-container{
        height: auto;
        width: 100%;
        padding: 15px 23px;
    }

}

@media screen and (min-width: 0px) and (max-width: 600px) {

    .img{
        margin: 10px 0 25px 0;
        height: 300px;
        width: 100%;
    }

    #about-us-writing-container{
        font-size: 25px;
    }
    .about-us-details{
        flex-direction: column-reverse;
        flex-wrap: wrap !important;

    }



}