//  ==========
//  = Social icons =
//  ==========


.social-icons {
  clear: both;
  margin-bottom: 15px;
}

// single
.social-icon {
  display: inline-block;
  transition: background 0.15s linear;
  background: $grayLight;
  color: $grayDark;
  width: 30px;
  height: 30px;
  border-radius: 3px;
  line-height: 30px;
  text-align: center;
  margin-left: 2px;

  &:hover {
    background: $grayLighter;
  }
}