/*! main.scss for Eastop */
/**
 * 1. All units are in rems as this unit of measurement is supported in all
 *    required browsers. Media queries however use em units as rem units can
 *    be buggy in some browsers. 
 * 2. Parts of the code contained within may change before concluding 
 *    frontend development.
 *
 * ========================================================================== 
 *
 * Dependent on normalize.css - see git.io/normalize
 *
 */
#wpadminbar,
#ajax-links,
#body-classes {
  display: none !important; }

body {
  image-rendering: crisp-edges;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

/* Webfonts */
/* ========================================================================== */
@font-face {
  font-family: 'Suisse Intl Cond Med';
  src: url("../fonts/SuisseIntlCond-Medium-WebS.woff2") format("woff2"), url("../fonts/SuisseIntlCond-Medium-WebS.woff") format("woff"), url("../fonts/SuisseIntlCond-Medium-WebS.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-stretch: normal; }
/* Functions */
/* ========================================================================== */
/* strip units from calculations */
/* Site Variables */
/* ========================================================================== */
/* Define Animation Lengths - please note this will NOT affect Javascript Animations */
/* Break Points */
/* Mixins */
/* ========================================================================== */
/* media queries */
/* CSS box-sizing */
/* border-radius */
/* text overflow */
/* transition */
/* transform */
/* background-size */
/* no select */
/* fill-parent */
/* horizontal-center */
/* Additional Resets */
/* ========================================================================== */
#js,
html,
body {
  margin: 0 !important;
  padding: 0 !important; }

article,
div,
fieldset,
figure,
form,
footer,
header,
nav,
section {
  display: block;
  position: relative;
  padding: 0;
  margin: 0;
  border: none;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

a {
  outline: none !important;
  text-decoration: none;
  color: inherit; }

h1,
h2,
h3,
h4,
h5,
h6,
li,
p,
ol,
ul,
blockquote {
  margin: 0;
  padding: 0;
  font-weight: normal;
  font-style: normal;
  font-family: 'Suisse Intl Cond Med', sans-serif; }

figure {
  line-height: 0;
  background-color: transparent; }

img,
video,
iframe {
  max-width: 100%;
  max-height: none;
  height: auto;
  width: auto; }

mark {
  background-color: transparent; }

* {
  -webkit-tap-highlight-color: transparent;
  background-position: center;
  background-repeat: no-repeat;
  -ms-transform-origin: center;
  -webkit-transform-origin: center;
  transform-origin: center;
  outline: none !important; }

ul,
li {
  list-style: none; }

html,
body {
  width: 100%; }

input,
button,
textarea {
  outline: none !important;
  border-radius: 0 !important; }

svg {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: absolute; }

/* Cover & Loader */
/* ========================================================================== */
.c-cover {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  position: fixed;
  background-color: #FFF;
  z-index: 10000; }
  .state-site-loaded .c-cover {
    -webkit-transition: visibility 0ms linear 800ms, opacity 800ms;
    -moz-transition: visibility 0ms linear 800ms, opacity 800ms;
    -ms-transition: visibility 0ms linear 800ms, opacity 800ms;
    transition: visibility 0ms linear 800ms, opacity 800ms;
    /* resolves blurry elements on webkit */
    visibility: hidden;
    opacity: 0; }

.c-page-loader {
  z-index: 10010;
  background-color: #000;
  width: 0;
  position: fixed;
  top: 0;
  left: 0;
  height: 0.125rem; }
  .state-site-loaded .c-page-loader {
    -webkit-transition: visibility 0ms linear 800ms, opacity 800ms;
    -moz-transition: visibility 0ms linear 800ms, opacity 800ms;
    -ms-transition: visibility 0ms linear 800ms, opacity 800ms;
    transition: visibility 0ms linear 800ms, opacity 800ms;
    /* resolves blurry elements on webkit */
    visibility: hidden;
    opacity: 0; }

/* Screen Size */
/* ========================================================================== */
.c-screen-size {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  position: fixed; }

/* Site Wrappers Wrappers */
/* ========================================================================== */
html,
body {
  height: 100%; }

.c-site-wrapper {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  position: fixed; }

/* Site Logo */
/* ========================================================================== */
.c-site-logo {
  height: 1rem;
  width: 11.5rem;
  position: fixed;
  top: 2.375rem;
  left: calc(50% - 5.75rem);
  z-index: 9000; }
  @media screen and (min-width: 40em) {
    .c-site-logo {
      height: 1.25rem;
      width: 14.25rem;
      top: 1.875rem;
      left: calc(50% - 7.125rem); } }
  .c-site-logo__inner {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    position: absolute; }
    .c-site-logo__inner * {
      fill: #000;
      -webkit-transition: fill 800ms;
      -moz-transition: fill 800ms;
      -ms-transition: fill 800ms;
      transition: fill 800ms;
      /* resolves blurry elements on webkit */ }
      .state-black .c-site-logo__inner * {
        fill: #FFF; }
      .state-info-open .c-site-logo__inner * {
        fill: #000 !important; }

/* Site Logo */
/* ========================================================================== */
.c-slider {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  position: fixed;
  background-color: #FFF;
  -webkit-transition: background-color 800ms;
  -moz-transition: background-color 800ms;
  -ms-transition: background-color 800ms;
  transition: background-color 800ms;
  /* resolves blurry elements on webkit */ }
  .state-black .c-slider {
    background-color: #000; }
  .c-slider__gallery {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    position: absolute; }
    .c-slider__gallery__slide-outer {
      height: 100% !important; }
    .c-slider__gallery__slide {
      height: 100% !important;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      overflow: hidden;
      opacity: 1 !important;
      box-sizing: border-box !important;
      -webkit-transition: opacity 800ms;
      -moz-transition: opacity 800ms;
      -ms-transition: opacity 800ms;
      transition: opacity 800ms;
      /* resolves blurry elements on webkit */
      border-top: 6rem solid transparent;
      border-bottom: 6rem solid transparent;
      border-left: 1.25rem solid transparent;
      border-right: 1.25rem solid transparent; }
      @media screen and (min-width: 40em) {
        .c-slider__gallery__slide {
          border-top: 7.5rem solid transparent;
          border-bottom: 7.5rem solid transparent;
          border-left: 1.875rem solid transparent;
          border-right: 1.875rem solid transparent; } }
      @media screen and (min-width: 60rem) {
        .c-slider__gallery__slide {
          border-left: 7.5rem solid transparent;
          border-right: 7.5rem solid transparent; } }
      @media screen and (min-width: 100rem) {
        .c-slider__gallery__slide {
          border-top: 9.75rem solid transparent;
          border-bottom: 9.75rem solid transparent;
          border-left: 9.75rem solid transparent;
          border-right: 9.75rem solid transparent; } }
      .c-slider__gallery__slide .u-figure {
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        position: absolute;
        overflow: hidden; }
        .c-slider__gallery__slide .u-figure img {
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          position: absolute;
          object-position: 50% 50%;
          object-fit: contain; }
      .c-slider__gallery__slide--landscape {
        border-top: none;
        border-right: none;
        border-bottom: none;
        border-left: none; }
        .c-slider__gallery__slide--landscape .u-figure img {
          object-fit: cover; }
      .c-slider__gallery__slide--portrait {
        border-top: none;
        border-right: none;
        border-bottom: none;
        border-left: 50vw solid transparent; }
        @media screen and (orientation: portrait) {
          .c-slider__gallery__slide--portrait {
            border-left: none; } }
        .c-slider__gallery__slide--portrait .u-figure img {
          object-fit: cover; }
      .c-slider__gallery__slide__left {
        position: absolute;
        top: 0;
        right: calc(50% + 0.5rem);
        bottom: 0;
        left: 0; }
        .c-slider__gallery__slide__left .u-figure img {
          object-fit: contain;
          object-position: 100% 50%; }
      .c-slider__gallery__slide__right {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: calc(50% + 0.5rem); }
        .c-slider__gallery__slide__right .u-figure img {
          object-fit: contain;
          object-position: 0% 50%; }
      .c-slider__gallery__slide.slick-active {
        opacity: 1 !important; }
  .c-slider__control {
    width: 50%;
    top: 0;
    height: 100%;
    position: absolute; }
    .c-slider__control--left {
      left: 0;
      cursor: url("../img/left-arrow.png"), auto;
      cursor: -webkit-image-set(url("../img/left-arrow.png") 1x, url("../img/left-arrow-2x.png") 2x), auto; }
      .state-black .c-slider__control--left {
        left: 0;
        cursor: url("../img/left-arrow-white.png"), auto;
        cursor: -webkit-image-set(url("../img/left-arrow-white.png") 1x, url("../img/left-arrow-white-2x.png") 2x), auto; }
    .c-slider__control--right {
      right: 0;
      cursor: url("../img/right-arrow.png"), auto;
      cursor: -webkit-image-set(url("../img/right-arrow.png") 1x, url("../img/right-arrow-2x.png") 2x), auto; }
      .state-black .c-slider__control--right {
        cursor: url("../img/right-arrow-white.png"), auto;
        cursor: -webkit-image-set(url("../img/right-arrow-white.png") 1x, url("../img/right-arrow-white-2x.png") 2x), auto; }

.js-slick .slick-list,
.js-slick .slick-track {
  height: 100% !important; }

/* Footer */
/* ========================================================================== */
.c-footer {
  position: fixed;
  bottom: 1.625rem;
  left: 1.875rem;
  right: 1.875rem;
  display: flex;
  justify-content: center;
  z-index: 9000; }
  .c-footer__text, .c-info__text {
    color: #000;
    font-size: 1rem;
    line-height: 1.25rem;
    letter-spacing: 0.08em;
    font-size: sans-serif;
    text-transform: uppercase;
    padding: 0 0.625em;
    text-align: center;
    -webkit-transition: color 800ms;
    -moz-transition: color 800ms;
    -ms-transition: color 800ms;
    transition: color 800ms;
    /* resolves blurry elements on webkit */ }
    @media screen and (min-width: 40em) {
      .c-footer__text, .c-info__text {
        font-size: 0.875rem; } }
    .c-footer__text--desktop {
      display: none; }
      @media screen and (min-width: 60rem) {
        .c-footer__text--desktop {
          display: block; } }
    .c-footer__text--mobile {
      display: inline-block; }
      @media screen and (min-width: 60rem) {
        .c-footer__text--mobile {
          display: none; } }
    .state-black .c-footer__text, .state-black .c-info__text {
      color: #FFF; }
    .state-info-open .c-footer__text, .state-info-open .c-info__text {
      color: #000 !important; }

/* Info */
/* ========================================================================== */
.c-info {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  position: fixed;
  background-color: #FFF;
  padding: 6rem 1.25rem;
  opacity: 0;
  visibility: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  flex-wrap: wrap;
  -webkit-transition: opacity 800ms, visibility 0ms linear 800ms;
  -moz-transition: opacity 800ms, visibility 0ms linear 800ms;
  -ms-transition: opacity 800ms, visibility 0ms linear 800ms;
  transition: opacity 800ms, visibility 0ms linear 800ms;
  /* resolves blurry elements on webkit */ }
  .state-info-open .c-info {
    opacity: 1;
    visibility: visible;
    -webkit-transition: opacity 800ms, visibility 0ms linear 0ms;
    -moz-transition: opacity 800ms, visibility 0ms linear 0ms;
    -ms-transition: opacity 800ms, visibility 0ms linear 0ms;
    transition: opacity 800ms, visibility 0ms linear 0ms;
    /* resolves blurry elements on webkit */ }
  .c-info--desktop {
    display: none !important; }
  .c-info__text {
    padding: 0.375em 0;
    width: 100%; }
    .c-info__text--link {
      z-index: 10; }
  .c-info__overlay {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 5; }
