Changing profile images to squares

Within Interact, each person that has an account can have a picture to easily identify the people interacting with the system. By default, these images are nice and round and typically look like the below.

One downside of this is that it can be tricky to line up someone's face in the center of the image so that they appear central to the circle.

The following CSS will change these images from a circle to a square, meaning that it's a little more predictable what the images will look like once they are uploaded and being viewed within Interact

#profile figure, #hc figure, .Widget_People_Standard figure {
    -webkit-border-radius: 0px!important;
    -moz-border-radius: 0px!important;
    border-radius: 0px!important;
}

.img-circle {
    -webkit-border-radius: 0px!important;
    -moz-border-radius: 0px!important;
    border-radius: 0px!important;
}

.people-directory-followed, .people-directory-not-followed {
    -webkit-border-radius: 0px!important;
    -moz-border-radius: 0px!important;
    border-radius: 0px!important;

}
#Endorse figure, #document figure, #imageParameters figure, #CurrentUser figure, #Interact-Trial figure, #Search figure {
    -webkit-border-radius: 0px!important;
    -moz-border-radius: 0px!important;
    border-radius: 0px!important;
}

This CSS needs to be adding to the Custom CSS section of the Developer Framework within Interact as normal. Here's what it looks like in place