* {
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

html {
  font-family: 'Interstate Light', Interstate, sans-serif;
  font-weight: 300;
  font-size: 14px;
  line-height: 1.42857;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased; }
  @media (min-width: 30em) {
    html {
      font-size: 14px; } }
  @media (min-width: 50em) {
    html {
      font-size: 16px; } }
  @media (min-width: 70em) {
    html {
      font-size: 17px; } }

body {
  margin: 1rem;
  background-color: #49565c;
  color: #fff;
  overflow-y: scroll; }

/**
 * Base elements
 */
p {
  margin: 0 0 2em; }

.Title, .Nav, h3 {
  letter-spacing: 0.15em;
  text-transform: uppercase; }

.Title {
  font-size: 1.85714rem;
  font-weight: normal;
  font-family: Interstate; }

h3 {
  font-size: 1rem;
  font-weight: normal;
  margin: 0 0 1em; }

img {
  max-width: 100%;
  vertical-align: top; }

/**
 * Logo
 */
.Logo {
  text-align: center;
  max-width: 90%;
  margin: 0 auto 2rem;
  -webkit-transition: opacity 200ms, -webkit-transform 200ms ease;
  transition: opacity 200ms, transform 200ms ease;
  -webkit-transform-origin: center center;
  transform-origin: center center; }
  @media (min-width: 35em) {
    .Logo {
      position: fixed;
      z-index: 2;
      top: 33.5px;
      left: 50%;
      min-width: 200px;
      width: 21.40625%;
      margin: 0 0 0 -10.70312%;
      top: 67px; } }
  .is-overlayed .Logo {
    opacity: 0;
    -webkit-transform: scale(0.9);
    transform: scale(0.9); }

/**
 * Layout
 */
@media (min-width: 35em) {
  .Page {
    position: fixed;
    top: 56.5%;
    left: 0;
    width: 100%; } }

.Body {
  font-size: 1.14286rem;
  text-align: center;
  max-width: 38rem;
  margin-left: auto;
  margin-right: auto; }

.Grid--2 {
  margin-top: 4rem;
  overflow: auto; }
  @media (min-width: 32em) {
    .Grid--2 {
      max-width: 90%;
      margin-left: auto;
      margin-right: auto; }
      .Grid--2 .Grid-col {
        float: left;
        width: 44.33498%; }
        .Grid--2 .Grid-col:last-child {
          float: right; } }
  @media (min-width: 65em) {
    .Grid--2 {
      max-width: 63.4375%; } }

/**
 * Fullscreen images
 */
.Fullscreen {
  position: fixed;
  margin: 0;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  -webkit-transition: opacity 500ms, background-color 500ms;
  transition: opacity 500ms, background-color 500ms;
  opacity: 0; }
  .Fullscreen img {
    display: none; }
  .Fullscreen.is-loaded {
    opacity: 1; }

.Fullscreen-bg {
  background-size: cover;
  background-position: center center;
  position: absolute;
  width: 100%;
  height: 100%; }

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

.Nav a, .Pos a {
  display: inline-block;
  border-bottom: 2px solid transparent; }
  .Nav a:hover, .Nav a.active, .Pos a:hover, .Pos a.active {
    border-color: #fff; }

.Nav--home {
  text-align: center;
  margin-bottom: 2rem; }
  @media (min-width: 35em) {
    .Nav--home {
      position: fixed;
      z-index: 5;
      top: 50.9%;
      left: 0;
      width: 100%;
      margin-top: -16.5px; } }
  .Nav--home a {
    margin: 0 0.5rem 0.5rem;
    font-size: 1.14286rem; }
    @media (min-width: 35em) {
      .Nav--home a {
        font-size: 1.28571rem;
        margin: 0 1rem 0.5rem; } }
    @media (min-width: 60em) {
      .Nav--home a {
        margin-left: 3rem;
        margin-right: 3rem; } }

@media (min-width: 35em) {
  .Pos {
    position: fixed;
    z-index: 2; }
    .Pos a {
      font-size: 1rem;
      margin: 0; } }

@media (min-width: 35em) {
  .Pos--topRight {
    top: 0.9rem;
    right: 1rem;
    font-weight: bold; }
  .Pos--bottomRight {
    bottom: 0.6rem;
    right: 1rem; }
  .Pos--bottomLeft {
    bottom: 0.6rem;
    left: 1rem; }
  .Pos--topLeft {
    top: 0.9rem;
    left: 1rem; } }

.Splash a {
  display: block;
  height: 100%; }

.Splash-left, .Splash-right {
  top: 0;
  width: 50%;
  height: 100%;
  position: fixed; }

.Splash-left {
  left: 0; }
  .Splash-left .Logo {
    left: 25%;
    margin-top: 2rem; }
    @media (min-width: 35em) {
      .Splash-left .Logo {
        margin-top: auto; } }

.Splash-right {
  right: 0;
  background-color: #fff; }
  .Splash-right .Splash-text {
    color: #3b3633;
    background-color: #fff;
    min-height: 6rem;
    line-height: 6rem;
    margin-top: -3rem; }

.Splash-text {
  position: fixed;
  top: 50%;
  font-size: 1.28571rem;
  margin-top: -14.5px;
  width: 50%;
  text-align: center; }

.Splash-square {
  -webkit-transition: padding 600ms ease-in-out;
  transition: padding 600ms ease-in-out;
  background-color: rgba(67, 124, 156, 0.5);
  position: fixed;
  width: 25%;
  height: 0;
  padding-bottom: 25%;
  background-size: cover;
  background-position: center center; }
  .Splash-square:nth-of-type(1) {
    top: 0;
    left: 50%;
    background-image: url(../images/splash/hangers.jpg); }
  .Splash-square:nth-of-type(2) {
    top: 0;
    right: 0;
    background-image: url(../images/splash/mannequins.jpg); }
  .Splash-square:nth-of-type(3) {
    bottom: 0;
    background-image: url(../images/splash/instore.jpg); }
  .Splash-square:nth-of-type(4) {
    bottom: 0;
    right: 0;
    background-image: url(../images/splash/retail.jpg); }
  @media (min-width: 1700px) {
    .Splash-square {
      padding-bottom: 20%; } }

a img {
  border: 0;
}
