/** The about page talks about the background of the author
*/
about
margin-top: 50px margin-bottom: 50px /** The container that holds the profile-picture */ #about-image display: block width: 200px height: 200px margin: auto /** The image element that loads the profile-picture * * border-radius - Ensures the profile-picture is placed in a circle and * not a box */ #profile-picture width: 100% height: 100% border-radius: 50% /** The container that hold the header and the 'about' content */ #about-content width: 100% max-width: 1012px margin: 50px auto 50px auto /** The intro statement of the author */ #about-intro font-size: 34px font-weight: 600 color: $color-custom-primary
@media screen and (max-width: 768px)
#about /** Resizing the image container */ #about-image width: 180px height: 180px /** Resizing the intro statement's font */ #about-content #about-intro font-size: 30px
@media screen and (max-width: 400px)
#about /** Making sure the profile picture according to the width and * height percentages */ #profile-picture width: 90% height: 90% border-radius: 50%