angular-cn/public/resources/css/module/_footer.scss

/*
* Main Site Footer
*
* This module contains styles for the main site footer. The
* footer contains a launchpad (lists of links) and general
* copyright and licensing information found at the bottom
* of each page
*/

.main-footer {
  nav {
    padding: $unit * 6;

    @media handheld and (max-width: $phone-breakpoint),
    screen and (max-device-width: $phone-breakpoint),
    screen and (max-width: $tablet-breakpoint) {
      padding: ($unit * 3) 0px;
    }
  }

  .logo-inverse-large {
    background: url('/resources/images/logos/inverse/shield/shield-large.png') 0px 0px no-repeat;
    height: 200px;
    width: 200px;

    @media handheld and (max-width: $phone-breakpoint),
    screen and (max-device-width: $phone-breakpoint),
    screen and (max-width: $tablet-breakpoint) {
      display: none;
    }
  }

  h3 {
    @media handheld and (max-width: $phone-breakpoint),
    screen and (max-device-width: $phone-breakpoint),
    screen and (max-width: $tablet-breakpoint) {
      margin-bottom: $unit;
    }
  }

  ul {
    padding: 0px;
    margin: 0px;
    list-style-type: none;

    @media handheld and (max-width: $phone-breakpoint),
    screen and (max-device-width: $phone-breakpoint),
    screen and (max-width: $tablet-breakpoint) {
      margin-bottom: $unit * 5;
    }

    li {
      margin: 0px;
    }

    a {
      color: $snow;
      text-decoration: none;

      @media handheld and (max-width: $phone-breakpoint),
      screen and (max-device-width: $phone-breakpoint),
      screen and (max-width: $tablet-breakpoint) {
        display: block;
        text-decoration: none;
        padding: 0px ($unit * 2);
        background: $steel;
        margin-bottom: $unit;
        border-radius: 3px;
        line-height: $unit * 5;
        font-size: 14px;
      }

      &:hover {
        text-decoration: underline;
        opacity: 1;
      }
    }
  }

  footer {
    text-align: center;
    padding: $unit * 2;
    position: relative;

    .styleguide-trigger {
      position: absolute;
      top: $unit * 2;
      right: $unit * 2;
      font-size: 14px;
      line-height: 20px;
      padding: 0px $unit;
      opacity: .24;
    }
  }
}