/*------------------------------------*\
  $FOOTER
\*------------------------------------*/

$footer-background-color: #3e3e3e;

.page-footer {
  overflow: hidden;
  padding: {
    top: 50px;
    bottom: 50px;
  }
  background: {
    color: $footer-background-color;
  }
  clear: both;

  .wrap {
    position: relative;

    @include mq(mq960) {
      min-height: 67px;
    }
  }

  a {
    color: #fff;
    text-decoration: none;

    @include states {
      text-decoration: underline;
    }
  }

  section {
    overflow: hidden;
  }

  article {
    p {
      width: 90%;
      line-height: 1.3;
      font-size: font-size(15);
    }
  }

  &__about {
    overflow: hidden;

    img {
      margin: {
        bottom: 30px;
      }

      @include mq(mq960) {
        float: left;
        margin: {
          right: 50px;
          bottom: 0;
        }
      }
    }

    address {
      color: #fff;
      font: {
        size: font-size(15);
      }
      margin: {
        bottom: 30px;
      }

      @include mq(mq600) {
        margin: {
          bottom: 0;
        }

      }

      @include mq(mq960) {
        float: left;
        width: calc(100% - 278px);
        position: relative;
        top: 8px;
      }

      p {
        margin: {
          bottom: 0;
        }
        text-align: left;
        width: 100%;
      }

      strong {
        font: {
          size: font-size(17);
        }
        display: block;
        margin: {
          bottom: 5px;
        }
      }

      br {
        @include mq(mq600) {
          display: none;
        }
      }
    }
  }

  .footer-logo {
    float: left;
    margin: {
      bottom: 0;
    }

    @include mq(mq600) {
      position: absolute;
      top: 0;
    }

    &--ce {
      width: 47px;
      margin: {
        right: 30px;
      }
      position: relative;
      top: 13px;

      @include mq(mq600) {
        position: absolute;
        right: 92px;
        margin: {
          right: 0;
        }
      }

      @include mq(mq960) {
        right: 112px;
      }
    }

    &--koeco {
      width: 62px;

      @include mq(mq600) {
        right: 0;
      }
    }
  }
}

.page-credits {
  background: {
    color: $footer-background-color;
  }
  border-top: 1px solid #515151;
  padding: {
    top: 25px;
    bottom: 25px;
  }
  clear: both;

  .wrap {
    overflow: hidden;
  }

  p, li {
    color: #fff;
    font: {
      size: font-size(14);
    }
  }

  p {
    text-align: left;

    @include mq(mq600) {
      float: left;
      margin: 0;
    }
  }

  ul {
    @include mq(mq600) {
      float: right;
    }
  }

  li {
    display: inline-block;
    margin: {
      right: 30px;
    }
    @include mq(mq600) {
      margin: {
        right: 0;
        left: 30px;
      }
    }
  }

  a {
    color: #fff;
    text-decoration: none;

    @include states {
      text-decoration: underline;
    }
  }
}