.side-menu {
  font-family: 'Roboto', sans-serif;
  position: fixed;
  top: 0;
  left: 0;
  margin: 0;
  padding: 0;
  height: 100%;
  width: 60px;
  list-style-type: none;
  background: #141616;
  overflow: hidden;
  transition: width .5s;
}

.side-menu:hover {
  width: 300px;
}

.side-menu li {
  width: 300px;
}

.side-menu li span {
  font-size: 1rem;
  margin: 20px 30px 0 22px;
}

.side-menu li a {
  display: block;
  font-size: .9rem;
  text-decoration: none;
  color: #FFF;
  height: 60px;
}

.side-menu li a:hover {
  background: #d8ae75;
  display: block;
}

.side-menu li a:hover .fa {
  color: rgb(21,23,23);
}