Day 86

Back to the social media project with Joe!
#CodingPhase #TheCodingWay #365CodingPhaseChallenge

**********

#top-area {
  padding: 150px 15px 90px 15px;
  background: url(https://www.wallpaperup.com/uploads/wallpapers/2015/04/02/653105/09d95a6f0e5f6e6a79bcbc58aa1222ad-700.jpg) no-repeat center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

#top-area .profile-info .user-img {
  padding: 10px;
  display: inline-block;
}

#top-area .profile-info .user-img img {
  width: 150px;
  border-radius: 50%;
}

#top-area .profile-info .user-details {
  display: inline-block;
  vertical-align: top;
  padding-left: 20px;
}

#top-area .profile-info .user-details h3 {
  color: white;
  font-size: 24px;
  font-weight: 300;
  margin-top: 50px;
  margin-bottom: 10px;
}

#top-area .profile-info .user-details a {
  display: inline-block;
  /* margin-left: -4px; */
  margin-right: 4%;
  width: 45%;
  text-align: center;
  text-transform: uppercase;
  color: white;
  font-size: 12px;
  padding: 10px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  background: rgba(255, 255, 255, .3);
  transition: background .3s ease-in-out;
}

#top-area .profile-info .user-details a:hover {
  background: #2196F3;
}