/*!
 Theme Name:   Cal Summers
 Description:  Cal Summers
 Author:       Frederik Delmotte
 Author URI:   http://frederikdelmotte.com
 Version:      1.0.0
*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

body {
  line-height: 1;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

nav ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
  content: "";
  content: none;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}

mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0;
}

input, select {
  vertical-align: middle;
}

/* 
 * variables
 */
/* Default Equations */
/* Penner Equations (approximated) originally created by @robpenner */
/* 
 * mixins
 */
/* 
 * functions
 */
/*
 * keyframe animation
 */
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-moz-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-moz-keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
/* 
 * fonts
*/
@font-face {
  font-family: "Chroma ST";
  src: url("fonts/ChromaST-Medium.eot");
  src: local("Chroma ST Medium"), local("ChromaST-Medium"), url("fonts/ChromaST-Medium.eot?#iefix") format("embedded-opentype"), url("fonts/ChromaST-Medium.woff2") format("woff2"), url("fonts/ChromaST-Medium.woff") format("woff"), url("fonts/ChromaST-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Chroma ST Black";
  src: url("fonts/ChromaST-Black.eot");
  src: local("Chroma ST Black"), local("ChromaST-Black"), url("fonts/ChromaST-Black.eot?#iefix") format("embedded-opentype"), url("fonts/ChromaST-Black.woff2") format("woff2"), url("fonts/ChromaST-Black.woff") format("woff"), url("fonts/ChromaST-Black.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
/* 
 * global
 */
body {
  color: #000;
}

h1, h2, h3, p, a, ul li, input, dt, dd {
  color: inherit;
}

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

ul {
  list-style: none;
}

img {
  max-width: 100%;
  padding: 0;
  margin: 0;
  display: block;
}

img,
video {
  -moz-user-select: -moz- none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -o-user-select: none;
  user-select: none;
  -moz-user-drag: -moz- none;
  -webkit-user-drag: none;
  user-drag: none;
}

main, section, aside, div {
  position: relative;
}

/* 
 * typography
 */
body {
  font-family: "Chroma ST", sans-serif;
}

h1, h2, h3, p, a, span, ul li {
  font-style: normal;
  font-stretch: normal;
  font-weight: normal;
  -webkit-font-smoothing: antialiased;
  font-smoothing: antialiased;
  font-size: 9px;
  line-height: 13px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

/* 
 * layout
 */
body {
  color: black;
}
body header nav,
body header > a {
  position: fixed;
  top: 20px;
  z-index: 2;
}
body header nav {
  left: 5px;
  display: flex;
  flex-direction: column;
}
body header > a:nth-of-type(1) {
  left: 50%;
  transform: translateX(-50%);
  font-family: "Chroma ST", sans-serif;
  letter-spacing: -0.02em;
  font-size: 16px;
  line-height: 100%;
}
body header > a:nth-of-type(2) {
  right: 5px;
}
body.home {
  background: #000;
}
body.home header a {
  color: #fff;
}
body.home main section figure {
  width: 100vw;
  height: 100vh;
  height: calc(var(--vh, 1vh) * 100);
}
body.home main section figure img,
body.home main section figure video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
body.home main section figure:nth-of-type(1) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 300ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 300ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 300ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.home main section figure:nth-of-type(2) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 600ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 600ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 600ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.home main section figure:nth-of-type(3) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 900ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 900ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 900ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.information main section:nth-of-type(1) {
  position: fixed;
  z-index: 2;
  top: calc(50% + 33px);
  left: 5px;
  width: calc(( ( ( 100vw - ( ( 15 - 1 ) * 5px ) - ( 2 * 5px ) ) / 15 ) * 13 ) + ( ( 13 - 1 ) * 5px ));
  opacity: 0;
  -webkit-animation: fadeIn 1500ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.information main section:nth-of-type(1) a {
  border-bottom: 1px solid black;
}
body.information main section:nth-of-type(2) {
  width: 100vw;
  height: 100vh;
  overflow: hidden;
}
body.information main section:nth-of-type(2) figure {
  position: absolute;
}
body.information main section:nth-of-type(2) figure:nth-of-type(1) {
  top: 0;
  left: 0;
  width: calc( ( ( ( 100vw - ( ( 15 - 1 ) * 5px ) - ( 2 * 5px ) ) / 15 ) * 9 ) + ( ( 9 - 1 ) * 5px ) + 15px );
}
body.information main section:nth-of-type(2) figure:nth-of-type(2) {
  top: 0;
  left: calc( ( ( ( 100vw - ( ( 15 - 1 ) * 5px ) - ( 2 * 5px ) ) / 15 ) * 10 ) + ( ( 10 - 1 ) * 5px ) + 30px );
  width: calc( ( ( ( 100vw - ( ( 15 - 1 ) * 5px ) - ( 2 * 5px ) ) / 15 ) * 7 ) + ( ( 7 - 1 ) * 5px ) + 0px );
}
body.information main section:nth-of-type(2) figure:nth-of-type(3) {
  top: 71vw;
  left: calc( ( ( ( 100vw - ( ( 15 - 1 ) * 5px ) - ( 2 * 5px ) ) / 15 ) * 5 ) + ( ( 5 - 1 ) * 5px ) + 30px );
  width: calc( ( ( ( 100vw - ( ( 15 - 1 ) * 5px ) - ( 2 * 5px ) ) / 15 ) * 10 ) + ( ( 10 - 1 ) * 5px ) + 15px );
}
body.information main section:nth-of-type(2) figure:nth-of-type(4) {
  top: 132vw;
  left: calc( ( ( ( 100vw - ( ( 15 - 1 ) * 5px ) - ( 2 * 5px ) ) / 15 ) * -1 ) + ( ( -1 - 1 ) * 5px ) + 0px );
  width: calc( ( ( ( 100vw - ( ( 15 - 1 ) * 5px ) - ( 2 * 5px ) ) / 15 ) * 6 ) + ( ( 6 - 1 ) * 5px ) + 0px );
}
body.information main section:nth-of-type(2) figure:nth-of-type(5) {
  top: 150vw;
  left: calc( ( ( ( 100vw - ( ( 15 - 1 ) * 5px ) - ( 2 * 5px ) ) / 15 ) * 7 ) + ( ( 7 - 1 ) * 5px ) + 30px );
  width: calc( ( ( ( 100vw - ( ( 15 - 1 ) * 5px ) - ( 2 * 5px ) ) / 15 ) * 9 ) + ( ( 9 - 1 ) * 5px ) + 0px );
}
body.information main section:nth-of-type(2) figure:nth-of-type(1) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 300ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 300ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 300ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.information main section:nth-of-type(2) figure:nth-of-type(2) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 600ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 600ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 600ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.information main section:nth-of-type(2) figure:nth-of-type(3) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 900ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 900ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 900ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.information main section:nth-of-type(2) figure:nth-of-type(4) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 1200ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 1200ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 1200ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.information main section:nth-of-type(2) figure:nth-of-type(5) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 1500ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 1500ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 1500ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.information main section:nth-of-type(2) figure:nth-of-type(6) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 1800ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 1800ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 1800ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.information main section:nth-of-type(2) figure:nth-of-type(7) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 2100ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 2100ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 2100ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.information main section:nth-of-type(2) figure:nth-of-type(8) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 2400ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 2400ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 2400ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.information main section:nth-of-type(2) figure:nth-of-type(9) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 2700ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 2700ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 2700ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.information main section:nth-of-type(2) figure:nth-of-type(10) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 3000ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 3000ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 3000ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.information main section:nth-of-type(2) figure:nth-of-type(11) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 3300ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 3300ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 3300ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.information main section:nth-of-type(2) figure:nth-of-type(12) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 3600ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 3600ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 3600ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.information main section:nth-of-type(2) figure:nth-of-type(13) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 3900ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 3900ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 3900ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.information main section:nth-of-type(2) figure:nth-of-type(14) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 4200ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 4200ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 4200ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.information main section:nth-of-type(2) figure:nth-of-type(15) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 4500ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 4500ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 4500ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.information main section:nth-of-type(2) figure:nth-of-type(16) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 4800ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 4800ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 4800ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.information main section:nth-of-type(2) figure:nth-of-type(17) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 5100ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 5100ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 5100ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.information main section:nth-of-type(2) figure:nth-of-type(18) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 5400ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 5400ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 5400ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.information main section:nth-of-type(2) figure:nth-of-type(19) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 5700ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 5700ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 5700ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.information main section:nth-of-type(2) figure:nth-of-type(20) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 6000ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 6000ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 6000ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.category main section nav ul li {
  width: 100%;
  display: block;
  white-space: nowrap;
}
body.category main section nav ul li a img,
body.category main section nav ul li a video {
  width: 100%;
  display: block;
}
body.category main section nav ul li:nth-of-type(1) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 50ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 50ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 50ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.category main section nav ul li:nth-of-type(2) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 100ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 100ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 100ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.category main section nav ul li:nth-of-type(3) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 150ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 150ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 150ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.category main section nav ul li:nth-of-type(4) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 200ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 200ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 200ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.category main section nav ul li:nth-of-type(5) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 250ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 250ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 250ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.category main section nav ul li:nth-of-type(6) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 300ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 300ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 300ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.category main section nav ul li:nth-of-type(7) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 350ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 350ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 350ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.category main section nav ul li:nth-of-type(8) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 400ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 400ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 400ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.category main section nav ul li:nth-of-type(9) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 450ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 450ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 450ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.category main section nav ul li:nth-of-type(10) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 500ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 500ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 500ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.category main section nav ul li:nth-of-type(11) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 550ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 550ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 550ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.category main section nav ul li:nth-of-type(12) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 600ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 600ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 600ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.category main section nav ul li:nth-of-type(13) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 650ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 650ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 650ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.category main section nav ul li:nth-of-type(14) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 700ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 700ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 700ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.category main section nav ul li:nth-of-type(15) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 750ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 750ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 750ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.project main section:nth-of-type(1) {
  position: fixed;
  z-index: 2;
  top: calc(50% + 33px);
  left: 5px;
  width: calc(( ( ( 100vw - ( ( 15 - 1 ) * 5px ) - ( 2 * 5px ) ) / 15 ) * 9 ) + ( ( 9 - 1 ) * 5px ));
  opacity: 0;
  -webkit-animation: fadeIn 1500ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.project main section:nth-of-type(1) a {
  border-bottom: 1px solid black;
}
body.project main section:nth-of-type(2) {
  display: flex;
  flex-direction: column;
  align-items: center;
}
body.project main section:nth-of-type(2) figure img,
body.project main section:nth-of-type(2) figure video {
  width: 100%;
}
body.project main section:nth-of-type(2) figure:nth-of-type(1) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 300ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 300ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 300ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.project main section:nth-of-type(2) figure:nth-of-type(2) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 600ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 600ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 600ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.project main section:nth-of-type(2) figure:nth-of-type(3) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 900ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 900ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 900ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.project main section:nth-of-type(2) figure:nth-of-type(4) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 1200ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 1200ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 1200ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.project main section:nth-of-type(2) figure:nth-of-type(5) {
  opacity: 0;
  -webkit-animation: fadeIn 1500ms 1500ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  -moz-animation: fadeIn 1500ms 1500ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
  animation: fadeIn 1500ms 1500ms cubic-bezier(0.25, 0.01, 0.25, 1) forwards;
}
body.loading * {
  cursor: wait;
}
body.inverse * {
  color: black;
}

/* 
 * media queries
 */
@media screen and (min-width: 1020px) {
  body header nav {
    left: 30px;
  }
  body header > a:nth-of-type(1) {
    font-size: 34px;
  }
  body header > a:nth-of-type(2) {
    right: 30px;
  }
  body.information main section:nth-of-type(1) {
    top: calc(50% + 19px);
    left: 30px;
    width: calc(( ( ( 100vw - ( ( 15 - 1 ) * 15px ) - ( 2 * 30px ) ) / 15 ) * 3 ) + ( ( 3 - 1 ) * 15px ));
  }
  body.information main section:nth-of-type(2) figure:nth-of-type(1) {
    top: 0;
    left: 0;
    width: calc( ( ( ( 100vw - ( ( 15 - 1 ) * 15px ) - ( 2 * 30px ) ) / 15 ) * 6 ) + ( ( 6 - 1 ) * 15px ) + 30px );
  }
  body.information main section:nth-of-type(2) figure:nth-of-type(2) {
    top: 0;
    left: calc( ( ( ( 100vw - ( ( 15 - 1 ) * 15px ) - ( 2 * 30px ) ) / 15 ) * 12 ) + ( ( 12 - 1 ) * 15px ) + 45px );
    width: calc( ( ( ( 100vw - ( ( 15 - 1 ) * 15px ) - ( 2 * 30px ) ) / 15 ) * 5 ) + ( ( 5 - 1 ) * 15px ) + 0px );
  }
  body.information main section:nth-of-type(2) figure:nth-of-type(3) {
    top: 0;
    left: calc( ( ( ( 100vw - ( ( 15 - 1 ) * 15px ) - ( 2 * 30px ) ) / 15 ) * 7 ) + ( ( 7 - 1 ) * 15px ) + 45px );
    width: calc( ( ( ( 100vw - ( ( 15 - 1 ) * 15px ) - ( 2 * 30px ) ) / 15 ) * 4 ) + ( ( 4 - 1 ) * 15px ) + 0px );
  }
  body.information main section:nth-of-type(2) figure:nth-of-type(4) {
    top: 39vw;
    left: calc( ( ( ( 100vw - ( ( 15 - 1 ) * 15px ) - ( 2 * 30px ) ) / 15 ) * 3 ) + ( ( 3 - 1 ) * 15px ) + 45px );
    width: calc( ( ( ( 100vw - ( ( 15 - 1 ) * 15px ) - ( 2 * 30px ) ) / 15 ) * 3 ) + ( ( 3 - 1 ) * 15px ) + 0px );
  }
  body.information main section:nth-of-type(2) figure:nth-of-type(5) {
    top: 47vw;
    left: calc( ( ( ( 100vw - ( ( 15 - 1 ) * 15px ) - ( 2 * 30px ) ) / 15 ) * 9 ) + ( ( 9 - 1 ) * 15px ) + 45px );
    width: calc( ( ( ( 100vw - ( ( 15 - 1 ) * 15px ) - ( 2 * 30px ) ) / 15 ) * 6 ) + ( ( 6 - 1 ) * 15px ) + 0px );
  }
  body.category main section nav {
    padding-top: 0;
    padding-right: calc( ( ( ( 100vw - ( ( 15 - 1 ) * 15px ) - ( 2 * 30px ) ) / 15 ) * 1 ) + ( ( 1 - 1 ) * 15px ) + 30px );
    padding-bottom: 0;
    padding-left: calc( ( ( ( 100vw - ( ( 15 - 1 ) * 15px ) - ( 2 * 30px ) ) / 15 ) * 2 ) + ( ( 2 - 1 ) * 15px ) + 45px );
  }
  body.category main section nav ul {
    display: flex;
    flex-wrap: wrap;
  }
  body.category main section nav ul li {
    margin-top: 0;
    overflow: auto;
    width: unset;
    padding: 0;
    white-space: normal;
    overflow: initial;
    /*

    &::after{
    	content: '';
    	display: block;
    	float: left;
    	width: calc-columns-gutters( 15, 15px, 30px, 3, 0px );
    	aspect-ratio: 4/5;
    	//background: #f00;
    	margin-right: calc-columns-gutters( 15, 15px, 30px, 1, 30px );
    }

    */
  }
  body.category main section nav ul li a {
    width: calc( ( ( ( 100vw - ( ( 15 - 1 ) * 15px ) - ( 2 * 30px ) ) / 15 ) * 3 ) + ( ( 3 - 1 ) * 15px ) + 0px );
    aspect-ratio: 4/5;
    overflow: hidden;
    white-space: normal;
    display: block;
    float: left;
    margin-right: calc( ( ( ( 100vw - ( ( 15 - 1 ) * 15px ) - ( 2 * 30px ) ) / 15 ) * 1 ) + ( ( 1 - 1 ) * 15px ) + 30px );
    margin-top: calc( ( ( ( 100vw - ( ( 15 - 1 ) * 15px ) - ( 2 * 30px ) ) / 15 ) * 1 ) + ( ( 1 - 1 ) * 15px ) + 30px );
  }
  body.category main section nav ul li a:last-child {
    margin-right: calc( ( ( ( 100vw - ( ( 15 - 1 ) * 15px ) - ( 2 * 30px ) ) / 15 ) * 1 ) + ( ( 1 - 1 ) * 15px ) + 30px );
  }
  body.project main section:nth-of-type(1) {
    left: 30px;
    width: calc(( ( ( 100vw - ( ( 15 - 1 ) * 15px ) - ( 2 * 30px ) ) / 15 ) * 3 ) + ( ( 3 - 1 ) * 15px ));
  }
  body.project main section:nth-of-type(2) figure {
    width: calc(( ( ( 100vw - ( ( 15 - 1 ) * 15px ) - ( 2 * 30px ) ) / 15 ) * 7 ) + ( ( 7 - 1 ) * 15px ));
    /*
    img,
    video{
    	width: 100%;
    	height: auto;
    	object-fit: contain;
    }
    */
  }
}

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