
// Footer widgets
.footer-widgets {
  color: $dark-color;
  position: relative;
  background-color: $footer-secondary-color;

  // Divider betwen footer and footer widgets
  &:after {
    @extend %background-secondary-color;
    background-image: image-url("divider-default.png");
    background-position:  center center;
    background-repeat: no-repeat;
    content: "";
    position: absolute;
    bottom: -20px;
    width: 40px;
    height: 40px;
    border-radius: 40px;
    left: 50%;
    margin-left: -20px;
  }

  .footer-widgets__social {
    margin: 58px 0;
  }

  .footer-widgets__navigation,
  .footer-widgets__tags,
  .footer-widgets__contact {
    margin: 22px 0 58px 0;
  }

  // Line behind title
  .footer-wdgets__heading--line {
    text-align: center;
    position: relative;

      &:after {
      z-index: 1;
      content: "";
      position: absolute;
      width: 100%;
      top: 65%;
      left: 0;
      height: 1px;
      background: lighten($footer-secondary-color, 10%);
    }
  }

  // Titles in footer
  .footer-widgets__heading {
    position: relative;
    text-align: center;
    color: $default-color;
    z-index: 2;
    background-color: $footer-secondary-color;
    display: inline-block;
    padding: 0 10px;
  }

  // Footer navigation
  .nav-footer > li > a {
    padding: 0;
    color: $dark-color;
    font-weight: bold;
    line-height: 30px;

    &:hover {
      color: $default-color;
     background: transparent;
    }
  }

  // Footer tags
  .tag {
    display: inline-block;
    border: 2px solid $dark-color;
    border-radius: 5px;
    padding: 5px 8px;
    margin: 4px 2px;
    font-family: $secondary-font;
    font-weight: 700;
    color: $dark-color;
    text-transform: uppercase;
    font-size: 11px;
    transition: all 0.2s linear;

    &:hover {
      color: $default-color;
      text-decoration: none;
      border: 2px solid $default-color;
    }
  }

  .glyphicon--footer {
    font-size: 12px;
    margin-right: 3px;
  }

  .glyphicon--footer-small {
    font-size: 8px;
    margin-right: 3px;
  }
}

// Footer
.footer {
  @extend %background-secondary-color;
  padding: 18px 0;
  color: $dark-color;


  .footer__link--small {
    font-size: 12px;
    font-weight: bold;

    &:hover {
      text-decoration: none;
    }
  }

  .footer__text {
    float: right;

    .glyphicon-heart {
      @extend %color-tertiary-color;
      font-size: 8px;
    }
  }

  @media (max-width: 768px) {
    .footer,
    .footer__text,
    .footer__text--link {
      text-align: center;
      float: none;
    }
  }
}

.footer__link {
  color: $default-color;
  font-weight: bold;

  &:hover {
    @extend %color-tertiary-color;
    font-weight: bold;
    text-decoration: none;
  }
}
