Border-radius not rounding my profile image

.profile-photo {
/*default: inline images*/
    display: block;
    max-width: 150px;
    margin: 0 auto 30px;
/*rounds the borders*/
    border-radius: 100%;
}

#wrapper {
  max-width: 960px; /*wrapper flexes with browser window*/
  /*has max width of 960 px but can get infinitely smaller than that*/
  margin: 0 auto; /*top and bottom; left and right*/
  padding: 0 5%; /*to prevent text from running right up against window's edge*/
} 

a {
  text-decoration: none;
  color: #6ab47b;
}


img {
  /*fill width of parent container*/
  max-width: 100%; 
}

/**********************
HEADING
**********************/

header {
  float: left;
  /* top right bot left (CW) */
  margin: 0 0 30px 0; 
  /*separate text from margin*/
  padding: 5px 0 0 0;
  width: 100%;
}

#logo {
  text-align: center;
  margin: 0;
}

h1 {
  font-family: 'Changa One', sans-serif;
  margin: 15px 0;
  font-size: 1.75em;
  font-weight: normal; /*unbolds*/
}

h2 {
  font-family: 'Oswald', sans-serif;
  font-size: 1.25em;
  margin: -10px 0 0;
  /*top,L&R,bot - common technique: negative value pulls elt closer to other elts*/
  font-weight: normal;
}


/**********************
NAVIGATION
**********************/

nav {
  text-align: center;
  padding: 10px 0;
  margin: 20px 0 0;
}

/*to ensure proper centering*/
nav ul {
  list-style: none;
  margin: 0 10 px; /*top-bot;l-r*/
  padding: 0;
}

/*nav items next t0 each other*/
nav li {
  display: inline-block;
}

nav a {
  font-weight: bolder;
  padding: 15px 10px;
}

/**********************
FOOTER
**********************/
footer {
  font-family: 'Oswald', sans-serif;
  text-align: center;
  clear: both;
  font-size: 0.75em;
  padding-top: 50px;
  color: #acc;
}

.social-media {
  width: 40px;
  height: 40px;
  margin: 0.5px;
}


/**********************
PAGE: PORTFOLIO
**********************/
#gallery {
  margin: 0;
  padding: 0;
  list-style: none; /*no bullets!*/
}

#gallery li {
  float: left;
  width: 45%;
  margin: 2.5%;
  background-color: #f5f5f5;
  /*color doesn't appear unless caption is unlinked.*/
  color: #24a434;
}


#gallery li a p {
  margin: 0;
  padding: 5%;
  font-size: .9em;
  text-align: center;
  color: #bdc3c7;
}


/**********************
PAGE: ABOUT
**********************/

.profile-photo {
/*default: inline images*/
    display: block;
    max-width: 150px;
    margin: 0 auto 30px;
/*rounds the borders*/
    border-radius: 100%;
}

/**********************
COLORS
**********************/

/*site body*/
body {
  background-color: #fff;
  color: #999;
}

/*green header*/
header {
  background: #6ab47b;
  border-color: #599a68;
}

/*nav b/g on mobile devices*/
nav {
  background: #599a68;
}

/*logo text*/
h1, h2 {
  color: #fff;
}

/*visited is a CSS pseudoclass.
There can be NO space between nav a and visited.
I want links to be white even after they're clicked*/
nav a, nav a:visited {
  color: #fff;
}

/*selected is an HTML class and nav a.selected is a CSS class selector*/
nav a.selected, nav a:hover {
  color: #ff5100;
}