/* New branding colours */
/*
Frame

Base layout styles for page frame

Styleguide Frame
*/
/*
Page

This is basic page skeleton.


Markup:
<div class="abb-frame"> <!-- attach to html -->
<div class="abb-page"> <!-- attach to body -->
    <header class="row collapse abb-page__header">
        <a class="abb-page__header__logo float-right" title="ABB Logo" href=""></a>
    </header>
    <main class="row collapse abb-page__content">
      <span>Main page content</span>
    </main>
    <footer class="row collapse abb-page__footer">
        <div class="small-6 columns abb--equalize-to-input">
            &copy; Copyright 2015 ABB
        </div>
        <div class="small-6 columns text-right">
            Preferred language
            <select class="abb-select abb-page__footer__select">
                <option value="en">English</option>
                <option value="pl">Polski</option>
            </select>
        </div>
    </footer>
</div>
</div>

Weight: -10

Styleguide Frame.Page
*/
.abb-frame {
  max-width: 80rem;
  margin: 0 auto;
  background: #ffffff; }

.abb-page__header, .abb-page__content, .abb-page__footer {
  margin: 0 0.5rem 0 0.5rem; }
  @media screen and (min-width: 48em) {
    .abb-page__header, .abb-page__content, .abb-page__footer {
      margin: 0 2.5rem 0 2.5rem; } }
  .abb-page__header:before, .abb-page__content:before, .abb-page__footer:before {
    content: ' ';
    display: table; }
  .abb-page__header:after, .abb-page__content:after, .abb-page__footer:after {
    content: ' ';
    display: table; }

.abb-page {
  background: #ffffff;
  margin: 0;
  /** abb_page act as a row */ }
  .abb-page .row {
    margin-right: -0.5rem;
    margin-left: -0.5rem; }
  .abb-page .row.collapse {
    margin-left: 0;
    margin-right: 0; }
  .abb-page__header {
    position: relative;
    padding: 0.5rem 0 0.5rem 0;
    z-index: 1;
    min-height: 30px; }
    @media screen and (min-width: 48em) {
      .abb-page__header {
        padding: 1rem 0 0.75rem 0; } }
    .abb-page__header--sticky {
      height: 65px;
      padding: 0;
      margin: 0; }
    .abb-page__header__logo-simple {
      background: url("images/abb-logo-33px@1x.png") no-repeat right;
      background-size: 88px 33px;
      width: 88px;
      height: 33px;
      display: inline-block; }
      @media print {
        .abb-page__header__logo-simple {
          -webkit-print-color-adjust: exact;
          print-color-adjust: exact;
          color-adjust: exact;
          background-image: url("images/abb-logo-33px.svg");
          float: right; } }
      @media screen {
        .abb-page__header__logo-simple {
          background-image: url("images/abb-logo-33px.svg"); } }
    .abb-page__header__logo {
      background: url("images/abb-logo.svg") no-repeat right;
      background-size: 203px 30px;
      position: absolute;
      top: 8px;
      width: 78px;
      height: 30px;
      right: 0; }
      @media screen and (min-width: 48em) {
        .abb-page__header__logo {
          top: 16px;
          width: 203px; } }
      .abb-page__header__logo:after {
        clear: both; }
    .abb-page__header__navigation-container {
      padding-right: 86px;
      overflow: hidden;
      margin-top: 18px;
      visibility: hidden; }
      @media screen and (min-width: 48em) {
        .abb-page__header__navigation-container {
          visibility: visible;
          padding-right: 211px; } }
    .abb-page__header__navigation-container-simple {
      margin-left: 96px; }
  .abb-page__content {
    position: relative; }
    @media screen and (min-width: 48em) {
      .abb-page__content {
        min-height: 40rem; } }
    .abb-page__content__inner {
      padding: 0.5rem; }
    .abb-page__content .abb-link:hover {
      color: #ff000f; }
  .abb-page__footer {
    padding: 0.3125rem 0;
    min-height: 2rem;
    font-size: 0.75rem;
    color: #868686; }
    @media print {
      .abb-page__footer {
        display: none; } }
    .abb-page__footer__select {
      width: 120px;
      height: 24px; }
    .abb-page__footer a {
      color: #868686; }
      .abb-page__footer a:hover {
        color: #A0A0A0; }
    .abb-page__footer__links {
      display: block;
      list-style: none;
      overflow: hidden;
      margin: 0;
      font-size: 16px;
      line-height: 1.5em;
      font-weight: 400;
      padding: 20px 0 15px 0;
      color: #262626; }
      .abb-page__footer__links span, .abb-page__footer__links a {
        display: block;
        text-align: center;
        padding: 0 0 5px 0;
        white-space: nowrap; }
      .abb-page__footer__links a {
        color: #262626; }
        .abb-page__footer__links a:visited, .abb-page__footer__links a:hover {
          color: #262626; }
      @media screen and (min-width: 30em) {
        .abb-page__footer__links span, .abb-page__footer__links a {
          display: inline-block;
          float: left;
          text-align: left; }
        .abb-page__footer__links a:before {
          content: "|";
          padding: 0 0.5rem 0 0.5rem;
          display: inline-block; } }