/* reset */

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; font-variant-ligatures: none;}
html { height: 100%; -ms-text-size-adjust: none; -webkit-text-size-adjust: none;}
article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {display: block;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after { content: ""; content: none;}
a {}
table {border-collapse: collapse; border-spacing: 0;}
input, select {vertical-align: middle;}

/* root */
/* html {
  background: #ececec;
  cursor: url(/assets/img/cursor.svg), auto;} */

/*   body {
    min-height: 100vh;
    min-height: fill-available;
    min-height: -webkit-fill-available;} */
    
html {
    height: fill-available;
    height: -webkit-fill-available;
}

body {
  font-family: 'Arimo', sans-serif, Arial;
  background: #ececec;
  cursor: url(/assets/img/cursor.svg), auto;
  overflow-x: hidden;
  max-width: 100%;}


/* text */
.text-l, .text-m {
  font-weight: bold;
  color: #000;}

.text-l {
  font-size: 90px;
  line-height: 0.7em;}

.text-m {
  font-size: 30px;}

.text-white {
  color: #ffff;}

/* images */
img {
  image-rendering: -webkit-optimize-contrast;
}

img.slider-scroll {
  width: 90%;
  margin: 5%;}

/* svg */
.menu-off-svg, .menu-on-svg {
height: 50px;
aspect-ratio: 16/9;}

.cover-svg {
  position: absolute;
  z-index: 1;
  width: 100vw;
  height: calc(100vh - 1px);}

.slash-svg {
  width: 1.25em;
  height: 0.7em;
  stroke: #000000;}

/* links */
a:-webkit-any-link {
  cursor: url(/assets/img/cursor.svg), default;
  text-decoration: none;}

a.text-stroke:hover {
  color: transparent;
  -webkit-text-stroke: 1px #000;
  transition: 0s;
  cursor: url(/assets/img/cursor.svg), default;}

a.underline {
  text-decoration: none;
  display: inline-block;
  line-height: 0.8em;
  font-weight: bold;
  color: #000000;}
  
a.underline:hover {
  line-height: 0.8em;
  border-bottom: solid #000000;
  border-bottom-width: 1.5px;
  position: relative;
  cursor:url(/assets/img/cursor.svg), default;}

/* menu */
.menu-on, .menu-off  {}

.menu-icon {
  z-index: 10000;
  position: fixed;
  top: 0;
  left: 100%;
  padding-right: 20px;
  padding-top: 20px;
  transform:translate(-100%, 0%);
  -webkit-transform:translate(-100%, 0%);}

.menu-overlay {
  display: none;
  position: fixed;
  height: 100%;
  width: 100%;
  background: #fff;
  z-index: 10000;}

.menu-top, .menu-middle, .menu-bottom {
  position: absolute;
  padding-left: 20px;
  left: 0;}

.menu-top {
    padding-top: 20px;
    top: 0;}

.menu-middle {
    top:50%;
    transform:translate(0%, -50%);
    -webkit-transform:translate(0%, -50%);}

.menu-bottom {
    padding-bottom: 20px;
    bottom: 0;}


/* pages */

.page-info {
  min-height: calc(100vh - 40px);
  position: relative;
  overflow: hidden;
  padding: 20px;}

.works-menu-x {
  z-index: 10000;
  position: fixed;
  top: 0;
  left: 100%;
  padding-right: 20px;
  padding-top: 20px;
  transform:translate(-100%, 0%);
  -webkit-transform:translate(-100%, 0%);
  cursor: url(/assets/img/cursor.svg), default;}

/* scrollbar */
::-webkit-scrollbar {width: 0px;}
::-webkit-scrollbar-track {background: #ececec;}
::-webkit-scrollbar-thumb {background: #000000;}
::-webkit-scrollbar-thumb:hover {background: #000000;}

body {
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Old versions of Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently supported by Chrome, Opera and Firefox */}

/* mobil */
@media only screen and (max-width: 1400px) {

  .text-l {
    font-size: 60px;}
  
  .text-m {
    font-size: 20px;}

  .menu-off-svg, .menu-on-svg {
    height: 40px;}

  .menu-open, .menu-close {
    padding-right: 15px;
    padding-top: 15px;}

  .menu-top, .menu-middle, .menu-bottom {
    padding-left: 15px;}
  
  .menu-top {
      padding-top: 15px;}
  
  .menu-bottom {
      padding-bottom: 15px;}

  .page-info {
    min-height: calc(100vh - 40px);
    padding: 15px;}
  
  .works-menu-x {
    padding-right: 15px;
    padding-top: 15px;}

}

@media only screen and (max-width: 900px) {

  .text-l {
    font-size: 30px;}
  
  .text-m {
    font-size: 20px;}

  .menu-off-svg, .menu-on-svg {
    height: 30px;}

  .menu-open, .menu-close {
    padding-right: 15px;
    padding-top: 15px;}

  .menu-top, .menu-middle, .menu-bottom {
    padding-left: 15px;}
  
  .menu-top {
      padding-top: 15px;}
  
  .menu-bottom {
      padding-bottom: 15px;}

  .page-info {
    min-height: calc(100vh - 40px);
    padding: 15px;}
  
  .works-menu-x {
    padding-right: 15px;
    padding-top: 20px;}

}

/* .indexpage {
  position: relative;
  height: 100vh;
  font-size: 100px;
  color: #fff;
  font-weight: bold;
  overflow: hidden;} */

  
/* a.index {
font-size: 100px;
line-height: 75px;
color: #ffffff;
font-weight: bold;} */

/* .index-top {
  position: absolute;
  padding-left: 20px;
  padding-top: 20px;
  top: 0;
  left: 0;}

.index-middle {
  position: absolute;
  padding-left: 20px;
  top:50%;
  left:0;
  transform:translate(0%, -50%);
  -webkit-transform:translate(0%, -50%);}

.index-bottom {
position: absolute;
padding-left: 20px;
padding-bottom: 20px;
bottom: 0;
left: 0;} */




  /* a.menu-stroke {
      line-height: 75px;} */

      /* INDEX */
  
/* .index-link {
  width: 100vw;
  height: 100vh;
  position: fixed;
  z-index: 2;} */

  
/* a.menu-underline:hover {
  text-decoration: underline;
  transition: 0.2s;} */

/* a.menu-underline:hover {
  position: fixed;
  text-decoration: none;
  display: inline-block;
  line-height: 0.8em;
  border-bottom: 1px solid #000000;
  position: relative;
  cursor:url(/assets/img/cursor.cur), default;} */

  /* .menu-open, .menu-close {
  z-index: 10000;
  position: fixed;
  top: 0;
  left: 100%;
  padding-right: 20px;
  padding-top: 20px;
  transform:translate(-100%, 0%);
  -webkit-transform:translate(-100%, 0%);} */