/* Styles for the buttons */

.button {
  background: none;
  position: relative;
  text-decoration: none;
}

.button::before {
  background: rgba(200,200,200,.8);
  border-radius: .25em;
    bottom: -.1em;
  content: "";
    left: .1em;
  position: absolute;
    right: .1em;
    top: .5em;
  z-index: -1;
}

.button::after {
  background: #1A9E3F;
  border-radius: .25em;
    bottom: 0;
  content: "";
    left: 0;
  position: absolute;
    right: 0;
    top: 0;
  z-index: -1;
}

.button:hover {
  text-decoration: none;
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
}

.button:hover::before {
  -webkit-transform: translateY(.1em);
          transform: translateY(.1em);
}

.button:hover::after {
  background: #28B54F;
}

.button:active {
  -webkit-transform: translateY(.2em);
          transform: translateY(.2em);
  -webkit-transition: none;
  transition: none;
}

.button:active::before {
  -webkit-transform: translateY(-.1em);
          transform: translateY(-.1em);
  -webkit-transition: none;
  transition: none;
}

.button, .button::before, .button::after {
  -webkit-transition: all .5s cubic-bezier(0,1,.3,1);
  transition: all .5s cubic-bezier(0,1,.3,1);
}