@charset "UTF-8";

/* Start HEADER  */
@-webkit-keyframes static-header__img--animate {
  0%    { opacity: 1; }
  45%   { opacity: 1; }
  55%   { opacity: 0; }
  100%  { opacity: 0; }
}
@keyframes static-header__img--animate {
  0%    { opacity: 1; }
  45%   { opacity: 1; }
  55%   { opacity: 0; }
  100%  { opacity: 0; }
}

@keyframes fade-in {
  from {
    opacity: 0; 
    transform: scale(.8,.8)
  }
  to {
    opacity: 1;
  }
}
.content-page--fade-in-element {
  animation: fade-in 1.4s;
}

@media all and (min-width: 1024px) {
  .content-page--404 {
    display: flex;
    justify-content: flex-start;
    flex-direction: row;
    width: 100%;
    max-width: 1500px;
  }  
  .content-page__images.content-page__images--main,
  .content-page__main-content {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    width: 50%;
    max-width: 50%;
  }
  .content-page__main-content {
    margin: 0 20px;
  }  
}
@media all and (min-width: 1400px) {
  .content-page__images.content-page__images--main {
    width:55vw;
    max-width:inherit;
  }
  .content-page__main-content {
    width: 45vw;
    max-width:620px;
    margin: 0 34px;
  }
}
.content-page--hidden {
  opacity: 0;
}
.content-page * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.content-page {
  max-width: 1500px;
  width: 100%;
  padding: 0;
  margin: 0 auto;
  border: 0;
  clear: both;
  position: relative;
}   
.content-page__header {
  clear: both;
  position: relative;
  width: 100%;
  padding: 0;
  border: 0;
  margin: 0 auto 12px;
}  
  @media all and (max-width: 768px) {
    .content-page__header {
      /* margin: 0 auto; */
    }
  }
  .content-page__header-lock-up,
  .content-page__collection__card {
    position: relative;
    margin: 30px auto 8px;
  }
  .content-page__header-lock-up .content-page__404 {
      position: absolute;
      top: -25px;
      right: 5px;
    }
  @media all and (max-width: 768px) {
      .content-page__header-lock-up {
          padding: 0 20px;
      }
  }
  @media all and (min-width: 1024px) {
    .content-page__header-lock-up {
      margin: 40px auto 8px;
    }  
  }
  @media all and (min-width: 1200px) {
    .content-page__header-lock-up {
      margin: 60px auto 8px;
    }  
  }

  .content-page__images {
    width: 100%;
    margin: 0 auto;
    height: auto;
    position: relative;
  }
    .content-page__img {
      width: 100%;
      margin: 0 auto;
      height: auto;
    }

.content-page__links {
  text-align: left;
}

.content-page__heading,
.content-page__text,
.content-page__404,
.content-page-text-intro {
  font-family: "HelveticaNeue-Regular",arial,sans-serif;
  color: #000;  
  text-align: left;
  letter-spacing: 0;  
}

.content-page__heading,
.content-page__text, 
.content-page__text--intro {  
  font-size: 16px;
}
.content-page__text {
  padding: 0 20px;
  margin: 0 auto;
}

.content-page__text--intro {

}

.content-page__heading {
  font-weight: 600;
  line-height: 1em;
}
.content-page__heading--level-1 {
  position: relative;
	font-size: 42px;
	font-weight: 600;
	margin: 30px auto 0;
	padding: 0;
	width: calc(100% - 20px);
  z-index: 1;
}
@media all and (min-width: 480px) {
  .content-page__heading--level-1 {
     margin: 30px auto 0 16px;
  }
  .content-page__text {
    padding: 0 16px;
  }  
}
.content-page__heading--sub {
  font-size: 28px;
  display: block;
}
.content-page__404 {
  /* This should change. 404 means something it is an error page meaning */
  /* color: #F3F3F3;   */
  color: #919191;  
  text-align: left;
  letter-spacing: 0;  
  text-transform: uppercase;
  font-size: 24vw;
  z-index: 1;
}

.content-page__heading.content-page__heading--level-2 {
  font-size: 16px;
  margin: 12px auto;
}
@media all and (min-width: 380px) {
  .content-page__header-lock-up .content-page__404 {
    font-size: 90px;
  }
}

@media all and (min-width: 768px) {
  .content-page__text {
    font-size: 17px;
  }  
}
@media all and (min-width: 1024px) {
  .content-page__header-lock-up .content-page__404 {
    font-size: 110px;
    top: -35px;
    right: -5px;
  }
}


/* Cards - link blocks */
.content-page__collection {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  clear: both;
  margin: 0 16px;
}
.content-page__collection__card {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: flex-start; 
  width: calc(50% - 4px);
  margin: 24px 0 0 0;
}
.content-page__collection__card--double {
  display: block;
  width: 100%;
  padding: 0 16px;
}

.content-page__img--card {
  width: 100%;
  /* max-width: 135px; */
  max-width: 450px;
  margin: 0;
}
@media all and (min-width: 480px) {
  .content-page__collection {
     margin: 0 16px;
  }
}
@media all and (min-width: 641px) and (max-width: 1023px) {
  .content-page__collection__card:not(.content-page__collection__card--double) {
    width: calc(50% - 8px);
  }
}

  
/* Images */
.content-page__images {
  margin: 0;
}
  @media all and (min-width: 769px) {
    .content-page__images {
      /* margin: 100px auto; */
    }
  }

/* Link lists */
.content-page__ctas-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  text-align: left;
  list-style: none;
  margin: 0;
  padding: 0;
}

.content-page__ctas-list-item {
  margin: 0;
  padding: 0;
  width: initial;
}
  @media all and (max-width: 768px) {
    .content-page__ctas-list {

    } 
    .content-page__ctas-list-item {

    }
  }
  .content-page__cta {
    display: inline-block;
    box-sizing: border-box;
    border: 1px solid #DDD;
    border-radius: 3px;  
    color: #000;
    background-color: #F3F3F3;
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0;
    padding: 0.3em 0.5em;
    margin: 0 8px 8px 0;
    transition: 0.3s;
    text-align: center;
    width: inherit;
  }

    @media all and (max-width: 768px) {
      .content-page__cta {

      }       
    }     
    
    .content-page__cta:hover,
    .content-page__cta:focus {
      border-color: #000;
      background-color: #000;
      color: #fff;
    }


/* Hide sale / skinny banner*/
#skinny-banner-header {
  display: none;
}