@import url(../fonts/MyFontsWebfontsKit.css);
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box; }

body, html {
  width: 100%;
  height: 100%;
  -webkit-font-smoothing: antialiased; }
  body.touch-screen, html.touch-screen {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

button {
  background: none;
  border: 0;
  outline: 0; }

img, iframe {
  max-width: 100%; }

img {
  display: block;
  outline: 0;
  border: 0; }

a {
  text-decoration: none;
  color: inherit; }

hr {
  border: 0;
  outline: 0; }

ul, li {
  list-style: none; }

input, textarea {
  background: none;
  border: 0;
  outline: 0;
  resize: none;
  border-radius: 0;
  caret-color: currentColor; }

strong {
  font-weight: normal; }

h1, h2, h3, h4, h5, h6 {
  font-weight: normal; }

.content h1 {
  margin-bottom: 1.5em; }
.content h2 {
  margin-bottom: 1.5em; }
.content h3 {
  margin-bottom: 1.5em; }
.content h4 {
  margin-bottom: 1.5em; }
.content h5 {
  margin-bottom: 1.5em; }
.content h6 {
  margin-bottom: 1.5em; }
.content h7 {
  margin-bottom: 1.5em; }
.content p {
  margin-bottom: 1.25em; }

.sb-work__cases:after {
  visibility: hidden;
  display: block;
  content: "";
  clear: both;
  height: 0; }

.prevent-scroll {
  height: 100%;
  overflow: hidden; }

#mfPreviewBar {
  display: none !important; }

@font-face {
  font-family: 'icomoon';
  src: url("../fonts/icomoon/icomoon.eot?v1j238");
  src: url("../fonts/icomoon/icomoon.eot?v1j238#iefix") format("embedded-opentype"), url("../fonts/icomoon/icomoon.ttf?v1j238") format("truetype"), url("../fonts/icomoon/icomoon.woff?v1j238") format("woff"), url("../fonts/icomoon/icomoon.svg?v1j238#icomoon") format("svg");
  font-weight: normal;
  font-style: normal; }
[class^="icon-"], [class*=" icon-"], .icomoon, .footer__social a {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.icon-email:before {
  content: "\e900"; }

.icon-instagram:before, .footer__social a[href*="instagram"]:before {
  content: "\e901"; }

.icon-twitter:before, .footer__social a[href*="twitter"]:before {
  content: "\e902"; }

.icon-vimeo:before, .footer__social a[href*="vimeo"]:before {
  content: "\eaa0"; }

.icon-linkedin, .footer__social a[href*="linkedin"] {
  content: 'Linkedin';
  background-image: url("../images/linkedin.svg");
  background-repeat: no-repeat; }

@font-face {
  font-family: 'HelveticaNeueLTPro-Bd';
  src: url("../fonts/Linotype-HelveticaNeueLTPro-Bd.otf");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'HelveticaNeueLTStd-Bd';
  src: url("../fonts/Linotype-HelveticaNeueLTStd-Bd.otf");
  font-weight: normal;
  font-style: normal; }
.h0, .h1, .content h1, .h2, .content h2, .h3, .content h3, .h4, .content h4, .h5, .content h5, .h6, .content h6, .h8, .project__video--button:after, .h10 {
  font-family: "AvantGardeGothicITCW02Dm", sans-serif; }

.h7, .content h7, .button, .h9 {
  font-family: "NHaasGroteskTXPro-75Bd", sans-serif; }

.h0 {
  font-size: 110px;
  line-height: 1; }

.h1, .content h1 {
  font-size: 34px;
  line-height: 48px;
  letter-spacing: 0.03529411765em; }

.h2, .content h2 {
  font-size: 36px;
  line-height: 40px;
  letter-spacing: 0.04em; }

.h3, .content h3 {
  font-size: 26px;
  line-height: 40px; }

.h4, .content h4 {
  font-size: 23px;
  line-height: 40px; }

.h5, .content h5 {
  font-size: 1.25em;
  line-height: 1.6;
  letter-spacing: 0.06em; }

.h6, .content h6 {
  font-size: 17px;
  line-height: 24px; }

.h7, .content h7, .button {
  font-size: 14px;
  line-height: 24px;
  letter-spacing: 0.1571428571em; }

.h8, .project__video--button:after {
  font-size: 12px;
  line-height: 16px; }

.h9 {
  font-size: 12px;
  line-height: 16px; }

.h10 {
  font-size: 20px;
  line-height: 20px;
  letter-spacing: 0.1571428571em; }

.p, .content p, .projects__content-description p, .projects__content p, .contact-us p, .contact-us span, .contact-us a {
  font-family: "ClassGarmndBTWXX-Roman", serif;
  font-size: 0.9375em;
  letter-spacing: 0.02666666667em;
  line-height: 1.6; }
  .p--medium, .about-us__content--columns ul li {
    font-size: 21px;
    line-height: 40px; }

@media all and (min-width: 768px) {
  .h0 {
    font-size: 160px; }

  .h1, .content h1 {
    font-size: 40px;
    line-height: 1.1764705882; }

  .h3, .content h3 {
    font-size: 32px; }

  .h4, .content h4 {
    font-size: 28px;
    line-height: 48px; }

  .h5, .content h5 {
    font-size: 1.5em;
    line-height: 1.3333333333; } }
@media all and (min-width: 1200px) {
  .h1, .content h1 {
    font-size: 60px; } }
.scrolled .hamburger {
  color: #000; }
  .scrolled .hamburger--opened {
    color: #fff !important; }

.hamburger {
  width: 45px;
  height: 55px;
  display: block;
  position: relative;
  cursor: pointer;
  right: 16px;
  z-index: 110;
  border-radius: 50%;
  pointer-events: auto; }

.hamburger__line {
  width: 27px;
  height: 3px;
  overflow: hidden;
  position: absolute;
  z-index: 10; }

.hamburger__line-in {
  width: 81px;
  height: 3px;
  position: absolute;
  top: 0;
  left: 0; }

.hamburger__line-in::before,
.hamburger__line-in::after {
  width: 27px;
  height: 3px;
  content: '';
  display: block;
  position: absolute;
  top: 0;
  background-color: currentColor; }

.hamburger__line-in::before {
  left: -54px; }

.hamburger__line-in::after {
  left: 0; }

.hamburger__line--01,
.hamburger__line--02,
.hamburger__line--03,
.hamburger__line--cross01,
.hamburger__line--cross02 {
  left: 9px; }

.hamburger__line--01 {
  top: 14px; }

.hamburger__line--02,
.hamburger__line--cross01,
.hamburger__line--cross02 {
  top: 22px; }

.hamburger__line--03 {
  top: 30px; }

@media all and (min-width: 768px) {
  .hamburger {
    right: 48px; }

  .hamburger__line {
    width: 36px;
    height: 4px; }

  .hamburger__line-in {
    width: 108px;
    height: 4px; }

  .hamburger__line-in::before,
  .hamburger__line-in::after {
    width: 36px;
    height: 4px; }

  .hamburger__line-in::before {
    left: -72px; }

  .hamburger__line-in::after {
    left: 0; }

  .hamburger__line--01,
  .hamburger__line--02,
  .hamburger__line--03,
  .hamburger__line--cross01,
  .hamburger__line--cross02 {
    left: 5px; }

  .hamburger__line--01 {
    top: 11px; }

  .hamburger__line--02,
  .hamburger__line--cross01,
  .hamburger__line--cross02 {
    top: 22px; }

  .hamburger__line--03 {
    top: 33px; } }
.hamburger__line--cross01 {
  -ms-transform: rotate(45deg);
  transform: rotate(45deg); }

.hamburger__line--cross02 {
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg); }

.hamburger__line {
  transition-duration: 0.6s;
  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
  transition-property: transform; }

.hamburger__line-in {
  transition-duration: 0.6s;
  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
  transition-property: transform; }

.hamburger__line-in::before,
.hamburger__line-in::after {
  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
  transition-property: transform; }

.hamburger__line-in--cross01,
.hamburger__line-in--cross02 {
  -ms-transform: translateX(-33.3%);
  transform: translateX(-33.3%); }

.hamburger__line-in--01 {
  transition-delay: 0.2s; }

.hamburger__line-in--02 {
  transition-delay: 0.25s; }

.hamburger__line-in--02::before,
.hamburger__line-in--02::after {
  transition-delay: 0.05s; }

.hamburger__line-in--03 {
  transition-delay: 0.3s; }

.hamburger__line-in--03::before,
.hamburger__line-in--03::after {
  transition-delay: 0.1s; }

.hamburger__line-in--cross01 {
  transition-delay: 0.0s; }

.hamburger__line-in--cross02 {
  transition-delay: 0.05s; }

.hamburger__line-in--cross02::before,
.hamburger__line-in--cross02::after {
  transition-delay: 0.1s; }

.hamburger.hamburger--opened .hamburger__line-in--01,
.hamburger.hamburger--opened .hamburger__line-in--02,
.hamburger.hamburger--opened .hamburger__line-in--03 {
  -ms-transform: translateX(33.3%);
  transform: translateX(33.3%); }

.hamburger.hamburger--opened .hamburger__line-in--cross01,
.hamburger.hamburger--opened .hamburger__line-in--cross02 {
  -ms-transform: translateX(0);
  transform: translateX(0); }

.hamburger.hamburger--opened .hamburger__line-in--01 {
  transition-delay: 0s; }

.hamburger.hamburger--opened .hamburger__line-in--02 {
  transition-delay: 0.05s; }

.hamburger.hamburger--opened .hamburger__line-in--03 {
  transition-delay: 0.1s; }

.hamburger.hamburger--opened .hamburger__line-in--cross01 {
  transition-delay: 0.25s; }

.hamburger.hamburger--opened .hamburger__line-in--cross02 {
  transition-delay: 0.3s; }

.hamburger:hover .hamburger__line-in::before,
.hamburger:hover .hamburger__line-in::after {
  -ms-transform: translateX(200%);
  transform: translateX(200%); }

.hamburger:hover .hamburger__line-in--01::before,
.hamburger:hover .hamburger__line-in--01::after,
.hamburger:hover .hamburger__line-in--02::before,
.hamburger:hover .hamburger__line-in--02::after,
.hamburger:hover .hamburger__line-in--03::before,
.hamburger:hover .hamburger__line-in--03::after {
  transition-duration: 1s; }

.hamburger:hover .hamburger__line-in--cross01::before,
.hamburger:hover .hamburger__line-in--cross01::after,
.hamburger:hover .hamburger__line-in--cross02::before,
.hamburger:hover .hamburger__line-in--cross02::after {
  transition-duration: 0s; }

.hamburger.hamburger--opened:hover .hamburger__line-in--cross01::before,
.hamburger.hamburger--opened:hover .hamburger__line-in--cross01::after,
.hamburger.hamburger--opened:hover .hamburger__line-in--cross02::before,
.hamburger.hamburger--opened:hover .hamburger__line-in--cross02::after {
  transition-duration: 1s; }

.hamburger.hamburger--opened:hover .hamburger__line-in--01::before,
.hamburger.hamburger--opened:hover .hamburger__line-in--01::after,
.hamburger.hamburger--opened:hover .hamburger__line-in--02::before,
.hamburger.hamburger--opened:hover .hamburger__line-in--02::after,
.hamburger.hamburger--opened:hover .hamburger__line-in--03::before,
.hamburger.hamburger--opened:hover .hamburger__line-in--03::after {
  transition-duration: 0s; }

.button--link {
  position: relative;
  padding-bottom: 8px;
  padding-right: 23px;
  display: inline-block; }
  .button--link__line {
    position: absolute;
    bottom: 0;
    left: 0;
    width: calc(100% - 23px);
    height: 3px;
    overflow: hidden; }
    .button--link__line:after, .button--link__line:before {
      width: 100%;
      height: 100%;
      content: '';
      display: block;
      position: absolute;
      top: 0;
      background-color: currentColor;
      transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
      transition-property: transform, background-color; }
    .button--link__line:before {
      left: -200%; }
    .button--link__line:after {
      left: 0; }
  .button--link:after {
    display: inline-block;
    content: '';
    position: absolute;
    top: 0.6em;
    right: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 0 4px 7px;
    border-color: transparent transparent transparent currentColor; }
  .button--link:hover .button--link__line:after, .button--link:hover .button--link__line:before {
    background: #ff7bac;
    -ms-transform: translateX(200%);
    transform: translateX(200%);
    transition-duration: 1s; }
.button--solid {
  text-transform: uppercase;
  background: #ffffff;
  color: #000000;
  height: 64px;
  line-height: 64px;
  padding: 0 60px; }
  @media all and (min-width: 768px) {
    .button--solid {
      min-width: 360px; } }
@media all and (max-width: 991px) {
  .button .button--link__line:after, .button .button--link__line:before {
    background: #ff7bac;
    -ms-transform: translateX(200%);
    transform: translateX(200%);
    transition-duration: 1s; } }

@keyframes move {
  from {
    transform: translateX(0); }
  50% {
    transform: translateX(2px); }
  to {
    transform: translateX(0); } }
.case {
  display: block;
  width: 100%; }
  .case__image {
    display: block;
    width: 100%;
    transition: opacity 0.35s, transform 0.35s; }
    .case__image-container {
      display: block;
      overflow: hidden;
      background: #ff7bac; }
      .case__image-container:hover .case__image {
        opacity: 0.2;
        -ms-transform: scale(1.1);
        transform: scale(1.1); }
      .case__image-container:hover .case__caption:before {
        opacity: 0; }
  .case__caption {
    position: relative; }
  .case__client {
    margin-bottom: 14px;
    text-transform: uppercase; }
  .case__title {
    margin-bottom: 24px; }
  .case--simple {
    position: relative;
    color: #ffffff;
    text-align: left;
    max-width: 666px;
    margin: 0 auto 32px auto;
    overflow: hidden;
    background: #ff7bac;
    cursor: pointer;
    opacity: 1;
    transition: opacity .3s ease-in-out;
    transition-delay: .1s; }
    .case--simple.inview {
      opacity: 0; }
    .case--simple > a {
      display: block; }
    .case--simple .case__description {
      display: none; }
    .case--simple .case__caption {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-pack: center;
      justify-content: center;
      -ms-flex-direction: column;
      flex-direction: column;
      position: absolute;
      top: 0;
      z-index: 1;
      height: 100%;
      padding-left: 32px;
      opacity: 0;
      transform: translate3d(-10px, 0, 0);
      transition: opacity 0.35s, transform 0.35s; }
      .case--simple .case__caption .button {
        -ms-flex-item-align: start;
        align-self: flex-start; }
    .case--simple:hover .case__image {
      opacity: 0.2;
      -ms-transform: scale(1.1);
      transform: scale(1.1); }
    .case--simple:hover .case__caption {
      -ms-transform: none;
      transform: none;
      opacity: 1; }
  .case--expanded {
    margin-bottom: 80px;
    text-align: center;
    color: #000000; }
    .case--expanded.inview .case__image {
      opacity: 0; }
    .case--expanded.inview .case__client {
      opacity: 0; }
    .case--expanded.inview .case__title {
      opacity: 0; }
    .case--expanded.inview .case__description {
      opacity: 0; }
    .case--expanded.inview .button {
      opacity: 0; }
    .case--expanded.inview .case__image-container {
      background-color: #ffffff; }
    .case--expanded .case__image-container {
      background-color: #ff7bac;
      transition: background .3s ease-in-out;
      transition-delay: .3s; }
    .case--expanded .case__image {
      transition: all .3s ease-in-out; }
    .case--expanded .case__client {
      transition: all .3s ease-in-out;
      transition-delay: .1s; }
    .case--expanded .case__title {
      transition: all .3s ease-in-out;
      transition-delay: .2s; }
    .case--expanded .case__description {
      transition: all .3s ease-in-out;
      transition-delay: .3s; }
    .case--expanded .button {
      transition: all .3s ease-in-out;
      transition-delay: .4s; }
    .case--expanded .case__caption {
      padding: 19px 10px 0;
      max-width: 470px;
      margin-right: auto;
      margin-left: auto; }
      .case--expanded .case__caption:before {
        content: '';
        position: absolute;
        top: -12px;
        left: 50%;
        margin-left: -12px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 12px 12px 12px;
        border-color: transparent transparent #ffffff transparent; }
    .case--expanded .case__description {
      margin-bottom: 32px; }
  @media all and (min-width: 1200px) {
    .case--simple {
      width: calc(50% - 40px);
      float: left;
      margin: 20px; } }
  @media all and (min-width: 1200px) {
    .case--expanded {
      overflow: hidden;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-align: center;
      align-items: center; }
      .case--expanded .case__image, .case--expanded .case__image-container {
        width: 61%; }
      .case--expanded .case__image-container .case__image {
        width: 100%; }
      .case--expanded .case__caption {
        text-align: left;
        margin: 0;
        padding-top: 0;
        margin-left: 6vw;
        max-width: 460px; } }

.slick-slider {
  display: block;
  position: relative;
  box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent; }

.slick-list {
  display: block;
  position: relative;
  margin: 0;
  padding: 0;
  overflow: hidden; }
  .slick-list:focus {
    outline: none; }
  .slick-list.dragging {
    cursor: hand; }

.slick-slider .slick-track,
.slick-slider .slick-list {
  transform: translate3d(0, 0, 0); }

.slick-track {
  display: block;
  position: relative;
  top: 0;
  left: 0;
  margin-right: auto;
  margin-left: auto; }
  .slick-track:before, .slick-track:after {
    display: table;
    content: ''; }
  .slick-track:after {
    clear: both; }
  .slick-loading .slick-track {
    visibility: hidden; }

.slick-slide {
  display: none;
  height: 100%;
  min-height: 1px;
  float: left;
  outline: 0; }
  [dir='rtl'] .slick-slide {
    float: right; }
  .slick-slide img {
    display: block; }
  .slick-slide.slick-loading img {
    display: none; }
  .slick-slide.dragging img {
    pointer-events: none; }
  .slick-initialized .slick-slide {
    display: block; }
  .slick-loading .slick-slide {
    visibility: hidden; }
  .slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent; }

.slick-arrow.slick-hidden {
  display: none; }

/**
 * (optional) define here the style definitions which should be applied on the slider container
 * e.g. width including further controls like arrows etc.
 */
.slider {
  position: relative; }
  .slider__frame {
    /**
     * (optional) wrapper width, specifies width of the slider frame.
     */
    width: 100%;
    position: relative;
    font-size: 0;
    line-height: 0;
    white-space: nowrap; }
  .slider__slides {
    display: inline-block; }
  .slider__slide {
    position: relative;
    display: inline-block;
    vertical-align: top;
    /**
     * (optional) if the content inside the slide element has a defined size.
     */
    width: 100%; }
  .slider__arrow {
    position: absolute;
    top: -30%;
    margin-top: -25px;
    display: block;
    cursor: pointer; }
    .slider__arrow--prev {
      left: 0; }
    .slider__arrow--next {
      right: 0; }
  .slider__pagination {
    display: inline-block;
    line-height: 0;
    position: relative; }
    .slider__pagination-container {
      position: absolute;
      z-index: 2;
      bottom: -56px;
      width: 100%;
      text-align: center; }
    .slider__pagination li {
      display: inline-block;
      background: #cccccc;
      width: 40px;
      height: 8px;
      margin: 0 8px;
      cursor: pointer; }
      .slider__pagination li:first-of-type {
        margin-left: 0; }
      .slider__pagination li:last-of-type {
        margin-right: 0; }
    .slider__pagination:after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      display: block;
      width: 40px;
      height: 8px;
      background: #000000;
      transition: transform 1s cubic-bezier(0.19, 1, 0.22, 1); }
    .slider__pagination[data-index="1"]:after {
      -ms-transform: translateX(56px);
      transform: translateX(56px); }
    .slider__pagination[data-index="2"]:after {
      -ms-transform: translateX(112px);
      transform: translateX(112px); }
    .slider__pagination[data-index="3"]:after {
      -ms-transform: translateX(168px);
      transform: translateX(168px); }
    .slider__pagination[data-index="4"]:after {
      -ms-transform: translateX(224px);
      transform: translateX(224px); }
    .slider__pagination[data-index="5"]:after {
      -ms-transform: translateX(280px);
      transform: translateX(280px); }
    .slider__pagination[data-index="6"]:after {
      -ms-transform: translateX(336px);
      transform: translateX(336px); }
    .slider__pagination[data-index="7"]:after {
      -ms-transform: translateX(392px);
      transform: translateX(392px); }
    .slider__pagination[data-index="8"]:after {
      -ms-transform: translateX(448px);
      transform: translateX(448px); }
    .slider__pagination[data-index="9"]:after {
      -ms-transform: translateX(504px);
      transform: translateX(504px); }
    .slider__pagination[data-index="10"]:after {
      -ms-transform: translateX(560px);
      transform: translateX(560px); }
  .slider--imac .slider__bg {
    position: absolute;
    top: -7%;
    left: -30%;
    z-index: 1;
    width: 160%;
    height: 158%;
    z-index: 1;
    background-image: url("../images/imac.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: 50%; }
  .slider--imac .slider__frame {
    max-width: 80vw;
    margin: 0 auto; }
  .slider--imac .slider__slide {
    padding: 0 7%; }
    .slider--imac .slider__slide img {
      margin: 0 auto;
      max-height: 45vh; }
  @media all and (min-width: 768px) {
    .slider__pagination {
      bottom: -40px; }
      .slider__pagination li {
        margin: 0 12px;
        width: 88px;
        height: 12px; }
      .slider__pagination:after {
        width: 88px;
        height: 12px; }
      .slider__pagination[data-index="1"]:after {
        -ms-transform: translateX(112px);
        transform: translateX(112px); }
      .slider__pagination[data-index="2"]:after {
        -ms-transform: translateX(224px);
        transform: translateX(224px); }
      .slider__pagination[data-index="3"]:after {
        -ms-transform: translateX(336px);
        transform: translateX(336px); }
      .slider__pagination[data-index="4"]:after {
        -ms-transform: translateX(448px);
        transform: translateX(448px); }
      .slider__pagination[data-index="5"]:after {
        -ms-transform: translateX(560px);
        transform: translateX(560px); }
      .slider__pagination[data-index="6"]:after {
        -ms-transform: translateX(672px);
        transform: translateX(672px); }
      .slider__pagination[data-index="7"]:after {
        -ms-transform: translateX(784px);
        transform: translateX(784px); }
      .slider__pagination[data-index="8"]:after {
        -ms-transform: translateX(896px);
        transform: translateX(896px); }
      .slider__pagination[data-index="9"]:after {
        -ms-transform: translateX(1008px);
        transform: translateX(1008px); }
      .slider__pagination[data-index="10"]:after {
        -ms-transform: translateX(1120px);
        transform: translateX(1120px); } }
  @media all and (min-width: 1200px) {
    .slider--imac .slider__frame {
      max-width: 60vw; } }
  @media all and (min-width: 1440px) {
    .slider__pagination {
      bottom: -56px; }
      .slider__pagination li {
        width: 144px; }
      .slider__pagination:after {
        width: 144px; }
      .slider__pagination[data-index="1"]:after {
        -ms-transform: translateX(168px);
        transform: translateX(168px); }
      .slider__pagination[data-index="2"]:after {
        -ms-transform: translateX(336px);
        transform: translateX(336px); }
      .slider__pagination[data-index="3"]:after {
        -ms-transform: translateX(504px);
        transform: translateX(504px); }
      .slider__pagination[data-index="4"]:after {
        -ms-transform: translateX(672px);
        transform: translateX(672px); }
      .slider__pagination[data-index="5"]:after {
        -ms-transform: translateX(840px);
        transform: translateX(840px); }
      .slider__pagination[data-index="6"]:after {
        -ms-transform: translateX(1008px);
        transform: translateX(1008px); }
      .slider__pagination[data-index="7"]:after {
        -ms-transform: translateX(1176px);
        transform: translateX(1176px); }
      .slider__pagination[data-index="8"]:after {
        -ms-transform: translateX(1344px);
        transform: translateX(1344px); }
      .slider__pagination[data-index="9"]:after {
        -ms-transform: translateX(1512px);
        transform: translateX(1512px); }
      .slider__pagination[data-index="10"]:after {
        -ms-transform: translateX(1680px);
        transform: translateX(1680px); } }

.prev {
  left: 0; }

.next svg, .prev svg {
  width: 25px; }

.video-box {
  position: fixed;
  width: 100%;
  height: 100vh;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.9);
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  visibility: hidden;
  opacity: 0;
  z-index: -1;
  -ms-transform: translateY(-50px);
  transform: translateY(-50px);
  transition: all .3s ease-in-out; }
  .video-box.visible {
    visibility: visible;
    opacity: 1;
    z-index: 999999;
    -ms-transform: translateY(0);
    transform: translateY(0); }
  .video-box .hamburger {
    position: fixed;
    color: #FFF;
    top: 40px; }
    @media all and (max-width: 767px) {
      .video-box .hamburger {
        top: 20px; } }
  .video-box .video-player {
    width: 80%;
    height: 80%; }
  .video-box iframe {
    width: 100%;
    height: 100%;
    margin: auto; }

.header {
  position: absolute;
  z-index: 999;
  top: 0;
  left: 0;
  width: 100%;
  position: fixed;
  height: 90px;
  max-height: 90px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-align: center;
  align-items: center;
  position: fixed;
  -ms-flex-pack: justify;
  justify-content: space-between;
  transition: all .3s ease-in-out; }
  .header__logo {
    width: 141px;
    height: 34px;
    margin: 0px 0 0 24px;
    color: #000000; }
    .header__logo a {
      display: block;
      width: 100%;
      height: 100%;
      text-indent: -9999px;
      background-image: url("../images/logo-black.svg");
      background-size: 100%;
      background-repeat: no-repeat; }
  .header__cmyk {
    position: absolute;
    top: 92px;
    right: 24px;
    width: 66px;
    pointer-events: none; }
    .header__cmyk path {
      fill: #000000;
      transition: all .3s ease-in-out; }
    .header__cmyk:hover path {
      fill: #ff7bac; }
  .header__overlay {
    position: fixed;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    top: 0;
    left: 0;
    background: rgba(255, 123, 172, 0.8);
    width: 100%;
    height: 100vh;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.7s 0.7s, visibility 0s 1.4s;
    transition-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1);
    text-align: center;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch; }
  .header__bg {
    display: none;
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 100%;
    background-size: cover;
    opacity: 0;
    transition: opacity 0.5s 0.5s; }
  .header__nav {
    color: #ffffff;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none; }
    .header__nav li {
      position: relative;
      margin: 24px 0;
      opacity: 0;
      transition: opacity 0.5s cubic-bezier(0.455, 0.03, 0, 1); }
      .header__nav li a {
        display: block; }
        .header__nav li a:after {
          content: '';
          display: block;
          position: absolute;
          top: 0.56em;
          left: 50%;
          margin-left: -100px;
          width: 200px;
          height: 2px;
          background-color: currentColor;
          transform: rotateY(90deg);
          opacity: 0;
          transition: opacity 0.3s cubic-bezier(0.455, 0.03, 0, 1), transform 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86); }
        .header__nav li a:hover:after {
          opacity: 1;
          transform: rotateY(0); }
      .header__nav li:nth-of-type(1) {
        transition-delay: 480ms; }
      .header__nav li:nth-of-type(2) {
        transition-delay: 400ms; }
      .header__nav li:nth-of-type(3) {
        transition-delay: 320ms; }
      .header__nav li:nth-of-type(4) {
        transition-delay: 240ms; }
      .header__nav li:nth-of-type(5) {
        transition-delay: 160ms; }
      .header__nav li:nth-of-type(6) {
        transition-delay: 80ms; }
      .header__nav li:nth-of-type(7) {
        transition-delay: 0ms; }
    .header__nav:after {
      content: '';
      display: inline-block;
      width: 66px;
      height: 16px;
      background: url("../images/cmyk.svg") no-repeat;
      background-size: contain;
      opacity: 0;
      transition: opacity 0.5s cubic-bezier(0.455, 0.03, 0, 1); }
  .header--opened .hamburger {
    position: fixed; }
  .header--opened .header__overlay {
    opacity: 1;
    visibility: visible;
    transition: opacity 0.7s; }
  .header--opened .header__bg {
    opacity: 0.1;
    transition: opacity 2.8s 0.4s cubic-bezier(0.39, 0.575, 0.565, 1); }
  .header--opened .header__nav li {
    opacity: 1;
    transition: opacity 1000ms cubic-bezier(0.6, -0.28, 0.735, 0.045); }
    .header--opened .header__nav li:nth-of-type(0) {
      transition-delay: 0ms; }
    .header--opened .header__nav li:nth-of-type(1) {
      transition-delay: 100ms; }
    .header--opened .header__nav li:nth-of-type(2) {
      transition-delay: 200ms; }
    .header--opened .header__nav li:nth-of-type(3) {
      transition-delay: 300ms; }
    .header--opened .header__nav li:nth-of-type(4) {
      transition-delay: 400ms; }
    .header--opened .header__nav li:nth-of-type(5) {
      transition-delay: 500ms; }
    .header--opened .header__nav li:nth-of-type(6) {
      transition-delay: 600ms; }
    .header--opened .header__nav li:nth-of-type(7) {
      transition-delay: 700ms; }
    .header--opened .header__nav li:nth-of-type(8) {
      transition-delay: 800ms; }
  .header--opened .header__nav:after {
    opacity: 1;
    transition: opacity 1s 1s cubic-bezier(0.6, -0.28, 0.735, 0.045); }
  .header--white, .page-template-page-about .header, .page-template-template-work .header, .page-template-page-contact .header, .error404 .header, .post-template-default .header:not(.scrolled), .page-template-page-home .header:not(.scrolled) {
    color: #ffffff; }
    .header--white .header__logo a, .page-template-page-about .header .header__logo a, .page-template-template-work .header .header__logo a, .page-template-page-contact .header .header__logo a, .error404 .header .header__logo a, .post-template-default .header:not(.scrolled) .header__logo a, .page-template-page-home .header:not(.scrolled) .header__logo a {
      background-image: url("../images/logo-white.svg"); }
    .header--white .header__cmyk path, .page-template-page-about .header .header__cmyk path, .page-template-template-work .header .header__cmyk path, .page-template-page-contact .header .header__cmyk path, .error404 .header .header__cmyk path, .post-template-default .header:not(.scrolled) .header__cmyk path, .page-template-page-home .header:not(.scrolled) .header__cmyk path {
      fill: #ffffff; }
    .header--white .header__cmyk:hover path, .page-template-page-about .header .header__cmyk:hover path, .page-template-template-work .header .header__cmyk:hover path, .page-template-page-contact .header .header__cmyk:hover path, .error404 .header .header__cmyk:hover path, .post-template-default .header:not(.scrolled) .header__cmyk:hover path, .page-template-page-home .header:not(.scrolled) .header__cmyk:hover path {
      fill: #ff7bac; }
  @media all and (min-width: 768px) {
    .header {
      height: 125px;
      max-height: 125px; }
      .header__logo {
        width: 188px;
        height: 45px;
        margin: 0px 0 0 56px; }
      .header__cmyk {
        top: 136px;
        right: 51px; }
      .header__nav li {
        margin: 48px 0; }
        .header__nav li a:after {
          width: 502px;
          height: 4px;
          margin-left: -251px; }
      .header__nav:after {
        width: 132px;
        height: 32px; } }

.footer {
  position: relative;
  z-index: 4;
  padding: 89px 0 95px 0;
  background: #000000;
  font-size: 0.8em;
  text-align: center;
  color: #ffffff; }
  .footer .footer__container {
    -ms-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 1;
    transition: all .3s ease-in-out; }
  .footer__nav {
    margin-bottom: 42px;
    text-align: center;
    color: #ffffff;
    line-height: 2.4; }
    .footer__nav li {
      display: block; }
      .footer__nav li a {
        display: inline-block; }
  .footer.inview .footer__container {
    -ms-transform: translateY(20px);
    transform: translateY(20px);
    opacity: 0; }
  .footer--services {
    padding-bottom: 160px; }
    @media all and (max-width: 767px) {
      .footer--services {
        padding-bottom: 80px; } }
  .page-template-template-contact .footer--main {
    display: none; }
  .footer__title {
    margin-bottom: 64px; }
  .footer__logo {
    display: block;
    width: 210px;
    margin: 0 auto 89px auto; }
    .footer__logo--black {
      display: none; }
  .footer__block {
    margin: 0 auto 48px auto;
    width: 306px; }
  .footer__subtitle {
    max-width: 200px;
    margin: 0 auto 1.3333333333em auto;
    text-align: center;
    padding-bottom: 0.5em;
    border-bottom: 0.125em solid; }
  .footer__social a {
    display: inline-block;
    margin: 0 0.5em;
    width: 2.5em;
    height: 2.5em;
    line-height: 2.27em;
    border-radius: 50%;
    color: inherit;
    border: 2px solid;
    text-align: center;
    vertical-align: top;
    font-size: 1em; }
    .footer__social a img {
      display: block; }
  .footer__subscribe {
    position: relative;
    margin-bottom: 2.25em;
    color: inherit;
    border-color: inherit; }
    .footer__subscribe input {
      display: block;
      width: 100%;
      padding-bottom: 0.4em;
      color: inherit;
      border-bottom: 0.1333333333em solid;
      border-color: inherit;
      caret-color: #ffffff; }
      .footer__subscribe input.placeholder {
        font: inherit;
        color: inherit; }
      .footer__subscribe input:-moz-placeholder {
        font: inherit;
        color: inherit; }
      .footer__subscribe input::-moz-placeholder {
        font: inherit;
        color: inherit; }
      .footer__subscribe input::-webkit-input-placeholder {
        font: inherit;
        color: inherit; }
    .footer__subscribe button {
      position: absolute;
      top: 0;
      right: 0;
      height: 100%;
      width: 32px;
      color: inherit;
      border-bottom: none;
      background: none;
      cursor: pointer; }
      .footer__subscribe button:after {
        display: inline-block;
        content: '';
        position: absolute;
        top: 0.7em;
        right: 0;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 4px 0 4px 7px;
        border-color: transparent transparent transparent currentColor; }
    .footer__subscribe .form-inputs {
      opacity: 1;
      visibility: visible;
      transition: all .2s ease;
      caret-color: #ffffff; }
      .footer__subscribe .form-inputs.hidden {
        opacity: 0;
        visibility: hidden; }
    .footer__subscribe #form-result {
      position: absolute;
      bottom: 8px; }
  .footer--contact {
    text-align: left;
    padding-top: 64px;
    margin-right: 20em; }
    .footer--contact .footer__block {
      margin: 0 auto 32px auto; }
    .footer--contact .footer__subtitle {
      margin: 0 auto .1em auto;
      padding-bottom: 0;
      border: none; }
      @media all and (max-width: 767px) {
        .footer--contact .footer__subtitle {
          text-align: left;
          margin-left: 0; } }
    .footer--contact .footer__social__link {
      line-height: 40px; }
      .footer--contact .footer__social__link span {
        display: inline-block; }
      .footer--contact .footer__social__link a {
        margin: 0;
        padding: 0;
        display: inline-block;
        height: auto;
        width: auto;
        text-decoration: underline;
        background: transparent; }
    .footer--contact .footer__social a {
      border: none; }
      .footer--contact .footer__social a:before {
        display: none; }
  .footer__copy {
    display: block; }
  .footer--white {
    background: #ffffff;
    color: #000000;
    border-color: #000000; }
    .footer--white .footer__logo {
      display: none; }
      .footer--white .footer__logo--black {
        display: block; }
  @media all and (min-width: 768px) {
    .footer {
      padding: 93px 0 30px 0; }
      .footer__nav--mobile {
        display: none; }
      .footer__container {
        max-width: 700px;
        margin-right: auto;
        margin-left: auto; }
      .footer__subtitle {
        max-width: none;
        text-align: left; }
      .footer__block {
        width: 306px; }
      .footer--main .footer__block {
        display: inline-block;
        vertical-align: top;
        margin: 0 20px 64px 20px;
        text-align: left; }
      .footer--contact {
        padding-top: 48px; }
        .footer--contact .footer__block {
          margin-bottom: 32px; }
      .footer__copy--mobile {
        display: none; } }
  @media all and (min-width: 1200px) {
    .footer__container {
      max-width: none; }
    .footer__block {
      display: inline-block;
      vertical-align: top;
      width: 16vw;
      margin: 0 30px 48px 30px;
      text-align: left; }
    .footer--main .footer__block {
      display: inline-block;
      vertical-align: top;
      margin: 0 40px 64px 40px; }
    .footer--contact .footer__container {
      max-width: 500px;
      text-align: left; }
    .footer--contact .footer__block {
      width: 383px;
      margin: 0 60px 32px 60px;
      text-align: left; } }
  @media all and (min-width: 1600px) {
    .footer__block {
      width: 211px; } }
  @media all and (max-width: 767px) {
    .footer__mobile-hidden {
      display: none; }
    .footer__container {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-direction: column;
      flex-direction: column; }
    .footer__block--social {
      -ms-flex-order: 1;
      order: 1;
      margin-bottom: 21px; }
    .footer__block--newsletter {
      margin-bottom: 35px; }
    .footer__copy--mobile {
      -ms-flex-order: 2;
      order: 2; } }

.homepage {
  width: 100%; }
  @media all and (max-width: 767px) {
    .homepage .homepage__header-background--mobile {
      display: block; }
      .homepage .homepage__header-background--mobile .homepage__header-logo {
        background-position: center;
        background-size: 50%; }
    .homepage .homepage__header-background--desktop {
      display: none; } }
  .homepage__header--placeholder {
    width: 100%;
    height: 100vh;
    position: relative; }
  .homepage__header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    height: 100vh;
    padding: 0 16px;
    text-align: center;
    color: #ffffff;
    position: fixed;
    z-index: -1;
    background-size: cover;
    background-position: 50%; }
    .homepage__header.logos .homepage__header-copy {
      display: none; }
    .homepage__header.copy .homepage__header-logo {
      display: none; }
    .homepage__header-background {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      opacity: 0;
      max-width: 100%;
      background-size: cover;
      background-position: 50%;
      z-index: 0;
      transition: opacity .3s ease-in-out; }
      .homepage__header-background.visible {
        opacity: 1; }
      .homepage__header-background--mobile {
        display: none; }
      .homepage__header-background--desktop {
        display: block; }
      .homepage__header-background .homepage__header-link {
        text-decoration: none;
        display: block;
        display: block; }
    .homepage__header:after {
      opacity: 0;
      transition: opacity .8s ease-in-out;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: #fff;
      content: '';
      display: block; }
    .homepage__header-logo {
      height: 100%;
      width: 100%;
      background-size: 20%;
      background-repeat: no-repeat;
      cursor: pointer;
      position: fixed; }
      .homepage__header-logo a {
        font-size: 40px;
        text-decoration: underline;
        cursor: pointer; }
      .homepage__header-logo.center {
        background-position: center; }
      .homepage__header-logo.center-bottom {
        background-position: center 85%; }
      .homepage__header-logo.center-top {
        background-position: center 50px; }
      .homepage__header-logo.center-left {
        width: 50%;
        background-size: 40%;
        background-position: center center; }
      .homepage__header-logo.center-right {
        width: 50%;
        background-size: 40%;
        float: right;
        -ms-transform: translateX(100%);
        transform: translateX(100%);
        background-position: center center; }
      .homepage__header-logo.top-right {
        background-position: 95% 5%; }
      .homepage__header-logo.top-left {
        background-position: 5% 5%; }
      .homepage__header-logo.bottom-right {
        background-position: 95% 85%; }
      .homepage__header-logo.bottom-left {
        background-position: 5% 85%; }
    .homepage__header h1 {
      font-size: 40px; }
    .homepage__header.not-loaded:after {
      opacity: 1; }
    .homepage__header > h1 {
      max-width: 532px;
      z-index: 1; }
  .homepage__arrow {
    margin-bottom: 11px;
    text-align: center; }
    .homepage__arrow div {
      display: inline-block; }
      .homepage__arrow div svg {
        display: block;
        width: 20px;
        -ms-transform: rotate(180deg);
        transform: rotate(180deg); }
  .homepage__cases {
    margin-top: -45px;
    background: #fff;
    padding: 24px;
    padding-top: 16px; }
    .homepage__cases .case:last-of-type {
      margin-bottom: 20px; }
  .homepage__viewall {
    width: 100%;
    height: 150px;
    padding-top: 55px;
    background: #f2f2f2;
    text-align: center; }
  @media all and (min-width: 768px) {
    .homepage__header {
      padding: 0 56px; }
    .homepage__arrow {
      margin-bottom: 24px; }
      .homepage__arrow a svg {
        width: 24px; }
    .homepage__cases {
      padding: 72px 56px;
      padding-top: 30px;
      margin-top: -72px; }
    .homepage__viewall {
      height: 160px;
      padding-top: 63px; } }

#header-link {
  color: black;
  font-size: 1px;
  z-index: 500;
  display: block;
  height: 80%;
  margin-top: 100px;
  width: 100%;
  position: absolute; }

.sb-work {
  margin-top: 152px; }
  .sb-work__cases {
    padding: 0 24px;
    margin-left: auto;
    margin-right: auto; }
  @media all and (min-width: 768px) {
    .sb-work {
      margin-top: 232px;
      margin-bottom: 120px; }
      .sb-work__cases {
        padding: 0 56px; } }
  @media all and (min-width: 1200px) {
    .sb-work {
      margin-top: 152px; }
      .sb-work__cases {
        max-width: 1274px; } }
  @media all and (min-width: 1440px) {
    .sb-work__cases {
      max-width: 1274px; } }

.about-us {
  background: #000000;
  padding: 208px 0 0 0;
  color: #ffffff; }
  .about-us * {
    opacity: 1;
    transition: opacity .8s ease-in-out; }
  .about-us.not-loaded * {
    opacity: 1; }
  .about-us .column {
    width: 50%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap; }
  .about-us .with-separator {
    border-bottom: 2px solid #3d3d3d;
    position: relative; }
    .about-us .with-separator:before, .about-us .with-separator:after {
      content: '';
      background-color: #000000;
      width: 100px;
      height: 10px;
      position: absolute;
      bottom: -5px; }
    .about-us .with-separator:before {
      left: 0; }
    .about-us .with-separator:after {
      right: 0; }
    @media all and (max-width: 767px) {
      .about-us .with-separator:before, .about-us .with-separator:after {
        width: 12%; } }
  .about-us__content {
    padding: 0 24px;
    text-align: center;
    padding-top: 10%; }
    .about-us__content > * {
      display: block;
      margin-left: auto;
      margin-right: auto; }
    .about-us__content h4 {
      margin-bottom: 64px;
      min-width: 150px;
      max-width: 666px; }
    .about-us__content p, .about-us__content li {
      font-family: "ClassGarmndBTWXX-Roman", serif;
      font-size: 0.9375em !important;
      letter-spacing: 0.02666666667em !important;
      line-height: 1.6 !important;
      max-width: 500px; }
    .about-us__content-copy {
      font-family: "ClassGarmndBTWXX-Roman", serif;
      font-size: 0.9375em !important;
      letter-spacing: 0.02666666667em !important;
      line-height: 1.6 !important; }
    .about-us__content--columns {
      text-align: left;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-direction: row;
      flex-direction: row;
      -ms-flex-pack: distribute;
      justify-content: space-around;
      padding-bottom: 10%;
      padding-left: 10%;
      padding-right: 10%; }
      .about-us__content--columns > * {
        display: block; }
      .about-us__content--columns h4 {
        margin: 0;
        width: 50%;
        max-width: none;
        text-align: left; }
      .about-us__content--columns h5 {
        font-size: 21px;
        line-height: 40px;
        font-weight: bold;
        margin: 0; }
      .about-us__content--columns p {
        margin: 0;
        width: 50%;
        max-width: none; }
      .about-us__content--columns ul {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        margin: 0;
        width: 50%;
        max-height: 300px; }
  .about-us__services .block, .about-us__press .block {
    margin-bottom: 40px; }
    .about-us__services .block a:hover h5, .about-us__services .block a:hover p, .about-us__press .block a:hover h5, .about-us__press .block a:hover p {
      color: #ff7bac; }
  @media all and (max-width: 767px) {
    .about-us--container {
      -ms-flex-direction: column;
      flex-direction: column;
      -ms-flex-align: center;
      align-items: center;
      padding-right: 12%;
      padding-left: 12%; }
      .about-us--container .column {
        width: 100%; }
      .about-us--container h4 {
        width: 100%;
        margin-bottom: 64px; }
      .about-us--container p {
        width: 100%; }
      .about-us--container ul {
        display: block;
        max-height: 2000px;
        width: 100%; } }
  @media all and (min-width: 1200px) {
    .about-us__content p {
      max-width: 666px; }
    .about-us__content--columns p {
      max-width: none; } }

.project__read-more .more {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  height: auto;
  transition: all .3s ease-in;
  margin: 0; }
.project__read-more--button {
  color: #ff7bac;
  text-decoration: underline;
  transition: all .3s ease;
  opacity: 1;
  cursor: pointer; }
.project__read-more.open .more {
  opacity: 1;
  max-height: 1000vh; }
.project__read-more.open .project__read-more--button {
  opacity: 0;
  cursor: default; }
.project__browse svg {
  display: inline-block;
  width: 24px;
  height: 14px; }
  .project__browse svg path {
    fill: #ff7bac; }
.project__browse span, .project__browse svg {
  display: inline-block;
  vertical-align: middle;
  line-height: 24px; }
.project__browse--top {
  display: block;
  position: relative;
  top: 0;
  width: 100px;
  margin: 35px auto;
  text-align: center; }
  .project__browse--top svg {
    position: absolute;
    left: 50%;
    margin-left: -12px; }
  .project__browse--top span {
    margin-top: 20px; }
.project__browse--back {
  left: -20px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  z-index: 2;
  -ms-flex-flow: column nowrap;
  flex-flow: column nowrap; }
  .project__browse--back span {
    text-align: center;
    margin: 0;
    width: 120px;
    display: block; }
  .project__browse--back .underline {
    height: 3px;
    background-color: #000000;
    border-radius: 5px;
    width: 120px; }
  @media all and (max-width: 1199px) {
    .project__browse--back {
      line-height: 56px;
      height: 100%;
      -ms-flex-flow: column nowrap;
      flex-flow: column nowrap; }
      .project__browse--back span {
        margin: 0;
        width: 120px; }
      .project__browse--back .underline {
        width: 120px; } }
.project__browse.related-projects {
  position: relative;
  width: 100%;
  height: 200px;
  text-align: center;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: column nowrap;
  flex-flow: column nowrap;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: start;
  align-items: flex-start;
  background-color: #f2f2f2;
  padding-left: 120px; }
  .project__browse.related-projects .h6, .project__browse.related-projects .content h6, .content .project__browse.related-projects h6 {
    margin-bottom: 20px;
    text-transform: none; }
  .project__browse.related-projects a {
    text-transform: uppercase;
    text-decoration: underline; }
    .project__browse.related-projects a:hover {
      color: #ff7bac; }
  @media all and (max-width: 1199px) {
    .project__browse.related-projects {
      padding-left: 20px; } }
.project__header {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 344px;
  max-height: 70vh; }
  .project__header:after {
    opacity: 0;
    transition: opacity .8s ease-in-out;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    content: '';
    display: block; }
  .project__header.not-loaded:after {
    opacity: 1; }
  .project__header-bg {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: 50% 50%; }
    @media all and (max-width: 767px) {
      .project__header-bg--desktop {
        display: none; } }
    .project__header-bg--mobile {
      display: none; }
      @media all and (max-width: 767px) {
        .project__header-bg--mobile {
          display: block; } }
    .project__header-bg img {
      max-width: 220px; }
.project__sections-nav {
  position: relative;
  width: 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin: 0 0 30px;
  left: 0; }
  @media all and (max-width: 767px) {
    .project__sections-nav {
      margin-bottom: 25.5px; } }
  @media all and (max-width: 1199px) {
    .project__sections-nav h1 {
      font-size: 23px; } }
  @media all and (max-width: 1199px) {
    .project__sections-nav {
      -ms-flex-direction: column-reverse;
      flex-direction: column-reverse; } }
  .project__sections-nav.project-01 {
    opacity: 1 !important; }
  .project__sections-nav.scrolled ul {
    position: fixed;
    right: 51px;
    top: 200px;
    z-index: 1; }
  .project__sections-nav ul {
    display: none;
    visibility: hidden;
    position: absolute;
    right: 0; }
    .project__sections-nav ul.project-01 {
      visibility: visible; }
    @media all and (max-width: 1199px) {
      .project__sections-nav ul {
        visibility: visible;
        margin-bottom: 20px;
        padding: 20px 0;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        overflow-x: auto;
        position: relative; } }
    @media all and (max-width: 767px) {
      .project__sections-nav ul {
        padding: 0; } }
  .project__sections-nav li {
    display: block;
    margin-bottom: 24px;
    text-align: right; }
    @media all and (max-width: 1199px) {
      .project__sections-nav li {
        -ms-flex: none;
        flex: none;
        display: -ms-flexbox;
        display: flex;
        width: auto; } }
    .project__sections-nav li:not(:last-of-type):after {
      display: none;
      margin: 0 0.33em;
      font-size: 1.5em;
      content: ''; }
      @media all and (max-width: 1199px) {
        .project__sections-nav li:not(:last-of-type):after {
          display: none; } }
      @media all and (max-width: 767px) {
        .project__sections-nav li:not(:last-of-type):after {
          line-height: 1.4; } }
  .project__sections-nav a {
    display: inline-block;
    position: relative;
    cursor: pointer;
    padding-bottom: 8px;
    letter-spacing: 0.1571428571em;
    font-size: 14px; }
    .project__sections-nav a:before {
      content: '';
      position: absolute;
      z-index: -1;
      top: calc(100% + 0.1em);
      left: 0.05em;
      width: 100%;
      height: 3px;
      background: #ff7bac;
      transform: scale3d(0, 1, 1);
      -ms-transform-origin: 100% 50%;
      transform-origin: 100% 50%;
      transition: transform 0.5s;
      transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1); }
    .project__sections-nav a:hover:before {
      transform: scale3d(1, 1, 1);
      -ms-transform-origin: 0% 50%;
      transform-origin: 0% 50%;
      transition-timing-function: ease; }
    .project__sections-nav a.current:before {
      transform: scale3d(1, 1, 1);
      -ms-transform-origin: 0% 50%;
      transform-origin: 0% 50%;
      transition-timing-function: ease; }
.project__info {
  position: relative;
  padding: 53px 24px 53px 24px; }
  .project__info.inview h5,
  .project__info.inview h6,
  .project__info.inview p,
  .project__info.inview img,
  .project__info.inview .project__sections-nav {
    opacity: 0; }
  .project__info h5,
  .project__info h6,
  .project__info p,
  .project__info img,
  .project__info .project__sections-nav {
    opacity: 1;
    transition: opacity .3s ease-in-out; }
  .project__info h5,
  .project__info h6,
  .project__info .project__sections-nav {
    transition-delay: .1s; }
  .project__info p {
    transition-delay: .2s; }
  .project__info img {
    transition-delay: .3s; }
  .project__info .content, .project__info .subtitle {
    max-width: 242px;
    margin-right: auto;
    margin-left: auto; }
  .project__info .subtitle {
    margin-bottom: 32px; }
  .project__info.project__info--introduction .content {
    max-width: 656px; }
    .project__info.project__info--introduction .content .content__custom {
      padding: 0; }
.project__imagery {
  background: #f2f2f2; }
.project__video {
  width: 100%;
  height: auto;
  position: relative; }
  .project__video--placeholder {
    display: none; }
    @media (max-width: 1023px) {
      .project__video--placeholder {
        display: block; } }
  .project__video--loop {
    display: block; }
    @media (max-width: 1023px) {
      .project__video--loop {
        display: none; } }
  .project__video--button {
    position: absolute;
    display: block;
    background-color: transparent;
    border-radius: 50%;
    border: 4px solid #fff;
    transition: all .2s ease-in-out;
    cursor: pointer;
    top: 0vh;
    opacity: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0 auto;
    width: 100vh;
    max-height: 100vh; }
    @media (pointer: coarse), (max-width: 1023px) {
      .project__video--button {
        width: 64px;
        height: 64px;
        max-height: 64px;
        opacity: 1;
        top: calc(50%);
        margin-top: -32px; } }
    .project__video--button:before {
      content: '';
      display: block;
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      opacity: 0;
      transition: opacity .2s ease-in;
      transition-delay: .4s;
      background-size: 128px;
      background-position: center;
      background-repeat: no-repeat;
      background-image: url("../images/play.png"); }
      @media (pointer: coarse), (max-width: 1023px) {
        .project__video--button:before {
          background-size: 64px;
          opacity: 1; } }
    .project__video--button:after {
      content: 'Watch the full video';
      color: white;
      position: absolute;
      bottom: -45px;
      left: 50%;
      width: 200px;
      text-align: center;
      margin: 0 auto;
      margin-left: -100px;
      opacity: 0;
      transition: opacity 0.2s 0.2s ease-in; }
      @media (max-width: 1023px) {
        .project__video--button:after {
          display: none; } }
  .project__video.project__video--vimeo:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    background-color: #000;
    transition: opacity .2s ease-in-out;
    transition-delay: 0s; }
    @media all and (max-width: 1199px) {
      .project__video.project__video--vimeo:before {
        opacity: 0.5 !important; } }
  .project__video:hover:before {
    transition-delay: .1s;
    opacity: 0.8; }
  .project__video:hover .project__video--button {
    opacity: 1;
    width: 128px;
    max-height: 128px;
    top: 50%;
    margin-top: -64px; }
    @media (pointer: coarse), (max-width: 1023px) {
      .project__video:hover .project__video--button {
        width: 64px;
        max-height: 64px;
        top: 50%;
        margin-top: -32px; } }
    .project__video:hover .project__video--button:before {
      opacity: 1;
      transition-delay: 0s; }
    .project__video:hover .project__video--button:after {
      opacity: 1; }
  .project__video video {
    width: 100%;
    height: auto; }
.project__video {
  transition: opacity .3s ease-in-out;
  transition-delay: .2s;
  opacity: 1; }
  .project__video.inview {
    opacity: 0; }
  .project__video--full {
    padding: 0; }
  .project__video img {
    width: 100%; }
.project__image {
  transition: opacity .3s ease-in-out;
  transition-delay: .2s;
  opacity: 1; }
  .project__image.inview {
    opacity: 0; }
  .project__image--regular {
    padding: 0 40px 32px 40px; }
    .project__image--regular:first-of-type {
      padding-top: 56px; }
    .project__image--regular:last-of-type {
      padding-bottom: 56px; }
  .project__image--medium {
    padding: 0 24px 24px 24px; }
    .project__image--medium:first-of-type {
      padding-top: 24px; }
    .project__image--medium:last-of-type {
      padding-bottom: 24px; }
  .project__image--full {
    padding: 0; }
  .project__image img {
    display: block;
    width: 100%; }
.project__slider {
  position: relative;
  z-index: 1;
  max-height: calc(100vh + 56px);
  overflow: hidden;
  padding: 88px 56px 20% 56px;
  background: #f2f2f2;
  transition: opacity .3s ease-in-out;
  transition-delay: .2s;
  opacity: 1; }
  .project__slider.inview {
    opacity: 0; }
  .project__slider .slider {
    max-width: 70vw;
    margin: 0 auto 115px auto; }
.project__carousel {
  background: #f2f2f2;
  overflow: hidden; }
  .project__carousel .carousel__image--desktop {
    display: none; }
  .project__carousel .slick-dots {
    margin: 0 0 24px 24px; }
    .project__carousel .slick-dots li {
      display: inline-block;
      border-radius: 50%;
      margin: 0 1px;
      padding: 7px;
      cursor: pointer; }
      .project__carousel .slick-dots li button {
        text-indent: -9999px;
        width: 9px;
        height: 9px;
        border: 1px solid black;
        border-radius: 50%; }
      .project__carousel .slick-dots li:first-of-type {
        margin-left: 0; }
      .project__carousel .slick-dots li:last-of-type {
        margin-right: 0; }
      .project__carousel .slick-dots li.slick-active button {
        background: black; }
  .project__carousel--image .carousel__image {
    padding: 32px 40px; }
  .project__carousel--image .slick-dots {
    width: 100%;
    text-align: center;
    margin: 0 0 30px 0; }
    .project__carousel--image .slick-dots li button {
      border: 1px solid #ff7bac; }
    .project__carousel--image .slick-dots li.slick-active button {
      background: #ff7bac; }
.project .content__custom {
  padding: 24px;
  margin: 0 auto;
  max-width: 656px; }
  .project .content__custom h1, .project .content__custom h2, .project .content__custom h3 {
    font-family: 'HelveticaNeueLTPro-Bd';
    letter-spacing: 0; }
  .project .content__custom h1 {
    margin-bottom: 37px;
    font-size: 42px;
    line-height: 0.92; }
  .project .content__custom h2 {
    margin-top: 0.1em;
    margin-bottom: 0.25em;
    font-size: 28px;
    line-height: 0.92; }
  .project .content__custom p {
    margin-bottom: 40px;
    max-width: 36em; }
@media all and (min-width: 768px) {
  .project__header {
    height: 432px; }
    .project__header-bg img {
      max-width: 320px; }
  .project__info {
    padding: 50px 56px 70px 56px; }
    .project__info .subtitle {
      margin: 0;
      position: absolute; }
    .project__info .content {
      max-width: 463px;
      margin: 0 0 0 194px; }
  .project__carousel .carousel__content {
    padding: 0; }
  .project__carousel .slick-dots {
    text-align: center;
    margin: 50px auto; }
  .project__carousel--image .carousel__image {
    padding: 56px; }
  .project__carousel--image .slick-dots {
    position: absolute;
    margin: 0;
    bottom: 11px;
    left: 0; }
  .project__image--regular, .project__image--medium {
    padding: 0 56px 56px 56px; }
    .project__image--regular:first-of-type, .project__image--medium:first-of-type {
      padding-top: 56px; }
    .project__image--regular:last-of-type, .project__image--medium:last-of-type {
      padding-bottom: 56px; }
  .project__slider {
    padding-top: 112px; }
    .project__slider .slider {
      margin: 0 auto 137px auto; }
  .project .content__custom h1 {
    font-size: 70px; } }
@media all and (min-width: 992px) {
  .project__video--text .content {
    position: absolute;
    top: 0;
    left: 56%;
    width: 35%;
    height: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center; } }
@media all and (min-width: 1200px) {
  .project__browse {
    display: block;
    position: fixed;
    z-index: 1;
    top: 50%; }
    .project__browse--back {
      -ms-transform: rotate(-90deg) translateX(50%);
      transform: rotate(-90deg) translateX(50%); }
    .project__browse--mobile {
      display: none; }
    .project__browse-preview {
      z-index: 1;
      -ms-transform: translateX(-100%);
      transform: translateX(-100%);
      display: -ms-flexbox;
      display: flex;
      -ms-flex-align: center;
      align-items: center;
      position: absolute;
      top: -108px;
      left: 127px;
      width: 240px;
      height: 80px;
      background: white;
      box-shadow: 0px 15px 33px 0px rgba(0, 0, 0, 0.1);
      -ms-transform: rotate(90deg) translateX(-100%);
      transform: rotate(90deg) translateX(-100%);
      -ms-transform-origin: bottom left;
      transform-origin: bottom left;
      opacity: 0;
      transition: opacity 150ms ease-out, transform 100ms ease-out; }
      .project__browse-preview span {
        text-align: center;
        line-height: 1.5;
        max-width: 120px;
        display: inline-block;
        margin: 0; }
      .project__browse-preview div {
        -ms-flex-order: -1;
        order: -1;
        margin-right: 20px;
        width: 104px;
        height: 65px;
        background-size: cover;
        background-position: 50%; }
    .project__browse:hover .project__browse-preview {
      opacity: 1;
      -ms-transform: rotate(90deg) translateX(0%);
      transform: rotate(90deg) translateX(0%); }
    .project__browse--top {
      position: relative; }
    .project__browse--prev {
      left: 20px;
      -ms-transform: rotate(-90deg);
      transform: rotate(-90deg);
      -ms-transform-origin: top left;
      transform-origin: top left; }
      .project__browse--prev > span {
        margin-right: 40px; }
    .project__browse--next {
      right: 24px;
      -ms-transform: rotate(90deg);
      transform: rotate(90deg);
      -ms-transform-origin: top right;
      transform-origin: top right; }
      .project__browse--next svg {
        margin-right: 40px; }
      .project__browse--next .project__browse-preview {
        -ms-flex-pack: end;
        justify-content: flex-end;
        left: -212px;
        -ms-transform: rotate(-90deg) translateX(100%);
        transform: rotate(-90deg) translateX(100%);
        -ms-transform-origin: bottom right;
        transform-origin: bottom right; }
        .project__browse--next .project__browse-preview div {
          -ms-flex-order: 2;
          order: 2;
          margin: 0 0 0 20px; }
      .project__browse--next:hover .project__browse-preview {
        opacity: 1;
        -ms-transform: rotate(-90deg) translateX(0%);
        transform: rotate(-90deg) translateX(0%); }
  .project__info {
    max-width: 1812px;
    margin-right: 51px;
    margin-left: auto;
    padding: 120px 0 120px 120px; }
    .project__info.project__info--introduction .content {
      margin: 0;
      max-width: 538px; }
    .project__info .content {
      margin: 0 auto;
      max-width: 423px; }
  .project__carousel .carousel__content {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    padding-left: 96px;
    padding-top: 60px;
    margin: 0; }
  .project__carousel .carousel__image--mobile {
    display: none; }
  .project__carousel .carousel__image--desktop {
    display: block; }
  .project__carousel .carousel__slide {
    position: relative; }
  .project__carousel .slick-dots {
    position: absolute;
    margin: 0;
    left: 120px;
    bottom: 45px;
    text-align: left; }
  .project__carousel--image .carousel__image {
    padding: 120px; }
  .project__carousel--image .slick-dots {
    position: absolute;
    left: 0;
    text-align: center; }
  .project__image--regular {
    max-width: 1812px;
    margin: 0 auto;
    padding: 0 120px 120px 120px; }
    .project__image--regular:first-of-type {
      padding-top: 120px; }
    .project__image--regular:last-of-type {
      padding-bottom: 120px; } }
@media all and (min-width: 1440px) {
  .project__header {
    height: 664px; }
    .project__header-bg img {
      max-width: 660px; }
  .project__browse--prev {
    left: 28px; }
  .project__browse--next {
    right: 28px; }
  .project .content__custom h1 {
    font-size: 85px; }
  .project__carousel .carousel__content {
    height: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    padding-top: 0; } }
@media all and (max-width: 1199px) {
  .project__browse svg {
    width: 22px; }
  .project__browse--desktop {
    display: none; }
  .project__browser {
    width: 100%;
    height: 60px;
    background: #f2f2f2;
    padding: 0 10px; }
    .project__browser .project__browse {
      line-height: 56px; }
      .project__browser .project__browse span {
        margin: 0 5px; }
      .project__browser .project__browse--mobile {
        display: inline-block; }
      .project__browser .project__browse--prev {
        float: left; }
        .project__browser .project__browse--prev svg {
          -ms-transform: rotate(-90deg);
          transform: rotate(-90deg); }
      .project__browser .project__browse--next {
        float: right; }
        .project__browser .project__browse--next svg {
          -ms-transform: rotate(90deg);
          transform: rotate(90deg); } }

#projects ~ .header {
  color: #000000; }
  #projects ~ .header .header__logo a {
    background-image: url("../images/logo-black.svg") !important; }
  #projects ~ .header .header__cmyk path {
    fill: #000000; }

.projects {
  margin-top: 152px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: column nowrap;
  flex-flow: column nowrap;
  -ms-flex-align: center;
  align-items: center; }
  .projects__content {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    margin: 0 auto;
    max-width: 1274px;
    padding-top: 10%;
    padding-bottom: 10%; }
    .projects__content h1 {
      width: 50%;
      font-weight: bold;
      padding-left: 20px; }
    .projects__content-description {
      width: 50%;
      padding-left: 20px; }
      .projects__content-description p {
        margin-bottom: 20px; }
  .projects .sb-work__cases {
    padding: 0; }
  @media all and (max-width: 767px) {
    .projects__content {
      -ms-flex-flow: column nowrap;
      flex-flow: column nowrap;
      padding: 20% 24px; }
      .projects__content h1 {
        margin-bottom: 64px; }
      .projects__content p {
        width: 100%; }
      .projects__content-description {
        width: 100%; }
    .projects .sb-work__cases {
      padding: 0 24px; } }

.contact-us {
  background: #000000;
  color: #ffffff;
  text-align: center;
  padding-top: 208px;
  padding-bottom: 208px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: row nowrap;
  flex-flow: row nowrap;
  -ms-flex-pack: justify;
  justify-content: space-between; }
  .contact-us p, .contact-us span, .contact-us a {
    font-size: 15px; }
  .contact-us a, .contact-us input {
    line-height: 40px;
    display: inline-block; }
  .contact-us a:hover {
    color: #ff7bac; }
  @media all and (max-width: 767px) {
    .contact-us {
      -ms-flex-flow: column nowrap;
      flex-flow: column nowrap;
      padding-left: 4em; }
      .contact-us form {
        padding-right: 20px; }
        .contact-us form button {
          right: 20px; } }
  .contact-us__heading {
    padding-top: 48px; }
    @media all and (max-width: 767px) {
      .contact-us__heading {
        text-align: left;
        padding-top: 0; } }
    @media all and (min-width: 1200px) {
      .contact-us__heading {
        padding-left: 10em; } }
  .contact-us__content * {
    opacity: 1;
    transition: opacity .8s ease-in-out; }
  .contact-us__content.not-loaded * {
    opacity: 1; }

._404 {
  width: 100%;
  min-height: 100vh;
  padding-top: 120px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
  -ms-flex-direction: column;
  flex-direction: column;
  color: #ffffff;
  background: #000000; }
  ._404__heading {
    margin-bottom: 24px; }
  ._404__info {
    margin-bottom: 48px;
    max-width: 650px;
    line-height: 1.5; }
  @media all and (min-width: 768px) {
    ._404__heading {
      margin-bottom: 48px; }
    ._404__info {
      margin-bottom: 80px; } }



/*# sourceMappingURL=main.css.map */