@import '../../globalResources/scss/settings/settings';

@import '../scss/logo';
@import '../scss/search';
@import 'top-row';
@import '../scss/menu';

//Move this later
.header-responsive + #contentWrapper,
.header-responsive ~ #footerWrapper {
  overflow: auto;
}

header.header-responsive {
  width: 100%;
  margin: 12px 0;
  background: linear-gradient(to bottom, $white , $white 50%, $grayBackground 50%, $grayBackground);

  .header-container {
    max-width: $site-width;
    display: flex;
    margin: 0 auto;
    padding: 0 16px;
  }

  .right-content {
    width: 100%;
    padding-left: 6px;

    @media(min-width: 1200px){
      width: 1158px;
    }
  }
}


@media(max-width: 767px) {
 .header-responsive .right-content .top-row {
   height: $header-mobile-row-height;
   padding-top: 0;
 }
}

//IE overrides
.is-ie8 + .header-responsive,
.is-ie9  + .header-responsive {

  .logo-container {
    float: left;
  }

  .right-content {
    float: left;
    width: 80%;
  }
}