/* Sabden footer styling */

.footer {
  background-color: var(--footer-background-color);
  color: var(--footer-color);
  text-align: center;
  text-transform: var(--footer-text-transform);
}

.footer__heading {
  font-family: var(--font-family-medium);
}

.footer__link {
  color: var(--footer-color);
}

.footer__link--large {
  font-family: var(--font-family-medium);
}

.footer__rating {
  margin-left: auto;
  margin-right: auto;
}

#adminbuttons {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 20px;
}

#adminbuttons input {
  margin: 5px;
}

@media only screen and (max-width: 767px) {
  .footer {
    padding: 20px;
  }

  .footer__section {
    margin-bottom: 30px;
  }

  .footer__heading {
    font-size: 14px;
    margin-bottom: 0.1em;
  }

  .footer__list-item {
    font-family: var(--font-family-light);
    font-size: 13px;
    padding: 0.2em 0;
  }

  .footer__link--large {
    font-size: 16px;
    letter-spacing: var(--letter-spacing);
  }

  .footer__rating {
    width: 200px;
  }

  #adminbuttons {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
}

@media only screen and (min-width: 768px) {
  .footer {
    padding-bottom: 70px;
    padding-top: 35px;
  }

  .footer-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
    max-width: var(--wrapper-width-desktop);
  }

  .footer__section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-bottom: 1em;
    padding: 0.5em 1em;
  }

  .footer__section--small {
    width: 30%;
  }

  .footer__section--large {
    width: 100%;
  }

  .footer__heading {
    font-size: 14px;
    margin-bottom: 2px;
  }

  .footer__list-item {
    font-family: var(--font-family-medium);
    font-size: 14px;
    padding: 2px 0;
  }

  .footer__link--large {
    font-size: 26px;
  }

  .footer__rating {
    margin-bottom: 20px;
    margin-top: 20px;
    max-width: 400px;
  }
}