footer {
  padding: 40px 0;
  width: 100%;
  float: left;
  background: $main2;
  background: $gradient;

  .open-modal & {
    padding: 40px 16px 0 0;
  }

  .dark & {
    opacity: .9;
  }
}

.attribution {
  color: #fff;
  float: left;
  
  @include media(4) {
    font-size: 14px;
  }
}

.tmdb-logo {
  @include media(4) {
    width: 100%;
    float: left;
  }
}

.footer-actions {
  float: right;
  
  @include media(3) {
    float: left;
    clear: both;
    margin: 20px 0 0 0;
  }
}

.icon-tmdb {
  background: url(../../../public/assets/img/tmdb.png);
  width: 139px;
  height: 18px;
  float: left;
  margin: 3px 10px 0 0;

  &:active {
    opacity: .6;
  }
}

.icon-github {
  background: url(../../../public/assets/img/github.png);
  width: 33px;
  height: 27px;
  float: right;

  @include media(3) {
    float: left;
    //clear: both;
    //margin: 30px 0 0 0;
  }

  &:active {
    opacity: .6;
  }
}

.icon-constrast {
  float: right;
  width: 30px;
  height: 30px;
  margin: 0 0 0 20px;
  cursor: pointer;
  padding: 8px;

  &:active {
    opacity: .8;
  }

  i {
    background: darken($dark, 20%);
    border-radius: 100%;
    width: 100%;
    height: 100%;
    float: left;

    .dark & {
      background: #fff;
    }
  }
}

.sub-links {
  float: left;
  clear: both;
}

.login-btn {
  float: left;
  color: #fff;
  text-decoration: none;
  margin: 20px 20px 0 0;

  &:active {
    opacity: .6;
  }
}
