.btn.btn--block {
  display: block;
}
.btn {
  display: inline-block;
}
.btn {
  outline: 0;
}
.btn {
  cursor: pointer;
}
.btn--black,
.btn.btn--black.btn--hollow {
  background-color: #4a4a4a;
  color: #f4f5f5;
}
.btn.btn--black.btn--hollow {
  border-color: #4a4a4a;
  color: #4a4a4a;
}
.btn--black:hover,
.btn.btn--black.btn--hollow:hover {
  background-color: #605f5f;
  color: #f4f5f5;
}
.btn--black:active,
.btn.btn--black.btn--hollow:active {
  background-color: #292929;
  color: #f4f5f5;
}
.btn--blue,
.btn.btn--blue.btn--hollow {
  background-color: #388cbf;
  color: #f4f5f5;
}
.btn.btn--blue.btn--hollow {
  border-color: #388cbf;
  color: #388cbf;
}
.btn--blue:hover,
.btn.btn--blue.btn--hollow:hover {
  background-color: #5bb2e7;
  color: #f4f5f5;
}
.btn--blue:active,
.btn.btn--blue.btn--hollow:active {
  background-color: #216995;
  color: #f4f5f5;
}
.btn--disabled,
.btn.btn--disabled.btn--hollow {
  background-color: #d7d7d7;
  color: #8a8a8a;
}
.btn.btn--disabled.btn--hollow {
  border-color: #d7d7d7;
  color: #d7d7d7;
}
.btn--gray,
.btn.btn--gray.btn--hollow {
  background-color: #e2e8ec;
  color: #4a4a4a;
}
.btn.btn--gray.btn--hollow {
  border-color: #e2e8ec;
}
.btn--gray:hover,
.btn.btn--gray.btn--hollow:hover {
  background-color: #f3f3f3;
  color: #626262;
}
.btn--gray:active,
.btn.btn--gray.btn--hollow:active {
  background-color: #dfdfdf;
  color: #626262;
}
.btn--green,
.btn.btn--green.btn--hollow {
  background-color: #5ee6a5;
  color: #408665;
}
.btn.btn--green.btn--hollow {
  border-color: #5ee6a5;
  color: #5ee6a5;
}
.btn--green:hover,
.btn.btn--green.btn--hollow:hover {
  background-color: #96f5c7;
  color: #3b7d5e;
}
.btn--green:active,
.btn.btn--green.btn--hollow:active {
  background-color: #4fd695;
  color: #2b694c;
}
.btn--orange,
.btn.btn--orange.btn--hollow {
  background-color: #ffbc89;
  color: #b5792b;
}
.btn.btn--orange.btn--hollow {
  border-color: #ffbc89;
  color: #ffbc89;
}
.btn--orange:hover,
.btn.btn--orange.btn--hollow:hover {
  background-color: #ffc794;
  color: #b5792b;
}
.btn--orange:active,
.btn.btn--orange.btn--hollow:active {
  background-color: #fba05a;
  color: #8a5817;
}
.btn--purple,
.btn.btn--purple.btn--hollow {
  background-color: #d08bfa;
  color: #3f0658;
}
.btn.btn--purple.btn--hollow {
  border-color: #d08bfa;
  color: #d08bfa;
}
.btn--purple:hover,
.btn.btn--purple.btn--hollow:hover {
  background-color: #ddaff9;
  color: #2c063e;
}
.btn--purple:active,
.btn.btn--purple.btn--hollow:active {
  background-color: #ca89f2;
  color: #340f45;
}
.btn--red,
.btn.btn--red.btn--hollow {
  background-color: #e32d2d;
  color: #ffe3e3;
}
.btn.btn--red.btn--hollow {
  border-color: #e32d2d;
  color: #e32d2d;
}
.btn--red:hover,
.btn.btn--red.btn--hollow:hover {
  background-color: #e84a4a;
  color: #ffe3e3;
}
.btn--red:active,
.btn.btn--red.btn--hollow:active {
  background-color: #c22828;
  color: #ffe3e3;
}
.btn--yellow,
.btn.btn--yellow.btn--hollow {
  background-color: #fffba4;
  color: #7d7945;
}
.btn.btn--yellow.btn--hollow {
  border-color: #fffba4;
  color: #fffba4;
}
.btn--yellow:hover,
.btn.btn--yellow.btn--hollow:hover {
  background-color: #fffcbd;
  color: #847e37;
}
.btn--yellow:active,
.btn.btn--yellow.btn--hollow:active {
  background-color: #fffba3;
  color: #7d7945;
}
.btn--white,
.btn.btn--white.btn--hollow {
  background-color: #fff;
  color: #949494;
}
.btn.btn--white.btn--hollow {
  border-color: #fff;
  color: #fff;
}
.btn--white:hover,
.btn.btn--white.btn--hollow:hover {
  background-color: #fff;
  color: #2f2f2f;
}
.btn--white:active,
.btn.btn--white.btn--hollow:active {
  background-color: #fafafa;
  color: #2f2f2f;
}
.btn.btn--black.btn--hollow,
.btn.btn--blue.btn--hollow,
.btn.btn--disabled.btn--hollow,
.btn.btn--gray.btn--hollow,
.btn.btn--green.btn--hollow,
.btn.btn--orange.btn--hollow,
.btn.btn--purple.btn--hollow,
.btn.btn--red.btn--hollow,
.btn.btn--yellow.btn--hollow,
.btn.btn--white.btn--hollow {
  background-color: transparent;
}
.btn {
  text-align: center;
}
.btn.btn--right {
  text-align: right;
}
.btn.btn--left {
  text-align: left;
}
.btn {
  border: 2px solid transparent;
  cursor: pointer;
  line-height: 1;
  transition: background-color 0.25s cubic-bezier(0.13, 0.55, 0.55, 1), color 0.25s cubic-bezier(0.13, 0.55, 0.55, 1);
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.btn {
  vertical-align: middle;
}
.btn {
  padding: 0.5em 1em;
}
.btn.btn--icon {
  padding: 0;
}
.btn__icon {
  margin-right: 0.5em;
  min-width: 32px;
  vertical-align: baseline;
}
.btn.btn--rounded {
  border-radius: 1em/50%;
}
.btn--disabled,
.btn.btn--disabled.btn--hollow {
  cursor: default;
}
