@charset "UTF-8";
/*
* Import SASS files
*/
/* abstracts */
/* -- Background Colors -- */
/* $bg--color-grey: #f0f0f0; */
/* -- Type Colors -- */
/* ex: $f--color-blue: #0C4EF6; */
/* -- Z-index -- */
/* $z--sidebars-icon: 9100; */
/* Load fonts */
/* font size */
/* font style */
/* Vendor prefixes to animations (revised with Autoprefixer)*/
/* load fonts */
/*@include fontFace('Fugue', '../fonts/fugue_regular');*/
/*@include fontFace('NeuzeitGro-Reg', '../fonts/webfonts/35BC9C_0_0');*/
@font-face {
  font-family: 'NeuzeitGro-Reg';
  src: url("../fonts/webfonts/35BC9C_0_0.eot");
  src: url("../fonts/webfonts/35BC9C_0_0.eot?#iefix") format("embedded-opentype"), url("../fonts/webfonts/35BC9C_0_0.woff2") format("woff2"), url("../fonts/webfonts/35BC9C_0_0.woff") format("woff"), url("../fonts/webfonts/35BC9C_0_0.ttf") format("truetype"); }
@font-face {
  font-family: 'AtlasGrotesk-Reg';
  src: url("../fonts/webfonts/AtlasGrotesk-Regular.otf"); }
/*base */
/*
* Override bootstrap styles
*/
/* -- Navbar -- */
.nav > li > a:hover,
.nav > li > a:focus {
  text-decoration: underline;
  background-color: inherit; }

.nav > li.active > a,
.nav > li.active > a:hover,
.nav > li.active > a:focus {
  color: grey; }

.nav > li > a:active,
.nav > li > a:hover,
.nav > li > a:focus {
  color: grey; }

.navbar {
  z-index: 9999; }

.navbar-header {
  z-index: 2; }

.navbar-toggle {
  padding: 9px 13px;
  margin-right: 0;
  border: 0; }

.navbar-toggle .icon-bar {
  background-color: black; }

.navbar-nav {
  margin: 0;
  margin-left: 15px;
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%); }

.navbar-collapse.collapsing {
  -webkit-transition: height 0.01s;
  -moz-transition: height 0.01s;
  -ms-transition: height 0.01s;
  -o-transition: height 0.01s;
  transition: height 0.01s; }

@media (max-width: 767px) {
  .navbar-collapse {
    position: fixed;
    left: 0;
    top: 0;
    height: 100vh;
    width: 100vw;
    background-color: white;
    text-align: center;
    z-index: -1; } }
.navbar-nav > li > a {
  outline: none;
  padding-right: 15px; }

.navbar-right ul > li > a {
  padding-right: 0;
  padding-left: 15px; }

.navbar-right .navbar-nav {
  margin: 30px;
  margin-right: 15px; }

@media (max-width: 767px) {
  .navbar-right ul > li > a {
    padding-right: 0;
    padding-left: 0; }

  .navbar-right .navbar-nav {
    margin: 0; } }
/*theme*/
.navbar-brand, .navbar-nav > li > a {
  text-shadow: none; }

/*
* Hamburgers from Jonathan Suh
*/
.hamburger {
  padding: 0; }

.hamburger-box {
  width: 30px;
  height: 22.5px; }

.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
  width: 30px;
  height: 3px;
  border-radius: 0; }

/*
* Slick - Slider
*/
.slick-slide {
  outline: 0; }

/*
* Global css style
*/
* {
  color: black; }
  * ::-moz-selection {
    color: white;
    background: black; }
  * ::selection {
    color: white;
    background: black; }
  * :focus {
    outline: none; }
  * ::-moz-focus-inner {
    border: 0; }
  * ::-moz-focus-outer {
    border: 0; }

a {
  color: black;
  -webkit-transition: color 0.1s ease-in-out;
  transition: color 0.1s ease-in-out; }
  a:hover {
    color: black;
    text-decoration: none;
    background-color: none;
    -webkit-transition: color 0.1s ease-in-out;
    transition: color 0.1s ease-in-out; }
  a:active, a:focus {
    text-decoration: none;
    color: black !important; }

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

img {
  width: 100%; }

/* -- make a video responsive -- */
.videoContainer {
  position: relative;
  width: calc(100% - 10px);
  height: 0;
  padding-bottom: 56.25%; }

.videoContainer iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }

/*
* Global classes
*/
.vertical-align {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%); }

.horz-align {
  position: relative;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%); }

.vert-horz-align {
  position: relative;
  top: 50%;
  left: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%); }

.fullheight {
  height: 100vh; }

.disp--none {
  display: none; }

.visb--none {
  visibility: hidden; }

.float--left {
  float: left; }

.float--right {
  float: right; }

.no-pad {
  padding: 0; }

.no-marg {
  margin: 0; }

.text--center {
  text-align: center; }

.marg--bottom-s {
  margin-bottom: 7.5px; }
  @media (min-width: 768px) {
    .marg--bottom-s {
      margin-bottom: 15px; } }

.marg--bottom-m {
  margin-bottom: 15px; }
  @media (min-width: 768px) {
    .marg--bottom-m {
      margin-bottom: 30px; } }

.marg--bottom-l {
  margin-bottom: 30px; }
  @media (min-width: 768px) {
    .marg--bottom-l {
      margin-bottom: 60px; } }

/*
* Global in chew website
*/
* {
  font-size: 18px;
  font-size: 1.8rem;
  font-family: "AtlasGrotesk-Reg";
  font-weight: regular;
  line-height: 24px;
  line-height: 2.4rem; }

/* -- hide part of lines in xs sm -- */
.hide_, .hidetop, .hidebottom-l, .hidebottom-r {
  position: fixed;
  width: 100%;
  height: 15px;
  z-index: 2;
  background-color: white; }

.hidetop {
  left: 0;
  top: 0; }

.hidebottom-l {
  width: 18px;
  bottom: 0;
  left: 0; }

.hidebottom-r {
  width: 18px;
  bottom: 0;
  right: 0; }

body {
  overflow-x: hidden;
  position: relative;
  float: left;
  margin: 7px;
  margin-top: 15px;
  margin-bottom: 15px;
  width: calc(100vw - 14px);
  height: auto;
  min-height: calc(100vh - 30px);
  border-left: 2px solid black;
  border-right: 2px solid black;
  overflow-y: auto; }
  @media (min-width: 992px) {
    body {
      margin: 0;
      width: 100%;
      height: 100%;
      border-left: 0px solid black;
      border-right: 0px solid black;
      overflow-y: auto; } }

.nopadtop {
  padding-top: 0 !important; }

.nomargtop {
  margin-top: 0 !important; }

.underlineOnHover {
  line-height: 20px !important;
  line-height: 2rem !important;
  margin-bottom: 2px !important;
  text-decoration: none;
  border-bottom: 2px solid transparent; }
  .underlineOnHover:hover {
    text-decoration: none;
    border-bottom: 2px solid black; }

.underline {
  border-bottom: 2px solid black; }
  .underline:hover {
    text-decoration: none;
    border-bottom: 2px solid black; }

/* for fullscreen video/slider
.fix-footer {
  min-height: calc(100vh - 70px);
}
*/
/* components */
/* layout */
header {
  padding: 15px; }

.header__menu {
  position: fixed;
  display: inline-block;
  top: 0;
  z-index: 1000;
  padding: 0;
  padding-top: 15px;
  padding-bottom: 10px;
  width: calc(100% - 48px);
  background-color: white; }
  @media (min-width: 992px) {
    .header__menu {
      padding: 17px;
      padding-top: 20px;
      width: calc(100% - 30px); } }
  .header__menu div {
    padding: 0; }
  .header__menu .menu-links {
    padding-top: 3px;
    padding-left: 0; }
    @media (min-width: 768px) {
      .header__menu .menu-links {
        padding-top: 0;
        padding-left: 15px; } }
  .header__menu h1,
  .header__menu a,
  .header__menu p {
    float: left;
    padding: 0;
    margin: 0;
    display: inline-block;
    font-size: 18px;
    font-size: 1.8rem;
    font-family: "AtlasGrotesk-Reg";
    font-weight: normal;
    line-height: 20px;
    line-height: 2rem; }
  .header__menu a {
    outline: none !important;
    color: black; }
    .header__menu a:hover {
      outline: none !important;
      color: black; }
    .header__menu a:active {
      outline: none !important;
      color: black; }
  .header__menu .nounderline {
    text-decoration: none; }
  .header__menu img {
    position: absolute;
    right: 0;
    height: 25px;
    width: auto;
    top: 0;
    margin-top: 15px; }
    @media (min-width: 768px) {
      .header__menu img {
        top: inherit;
        margin-top: 0; } }

@media (min-width: 992px) {
  .header__menu--nobckg {
    background-color: transparent; } }
.header__brand:hover {
  animation: rotation 2s infinite linear;
  -webkit-animation: rotation 2s infinite linear; }

@-webkit-keyframes rotation {
  from {
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg); }
  to {
    transform: rotate(359deg);
    -webkit-transform: rotate(359deg); } }
.containter_base {
  margin-top: 15px; }
  @media (min-width: 992px) {
    .containter_base {
      height: calc(100vh - 30px - 70px);
      margin-top: 70px;
      padding: 15px;
      padding-right: 11px; } }
  .containter_base h3,
  .containter_base a,
  .containter_base p {
    padding: 0;
    margin: 0;
    display: table;
    font-size: 18px;
    font-size: 1.8rem;
    font-family: "AtlasGrotesk-Reg";
    font-weight: regular;
    line-height: 24px;
    line-height: 2.4rem; }

@media (min-width: 768px) {
  .baseColumn {
    border-width: 0; }
    .baseColumn:nth-of-type(2) {
      border-left: 2px solid black; }
    .baseColumn:nth-of-type(5) {
      border-left: 2px solid black; } }
@media (min-width: 992px) {
  .baseColumn {
    border-left: 2px solid black;
    height: 100%;
    overflow: hidden; }
    .baseColumn:last-child {
      border-left: 2px solid black;
      border-right: 2px solid black; } }
/* -- the fixed title -- */
.baseColumn__type {
  z-index: 2;
  background-color: white;
  border-bottom: none;
  text-align: center;
  margin-top: 30px; }
  .baseColumn__type p {
    display: block; }
  .baseColumn__type.nomarg {
    margin-top: 0px; }
  @media (min-width: 768px) {
    .baseColumn__type {
      margin-top: 0; } }
  @media (min-width: 992px) {
    .baseColumn__type {
      position: fixed;
      width: calc(25% - 30px - 10px);
      height: 35px;
      top: 112px; } }

/* -- content -- */
.baseColumn__content {
  position: relative;
  height: 100%;
  width: 100%;
  overflow: hidden;
  margin-bottom: -20px; }
  @media (min-width: 768px) {
    .baseColumn__content {
      min-height: 80%; } }
  @media (min-width: 992px) {
    .baseColumn__content {
      width: calc(100% + 10px);
      margin-top: 30px;
      padding-bottom: 30px;
      margin-bottom: 0; } }
  .baseColumn__content .columnRow__year {
    padding-bottom: 10px;
    border-bottom: 2px solid black; }
    .baseColumn__content .columnRow__year p {
      padding-left: 35px;
      padding-top: 25px; }
    .baseColumn__content .columnRow__year:first-of-type p {
      padding-top: 0; }
  .baseColumn__content .columnRow {
    padding-top: 10px;
    padding-bottom: 10px;
    border-bottom: 2px solid black; }
    .baseColumn__content .columnRow p {
      padding: 0;
      margin: 0; }
      .baseColumn__content .columnRow p:nth-child(2)::before {
        /*content: "— ";*/ }
    .baseColumn__content .columnRow a {
      opacity: 0.6;
      line-height: 20px !important;
      line-height: 2rem !important;
      margin-bottom: 2px !important;
      text-decoration: none;
      border-bottom: 2px solid transparent; }
      .baseColumn__content .columnRow a:hover {
        opacity: 1;
        text-decoration: none;
        border-bottom: 2px solid black; }
      .baseColumn__content .columnRow a:active, .baseColumn__content .columnRow a:focus {
        opacity: 1;
        color: black !important; }

/* pages */
.containter_100vh {
  height: calc(100vh - 60px);
  top: 0; }
  .containter_100vh div {
    padding: 0; }
  .containter_100vh a:nth-child(1) {
    padding-left: 0; }
  .containter_100vh a:nth-child(2) {
    padding-right: 0; }
  .containter_100vh a img {
    padding: 10px; }

/*
.workList:hover {
  cursor: pointer;
  p {
    opacity: 0.6;
  }
}

.workList.active .columnRow__content {
  p {
    opacity: 0.6;
  }
}
*/
.workList:hover {
  cursor: pointer; }
  .workList:hover .columnRow__content {
    background-image: url("../img/graphics/line-01.svg");
    background-repeat: repeat;
    background-size: 24px;
    background-position-y: 12px; }

.workList.active .columnRow__content {
  background-image: url("../img/graphics/line-01.svg");
  background-repeat: repeat;
  background-size: 24px;
  background-position-y: 12px; }

.workPreview {
  position: relative;
  float: left;
  padding-top: 15px;
  padding-bottom: 30px;
  height: auto;
  border-bottom: 2px solid black; }
  .workPreview img {
    position: relative;
    float: left; }

.workPreview__text {
  position: relative;
  float: left;
  margin-top: 15px;
  padding: 0;
  padding-right: 10px; }
  .workPreview__text > div {
    padding: 0; }
    .workPreview__text > div p {
      margin-bottom: 20px; }
    .workPreview__text > div:first-of-type a::after {
      content: url("../img/graphics/arrow_view.svg");
      margin-left: 10px;
      display: inline-block;
      height: 15px;
      width: 15px; }

.col-3-work {
  width: 50%; }
  @media (min-width: 992px) {
    .col-3-work > div {
      padding-bottom: 0; } }

.menu--info__mailing span {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 5px;
  padding: 3px 7px;
  width: 100%;
  max-width: 300px;
  height: 35px;
  border: 2px solid black;
  /*
  &:after {
    content: url("../img/graphics/arrow.svg");
    //position: absolute;
    //right: 20px;
    position: relative;
    right: 0px;
    width: 25px;
    height: 25px;
  }*/ }
  .menu--info__mailing span input {
    width: calc(100% - 20px);
    max-height: 25px;
    background-color: transparent;
    outline: none;
    border: 0; }

.email-btn {
  content: url("../img/graphics/arrow.svg");
  position: relative;
  right: 0px;
  width: 25px;
  height: 25px; }

.email-msg {
  margin-top: 6px; }

#mc-sc {
  width: 100%; }

/* handy classes */
.info--mobile {
  margin-top: 30px; }
  @media (min-width: 992px) {
    .info--mobile {
      margin-top: 70px; } }

.margBottom-newdiv {
  margin-bottom: 5px; }

.borderBottom {
  margin-bottom: 30px;
  padding-bottom: 30px; }
  @media (min-width: 768px) {
    .borderBottom {
      min-height: 80%;
      margin-bottom: 0; } }
  @media (min-width: 992px) {
    .borderBottom {
      margin-bottom: 0;
      padding-bottom: 0; } }

@media (min-width: 768px) {
  .borderTop {
    border-top: 2px solid black;
    padding-top: 30px; } }
@media (min-width: 992px) {
  .borderTop {
    border-top-width: 0;
    padding-top: 0; } }

.borderBottom-md {
  margin-bottom: 30px;
  padding-bottom: 30px;
  border-bottom: 2px solid black; }
  @media (min-width: 1200px) {
    .borderBottom-md {
      border-bottom-width: 0;
      margin-bottom: 0;
      padding-bottom: 0; } }

@media (min-width: 992px) {
  .content--text {
    padding-bottom: 10px !important;
    width: calc(100% - 5px);
    border-bottom: 2px solid black; } }
@media (min-width: 1200px) {
  .content--text {
    border-bottom-width: 0;
    margin-bottom: 0;
    padding-bottom: 0; } }
.content--text a {
  display: inline;
  opacity: 0.6;
  line-height: 20px !important;
  line-height: 2rem !important;
  margin-bottom: 2px !important;
  text-decoration: none;
  border-bottom: 2px solid transparent; }
  .content--text a:hover {
    opacity: 1;
    text-decoration: none;
    border-bottom: 2px solid black; }

/*
*  Desktop view
*/
.proj__container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%; }

.proj__thumb {
  height: 100vh; }

.proj__bckg {
  position: relative;
  width: 100%;
  height: 100%;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat; }
  @media (min-width: 992px) {
    .proj__bckg {
      background-position: center center;
      background-size: contain;
      background-attachment: fixed; } }
  @media (min-width: 992px) {
    .proj__bckg {
      background-size: cover; } }

.proj__title {
  position: fixed;
  top: 75px;
  padding-left: 32px; }
  .proj__title h1 {
    position: relative;
    float: left;
    padding: 0;
    margin: 0;
    font-size: 18px;
    font-size: 1.8rem;
    font-family: "AtlasGrotesk-Reg";
    font-weight: regular;
    line-height: 24px;
    line-height: 2.4rem; }

.nextproj {
  content: url("../img/graphics/arrow.svg");
  position: relative;
  float: left;
  margin-top: -2px;
  margin-left: 10px;
  width: 25px;
  height: 25px; }

/*
*  Mobile view
*/
.work--mobile {
  margin-top: 30px; }
  .work--mobile .workPreview {
    border-bottom-width: 0px;
    margin-bottom: 30px; }
    .work--mobile .workPreview img:last-of-type {
      margin-bottom: 15px; }
  .work--mobile .changeProj-l {
    margin-bottom: 40vh;
    padding-left: 0; }
    .work--mobile .changeProj-l p {
      display: inline-block; }
    .work--mobile .changeProj-l::before {
      content: url("../img/graphics/arrow.svg");
      position: relative;
      height: 30px;
      width: 30px;
      top: -3px;
      margin-right: 10px;
      display: inline-block;
      -webkit-transform: rotate(-180deg);
      -moz-transform: rotate(-180deg);
      -ms-transform: rotate(-180deg);
      transform: rotate(-180deg); }
  .work--mobile .changeProj-r {
    text-align: right;
    padding-right: 0; }
    .work--mobile .changeProj-r p {
      display: inline-block; }
    .work--mobile .changeProj-r::after {
      content: url("../img/graphics/arrow.svg");
      position: relative;
      height: 30px;
      width: 30px;
      top: 5px;
      margin-left: 10px;
      display: inline-block; }

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