::selection {
    background-color: #febe10;
    color: #000000;
}
::-o-selection{
    background-color: #febe10;
    color: #000000;
}
::-moz-selection{
    background-color: #febe10;
    color: #000000;
}
::-ms-selection{
    background-color: #febe10;
    color: #000000;
}
::-webkit-selection{
    background-color: #febe10;
    color: #000000;
}
::-webkit-scrollbar{
  width: 15px;
}
::-webkit-scrollbar-thumb{
  -webkit-border-radius: 10px;
  border-radius: 10px;
  background-color: rgba(254, 190, 16, 0.65);
  background-clip: padding-box;
  border: 5px solid rgba(0,0,0,0);
  transition: background-color 0.3s;
}
::-webkit-scrollbar-thumb:hover{
  background-color: rgba(254, 190, 16, 1);
  transition: background-color 0.3s;
}
::-webkit-scrollbar-button{
    width: 0;
    height: 0;
    display: none;
}
::-webkit-scrollbar-corner{
    background-color: transparent;
}
html{
  scroll-behavior: smooth;
  font-smooth: always;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body{
  background-color: #ffffff;
  margin: 0;
  padding: 0;
  text-rendering: optimizeLegibility;
}
span.RMUltraLight{
  font-family: aUltraLight;
  font-size: 3em;
}
span.RMHeavy{
  font-family: aHeavy;
}
span.RMLight{
  font-family: aLight;
}
span.yellowAccent{
			color: #febe10;
		}

@media screen and (max-width: 300px){
  body{
    background-color: #febe10 !important;
  }
  div#loadingCon{
    display: none;
  }
  div#contents{
    display: none;
  }
  div#resizeMessage{
    display: block;
    color: #000000;
    width: calc(100vw - 60px);
    height: calc(100vh - 60px);
    font-size: 0.85em;
    word-wrap: break-word;
    margin: 30px 30px;
  }
}

@media screen and (min-width: 301px) and (max-width: 900px){
  @media screen and (max-height: 500px){
    body{
      background-color: #febe10 !important;
    }
    div#loadingCon{
      display: none;
    }
    div#contents{
      display: none;
    }
    div#resizeMessage{
      display: block;
      color: #000000;
      width: calc(100vw - 80px);
      height: calc(100vh - 80px);
      font-size: 0.85em;
      word-wrap: break-word;
      margin: 40px 40px;
    }
  }
  @media screen and (min-height: 501px){
    div#resizeMessage{
      display: none;
    }
    div#loadingCon{
      position: absolute;
      top: 50%;
      margin-top: -70px;
      left: 50%;
      margin-left: -150px;
      width: 300px;
      height: 200px;
      overflow: hidden;
    }
    div#loadingIcon{
      position: absolute;
      top: 0%;
      left: 25px;
      width: 250px;
      height: 130px;
      background-image: url("../sources/system/loadingScreen.svg");
      background-position: center right;
      background-repeat: no-repeat;
      background-size: cover;
      background-attachment: absolute;
    }
    div#loadingMessage{
      position: absolute;
      bottom: 10%;
      left: 0%;
      width: 300px;
      height: auto;
      color: #000000;
      font-family: aLight;
      font-size: 0.85em;
      text-align: center;
    }

    div#contents{
      pointer-events: none;
      opacity: 0;
			position: fixed;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      overflow: hidden;
      transition: opacity 0.5s;
    }
    #contents.active{
      pointer-events: all;
      opacity: 1;
      transition: opacity 0.5s;
    }
    div#headerLogo{
      z-index: 5;
      position: absolute;
      top: 15px;
      left: 30px;
      background-image: url("../sources/system/logoOnly.svg");
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;
      background-attachment: absolute;
      background-blend-mode: difference;
      height: 50px;
      width: 121px;
      mix-blend-mode: difference;
      transition: opacity 0.5s;
    }
    #headerLogo:hover{
      opacity: 0.5;
      transition: opacity 0.5s;
    }
    #headerLogo.disabled{
      pointer-events: none;
    }
    a#headerLogoLink{
      display: block;
      width: 100%;
      height: 100%;
      opacity: 1;
      transition: opacity 0.5s;
    }
    div#headerCart{
      z-index: 4;
      position: fixed;
      top: 15px;
      right: 120px;
      color: #ffffff;
      width: 40px;
      height: 60px;
      text-align: center;
      padding: 0;
      mix-blend-mode: difference;
    }
    #headerCart:hover{
      cursor: pointer;
    }
    .shopify-buy__cart-toggle__count{
      position: absolute;
      top: 5px;
      left: calc(50% - 14px);
      width: 30px;
      height: auto;
      font-family: aHeavy;
      font-size: 12px;
      text-align: center;
    }
    .shopify-buy__icon-cart{
      width: 40px;
      height: 35px;
      fill: #ffffff;
      margin: 0;
      padding: 0;
    }
    .shopify-buy--visually-hidden{
      font-family: aUltraLight;
      font-size: 1.5em;
      line-height: 0.9em;
      margin: 0;
    }
    div#menuButtonCon{
      z-index: 5;
      opacity: 1;
      position: absolute;
      top: 15px;
      right: 25px;
      width: 60px;
      height: 60px;
      mix-blend-mode: difference;
      transition: opacity 0.3s;
    }
    div#menuButtonCon:hover{
      cursor: pointer;
    }
    div#menuButtonCon:hover .menuButtonDoorLeft{
      opacity: 0;
      transition: opacity 0.3s;
    }
    svg#menuButton{
      height: 60px;
      mix-blend-mode: difference;
    }
    .menuButtonFrame, .menuButtonDoorLeft, .menuButtonDoorRight{
      opacity: 1;
      fill: #ffffff;
      mix-blend-mode: difference;
      transition: opacity 0.3s;
    }
    div#menuLabel{
      z-index: 5;
      position: absolute;
      top: 15px;
      right: calc(35px + 20px);
      height: 25px;
      width: 60px;
      font-family: aUltraLight;
      font-size: 1.5em;
      text-align: center;
      color: #ffffff;
      mix-blend-mode: difference;
      transform: rotate(-90deg);
      transform-origin: top right;
      transition: color 0.3s, opacity 0.3s;
    }
		div#menu{
      display: none;
      z-index: 4;
      position: absolute;
      background: #000000;
      width: 100vw;
      height: 100%;
    }
    div#menuLinksCon{
      position: absolute;
      top: 100px;
      left: 30px;
      width: auto;
      height: auto;
    }
		#menuLinksCon.disabled{
			display: none;
		}
    a.menuLink{
      position: relative;
      font-family: aUltraLight;
      font-size: 2.5em;
      color: #ffffff;
      padding: 0 5px;
      margin-left: -5px;
      line-height: 1.5em;
      text-decoration: none;
    }
    a.menuLink::after{
      content: '';
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      width: 0;
      left: 0;
      height: 5px;
      background: currentColor;
      transition: width 0.3s ease;
    }
    a.menuLink.disabled{
      pointer-events: none;
      color: #febe10;
    }
    a.menuLink:hover{
      cursor: pointer;
    }
    a.menuLink:hover::after{
      cursor: pointer;
      width: 100%;
    }
    div#menuKahrsLinkCon{
      display: none;
    }
    div#furnitureMenuLinksCon, div#projectsMenuLinksCon, div#kahrsMenuLinksCon, div#aboutMenuLinksCon, div#wayaMenuLinksCon, div#zeroMenuLinksCon{
      display: none;
      position: absolute;
      top: 100px;
      left: calc(30px - 5px);
      right: 50px;
      bottom: 0;
      overflow: hidden;
    }
    div#furnitureMenuLinkImageCon, div#projectsMenuLinkImageCon, div#kahrsMenuLinkImageCon, div#aboutMenuLinkImageCon, div#wayaMenuLinkImageCon{
      display: none;
    }
    div#zeroMenuLinksBG, div#wayaMenuLinksBG{
      z-index: -1;
      display: none;
      opacity: 0.2;
      position: absolute;
      top: 0;
      right: 0;
      width: 100%;
      height: 100%;
      background-size: cover;
      background-position: bottom right;
      background-repeat: no-repeat;
      background-attachment: absolute;
    }
    div.furnitureMenuLinkImage, div.projectsMenuLinkImage, div.kahrsMenuLinkImage, div.aboutMenuLinkImage, div.wayaMenuLinkImage{
      display: none;
    }
    div#backButtonFurniture, div#backButtonProjects, div#backButtonKahrs, div#backButtonAbout, div#backButtonWaya, div#backButtonZero{
      display: inline-block;
      position: absolute;
			left: 1vh;
      width: 41px;
      height: 30px;
    }
    div#furnitureList, div#projectsList, div#kahrsList, div#aboutList, div#wayaList, div#zeroList{
      position: absolute;
      top: 60px;
      left: 0;
      bottom: 0;
      width: calc(100vw - 60px);
      padding-bottom: 20px;
      white-space: pre-line;
      overflow-x: hidden;
      overflow-y: auto;
    }
    div.furnitureCatLinkWrapper, div.projectsCatLinkWrapper, div.kahrsCatLinkWrapper, div.aboutCatLinkWrapper, div.wayaCatLinkWrapper, div.zeroCatLinkWrapper{
      display: inline-block;
      margin-bottom: 0.7em;
			width: calc(100% - 20px);
    }
    div.furintureCatLinkText, div.projectsCatLinkCat, div.kahrsCatLinkText, div.aboutCatLinkText, div.wayaCatLinkText, div.zeroCatLinkText{
      opacity: 0.5;
      display: inline-block;
			color: #ffffff;
      font-family: aLight;
      font-size: 0.9em;
      padding-left: 5px;
    }
    a.furnitureCatLink, a.projectsCatLink, a.kahrsCatLink, a.aboutCatLink, a.wayaCatLink, a.zeroCatLink{
      opacity: 1;
      display: inline-block;
      position: relative;
      color: #ffffff;
      font-family: aUltraLight;
      font-size: 2em;
      line-height: 1.8em;
      padding: 0 5px;
      text-decoration: none;
    }
    a.furnitureCatLink:nth-child(1), a.projectsCatLink, a.kahrsCatLink, a.aboutCatLink, a.wayaCatLink:nth-child(1), a.zeroCatLink:nth-child(1){
      line-height: 1em;
    }
    a.furnitureCatLink::after, a.projectsCatLink::after, a.kahrsCatLink::after, a.aboutCatLink::after, a.wayaCatLink::after, a.zeroCatLink::after{
      content: '';
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      width: 0;
      left: 0;
      height: 5px;
      background: currentColor;
      transition: width 0.3s ease;
    }
    a.furnitureCatLink:hover::after, a.projectsCatLink:hover::after, a.kahrsCatLink:hover::after, a.aboutCatLink:hover::after, a.wayaCatLink:hover::after, a.zeroCatLink:hover::after{
      cursor: pointer;
      width: 100%;
    }
    a.furnitureCatLink:hover, a.projectsCatLink:hover, a.kahrsCatLink:hover, a.aboutCatLink:hover, a.wayaCatLink:hover, a.zeroCatLink:hover{
      cursor: pointer;
    }
    .furnitureCatLink.active, .projectsCatLink.active, .kahrsCatLink.active, .aboutCatLink.active, .wayaCatLink.active, .zeroCatLink.active{
      pointer-events: none;
      color: #febe10;
    }
    div#wayaNav{
      position: relative;
      display: inline-block;
      margin-top: calc(5px + 0.9em);
      width: 7em;
      height: 2.5em;
    }
    .wayaPathM{
      fill: none;
      opacity: 0.65;
      stroke: #000000;
      stroke-linecap: round;
      stroke-miterlimit: 10;
      stroke-dasharray: 2200;
      stroke-dashoffset: 2200;
      stroke-width: 12px;
      transition: stroke-dashoffset 0.6s;
    }
    .wayaPathNM{
      fill: none;
      stroke: #ffffff;
      stroke-linecap: round;
      stroke-miterlimit: 10;
      stroke-dasharray: 2200;
      stroke-dashoffset: 0;
      stroke-width: 10px;
    }
    #wayaNav:hover{
      cursor: pointer;
    }
    #wayaNav:hover .wayaPathM{
      stroke-dashoffset: 0;
      transition: stroke-dashoffset 0.6s;
    }
    #wayaNav.disabled .wayaPathM{
      stroke-dashoffset: 0;
    }
    #wayaNav.disabled{
      pointer-events: none;
    }
    a#zeroWasteMenuNav{
      z-index: 5;
      position: absolute;
      top: 15px;
      right: 120px;
      width: auto;
      height: auto;
      filter: grayscale(0%);
      transition: filter 0.5s;
    }
    a#zeroWasteMenuNav:hover{
      cursor: pointer;
      filter: grayscale(100%);
      transition: filter 0.5s;
    }
    div#zeroWasteMenuLogo{
      background-image: url("../sources/system/zeroWasteLogo.svg");
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;
      background-attachment: absolute;
      height: 60px;
      width: 36.5px;
    }
    a#zeroWasteMenuText{
      display: none;
    }
    div#menuAddLinksCon{
      position: absolute;
      bottom: 30px;
      right: 30px;
      width: auto;
      max-width: calc(100vw - 60px);
      height: auto;
      text-align: right;
    }
    div#rights{
      display: inline-block;
      font-family: aLight;
      font-size: 0.75em;
      color: #ffffff;
    }
    .uniLink.addLinks{
      display: none;
    }
    .uniLink.addLinksRes{
      font-size: 0.8em;
    }
    div#menuContactsCon{
      position: absolute;
      bottom: calc(60px + 0.75em);
      /*bottom: calc(60px + 5.8em);*/
      right: 30px;
      color: #ffffff;
      font-family: aLight;
      font-size: 0.85em;
      text-align: right;
      line-height: 1.5em;
    }
    .uniLink.menu{
      font-family: aLight;
      color: #98C6BD;
    }
		div#menuSocialsCon{
			display: inline-block;
			margin-top: 25px;
		}
		a.menuSocialLink{
			text-decoration: none;
			margin-left: 20px;
		}
		svg.socialsSVG{
			width: auto;
			height: 25px;
		}
		.facebook, .instagram, .linkedin, .archello{
			fill: #ffffff;
			transition: fill 0.5s;
		}
		a.menuSocialLink:hover .facebook, .facebook:hover{
			fill: #1877f2;
			transition: fill 0.5s;
		}
		a.menuSocialLink:hover .instagram, .instagram:hover{
			fill: #fcaf45;
			transition: fill 0.5s;
		}
		a.menuSocialLink:hover .linkedin, .linkedin:hover{
			fill: #0077b5;
			transition: fill 0.5s;
		}
		a.menuSocialLink:hover .archello, .archello:hover{
			fill: #33ccff;
			transition: fill 0.5s;
		}

    /*Universal Styling*/
    div.sectionTitle{
      display: inline-block;
      width: 100%;
      height: auto;
      color: #000000;
      font-family: aUltraLight;
      font-size: 4em;
      vertical-align: bottom;
    }
    span.aHeavy{
      font-family: aHeavy;
    }
		span.aLightItalic{
      font-family: aLightItalic;
    }
		a.uniLink{
      position: relative;
      color: #505050;
      font-family: aHeavy;
      text-decoration: none;
      white-space: nowrap;
    }
    a.uniLink::after{
      content: '';
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      width: 0;
      left: 0;
      height: 2px;
      white-space: nowrap;
      background: currentColor;
      transition: width 0.3s ease;
    }
    a.uniLink:hover{
      cursor: pointer;
    }
    a.uniLink:hover::after{
      cursor: pointer;
      width: 100%;
    }
    .uniLink.dark{
      color: #febe10;
    }
		.uniLink.kahrs{
      color: #ffffff;
    }
    .lineFlat,.lineTop,.lineBottom{
      fill: none;
      stroke-linecap: round;
      stroke-miterlimit: 10;
      stroke-width: 20px;
    }
    .lineFlat{
      stroke: #4d4d4d;
      transition: stroke 0.5s;
    }
    .lineTop{
      stroke: #000000;
      stroke-dasharray: 1000;
      stroke-dashoffset: 1000;
      animation: drawWaiting2 5s linear alternate infinite;
      transition: stroke 0.5s;
    }
    .lineBottom{
      stroke: #666666;
      stroke-dasharray: 1000;
      stroke-dashoffset: 1000;
      animation: drawWaiting3 5s linear alternate infinite;
      transition: stroke 0.5s;
    }
    .lineFlat.dark{
      stroke: #b2b2b2;
      transition: stroke 0.5s;
    }
    .lineTop.dark{
      stroke: #cdcdcd;
      transition: stroke 0.5s;
    }
    .lineBottom.dark{
      stroke: #999999;
      transition: stroke 0.5s;
    }
    svg.backButton:hover{
      cursor: pointer;
    }
    svg.backButton:hover .lineTop{
      animation: drawHover2 1.5s linear forwards;
    }
    svg.backButton:hover .lineBottom{
      cursor: pointer;
      animation: drawHover3 1.5s linear forwards;
    }
    div#pageEndNav{
      position: relative;
			display: inline-block;
      width: 100vw;
      height: 55vh;
      background: rgba(0,0,0,1);
    }
    table#pageEndNavText{
      display: none;
    }
    table#pageEndNavText_Res{
      position: relative;
			width: 100%;
      height: 100%;
      background: rgba(0,0,0,0);
    }
    td#pageEndNextCon, td#pageEndPrevCon{
      width: 100%;
      height: auto;
      text-align: center;
      vertical-align: center;
      background: rgba(0,0,0,0.6);
    }
    div.pageEndLabelCon{
      display: none;
    }
    .pageEndLabelCon.res{
      display: inline-block;
      width: auto;
      height: auto;
      color: #ffffff;
      padding: 0px 30px;
      transition: color 0.3s;
    }
    div.pageEndMainLabel{
      font-family: aUltraLight;
      font-size: 3em;
			line-height: 0.9em;
    }
    div.pageEndSubLabel{
      font-family: aLight;
      font-size: 1em;
    }
    div#pageEndNavImg{
      position: relative;
			display: inline-block;
			width: 100%;
      height: 100%;
      background: rgba(0,0,0,0);
    }
    div#pageEndNextImg{
			opacity: 1;
      display: inline-block;
      width: 100%;
      height: 100%;
      background-position: center;
      background-size: cover;
      background-repeat: no-repeat;
			background-attachment: absolute;
      transition: opacity 0.3s;
    }
    div#pageEndPrevImg{
      display: none;
    }
    #pageEndPrevImg.last{
      display: inline-block;
      width: 100%;
      height: 100%;
      background-position: center;
      background-size: cover;
      background-repeat: no-repeat;
			background-attachment: absolute;
      transition: opacity 0.3s;
    }
    div#pageEndNextImg:hover, div#pageEndPrevImg:hover{
      opacity: 0.75;
      transition: opacity 0.3s;
    }
    a.pageEndLink{
			position: absolute;
			left: 0;
			bottom: 0;
      display: block;
			width: 100%;
      height: 100%;
      background: rgba(0,0,0,0);
      transition: background 0.3s;
    }
    a.pageEndLink:hover{
      background: rgba(0,0,0,0.3);
      transition: background 0.3s;
    }
    a.pageEndLinkSingle{
      display: none;
    }
    div#scrollDownAnim{
      display: none;
    }
    div.imageRights{
      position: absolute;
      bottom: 0;
      right: 0;
      color: #ffffff;
      font-family: aLight;
      font-size: 0.6em;
      padding: 4px 4px;
    }

    /*Index*/
    div#indexCon{
      z-index: 0;
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
			bottom: 0;
      background: #ffffff;
      overflow-x: hidden;
      overflow-y: scroll;
			-ms-overflow-style: none;
			scrollbar-width: none;
    }
		#indexCon::-webkit-scrollbar{
			display: none;
		}
    div#indexOpeningCon{
      position: relative;
      width: 100%;
      height: 100%;
      background-image: url("../sources/index/indexALT.jpg");
      background-color: #ffffff;
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      background-attachment: absolute;
    }
    div#indexOpeningTitleCon{
			position: absolute;
      top: calc(50% - 5em);
      left: 30px;
		}
		div#indexOpeningTitle{
			display: inline-block;
			background-position: bottom left;
			background-repeat: no-repeat;
			background-size: contain;
			background-attachment: absolute;
    }
		/*div#indexOpeningTitle{
      display: inline-block;
      color: #323232;
			background-position: bottom left;
			background-repeat: no-repeat;
			background-size: contain;
			background-attachment: absolute;
      font-family: aUltraLight;
      font-size: 4em;
      line-height: 0.9em;
      letter-spacing: -2px;
      padding-bottom: 20px;
    }*/
		#indexOpeningTitle.duara{
			height: 1.5em;
			width: 4.8em;
			background-image: url("../sources/furniture/tables/duara/duaraLogo.svg");
		}
		#indexOpeningTitle.elea{
			height: 3.333em;
			width: 10em;
			background-image: url("../sources/furniture/chairs/elea/eleaLogo.svg");
		}
		div#indexOpeningSubTitle{
      display: inline-block;
      color: #323232;
      font-family: aUltraLight;
      font-size: 1.2em;
			padding-top: 5px;
    }
		div#indexOpeningText{
      position: absolute;
      bottom: 30px;
      left: 30px;
      right: 30px;
      width: auto;
      height: auto;
      text-align: left;
    }
    div#indexOpeningSubText{
      display: inline-block;
      color: #323232;
      font-family: aUltraLight;
      font-size: 2em;
    }
		div#indexOpeningSubText.barakoa{
			font-family: aLight;
      font-size: 1em;
      line-height: 1.6em;
		}
    div.indexItemCon{
      opacity: 0;
      position: relative;
      width: calc(100% - 60px);
      height: auto;
      padding: 10vh 30px;
      transform: translateY(35px);
      transition: transform 0.5s, opacity 0.5s;
    }
    .indexItemCon.active{
      opacity: 1;
      transform: translateY(0px);
      transition: transform 0.5s, opacity 0.5s;
    }
    div.indexItemImage{
      display: inline-block;
      position: relative;
      background-size: contain;
      background-repeat: no-repeat;
      background-attachment: absolute;
    }
    div.indexItemTextCon{
      display: inline-block;
      position: relative;
      top: 0;
      width: 100%;
      height: auto;
      vertical-align: top;
    }
    div.indexItemIcon{
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;
      background-attachment: absolute;
    }
    .indexItemCon.furniture{
      overflow: hidden;
    }
    div#indexFurnitureImage{
      display: inline-block;
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      background-attachment: absolute;
      /*width: 100vw;
      height: calc(100vw - 30px);
      margin-left: -30px;*/
			width: 100%;
      height: 125vw;
			margin: 30px 0;
    }
    div#indexFurnitureLogo{
      display: inline-block;
      background-position: center left;
      background-repeat: no-repeat;
      background-size: contain;
      background-attachment: absolute;
      width: 100%;
      /*height: 25vh; Original config*/
      height: 18vh;
    }
    div#indexFurnitureDesc{
      display: inline-block;
      width: 100%;
      height: auto;
      color: #000000;
    }
    div#indexFurnitureDescText{
      font-family: aUltraLight;
      font-size: 2em;
    }
    .indexItemCon.kahrs{
      overflow: hidden;
    }
		div#indexKahrsImage{
      display: inline-block;
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      background-attachment: absolute;
			width: 100%;
      height: 115vw;
    }
		.indexItemIcon.kahrs{
      width: 25vw;
      height: 25vw;
      margin: 20px 0;
    }
		div#indexKahrsDesc{
      display: inline-block;
      width: 100%;
      height: auto;
      color: #000000;
    }
    div#indexKahrsTitle{
      font-family: openEBold;
      font-size: 2em;
      line-height: 1em;
			text-transform: uppercase;
    }
    .indexItemCon.projects{
      padding-bottom: 10vh;
    }
    div#indexProjectsImage{
      display: inline-block;
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      background-attachment: absolute;
      width: 100%;
      height: 150vw;
    }
    div#indexProjectsDesc{
      display: inline-block;
      width: 100%;
      height: auto;
      padding-top: 5vh;
      color: #000000;
    }
    div#indexProjectsTitle{
      font-family: aUltraLight;
      font-size: 4em;
      line-height: 1em;
    }
		.indexItemImage.zeroWaste{
      background-image: url("../sources/zeroWaste/lamps/lampGroup.jpg");
      background-position: center;
      background-size: 120%;
      width: 100%;
      height: calc((100vw - 60px)/1.5);
    }
		.indexItemIcon.zeroWaste{
      background-image: url("../sources/zeroWaste/zeroWaste.svg");
      width: 50vw;
      height: 33vw;
      margin: 20px 0;
    }
		.indexItemTextCon.wayaLeft{
      width: 100%;
      height: 15vw;
    }
    .indexItemIcon.wayaLogo{
      position: absolute;
      top: 0;
      left: 0;
      background-image: url("../sources/waya/wayaByDumont.svg");
      width: 32vw;
      height: 12.8vw;
    }
    .indexItemIcon.wayaRec{
      position: absolute;
      top: 0;
      right: 0;
      background-image: url("../sources/index/TheHightail_logo.svg");
      background-position: top right;
      width: 32vw;
      height: 15vw;
    }
    .indexItemImage.waya{
      background-position: center;
      background-size: cover;
      width: 100%;
      height: calc((100vw - 60px)*0.65);
    }
    .indexItemTextCon.wayaRight{
      color: #505050 !important;
      width: 100%;
    }
    .indexItemIcon.wayaItemLogo{
      display: none;
    }
    div.indexUniText{
      font-family: aLight;
      font-size: 1em;
      line-height: 1.6em;
    }
    a.indexLink{
      display: inline;
      color: inherit;
      font-family: bBold;
      font-size: 1.8em;
      text-decoration: none;
    }
    a.indexLink:hover{
      cursor: pointer;
    }
    div.linkArrow{
      display: inline;
      font-size: 1.2em;
      vertical-align: top;
      line-height: 0.9em;
      transform: translateX(0);
      transition: transform 0.3s;
    }
    a.indexLink:hover .linkArrow{
      transform: translateX(10px);
      transition: transform 0.3s;
    }

    /*Menu Sections*/
    div#furnitureCon, div#projectsCon{
      z-index: 0;
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: -4.5px;
      background-color: #ffffff;
      overflow-x: hidden;
      overflow-y: scroll;
			-ms-overflow-style: none;
			scrollbar-width: none;
    }
		#furnitureCon::-webkit-scrollbar, #projectsCon::-webkit-scrollbar {
			display: none;
		}
    #furnitureCon.dark, #projectsCon.dark{
      background: #000000;
      transition: background 0.5s;
    }
    div.furnitureCatBody, div.projectsCaseBody{
      display: inline-block;
      opacity: 0;
      color: #000000;
      width: calc(100vw - 60px);
      height: auto;
      font-family: aLight;
      font-size: 0.9em;
      line-height: 2em;
      margin-top: 5vh;
      margin-bottom: 5vh;
      margin-left: 30px;
      transform: translateY(35px);
      transition: color 0.5s, transform 0.5s, opacity 0.5s;
    }
    .furnitureCatBody.active, .projectsCaseBody.active{
      opacity: 1;
      transform: translateY(0px);
      transition: color 0.5s, transform 0.5s, opacity 0.5s;
    }
    .furnitureCatBody.dark, .projectsCaseBody.dark{
      color: #ffffff;
      transition: color 0.5s, transform 0.5s, opacity 0.5s;
    }
    span.specialText{
      font-size: 3.5em;
      line-height: 0.9em;
      font-family: aUltraLight;
    }
    span.specialSubText{
      font-family: aLightItalic;
    }
    div.projectsImageGroup{
      display: inline-block;
      width: calc(100vw - 60px);
      height: auto;
      margin-left: 30px;
    }
    div.projectsImageCon, div.clientImageCon{
      display: inline-block;
      opacity: 0;
      width: 100%;
      height: auto;
      background-position: center !important;
      background-size: cover !important;
      background-repeat: no-repeat !important;
      background-attachment: absolute !important;
      margin-bottom: 30px;
      -webkit-column-break-inside: avoid !important;
      -moz-column-break-inside: avoid !important;
      column-break-inside: avoid !important;
      transform: translateY(35px);
      transition: transform 0.5s, opacity 0.5s;
    }
    .projectsImageCon.text{
      display: inline-block;
      opacity: 0;
      width: 100%;
      height: auto;
      color: #000000;
      font-family: aLight;
      font-size: 0.9em;
      line-height: 2em;
      margin-bottom: 30px;
      transform: translateY(35px);
      transition: transform 0.5s, opacity 0.5s;
    }
    div.clientImageCon{
      width: calc(100% - 60px);
      height: calc((100vw - 60px)*1.4);
      margin-left: 30px;
      margin-top: 30px;
      margin-bottom: 0;
    }
    .projectsImageCon.active, .clientImageCon.active{
      opacity: 1;
      transform: translateY(0px);
      transition: transform 0.5s, opacity 0.5s;
    }
    div.clientImageText{
      position: absolute;
      background-color: #febe10;
      padding: 20px 30px;
    }
    span.textATitle{
      color: #000000;
      font-family: aUltraLight;
      font-size: 2em;
      line-height: 0.8em;
    }
    span.textBTitle{
      color: #000000;
      font-family: bBold;
      font-size: 3em;
      line-height: 0.8em;
    }
    span.textSubTitle{
      color: #000000;
      font-family: aLight;
      font-size: 0.85em;
      line-height: 0.8em;
    }
    .textATitle.dark, .textSubTitle.dark{
      color: #ffffff;
    }

    div.furnitureTextCon, div.projectsTextCon{
      z-index: 2;
      position: absolute;
      top: 10%;
      background: #ffffff;
      width: calc(20vw - 40px);
      min-width: calc(20vw - 40px);
      max-width: calc(20vw - 40px);
      height: auto;
      padding: 20px;
    }
    .furnitureTextCon.right, .projectsTextCon.right{
      right: 0;
      text-align: left;
    }
    .furnitureTextCon.left, .projectsTextCon.left{
      left: 0;
      text-align: right;
    }
    .projectsTextCon.dark, .projectsTextCon.dark{
      background: #000000;
    }
    div.furnitureWideImage.tableOne{
      display: inline-block;
      background: url("../sources/furniture/tables/tableOne.jpg");
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      background-attachment: absolute;
      width: 100vw;
      height: 60vh;
    }
  }
}

@media screen and (min-width: 901px){
  @media screen and (max-height: 500px){
    body{
      background-color: #febe10 !important;
    }
    div#loadingCon{
      display: none;
    }
    div#contents{
      display: none;
    }
    div#resizeMessage{
      display: block;
      color: #000000;
      width: calc(100vw - 80px);
      height: calc(100vh - 80px);
      font-size: 0.85em;
      word-wrap: break-word;
      margin: 40px 40px;
    }
  }
  @media screen and (min-height: 501px){
    div#resizeMessage{
      display: none;
    }
    div#loadingCon{
      position: absolute;
      top: 50%;
      margin-top: -100px;
      left: 50%;
      margin-left: -150px;
      width: 300px;
      height: 200px;
      overflow: hidden;
    }
    div#loadingIcon{
      position: absolute;
      top: 35px;
      left: 25px;
      width: 250px;
      height: 130px;
      background-image: url("../sources/system/loadingScreen.svg");
      background-position: center right;
      background-repeat: no-repeat;
      background-size: cover;
      background-attachment: absolute;
    }
    div#loadingMessage{
      display: none;
    }

    /*Base & Menu*/
    div#contents{
      pointer-events: none;
      opacity: 0;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      overflow: hidden;
      transition: opacity 0.5s;
    }
    #contents.active{
      pointer-events: all;
      opacity: 1;
      transition: opacity 0.5s;
    }
		div#headerLogo{
      z-index: 5;
      position: absolute;
      top: 5vh;
      left: 7.5vh;
      background-image: url("../sources/system/logo.svg");
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;
      background-attachment: absolute;
      background-blend-mode: difference;
      height: 4.5em;
      width: 8.7em;
      mix-blend-mode: difference;
      transition: opacity 0.5s;
    }
    #headerLogo:hover{
      opacity: 0.5;
      transition: opacity 0.5s;
    }
    #headerLogo.disabled{
      pointer-events: none;
    }
    a#headerLogoLink{
      display: block;
      width: 100%;
      height: 100%;
      opacity: 1;
      transition: opacity 0.5s;
    }
    div#headerCart{
      z-index: 4;
      position: fixed;
      top: calc(80px + 10vh);
      right: 6.5vh;
      color: #ffffff;
      width: 70px;
      height: 30px;
      text-align: left;
      vertical-align: top;
      padding: 0;
      mix-blend-mode: difference;
      overflow: visible;
    }
    #headerCart:hover{
      cursor: pointer;
    }
    .shopify-buy__cart-toggle__count{
      position: absolute;
      top: 0;
      left: 40px;
      font-family: aUltraLight;
      font-size: 1.8em;
      line-height: 1em;
      text-align: left;
      margin: 0;
    }
    .shopify-buy__icon-cart{
      position: absolute;
      top: 0;
      left: 0;
      width: 30px;
      height: 30px;
      fill: #ffffff;
      margin: 0;
      padding: 0;
    }
    .shopify-buy--visually-hidden{
      display: none;
    }
    div#menuButtonCon{
      z-index: 5;
      position: absolute;
      top: 5vh;
      right: 6.5vh;
      width: 80px;
      height: 80px;
      mix-blend-mode: difference;
    }
    div#menuButtonCon:hover{
      cursor: pointer;
    }
    div#menuButtonCon:hover .menuButtonDoorLeft{
      opacity: 0;
      transition: opacity 0.3s;
    }
    div#menuLabel{
      z-index: 5;
      position: absolute;
      top: 5vh;
      right: calc(6.5vh + 40px);
      height: 30px;
      width: 80px;
      font-family: aUltraLight;
      font-size: 1.8em;
      text-align: center;
      color: #ffffff;
      mix-blend-mode: difference;
      transform: rotate(-90deg);
      transform-origin: top right;
      transition: color 0.3s;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    }
    svg#menuButton{
      height: 80px;
      mix-blend-mode: difference;
    }
    .menuButtonFrame, .menuButtonDoorLeft, .menuButtonDoorRight{
      opacity: 1;
      fill: #ffffff;
      mix-blend-mode: difference;
      transition: opacity 0.3s, fill 0.3s;
    }
    div#menu{
      display: none;
      z-index: 4;
      position: absolute;
      background: #000000;
      width: 100vw;
      height: 100vh;
    }
    div#menuLinksCon{
      position: absolute;
      top: calc(10vh + 80px);
      left: 7.5vh;
      width: auto;
      height: auto;
    }
		#menuLinksCon.disabled{
			display: none;
		}
    a.menuLink{
      position: relative;
      font-family: aUltraLight;
      font-size: 3em;
      color: #ffffff;
      padding: 0 5px;
      margin-left: -5px;
      line-height: 1.5em;
      text-decoration: none;
    }
    a.menuLink::after{
      content: '';
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      width: 0;
      left: 0;
      height: 5px;
      background: currentColor;
      transition: width 0.3s ease;
    }
    a.menuLink.disabled{
      pointer-events: none;
      color: #febe10;
    }
    a.menuLink:hover{
      cursor: pointer;
    }
    a.menuLink:hover::after{
      cursor: pointer;
      width: 100%;
    }
		.menuLink.kahrs{
			display: none;
		}
    
		div#menuKahrsLinkCon{
			display: block;
      position: absolute;
      top: 20px;
      left: 25vw;
      width: 25vh;
      max-width: 25vh;
			height: 22.5vh;
			overflow: visible;
    }
		#menuKahrsLinkCon.active{
			pointer-events: none;
		}
    div#menuKahrsLogo{
			position: absolute;
			top: 0;
			left: 0;
			width: 25vh;
			height: 22.5vh;
			background: url("../sources/kahrs/kahrsLogo.svg");
			background-position: center;
			background-size: contain;
			background-repeat: no-repeat;
			background-attachment: absolute;
    }
		#menuKahrsLogo:hover{
			cursor: pointer;
		}
		div#menuKahrsTextCon{
			position: absolute;
			bottom: 0;
			left: 24.5vh;
			width: 50vh;
			height: 10vh;
			overflow: hidden;
		}
		div#menuKahrsTextOne, div#menuKahrsTextTwo{
			position: absolute;
			bottom: 1em;
			left: 0;
			opacity: 0;
			color: #ffffff;
			font-family: openEBold;
			font-size: 2.5em;
			line-height: 1em;
			text-transform: uppercase;
      transform: translateX(-50vh);
      transition: opacity 0.5s, transform 0.75s;
		}
		div#menuKahrsTextTwo{
			bottom: 0;
      transition-delay: 0.2s;
		}
    div#menuKahrsLinkCon:hover #menuKahrsTextOne,
    div#menuKahrsLinkCon:hover #menuKahrsTextTwo{
      opacity: 1;
			transform: translateX(2vh);
      transition: opacity 0.5s, transform 0.75s;
    }
		div#menuKahrsLinkCon:hover #menuKahrsTextTwo{
      transition-delay: 0.2s;
    }
    
		div#furnitureMenuLinksCon, div#projectsMenuLinksCon, div#kahrsMenuLinksCon, div#aboutMenuLinksCon, div#wayaMenuLinksCon, div#zeroMenuLinksCon{
      display: none;
      position: absolute;
      top: calc(10vh + 80px);
      left: calc(7.5vh - 5px);
      bottom: 0;
      width: 32vw;
      overflow: hidden;
    }
    div#furnitureMenuLinkImageCon, div#projectsMenuLinkImageCon, div#kahrsMenuLinkImageCon, div#aboutMenuLinkImageCon, div#wayaMenuLinkImageCon{
      position: absolute;
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      background-attachment: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 50vw;
      overflow: hidden;
    }
    div#zeroMenuLinksBG, div#wayaMenuLinksBG{
      display: none;
      position: absolute;
      top: 0;
      right: 0;
      width: 100vh;
      height: 100vh;
      background-size: cover;
      background-position: bottom left;
      background-repeat: no-repeat;
      background-attachment: absolute;
    }
    div.furnitureMenuLinkImage, div.projectsMenuLinkImage, div.kahrsMenuLinkImage, div.aboutMenuLinkImage, div.wayaMenuLinkImage{
      position: absolute;
      opacity: 0;
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      background-attachment: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      overflow: hidden;
      -webkit-transition: opacity ease 0.5s;
  	  -moz-transition: opacity ease 0.5s;
  	  -o-transition: opacity ease 0.5s;
  	  -ms-transition: opacity ease 0.5s;
  	  transition: opacity ease 0.5s;
    }
    div.furnitureMenuLinkImage.opaque, div.projectsMenuLinkImage.opaque, div.kahrsMenuLinkImage.opaque, div.aboutMenuLinkImage.opaque, div.wayaMenuLinkImage.opaque{
      opacity: 1;
      -webkit-transition: opacity ease 0.5s;
  	  -moz-transition: opacity ease 0.5s;
  	  -o-transition: opacity ease 0.5s;
  	  -ms-transition: opacity ease 0.5s;
  	  transition: opacity ease 0.5s;
    }
    div#backButtonFurniture, div#backButtonProjects, div#backButtonKahrs, div#backButtonAbout, div#backButtonWaya, div#backButtonZero{
      display: inline-block;
      position: absolute;
      width: 41px;
      height: 30px;
      margin-left: 5px;
    }
    div#furnitureList, div#projectsList, div#kahrsList, div#aboutList, div#wayaList, div#zeroList{
      position: absolute;
      top: 60px;
      left: 0;
      bottom: 0;
      width: calc(32vw + 20px);
      padding-bottom: 7.5vh;
      white-space: pre-line;
      overflow-x: hidden;
      overflow-y: auto;
    }
    div.furnitureCatLinkWrapper, div.aboutCatLinkWrapper, div.wayaCatLinkWrapper, div.zeroCatLinkWrapper{
      display: inline-block;
      margin-bottom: 0.8em;
      line-height: 0.7em !important;
    }
		div.furnitureCatLinkWrapper:nth-child(1), div.projectsCatLinkWrapper, div.kahrsCatLinkWrapper, div.wayaCatLinkWrapper:nth-child(1), div.zeroCatLinkWrapper:nth-child(1){
      display: inline-block;
      margin-bottom: 0.8em;
      line-height: 1.1em !important;
    }
    div.furintureCatLinkText, div.projectsCatLinkCat, div.kahrsCatLinkText, div.aboutCatLinkText, div.wayaCatLinkText, div.zeroCatLinkText{
      opacity: 0.5;
      display: inline-block;
      color: #ffffff;
      font-family: aLight;
      font-size: 1em;
      padding-left: 5px;
    }
    a.furnitureCatLink, a.projectsCatLink, a.kahrsCatLink, a.aboutCatLink, a.wayaCatLink, a.zeroCatLink{
      opacity: 1;
      display: inline-block;
      position: relative;
      color: #ffffff;
      font-family: aUltraLight;
      font-size: 3em;
      line-height: 1.1em;
      padding: 0 5px;
      text-decoration: none;
    }
    a.furnitureCatLink:nth-child(1), a.projectsCatLink, a.kahrsCatLink, a.wayaCatLink:nth-child(1), a.zeroCatLink:nth-child(1){
      line-height: 1.2em;
    }
    a.furnitureCatLink::after, a.projectsCatLink::after, a.kahrsCatLink::after, a.aboutCatLink::after, a.wayaCatLink::after, a.zeroCatLink::after{
      content: '';
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      width: 0;
      left: 0;
      height: 5px;
      background: currentColor;
      transition: width 0.3s ease;
    }
    a.furnitureCatLink:hover::after, a.projectsCatLink:hover::after, a.kahrsCatLink:hover::after, a.aboutCatLink:hover::after, a.wayaCatLink:hover::after, a.zeroCatLink:hover::after{
      cursor: pointer;
      width: 100%;
    }
    a.furnitureCatLink:hover, a.projectsCatLink:hover, a.kahrsCatLink:hover, a.aboutCatLink:hover, a.wayaCatLink:hover, a.zeroCatLink:hover{
      cursor: pointer;
    }
    .furnitureCatLink.active, .projectsCatLink.active, .kahrsCatLink.active, .aboutCatLink.active, .wayaCatLink.active, .zeroCatLink.active{
      pointer-events: none;
      color: #febe10;
    }
    div#wayaNav{
      position: relative;
      display: inline-block;
      margin-top: 5px;
      width: 8.4em;
      height: 3em;
    }
    .wayaPathM{
      fill: none;
      opacity: 0.65;
      stroke: #000000;
      stroke-linecap: round;
      stroke-miterlimit: 10;
      stroke-dasharray: 2200;
      stroke-dashoffset: 2200;
      stroke-width: 12px;
      transition: stroke-dashoffset 0.6s;
    }
    .wayaPathNM{
      fill: none;
      stroke: #ffffff;
      stroke-linecap: round;
      stroke-miterlimit: 10;
      stroke-dasharray: 2200;
      stroke-dashoffset: 0;
      stroke-width: 10px;
    }
    #wayaNav:hover{
      cursor: pointer;
    }
    #wayaNav:hover .wayaPathM{
      stroke-dashoffset: 0;
      transition: stroke-dashoffset 0.6s;
    }
    #wayaNav.disabled .wayaPathM{
      stroke-dashoffset: 0;
    }
    #wayaNav.disabled{
      pointer-events: none;
    }
    a#zeroWasteMenuNav{
      z-index: 5;
      position: absolute;
      top: 5vh;
      right: calc(13vh + 183px);
      width: auto;
      height: auto;
      filter: grayscale(0%);
      transition: filter 0.5s;
    }
    a#zeroWasteMenuNav:hover{
      cursor: pointer;
      filter: grayscale(100%);
      transition: filter 0.5s;
    }
    div#zeroWasteMenuLogo{
      background-image: url("../sources/system/zeroWasteLogo.svg");
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;
      background-attachment: absolute;
      height: 80px;
      width: 49px;
    }
    a#zeroWasteMenuText{
      z-index: 5;
      position: absolute;
      display: inline;
      top: calc(5vh + 20px);
      right: calc(13vh + 80px);
      height: 60px;
      width: 96px;
      font-family: aUltraLight;
      font-size: 1.5em;
      color: #ffffff;
      padding-left: 6px;
      line-height: 0.8em;
      mix-blend-mode: difference;
    }
    a#zeroWasteMenuText:hover{
      cursor: pointer;
    }
    #zeroWasteMenuText:hover + #zeroWasteMenuNav{
      cursor: pointer;
      filter: grayscale(100%);
      transition: filter 0.5s;
    }
    div#menuAddLinksCon{
      position: absolute;
      bottom: 5vh;
      left: 7.5vh;
      width: auto;
      max-width: 65vw;
      height: auto;
    }
    div#rights{
      display: inline-block;
      font-family: aHeavy;
      font-size: 0.8em;
      color: #ffffff;
    }
    .uniLink.addLinks{
      font-size: 0.8em;
      margin-left: 20px;
    }
    .uniLink.addLinksRes{
      display: none;
    }
    div#menuContactsCon{
      position: absolute;
      bottom: 5vh;
      right: 7.5vh;
      color: #ffffff;
      font-family: aLight;
      font-size: 0.85em;
      text-align: right;
      line-height: 1.5em;
    }
    .uniLink.menu{
      font-family: aLight;
      color: #98C6BD;
    }
		div#menuSocialsCon{
			display: inline-block;
			margin-top: 25px;
		}
		a.menuSocialLink{
			text-decoration: none;
			margin-left: 20px;
		}
		svg.socialsSVG{
			width: auto;
			height: 22px;
		}
		.facebook, .instagram, .linkedin, .archello{
			fill: #ffffff;
			transition: fill 0.5s;
		}
		a.menuSocialLink:hover .facebook, .facebook:hover{
			fill: #1877f2;
			transition: fill 0.5s;
		}
		a.menuSocialLink:hover .instagram, .instagram:hover{
			fill: #fcaf45;
			transition: fill 0.5s;
		}
		a.menuSocialLink:hover .linkedin, .linkedin:hover{
			fill: #0077b5;
			transition: fill 0.5s;
		}
		a.menuSocialLink:hover .archello, .archello:hover{
			fill: #33ccff;
			transition: fill 0.5s;
		}

    /*Universal Styling*/
    div.sectionTitle{
      width: auto;
      height: auto;
      color: #000000;
      font-family: aUltraLight;
      font-size: 4.5em;
      letter-spacing: -2px;
      vertical-align: bottom;
    }
    span.aHeavy{
      font-family: aHeavy;
    }
    span.aLightItalic{
      font-family: aLightItalic;
    }
		a.uniLink{
			
      position: relative;
      color: #505050;
      font-family: aHeavy;
      text-decoration: none;
      white-space: nowrap;
    }
    a.uniLink::after{
      content: '';
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      width: 0;
      left: 0;
      height: 2px;
      white-space: nowrap;
      background: currentColor;
      transition: width 0.3s ease;
    }
    a.uniLink:hover{
      cursor: pointer;
    }
    a.uniLink:hover::after{
      cursor: pointer;
      width: 100%;
    }
    .uniLink.dark{
      color: #febe10;
    }
		.uniLink.kahrs{
      color: #ffffff;
    }
    .lineFlat,.lineTop,.lineBottom{
      fill: none;
      stroke-linecap: round;
      stroke-miterlimit: 10;
      stroke-width: 20px;
    }
    .lineFlat{
      stroke: #4d4d4d;
      transition: stroke 0.5s;
    }
    .lineTop{
      stroke: #000000;
      stroke-dasharray: 1000;
      stroke-dashoffset: 1000;
      animation: drawWaiting2 5s linear alternate infinite;
      transition: stroke 0.5s;
    }
    .lineBottom{
      stroke: #666666;
      stroke-dasharray: 1000;
      stroke-dashoffset: 1000;
      animation: drawWaiting3 5s linear alternate infinite;
      transition: stroke 0.5s;
    }
    .lineFlat.dark{
      stroke: #b2b2b2;
      transition: stroke 0.5s;
    }
    .lineTop.dark{
      stroke: #cdcdcd;
      transition: stroke 0.5s;
    }
    .lineBottom.dark{
      stroke: #999999;
      transition: stroke 0.5s;
    }
    svg.backButton:hover{
      cursor: pointer;
    }
    svg.backButton:hover .lineTop{
      animation: drawHover2 1.5s linear forwards;
    }
    svg.backButton:hover .lineBottom{
      cursor: pointer;
      animation: drawHover3 1.5s linear forwards;
    }
    div#pageEndNav{
      position: relative;
      display: block;
      width: 100vw;
      height: 80vh;
      background: rgba(0,0,0,0);
    }
    table#pageEndNavText{
      position: absolute;
      width: 100vw;
      height: 80vh;
      background: rgba(0,0,0,0);
    }
    table#pageEndNavText_Res{
      display: none;
    }
    td#pageEndPrevCon, td#pageEndNextCon{
      width: 50%;
      height: auto;
      text-align: center;
      vertical-align: center;
    }
    div.pageEndLabelCon{
      width: auto;
      height: auto;
      color: #ffffff;
      mix-blend-mode: difference;
      padding-top: 6px;
      overflow-y: visible;
      transition: color 0.3s;
    }
    .pageEndLabelCon.res{
      display: none;
    }
    div.pageEndMainLabel{
      font-family: aUltraLight;
      font-size: 4em;
      background: #ffffff;
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
    div.pageEndSubLabel{
      font-family: aLight;
      font-size: 1em;
    }
    div#pageEndNavImg{
      position: absolute;
      width: 100vw;
      height: 80vh;
      background: rgba(0,0,0,0);
    }
    div#pageEndPrevImg, div#pageEndNextImg{
      display: inline-block;
      float: left;
      width: 50%;
      height: 100%;
      background-position: center;
      background-size: 100%;
      background-repeat: no-repeat;
      transition: background-size 0.3s, opacity 0.3s;
    }
    div#pageEndNextImg{
      float: right;
    }
    div#pageEndPrevImg:hover, div#pageEndNextImg:hover{
      background-size: 103%;
      transition: background-size 0.3s;
    }
    #pageEndPrevImg.active, #pageEndNextImg.active{
      background-size: 103%;
      transition: background-size 0.3s;
    }
    a.pageEndLink{
      display: block;
      width: 100%;
      height: 100%;
      background: rgba(0,0,0,0.4);
      transition: background 0.3s;
    }
    a.pageEndLink:hover, .pageEndLink.active{
      background: rgba(0,0,0,0);
      transition: background 0.3s;
    }
    a.pageEndLinkSingle{
      display: block;
      position: absolute;
      width: 100%;
      height: 80vh;
      text-decoration: none;
    }
    div#scrollDownAnim{
      z-index: 1;
      position: absolute;
      bottom: 10vh;
      left: 10vh;
      width: 32px;
      height: 300px;
      background-image: url("../sources/system/scrollDown.svg");
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      background-attachment: absolute;
      background-blend-mode: difference;
      mix-blend-mode: difference;
    }
    #scrollDownAnim.right{
      left: auto;
      right: 10vh;
    }
    div.imageRights{
      position: absolute;
      bottom: 0;
      right: 0;
      color: #ffffff;
      font-family: aHeavy;
      font-size: 0.7em;
      padding: 4px 4px;
    }

    /*Index*/
    div#indexCon{
      z-index: 0;
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: #ffffff;
      overflow-x: hidden;
      overflow-y: scroll;
    }
    div#indexOpeningCon{
      position: relative;
      width: 100%;
      height: 200vh;
      background-image: url("../sources/index/index.jpg");
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      background-attachment: absolute;
    }
		div#indexOpeningTitleCon{
      position: absolute;
      top: 45vh;
      left: calc(9em + 7.5vh + 3.5vw);
    }
		div#indexOpeningTitle{
      display: inline-block;
			background-position: bottom left;
			background-repeat: no-repeat;
			background-size: contain;
			background-attachment: absolute;
    }
    /*div#indexOpeningTitle{
      display: inline-block;
			background-position: bottom left;
			background-repeat: no-repeat;
			background-size: contain;
			background-attachment: absolute;
      font-family: aUltraLight;
      font-size: 4.5em;
      letter-spacing: -2px;
    }*/
		#indexOpeningTitle.duara{
			height: 1.6em;
			width: 4.8em;
			background-image: url("../sources/furniture/tables/duara/duaraLogo.svg");
		}
		#indexOpeningTitle.elea{
			height: 5vw;
			width: 15vw;
			background-image: url("../sources/furniture/chairs/elea/eleaLogo.svg");
		}
    div#indexOpeningSubTitle{
      display: inline-block;
      color: #323232;
      font-family: aUltraLight;
      font-size: 1.7em;
			padding-top: 10px;
    }
		div#indexOpeningText{
      position: absolute;
      bottom: 60vh;
      left: calc(50% - 11vw);
			width: 22vw;
      height: 10vh;
      color: #323232;
      text-align: center;
    }
		div#indexOpeningSubText{
      display: inline-block;
      color: #323232;
      font-family: aUltraLight;
      font-size: 2.5em;
    }
		div#indexOpeningSubText.barakoa{
			width: 30vw;
		}
    div.indexItemCon{
      opacity: 0;
      position: relative;
      width: 100%;
      height: auto;
      padding: 5vh 0;
      transform: translateY(35px);
      transition: transform 0.5s, opacity 0.5s;
    }
    .indexItemCon.active{
      opacity: 1;
      transform: translateY(0px);
      transition: transform 0.5s, opacity 0.5s;
    }
    div.indexItemImage{
      display: inline-block;
      position: relative;
      background-size: contain;
      background-repeat: no-repeat;
      background-attachment: absolute;
    }
    div.indexItemTextCon{
      display: inline-block;
      position: relative;
      top: 0;
      width: 22vw;
      height: auto;
      vertical-align: top;
    }
    div.indexItemIcon{
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;
      background-attachment: absolute;
    }
    .indexItemCon.furniture{
      height: 35vw;
      overflow-y: hidden;
    }
    div#indexFurnitureImage{
      position: absolute;
      top: 0;
      left: calc(50% - 12.5vw);
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      background-attachment: absolute;
      width: 25vw;
      height: 35vw;
    }
    div#indexFurnitureLogo{
      position: absolute;
      /*top: calc(50% - 15vh);
      left: 15vw; Original Config*/
			top: 0;
      left: 22.5vw;
      background-position: center right;
      background-repeat: no-repeat;
      background-size: contain;
      background-attachment: absolute;
      /*width: 15vw;
      height: 30vh; original config*/
			width: 10vw;
      height: 10vw;
    }
    div#indexFurnitureDesc{
      position: absolute;
      /*top: calc(50% - 12vh);*/
			bottom: 5vh;
      right: 12.5vw;
      width: 20vw;
      height: 30vh;
      color: #000000;
      vertical-align: bottom;
    }
    div#indexFurnitureDescText{
      font-family: aUltraLight;
      font-size: 2em;
    }
    .indexItemCon.kahrs{
      height: 80vh;
			margin-bottom: 5vh;
      overflow-y: hidden;
    }
		.indexItemIcon.kahrs{
			position: absolute;
			top: 5vh;
			left: 20vw;
      width: 10vw;
      height: 10vw;
			background-position: top left;
    }
		div#indexKahrsImage{
      position: absolute;
      top: 5vh;
      right: 20vw;
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      background-attachment: absolute;
      width: 30vw;
      height: 37.5vw;
    }
    div#indexKahrsDesc{
      position: absolute;
      top: 30vh;
      left: 20vw;
      width: 25vw;
      height: 50vh;
      color: #000000;
      vertical-align: middle;
    }
    div#indexKahrsTitle{
      font-family: openEBold;
      font-size: 3em;
      line-height: 1em;
			text-transform: uppercase;
    }
		.indexItemCon.projects{
      height: 80vh;
      padding-bottom: 10vh;
    }
    div#indexProjectsImage{
      position: absolute;
      top: 5vh;
      left: 20vw;
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      background-attachment: absolute;
      width: 54vh;
      height: 80vh;
    }
    div#indexProjectsDesc{
      position: absolute;
      top: 20vh;
      left: calc(20vw + 54vh + 5vh);
      width: 30vw;
      height: 50vh;
      color: #000000;
      vertical-align: middle;
    }
    div#indexProjectsTitle{
      font-family: aUltraLight;
      font-size: 4.5em;
      line-height: 1em;
    }
		.indexItemCon.zeroWaste{
      padding: 5vh 10vw;
    }
		.indexItemImage.zeroWaste{
      background-image: url("../sources/zeroWaste/lamps/lampGroup.jpg");
      background-position: center;
      width: 55vw;
      height: 30vw;
    }
		.indexItemTextCon.zeroWaste{
      color: #000000 !important;
      width: 15vw;
    }
		.indexItemIcon.zeroWaste{
      background-image: url("../sources/zeroWaste/zeroWaste.svg");
      width: 18vw;
      height: 12vw;
      margin: 20px 0;
    }
		.indexItemCon.waya{
      padding-left: 15vw;
      padding-right: 10vw;
    }
    .indexItemTextCon.wayaLeft{
      width: 14vw;
      height: 30vw;
    }
    .indexItemIcon.wayaLogo{
      position: absolute;
      top: 0;
      left: 0;
      background-image: url("../sources/waya/wayaByDumont.svg");
      width: 14vw;
      height: 5.6vw;
      margin: 20px 0;
    }
    .indexItemIcon.wayaRec{
      position: absolute;
      bottom: 0;
      left: 0;
      background-image: url("../sources/waya/recycled.svg") !important;
      width: 12vw;
      height: 12vw;
      margin: 20px 0;
    }
    .indexItemImage.waya{
      background-position: top center;
      background-size: contain;
      width: 41vw;
      height: 30vw;
    }
    .indexItemTextCon.wayaRight{
      color: #505050 !important;
      width: 15vw;
    }
    .indexItemIcon.wayaItemLogo{
      background-position: left bottom;
			background-size: contain;
      width: 15vw;
      height: 9vw;
      margin: 18px 0;
    }
    div.indexUniText{
      font-family: aLight;
      font-size: 0.9em;
      line-height: 1.5em;
    }
    a.indexLink{
      display: inline;
      color: inherit;
      font-family: bBold;
      font-size: 1.2em;
      text-decoration: none;
    }
    a.indexLink:hover{
      cursor: pointer;
    }
    div.linkArrow{
      display: inline-block;
      transform: translateX(0);
      transition: transform 0.3s;
    }
    a.indexLink:hover .linkArrow{
      transform: translateX(10px);
      transition: transform 0.3s;
    }

    /*Furniture & Projects*/
    div#furnitureCon, div#projectsCon{
      z-index: 0;
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: #ffffff;
      text-align: left;
      overflow-x: hidden;
      overflow-y: scroll;
    }
    #furnitureCon.dark, #projectsCon.dark{
      background: #000000;
    }
    div.furnitureCatBody, div.projectsCaseBody{
      display: inline-block;
      opacity: 0;
      color: #000000;
      width: calc(100vw - 30vh - 8.7em - 95px);
      max-width: calc(100vw - 30vh - 8.7em - 95px);
      height: auto;
      font-family: aLight;
      font-size: 0.9em;
      line-height: 2em;
      margin-top: 10vh;
      margin-bottom: 10vh;
      margin-left: calc(15vh + 8.7em + 15px);
      transform: translateY(35px);
      transition: color 0.5s, transform 0.5s, opacity 0.5s;
    }
    .furnitureCatBody.active, .projectsCaseBody.active{
      opacity: 1;
      transform: translateY(0px);
      transition: color 0.5s, transform 0.5s, opacity 0.5s;
    }
    .furnitureCatBody.dark, .projectsCaseBody.dark{
      color: #ffffff;
      transition: color 0.5s, transform 0.5s, opacity 0.5s;
    }
    span.specialText{
      font-size: 3.5em;
      font-family: aUltraLight;
    }
    span.specialSubText{
      font-family: aLightItalic;
    }
    div.projectsImageGroup{
      display: inline-block;
      width: calc(100vw - 30vh - 8.7em - 80px + 4vw);
      max-width: calc(100vw - 30vh - 8.7em - 80px + 4vw);
      height: calc(auto - 35px);
      margin-left: calc(15vh + 8.7em);
    }
    .projectsImageGroup.last{
      margin-bottom: 10vh;
    }
    div.projectsImageCon{
      opacity: 0;
      width: calc(50% - 5vw);
      float: left;
      height: auto;
      background-position: center !important;
      background-size: cover !important;
      background-repeat: no-repeat !important;
      background-attachment: absolute !important;
      margin-bottom: 5vw;
      margin-right: 5vw;
      transform: translateY(35px);
      transition: transform 0.5s, opacity 0.5s;
    }
    .projectsImageCon.text{
      width: calc(50% - 5vw);
      float: left;
      height: auto;
      color: #000000;
      font-family: aLight;
      font-size: 0.9em;
      line-height: 2em;
      transform: translateY(35px);
      transition: transform 0.5s, opacity 0.5s;
    }
    div.clientImageCon{
      display: inline-block;
      opacity: 0;
      width: calc(100vw - 7.5vh - 8.1em - 7.5vh - 20vw);
      height: auto;
      margin-top: 5vh;
      margin-bottom: 5vh;
      margin-left: calc(7.5vh + 8.1em + 7.5vh);
      transform: translateY(35px);
      transition: transform 0.5s, opacity 0.5s;
    }
    .projectsImageCon.active, .clientImageCon.active{
      opacity: 1;
      transform: translateY(0px);
      transition: transform 0.5s, opacity 0.5s;
    }
    div.clientImageText{
      position: absolute;
      background-color: #febe10;
      padding: 20px 30px;
    }
    span.textATitle{
      color: #000000;
      font-family: aUltraLight;
      font-size: 2em;
      line-height: 0.8em;
    }
    span.textBTitle{
      color: #000000;
      font-family: bBold;
      font-size: 4em;
      line-height: 0.8em;
    }
    span.textSubTitle{
      color: #000000;
      font-family: aLight;
      font-size: 0.85em;
      line-height: 0.8em;
    }
    .textATitle.dark, .textSubTitle.dark{
      color: #ffffff;
    }

    div.projectsTextCon{
      z-index: 2;
      position: absolute;
      top: 10%;
      background: #ffffff;
      width: calc(20vw - 40px);
      min-width: calc(20vw - 40px);
      max-width: calc(20vw - 40px);
      height: auto;
      padding: 20px;
    }
    .projectsTextCon.right{
      right: 0;
      text-align: left;
    }
    .projectsTextCon.left{
      left: 0;
      text-align: right;
    }
    .projectsTextCon.dark{
      background: #000000;
    }
    div.furnitureWideImage.tableOne{
      display: inline-block;
      background: url("../sources/furniture/tables/tableOne.jpg");
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      background-attachment: absolute;
      width: 100vw;
      height: 60vh;
    }
  }
}

#zeroMenuLinksBG{
	background-image: url("../sources/zeroWaste/menuBG.svg");
}
#wayaMenuLinksBG{
  background-image: url("../sources/waya/menuBG.svg");
}
#indexFurnitureLogo{
  background-image: url("../sources/furniture/portfolio/pf4/casaBPLogo.svg");
}
#indexFurnitureImage{
  background-image: url("../sources/furniture/portfolio/pf4/pf4-4.jpg");
}
#indexKahrsImage{
	background-image: url("../sources/kahrs/portfolio/sanssouciatmsasa/msasa1.jpg");
}
.indexItemIcon.kahrs{
	background-image: url("../sources/kahrs/kahrsLogo.svg");
}
#indexProjectsImage{
	background-image: url("../sources/projects/uaHouse/cover.jpg");
}
.indexItemImage.waya{
  background-image: url("../sources/index/morris.jpg");
}
.indexItemIcon.wayaItemLogo{
  background-image: url("../sources/index/morris_logo.svg");
}
.indexItemIcon.wayaRec{
	background-image: url("../sources/index/morris_logo.svg");
}

/*Animations*/
@keyframes drawWayaIn{
  0%{stroke-dashoffset: 0;}
  45%{stroke-dashoffset: -2200;}
  45.5%{stroke-dashoffset: 2200;}
  55%{stroke-dashoffset: 2200;}
  100%{stroke-dashoffset: 0;}
}
@keyframes drawWayaOut{
  0%{stroke-dashoffset: 0;}
  45%{stroke-dashoffset: 2200;}
  45.5%{stroke-dashoffset: -2200;}
  55%{stroke-dashoffset: -2200;}
  100%{stroke-dashoffset: 0;}
}
@keyframes drawHover2{
  10%{stroke-dashoffset: 1000;}
  60%{stroke-dashoffset: 0;}
  100%{stroke-dashoffset: 0;}
}
@keyframes drawHover3{
  20%{stroke-dashoffset: 1000;}
  80%{stroke-dashoffset: 0;}
  100%{stroke-dashoffset: 0;}
}
@keyframes drawWaiting2{
  2%{stroke-dashoffset: 1000;}
  12%{stroke-dashoffset: 0;}
  100%{stroke-dashoffset: 0;}
}
@keyframes drawWaiting3{
  6%{stroke-dashoffset: 1000;}
  18%{stroke-dashoffset: 0;}
  100%{stroke-dashoffset: 0;}
}

/*Fonts*/
@font-face {
	font-family: 'aUltraLight';
	src: url('fonts/Aileron-UltraLight.eot');
	src: url('fonts/Aileron-UltraLight.eot?#iefix') format('embedded-opentype'),
			url('fonts/Aileron-UltraLight.woff2') format('woff2'),
			url('fonts/Aileron-UltraLight.woff') format('woff'),
			url('fonts/Aileron-UltraLight.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'aBlack';
	src: url('fonts/Aileron-Black.eot');
	src: url('fonts/Aileron-Black.eot?#iefix') format('embedded-opentype'),
			url('fonts/Aileron-Black.woff2') format('woff2'),
			url('fonts/Aileron-Black.woff') format('woff'),
			url('fonts/Aileron-Black.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'aHeavy';
	src: url('fonts/Aileron-Heavy.eot');
	src: url('fonts/Aileron-Heavy.eot?#iefix') format('embedded-opentype'),
			url('fonts/Aileron-Heavy.woff2') format('woff2'),
			url('fonts/Aileron-Heavy.woff') format('woff'),
			url('fonts/Aileron-Heavy.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'aLightItalic';
	src: url('fonts/Aileron-LightItalic.eot');
	src: url('fonts/Aileron-LightItalic.eot?#iefix') format('embedded-opentype'),
			url('fonts/Aileron-LightItalic.woff2') format('woff2'),
			url('fonts/Aileron-LightItalic.woff') format('woff'),
			url('fonts/Aileron-LightItalic.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'aLight';
	src: url('fonts/Aileron-Light.eot');
	src: url('fonts/Aileron-Light.eot?#iefix') format('embedded-opentype'),
			url('fonts/Aileron-Light.woff2') format('woff2'),
			url('fonts/Aileron-Light.woff') format('woff'),
			url('fonts/Aileron-Light.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'bBold';
	src: url('fonts/BebasNeueBold.eot');
	src: url('fonts/BebasNeueBold.eot?#iefix') format('embedded-opentype'),
			url('fonts/BebasNeueBold.woff2') format('woff2'),
			url('fonts/BebasNeueBold.woff') format('woff'),
			url('fonts/BebasNeueBold.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'bReg';
	src: url('fonts/BebasNeueRegular.eot');
	src: url('fonts/BebasNeueRegular.eot?#iefix') format('embedded-opentype'),
			url('fonts/BebasNeueRegular.woff2') format('woff2'),
			url('fonts/BebasNeueRegular.woff') format('woff'),
			url('fonts/BebasNeueRegular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'bLight';
	src: url('fonts/BebasNeueLight.eot');
	src: url('fonts/BebasNeueLight.eot?#iefix') format('embedded-opentype'),
			url('fonts/BebasNeueLight.woff2') format('woff2'),
			url('fonts/BebasNeueLight.woff') format('woff'),
			url('fonts/BebasNeueLight.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'openLight';
	src: url('fonts/OpenSans-Light.woff') format('woff'),
			url('fonts/OpenSans-Light.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'openSBold';
	src: url('fonts/OpenSans-Semibold.woff') format('woff'),
			url('fonts/OpenSans-Semibold.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'openEBold';
	src: url('fonts/OpenSans-ExtraBold.woff') format('woff'),
			url('fonts/OpenSans-ExtraBold.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}