.skills {
  padding: $section-padding;

  h2 {
    font-size: 2em;
    font-weight: 400;
    line-height: 1.5em;
  }

  p {
    font-size: 0.95em;
    line-height: 1.5em;    
    padding-top: 15px;
    color: $txt-grey;
  }

  .skillList {
    position: relative;
  }
  .skill {
    position: relative;
    top: 0;
    margin: 50px 0;
    text-align: center;
    width: 25%;
    display: inline-block;
    padding: 20px;
    background-color: $bg-offwhite;


    transition: all 0.2s linear;

    .upper {
      margin-top: 15%;
    }
    i {
      font-size: 40px;
    }
    &:first-child i {
      color: crimson;
    }

    p {
      color: #000;
      text-transform: uppercase;
      font-weight: 600;
      padding: 0;
    }

    &:hover {
      position: relative;
      top: -10px;
      cursor: pointer;
      background-color: $bg-hover;

      transition: all 0.2s linear;
    }
  }

}