avatar.css

@media (max-width: 800px) {
    .User-list {
      list-style: none;
      width: 80%;
      margin: 10px auto;
    }
}

@media (min-width: 800px) {
.User-list {
  list-style: none;
  width: 400px;
  margin: 10px auto;
  }
}

.Avatar {
  text-align: center;  
  background-color: #f3f0ff;
  border-radius: 10px;
  padding-top: 10px;
  padding-bottom: 10px;
  margin: 5px;
}

.Avatar img {
  width: 50px;
  height: 50px;
  border-radius: 50%;
}

.Avatar h4 {
  text-transform: capitalize;
  color: red;
}

.Avatar p {
  font-size: 10px;
  color: gray;
}


.col-5, .col-3 {
  background-color: gray;
  margin: 2px;
}


.inputForm {
  margin-bottom: 2px;
}

.col-8 {
  margin-top: 40px;
  margin-bottom: 40px;
  padding-bottom:100px;
  background-color: white;
  box-shadow: 5px 10px 18px #888888;
  border-radius: 30px;
}

h1 {
  color: #467ae2;
  text-align:center; 
  margin-top:15px; 
  margin-bottom:30px;
  text-shadow: 1px 1px 2px #bdbcbc;
}