@charset "utf-8";
/* CSS Document */

/* RESET */

html, body, div, span, h1, h2, h3, h4, h5, h6, p, a, address, img, ul, li, form, label, caption, article, aside, canvas, details, embed, figure, figcaption, footer, header, nav, section, summary, time, mark, audio, video {
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
}                  
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
  display:block;
}
body { 
  font:.8em sans-serif; 
  *font-size:small;
  color:#fff; 
  overflow:overlay;
}
a { 
  margin:0; 
  padding:0; 
  font-size:100%; 
  vertical-align:baseline; 
  background:transparent;
  text-decoration:none;
  outline:none;
}
h1, h2, h3, h4, h5, h6 { 
  font-weight:bold;
}
ul {
  list-style:none;
  width:100%;
}

/* END RESET */

/* Common Styles */

.bold {
  font-weight:bold;
}
.italic {
  font-style:italic;
} 
.uppercase {
  text-transform:uppercase;
}
.left {
  float:left;
}
.right {
  float:right;
}
.clear {
  clear:both;
}
.center-text {
  text-align:center;
}
.inline li {
  display:inline;
}
.overflow {
  overflow:hidden;
}
.relative {
  position:relative;
}
.absolute {
  position:absolute;
}


/* Fonts */

@font-face {
  font-family:'Noir';
  src:local('?'), url('../fonts/noir.ttf') format("truetype");
}

/* Unique styles */

body, html {
  height:100%;
}
header {
  background:#171717;
}
body {
  background:#fff;
}
p {
  position:relative;
  margin-top:10px;
  line-height:1.3;
}
a {
  color:#fff;
}
header .row div:first-child {
    width:45%;
}
header .row div {
    width:50%;
}
.row div {
    position:relative;
    display:inline-block;
}
nav {
  font-size:1.5rem;
}
.navCTA a {
  color:#fde071;
}
#logo {
  position:relative;
  padding:25px 0 0 20px;
  font-size:3rem;
  font-weight:100;
  z-index:999;
}
nav li {
  padding-right:5%;
}
#headerTagline h2, #headerTagline h3 {
  display:inline-block;
}
#headerTagline h2 {
  font-size:8rem;
}
.other-work a:hover {
  color:#fde071;
}
li {
  margin-bottom:10px;
}
#content {
  margin:45px auto 0 auto;
}
#navWindow {
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:#171717;
  z-index:998;
  opacity:0;
  display:none;
}
#navWindow.open {
  opacity:1;
  display:block;
}
#navBackground { 
  position:fixed;
  width:100vw;
  height:100vh;
  object-fit:cover;
  top:0;
  left:0;
  z-index:-1;
  opacity:0.2;
}
.header-button {
  position:fixed;
  z-index:100;
  width:60px;
  height:50px;
  top:25px;
  right:15px;
  cursor:pointer;
  background-color:rgba(0,0,0,.07);
  transition:background-color .3s;
  z-index:999;
}
.header-nav {
  height:100%;
}
.header-nav-items {
  position:relative;
  width:672px;
  margin-top:15%;
  margin-bottom:-0.2%;
  margin-left:15%;
  margin:15% auto;
  font-family:'noir';
  z-index:999;
}
.header-nav-item {
  width:100%;
  margin-bottom:1%;
  text-align:center;
  color:#fff;
}
.header-nav-item:hover {
  background:#fde071;
  color:#171717;
}
.header-nav-item p {
  position:relative;
  top:22px;
  padding:0 25px;
  font-size:5rem;
}
.navCTA a {
  color:#fde071;
}
.header-button:focus span, .header-button:hover span {
  width:40px;
}
.header-button-item {
  display:block;
  height:2px;
  background:#fff;
  position:absolute;
  right:9px;
  opacity:1;
  transition:transform .3s, top .3s, opacity .3s, width .3s;
}
.header-button-item.top {
  top:15px;
  width:40px;
  transform-origin:left bottom;
}
.header-button-item.middle {
  top:24px;
  width:35px;
}
.header-button-item.bottom {
  top:33px;
  width:30px;
  transform-origin:left top;
}
.header-button.open {
  background-color:transparent
}
.header-button.open .header-button-item {
  width:35px;
}
.header-button.open .header-button-item.top {
  transform:rotate(45deg);
  top:12px;
}
.header-button.open .header-button-item.middle {
  opacity:0;
}
.header-button.open .header-button-item.bottom {
  transform:rotate(-45deg);
  top:37px;
}
#hamburger {
  z-index:999;
}
#menu {
  position:absolute;
  padding-top:15%;
  text-align:center;
  width:100%;
  display:none;
  z-index:999;
}
#menu li a:hover {
  color:#000;
}
#navigation li {
  font-size:1.8em;
  margin-bottom:20px;
}
h2 {
  font-size:2em;
}
.small-images {
  margin:auto;
  padding-bottom:20px;
}
.small-images img {
  width:100px;
}
.small-images a {
  text-align:center;
  margin-right:30px;
}
.highlight {
  color:#e74c3c;
  margin-bottom:15px;
}
#subsection {
  position:relative;
  margin:40px auto 0 auto;
}
section {
  text-align:left;
  margin:auto;
}
section h2 {
  text-align:center;
  padding:15px 0;
}
.black {
  background:#101010;
  padding:45px 0 60px 0;
}
.white p, .white a {
  color:#000;
  font-size:1.2em;
}
.white p {
  padding:0 1% 0 3%;
}
.portfolios {
  margin-top:-2%;
  max-width:99%;
  padding-bottom:50px;
}
.portfolios li {
  position:absolute;
  display:inline-block;
  background-repeat:no-repeat;
  background-size:cover;
  width:100%;
  height:100%;
  padding-bottom:45%;
  margin-top:2%;
}
.overlay {
  position:absolute;
  width:100%;
  height:100%;
  text-align:center;
  background:rgba(0,0,0,0.3);
}
.overlay h3 {
  position:relative;
  top:45%;
  margin:auto;
  color:#F5F2EB;
  font-size:4em;
  opacity:1;
}
#book, #day {
  position:relative;
  margin-top:50px;
}
#book {
  color:#000;
}
#book.black {
  color:#F5F2EB;
}
#form {
  position:relative;
  padding-left:3%;
  font-size:1.2em;
  width:320px;
  margin:auto;
  left:-20px;
  text-align:center;
}
#form input {
  margin:10px 0 10px 0;
}
#name, #email, #subject, #message, #send {
  position:relative;
}
#message {
  margin-top:10px;
}
.underline {
  position:relative;
  margin-top:20px;
  max-width:500px;
  height:1px;
  color:#fff;
  background-color:#fff;
  border:0;
}
.bgimage {
  position:absolute;
  max-width:250px;
}
#intro {
  position:relative;
  margin-top:25px;
  padding-bottom:5px;
  max-width:100%;
  font-size:0.8em;
  opacity:0.6;
}
#intro.intro-two {
  position:absolute;
  max-width:100%;
  font-size:0.8em;
  opacity:0.6;
  bottom:20px;
}
#intro.intro-three {
  position:relative;
  max-width:100%;
  font-size:0.8em;
  opacity:0.6;
  margin-left:60px;
}
#intro h2 {
  max-width:80%;
  margin:0 0 0 20px;
}
#intro .underline {
  position:relative;
  margin-top:10px;
  margin-bottom:10px;
  max-width:500px;
  height:1px;
  color:#d3d7da;
  background-color:#fff;
  border:0;
}
#enso {
  max-width:50%;
  padding:0 0 40px 0;
}
footer {
  position:relative;
  padding:0;
  padding:0 2% 0 2%;
}
#footer {
  position:absolute;
  bottom:0;
  height:76px;
  width:100%;
}
footer hr {
  border:0;
    height:1px;
    background:#fff;
    margin:30px 0;
}
footer .right a {
  margin-left:20px;
}
footer div {
  position:relative;
  top:-10px;
}
#content.about {
  width:85%;
  padding:20px;
  margin-top:-10px;
}
.about h2 {
  padding:5px;
  display:inline;
  font-size:3em;
}
.about .overview-wrapper p {
  width:95%;
  font-size:1.5em;
  margin:0 auto 20px 50px;
}
#intro #quote {
  margin:40px auto;
}
.background {
  background:#5c5c5c;
}
#bottomleft, #bottomright {
  position:absolute;
  z-index:998;
  width:auto;
  bottom:0;
  display:none;
}
#bottomleft {
  left:0;
}
#bottomright {
  right:0;
}
.social {
  display:none;
}
#sb-wrapper {
    top:-26px !important;
    height:100% !important;
    width:100% !important;
    left:0 !important;
    margin:auto !important;
}
#sb-wrapper-inner {
  height:100% !important;
}
#sb-info {
  display:none !important;
}
#sb-info-inner {
  position:relative;
}
#sb-body-close, #sb-body-left, #sb-body-right {
  position:absolute;
  z-index:999;
  opacity:0.2;
    filter:alpha(opacity=20);
}
#sb-body-close:hover, #sb-body-left:hover, #sb-body-right:hover {
  opacity:1;
    filter:alpha(opacity=100);
}
#sb-body-left, #sb-body-right {
  max-width:47px;
  top:45%;
}
#sb-body-right {
  right:0;
}
#sb-body-close {
  top:15px;
  right:15px;
  max-width:36px;
}
#sb-container {
  z-index:999;
}
.web footer {
  position:relative;
  padding:0;
  width:100%;
  padding:0 2% 0 2%;
}
.about #footer, .enso #footer {
    width:96%;
}
.more {
  display:none;
}
#title {
  text-align:center;
  font-weight:200;
  letter-spacing:3px;
  font-size:1.2em;
}
#gallery img, #production img {
  width:100%;
  max-width:800px;
}
.center {
  text-align:center;
}
#gallery-two img, #production-two img {
  width:auto;
  max-width:800px;
}
#gallery-two, #production-two {
  text-align:center;
}
#content.gallery {
  width:100%;
}
#info, #buttons {
  margin:5px auto 25px auto;
}
#buttons {
  width:95%;
}
#info {
  padding:5px 30px;
  margin-top:15px;
  font-size:1.2em;
}
#buttons div {
  display:inline;
}

.sm-breadcrumb {
  display:none;
}
nav.mastnav.signature-berend {
    display:none;
    position:fixed;
    top:0;
    right:0;
    width:100%;
    height:100%;
    z-index:999;
    background:#101010;
}
.mastnav-inner-left, .mastnav-inner-right {
  height:100%;
  width:50%;
}
.mastnav-inner-right img { 
  position:absolute;
  bottom:-4%;
  right:0;
  max-width:580px;
}
.mastnav-inner-left {
  float:left;
  -ms-transform:translate(-100%); /* IE 9 */
  -webkit-transform:translate(-100%); /* Safari */
  -o-transform:translate(-100%); /* Opera */
  transform:translate(-100%);
  -webkit-transition:all .4s linear;
  -moz-transition:all .4s linear;
  -ms-transition:all .4s linear;
  -o-transition:all .4s linear;
  transition:all .4s linear;
}
.mastnav-inner-right{
  float:right;
  -ms-transform:translate(100%); /* IE 9 */
  -webkit-transform:translate(100%); /* Safari */
  -o-transform:translate(100%); /* Opera */
  transform:translate(100%);
  -webkit-transition:all .4s linear;
  -moz-transition:all .4s linear;
  -ms-transition:all .4s linear;
  -o-transition:all .4s linear;
  transition:all .4s linear;
}
.mastnav-inner-left.slide-to-left {
    -ms-transform:translate(0); /* IE 9 */
    -webkit-transform:translate(0); /* Safari */
    -o-transform:translate(0); /* Opera */
    transform:translate(0);
  -webkit-transition:all .4s linear;
     -moz-transition:all .4s linear;
    -ms-transition:all .4s linear;
     -o-transition:all .4s linear;
      transition:all .4s linear;
}
.mastnav-inner-right.slide-to-right {
    -ms-transform:translate(0); /* IE 9 */
    -webkit-transform:translate(0); /* Safari */
    -o-transform:translate(0); /* Opera */
    transform:translate(0);
  -webkit-transition:all .4s linear;
     -moz-transition:all .4s linear;
    -ms-transition:all .4s linear;
     -o-transition:all .4s linear;
      transition:all .4s linear;
}
nav.mastnav.signature-berend ul{
    list-style-type:none;
    padding:0;
    margin:0;
}
nav.mastnav.signature-berend ul li{
    margin-bottom:20px;
}
.menu-social{
  border:none;
}
.menu-social li{
  display:inline-block;
}
.menu-social li span{
  font-size:24px;
}
.menu-credits{
  margin-top:50px;
}
.sub-menu{
  display:none;
  margin-top:10px;
  padding-top:10px;
  margin-bottom:20px;
}
.sub-menu a{
  display:block;
  font-size:12px;
  line-height:22px;
}
.main-link{
  font-size:20px;
  line-height:24px; 
  letter-spacing:4px;
  text-transform:uppercase;
}
.main-menu {
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  line-height:4;
}
.whiteBg {
  background-color:#fff;
}
.blackBg {
  background-color:#101010;
  text-align:center;
}
.menuOpen {
  position:fixed !important;
  top:0 !important;
}
.scrollToggle {
  overflow:hidden;
}
#gallery, #production {
  position:relative;
  color:#F5F2EB;
  font-size:2em;
}
#galleryPage, #productionPage {
  background:#101010;
  color:#F5F2EB;
}
#gallery img, #production img {
  position:relative;
  margin-top:5%;
  width:70%;
}
#gallery a, #production a {
  color:#fff;
}
.pn {
  position:absolute;
  top:45%;
  right:5%;
  float:right;
  text-align:center;
  font-size:0.7em;
  color:#F5F2EB;
  width:20%;
}
.galleryCaption, .productionCaption {
  font-size:2em;
  margin-bottom:50px;
  text-transform:uppercase;
}

@media all and (min-width:800px) {
  #sb-wrapper-inner img {
    display:block; 
    width:auto; 
    height:auto;
    margin:auto;
    top:0;
    left:0;
      right:0;
      bottom:0;
      max-width:100%;
      max-height:100%;
  }
  /*#sb-body-inner img {
    width:100%;
    height:auto;
  }*/
  .noheader {
    background:none;
  }
  .grid li.shown:hover {
    -webkit-transition:all 0.5s ease;
      -moz-transition:all 0.5s ease;
      -o-transition:all 0.5s ease;
      -ms-transition:all 0.5s ease;
      transition:all 0.5s ease;
      width:320px;
      margin-left:3px;
  }
}

@media all and (max-width:580px) {
  html, body {
    height:auto;
  }
  .grid {
    margin:30px 0 0 0;
  }
  .grid img {
    width:100%;
    min-width:100%;
  }
  footer {
    font-size:1.2em;
  }
  footer div {
    width:100%;
    text-align:center;
  }
  footer .right {
    margin-top:10px;
    float:none;
  }
  #gallery img, #production img {
    width:95%;
  }
  .pn {
    position:relative;
    top:0;
    right:0;
    float:none;
    width:auto;
    margin:auto;
    padding-bottom:50px;
  }
  #logo {
    max-width:60%;
  }
    #footer {
    position:relative;
    height:auto;
  }
  #enso {
    max-width:500px;
    padding:0;
  }
  #sb-info-inner {
    font-size:16px;
  }
  #sb-nav, #sb-info {
    height:24px;
  }
  #sb-nav a {
    height:24px;
    width:24px;
    margin-left:10px;
    background-size:24px;
  }
  #sb-nav img {
    width:24px;
    height:24px;
  }
  .portfolios li {
    width:95%;
    height:330px;
    margin-bottom:15px;
  }
  .overlay {
    position:absolute;
    width:100%;
    height:100%;
    text-align:center;
  }
  .grid li {
      width:95%;
  }
  #content.about {
    margin:0;
    width:90%;
  }
  #sb-counter {
    position:relative;
    top:2px;
  }
  #bottomleft, #bottomright {
    display:none !important;
  }
  .mastnav-inner-right {
    display:none;
  }
  .mastnav-inner-left, .mastnav-inner-right {
    width:100%;
  }
}

@media (max-width:560px) and (orientation:portrait) {
  .grid {
      margin:30px 0 0 2px;
    }
  #sb-wrapper-inner img {
    display:block; 
    width:auto; 
    height:auto;
    margin:auto;
    top:0;
    left:0;
      right:0;
      bottom:0;
      max-width:100%;
  }
  /*#sb-wrapper-inner img {
    width:auto;
    height:auto;
  }*/
  footer div {
    top:0;
  }
}

@media all and (max-width:700px) and (orientation:landscape) {
  .grid li {
    width:95%;
  }
  #sb-wrapper-inner img {
    display:block; 
    width:auto; 
    height:auto;
    margin:auto;
    top:0;
    left:0;
      right:0;
      bottom:0;
      max-width:100%;
  }
  /*#sb-wrapper-inner img {
    width:auto;
    height:auto;
  }*/
  #bottomleft, #bottomright {
    display:none !important;
  }
  #footer {
    position:relative;
    height:auto;
  }
  footer {
      font-size:1.2em;
  }
  footer div {
    width:100%;
    text-align:center;
  }
  footer .right {
    margin-top:10px;
    float:none;
  }
  footer div {
    top:0;
  }
  #sb-body-left, #sb-body-right {
    top:50%;
    transform:translateY(-50%);
  }
  #sb-body-close {
    height:36px;
  }
  .about #footer, .enso #footer {
    position:relative;
    height:60px;
  }
}


html {
  line-height:1.15;
  -ms-text-size-adjust:100%;
  -webkit-text-size-adjust:100% }
body {
  margin:0 }
article,aside,figcaption,figure,footer,header,main,nav,section {
  display:block }
  figure {
  margin:1em 40px }
hr {
  box-sizing:content-box;
  width:80%;
  height:1px;
  overflow:visible;
  margin-bottom:2em;
}
  pre {
  font-family:monospace,monospace;
  font-size:1em }
  a {
  background-color:transparent;
  -webkit-text-decoration-skip:objects }
  abbr[title] {
  border-bottom:none;
  text-decoration:underline;
  -webkit-text-decoration:underline dotted;
  text-decoration:underline dotted }
  b,strong {
  font-weight:inherit;
  font-weight:bolder }
  code,kbd,samp {
  font-family:monospace,monospace;
  font-size:1em }
  dfn {
  font-style:italic }
  mark {
  background-color:#ff0;
  color:#000 }
  small {
  font-size:80% }
  sub,sup {
  font-size:75%;
  line-height:0;
  position:relative;
  vertical-align:baseline }
  sub {
  bottom:-.25em }
  sup {
  top:-.5em }
  audio,video {
  display:inline-block }
  audio:not([controls]) {
  display:none;
  height:0 }
  img {
  border-style:none }
  svg:not(:root) {
  overflow:hidden }
  button,input,optgroup,select,textarea {
  font-family:inherit;
  font-size:100%;
  line-height:1.15;
  margin:0 }
  button,input {
  overflow:visible }
  button,select {
  text-transform:none }
  [type=reset],[type=submit],button,html [type=button] {
  -webkit-appearance:button }
  [type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner {
  border-style:none;
  padding:0 }
  [type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring {
  outline:1px dotted ButtonText }
  fieldset {
  padding:.35em .75em .625em }
  legend {
  box-sizing:border-box;
  color:inherit;
  display:table;
  max-width:100%;
  padding:0;
  white-space:normal }
  progress {
  display:inline-block;
  vertical-align:baseline }
  textarea {
  overflow:auto }
  [type=checkbox],[type=radio] {
  box-sizing:border-box;
  padding:0 }
  [type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button {
  height:auto }
  [type=search] {
  -webkit-appearance:textfield;
  outline-offset:-2px }
  [type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration {
  -webkit-appearance:none }
  ::-webkit-file-upload-button {
  -webkit-appearance:button;
  font:inherit }
  details,menu {
  display:block }
  summary {
  display:list-item }
  canvas {
  display:inline-block }
  [hidden],template {
  display:none }
  * {
  box-sizing:border-box }
  body,html {
  -moz-osx-font-smoothing:grayscale;
  -webkit-font-smoothing:antialiased }
  ::-moz-selection {
  background:#a70303;
  color:#F5F2EB;
  text-shadow:none }
  ::selection {
  background:#c5b286;
  color:#fff;
  text-shadow:none }
  audio,canvas,iframe,img,svg,video {
  vertical-align:middle }
  fieldset {
  border:0;
  margin:0;
  padding:0 }
  textarea {
  resize:vertical }
  a,a:active,a:focus,a:hover,a:link,a:visited {
  outline:none }
  [tabindex="0"] {
  outline:0 }
  h1,h2,h3,h4,h5,h6,li,ol,p,ul {
  margin:0;
  padding:0 }
  .text {
  font-size:2em;
  letter-spacing:.04em;
  color:#fff;
  }
  .text+.button-external {
  margin-top:3em }
  .text+.button-view {
  margin-top:2em }
  .title {
  font:700 normal 40px/1.2;
  letter-spacing:.04em;
  color:#58595b }
  @media only screen and (max-width:767px) {
  .title {
  font-size:30px }
   }
  .title+.text {
  margin-top:.75em }
  .subtitle {
  font:400 normal 30px/1.2;
  color:#58595b }
  @media only screen and (max-width:767px) {
  .subtitle {
  font-size:20px }
   }
  .subtitle+.text {
  margin-top:.75em }
.section-title {
  letter-spacing:.24em;
  text-transform:uppercase;
  color:#818181;
  text-align:center;
  margin-bottom:2em;
}
.about .section-title, .about .statement {
  color:#fff;
}
  @media only screen and (max-width:767px) {
  .section-title {
  font-size:14px }
   }
.statement {
  font-size:16px;
  color:#aeaeae;
}
  @media only screen and (max-width:767px) {
  .statement {
  font-size:16px }
   }
  select::-ms-expand {
  display:none }
  .button-external {
  font:600 normal 14px/1;
  text-transform:uppercase;
  letter-spacing:.24em;
  color:#b6b8bc;
  text-decoration:none;
  display:inline-block;
  padding:.9em 0 .8em 2.5em;
  background:transparent url(assets/images/global/button-external.svg) 0/auto 20px no-repeat;
  position:relative }
  .button-external:before {
  content:"";
  position:absolute;
  right:0;
  bottom:0;
  width:0;
  height:1px;
  background-color:#b6b8bc;
  z-index:-1;
  transition:width .2s cubic-bezier(.12,.84,.66,.95) }
  .button-external:focus:before,.button-external:hover:before {
  left:0;
  width:100% }
  .button-circle {
  text-decoration:none;
  width:120px;
  height:120px;
  margin:0 auto;
  position:relative;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-flow:row nowrap;
  flex-flow:row nowrap;
  -ms-flex-pack:center;
  justify-content:center;
  -ms-flex-align:center;
  align-items:center;
  text-align:center;
  color:#8b8b8f;
  font:400 italic 20px/1;
  transition:color .5s cubic-bezier(.12,.84,.66,.95) }
  @media only screen and (max-width:1023px) {
  .button-circle {
  color:#fff }
   }
  @media only screen and (max-width:767px) {
  .button-circle {
  width:80px;
  height:80px;
  font-size:14px }
   }
  .button-circle:focus,.button-circle:hover {
  color:#fff }
  .button-circle:focus .button-circle-hover,.button-circle:hover .button-circle-hover {
  stroke-dashoffset:0 }
  .button-circle span {
  position:relative;
  z-index:2 }
  .button-circle svg {
  width:100%;
  position:absolute;
  left:0;
  top:0;
  z-index:1 }
  .button-circle circle {
  fill:none;
  stroke-width:5;
  stroke-miterlimit:10 }
  .button-circle-shape {
  stroke:hsla(0,0%,100%,.3) }
  .button-circle-hover {
  transform:rotate(-90deg);
  transform-origin:center center;
  stroke:#fff;
  stroke-dasharray:1300;
  stroke-dashoffset:1300;
  transition:stroke-dashoffset .5s cubic-bezier(.12,.84,.66,.95) }
  @media only screen and (max-width:1023px) {
  .button-circle-hover {
  stroke-dashoffset:0 }
   }
  .button-view {
    font:700 normal 14px/1;
    letter-spacing:.4em;
    text-transform:uppercase;
    color:#fff;
    text-decoration:none;
    display:inline-block;
    position:relative;
    padding:1em;
    left:-.7em;
    overflow:hidden;
  }
  @media only screen and (max-width:767px) {
  .button-view {
  font-size:12px }
   }
  .button-view:before {
  content:"";
  position:absolute;
  bottom:0;
  left:0;
  border-bottom:2px solid #fde071;
  width:100%;
  transform:translateX(calc(-100% + 2.5em));
  transition:transform .5s }
  .button-view:hover:before {
  transform:translateX(calc(100% - 2.5em)) }
.button-filled {
  letter-spacing:.28em;
  text-transform:uppercase;
  text-decoration:none;
  display:inline-block;
  padding:1.5em 2em 1.2em 2.1em;
  color:#000;
  background-color:#fff;
  transition:background-color .2s;
}
  .button-filled:focus,.button-filled:hover {
  background-color:#a70303;
  color:#fff;
}
  .button-line {
  font:700 normal 14px/1;
  letter-spacing:.6em;
  text-transform:uppercase;
  border-bottom:2px solid #a70303;
  text-decoration:none;
  display:inline-block;
  padding:1em 1em 1em 1.3em;
  transition:padding .3s }
  @media only screen and (max-width:767px) {
  .button-line {
  font-size:12px }
   }
  .button-line:focus,.button-line:hover {
  padding:1em 2em 1em 2.3em }
  .overflow {
  overflow:hidden;
  display:block }
  .overflow-inner {
  display:block;
  transform:translateY(100%);
  transition:transform .5s cubic-bezier(.12,.84,.66,.95) }
  .overflow-inner.animate {
  transform:translateY(0) }
  .fade {
  opacity:0;
  transition:opacity .5s }
  .fade.animate {
  opacity:1 }
  .fade-up {
  opacity:0;
  transform:translateY(100px);
  transition:opacity 1s,transform 1s cubic-bezier(.12,.84,.66,.95) }
  @media only screen and (max-width:767px) {
  .fade-up {
  transform:translateY(50px) }
   }
  .fade-up.animate {
  opacity:1;
  transform:translate(0) }
  @keyframes a {
  0% {
  transform:translate3d(0,100%,0) }
  40% {
  transform:translateZ(0) }
  60% {
  transform:translateZ(0) }
  to {
  transform:translate3d(0,-100%,0) }
   }
  .reveal {
  display:block;
  position:relative;
  overflow:hidden }
  .reveal.animate:before {
  animation:a .6s cubic-bezier(.12,.84,.66,.95) }
  .reveal.animate img,.reveal.animate video {
  visibility:visible }
  .reveal:before {
  content:"";
  position:absolute;
  left:0;
  top:0;
  height:100%;
  width:100%;
  background-color:#f0f0f0;
  transform:translate3d(0,100%,0);
  transition:transform .3s cubic-bezier(.12,.84,.66,.95),height .3s cubic-bezier(.12,.84,.66,.95) .3s;
  z-index:1 }
  .reveal img,.reveal video {
  width:100%;
  visibility:hidden;
  transition:visibility 0s .3s }
  .full-width-image {
  display:block;
  width:100%;
  margin:0 auto }
  .owl-carousel {
  display:none;
  width:100%;
  -webkit-tap-highlight-color:transparent;
  position:relative;
  z-index:1}
  .owl-carousel .owl-stage {
  position:relative;
  -ms-touch-action:pan-Y;
  -moz-backface-visibility:hidden }
  .owl-carousel .owl-stage:after {
  content:".";
  display:block;
  clear:both;
  visibility:hidden;
  line-height:0;
  height:0 }
  .owl-carousel .owl-stage-outer {
  position:relative;
  overflow:hidden;
  -webkit-transform:translateZ(0) }
  .owl-carousel .owl-item,.owl-carousel .owl-wrapper {
  -webkit-backface-visibility:hidden;
  -moz-backface-visibility:hidden;
  -ms-backface-visibility:hidden;
  -webkit-transform:translateZ(0);
  -moz-transform:translateZ(0);
  -ms-transform:translateZ(0) }
  .owl-carousel .owl-item {
  position:relative;
  min-height:1px;
  float:left;
  -webkit-backface-visibility:hidden;
  -webkit-tap-highlight-color:transparent;
  -webkit-touch-callout:none }
  .owl-nav {
    position:relative;
    margin:auto;
    text-align:center;
    width:100vw;
    top:40px;
    left:-3.8vw;
  }
  .owl-nav div {
    display:inline;
    margin:25px;
  }
  .owl-carousel .owl-dot,.owl-carousel .owl-nav .owl-next,.owl-carousel .owl-nav .owl-prev {
    cursor:pointer;
    cursor:hand;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
    color:#fff; 
  }
  .owl-carousel.owl-loaded {
  display:block }
  .owl-carousel.owl-loading {
  opacity:0;
  display:block }
  .owl-carousel.owl-hidden {
  opacity:0 }
  .owl-carousel.owl-refresh .owl-item {
  visibility:hidden }
  .owl-carousel.owl-drag .owl-item {
  -webkit-user-select:none;
  -moz-user-select:none;
  -ms-user-select:none;
  user-select:none }
  .owl-carousel.owl-grab {
  cursor:move;
  cursor:-webkit-grab;
  cursor:grab }
  .owl-carousel.owl-rtl {
  direction:rtl }
  .owl-carousel.owl-rtl .owl-item {
  float:right }
  .no-js .owl-carousel {
  display:block }
  .owl-carousel .animated {
  animation-duration:1s;
  animation-fill-mode:both }
  .owl-carousel .owl-animated-in {
  z-index:0 }
  .owl-carousel .owl-animated-out {
  z-index:1 }
  .owl-carousel .fadeOut {
  animation-name:b }
  .owl-height {
  transition:height .5s ease-in-out }
  .owl-carousel .owl-item .owl-lazy {
  opacity:0;
  transition:opacity .4s ease }
  .owl-carousel .owl-item img.owl-lazy {
  transform-style:preserve-3d }
  .owl-carousel .owl-video-wrapper {
  position:relative;
  height:100%;
  background:#101010 }
  .owl-carousel .owl-video-play-icon {
  position:absolute;
  height:80px;
  width:80px;
  left:50%;
  top:50%;
  margin-left:-40px;
  margin-top:-40px;
  background:url(owl.video.play.png) no-repeat;
  cursor:pointer;
  z-index:1;
  -webkit-backface-visibility:hidden;
  transition:transform .1s ease }
  .owl-carousel .owl-video-play-icon:hover {
  transform:scale(1.3) }
  .owl-carousel .owl-video-playing .owl-video-play-icon,.owl-carousel .owl-video-playing .owl-video-tn {
  display:none }
  .owl-carousel .owl-video-tn {
  opacity:0;
  height:100%;
  background-position:50%;
  background-repeat:no-repeat;
  background-size:contain;
  transition:opacity .4s ease }
  .owl-carousel .owl-video-frame {
  position:relative;
  z-index:1;
  height:100%;
  width:100% }
  .header-logo {
  position:fixed;
  left:20px;
  top:20px;
  z-index:100 }
  @media only screen and (max-width:767px) {
  .header-logo {
  left:10px;
  top:3px }
   }
  .header-logo svg {
  display:block;
  width:65px;
  height:65px }
  @media only screen and (max-width:767px) {
  .header-logo svg {
  width:50px;
  height:50px }
   }
  .header-logo svg .makersandallies-logo-bg {
  fill:#a70303;
  transition:fill .2s }
  .header-logo svg .makersandallies-logo-letters {
  fill:#fff }
  .header-logo:hover svg .makersandallies-logo-bg {
  fill:#ca3c10 }
.header-nav-image {
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
}
.header-nav-image img {
  width:100%;
}
  @media only screen and (max-width:767px) {
  .header-nav {
  -ms-flex-direction:column;
  flex-direction:column;
  -ms-flex-pack:center;
  justify-content:center }
   }
  .header-nav.open {
  visibility:visible;
  opacity:1 }
  .header-nav.open .header-nav-item:first-child a {
  transition-delay:0s }
  .header-nav.open .header-nav-item:nth-child(2) a {
  transition-delay:.05s }
  .header-nav.open .header-nav-item:nth-child(3) a {
  transition-delay:.1s }
  .header-nav.open .header-nav-item:nth-child(4) a {
  transition-delay:.15s }
  .header-nav.open .header-nav-item:nth-child(5) a {
  transition-delay:.2s }
  .header-nav.open .header-nav-item:nth-child(6) a {
  transition-delay:.25s }
  .header-nav.open .header-nav-item:nth-child(7) a {
  transition-delay:.3s }
  .header-nav.open .header-nav-item a {
  transition:transform .8s,opacity .8s;
  transform:translateY(0);
  opacity:1;
  font-size:3em; }
  @media only screen and (max-width:767px) {
  .header-nav-items {
  width:70%;
  height:auto;
  margin-left:0 }
   }
  .header-button:focus span,.header-button:hover span {
  width:40px }
.header-button-item {
  display:block;
  height:2px;
  background:#fff;
  position:absolute;
  right:9px;
  opacity:1;
  transition:transform .3s,top .3s,opacity .3s,width .3s }
  .header-button-item.top {
  top:15px;
  width:40px;
  transform-origin:left bottom }
  .header-button-item.middle {
  top:24px;
  width:35px }
  .header-button-item.bottom {
  top:33px;
  width:30px;
  transform-origin:left top }
  .header-button.open {
  background-color:transparent }
  .header-button.open .header-button-item {
  width:35px }
  .header-button.open .header-button-item.top {
  transform:rotate(45deg);
  top:12px }
  .header-button.open .header-button-item.middle {
  opacity:0 }
  .header-button.open .header-button-item.bottom {
  transform:rotate(-45deg);
  top:37px }
  .footer {
  background-color:#171717;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-flow:row wrap;
  flex-flow:row wrap;
  -ms-flex-pack:justify;
  justify-content:space-between;
  text-align:center;
  padding:80px 60px 60px 130px;
  position:relative;
  z-index:3 }
  @media only screen and (max-width:1023px) {
  .footer {
  padding:80px 40px 40px }
   }
  @media only screen and (max-width:767px) {
  .footer {
  padding:40px 20px 60px 20px; }
   }
.footer-section {
  width:calc(100%);
  padding:80px 40px;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-flow:column nowrap;
  flex-flow:column nowrap;
  -ms-flex-align:center;
  align-items:center;
}
  @media only screen and (max-width:767px) {
  .footer-section {
  width:100% }
   }
  .footer-contact {
  background-color:#282828 }
  .footer-contact .button-circle {
  margin-top:40px }
  .footer-social {
  background-color:#202020 }
  @media only screen and (max-width:767px) {
  .footer-social {
  margin-top:20px }
   }
  .footer-title {
    color:#fff;
  }
  @media only screen and (max-width:1200px) {
  .footer-title {
  font-size:30px }
   }
  @media only screen and (max-width:1023px) {
  .footer-title {
  font-size:24px }
   }
  @media only screen and (max-width:480px) {
  .footer-title {
  font-size:5.5vw }
   }
  .footer-title+.footer-subtitle {
  margin-top:.3em }
  .footer-subtitle {
  font:400 italic 30px/1.2;
  color:#4c4c4c }
  @media only screen and (max-width:1200px) {
  .footer-subtitle {
  font-size:24px }
   }
  @media only screen and (max-width:1023px) {
  .footer-subtitle {
  font-size:20px }
   }
  @media only screen and (max-width:480px) {
  .footer-subtitle {
  font-size:5vw }
   }
.hero {
  height:100%;
  position:relative;
  overflow:hidden;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-flow:column nowrap;
  flex-flow:column nowrap;
  -ms-flex-pack:center;
  justify-content:center;
  -ms-flex-align:center;
  align-items:center;
  padding:0 10% 4vw;
  background:#171717;
}
.hero:before {
  content:"";
}
  .hero-parallax,.hero:before {
  position:absolute;
  left:0;
  top:0;
  height:100%;
  width:100% }
.hero-parallax {
  background-color:transparent;
  background-position:50%;
  background-size:cover;
  background-repeat:no-repeat;
  z-index:-1;
}
.hero-parallax video, .hero-parallax image {
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  min-width:100%;
  min-height:100%;
}
  .hero-headline {
  font:500 normal 5vw/1;
  color:#fff;
  text-align:center;
  position:relative;
  z-index:1 }
  @media only screen and (max-width:1500px) {
  .hero-headline {
  font-size:6vw }
   }
  @media only screen and (max-width:1200px) {
  .hero-headline {
  font-size:7vw }
   }
  @media only screen and (max-width:1023px) {
  .hero-headline {
  font-size:8vw }
   }
  @media only screen and (max-width:767px) {
  .hero-headline {
  font-size:9vw }
   }
  @media only screen and (max-width:480px) {
  .hero-headline {
  font-size:10vw }
   }
  .hero-headline.small {
  font-size:4vw }
  @media only screen and (max-width:1500px) {
  .hero-headline.small {
  font-size:4.5vw }
   }
  @media only screen and (max-width:1200px) {
  .hero-headline.small {
  font-size:5vw }
   }
  @media only screen and (max-width:1023px) {
  .hero-headline.small {
  font-size:6vw }
   }
  @media only screen and (max-width:767px) {
  .hero-headline.small {
  font-size:8vw }
   }
  @media only screen and (max-width:480px) {
  .hero-headline.small {
  font-size:9vw }
   }
  .hero-headline.small br {
  display:none }
  @media only screen and (max-width:1023px) {
  .hero-headline.small br {
  display:inline }
   }
.hero-eyebrow {
  letter-spacing:.2em;
  text-transform:uppercase;
  color:#fff;
  top:30px;
  margin-bottom:35px;
  text-align:center;
  position:relative;
  z-index:1;
}
  @media only screen and (max-width:767px) {
  .hero-eyebrow {
  font-size:10px }
   }
  @media only screen and (max-width:340px) {
  .hero-eyebrow {
  font-size:8px }
   }
  .hero-eyebrow-accent {
  font:400 italic 14px/1;
  text-transform:none;
  font-size:150% }
  .hero-eyebrow br {
  display:none }
  @media only screen and (max-width:1023px) {
  .hero-eyebrow br {
  display:inline }
   }
.hero-scroll {
  position:absolute;
  left:5%;
  bottom:0;
  font-size:1.3rem;
  text-transform:lowercase;
  letter-spacing:.05em;
  color:#fde071 !important;
  text-align:right;
  padding-right:70px;
  transform:translateY(0) rotate(90deg);
  transform-origin:bottom right;
  text-decoration:none;
  transition:transform .7s cubic-bezier(.12,.84,.66,.95);
}
.hero-scroll p {
  transform:translateY(0) rotate(-90deg);
}
  @media only screen and (max-width:1023px) {
  .hero-scroll {
  left:0 }
   }
  @media only screen and (max-width:767px) {
  .hero-scroll {
  font-size:13px;
  left:5%;
  padding-right:40px }
   }
  @media only screen and (max-width:480px) {
  .hero-scroll {
  left:-5% }
   }
  .hero-scroll.animate {
  transform:translateY(calc(100% + 70px)) rotate(90deg) }
  @media only screen and (max-width:767px) {
  .hero-scroll.animate {
  transform:translateY(calc(100% + 40px)) rotate(90deg) }
   }
  .hero-scroll:after,.hero-scroll:before {
    content:"";
    position:absolute;
    height:1px;
    background-color:currentColor;
    top:45%;
    right:0;
  }
  .hero-scroll:before {
    width:60px;
  }
  #technology .hero-scroll:before {
    width:100px;
  }
  #photography .hero-scroll:before {
    width:80px;
  }
  #artwork .hero-scroll:before {
    width:95px;
  }
  .about .hero-scroll:before {
    width:85px;
  }
  @media only screen and (max-width:767px) {
  .hero-scroll:before {
  width:30px }
   }
  .hero-scroll:after {
  width:0 }
  .hero-scroll:focus,.hero-scroll:hover {
  cursor:pointer }
  .hero-scroll:focus:before,.hero-scroll:hover:before {
  width:0;
  transition:width .3s cubic-bezier(.12,.84,.66,.95) }
  .hero-scroll:focus:after,.hero-scroll:hover:after {
  width:60px;
  left:calc(100% - 60px);
  transition:width .2s cubic-bezier(.12,.84,.66,.95) .25s }
  .hero-continue {
  width:50px;
  height:60px;
  position:absolute;
  left:50%;
  top:0;
  transform:translate(-50%,-50%);
  z-index:5;
  transition:opacity .3s;
  cursor:pointer;
  opacity:0 }
  .hero-continue:before {
  content:"";
  position:absolute;
  left:50%;
  border-left:1px solid #a70303;
  animation:d 4s infinite 3s }
  .hero-continue.animate {
  opacity:1; }
  .hero .button-line {
  margin-top:2em;
  position:relative;
  z-index:2;
  color:#fff; }
  .overview {
    background-color:#202020;
    margin:0 5vw;
    padding:12vw 8vw 20vw;
    transform:translate3d(0,100px,0);
    position:relative;
    transition:transform .5s;
    z-index:2; 
  }
  @media only screen and (max-width:767px) {
  .overview {
  padding:60px 10% 120px }
   }
.overview.animate {
  transform:translate3d(0,-5vw,0);
  transition:transform .5s cubic-bezier(.12,.84,.66,.95);
  border-bottom:1px solid #000;
}
  .overview.show .overview-title {
    transform:translateZ(0);
    font-family:Palatino, "Palatino Linotype";
}
  .overview.show .overview-rule {
  width:100px }
  @media only screen and (max-width:767px) {
  .overview.show .overview-rule {
  height:5px;
  width:50px }
   }
  .overview.show .overview-summary {
  opacity:1 }
  .overview.show .overview-scroll {
  opacity:.3;
  transition-delay:1.2s }
.overview-wrapper {
  position:relative;
  z-index:2;
  background:#171717;
}
  .overview-wrapper+.project-group {
  margin-top:-25vw;
  padding-top:35vw }
  .overview-title {
  text-align:center;
  font:400 normal 5vw/1.2;
  color:#000;
  transform:translate3d(0,100%,0);
  transition:transform .4s .5s }
  @media only screen and (max-width:767px) {
  .overview-title {
  font-size:10vw }
   }
  .overview-title-overflow {
  overflow:hidden;
  margin-bottom:40px }
  .overview-title.small {
  font-size:3vw }
  @media only screen and (max-width:1023px) {
  .overview-title.small {
  font-size:6vw }
   }
  .overview-summary {
  max-width:1000px;
  margin:0 auto;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-flow:row wrap;
  flex-flow:row wrap;
  -ms-flex-pack:justify;
  justify-content:space-between;
  -ms-flex-align:start;
  align-items:flex-start;
  opacity:0;
  transition:opacity .4s .9s }
  .overview-summary li+h3,.overview-summary p+h3 {
  margin-top:1.5em }
  .overview-summary li {
  list-style-type:none }
  .overview-summary li:before {
  content:"+ " }
  .overview-summary h3 {
  font:700 normal 22px/1.2;
  color:#58595b;
  letter-spacing:.02em }
  .overview-intro {
    width:100%;
    -ms-flex-order:1;
    order:1;
  }
  @media only screen and (max-width:767px) {
  .overview-intro {
  -ms-flex-order:1;
  order:1;
  width:100% }
   }
  .overview-details {
  width:25%;
  -ms-flex-order:2;
  order:2 }
  @media only screen and (max-width:767px) {
  .overview-details {
  -ms-flex-order:2;
  order:2;
  width:100%;
  margin-top:80px }
   }
  .overview-image {
  width:70%;
  margin:-15vw auto 0;
  z-index:2 }
  @media only screen and (max-width:767px) {
  .overview-image {
  width:80% }
   }
  .overview-image:before {
  background-color:attr(data-bg) }
  .overview-image img,.overview-image video {
  display:block }
  .overview-scroll {
  position:absolute;
  left:50%;
  bottom:3vw;
  transform:translateX(-50%);
  width:50px;
  height:50px;
  background:transparent url(assets/images/global/overview-arrow.svg) 50%/7px auto no-repeat;
  opacity:0;
  transition:opacity .3s }
  .overview-icon {
  position:absolute;
  left:0;
  bottom:8vw;
  width:100%;
  height:100px }
  @media only screen and (max-width:1200px) {
  .overview-icon {
  height:60px;
  bottom:7vw }
   }
  @media only screen and (max-width:767px) {
  .overview-icon {
  height:40px;
  bottom:40px }
   }
  .overview-icon svg {
  height:100%;
  width:auto;
  display:block;
  margin:0 auto }
  .intro {
  text-align:center;
  padding:200px calc(50% - 400px) 100px }
  @media only screen and (max-width:1200px) {
  .intro {
  padding:150px 20% 80px }
   }
  @media only screen and (max-width:1023px) {
  .intro {
  padding:100px 15% 80px }
   }
  @media only screen and (max-width:480px) {
  .intro {
  padding:80px 30px }
   }
  .parallax {
  min-height:45vw;
  position:relative;
  overflow:hidden;
  z-index:1 }
  @media only screen and (max-width:767px) {
  .parallax {
  min-height:60vw }
   }
  .parallax-inner {
  position:absolute;
  left:0;
  top:-15%;
  background-position:50%;
  width:100%;
  height:130%;
  background-size:cover;
  background-repeat:no-repeat }
.social {
  display:-ms-flexbox;
  display:flex;
  -ms-flex-pack:start;
  justify-content:flex-start;
  margin-top:60px;
  width:auto;
}
  @media only screen and (max-width:767px) {
  .social {
  margin-top:30px }
   }
  .social-item {
  list-style-type:none }
  .social-item+.social-item {
  margin-left:10px }
  .social a {
  display:block;
  width:60px;
  height:60px;
  background-color:#171717;
  background-position:50%;
  background-repeat:no-repeat;
  transition:background-color .2s;
  position:relative }
  @media only screen and (max-width:480px) {
  .social a {
  width:50px;
  height:50px }
   }
  .social a:after {
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:100%;
  height:0;
  background-color:#fff;
  opacity:.2;
  transition:height .3s cubic-bezier(.12,.84,.66,.95) }
  .social a:focus:after,.social a:hover:after {
  height:100% }
.social a.facebook {
  background-image:url(../images/facebook.svg);
  background-size:auto 40%;
}
.social a.instagram {
  background-image:url(../images/instagram.svg);
  background-size:auto 44%; 
}
  .featured-slider {
  width:45%;
  padding-left:3%;
  transform:width .3s }
  @media only screen and (max-width:1023px) {
  .featured-slider {
  padding-left:30px;
  width:90%;
  padding-left:0 }
   }
  .featured-slider-item {
  text-decoration:none }
  .featured-slider-img {
  height:31vw;
  width:100%;
  background-position:50%;
  background-repeat:no-repeat;
  background-size:cover }
  @media only screen and (max-width:1023px) {
  .featured-slider-img {
  height:65vw }
   }
  .featured-slider .owl-stage-outer {
  overflow:visible }
  .featured-slider-title {
    font-size:1.5em;
    padding:15px 0 0 10px;
    letter-spacing:.04em;
    color:#fff; 
  }
  @media only screen and (max-width:1023px) {
  .featured-slider-title {
  padding-left:20px }
   }
  @media only screen and (max-width:480px) {
  .featured-slider-title {
  font-size:12px;
  padding-left:15px }
   }
  .featured-slider-title a {
  color:currentColor;
  text-decoration:none;
  transition:color .3s }
  .featured-slider-title a:focus,.featured-slider-title a:hover {
  color:#555 }
  .featured-slider-subtitle {
  font-style:italic;
  display:inline-block;
  padding-left:.7em;
  margin-left:.3em;
  border-left:1px solid currentColor }
  .featured-slider-nav {
  padding:50px 7%;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-flow:row nowrap;
  flex-flow:row nowrap;
  -ms-flex-align:center;
  align-items:center;
  -ms-flex-pack:justify;
  justify-content:space-between }
  @media only screen and (max-width:767px) {
  .featured-slider-nav {
  padding-top:20px;
  padding-bottom:20px }
   }
  .featured-slider-nav-item {
  border:0;
  border-radius:0;
  box-sizing:border-box;
  box-shadow:none;
  -moz-appearance:none;
  appearance:none;
  -webkit-appearance:none;
  background:transparent 50%/80% auto no-repeat;
  width:100px;
  height:50px;
  opacity:.4;
  transition:opacity .3s }
  @media only screen and (max-width:767px) {
  .featured-slider-nav-item {
  width:70px }
   }
  .featured-slider-nav-item.prev.on-light {
  background-image:url(assets/images/global/featured-slider-prev-on-light.svg) }
  .featured-slider-nav-item.prev.on-dark {
  background-image:url(assets/images/global/featured-slider-prev-on-dark.svg) }
  .featured-slider-nav-item.next {
  -ms-flex-order:1;
  order:1 }
  .featured-slider-nav-item.next.on-light {
  background-image:url(assets/images/global/featured-slider-next-on-light.svg) }
  .featured-slider-nav-item.next.on-dark {
  background-image:url(assets/images/global/featured-slider-next-on-dark.svg) }
  .featured-slider-nav-item:focus,.featured-slider-nav-item:hover {
  opacity:.7;
  outline:0;
  cursor:pointer }
  .featured-slider-nav-counter {
  width:100px;
  font:400 normal 16px/1;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:#fff;
  text-align:center }
  @media only screen and (max-width:767px) {
  .featured-slider-nav-counter {
  font-size:14px }
   }
  .featured-slider-headline {
    font-size:2em;
    letter-spacing:.12em;
    text-transform:uppercase;
    padding:0 0 40px 8vw;
    color:#fff;
  }
  @media only screen and (max-width:1200px) {
  .featured-slider-headline {
  padding-bottom:30px }
   }
  @media only screen and (max-width:1023px) {
  .featured-slider-headline {
  padding-left:40px }
   }
  @media only screen and (max-width:767px) {
  .featured-slider-headline {
  padding-bottom:20px;
  font-size:12px }
   }
  .shuffler {
  position:relative;
  background:#111;
  height:50vw;
  overflow:hidden }
  @media only screen and (max-width:1023px) {
  .shuffler {
  height:80vw }
   }
  @media only screen and (max-width:480px) {
  .shuffler {
  height:120vw }
   }
  .shuffler-item {
  position:absolute;
  left:0;
  top:0;
  width:90vw;
  height:100%;
  transform:translateX(-100%);
  background-position:50%;
  background-repeat:no-repeat;
  background-size:cover;
  transition:transform .7s;
  z-index:3;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-flow:column nowrap;
  flex-flow:column nowrap;
  -ms-flex-pack:end;
  justify-content:flex-end;
  -ms-flex-align:start;
  align-items:flex-start;
  padding:0 0 8vw 10vw }
  .shuffler-item:after,.shuffler-item:before {
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:100%;
  height:100%;
  z-index:1 }
  .shuffler-item:before {
  background:linear-gradient(180deg,transparent 0,rgba(0,0,0,.6)) }
  .shuffler-item:after {
  background-color:rgba(0,0,0,.6);
  opacity:1;
  transition:opacity .7s }
  .shuffler-item.next {
  transform:translateX(20vw);
  z-index:1 }
  .shuffler-item.next.on-deck {
  transition-duration:0s }
  .shuffler-item.next.hover,.shuffler-item.next:hover {
  cursor:pointer;
  transform:translateX(19vw) }
  .shuffler-item.next.hover:after,.shuffler-item.next:hover:after {
  opacity:.5 }
  .shuffler-item.active {
  transform:translateX(0);
  z-index:2 }
  .shuffler-item.active:after {
  opacity:0 }
  .shuffler-item.active .overflow-inner {
  transform:translateY(0) }
  .shuffler-item.active .button-filled,.shuffler-item.active .home-work-subtitle {
  opacity:1 }
.shuffler-title {
  text-indent:-30px;
  padding-left:30px;
  left:-30px;
  color:#fff;
  margin-bottom:.1em;
  position:relative;
  z-index:2;
  width:70%; 
}
.headline {
  font-size:50px;
  font-weight:400;
}
.home-martial-headline.headline {
  font-size:5em;
  font-weight:700;
}
  @media only screen and (max-width:1023px) {
  .shuffler-title {
  font-size:7vw;
  text-indent:-20px }
   }
  @media only screen and (max-width:767px) {
  .shuffler-title {
  width:auto }
   }
  @media only screen and (max-width:480px) {
  .shuffler-title {
  font-size:10vw;
  text-indent:-10px }
   }
  .shuffler-title .overflow-inner {
  transition-delay:.5s }
  @media only screen and (max-width:767px) {
  .shuffler-title br {
  display:none }
   }
  .shuffler-subtitle {
  font:700 normal 16px/1.6;
  color:#fff;
  letter-spacing:.16em;
  text-transform:uppercase;
  margin-bottom:1.5em;
  margin-left:.5em;
  position:relative;
  z-index:2 }
  @media only screen and (max-width:1023px) {
  .shuffler-subtitle {
  font-size:14px }
   }
  @media only screen and (max-width:767px) {
  .shuffler-subtitle {
  font-size:12px }
   }
  @media only screen and (max-width:480px) {
  .shuffler-subtitle {
  font-size:9px;
  letter-spacing:.08em }
   }
  .shuffler-subtitle .overflow-inner {
  transition-delay:.7s }
  .shuffler-button {
  position:relative;
  z-index:2;
  left:-30px }
  @media only screen and (max-width:1023px) {
  .shuffler-button {
  left:-20px }
   }
  @media only screen and (max-width:480px) {
  .shuffler-button {
  left:-10px }
   }
  .shuffler-button .overflow-inner {
  transition-delay:.9s }
  .shuffler-arrow {
  border:0;
  border-radius:0;
  box-sizing:border-box;
  box-shadow:none;
  -moz-appearance:none;
  appearance:none;
  -webkit-appearance:none;
  width:60px;
  height:50px;
  position:absolute;
  top:50%;
  z-index:1;
  transition:width .4s cubic-bezier(.12,.84,.66,.95);
  z-index:4 }
  @media only screen and (max-width:1023px) {
  .shuffler-arrow {
  width:5vw }
   }
  @media only screen and (max-width:767px) {
  .shuffler-arrow {
  display:none }
   }
  .shuffler-arrow.hover,.shuffler-arrow:hover {
  width:80px;
  cursor:pointer }
  @media only screen and (max-width:1023px) {
  .shuffler-arrow.hover,.shuffler-arrow:hover {
  width:5vw }
   }
  .shuffler-arrow.next {
  background:transparent url(../images/next-arrow-red.svg) 100%/auto 7px no-repeat;
  left:calc(95vw - 50px) }
  @media only screen and (max-width:1023px) {
  .shuffler-arrow.next {
  left:92vw }
   }
  @keyframes f {
  0% {
  stroke-dashoffset:500 }
  to {
  stroke-dashoffset:2500 }
   }
  @keyframes g {
  0% {
  transform:rotate(0deg) }
  to {
  transform:rotate(1turn) }
   }
.home {
  background:#000;
}
  .home-bg {
  position:fixed;
  background:transparent;
  z-index:2 }
  .home-bg,.home-bg:before {
  left:0;
  top:0;
  width:100%;
  height:100% }
  .home-bg:before {
  /*content:"";*/
  position:absolute;
  transition:background-color .5s }
.home-bg.light-bg:before {
  background-color:#fff;
}
  .home-nav {
  position:fixed;
  left:30px;
  top:50%;
  transform:translateY(-50%);
  z-index:4 }
  @media only screen and (max-width:1023px) {
  .home-nav {
  display:none }
   }
  .home-nav ul {
  display:-ms-flexbox;
  display:flex;
  -ms-flex-flow:column nowrap;
  flex-flow:column nowrap }
  .home-nav li {
  list-style-type:none }
  .home-nav a {
  display:block;
  height:20px;
  width:30px;
  position:relative }
.home-nav a:before {
  content:"";
  position:absolute;
  border-bottom:1px solid #a70303;
  transition:width .3s 0s;
  left:0;
  top:50%;
  width:10px;
}
  .home-nav a.active:before {
  width:20px;
  transition:width .3s .2s }
  .home-hero {
  height:95vh;
  position:relative;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-align:center;
  align-items:center;
  padding:0 20%;
  transition:opacity .1s;
  z-index:1 }
  @media only screen and (max-width:1200px) {
  .home-hero {
  height:700px }
   }
  @media only screen and (max-width:767px) {
  .home-hero {
  height:500px }
   }
#introSection {
  position:absolute;
  left:50%;
  top:50%;
  width:auto;
  max-width:90%;
  max-height:80%;
  transform:translate(-50%,-50%);
}
.home-hero #introSection {
  position:fixed;
}
@media only screen and (max-width:1200px) {
  #introSection {
    top:75px;
    height:550px;
    transform:translate(-50%) 
  }
}
@media only screen and (max-width:767px) {
  #introSection {
    top:50px;
    height:400px; 
  }
}
@media only screen and (max-width:480px) {
  #introSection {
    top:25vh;
    height:300px;
  }
}
@media only screen and (max-width:340px) {
  #introSection {
    height:260px; 
  }
}
  #introSection-inner {
    text-align:center; 
  }
  #introSection-inner h1 {
    position:relative;
    margin-top:30px; 
    font-size:16px;
    font-family:Palatino, "Palatino Linotype";
  }
.home-statement {
  display:-ms-flexbox;
  display:flex;
  -ms-flex-flow:column nowrap;
  flex-flow:column nowrap;
  -ms-flex-pack:center;
  justify-content:center;
  -ms-flex-align:center;
  align-items:center;
  text-align:center;
  overflow:hidden;
  position:relative;
  height:100vh;
}
.home-photography.home-statement {
  min-height:auto;
}
  @media only screen and (max-width:1023px) {
  .home-statement {
  padding:120px 60px 150px;
  min-height:800px }
   }
  @media only screen and (max-width:767px) {
  .home-statement {
  padding:80px 40px 100px;
  min-height:0 }
   }
  .home-statement-text {
  font-size:60px;
  max-width:1200px;
  opacity:0;
  transform:translateY(1em);
  transition:opacity 1s 0s,transform 1s 0s }
  @media only screen and (max-width:1500px) {
  .home-statement-text {
  font-size:50px;
  max-width:1000px }
   }
  @media only screen and (max-width:1023px) {
  .home-statement-text {
  font-size:40px }
   }
  @media only screen and (max-width:767px) {
  .home-statement-text {
  font-size:30px }
   }
  @media only screen and (max-width:480px) {
  .home-statement-text {
  font-size:24px }
   }
  .home-statement-text span {
  font-style:italic;
  font-family:Adobe Garamond Pro,Times New Roman,Times,serif;
  font-weight:500 }
  .home-statement-button {
  margin-top:80px;
  opacity:0;
  transform:translateY(2em);
  transition:transform 1s,opacity 1s;
  position:relative;
  z-index:4 }
.home-martial {
  position:relative;
  z-index:3; 
}
.moveHidden {
  visibility:hidden;
}
  .home-martial-inner {
  display:-ms-flexbox;
  display:flex;
  -ms-flex-flow:column nowrap;
  flex-flow:column nowrap;
  -ms-flex-pack:center;
  justify-content:center;
  -ms-flex-align:center;
  align-items:center;
  width:calc(100% - 220px);
  max-width:1000px;
  height:900px;
  margin:0 auto;
  position:relative;
  overflow:hidden;
  transition:max-width 1s,transform 1s 2s;
  padding-top:40px;
  transform:translateY(6vh) }
  @media only screen and (max-width:1500px) {
  .home-martial-inner {
  height:700px;
  width:calc(100% - 200px) }
   }
  @media only screen and (max-width:1200px) {
  .home-martial-inner {
  height:600px;
  transform:translateY(0) }
   }
  @media only screen and (max-width:1023px) {
  .home-martial-inner {
  height:500px }
   }
  @media only screen and (max-width:767px) {
  .home-martial-inner {
  height:120vw;
  padding-top:10vw;
  width:90% }
   }
  .home-martial-inner.animate {
  transform:translateY(0) }
  .home-martial-inner.in-view {
  max-width:1600px }
  @media only screen and (max-width:1500px) {
  .home-martial-inner.in-view {
  max-width:1400px }
   }
.home-martial-inner:before {
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:100%;
  background-color:rgba(0,0,0,.6);
  z-index:1;
}
  .home-martial-headline {
  font:500 normal 80px/1.2;
  color:#fff;
  text-align:center;
  position:relative;
  z-index:1;
  margin-bottom:20px }
  @media only screen and (max-width:1023px) {
  .home-martial-headline {
  font-size:8vw }
   }
  @media only screen and (max-width:767px) {
  .home-martial-headline {
  font-size:10vw }
   }
.home-martial img {
  position:absolute;
  max-width:100%;
  max-height:100%;
  left:50%;
  top:70%;
  transform:translate(-50%,-50%);
}
.home-productions, .home-photography {
  background-color:#101010;
  transition:background-color .5s;
  z-index:3;
}
.in-view {
  background-color:#b1b1b1;
}
.home-productions.in-view:before, .home-productions.in-view svg, .home-photography.in-view:before,.home-photography.in-view svg {
  opacity:1;
  transition-delay:.5s;
  transition-duration:.5s;
}
.home-productions.in-view img, .home-photography.in-view img {
  opacity:1;
  transform:translateY(0);
  transition:transform 1s .5s,opacity 1s .5s;
}
.home-productions.in-view .home-statement-text, .home-photography.in-view .home-statement-text {
  opacity:1;
  transform:translateY(0);
  transition:transform 1s .2s,opacity 1s .2s;
}
.home-productions.in-view .home-statement-button, .home-photography.in-view .home-statement-button {
  opacity:1;
  transform:translateY(0);
  transition:transform 1s .4s,opacity 1s .4s;
}
.home-productions svg, .home-photography svg {
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  z-index:1;
  width:auto;
  height:90%;
  opacity:0;
  transition:opacity .2s;
}
.home-productions svg line, .home-photography svg line {
  fill:transparent;
  stroke:#a70303;
  stroke-miterlimit:10;
  stroke-dasharray:500;
  stroke-dashoffset:500;
  animation:f 10s infinite linear;
}
.home-productions img, .home-photography img {
  position:relative;
  bottom:-60px;
  z-index:3;
  width:200px;
  opacity:0;
  transform:translateY(30px);
  transition:transform .5s 0s,opacity .5s 0s;
}
.home-photography svg line:first-child {
  animation-delay:.5s;
}
.home-photography svg line:nth-child(2) {
  animation-delay:1s;
}
.home-photography svg line:nth-child(3) {
  animation-delay:1.5s;
}
.home-photography svg line:nth-child(4) {
  animation-delay:2s;
}
.home-photography svg line:nth-child(5) {
  animation-delay:2.5s;
}
.home-photography svg line:nth-child(6) {
  animation-delay:3s;
}
.home-photography svg line:nth-child(7) {
  animation-delay:3.5s;
}
.home-photography svg line:nth-child(8) {
  animation-delay:4s;
}
.home-productions:before, .home-photography:before {
  content:"";
  position:absolute;
  left:50%;
  top:0%;
  width:100%;
  height:100%;
  background:radial-gradient(ellipse at center,#f5f5f5 0,hsla(0,0%,96%,0) 65%);
  transform:translate(-50%,0);
  z-index:2;
  opacity:0;
  transition:opacity .2s;
}
.home-productions {
  position:relative;
  padding:0;
}
.textAdjust {
  font-size:1.3em;
  top:2vw;
}
.production-content .text {
  margin-bottom:15px;
}
@media only screen and (max-width:767px) {
  .home-productions img, .home-photography img {
    width:100px;
    bottom:-30px;
  }
}
.home-productions-text, .home-photography-text {
  color:#000;
  position:relative;
  z-index:4;
  background:-webkit-linear-gradient(transparent,transparent),linear-gradient(135deg,#484848,#878787 90%);
  -webkit-background-clip:text;
}
.white {
  color:#fff;
}
.button-line {
  color:#000;
  /*border-bottom:0 solid #a70303;*/
}
  .home .shuffler {
  z-index:3 }
.home-technology {
  background-color:#101010;
  z-index:3;
}
.tech-intro {
  position:relative;
}
.tech-text-wrap {
  position:absolute;
  margin:0;
  top:50%;
  left:50%;
  -ms-transform:translate(-50%, -50%);
  transform:translate(-50%, -50%);
}
.home-header, .home-text {
  color:#fff;
  max-width:1200px;
  margin:auto;
  text-align:left;
}
.home-header {
  font-size:4em;
  font-weight:900;
  margin-bottom:30px;
}
.home-text {
  font-size:2em;
  padding-left:25px;
}
.home-text:before {
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:1px;
  height:100%;
  background-color:#c5b286;
}
.home-productions-description, .home-technology-services {
  color:#aeaeae;
  letter-spacing:.16em;
  text-transform:uppercase;
  margin-top:2em;
  opacity:0;
  transform:translateY(1em);
  transition:transform .5s 0s,opacity .5s 0s;
}
.home-productions-description {
  opacity:100;
}
  @media only screen and (max-width:1200px) {
  .home-technology-services {
  font-size:25px }
   }
  @media only screen and (max-width:1023px) {
  .home-technology-services {
  font-size:20px }
   }
  @media only screen and (max-width:767px) {
  .home-technology-services {
  font-size:14px }
   }
  @media only screen and (max-width:480px) {
  .home-technology-services {
  display:-ms-flexbox;
  display:flex;
  -ms-flex-flow:column nowrap;
  flex-flow:column nowrap }
   }
  .home-technology .button-line {
  color:#aeaeae; }
.home-technology.in-view #sumie {
  opacity:1;
  transform:translateY(0);
  transition:transform 1s .5s,opacity 1s .5s; 
}
  .home-technology.in-view .home-statement-text {
  opacity:1;
  transform:translateY(0);
  transition:transform 1s .2s,opacity 1s .2s }
  .home-technology.in-view .home-technology-services {
  opacity:1;
  transform:translateY(0);
  transition:transform 1s .3s,opacity 1s .3s }
  .home-technology.in-view .home-statement-button {
  opacity:1;
  transform:translateY(0);
  transition:transform 1s .4s,opacity 1s .4s }
  .home-m {
  position:relative;
  z-index:3;
  padding:0 0 200px;
  background:#111 url(assets/images/home/m-slant-bg.svg) bottom/100% 100% no-repeat }
  @media only screen and (max-width:1023px) {
  .home-m {
  padding:50px 0 170px }
   }
  .home-m-inner {
  width:600px;
  height:545px;
  margin:0 auto;
  position:relative;
  display:block }
  @media only screen and (max-width:1023px) {
  .home-m-inner {
  width:60vw;
  height:54.5vw }
   }
  .home-m-inner:hover {
  cursor:pointer }
  .home-m-inner:hover .home-m-title:after {
  width:80px }
  @media only screen and (max-width:1023px) {
  .home-m-inner:hover .home-m-title:after {
  width:8vw }
   }
  .home-m-items {
  position:absolute;
  left:1px;
  top:1px;
  width:calc(100% - 2px);
  height:calc(100% - 3px);
  z-index:1 }
  .home-m-item {
  width:100%;
  height:100%;
  position:absolute;
  left:0;
  top:0;
  background-repeat:no-repeat;
  background-size:cover;
  background-position:50%;
  visibility:hidden }
  .home-m-item.active {
  visibility:visible }
  .home-m-title {
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  font:500 normal 110px/1;
  color:#fff;
  z-index:3;
  white-space:nowrap;
  text-shadow:0 0 .5em rgba(0,0,0,.9);
  text-decoration:none }
  @media only screen and (max-width:1023px) {
  .home-m-title {
  font-size:10vw }
   }
  .home-m-title:after {
  content:"";
  width:60px;
  height:7px;
  background:transparent url(../images/next-arrow-red.svg) 100%/auto 100% no-repeat;
  position:absolute;
  left:calc(100% + 10px);
  top:50%;
  transform:translateY(-50%);
  z-index:1;
  transition:width .4s cubic-bezier(.12,.84,.66,.95) }
  @media only screen and (max-width:1023px) {
  .home-m-title:after {
  width:7vw;
  height:1.5vw }
   }
.comic-items {
  display:-ms-flexbox;
  display:flex;
  -ms-flex-flow:row wrap;
  flex-flow:row wrap;
  position:absolute;
  transition:opacity .3s;
  z-index:1;
  opacity:0;
  width:100%;
  left:0;
  top:0 }
  .comic-items.active {
  position:relative;
  opacity:1;
  z-index:2;
  transition-delay:.3s }
  .comic-items.active .comic-item {
  transform:scale(1);
  transition:transform .3s cubic-bezier(.12,.84,.66,.95) .3s }
  .comic-items-wrapper {
  position:relative;
  overflow:hidden;
  background-color:#101010 }
  .comic-item {
    background-position:50%;
    background-repeat:no-repeat;
    background-size:cover;
    color:#fff;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-pack:center;
    justify-content:center;
    -ms-flex-align:center;
    align-items:center;
    text-decoration:none;
    overflow:hidden;
    transition:transform 0s .3s;
    transform:scale(.5);
   }
  .comic-item:focus .comic-item-content,.comic-item:hover .comic-item-content {
  opacity:1 }
  .comic-item:focus .comic-item-title,.comic-item:hover .comic-item-title {
  opacity:1;
  transition-delay:.2s }
  .comic-item:focus .comic-item-title span,.comic-item:hover .comic-item-title span {
  display:block;
  transition-delay:.1s;
  transform:translateY(0) }
  .comic-item:focus .work-categories,.comic-item:hover .work-categories {
  opacity:1;
  transition-delay:.3s }
  .comic-item:nth-child(8n+1) {
  width:50%;
  height:35vw }
  @media only screen and (max-width:1023px) {
  .comic-item:nth-child(8n+1) {
  height:40vw }
   }
  @media only screen and (max-width:767px) {
  .comic-item:nth-child(8n+1) {
  width:100%;
  height:45vw }
   }
  @media only screen and (max-width:767px) and (max-width:767px) {
  .comic-item:nth-child(8n+1) {
  height:60vw }
   }
  @media only screen and (max-width:767px) and (max-width:480px) {
  .comic-item:nth-child(8n+1) {
  height:90vw }
   }
  @media only screen and (max-width:767px) and (min-width:768px) {
  .comic-item:nth-child(8n+1) .comic-item-content {
  width:50%;
  height:50% }
   }
  .comic-item:nth-child(8n+2) {
  width:50%;
  height:35vw }
  @media only screen and (max-width:1023px) {
  .comic-item:nth-child(8n+2) {
  height:40vw }
   }
  @media only screen and (max-width:767px) {
  .comic-item:nth-child(8n+2) {
  width:100%;
  height:45vw }
   }
  @media only screen and (max-width:767px) and (max-width:767px) {
  .comic-item:nth-child(8n+2) {
  height:60vw }
   }
  @media only screen and (max-width:767px) and (max-width:480px) {
  .comic-item:nth-child(8n+2) {
  height:90vw }
   }
  @media only screen and (max-width:767px) and (min-width:768px) {
  .comic-item:nth-child(8n+2) .comic-item-content {
  width:50%;
  height:50% }
   }
  .comic-item:nth-child(8n+3) {
  width:50%;
  height:35vw }
  @media only screen and (max-width:1023px) {
  .comic-item:nth-child(8n+3) {
  height:40vw }
   }
  @media only screen and (max-width:767px) {
  .comic-item:nth-child(8n+3) {
  width:100%;
  height:45vw }
   }
  @media only screen and (max-width:767px) and (max-width:767px) {
  .comic-item:nth-child(8n+3) {
  height:60vw }
   }
  @media only screen and (max-width:767px) and (max-width:480px) {
  .comic-item:nth-child(8n+3) {
  height:90vw }
   }
  @media only screen and (max-width:767px) and (min-width:768px) {
  .comic-item:nth-child(8n+3) .comic-item-content {
  width:50%;
  height:50% }
   }
  .comic-item:nth-child(8n+4) {
  width:50%;
  height:70vw }
  @media only screen and (max-width:1023px) {
  .comic-item:nth-child(8n+4) {
  width:50%;
  height:110vw }
   }
  @media only screen and (max-width:1023px) and (max-width:1023px) {
  .comic-item:nth-child(8n+4) {
  height:75vw }
   }
  @media only screen and (max-width:767px) {
  .comic-item:nth-child(8n+4) {
  width:100%;
  height:130vw }
   }
  @media only screen and (max-width:767px) and (max-width:767px) {
  .comic-item:nth-child(8n+4) {
  height:175vw }
   }
  @media only screen and (max-width:767px) and (max-width:480px) {
  .comic-item:nth-child(8n+4) {
  height:150vw }
   }
  @media only screen and (max-width:767px) and (min-width:768px) {
  .comic-item:nth-child(8n+4) .comic-item-content {
  width:50%;
  height:50%;
 }
   }
  .comic-item:nth-child(8n+5) {
  width:33.33333%;
  height:25vw }
  @media only screen and (max-width:1023px) {
  .comic-item:nth-child(8n+5) {
  width:50%;
  height:35vw }
   }
  @media only screen and (max-width:1023px) and (max-width:1023px) {
  .comic-item:nth-child(8n+5) {
  height:40vw }
   }
  @media only screen and (max-width:767px) {
  .comic-item:nth-child(8n+5) {
  width:100%;
  height:45vw }
   }
  @media only screen and (max-width:767px) and (max-width:767px) {
  .comic-item:nth-child(8n+5) {
  height:60vw }
   }
  @media only screen and (max-width:767px) and (max-width:480px) {
  .comic-item:nth-child(8n+5) {
  height:90vw }
   }
  @media only screen and (max-width:767px) and (min-width:768px) {
  .comic-item:nth-child(8n+5) .comic-item-content {
  width:50%;
  height:50% }
   }
  .comic-item:nth-child(8n+6) {
  width:100%;
  height:45vw }
  @media only screen and (max-width:767px) {
  .comic-item:nth-child(8n+6) {
  height:60vw }
   }
  @media only screen and (max-width:480px) {
  .comic-item:nth-child(8n+6) {
  height:90vw }
   }
  @media only screen and (min-width:768px) {
  .comic-item:nth-child(8n+6) .comic-item-content {
  width:50%;
  height:50% }
   }
  .comic-item:nth-child(8n+7) {
  width:50%;
  height:35vw }
  @media only screen and (max-width:1023px) {
  .comic-item:nth-child(8n+7) {
  height:40vw }
   }
  @media only screen and (max-width:767px) {
  .comic-item:nth-child(8n+7) {
  width:100%;
  height:45vw }
   }
  @media only screen and (max-width:767px) and (max-width:767px) {
  .comic-item:nth-child(8n+7) {
  height:60vw }
   }
  @media only screen and (max-width:767px) and (max-width:480px) {
  .comic-item:nth-child(8n+7) {
  height:90vw }
   }
  @media only screen and (max-width:767px) and (min-width:768px) {
  .comic-item:nth-child(8n+7) .comic-item-content {
  width:50%;
  height:50% }
   }
  .comic-item:nth-child(8n+8) {
  width:50%;
  height:35vw }
  @media only screen and (max-width:1023px) {
  .comic-item:nth-child(8n+8) {
  height:40vw }
   }
  @media only screen and (max-width:767px) {
  .comic-item:nth-child(8n+8) {
  width:100%;
  height:45vw }
   }
  @media only screen and (max-width:767px) and (max-width:767px) {
  .comic-item:nth-child(8n+8) {
  height:60vw }
   }
  @media only screen and (max-width:767px) and (max-width:480px) {
  .comic-item:nth-child(8n+8) {
  height:90vw }
   }
  @media only screen and (max-width:767px) and (min-width:768px) {
  .comic-item:nth-child(8n+8) .comic-item-content {
  width:50%;
  height:50% }
   }
.comic-item-content {
  background:rgba(167,3,3,.9);
  height:calc(10%);
  width:calc(100%);
  display:-ms-flexbox;
  display:flex;
  -ms-flex-flow:column nowrap;
  flex-flow:column nowrap;
  -ms-flex-pack:center;
  justify-content:center;
  -ms-flex-align:center;
  align-items:center;
  text-align:center;
  opacity:0;
  transition:opacity .2s,height .2s .1s,width .2s .1s,transform .3s;
  z-index:2;
}
.spiderman .comic-item-content {
  height:calc(5%) !important;
}
.comic-item-title {
  font-size:2em;
  opacity:0;
  transform:scale(1.1);
  transition:opacity .3s,transform .3s;
  overflow:hidden;
  position:relative;
  margin-bottom:0px;
  width:80%;
  color:#fff;
}
  @media only screen and (max-width:1200px) {
  .comic-item-title {
  font-size:2.7vw }
   }
  @media only screen and (max-width:1023px) {
  .comic-item-title {
  font-size:3vw }
   }
  @media only screen and (max-width:767px) {
  .comic-item-title {
  font-size:5vw }
   }
  @media only screen and (max-width:480px) {
  .comic-item-title {
  font-size:7vw }
   }
  .comic-item-title span {
  display:block;
  transition:transform .3s .3s;
  transform:translateY(100%) }
  .comic-item video {
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  min-width:100%;
  min-height:100%;
  z-index:1 }
.portfolio-wrapper, .gallery-wrapper, .production-wrapper {
  background:#171717;
  padding:7vw;
}
@media only screen and (max-width:1023px) {
  .portfolio-wrapper, .gallery-wrapper, .production-wrapper {
    padding:100px 20px;
    padding-top:60px;
    padding-bottom:60px;
  }
 }
@media only screen and (max-width:480px) {
  .portfolio-wrapper, .gallery-wrapper, .production-wrapper {
    padding-top:40px;
    padding-bottom:40px;
  }
 }
.portfolio-diptych, .gallery-diptych, .production-diptych {
  display:-ms-flexbox;
  display:flex;
  -ms-flex-flow:row wrap;
  flex-flow:row wrap;
  -ms-flex-align:stretch;
  align-items:stretch;
}
@media only screen and (max-width:1200px) {
  .portfolio-diptych, .gallery-diptych, .production-diptych {
    -ms-flex-align:center;
    align-items:center;
  }
 }
.portfolio-diptych-item, .gallery-diptych-item, .production-diptych-item {
  width:50%;
  min-height:65vw;
}
@media only screen and (max-width:767px) {
  .portfolio-diptych-item, .gallery-diptych-item, .production-diptych-item {
    width:100%;
  }
}
.portfolio-diptych-item.content, .gallery-diptych-item.content, .production-diptych-item.content {
  padding:7vw 5vw 6vw 10vw;
}
@media only screen and (max-width:1500px) {
  .portfolio-diptych-item.content, .gallery-diptych-item.content, .production-diptych-item.content {
    padding:7vw 5vw 6vw 10vw;
  }
}
@media only screen and (max-width:1023px) {
  .portfolio-diptych-item.content, .gallery-diptych-item.content, .production-diptych-item.content {
    padding:80px 60px;
    }
}
@media only screen and (max-width:480px) {
  .portfolio-diptych-item.content, .gallery-diptych-item.content, .production-diptych-item.content {
    padding:60px 40px;
  }
}
.portfolio-diptych-item.image, .gallery-diptych-item.image, .production-diptych-item.image {
  background:#101010 50%/cover no-repeat;
  position:relative;
  overflow:hidden;
}
@media only screen and (max-width:1200px) {
  .portfolio-diptych-item.image, .gallery-diptych-item.image, .production-diptych-item.image {
    height:80vw;
  }
}
@media only screen and (max-width:767px) {
  .portfolio-diptych-item.image, .gallery-diptych-item.image, .production-diptych-item.image {
    height:120vw;
    -ms-flex-order:-1;
    order:-1;
    transform:none!important;
  }
}
.portfolio-diptych-item.image video, .gallery-diptych-item.image video, .production-diptych-item.image video {
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  min-width:100%;
  min-height:100%;
  width:100%;
  height:100%;
  -o-object-position:center center;
  object-position:center center;
  -o-object-fit:cover;
  object-fit:cover;
}
.portfolio-diptych .portfolio-title, .gallery-diptych .portfolio-title, .production-diptych .portfolio-title {
  position:relative;
  left:-3vw }
  @media only screen and (max-width:1023px) {
  .portfolio-diptych .portfolio-title, .gallery-diptych .portfolio-title, .production-diptych .portfolio-title {
  left:0 }
   }
.portfolio-title, .gallery-title, .production-title {
  color:#fff;
  padding-bottom:.5em;
}
.portfolio-title, .gallery-title, .production-title {
  font-size:2.5rem;
}
  @media only screen and (max-width:1023px) {
  .portfolio-title, .gallery-title, .production-title {
  font-size:5vw }
   }
  @media only screen and (max-width:767px) {
  .portfolio-title, .gallery-title, .production-title {
  font-size:8vw }
   }
  .portfolio-digital .portfolio-date {
    font-size:2rem;
    text-decoration:underline;
  }
  .portfolio-date, .gallery-subtitle, .production-subtitle {
    padding-bottom:25px;
    letter-spacing:.12em;
    text-transform:uppercase;
    color:#fff; 
  }
  @media only screen and (max-width:1200px) {
  .portfolio-date, .gallery-subtitle, .production-subtitle {
  font-size:14px }
   }
  @media only screen and (max-width:767px) {
  .portfolio-date, .gallery-subtitle, .production-subtitle {
  font-size:12px }
   }
  .portfolio-content, .gallery-content, .production-content {
    background-color:#202020; 
  }
  .portfolio-content .text, .gallery-content .text, .production-content .text, .portfolio-content h3, .gallery-content h3, .production-content h3, .portfolio-content h4, .gallery-content h4, .production-content h4, .portfolio-wrapper .portfolio-content a, .portfolio-wrapper .gallery-content a, .portfolio-wrapper .production-content a {
    color:#fff; 
  }
  .portfolio-content ul.text li:before, .gallery-content ul.text li:before, .production-content ul.text li:before {
    color:#c5b286;
}
  .content .text {
  margin-top:1em }
  .portfolio-content .text+.portfolio-date {
  margin-top:3em }
  .content ul.text li {
  list-style-type:none;
  position:relative;
  padding-left:1em }
  .content ul.text li:before {
  content:"- ";
  position:absolute;
  left:0;
  top:0;
  color:#c5b286;
}
  .portfolio-digital {
    background-color:#101010; 
  }
  .portfolio-digital .portfolio-title {
  padding-left:.5em }
  .portfolio-digital-items {
  display:-ms-flexbox;
  display:flex;
  -ms-flex-flow:row wrap;
  flex-flow:row wrap;
  -ms-flex-pack:justify;
  justify-content:space-between;
  -ms-flex-align:stretch;
  align-items:stretch }
  .portfolio-digital-item {
  width:calc(50% - 10px);
  padding:3vw }
  @media only screen and (max-width:767px) {
  .portfolio-digital-item {
  width:100%;
  padding:60px }
   }
  @media only screen and (max-width:480px) {
  .portfolio-digital-item {
  padding:30px }
   }
  @media only screen and (max-width:767px) {
  .portfolio-digital-item+.portfolio-digital-item {
  margin-top:20px }
   }
  .portfolio-digital-featured {
    overflow:hidden;
    background-color:#101010;
    padding:10vw 0;
    min-height:100vh;
  }
  .portfolio-think {
  background-color:#262626;
  text-align:center }
  @media only screen and (max-width:1200px) {
  .portfolio-think-header {
  padding-left:10%;
  padding-right:10% }
   }
  @media only screen and (max-width:767px) {
  .portfolio-think-header {
  padding-left:30px;
  padding-right:30px }
   }
  @media only screen and (max-width:480px) {
  .portfolio-think-header {
  padding-left:10px;
  padding-right:10px }
   }
  @media only screen and (max-width:1023px) {
  .portfolio-think-header br {
  display:none }
   }
  .portfolio-think-subtitle {
  color:#fff;
  font:400 normal 50px/1.2;
  letter-spacing:.06em;
  margin-bottom:1em }
  @media only screen and (max-width:1200px) {
  .portfolio-think-subtitle {
  font-size:40px }
   }
  @media only screen and (max-width:1023px) {
  .portfolio-think-subtitle {
  font-size:30px }
   }
  @media only screen and (max-width:767px) {
  .portfolio-think-subtitle {
  font-size:24px }
   }
  .portfolio-think-text {
  color:#6e6e6e;
  font:400 normal 22px/1.3;
  letter-spacing:.06em;
  margin-bottom:3em }
  @media only screen and (max-width:1023px) {
  .portfolio-think-text {
  font-size:18px }
   }
  .portfolio-think-video {
  height:50vw;
  background:#292929;
  margin:0 auto;
  max-width:1200px }
  @keyframes h {
  0% {
  transform:scale(0) }
  40% {
  transform:scale(1.2) }
  50% {
  transform:scale(1) }
  60% {
  transform:rotate(-10deg) }
  70% {
  transform:rotate(10deg) }
  85% {
  transform:rotate(-10deg) }
  to {
  transform:rotate(0) }
   }
  .about-quality.animate svg {
  animation:h 1s linear forwards;
  height:100%;
  width:auto }
  .about-quality svg {
  transform:scale(0) }
  .about-m {
  position:relative;
  z-index:1 }
.about-m-mask {
  height:45vw;
  -webkit-mask-image:url(../images/enso4.png);
  mask-image:url(../images/enso4.png);
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-size:40% auto;
  mask-size:40% auto;
  -webkit-mask-position:center center;
  mask-position:center center;
  overflow:hidden;
  position:relative;
  top:-15vw;
}
.about-m-parallax {
  left:0;
  top:0;
  width:100%;
  height:120%;
  background:transparent url('../images/m-bg.jpg') 50%/cover no-repeat;
}
.about-cc {
  background:#fff url('../images/cc-bg.svg') 50%/101% auto no-repeat;
  position:relative;
}
.about-cc:before {
  content:"";
  position:absolute;
  left:50%;
  top:-25vw;
  width:2px;
  background-color:#a70303;
  height:0;
  transition:height 2s;
}
  @media only screen and (max-width:1023px) {
  .about-cc:before {
  width:1px }
   }
  .about-cc.to-heart:before {
  height:48vw }
  .about-cc.to-bambooEnso:before {
  height:90vw }
.about-cc.to-compassion:before {
  height:128vw;
}
  .about-cc.to-samurai:before {
  height:158vw }
  .about-cc.line-no-duration:before {
  transition-duration:0s }
.about-cc-item {
  margin:0 auto;
  padding-left:14%;
  padding-right:7%;
  position:relative;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-flow:column nowrap;
  flex-flow:column nowrap;
  height:65vw;
}
@media only screen and (max-width:767px) {
  .about-cc-item {
    padding-left:10%;
    padding-right:10%;
  }
}
.about-cc-item.heart {
  -ms-flex-pack:end;
  justify-content:flex-end;
  padding-bottom:5vw;
  color:#fff;
}
.heart .about-cc-text {
  color:#fff;
}
.compassion .about-cc-text {
  color:#101010;
}
@media only screen and (max-width:767px) {
  .about-cc-item.heart {
  text-align:center }
   }
.about-cc-item.heart .about-cc-img {
  transform:translate(-50%,-95%);
  margin-top:5vw;
}
  @media only screen and (max-width:767px) {
  .about-cc-item.heart .about-cc-img {
  transform:translate(-54%,-105%) }
   }
.about-cc-item.compassion {
  -ms-flex-pack:start;
  justify-content:flex-start;
  text-align:right;
  padding-top:5vw;
}
@media only screen and (max-width:767px) {
  .about-cc-item.compassion {
    text-align:center;
  }
}
.about-cc-item.compassion .about-cc-img {
  transform:translate(-54%,-25%);
}
@media only screen and (max-width:767px) {
  .about-cc-item.compassion .about-cc-img {
    transform:translate(-54%,-83%);
  }
}
  .about-cc-content {
  position:relative;
  z-index:2 }
  .about-cc-title {
  font:700 normal 7vw/.8;
  text-transform:uppercase;
  color:#a70303;
  margin-bottom:.4em }
  @media only screen and (max-width:767px) {
  .about-cc-title {
  font-size:11vw }
   }
  .about-cc-text {
  font:400 normal 1.8vw/1.2;
  color:#58595b;
  letter-spacing:.06em }
  @media only screen and (max-width:767px) {
  .about-cc-text {
  font-size:5vw }
   }
  .about-cc-img {
  position:absolute;
  left:50%;
  top:50%;
  z-index:1 }
  .about-cc-bambooEnso {
  position:absolute;
  left:50%;
  top:50%;
  width:15%;
  transform:translate(-45%,-50%) }
.about-samurai {
  padding-bottom:10vw;
  background-color:#101010;
  text-align:center;
  padding:3vw 0 0 6vw;
}
.about-samurai svg {
  display:block;
  width:20%;
  margin:0 auto;
  fill:transparent;
  stroke:#a70303;
  stroke-width:1;
  stroke-miterlimit:10;
  stroke-dasharray:600;
  stroke-dashoffset:600;
  stroke-width:.75px;
  transition:stroke-dashoffset 4s linear;
  overflow:visible;
}
  @media only screen and (max-width:1200px) {
  .about-samurai svg {
  stroke-width:1px }
   }
  .about-samurai svg.animate {
  stroke-dashoffset:0 }
  .about-fresh {
  background-color:#202020;
  overflow:hidden }
  .about-fresh .intro {
  padding-bottom:7vw;
  padding-left:0!important;
  padding-right:0!important }
  .about-fresh .intro .title {
  font-size:4vw }
  @media only screen and (max-width:1023px) {
  .about-fresh .intro .title {
  font-size:6vw }
   }
  @media only screen and (max-width:767px) {
  .about-fresh .intro .title {
  font-size:8vw }
   }
  .photoGrid {
  background-color:#101010 }
  .photoGrid .intro {
  padding-bottom:10vw }
  .photoGrid .intro .title {
  color:#efefef }
  .photoGrid .intro .text {
  color:#7e7e7e }
  .photoGrid-grid {
  display:-ms-flexbox;
  display:flex;
  -ms-flex-flow:row wrap;
  flex-flow:row wrap;
  -ms-flex-pack:center;
  justify-content:center;
  width:70%;
  margin:0 auto }
  @media only screen and (max-width:1023px) {
  .photoGrid-grid {
  width:85% }
   }
  @media only screen and (max-width:767px) {
  .photoGrid-grid {
  width:calc(100% - 40px) }
   }
  .photoGrid-grid.secondary .photoGrid-grid-item:nth-child(3n+1) {
  z-index:3 }
  .photoGrid-grid.secondary .photoGrid-grid-item:nth-child(3n+2) {
  margin-left:-1vw;
  z-index:2 }
  .photoGrid-grid.secondary .photoGrid-grid-item:nth-child(3n+3) {
  margin-left:-1vw;
  z-index:1 }
  .photoGrid-grid-item {
  width:33.33333%;
  position:relative;
  margin-bottom:10vw }
  @media only screen and (max-width:767px) {
  .photoGrid-grid-item {
  width:50% }
   }
  .photoGrid-grid-item:before {
  content:"";
  position:absolute;
  left:50%;
  width:1px;
  height:0;
  top:-2vw;
  background-color:#c5b286;
  transition:height .3s;
  z-index:3 }
  .photoGrid-grid-item:hover:before {
  height:4vw }
  .photoGrid-grid-item:hover .photoGrid-grid-item-content {
  opacity:1 }
  .photoGrid-grid-item:hover .photoGrid-grid-item-headshot {
  -webkit-filter:grayscale(100%);
  filter:grayscale(100%) }
  .photoGrid-grid-item:nth-child(3n+2) {
  top:-4vw }
  .photoGrid-grid-item:nth-child(3n+3) {
  top:-2vw }
  .photoGrid-grid-item-headshot {
  display:block;
  width:100%;
  transition:-webkit-filter .5s;
  transition:filter .5s;
  transition:filter .5s,-webkit-filter .5s }
  .photoGrid-grid-item-content {
  position:absolute;
  left:0;
  top:0;
  height:100%;
  width:100%;
  z-index:1;
  background-color:rgba(0,0,0,.8);
  display:-ms-flexbox;
  display:flex;
  -ms-flex-flow:column nowrap;
  flex-flow:column nowrap;
  -ms-flex-pack:center;
  justify-content:center;
  -ms-flex-align:center;
  align-items:center;
  text-align:center;
  opacity:0;
  transition:opacity .5s }
  .photoGrid-grid-item-icon {
  display:block;
  width:20% }
  @media only screen and (max-width:767px) {
  .photoGrid-grid-item-icon {
  width:20% }
   }
.photoGrid-grid-item-title {
  text-transform:uppercase;
  letter-spacing:.2em;
  color:#fff;
  margin:.5em 0 .2em;
}
  @media only screen and (max-width:1023px) {
  .photoGrid-grid-item-title {
  font-size:2.4vw }
   }
@media only screen and (max-width:767px) {
  .photoGrid-grid-item-title {
    font-size:4.3vw;
  }
}
.photoGrid-grid-item-subtitle {
  margin-top:5px;
  letter-spacing:.1em;
}
  @media only screen and (max-width:767px) {
  .photoGrid-grid-item-subtitle {
  font-size:3vw }
   }
  .project-group {
  padding:10vw 0;
  background-size:cover;
  background-position:50%;
  background-repeat:no-repeat }
  .project-group.no-padding {
  padding:0!important;
  margin-top:0!important }
  .project-item {
  position:relative;
  z-index:1 }
  .project-item+.project-item {
  margin-top:10vw }
  .project-item-img {
  display:block;
  margin:0 auto }
  .project-item-img.large {
  width:90%;
  max-width:1500px }
  .project-item-img.medium {
  width:90%;
  max-width:1200px }
  .project-item-img.small {
  width:90%;
  max-width:900px }
  .project-item.ipad-floating {
  margin-left:auto;
  margin-right:auto }
  .project-item.ipad-floating.landscape {
  max-width:1400px;
  width:90% }
  .project-item.ipad-floating.portrait {
  max-width:1000px;
  width:80% }
  .project-gallery {
  display:-ms-flexbox;
  display:flex;
  -ms-flex-flow:row wrap;
  flex-flow:row wrap;
  overflow:hidden }
  .project-gallery-item {
  background-position:50%;
  background-size:cover;
  background-repeat:no-repeat;
  height:50vw;
  position:relative;
  overflow:hidden }
  .project-gallery-item.small {
  width:30% }
  .project-gallery-item.medium {
  width:70%;
  transition-delay:.2s }
  .project-gallery-item.large {
  width:100% }
  .project-gallery-item video {
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  min-width:100%;
  min-height:100% }
  .project-next {
  text-align:center;
  height:30vw;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-flow:row nowrap;
  flex-flow:row nowrap;
  -ms-flex-pack:center;
  justify-content:center;
  -ms-flex-align:center;
  align-items:center;
  text-decoration:none;
  background-color:#101010;
  background-position:50%;
  background-size:100% auto;
  background-repeat:no-repeat;
  position:relative;
  color:#ccc;
  transition:color .4s cubic-bezier(.12,.84,.66,.95),background-size .4s cubic-bezier(.12,.84,.66,.95),-webkit-filter .4s cubic-bezier(.12,.84,.66,.95);
  transition:color .4s cubic-bezier(.12,.84,.66,.95),background-size .4s cubic-bezier(.12,.84,.66,.95),filter .4s cubic-bezier(.12,.84,.66,.95);
  transition:color .4s cubic-bezier(.12,.84,.66,.95),background-size .4s cubic-bezier(.12,.84,.66,.95),filter .4s cubic-bezier(.12,.84,.66,.95),-webkit-filter .4s cubic-bezier(.12,.84,.66,.95);
  -webkit-filter:grayscale(100%);
  filter:grayscale(100%) }
  @media only screen and (max-width:767px) {
  .project-next {
  height:40vw }
   }
  .project-next:focus,.project-next:hover {
  color:#fff;
  background-size:105% auto;
  -webkit-filter:grayscale(0);
  filter:grayscale(0) }
  .project-next:focus:before,.project-next:hover:before {
  background:rgba(32,32,32,.8) }
  .project-next:focus:after,.project-next:hover:after {
  width:80px;
  margin-left:20px;
  opacity:1 }
  @media only screen and (max-width:767px) {
  .project-next:focus:after,.project-next:hover:after {
  width:60px;
  margin-left:10px }
   }
@media only screen and (max-width:480px) {
  .project-next:focus:after,.project-next:hover:after {
    width:40px;
  }
 }
  .project-next:before {
  content:"";
  position:absolute;
  left:0;
  top:0;
  height:100%;
  width:100%;
  background:rgba(32,32,32,.9);
  z-index:0;
  transition:background-color .4s cubic-bezier(.12,.84,.66,.95) }
  .project-next:after {
  content:"";
  display:block;
  width:0;
  height:7px;
  background:transparent url(../images/next-project-arrow.svg) 100%/auto 100% no-repeat;
  transition:width .4s cubic-bezier(.12,.84,.66,.95),margin-left .4s cubic-bezier(.12,.84,.66,.95),opacity .4s cubic-bezier(.12,.84,.66,.95);
  position:relative;
  z-index:1;
  opacity:.5 }
  .project-next-text {
  font:700 normal 4vw/1.2;
  -ms-flex-flow:row nowrap;
  flex-flow:row nowrap;
  -ms-flex-pack:center;
  justify-content:center;
  -ms-flex-align:center;
  align-items:center;
  position:relative;
  z-index:1 }
@media only screen and (max-width:767px) {
  .project-next-text {
    font-size:6vw; 
  }
}

#homeEnso circle {
  position:relative;
  fill:#eb2a01;
  stroke-width:5;
  stroke-miterlimit:10;
  z-index:-1;
}
.cultureGallery {
  background-image:url('../photography/bw/breath.jpg');"
  background-position:center;
}
.portraitsGallery {
  background-image:url('../photography/bw/rod.jpg');
  background-position:bottom;
}
.martialartsGallery {
  background-image:url('../photography/bw/generations.jpg');
  background-position:top;
}
#photography .martialartsGallery {
  background-position:left;
}
.landscapesGallery {
  background-image:url('../photography/bw/lava_light.jpg');
  background-position:center;
}
.animalsGallery {
  background-image:url('../photography/bw/underwater_honu.jpg');
  background-position:top left;
}
.venom {
  background-image:url('../artwork/images/rod.jpg');
  background-size:100% 100%;
  background-position:center center;
}
.carnage {
  background-image:url('../artwork/images/jonathan.jpg');
  background-size:100% 100%;
  background-position:center center;
}
.juggernaut {
  background-image:url('../artwork/images/dg.jpg');
  background-size:100% 100%;
  background-position:center center;
}
.kratos {
  background-image:url('../artwork/images/vargas.jpg');
  background-size:100% 100%;
  background-position:center center;
}
.gary {
  background-image:url('../artwork/images/gary.jpg');
  background-size:100% 100%;
  background-position:center center;
}
.rocco {
  background-image:url('../images/rocco.jpg');
  background-size:100% 100%;
  background-position:center center; 
}
.core {
  background-image:url('../images/core.jpg');
  background-size:100% 100%;
  background-position:center center; 
}
.unseen {
  background-image:url('../images/unseen.jpg');
  background-size:100% 100%;
  background-position:center center; 
}


.tech-intro {
  height:100vh;
  background-color:#000;
  color:#fff;
}

body::-webkit-scrollbar {
    position:absolute;
    right:0;
    top:0;
    z-index:998;
    width:7.5px;
    height:100%;
    transform-origin:center right;
    transition:transform .3s, opacity .3s;
    background-color:transparent;
    opacity:1;
}
 
body::-webkit-scrollbar-track {
    -webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3);
    background-color:transparent;
}
 
body::-webkit-scrollbar-thumb {
  position:absolute;
    top:0;
    right:0;
    background-color:rgba(245, 242, 235, .4);
    width:7.5px;
    height:22%;
    border:2px solid #000;
    border-radius:20px;
}

@media only screen and (max-width:799px)  {
  #introSection {
    width:100%;
    top:35vh;
  }
  .header-nav.open .header-nav-item a {
    font-size:1em; 
  }
  #introSection-inner img {
    max-width:100%;
  }
  .home-productions:before {
    transform:translate(-50%,0);
    height:100%;
  }
  .portfolios li {
    width:100%;
    height:100%;
  }
  .about p {
    width:100%;
    font-size:1.2em;
    margin:0 0 20px 0;
  }
  .about h2 {
    font-size:2em;
  }
  .about-cc-content, .about-cc-img {
    display:none;
  }
  .about-cc-bambooEnso {
    width:80%;
  }
  .about-samurai {
    padding:3vw 0 0 18vw;
  }
}

@media only screen and (min-width:768px) {
  header {
    position:fixed;
    background:#171717;
    height:11vh;
    width:100vw;
    margin-bottom:-11vh;
    z-index:999;
  }
.header-logo {
    top:3px;
  }
}
@media only screen and (max-width:767px) {
  header {
    position:fixed;
    background:rgba;
    height:11vh;
    width:100vw;
    margin-bottom:-11vh;
    z-index:999;
  }
  .owl-carousel .owl-dots.disabled,.owl-carousel .owl-nav.disabled {
    display:none; 
  }
}

.hidden {
  display:none;
  visibility:hidden;
}

.owl-prev, .owl-next {
  border:1px solid #fff;
  padding:15px;
}
.owl-prev:hover, .owl-next:hover {
  color:#fff !important;
  background:#000;
}
.portfolio-wrapper a {
  color:#fff;
  text-decoration:underline;
}

@media all and (min-width:800px) and (max-width:1023px) { 
  #introSection {
    top:50%;
    transform:translate(-50%,-15%);
  }
  .portfolio-wrapper .text {
    font-size:1.5em;
  }
}
@media all and (max-width:799px) {
  #logo {
    font-size:1.4rem;
  }
  nav {
    position:fixed;
    top:0;
    left:0;
    width:100vw;
    height:100vh;
    z-index:999;
  }
  .header-nav-items {
    width:100%;
    margin:65% auto;
  }
  .header-nav-item p {
    top:0px;
    font-size:2rem;
  }
  .home-header {
    font-size:3em;
  }
  .home-text {
    font-size:1.6em;
  }
  .inline {
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
  }
  .inline li {
    display:block;
    font-size:2rem;
    text-align:center;
    line-height:2;
    padding:0;
  }
  #navAbout {
    position:relative;
    margin-top:0;
    float:none;
    border:0;
    padding:0;
  }
  .portfolio-title, .gallery-title, .production-title {
    font-size:6vw;
  }
  .portfolio-diptych-item.content, .gallery-diptych-item.content, .production-diptych-item.content {
    padding:60px 20px;
  }
  .portfolio-digital-item ul {
    list-style-type:disc;
  }
  .text {
    font-size:1.5em;
  }
  .overview {
    padding:120px 10% 120px;
  }
  .overview.show .overview-rule {
    height:0px;
    width:260px;
  }
  .about .overview-wrapper p {
    width:95%;
    font-size:1.5em;
    margin:0 auto 20px;
  }
  .footer-title, .about .footer-title {
    font-size:1.4rem;
  }
}