/*
 * Responsive font size mixins.
 */
/*
 * Text styling.
 * Also see heading.scss.
 */
.text-bold {
  font-weight: 700;
}

.text-label {
  font-weight: 700;
  margin-right: 5px;
}

.text-centered {
  text-align: center;
}

.text-small-3 {
  font-size: 0.5rem;
}

.text-small-2 {
  font-size: 0.8rem;
}

.text-small-1 {
  font-size: 0.9rem;
}

.text-normal {
  font-size: 1rem;
}

.text-large-1 {
  font-size: 1.1rem;
}

.text-large-2 {
  font-size: 1.3rem;
}

.text-large-3 {
  font-size: 1.5rem;
}

.text-large-4 {
  font-size: 2rem;
}

.text-large-5 {
  font-size: 3rem;
}

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    transform: translate3d(0, -100%, 0);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
    transform: translate3d(0, -100%, 0);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}
/**
 * Standard button.
 */
button,
.button,
.button--disabled,
.button--small,
.button--blue-reversed,
.button--blue-bright,
.button--blue,
.button--green-reversed,
.button--green-bright,
.button--green {
  padding: 5px;
  background-color: #4c4c4c;
  color: #fff;
  text-decoration: none;
  text-transform: uppercase;
  border: 1px solid transparent;
  border-radius: 2px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  font-weight: bold;
  transition: background-color 300ms ease-in-out, color 300ms ease-in-out;
}
button:hover, button:active,
.button:hover,
.button--disabled:hover,
.button--small:hover,
.button--blue-reversed:hover,
.button--blue-bright:hover,
.button--blue:hover,
.button--green-reversed:hover,
.button--green-bright:hover,
.button--green:hover,
.button:active,
.button--disabled:active,
.button--small:active,
.button--blue-reversed:active,
.button--blue-bright:active,
.button--blue:active,
.button--green-reversed:active,
.button--green-bright:active,
.button--green:active {
  background-color: #727272;
  color: #fff;
  text-decoration: underline;
}

/**
 * Green buttons.
 */
.button--green {
  background-color: #105610;
}
.button--green:hover, .button--green:active {
  background-color: #58b764;
}

.button--green-bright {
  background-color: #58b764;
  border-color: #105610;
}
.button--green-bright:hover, .button--green-bright:active {
  background-color: #fff;
  color: #105610;
}

.button--green-reversed {
  background-color: #fff;
  color: #105610;
  border-color: #1b2b34;
}
.button--green-reversed:hover, .button--green-reversed:active {
  background-color: #58b764;
}

/**
 * Blue buttons.
 */
.button--blue {
  background-color: #1a4a65;
}
.button--blue:hover, .button--blue:active {
  background-color: #328cc1;
}

.button--blue-bright {
  background-color: #328cc1;
  border-color: #1a4a65;
}
.button--blue-bright:hover, .button--blue-bright:active {
  background-color: #fff;
  color: #1a4a65;
}

.button--blue-reversed {
  background-color: #fff;
  color: #1a4a65;
  border-color: #1b2b34;
}
.button--blue-reversed:hover, .button--blue-reversed:active {
  background-color: #328cc1;
}

.button--small {
  padding: 2px;
  font-size: 0.8rem;
}

.button--disabled {
  cursor: not-allowed;
  opacity: 0.5;
  background-color: #4c4c4c;
  color: #fff;
}
.button--disabled:hover, .button--disabled:active {
  text-decoration: none;
  background-color: #4c4c4c;
  color: #fff;
}