@font-face {
  font-family: "LaicaB-Bold";
  src: url("../fonts/LaicaB-Bold.woff2") format("woff2"), url("../fonts/LaicaB-Bold.woff") format("woff"); }

@font-face {
  font-family: "LaicaB-Regular";
  src: url("../fonts/LaicaB-Regular.woff2") format("woff2"), url("../fonts/LaicaB-Regular.woff") format("woff"); }

input[type=text],
input[type=email],
input[type=tel],
input[type=url],
input[type=search],
input[type=submit],
button {
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  border-radius: 0;
  -moz-border-radius: 0;
  -webkit-border-radius: 0; }

*, *:before, *:after {
  box-sizing: border-box; }

html {
  font-size: 1vw; }
  html.mobile {
    font-size: 2vw; }
    @media only screen and (max-width: 600px) {
      html.mobile {
        font-size: 4vw; } }
html,
body {
  width: 100%;
  height: 100%; }

body {
  margin: 0;
  padding: 0;
  text-align: center;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-family: "LaicaB-Regular"; }

img {
  border: 0; }

.clear {
  clear: both;
  font-size: 0;
  line-height: 0;
  height: 0; }

main {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  transition: background-color 1000ms cubic-bezier(0.645, 0.045, 0.355, 1); }
  main[data-barba-namespace=single] * {
    cursor: none; }
  main.dark {
    background-color: #272727;
    /*
		.projects__list {
			opacity: 1;
			transition: opacity 400ms 2000ms cubic-bezier(0.645, 0.045, 0.355, 1);
		}
		*/ }
  main[data-barba-namespace="page"] {
    overflow-y: scroll; }

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

.grid--area--wrapper {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
  flex-wrap: wrap;
  z-index: 9; }
  .grid--area--wrapper .area--cell {
    width: 20%;
    height: 25%; }

.image__holder {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  pointer-events: none;
  background-position: center center;
  z-index: 8;
  display: flex;
  justify-content: center;
  align-items: center; }
  .image__holder .title {
    margin: 0;
    color: #FFFFFF;
    display: inline-block; }

.h1 {
  position: fixed;
  left: 0;
  top: 0;
  padding: 1vw;
  margin: 0;
  opacity: 0;
  z-index: 6;
  display: inline-block;
  transition: -webkit-transform 1000ms cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: transform 1000ms cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: transform 1000ms cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 1000ms cubic-bezier(0.645, 0.045, 0.355, 1);
  font-weight: normal;
  font-size: 1rem;
  line-height: 1;
  display: flex;
  width: 100%; }
  body.mobile .h1 {
    flex-wrap: wrap;
    font-size: 0.9rem; }
  body.mobile .h1 .h1__title {
    margin-right: 0;
    width: 100%;
    text-align: left; }
  .h1 .h1__info {
    opacity: 0;
    pointer-events: none;
    color: #FFFFFF;
    transition: opacity 0ms cubic-bezier(0.645, 0.045, 0.355, 1); }
    .h1 .h1__info a {
      color: inherit;
      text-decoration: none; }
      .h1 .h1__info a:hover {
        text-decoration: underline; }
    body.mobile .h1 .h1__info.h1__full {
      width: 100%;
      text-align: left; }
  .h1 span {
    margin-right: 2em; }
  .h1.toggled {
    -webkit-transform: translateY(calc(100vh - 1rem - 1vw - 1vw));
            transform: translateY(calc(100vh - 1rem - 1vw - 1vw)); }
    body.mobile .h1.toggled {
      -webkit-transform: translateY(calc(calc(var(--posvh, 1vh) * 100) - 4.7rem - 1vw - 1vw));
              transform: translateY(calc(calc(var(--posvh, 1vh) * 100) - 4.7rem - 1vw - 1vw)); }
  .h1.light .h1__title {
    color: #FFFFFF; }
  .h1.light .h1__info {
    opacity: 1;
    transition: opacity 600ms 1000ms cubic-bezier(0.645, 0.045, 0.355, 1);
    pointer-events: auto; }

.index {
  position: fixed;
  right: 0;
  bottom: 0;
  padding: 1vw;
  margin: 0;
  font-size: 1rem;
  line-height: 1;
  opacity: 0;
  z-index: 6;
  display: inline-block;
  transition: color 600ms cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 1000ms cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: transform 1000ms cubic-bezier(0.645, 0.045, 0.355, 1), color 600ms cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: transform 1000ms cubic-bezier(0.645, 0.045, 0.355, 1), color 600ms cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 1000ms cubic-bezier(0.645, 0.045, 0.355, 1);
  color: inherit;
  text-decoration: none; }
  .index.toggled {
    -webkit-transform: translateY(calc(-100vh + 1rem + 1vw + 1vw));
            transform: translateY(calc(-100vh + 1rem + 1vw + 1vw));
    pointer-events: none; }
    body.mobile .index.toggled {
      -webkit-transform: translateY(calc(calc(var(--vh, 1vh) * 100) + 1rem + 1vw + 1vw));
              transform: translateY(calc(calc(var(--vh, 1vh) * 100) + 1rem + 1vw + 1vw)); }
  .index.light {
    color: #FFFFFF; }
  body.mobile .index {
    font-size: 0.9rem; }

.single__image-wrapper {
  width: 100%;
  height: 100%;
  z-index: 2; }
  .single__image-wrapper .image__holder {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 3; }
    .single__image-wrapper .image__holder.video__holder {
      z-index: 5; }
    .single__image-wrapper .image__holder.current {
      display: flex; }
    .single__image-wrapper .image__holder img,
    .single__image-wrapper .image__holder .video_container {
      width: auto;
      max-width: 80%;
      -o-object-fit: contain;
         object-fit: contain; }
    .single__image-wrapper .image__holder .video_container {
      position: relative;
      z-index: 5;
      pointer-events: auto;
      cursor: default; }
      .single__image-wrapper .image__holder .video_container video {
        height: 100%;
        width: auto;
        -o-object-fit: contain;
           object-fit: contain;
        cursor: default; }
      body.mobile .single__image-wrapper .video_container {
        max-width: none;
        width: 80%;
        height: auto !important; }
        body.mobile .single__image-wrapper .video_container video {
          height: auto;
          width: 100%; }

.mouse__holder {
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  display: flex;
  cursor: none; }
  body.mobile .mouse__holder {
    height: 80%;
    top: 10%;
    bottom: auto; }
  .mouse__holder .next {
    width: 50%;
    height: 100%;
    display: block;
    cursor: none;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 4; }
  .mouse__holder .prev {
    width: 50%;
    height: 100%;
    display: block;
    cursor: none;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 4; }

.cursor {
  position: absolute;
  white-space: nowrap;
  font-size: 0.8rem;
  line-height: 1;
  transition: opacity 200ms ease-out;
  pointer-events: none;
  width: 30vw;
  margin-left: -15vw;
  cursor: none;
  opacity: 0;
  z-index: 4;
  /*
	&:before {
		content: '';
		display: block;
		width: 1rem;
		height: 1rem;
		border: 1px solid #000000;
		margin: 0 auto;
		opacity: 0;
		transform: scale(1.5) translateX(-50%) translateY(-50%);
		transition: all 200ms ease-out;
		position: absolute;
		left: 50%;
		top: 50%;
		border-radius: 50%;
		transform-origin: 50% 50%;
	}
	*/ }
  .cursor.activated {
    opacity: 1;
    transition: opacity 200ms ease-out; }
  .cursor .cursor__holder {
    transition: all 200ms ease-out; }
  .cursor.changed {
    /*
		&:before {
			opacity: 1;
			transform: scale(1);
		}
		*/ }
    .cursor.changed .cursor__holder {
      opacity: 0;
      -webkit-transform: scale(1.3);
              transform: scale(1.3); }

.projects__list {
  width: 100%;
  list-style-type: none;
  margin: 0;
  padding: 0;
  padding: 1vw; }
  body.mobile .projects__list {
    padding-top: 10vw; }
  .projects__list li {
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: block;
    width: 100%;
    opacity: 0; }
    .projects__list li a {
      display: flex;
      width: 100%;
      color: #858585;
      text-decoration: none;
      transition: color 50ms cubic-bezier(0.645, 0.045, 0.355, 1); }
      .projects__list li a span {
        width: 25%;
        display: block;
        text-align: left; }
        body.mobile .projects__list li span {
          width: auto;
          flex: 1;
          font-size: 0.8rem; }
          body.mobile .projects__list li span:first-child {
            width: 61%;
            flex: none; }
      .projects__list li a:hover {
        color: #FFFFFF; }

@-webkit-keyframes cf4FadeInOut {
  0% {
    opacity: 1; }
  17% {
    opacity: 1; }
  25% {
    opacity: 0; }
  92% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@keyframes cf4FadeInOut {
  0% {
    opacity: 1; }
  17% {
    opacity: 1; }
  25% {
    opacity: 0; }
  92% {
    opacity: 0; }
  100% {
    opacity: 1; } }

.post__slideshow {
  position: fixed;
  left: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  bottom: 0;
  right: 0;
  width: 100%;
  height: 40vh;
  pointer-events: none;
  opacity: 0;
  transition: opacity 500ms ease-out; }
  .post__slideshow.mouseover {
    opacity: 1; }
  .post__slideshow img,
  .post__slideshow video {
    height: 100%;
    width: auto;
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    display: none; }

.page__wrapper {
  text-align: left;
  padding: 5vw 15vw 1vw 1vw; }
  .page__wrapper a {
    color: inherit;
    word-wrap: break-word; }
  .page__wrapper h1 {
    font-size: 1em;
    font-weight: normal; }
  .page__wrapper h2 {
    font-size: 1em;
    font-weight: normal; }
  .page__wrapper h3 {
    font-size: 1em;
    font-weight: normal; }
