/* @import must be at top of file, otherwise CSS will not work */
@import url("//hello.myfonts.net/count/323dcb");
@font-face {
  font-family: 'BrandonTextWeb-Bold';
  src: url("../webfonts/323DCB_1_0.eot");
  src: url("../webfonts/323DCB_1_0.eot?#iefix") format("embedded-opentype"), url("../webfonts/323DCB_1_0.woff2") format("woff2"), url("../webfonts/323DCB_1_0.woff") format("woff"), url("../webfonts/323DCB_1_0.ttf") format("truetype"); }
@font-face {
  font-family: 'BrandonTextWeb-Medium';
  src: url("../webfonts/3292F4_0_0.eot");
  src: url("../webfonts/3292F4_0_0.eot?#iefix") format("embedded-opentype"), url("../webfonts/3292F4_0_0.woff2") format("woff2"), url("../webfonts/3292F4_0_0.woff") format("woff"), url("../webfonts/3292F4_0_0.ttf") format("truetype"); }
@font-face {
  font-family: 'BrandonTextWeb-Regular';
  src: url("../webfonts/323DCB_2_0.eot");
  src: url("../webfonts/323DCB_2_0.eot?#iefix") format("embedded-opentype"), url("../webfonts/323DCB_2_0.woff2") format("woff2"), url("../webfonts/323DCB_2_0.woff") format("woff"), url("../webfonts/323DCB_2_0.ttf") format("truetype"); }
.full-screen {
  width: 100%;
  height: 100vh; }

.viewport-full-size {
  width: 100vw;
  height: 100vh; }

.full-width {
  width: 100%; }

.pos-a {
  position: absolute; }

.pos-a-center {
  position: absolute;
  left: 50%;
  top: 50%; }

.pos-a-t-l {
  position: absolute;
  top: 0;
  left: 0; }

.pos-a-b-l {
  position: absolute;
  bottom: 0;
  left: 0; }

.pos-a-t-r {
  position: absolute;
  top: 0;
  right: 0; }

.pos-a-b-r {
  position: absolute;
  bottom: 0;
  right: 0; }

.pos-f-t-l {
  position: fixed;
  top: 0;
  left: 0; }

.pos-f {
  position: fixed; }

.pos-f-bottom {
  position: fixed;
  bottom: 0;
  left: 0; }

.pc-b::before {
  content: ""; }

.pc-a::after {
  content: ""; }

.center-l-t {
  position: absolute;
  left: 50%;
  top: 50%; }

.flex-vert-center {
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  box-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -ms-justify-content: center;
  -o-justify-content: center;
  justify-content: center;
  -ms-flex-pack: center;
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  box-orient: vertical;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  flex-direction: column;
  -ms-flex-direction: column;
  margin-top: -0.5%; }

.flex-vert {
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  box-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -ms-justify-content: center;
  -o-justify-content: center;
  justify-content: center;
  -ms-flex-pack: center;
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  box-orient: vertical;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  flex-direction: column;
  -ms-flex-direction: column; }
  .flex-vert > * {
    height: 100%; }

.flex-horiz {
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  box-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -ms-justify-content: center;
  -o-justify-content: center;
  justify-content: center;
  -ms-flex-pack: center;
  -webkit-box-orient: horizontal;
  -moz-box-orient: horizontal;
  box-orient: horizontal;
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  flex-direction: row;
  -ms-flex-direction: row; }
  .flex-horiz > * {
    width: 100%; }

.mob-only {
  display: none; }
  @media only screen and (max-width: 700px) {
    .mob-only {
      display: block; } }

.desktop-only {
  display: block; }
  @media only screen and (max-width: 700px) {
    .desktop-only {
      display: none; } }

body {
  overflow: hidden; }

.page-transition-base {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden; }

.main-nav, .edge-nav {
  z-index: 999; }
  .main-nav li, .edge-nav li {
    z-index: 10; }

.main-nav {
  width: 100%;
  position: fixed;
  top: 45px; }
  @media screen and (max-width: 700px) {
    .main-nav {
      top: 30px; } }
  body[data-experience-active="active"] .main-nav, body[data-philosophy-photos-active="active"] .main-nav {
    pointer-events: none; }
  .main-nav > ul {
    display: -webkit-box;
    display: -moz-box;
    display: box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    box-pack: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    -o-justify-content: center;
    justify-content: center;
    -ms-flex-pack: center;
    -webkit-box-orient: horizontal;
    -moz-box-orient: horizontal;
    box-orient: horizontal;
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    flex-direction: row;
    -ms-flex-direction: row; }
    .main-nav > ul > li {
      margin: 0 40px;
      -webkit-transform: translateY(0px);
      -moz-transform: translateY(0px);
      -ms-transform: translateY(0px);
      -o-transform: translateY(0px);
      transform: translateY(0px); }
      @media screen and (max-width: 700px) {
        .main-nav > ul > li {
          margin: 0 15px; } }
      .main-nav > ul > li:nth-child(1) {
        -webkit-transition: 0.95s cubic-bezier(0.52, 0.01, 0.16, 1) 0.3s;
        -moz-transition: 0.95s cubic-bezier(0.52, 0.01, 0.16, 1) 0.3s;
        transition: 0.95s cubic-bezier(0.52, 0.01, 0.16, 1) 0.3s; }
      .main-nav > ul > li:nth-child(2) {
        -webkit-transition: 0.95s cubic-bezier(0.52, 0.01, 0.16, 1) 0.48s;
        -moz-transition: 0.95s cubic-bezier(0.52, 0.01, 0.16, 1) 0.48s;
        transition: 0.95s cubic-bezier(0.52, 0.01, 0.16, 1) 0.48s; }
      .main-nav > ul > li:nth-child(3) {
        -webkit-transition: 0.95s cubic-bezier(0.52, 0.01, 0.16, 1) 0.66s;
        -moz-transition: 0.95s cubic-bezier(0.52, 0.01, 0.16, 1) 0.66s;
        transition: 0.95s cubic-bezier(0.52, 0.01, 0.16, 1) 0.66s; }
      .main-nav > ul > li:nth-child(4) {
        -webkit-transition: 0.95s cubic-bezier(0.52, 0.01, 0.16, 1) 0.84s;
        -moz-transition: 0.95s cubic-bezier(0.52, 0.01, 0.16, 1) 0.84s;
        transition: 0.95s cubic-bezier(0.52, 0.01, 0.16, 1) 0.84s; }
      .main-nav > ul > li:nth-child(5) {
        -webkit-transition: 0.95s cubic-bezier(0.52, 0.01, 0.16, 1) 1.02s;
        -moz-transition: 0.95s cubic-bezier(0.52, 0.01, 0.16, 1) 1.02s;
        transition: 0.95s cubic-bezier(0.52, 0.01, 0.16, 1) 1.02s; }
  .main-nav a {
    text-align: center;
    font-size: 11px;
    color: #176cdc;
    padding: 15px 0; }
    @media screen and (min-width: 1600px) {
      .main-nav a {
        font-size: 13px; } }
    .main-nav a::after {
      background-color: #176cdc; }
    .main-nav a::before, .main-nav a::after {
      bottom: 10px; }
  body[data-page="home"] .main-nav .page-home {
    pointer-events: none; }
    body[data-page="home"] .main-nav .page-home::after {
      -webkit-transform: scaleX(1);
      -moz-transform: scaleX(1);
      -ms-transform: scaleX(1);
      -o-transform: scaleX(1);
      transform: scaleX(1); }
  body[data-page="work"] .main-nav .page-work {
    pointer-events: none; }
    body[data-page="work"] .main-nav .page-work::after {
      -webkit-transform: scaleX(1);
      -moz-transform: scaleX(1);
      -ms-transform: scaleX(1);
      -o-transform: scaleX(1);
      transform: scaleX(1); }
  body[data-page="philosophy"] .main-nav .page-philosophy {
    pointer-events: none; }
    body[data-page="philosophy"] .main-nav .page-philosophy::after {
      -webkit-transform: scaleX(1);
      -moz-transform: scaleX(1);
      -ms-transform: scaleX(1);
      -o-transform: scaleX(1);
      transform: scaleX(1); }

.edge-nav-item-wrap {
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%); }

.edge-nav-logo {
  -webkit-transform: translateX(3.5vw);
  -moz-transform: translateX(3.5vw);
  -ms-transform: translateX(3.5vw);
  -o-transform: translateX(3.5vw);
  transform: translateX(3.5vw); }
  @media screen and (max-width: 700px) {
    .edge-nav-logo {
      -webkit-transform: translateX(7vw);
      -moz-transform: translateX(7vw);
      -ms-transform: translateX(7vw);
      -o-transform: translateX(7vw);
      transform: translateX(7vw); } }
  .edge-nav-logo a {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(-90deg);
    color: rgba(255, 255, 255, 0);
    background: url(../img/svg/abr_logo.svg) no-repeat center center/100%; }

.edge-nav-time {
  -webkit-transform: translateX(96.5vw);
  -moz-transform: translateX(96.5vw);
  -ms-transform: translateX(96.5vw);
  -o-transform: translateX(96.5vw);
  transform: translateX(96.5vw); }
  @media screen and (max-width: 700px) {
    .edge-nav-time {
      -webkit-transform: translateX(93vw);
      -moz-transform: translateX(93vw);
      -ms-transform: translateX(93vw);
      -o-transform: translateX(93vw);
      transform: translateX(93vw); } }
  .edge-nav-time a {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
    padding-left: 25px; }
    .edge-nav-time a::before {
      content: '';
      position: absolute;
      top: -2px;
      left: 0;
      width: 16px;
      height: 16px;
      background: url(../img/svg/globe.svg) no-repeat center center/100%; }

@media screen and (min-width: 1600px) {
  .edge-nav-item-wrap a {
    font-size: 17px; } }

.edge-nav {
  -webkit-transition: 0.35s 0.85s;
  -moz-transition: 0.35s 0.85s;
  transition: 0.35s 0.85s; }
  .edge-nav li {
    position: fixed;
    top: 50%;
    margin-top: -10px;
    left: 0;
    -webkit-transition: 1.25s cubic-bezier(0.52, 0.01, 0.16, 1);
    -moz-transition: 1.25s cubic-bezier(0.52, 0.01, 0.16, 1);
    transition: 1.25s cubic-bezier(0.52, 0.01, 0.16, 1); }
    .edge-nav li a {
      white-space: nowrap; }
  body[data-page="work"] .edge-nav .edge-nav-time {
    -webkit-transform: translateX(106.5vw);
    -moz-transform: translateX(106.5vw);
    -ms-transform: translateX(106.5vw);
    -o-transform: translateX(106.5vw);
    transform: translateX(106.5vw);
    pointer-events: none; }
  body[data-page="work"] .edge-nav .edge-nav-logo {
    -webkit-transform: translateX(96.5vw);
    -moz-transform: translateX(96.5vw);
    -ms-transform: translateX(96.5vw);
    -o-transform: translateX(96.5vw);
    transform: translateX(96.5vw); }
    @media screen and (max-width: 700px) {
      body[data-page="work"] .edge-nav .edge-nav-logo {
        -webkit-transform: translateX(106.5vw);
        -moz-transform: translateX(106.5vw);
        -ms-transform: translateX(106.5vw);
        -o-transform: translateX(106.5vw);
        transform: translateX(106.5vw); } }
  body[data-page="project"] .edge-nav .edge-nav-time {
    -webkit-transform: translateX(106.5vw);
    -moz-transform: translateX(106.5vw);
    -ms-transform: translateX(106.5vw);
    -o-transform: translateX(106.5vw);
    transform: translateX(106.5vw); }
  body[data-page="project"] .edge-nav .edge-nav-logo {
    -webkit-transform: translateX(106.5vw);
    -moz-transform: translateX(106.5vw);
    -ms-transform: translateX(106.5vw);
    -o-transform: translateX(106.5vw);
    transform: translateX(106.5vw); }
  body[data-page="philosophy"] .edge-nav .edge-nav-time {
    -webkit-transform: translateX(3.5vw);
    -moz-transform: translateX(3.5vw);
    -ms-transform: translateX(3.5vw);
    -o-transform: translateX(3.5vw);
    transform: translateX(3.5vw); }
    @media screen and (max-width: 700px) {
      body[data-page="philosophy"] .edge-nav .edge-nav-time {
        -webkit-transform: translateX(-6.5vw);
        -moz-transform: translateX(-6.5vw);
        -ms-transform: translateX(-6.5vw);
        -o-transform: translateX(-6.5vw);
        transform: translateX(-6.5vw); } }
  body[data-page="philosophy"] .edge-nav .edge-nav-logo {
    -webkit-transform: translateX(-6.5vw);
    -moz-transform: translateX(-6.5vw);
    -ms-transform: translateX(-6.5vw);
    -o-transform: translateX(-6.5vw);
    transform: translateX(-6.5vw);
    pointer-events: none; }
  body[data-philosophy-photos-active="active"][data-page="philosophy"] .edge-nav .edge-nav-time {
    -webkit-transform: translateX(-7vw);
    -moz-transform: translateX(-7vw);
    -ms-transform: translateX(-7vw);
    -o-transform: translateX(-7vw);
    transform: translateX(-7vw); }

.site-bg-gradient-wrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }

.project-slide {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-transform: translateX(-102%);
  -moz-transform: translateX(-102%);
  -ms-transform: translateX(-102%);
  -o-transform: translateX(-102%);
  transform: translateX(-102%);
  -webkit-transition: 1.05s cubic-bezier(0.52, 0.01, 0.16, 1);
  -moz-transition: 1.05s cubic-bezier(0.52, 0.01, 0.16, 1);
  transition: 1.05s cubic-bezier(0.52, 0.01, 0.16, 1);
  background-color: #FFF; }

body[data-page="project"] .project-slide {
  -webkit-transform: translateX(0%);
  -moz-transform: translateX(0%);
  -ms-transform: translateX(0%);
  -o-transform: translateX(0%);
  transform: translateX(0%); }

.site-bg-gradient {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0%;
  width: 300%;
  height: 100%;
  -webkit-transform: translateZ(0) scale(1, 1) translateX(0%);
  -moz-transform: translateZ(0) scale(1, 1) translateX(0%);
  -ms-transform: translateZ(0) scale(1, 1) translateX(0%);
  -o-transform: translateZ(0) scale(1, 1) translateX(0%);
  transform: translateZ(0) scale(1, 1) translateX(0%);
  -webkit-backface-visibilty: hidden; }

.site-bg-gradient-fill {
  opacity: 0;
  -webkit-transition: 1.7s cubic-bezier(0.5, 0.5, 0, 1);
  -moz-transition: 1.7s cubic-bezier(0.5, 0.5, 0, 1);
  transition: 1.7s cubic-bezier(0.5, 0.5, 0, 1);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }

.site-bg-gradient-7am-10am {
  background-image: linear-gradient(150deg, #ffd194 0%, #ffd194 35%, #8fdddf 70%, #70e1f5 100%); }

.site-bg-gradient-10am-4pm {
  background-image: linear-gradient(150deg, #5ad6ff 0%, #44c3f4 35%, #0075d9 70%, #0067f2 100%); }

.site-bg-gradient-4pm-8pm {
  background-image: linear-gradient(150deg, #2b519e 0%, #6239c4 35%, #bb4d9d 70%, #db558c 87%); }

.site-bg-gradient-8pm-5am {
  background-image: linear-gradient(150deg, #160a2b 0%, #190c30 35%, #331d5b 70%, #331d5c 100%); }

.site-bg-gradient-5am-7am {
  background-image: linear-gradient(150deg, #b4b5fb 0%, #c0baec 35%, #efccb3 70%, #fed1a2 100%); }

body[data-time="7am-10am"] .site-bg-gradient-7am-10am {
  opacity: 1; }
body[data-time="7am-10am"] .sun-ball {
  background-color: #fab066; }
body[data-time="7am-10am"] .page-content-wrap {
  color: #2431f5; }
  body[data-time="7am-10am"] .page-content-wrap .line-through::after, body[data-time="7am-10am"] .page-content-wrap .underline-perm::after {
    background-color: #2431f5; }

body[data-time="10am-4pm"] .site-bg-gradient-10am-4pm {
  opacity: 1; }
body[data-time="10am-4pm"] .sun-ball {
  background-color: #fac466; }
body[data-time="10am-4pm"] .main-nav a {
  color: #231184; }
  body[data-time="10am-4pm"] .main-nav a::after {
    background-color: #231184; }
body[data-time="10am-4pm"] .page-content-wrap {
  color: #231184; }
  body[data-time="10am-4pm"] .page-content-wrap .line-through::after, body[data-time="10am-4pm"] .page-content-wrap .underline-perm::after {
    background-color: #231184; }

body[data-time="4pm-8pm"] .site-bg-gradient-4pm-8pm {
  opacity: 1; }
body[data-time="4pm-8pm"] .sun-ball {
  background-color: #db578c; }
body[data-time="4pm-8pm"] .main-nav a {
  color: #f1aa1d; }
  body[data-time="4pm-8pm"] .main-nav a::after {
    background-color: #f1aa1d; }
body[data-time="4pm-8pm"] .page-content-wrap {
  color: #1d30af; }
  body[data-time="4pm-8pm"] .page-content-wrap .line-through::after, body[data-time="4pm-8pm"] .page-content-wrap .underline-perm::after {
    background-color: #1d30af; }
body[data-time="4pm-8pm"] .wave-svg {
  stroke: #00449e; }

body[data-time="4pm-8pm"] .project-listing-wrap, body[data-time="8pm-5am"] .project-listing-wrap {
  color: #fff; }
  body[data-time="4pm-8pm"] .project-listing-wrap .arrow-btn span:nth-child(1)::before, body[data-time="8pm-5am"] .project-listing-wrap .arrow-btn span:nth-child(1)::before {
    background: url(../img/svg/arrow.svg) no-repeat center center/50%; }
  body[data-time="4pm-8pm"] .project-listing-wrap h4, body[data-time="8pm-5am"] .project-listing-wrap h4 {
    color: #f1aa1d; }
body[data-time="4pm-8pm"] .filter-work-list a.active, body[data-time="8pm-5am"] .filter-work-list a.active {
  color: #f1aa1d; }

body[data-time="8pm-5am"] .site-bg-gradient-8pm-5am {
  opacity: 1; }
body[data-time="8pm-5am"] .sun-ball {
  background-color: #e3e3e3; }
body[data-time="8pm-5am"] .lwwd-content * {
  color: #fff; }
body[data-time="8pm-5am"] .page-content-wrap {
  color: #2431f5; }
  body[data-time="8pm-5am"] .page-content-wrap .line-through::after, body[data-time="8pm-5am"] .page-content-wrap .underline-perm::after {
    background-color: #2431f5; }

body[data-time="5am-7am"] .site-bg-gradient-5am-7am {
  opacity: 1; }
body[data-time="5am-7am"] .sun-ball {
  background-color: #e3e3e3; }
body[data-time="5am-7am"] .page-content-wrap {
  color: #2431f5; }
  body[data-time="5am-7am"] .page-content-wrap .line-through::after, body[data-time="5am-7am"] .page-content-wrap .underline-perm::after {
    background-color: #2431f5; }

.close-project {
  position: fixed;
  right: 46px;
  top: 46px; }

.close-project, .close-project-video {
  z-index: 9999;
  opacity: 0;
  pointer-events: none;
  -webkit-transition: 0.35s cubic-bezier(0.62, 0.02, 0.34, 1);
  -moz-transition: 0.35s cubic-bezier(0.62, 0.02, 0.34, 1);
  transition: 0.35s cubic-bezier(0.62, 0.02, 0.34, 1); }

body[data-page="project"] .close-project:not([data-active="off"]),
body[data-page="project"] .close-project-video:not([data-active="off"]) {
  opacity: 1;
  pointer-events: auto;
  -webkit-transition-delay: 1s;
  -moz-transition-delay: 1s;
  transition-delay: 1s; }

.close-project-video {
  position: fixed;
  right: 50%;
  top: 40px; }

/*# sourceMappingURL=site-base.css.map */