/*!********************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/scss/style.scss ***!
  \********************************************************************************************************************************************************/
@font-face {
  font-family: "Neue Haas Grotesk Display Pro";
  src: url(../js/4a8de49b22411b2fc71d.eot);
  src: url(../js/4a8de49b22411b2fc71dd41d.eot?#iefix) format("embedded-opentype"), url(../js/8b33ba08d72df4c22618.woff2) format("woff2"), url(../js/288dede4e657a8f50bcc.woff) format("woff"), url(../js/fd602ba2ad7e848411c1.ttf) format("truetype"), url(../js/b7184a52055414c45ebe.svg#NeueHaasDisplay-Roman) format("svg");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Monument Grotesk";
  src: url(../js/99ab3a6bd6e61ad443ba.eot);
  src: url(../js/99ab3a6bd6e61ad443bad41d.eot?#iefix) format("embedded-opentype"), url(../js/308593b082b168455619.woff2) format("woff2"), url(../js/e17e1760fafc9bee0108.woff) format("woff"), url(../js/54045ce5c5f835fbc7d0.ttf) format("truetype"), url(../js/82d3d0604bcbe30eb41e.svg#MonumentGrotesk-Regular) format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Monument Grotesk";
  src: url(../js/787398ba0810f5a9d1d7.eot);
  src: url(../js/787398ba0810f5a9d1d7d41d.eot?#iefix) format("embedded-opentype"), url(../js/0fe21f34a33e6ea68b71.woff2) format("woff2"), url(../js/4bcc3a8698a113d03735.woff) format("woff"), url(../js/10070e69c6904a2dc816.ttf) format("truetype"), url(../js/0d2bd7037368fa59372d.svg#MonumentGrotesk-Medium) format("svg");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Monument Grotesk";
  src: url(../js/bd770f0a4c415ca7e756.eot);
  src: url(../js/bd770f0a4c415ca7e756d41d.eot?#iefix) format("embedded-opentype"), url(../js/48e37bc370a0540e3ec8.woff2) format("woff2"), url(../js/e0b946cae769659a025d.woff) format("woff"), url(../js/48713cb79b0fb4f14607.ttf) format("truetype"), url(../js/88c7f3543d391d98dbee.svg#MonumentGrotesk-Bold) format("svg");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
/*
*	MEDIA QUERY
*/
::-webkit-scrollbar {
  display: none;
}

/*input:-webkit-autofill {
 	background-color: rgba(255, 255, 255, 0.1) !important;
	-webkit-box-shadow: 0 0 0px 100px #534f63 inset;
  	color: #fff !important;
	-webkit-text-fill-color: #fff;
}*/
* {
  -webkit-font-smoothing: antialiased;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  * {
    -ms-scroll-chaining: none;
        overscroll-behavior: none;
  }
}

html.has-scroll-smooth {
  overflow: hidden;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}

.player .vp-controls {
  position: absolute !important;
}

input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active {
  -webkit-transition: "color 9999s ease-out, background-color 9999s ease-out";
  -webkit-transition-delay: 9999s;
}

input:focus, select:focus, textarea:focus, button:focus {
  outline: none;
}

@-webkit-keyframes circle-chart-fill {
  from {
    stroke-dashoffset: 1000;
  }
  to {
    stroke-dashoffset: 0;
  }
}

@keyframes circle-chart-fill {
  from {
    stroke-dashoffset: 1000;
  }
  to {
    stroke-dashoffset: 0;
  }
}
@-webkit-keyframes animation-rotation-dots {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@keyframes animation-rotation-dots {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@-webkit-keyframes inner-circle-ani {
  0% {
    opacity: 0;
  }
  25% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  75% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes ext-circle-ani {
  0% {
    opacity: 0;
  }
  25% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  75% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes ext-circle-ani {
  0% {
    opacity: 0;
  }
  25% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  75% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes ellipsis_1 {
  0% {
    opacity: 0;
  }
  15% {
    opacity: 1;
  }
  30% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  70% {
    opacity: 1;
  }
  85% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@keyframes ellipsis_1 {
  0% {
    opacity: 0;
  }
  15% {
    opacity: 1;
  }
  30% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  70% {
    opacity: 1;
  }
  85% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes ellipsis_2 {
  0% {
    opacity: 0;
  }
  15% {
    opacity: 0;
  }
  30% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  70% {
    opacity: 1;
  }
  85% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@keyframes ellipsis_2 {
  0% {
    opacity: 0;
  }
  15% {
    opacity: 0;
  }
  30% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  70% {
    opacity: 1;
  }
  85% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes ellipsis_3 {
  0% {
    opacity: 0;
  }
  15% {
    opacity: 0;
  }
  30% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  70% {
    opacity: 1;
  }
  85% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@keyframes ellipsis_3 {
  0% {
    opacity: 0;
  }
  15% {
    opacity: 0;
  }
  30% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  70% {
    opacity: 1;
  }
  85% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes navVideAnimation {
  0% {
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
  }
  100% {
    -webkit-transform: translateY(0%);
    transform: translateY(0%);
  }
}
@-webkit-keyframes writeUsIcon {
  0% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  25% {
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
  75% {
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }
  100% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}
@keyframes writeUsIcon {
  0% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  25% {
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
  75% {
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }
  100% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}
@-webkit-keyframes planeIcon {
  0% {
    -webkit-transform: translate(-6px, 6px);
    transform: translate(-6px, 6px);
  }
  50% {
    -webkit-transform: translate(6px, -6px);
    transform: translate(6px, -6px);
  }
  100% {
    -webkit-transform: translate(-6px, 6px);
    transform: translate(-6px, 6px);
  }
}
@keyframes planeIcon {
  0% {
    -webkit-transform: translate(-6px, 6px);
    transform: translate(-6px, 6px);
  }
  50% {
    -webkit-transform: translate(6px, -6px);
    transform: translate(6px, -6px);
  }
  100% {
    -webkit-transform: translate(-6px, 6px);
    transform: translate(-6px, 6px);
  }
}
@-webkit-keyframes scrollDownHome {
  0% {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
  75% {
    -webkit-transform: translate(9px, 0);
    transform: translate(9px, 0);
    opacity: 0;
  }
  100% {
    -webkit-transform: translate(12px, 0);
    transform: translate(12px, 0);
    opacity: 0;
  }
}
@keyframes scrollDownHome {
  0% {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
  75% {
    -webkit-transform: translate(9px, 0);
    transform: translate(9px, 0);
    opacity: 0;
  }
  100% {
    -webkit-transform: translate(12px, 0);
    transform: translate(12px, 0);
    opacity: 0;
  }
}
/*
*	MEDIA QUERY
*/
.transition-fade {
  -webkit-transition: 0.4s;
  transition: 0.4s;
  opacity: 1;
}

html.is-animating .transition-fade {
  opacity: 0;
}

.cerchio-shooting {
  width: 26px;
  position: absolute;
  top: 5px;
  left: -40px;
}

.pallino-shooting {
  position: absolute;
  top: 13px;
  left: -32px;
}

.player .vp-controls {
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  bottom: auto;
  height: auto;
  right: auto;
}

.thanks-message {
  position: fixed;
  z-index: 999;
  top: 50%;
  width: 100%;
  text-align: center;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  opacity: 0;
  visibility: hidden;
}
.thanks-message .message__wrapper {
  opacity: 0;
  visibility: hidden;
  -webkit-transform: translateY(200px);
  transform: translateY(200px);
}
.thanks-message .message__wrapper h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 7rem;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  .thanks-message .message__wrapper h3 {
    font-size: 2rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  .thanks-message .message__wrapper h3 {
    font-size: 4rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  .thanks-message .message__wrapper h3 {
    font-size: 4rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  .thanks-message .message__wrapper h3 {
    font-size: 4rem;
  }
}

.video-mobile__outer {
  position: fixed;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
  opacity: 0;
  visibility: hidden;
  z-index: 999;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.video-mobile__outer .video-mobile__close {
  position: absolute;
  right: 6.25vw;
  top: 2.5rem;
  width: 1.6rem;
  opacity: 0;
}
.video-mobile__outer .video-mobile__close .svg-close {
  fill: #fff;
}
.video-mobile__outer .video-mobile__bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.video-mobile__outer .video-mobile__bg .bg {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 0%;
  background-color: black;
}
.video-mobile__outer .video-mobile {
  position: relative;
  width: 87.5vw;
  height: 49.21875vw;
  margin: 0 auto;
  opacity: 0;
  -webkit-transform: translateY(80px);
  transform: translateY(80px);
}
.video-mobile__outer .video-mobile .video-mobile__wrapper {
  position: relative;
  width: 100%;
  height: 100%;
}
.video-mobile__outer .video-mobile .video-mobile__wrapper iframe {
  width: 100%;
  height: 100%;
}

#fixedMenu {
  position: fixed;
  top: -10vh;
  left: 0;
  width: 100vw;
  z-index: 50;
  -webkit-transition: top 0.5s ease-in-out 0s;
  transition: top 0.5s ease-in-out 0s;
}
#fixedMenu.show {
  top: 0;
  -webkit-transition: top 0.5s ease-in-out 0s;
  transition: top 0.5s ease-in-out 0s;
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #fixedMenu {
    height: 15vh;
  }
}
#fixedMenu .logo {
  position: absolute;
  top: 5vh;
  left: 6.25vw;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  height: 40px;
  width: auto;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #fixedMenu .logo {
    height: 30px;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #fixedMenu .logo {
    width: 12.5vw;
    height: auto;
  }
  #fixedMenu .logo a {
    position: relative;
    display: block;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #fixedMenu .logo {
    width: 6.25vw;
    height: auto;
    top: 50%;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #fixedMenu .logo {
    width: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #fixedMenu .logo {
    height: 35px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #fixedMenu .logo {
    height: 35px;
  }
}
#fixedMenu .logo img {
  height: 100%;
  width: auto;
  display: block;
}
#fixedMenu .taxonomyNav__outer {
  position: absolute;
  top: 45vh;
  left: 3.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #fixedMenu .taxonomyNav__outer {
    display: none;
  }
}
#fixedMenu .taxonomyNav {
  position: relative;
  list-style: none;
  opacity: 0;
  -webkit-transition: opacity 0.5s ease-in-out 0s;
  transition: opacity 0.5s ease-in-out 0s;
}
#fixedMenu .taxonomyNav li {
  position: relative;
  letter-spacing: 2px;
  line-height: 35px;
  font-size: 12px;
  text-transform: uppercase;
  margin-top: 15px;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  padding-left: 30px;
}
#fixedMenu .taxonomyNav li:last-of-type {
  margin-right: 0;
}
#fixedMenu .taxonomyNav li:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 12px;
  width: 4px;
  height: 4px;
  background-color: #fff;
  border-radius: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
#fixedMenu .taxonomyNav li:after {
  content: "";
  position: absolute;
  top: 50%;
  left: 1px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 1px solid var(--subColor);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  opacity: 0;
}
#fixedMenu .taxonomyNav li.current {
  color: var(--subColor);
}
#fixedMenu .taxonomyNav li.current:after {
  opacity: 1;
}
#fixedMenu.show .taxonomyNav {
  opacity: 1;
  -webkit-transition: opacity 0.5s ease-in-out 0.5s;
  transition: opacity 0.5s ease-in-out 0.5s;
}
#fixedMenu .hamMenu {
  position: absolute;
  top: 5vh;
  right: 6.25vw;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  z-index: 52;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #fixedMenu .hamMenu {
    width: 60px;
    height: 60px;
    right: calc(6.25vw - 20px);
  }
}
#fixedMenu .hamMenu .label {
  position: absolute;
  padding-top: 3.75rem;
  left: 50%;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  text-align: center;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
#fixedMenu .hamMenu .label span {
  position: relative;
  display: block;
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}
#fixedMenu .hamMenu .open {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 40px;
  height: 8px;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
#fixedMenu .hamMenu .open span {
  position: absolute;
  width: 35px;
  height: 2px;
  background-color: #fff;
}
#fixedMenu .hamMenu .open span:first-of-type {
  top: 0;
  left: 0;
  -webkit-transition: left 0.35s ease-in-out 0s;
  transition: left 0.35s ease-in-out 0s;
}
#fixedMenu .hamMenu .open span:last-of-type {
  top: 6px;
  left: 5px;
  -webkit-transition: left 0.35s ease-in-out 0s;
  transition: left 0.35s ease-in-out 0s;
}
#fixedMenu .hamMenu .close {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
#fixedMenu .hamMenu .close span {
  position: absolute;
  width: 16px;
  height: 2px;
  background-color: #fff;
}
#fixedMenu .hamMenu .close span:first-of-type {
  -webkit-transform: translate(-50%, -50%) rotate(45deg);
  transform: translate(-50%, -50%) rotate(45deg);
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}
#fixedMenu .hamMenu .close span:last-of-type {
  -webkit-transform: translate(-50%, -50%) rotate(-45deg);
  transform: translate(-50%, -50%) rotate(-45deg);
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}
#fixedMenu .hamMenu:hover .open span:first-of-type {
  left: 2px;
  -webkit-transition: left 0.35s ease-in-out 0s;
  transition: left 0.35s ease-in-out 0s;
}
#fixedMenu .hamMenu:hover .open span:last-of-type {
  left: 2px;
  -webkit-transition: left 0.35s ease-in-out 0s;
  transition: left 0.35s ease-in-out 0s;
}
#fixedMenu .hamMenu[data-status=closed] {
  border: 0;
}
#fixedMenu .hamMenu[data-status=closed] .label {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#fixedMenu .hamMenu[data-status=closed] .open span:first-of-type {
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-transition: clip-path 0.35s ease-in-out 0.35s, left 0.35s ease-in-out 0s;
  -webkit-transition: left 0.35s ease-in-out 0s, -webkit-clip-path 0.35s ease-in-out 0.35s;
  transition: left 0.35s ease-in-out 0s, -webkit-clip-path 0.35s ease-in-out 0.35s;
  transition: clip-path 0.35s ease-in-out 0.35s, left 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0.35s, left 0.35s ease-in-out 0s, -webkit-clip-path 0.35s ease-in-out 0.35s;
}
#fixedMenu .hamMenu[data-status=closed] .open span:last-of-type {
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-transition: clip-path 0.35s ease-in-out 0.35s, left 0.35s ease-in-out 0s;
  -webkit-transition: left 0.35s ease-in-out 0s, -webkit-clip-path 0.35s ease-in-out 0.35s;
  transition: left 0.35s ease-in-out 0s, -webkit-clip-path 0.35s ease-in-out 0.35s;
  transition: clip-path 0.35s ease-in-out 0.35s, left 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0.35s, left 0.35s ease-in-out 0s, -webkit-clip-path 0.35s ease-in-out 0.35s;
}
#fixedMenu .hamMenu[data-status=closed] .close span:first-of-type {
  clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
  -webkit-transition: clip-path 0.35s ease-in-out 0s;
  -webkit-transition: -webkit-clip-path 0.35s ease-in-out 0s;
  transition: -webkit-clip-path 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0s, -webkit-clip-path 0.35s ease-in-out 0s;
}
#fixedMenu .hamMenu[data-status=closed] .close span:last-of-type {
  clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  -webkit-clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  -o-clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  -ms-clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  -webkit-transition: clip-path 0.35s ease-in-out 0s;
  -webkit-transition: -webkit-clip-path 0.35s ease-in-out 0s;
  transition: -webkit-clip-path 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0s, -webkit-clip-path 0.35s ease-in-out 0s;
}
#fixedMenu .hamMenu[data-status=opened] .label {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0.7s;
  transition: opacity 0.35s ease-in-out 0.7s;
}
#fixedMenu .hamMenu[data-status=opened] .open span:first-of-type {
  clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
  -webkit-transition: clip-path 0.35s ease-in-out 0s;
  -webkit-transition: -webkit-clip-path 0.35s ease-in-out 0s;
  transition: -webkit-clip-path 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0s, -webkit-clip-path 0.35s ease-in-out 0s;
}
#fixedMenu .hamMenu[data-status=opened] .open span:last-of-type {
  clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  -webkit-clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  -o-clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  -ms-clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  -webkit-transition: clip-path 0.35s ease-in-out 0s;
  -webkit-transition: -webkit-clip-path 0.35s ease-in-out 0s;
  transition: -webkit-clip-path 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0s, -webkit-clip-path 0.35s ease-in-out 0s;
}
#fixedMenu .hamMenu[data-status=opened] .close span:first-of-type {
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-transition: clip-path 0.35s ease-in-out 0.35s;
  -webkit-transition: -webkit-clip-path 0.35s ease-in-out 0.35s;
  transition: -webkit-clip-path 0.35s ease-in-out 0.35s;
  transition: clip-path 0.35s ease-in-out 0.35s;
  transition: clip-path 0.35s ease-in-out 0.35s, -webkit-clip-path 0.35s ease-in-out 0.35s;
}
#fixedMenu .hamMenu[data-status=opened] .close span:last-of-type {
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-transition: clip-path 0.35s ease-in-out 0.35s;
  -webkit-transition: -webkit-clip-path 0.35s ease-in-out 0.35s;
  transition: -webkit-clip-path 0.35s ease-in-out 0.35s;
  transition: clip-path 0.35s ease-in-out 0.35s;
  transition: clip-path 0.35s ease-in-out 0.35s, -webkit-clip-path 0.35s ease-in-out 0.35s;
}

.bgLight {
  position: fixed;
  bottom: 0;
  top: 0;
  left: 0;
  background-color: var(--mainColor);
  width: 100%;
  height: 0%;
  z-index: 46;
}

.bgDark {
  position: fixed;
  bottom: 0;
  top: 0;
  left: 0;
  background-color: #151515;
  width: 100%;
  height: 0%;
  z-index: 47;
}

#menuOnDemand {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: 49;
  opacity: 0;
  visibility: hidden;
}
#menuOnDemand a {
  text-decoration: none;
}
#menuOnDemand .language {
  position: absolute;
  top: 5vh;
  right: 12.5vw;
  z-index: 49;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #menuOnDemand .language {
    right: 18.75vw;
  }
}
#menuOnDemand .language ul {
  list-style: none;
}
#menuOnDemand .language ul li {
  position: relative;
  float: left;
  display: inline-block;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  margin-right: 1vw;
  text-align: center;
}
#menuOnDemand .language ul li a {
  -webkit-font-smoothing: antialiased;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10px;
  text-transform: uppercase;
  text-decoration: none;
  line-height: 40px;
}
#menuOnDemand .language ul li.wpml-ls-current-language {
  background-color: var(--subColor);
}
#menuOnDemand .language ul li.wpml-ls-current-language a {
  color: #000;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10px;
}
#menuOnDemand .language ul li:last-of-type {
  margin-right: 0;
}
#menuOnDemand .language ul li.animate-menu-on-demand {
  -webkit-transform: translateY(2.5vh);
  transform: translateY(2.5vh);
  opacity: 0;
}
#menuOnDemand .mail {
  position: absolute;
  bottom: 5vh;
  right: calc(6.25vw + 12px);
  z-index: 49;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #menuOnDemand .mail {
    bottom: 15vh;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #menuOnDemand .mail {
    bottom: 10vh;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #menuOnDemand .mail {
    bottom: 10vh;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #menuOnDemand .mail {
    bottom: 10vh;
  }
}
#menuOnDemand .mail.animate-menu-on-demand {
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
  text-decoration: underline;
}
#menuOnDemand .mail .mail__container {
  -webkit-transform: translate(100%, 0%) rotate(-90deg);
  transform: translate(100%, 0%) rotate(-90deg);
  -webkit-transform-origin: bottom left;
          transform-origin: bottom left;
}
#menuOnDemand .mail a {
  display: block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  text-decoration: underline;
}
#menuOnDemand .social {
  position: absolute;
  bottom: calc(5vh - 12px);
  left: 6.25vw;
  z-index: 49;
}
#menuOnDemand .social .st0 {
  fill: #FFFFFF;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #menuOnDemand .social {
    bottom: auto;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    left: auto;
    right: 6.25vw;
  }
}
#menuOnDemand .social ul {
  list-style: none;
  overflow: hidden;
}
#menuOnDemand .social ul li {
  position: relative;
  display: block;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  margin-bottom: 1vw;
  text-align: center;
  padding: 12px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
#menuOnDemand .social ul li svg {
  fill: #fff;
}
#menuOnDemand .social ul li:last-of-type {
  margin-bottom: 0;
}
#menuOnDemand .social ul li.animate-menu-on-demand {
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#menuOnDemand .wrapper {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: 48;
  overflow: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #menuOnDemand .wrapper {
    bottom: 0;
    top: 0;
    display: block;
    border-bottom: 1px solid #1eff00;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #menuOnDemand .wrapper {
    display: block;
  }
}
#menuOnDemand .wrapper .animate-menu-on-demand {
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#menuOnDemand .wrapper .menu {
  position: relative;
  width: 81.25vw;
  padding-left: 18.75vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  /* Hide scrollbar in FF */
  text-align: left;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #menuOnDemand .wrapper .menu {
    top: -2.5rem;
  }
}
#menuOnDemand .wrapper .menu.mobile {
  width: 87.5vw;
  padding-left: 6.25vw;
  padding-top: 5rem;
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #menuOnDemand .wrapper .menu.mobile {
    padding-top: 15rem;
  }
}
#menuOnDemand .wrapper .menu.mobile .menu__wrapper {
  position: relative;
  opacity: 0;
  visibility: hidden;
  -webkit-transform: translateY(5vh);
  transform: translateY(5vh);
}
#menuOnDemand .wrapper .menu.mobile .menu__wrapper ul {
  list-style: none;
}
#menuOnDemand .wrapper .menu.mobile .menu__wrapper ul li.current-menu-item a:after {
  position: absolute;
  content: "";
  left: 0;
  top: 90%;
  width: 100%;
  height: 1px;
  background-color: white;
}
#menuOnDemand .wrapper .menu.mobile .menu__wrapper ul li a {
  position: relative;
  text-decoration: none;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 1.9rem;
  line-height: 2.28rem;
}
#menuOnDemand .wrapper .menu.mobile .menu__wrapper .main-menu-mobile {
  padding-bottom: 2rem;
}
#menuOnDemand .wrapper .menu.mobile .menu__wrapper .sub-menu-mobile {
  padding-bottom: 2rem;
}
#menuOnDemand .wrapper .menu.mobile .menu__wrapper .sub-menu-mobile.sub-menu-mobile--video {
  padding-bottom: 6rem;
}
#menuOnDemand .wrapper .menu.mobile .menu__wrapper .sub-menu-mobile .titoletto {
  position: relative;
  margin-bottom: 0.25em;
}
#menuOnDemand .wrapper .menu.mobile .menu__wrapper .sub-menu-mobile .titoletto h3 {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 1.68rem;
}
#menuOnDemand .wrapper .menu.mobile .menu__wrapper .sub-menu-mobile ul li {
  padding: 0.25rem 0;
}
#menuOnDemand .wrapper .menu.mobile .menu__wrapper .sub-menu-mobile ul li a {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 1.2rem;
  line-height: 1.44rem;
}
#menuOnDemand .wrapper .menu .menu__item {
  position: relative;
  color: inherit;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  padding: 0;
  z-index: 8;
}
#menuOnDemand .wrapper .menu .menu__item.current .menu__item-inner {
  color: transparent;
  -webkit-text-stroke: 2px var(--subColor);
}
#menuOnDemand .wrapper .menu .menu__item.current-subproject .menu__item-inner {
  color: transparent;
  -webkit-text-stroke: 2px var(--subColor);
}
#menuOnDemand .wrapper .menu .menu__item .rail {
  position: absolute;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  white-space: nowrap;
  width: auto;
  top: 0;
  left: 0;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  mix-blend-mode: difference;
}
#menuOnDemand .wrapper .menu .menu__item .rail .rail__container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: auto;
  white-space: nowrap;
}
#menuOnDemand .wrapper .menu .menu__item .rail .rail__container .rail__item {
  display: inline-block;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
#menuOnDemand .wrapper .menu .menu__item .rail .rail__container .rail__item span {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 5vw;
  -webkit-font-smoothing: antialiased;
  line-height: 6vw;
  font-style: italic;
  padding-left: 2.5rem;
  padding-right: 2.5rem;
  color: #fff;
}
#menuOnDemand .wrapper .menu .menu__item.menu__item--1 {
  position: relative;
}
#menuOnDemand .wrapper .menu .menu__item.menu__item--1 .menu__item-image {
  -webkit-transform: translateY(-25%);
  transform: translateY(-25%);
}
#menuOnDemand .wrapper .menu .menu__item.menu__item--1 .menu__item-canvas {
  -webkit-transform: translateY(-25%);
  transform: translateY(-25%);
}
#menuOnDemand .wrapper .menu .menu__item.menu__item--2 {
  position: relative;
}
#menuOnDemand .wrapper .menu .menu__item.menu__item--2 .menu__item-image {
  -webkit-transform: translateY(-37.5%);
  transform: translateY(-37.5%);
}
#menuOnDemand .wrapper .menu .menu__item.menu__item--6 {
  position: relative;
}
#menuOnDemand .wrapper .menu .menu__item.menu__item--6 .menu__item-image {
  -webkit-transform: translateY(-62.5%);
  transform: translateY(-62.5%);
}
#menuOnDemand .wrapper .menu .menu__item.menu__item--6 .menu__item-canvas {
  -webkit-transform: translateY(-62.5%);
  transform: translateY(-62.5%);
}
#menuOnDemand .wrapper .menu .menu__item.menu__item--7 {
  position: relative;
}
#menuOnDemand .wrapper .menu .menu__item.menu__item--7 .menu__item-image {
  -webkit-transform: translateY(-75%);
  transform: translateY(-75%);
}
#menuOnDemand .wrapper .menu .menu__item.menu__item--7 .menu__item-canvas {
  -webkit-transform: translateY(-75%);
  transform: translateY(-75%);
}
#menuOnDemand .wrapper .menu .menu__item-image {
  position: absolute;
  top: 50%;
  left: 18.75vw;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 37.5vw;
  height: 26.3671875vw;
  visibility: hidden;
  opacity: 0;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  z-index: 1;
  -webkit-transition: opacity 0.5s ease-out 0s;
  transition: opacity 0.5s ease-out 0s;
  opacity: 0.5;
}
#menuOnDemand .wrapper .menu .menu__item-image img {
  width: 100%;
  height: auto;
}
#menuOnDemand .wrapper .menu .menu__item-inner {
  white-space: nowrap;
  position: relative;
  cursor: pointer;
  display: block;
  -webkit-transition: -webkit-transform 0.2s;
  transition: -webkit-transform 0.2s;
  transition: transform 0.2s;
  transition: transform 0.2s, -webkit-transform 0.2s;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 5vw;
  -webkit-font-smoothing: antialiased;
  line-height: 6vw;
  text-decoration: none;
  -webkit-transition: color 0.35s ease-in-out 0s;
  transition: color 0.35s ease-in-out 0s;
  z-index: 4;
}
#menuOnDemand .wrapper .menu .menu__item-canvas {
  position: absolute;
  top: 50%;
  left: 18.75vw;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 37.5vw;
  height: 26.3671875vw;
  opacity: 0;
  z-index: 2;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: visibility 0s, opacity 0s;
  transition: visibility 0s, opacity 0s;
}
#menuOnDemand .wrapper .menu .menu__item.hoovered {
  z-index: 7;
}
#menuOnDemand .wrapper .menu .menu__item.hoovered .menu__item-canvas {
  visibility: visible;
  opacity: 1;
  -webkit-transition: visibility 0s, opacity 0s;
  transition: visibility 0s, opacity 0s;
}
#menuOnDemand .wrapper .menu .menu__item.loop__clone {
  -webkit-transform: translateY(0vh);
  transform: translateY(0vh);
  opacity: 1;
}

#transition {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: 19;
  opacity: 0;
  visibility: hidden;
}
#transition div {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0%;
}
#transition div.first {
  z-index: 1;
  background-color: var(--color-secondary);
}
#transition div.second {
  z-index: 2;
  background-color: var(--color-primary);
}

.fake-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 20vh;
  z-index: 19;
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  .fake-header {
    height: 25vh;
  }
}
@media only screen and (min-width: 1281px) and (max-width: 1920px) and (max-device-height: 1080px) {
  .fake-header {
    height: 27vh;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  .fake-header {
    display: none;
  }
}
.fake-header #logo {
  position: absolute;
  left: 6.25vw;
  top: 7vh;
  width: 6.25vw;
  height: auto;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  .fake-header #logo {
    width: 9.375vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  .fake-header #logo {
    position: fixed;
    top: 40px;
    left: 20px;
    width: auto;
    height: 20px;
    z-index: 52;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .fake-header #logo img {
    width: auto;
    height: 100%;
    display: block;
  }
}
.fake-header #logo img {
  width: 100%;
  height: auto;
  display: block;
}
.fake-header #menuTransition {
  position: fixed;
  top: 20px;
  right: 20px;
  background-color: var(--subColor);
  width: 40px;
  height: 40px;
  z-index: 51;
  border-radius: 100%;
  overflow: hidden;
}
.fake-header #menuIcon {
  position: fixed;
  top: 20px;
  right: 20px;
  width: 40px;
  height: 40px;
  background-color: var(--subColor);
  border-radius: 50%;
  z-index: 52;
}
.fake-header #menuIcon .open {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 8px;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.fake-header #menuIcon .open span {
  position: absolute;
  width: 15px;
  height: 2px;
  background-color: #fff;
}
.fake-header #menuIcon .open span:first-of-type {
  top: 0;
  left: 0;
}
.fake-header #menuIcon .open span:last-of-type {
  top: 6px;
  left: 5px;
}
.fake-header #menuIcon .close {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.fake-header #menuIcon .close span {
  position: absolute;
  width: 20px;
  height: 2px;
  background-color: #fff;
}
.fake-header #menuIcon .close span:first-of-type {
  -webkit-transform: translate(-50%, -50%) rotate(45deg);
  transform: translate(-50%, -50%) rotate(45deg);
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}
.fake-header #menuIcon .close span:last-of-type {
  -webkit-transform: translate(-50%, -50%) rotate(-45deg);
  transform: translate(-50%, -50%) rotate(-45deg);
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}
.fake-header #menuIcon[data-status=closed] .open span:first-of-type {
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-transition: clip-path 0.35s ease-in-out 0.35s;
  -webkit-transition: -webkit-clip-path 0.35s ease-in-out 0.35s;
  transition: -webkit-clip-path 0.35s ease-in-out 0.35s;
  transition: clip-path 0.35s ease-in-out 0.35s;
  transition: clip-path 0.35s ease-in-out 0.35s, -webkit-clip-path 0.35s ease-in-out 0.35s;
}
.fake-header #menuIcon[data-status=closed] .open span:last-of-type {
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-transition: clip-path 0.35s ease-in-out 0.35s;
  -webkit-transition: -webkit-clip-path 0.35s ease-in-out 0.35s;
  transition: -webkit-clip-path 0.35s ease-in-out 0.35s;
  transition: clip-path 0.35s ease-in-out 0.35s;
  transition: clip-path 0.35s ease-in-out 0.35s, -webkit-clip-path 0.35s ease-in-out 0.35s;
}
.fake-header #menuIcon[data-status=closed] .close span:first-of-type {
  clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
  -webkit-transition: clip-path 0.35s ease-in-out 0s;
  -webkit-transition: -webkit-clip-path 0.35s ease-in-out 0s;
  transition: -webkit-clip-path 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0s, -webkit-clip-path 0.35s ease-in-out 0s;
}
.fake-header #menuIcon[data-status=closed] .close span:last-of-type {
  clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  -webkit-clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  -o-clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  -ms-clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  -webkit-transition: clip-path 0.35s ease-in-out 0s;
  -webkit-transition: -webkit-clip-path 0.35s ease-in-out 0s;
  transition: -webkit-clip-path 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0s, -webkit-clip-path 0.35s ease-in-out 0s;
}
.fake-header #menuIcon[data-status=opened] .open span:first-of-type {
  clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
  -webkit-transition: clip-path 0.35s ease-in-out 0s;
  -webkit-transition: -webkit-clip-path 0.35s ease-in-out 0s;
  transition: -webkit-clip-path 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0s, -webkit-clip-path 0.35s ease-in-out 0s;
}
.fake-header #menuIcon[data-status=opened] .open span:last-of-type {
  clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  -webkit-clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  -o-clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  -ms-clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  -webkit-transition: clip-path 0.35s ease-in-out 0s;
  -webkit-transition: -webkit-clip-path 0.35s ease-in-out 0s;
  transition: -webkit-clip-path 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0s, -webkit-clip-path 0.35s ease-in-out 0s;
}
.fake-header #menuIcon[data-status=opened] .close span:first-of-type {
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-transition: clip-path 0.35s ease-in-out 0.35s;
  -webkit-transition: -webkit-clip-path 0.35s ease-in-out 0.35s;
  transition: -webkit-clip-path 0.35s ease-in-out 0.35s;
  transition: clip-path 0.35s ease-in-out 0.35s;
  transition: clip-path 0.35s ease-in-out 0.35s, -webkit-clip-path 0.35s ease-in-out 0.35s;
}
.fake-header #menuIcon[data-status=opened] .close span:last-of-type {
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-transition: clip-path 0.35s ease-in-out 0.35s;
  -webkit-transition: -webkit-clip-path 0.35s ease-in-out 0.35s;
  transition: -webkit-clip-path 0.35s ease-in-out 0.35s;
  transition: clip-path 0.35s ease-in-out 0.35s;
  transition: clip-path 0.35s ease-in-out 0.35s, -webkit-clip-path 0.35s ease-in-out 0.35s;
}
.fake-header .wrapperMenuMobile {
  position: fixed;
  top: 80px;
  left: 10%;
  width: 80%;
  height: auto;
  z-index: 51;
  text-align: center;
  opacity: 0;
  visibility: hidden;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  .fake-header .wrapperMenuMobile {
    width: 87.5vw;
    left: 6.25vw;
    text-align: left;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  .fake-header .wrapperMenuMobile {
    width: 87.5vw;
    left: 6.25vw;
    overflow: hidden;
  }
  .fake-header .wrapperMenuMobile .mobileMenuSection {
    position: relative;
    width: 33.3333333333%;
    float: left;
  }
}
.fake-header .wrapperMenuMobile .pre-title {
  position: relative;
  text-transform: uppercase;
  color: var(--subColorD10);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 14px;
  line-height: 20px;
  margin-bottom: 2vh;
  -webkit-transform: translateX(-6.25vw);
  transform: translateX(-6.25vw);
  -webkit-transition: transform 0.35s ease-in 0s, opacity 0.35s ease-in 0s;
  -webkit-transition: opacity 0.35s ease-in 0s, -webkit-transform 0.35s ease-in 0s;
  transition: opacity 0.35s ease-in 0s, -webkit-transform 0.35s ease-in 0s;
  transition: transform 0.35s ease-in 0s, opacity 0.35s ease-in 0s;
  transition: transform 0.35s ease-in 0s, opacity 0.35s ease-in 0s, -webkit-transform 0.35s ease-in 0s;
  opacity: 0;
  display: inline-block;
  width: auto;
}
.fake-header .wrapperMenuMobile .pre-title:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 6.25vw;
  width: 0%;
  height: 1px;
  background-color: var(--subColorD10);
  -webkit-transition: width 0.35s ease-in 0s;
  transition: width 0.35s ease-in 0s;
}
.fake-header .wrapperMenuMobile .pre-title.active {
  -webkit-transform: translateX(0);
  transform: translateX(0);
  opacity: 1;
  -webkit-transition: transform 0.35s ease-out 0s, opacity 0.35s ease-out 0s;
  -webkit-transition: opacity 0.35s ease-out 0s, -webkit-transform 0.35s ease-out 0s;
  transition: opacity 0.35s ease-out 0s, -webkit-transform 0.35s ease-out 0s;
  transition: transform 0.35s ease-out 0s, opacity 0.35s ease-out 0s;
  transition: transform 0.35s ease-out 0s, opacity 0.35s ease-out 0s, -webkit-transform 0.35s ease-out 0s;
}
.fake-header .wrapperMenuMobile .pre-title.active:after {
  width: 100%;
  -webkit-transition: width 0.35s ease-out 0s;
  transition: width 0.35s ease-out 0s;
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  .fake-header .wrapperMenuMobile .pre-title {
    display: block;
  }
  .fake-header .wrapperMenuMobile .pre-title:after {
    display: none;
    left: 5%;
  }
  .fake-header .wrapperMenuMobile .pre-title.active:after {
    width: 90%;
  }
}
.fake-header #main {
  position: absolute;
  top: 7vh;
  left: 25vw;
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  .fake-header #main {
    left: 31.25vw;
  }
}
.fake-header #main ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.fake-header #main ul li {
  margin-bottom: 5px;
}
.fake-header #main ul li a {
  position: relative;
  text-decoration: none;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 19px;
  -webkit-font-smoothing: antialiased;
}
.fake-header #main ul li a svg {
  position: absolute;
  top: 50%;
  left: -30px;
  width: 16px;
  height: 16px;
  fill: var(--subColor);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  opacity: 0;
}
.fake-header #main ul li a:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -6px;
  width: 0%;
  height: 2px;
  background-color: var(--subColor);
  -webkit-transition: width 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s;
}
.fake-header #main ul li a:hover:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -6px;
  width: calc(100% + 12px);
  height: 2px;
  background-color: var(--subColor);
  -webkit-transition: width 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s;
}
.fake-header #main ul li:last-of-type {
  margin-bottom: 0;
}
.fake-header #main ul li.current-menu-item a svg {
  opacity: 1;
}
.fake-header #main ul li.wpml-ls-current-language a svg {
  opacity: 1;
  visibility: visible;
}
.fake-header #main ul li.wpml-ls-item a {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 14px;
}
.fake-header #main ul li.wpml-ls-item a svg {
  left: -30px;
  width: 12;
  height: 12px;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  .fake-header #main {
    position: relative;
    top: auto;
    left: auto;
    margin-bottom: 4vh;
  }
  .fake-header #main ul li {
    position: relative;
    margin: 0;
    opacity: 0;
    -webkit-transform: translateX(-6.25vw);
    transform: translateX(-6.25vw);
  }
  .fake-header #main ul li a {
    display: block;
    padding: 0;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
  }
  .fake-header #main ul li a svg {
    display: none;
  }
  .fake-header #main ul li a:before {
    display: none;
  }
  .fake-header #main ul li:first-of-type a {
    padding-top: 0;
  }
  .fake-header #main ul li:last-of-type:after {
    display: none;
  }
  .fake-header #main ul li.current-menu-item a {
    color: var(--subColorD10);
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  .fake-header #main {
    position: relative;
    top: auto;
    left: auto;
    margin-bottom: 4vh;
  }
  .fake-header #main ul li {
    position: relative;
    margin: 0;
    opacity: 0;
    -webkit-transform: translateX(-6.25vw);
    transform: translateX(-6.25vw);
  }
  .fake-header #main ul li a {
    display: block;
    padding: 0;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 3vw;
  }
  .fake-header #main ul li a svg {
    display: none;
  }
  .fake-header #main ul li a:before {
    display: none;
  }
  .fake-header #main ul li:first-of-type a {
    padding-top: 0;
  }
  .fake-header #main ul li:last-of-type:after {
    display: none;
  }
  .fake-header #main ul li.current-menu-item a {
    color: var(--subColorD10);
  }
}
.fake-header #sub {
  position: absolute;
  top: 7vh;
  left: 37.5vw;
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  .fake-header #sub {
    left: 43.75vw;
  }
}
.fake-header #sub ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.fake-header #sub ul li {
  margin-bottom: 5px;
}
.fake-header #sub ul li a {
  position: relative;
  text-decoration: none;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 19px;
  -webkit-font-smoothing: antialiased;
}
.fake-header #sub ul li a svg {
  position: absolute;
  top: 50%;
  left: -30px;
  width: 16px;
  height: 16px;
  fill: var(--subColor);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  opacity: 0;
}
.fake-header #sub ul li a:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -6px;
  width: 0%;
  height: 2px;
  background-color: var(--subColor);
  -webkit-transition: width 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  .fake-header #sub ul li a:before {
    display: none;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  .fake-header #sub ul li a:before {
    display: none;
  }
}
.fake-header #sub ul li a:hover:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -6px;
  width: calc(100% + 12px);
  height: 2px;
  background-color: var(--subColor);
  -webkit-transition: width 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s;
}
.fake-header #sub ul li.current-menu-item a svg {
  opacity: 1;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  .fake-header #sub {
    position: relative;
    top: auto;
    left: auto;
    margin-bottom: 40px;
  }
  .fake-header #sub ul li {
    position: relative;
    margin: 0;
    opacity: 0;
    -webkit-transform: translateX(-6.25vw);
    transform: translateX(-6.25vw);
    /*&:after {
        content: '';
        position: absolute;
        bottom: 0;
        display: block;
        width: 100%;
        height: 1px;
        background-color: rgba(0,0,0,.2);
    }*/
  }
  .fake-header #sub ul li a {
    display: block;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
  }
  .fake-header #sub ul li a svg {
    display: none;
  }
  .fake-header #sub ul li a:before {
    display: none;
  }
  .fake-header #sub ul li:last-of-type:after {
    display: none;
  }
  .fake-header #sub ul li.current-menu-item a {
    color: var(--subColorD10);
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  .fake-header #sub {
    position: relative;
    top: auto;
    left: auto;
    margin-bottom: 40px;
  }
  .fake-header #sub ul li {
    position: relative;
    margin: 0;
    opacity: 0;
    -webkit-transform: translateX(-6.25vw);
    transform: translateX(-6.25vw);
    /*&:after {
        content: '';
        position: absolute;
        bottom: 0;
        display: block;
        width: 100%;
        height: 1px;
        background-color: rgba(0,0,0,.2);
    }*/
  }
  .fake-header #sub ul li a {
    display: block;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 3vw;
  }
  .fake-header #sub ul li a svg {
    display: none;
  }
  .fake-header #sub ul li a:before {
    display: none;
  }
  .fake-header #sub ul li:last-of-type:after {
    display: none;
  }
  .fake-header #sub ul li.current-menu-item a {
    color: var(--subColorD10);
  }
}
.fake-header #social {
  position: absolute;
  top: 7vh;
  right: 18.75vw;
}
.fake-header #social ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.fake-header #social ul li {
  margin-bottom: 5px;
}
.fake-header #social ul li a {
  position: relative;
  text-decoration: none;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  padding: 0;
}
.fake-header #social ul li a:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -6px;
  width: 0%;
  height: 2px;
  background-color: var(--subColor);
  -webkit-transition: width 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s;
}
.fake-header #social ul li a:hover:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -6px;
  width: calc(100% + 12px);
  height: 2px;
  background-color: var(--subColor);
  -webkit-transition: width 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s;
}
.fake-header #social ul li:last-of-type {
  margin-bottom: 0;
}
.fake-header #languages {
  position: absolute;
  top: 7vh;
  right: 6.25vw;
}
.fake-header #languages ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.fake-header #languages ul li {
  margin-bottom: 5px;
}
.fake-header #languages ul li a {
  position: relative;
  text-decoration: none;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 19px;
  -webkit-font-smoothing: antialiased;
  padding: 0;
}
.fake-header #languages ul li a svg {
  position: absolute;
  top: 50%;
  left: -30px;
  width: 16px;
  height: 16px;
  fill: var(--subColor);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  opacity: 0;
}
.fake-header #languages ul li a:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -6px;
  width: 0%;
  height: 2px;
  background-color: var(--subColor);
  -webkit-transition: width 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s;
}
.fake-header #languages ul li a:hover:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -6px;
  width: calc(100% + 12px);
  height: 2px;
  background-color: var(--subColor);
  -webkit-transition: width 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s;
}
.fake-header #languages ul li:last-of-type {
  margin-bottom: 0;
}
.fake-header #languages ul li.wpml-ls-current-language a svg {
  opacity: 1;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  .fake-header #languages {
    position: relative;
    top: auto;
    right: auto;
    margin-bottom: 40px;
  }
  .fake-header #languages ul li {
    position: relative;
    margin: 0;
    opacity: 0;
    -webkit-transform: translateX(-6.25vw);
    transform: translateX(-6.25vw);
    /*&:after {
        content: '';
        position: absolute;
        bottom: 0;
        display: block;
        width: 100%;
        height: 1px;
        background-color: rgba(0,0,0,.2);
    }*/
  }
  .fake-header #languages ul li a {
    display: block;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 4vw;
  }
  .fake-header #languages ul li a svg {
    display: none;
  }
  .fake-header #languages ul li a:before {
    display: none;
  }
  .fake-header #languages ul li:last-of-type:after {
    display: none;
  }
  .fake-header #languages ul li.wpml-ls-current-language a {
    color: var(--subColorD10);
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  .fake-header #languages {
    position: relative;
    top: auto;
    right: auto;
    margin-bottom: 40px;
  }
  .fake-header #languages ul li {
    position: relative;
    margin: 0;
    opacity: 0;
    -webkit-transform: translateX(-6.25vw);
    transform: translateX(-6.25vw);
    /*&:after {
        content: '';
        position: absolute;
        bottom: 0;
        display: block;
        width: 100%;
        height: 1px;
        background-color: rgba(0,0,0,.2);
    }*/
  }
  .fake-header #languages ul li a {
    display: block;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 2vw;
  }
  .fake-header #languages ul li a svg {
    display: none;
  }
  .fake-header #languages ul li a:before {
    display: none;
  }
  .fake-header #languages ul li:last-of-type:after {
    display: none;
  }
  .fake-header #languages ul li.wpml-ls-current-language a {
    color: var(--subColorD10);
  }
}

header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 25;
  opacity: 1;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  header {
    display: none;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  header {
    display: none;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  header {
    display: none;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  header {
    display: none;
  }
}
header.invisible {
  opacity: 0;
}
header #logo {
  position: absolute;
  left: 6.25vw;
  top: 7vh;
  width: 6.25vw;
  height: auto;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  header #logo {
    width: 9.375vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  header #logo {
    width: 10vw;
  }
}
header #logo img {
  width: 100%;
  height: auto;
  display: block;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  header #logo {
    position: fixed;
    top: 40px;
    left: 20px;
    width: auto;
    height: 20px;
    z-index: 52;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  header #logo img {
    width: auto;
    height: 100%;
    display: block;
  }
}
header #menuTransition {
  position: fixed;
  top: 20px;
  right: 20px;
  background-color: var(--subColor);
  width: 40px;
  height: 40px;
  z-index: 51;
  border-radius: 100%;
  overflow: hidden;
}
header #menuIcon {
  position: fixed;
  top: 20px;
  right: 20px;
  width: 40px;
  height: 40px;
  background-color: var(--subColor);
  border-radius: 50%;
  z-index: 52;
}
header #menuIcon .open {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 8px;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
header #menuIcon .open span {
  position: absolute;
  width: 15px;
  height: 2px;
  background-color: #fff;
}
header #menuIcon .open span:first-of-type {
  top: 0;
  left: 0;
}
header #menuIcon .open span:last-of-type {
  top: 6px;
  left: 5px;
}
header #menuIcon .close {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
header #menuIcon .close span {
  position: absolute;
  width: 20px;
  height: 2px;
  background-color: #fff;
}
header #menuIcon .close span:first-of-type {
  -webkit-transform: translate(-50%, -50%) rotate(45deg);
  transform: translate(-50%, -50%) rotate(45deg);
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}
header #menuIcon .close span:last-of-type {
  -webkit-transform: translate(-50%, -50%) rotate(-45deg);
  transform: translate(-50%, -50%) rotate(-45deg);
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}
header #menuIcon[data-status=closed] .open span:first-of-type {
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-transition: clip-path 0.35s ease-in-out 0.35s;
  -webkit-transition: -webkit-clip-path 0.35s ease-in-out 0.35s;
  transition: -webkit-clip-path 0.35s ease-in-out 0.35s;
  transition: clip-path 0.35s ease-in-out 0.35s;
  transition: clip-path 0.35s ease-in-out 0.35s, -webkit-clip-path 0.35s ease-in-out 0.35s;
}
header #menuIcon[data-status=closed] .open span:last-of-type {
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-transition: clip-path 0.35s ease-in-out 0.35s;
  -webkit-transition: -webkit-clip-path 0.35s ease-in-out 0.35s;
  transition: -webkit-clip-path 0.35s ease-in-out 0.35s;
  transition: clip-path 0.35s ease-in-out 0.35s;
  transition: clip-path 0.35s ease-in-out 0.35s, -webkit-clip-path 0.35s ease-in-out 0.35s;
}
header #menuIcon[data-status=closed] .close span:first-of-type {
  clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
  -webkit-transition: clip-path 0.35s ease-in-out 0s;
  -webkit-transition: -webkit-clip-path 0.35s ease-in-out 0s;
  transition: -webkit-clip-path 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0s, -webkit-clip-path 0.35s ease-in-out 0s;
}
header #menuIcon[data-status=closed] .close span:last-of-type {
  clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  -webkit-clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  -o-clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  -ms-clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  -webkit-transition: clip-path 0.35s ease-in-out 0s;
  -webkit-transition: -webkit-clip-path 0.35s ease-in-out 0s;
  transition: -webkit-clip-path 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0s, -webkit-clip-path 0.35s ease-in-out 0s;
}
header #menuIcon[data-status=opened] .open span:first-of-type {
  clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
  -webkit-transition: clip-path 0.35s ease-in-out 0s;
  -webkit-transition: -webkit-clip-path 0.35s ease-in-out 0s;
  transition: -webkit-clip-path 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0s, -webkit-clip-path 0.35s ease-in-out 0s;
}
header #menuIcon[data-status=opened] .open span:last-of-type {
  clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  -webkit-clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  -o-clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  -ms-clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
  -webkit-transition: clip-path 0.35s ease-in-out 0s;
  -webkit-transition: -webkit-clip-path 0.35s ease-in-out 0s;
  transition: -webkit-clip-path 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0s;
  transition: clip-path 0.35s ease-in-out 0s, -webkit-clip-path 0.35s ease-in-out 0s;
}
header #menuIcon[data-status=opened] .close span:first-of-type {
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-transition: clip-path 0.35s ease-in-out 0.35s;
  -webkit-transition: -webkit-clip-path 0.35s ease-in-out 0.35s;
  transition: -webkit-clip-path 0.35s ease-in-out 0.35s;
  transition: clip-path 0.35s ease-in-out 0.35s;
  transition: clip-path 0.35s ease-in-out 0.35s, -webkit-clip-path 0.35s ease-in-out 0.35s;
}
header #menuIcon[data-status=opened] .close span:last-of-type {
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-transition: clip-path 0.35s ease-in-out 0.35s;
  -webkit-transition: -webkit-clip-path 0.35s ease-in-out 0.35s;
  transition: -webkit-clip-path 0.35s ease-in-out 0.35s;
  transition: clip-path 0.35s ease-in-out 0.35s;
  transition: clip-path 0.35s ease-in-out 0.35s, -webkit-clip-path 0.35s ease-in-out 0.35s;
}
header .wrapperMenuMobile {
  position: fixed;
  top: 80px;
  left: 10%;
  width: 80%;
  height: auto;
  z-index: 51;
  text-align: center;
  opacity: 0;
  visibility: hidden;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  header .wrapperMenuMobile {
    width: 87.5vw;
    left: 6.25vw;
    text-align: left;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  header .wrapperMenuMobile {
    width: 87.5vw;
    left: 6.25vw;
    overflow: hidden;
  }
  header .wrapperMenuMobile .mobileMenuSection {
    position: relative;
    width: 33.3333333333%;
    float: left;
  }
}
header .wrapperMenuMobile .pre-title {
  position: relative;
  text-transform: uppercase;
  color: var(--subColorD10);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 14px;
  line-height: 20px;
  margin-bottom: 2vh;
  -webkit-transform: translateX(-6.25vw);
  transform: translateX(-6.25vw);
  -webkit-transition: transform 0.35s ease-in 0s, opacity 0.35s ease-in 0s;
  -webkit-transition: opacity 0.35s ease-in 0s, -webkit-transform 0.35s ease-in 0s;
  transition: opacity 0.35s ease-in 0s, -webkit-transform 0.35s ease-in 0s;
  transition: transform 0.35s ease-in 0s, opacity 0.35s ease-in 0s;
  transition: transform 0.35s ease-in 0s, opacity 0.35s ease-in 0s, -webkit-transform 0.35s ease-in 0s;
  opacity: 0;
  display: inline-block;
  width: auto;
}
header .wrapperMenuMobile .pre-title:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 6.25vw;
  width: 0%;
  height: 1px;
  background-color: var(--subColorD10);
  -webkit-transition: width 0.35s ease-in 0s;
  transition: width 0.35s ease-in 0s;
}
header .wrapperMenuMobile .pre-title.active {
  -webkit-transform: translateX(0);
  transform: translateX(0);
  opacity: 1;
  -webkit-transition: transform 0.35s ease-out 0s, opacity 0.35s ease-out 0s;
  -webkit-transition: opacity 0.35s ease-out 0s, -webkit-transform 0.35s ease-out 0s;
  transition: opacity 0.35s ease-out 0s, -webkit-transform 0.35s ease-out 0s;
  transition: transform 0.35s ease-out 0s, opacity 0.35s ease-out 0s;
  transition: transform 0.35s ease-out 0s, opacity 0.35s ease-out 0s, -webkit-transform 0.35s ease-out 0s;
}
header .wrapperMenuMobile .pre-title.active:after {
  width: 100%;
  -webkit-transition: width 0.35s ease-out 0s;
  transition: width 0.35s ease-out 0s;
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  header .wrapperMenuMobile .pre-title {
    display: block;
  }
  header .wrapperMenuMobile .pre-title:after {
    display: none;
    left: 5%;
  }
  header .wrapperMenuMobile .pre-title.active:after {
    width: 90%;
  }
}
header #main {
  position: absolute;
  top: 7vh;
  left: 25vw;
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  header #main {
    left: 31.25vw;
  }
}
header #main ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
header #main ul li {
  margin-bottom: 5px;
}
header #main ul li a {
  position: relative;
  text-decoration: none;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 19px;
  -webkit-font-smoothing: antialiased;
}
header #main ul li a svg {
  position: absolute;
  top: 50%;
  left: -30px;
  width: 16px;
  height: 16px;
  fill: var(--subColor);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  opacity: 0;
}
header #main ul li a:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -6px;
  width: 0%;
  height: 2px;
  background-color: var(--subColor);
  -webkit-transition: width 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s;
}
header #main ul li a:hover:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -6px;
  width: calc(100% + 12px);
  height: 2px;
  background-color: var(--subColor);
  -webkit-transition: width 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s;
}
header #main ul li:last-of-type {
  margin-bottom: 0;
}
header #main ul li.current-menu-item a svg {
  opacity: 1;
}
header #main ul li.wpml-ls-current-language a svg {
  opacity: 1;
  visibility: visible;
}
header #main ul li.wpml-ls-item a {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 14px;
}
header #main ul li.wpml-ls-item a svg {
  left: -30px;
  width: 12;
  height: 12px;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  header #main {
    position: relative;
    top: auto;
    left: auto;
    margin-bottom: 4vh;
  }
  header #main ul li {
    position: relative;
    margin: 0;
    opacity: 0;
    -webkit-transform: translateX(-6.25vw);
    transform: translateX(-6.25vw);
  }
  header #main ul li a {
    display: block;
    padding: 0;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
  }
  header #main ul li a svg {
    display: none;
  }
  header #main ul li a:before {
    display: none;
  }
  header #main ul li:first-of-type a {
    padding-top: 0;
  }
  header #main ul li:last-of-type:after {
    display: none;
  }
  header #main ul li.current-menu-item a {
    color: var(--subColorD10);
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  header #main {
    position: relative;
    top: auto;
    left: auto;
    margin-bottom: 4vh;
  }
  header #main ul li {
    position: relative;
    margin: 0;
    opacity: 0;
    -webkit-transform: translateX(-6.25vw);
    transform: translateX(-6.25vw);
  }
  header #main ul li a {
    display: block;
    padding: 0;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 3vw;
  }
  header #main ul li a svg {
    display: none;
  }
  header #main ul li a:before {
    display: none;
  }
  header #main ul li:first-of-type a {
    padding-top: 0;
  }
  header #main ul li:last-of-type:after {
    display: none;
  }
  header #main ul li.current-menu-item a {
    color: var(--subColorD10);
  }
}
header #sub {
  position: absolute;
  top: 7vh;
  left: 37.5vw;
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  header #sub {
    left: 43.75vw;
  }
}
header #sub ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
header #sub ul li {
  margin-bottom: 5px;
}
header #sub ul li a {
  position: relative;
  text-decoration: none;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 19px;
  -webkit-font-smoothing: antialiased;
}
header #sub ul li a svg {
  position: absolute;
  top: 50%;
  left: -30px;
  width: 16px;
  height: 16px;
  fill: var(--subColor);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  opacity: 0;
}
header #sub ul li a:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -6px;
  width: 0%;
  height: 2px;
  background-color: var(--subColor);
  -webkit-transition: width 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  header #sub ul li a:before {
    display: none;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  header #sub ul li a:before {
    display: none;
  }
}
header #sub ul li a:hover:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -6px;
  width: calc(100% + 12px);
  height: 2px;
  background-color: var(--subColor);
  -webkit-transition: width 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s;
}
header #sub ul li.current-menu-item a svg {
  opacity: 1;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  header #sub {
    position: relative;
    top: auto;
    left: auto;
    margin-bottom: 40px;
  }
  header #sub ul li {
    position: relative;
    margin: 0;
    opacity: 0;
    -webkit-transform: translateX(-6.25vw);
    transform: translateX(-6.25vw);
    /*&:after {
        content: '';
        position: absolute;
        bottom: 0;
        display: block;
        width: 100%;
        height: 1px;
        background-color: rgba(0,0,0,.2);
    }*/
  }
  header #sub ul li a {
    display: block;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
  }
  header #sub ul li a svg {
    display: none;
  }
  header #sub ul li a:before {
    display: none;
  }
  header #sub ul li:last-of-type:after {
    display: none;
  }
  header #sub ul li.current-menu-item a {
    color: var(--subColorD10);
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  header #sub {
    position: relative;
    top: auto;
    left: auto;
    margin-bottom: 40px;
  }
  header #sub ul li {
    position: relative;
    margin: 0;
    opacity: 0;
    -webkit-transform: translateX(-6.25vw);
    transform: translateX(-6.25vw);
    /*&:after {
        content: '';
        position: absolute;
        bottom: 0;
        display: block;
        width: 100%;
        height: 1px;
        background-color: rgba(0,0,0,.2);
    }*/
  }
  header #sub ul li a {
    display: block;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 3vw;
  }
  header #sub ul li a svg {
    display: none;
  }
  header #sub ul li a:before {
    display: none;
  }
  header #sub ul li:last-of-type:after {
    display: none;
  }
  header #sub ul li.current-menu-item a {
    color: var(--subColorD10);
  }
}
header #social {
  position: absolute;
  top: 7vh;
  right: 18.75vw;
}
header #social ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
header #social ul li {
  margin-bottom: 5px;
}
header #social ul li a {
  position: relative;
  text-decoration: none;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  padding: 0;
}
header #social ul li a:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -6px;
  width: 0%;
  height: 2px;
  background-color: var(--subColor);
  -webkit-transition: width 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s;
}
header #social ul li a:hover:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -6px;
  width: calc(100% + 12px);
  height: 2px;
  background-color: var(--subColor);
  -webkit-transition: width 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s;
}
header #social ul li:last-of-type {
  margin-bottom: 0;
}
header #languages {
  position: absolute;
  top: 7vh;
  right: 6.25vw;
}
header #languages ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
header #languages ul li {
  margin-bottom: 5px;
}
header #languages ul li a {
  position: relative;
  text-decoration: none;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 19px;
  -webkit-font-smoothing: antialiased;
  padding: 0;
}
header #languages ul li a svg {
  position: absolute;
  top: 50%;
  left: -30px;
  width: 16px;
  height: 16px;
  fill: var(--subColor);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  opacity: 0;
}
header #languages ul li a:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -6px;
  width: 0%;
  height: 2px;
  background-color: var(--subColor);
  -webkit-transition: width 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s;
}
header #languages ul li a:hover:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -6px;
  width: calc(100% + 12px);
  height: 2px;
  background-color: var(--subColor);
  -webkit-transition: width 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s;
}
header #languages ul li:last-of-type {
  margin-bottom: 0;
}
header #languages ul li.wpml-ls-current-language a svg {
  opacity: 1;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  header #languages {
    position: relative;
    top: auto;
    right: auto;
    margin-bottom: 40px;
  }
  header #languages ul li {
    position: relative;
    margin: 0;
    opacity: 0;
    -webkit-transform: translateX(-6.25vw);
    transform: translateX(-6.25vw);
    /*&:after {
        content: '';
        position: absolute;
        bottom: 0;
        display: block;
        width: 100%;
        height: 1px;
        background-color: rgba(0,0,0,.2);
    }*/
  }
  header #languages ul li a {
    display: block;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 4vw;
  }
  header #languages ul li a svg {
    display: none;
  }
  header #languages ul li a:before {
    display: none;
  }
  header #languages ul li:last-of-type:after {
    display: none;
  }
  header #languages ul li.wpml-ls-current-language a {
    color: var(--subColorD10);
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  header #languages {
    position: relative;
    top: auto;
    right: auto;
    margin-bottom: 40px;
  }
  header #languages ul li {
    position: relative;
    margin: 0;
    opacity: 0;
    -webkit-transform: translateX(-6.25vw);
    transform: translateX(-6.25vw);
    /*&:after {
        content: '';
        position: absolute;
        bottom: 0;
        display: block;
        width: 100%;
        height: 1px;
        background-color: rgba(0,0,0,.2);
    }*/
  }
  header #languages ul li a {
    display: block;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 2vw;
  }
  header #languages ul li a svg {
    display: none;
  }
  header #languages ul li a:before {
    display: none;
  }
  header #languages ul li:last-of-type:after {
    display: none;
  }
  header #languages ul li.wpml-ls-current-language a {
    color: var(--subColorD10);
  }
}

#scrollHelper {
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  height: 100%;
  opacity: 0;
}

#homeColorAnimation {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  background-color: var(--mainColor);
  width: 100%;
  height: 100%;
}
#homeColorAnimation.dark_mode__ON {
  opacity: 0;
}

#homeLoader {
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: 4;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homeLoader {
    height: 75vh;
    width: 87.5vw;
    margin: 0 auto;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homeLoader {
    height: auto;
    width: 87.5vw;
    margin: 0 auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homeLoader {
    height: auto;
    width: 87.5vw;
    margin: 0 auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homeLoader {
    height: auto;
    width: 87.5vw;
    margin: 0 auto;
  }
}
#homeLoader .wrapper {
  position: relative;
  width: 100%;
  height: 100%;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homeLoader .wrapper {
    position: relative;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homeLoader .wrapper {
    position: relative;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homeLoader .wrapper {
    position: relative;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homeLoader .wrapper {
    position: relative;
  }
}
#homeLoader .wrapper.hide .text .wrapper__title {
  -webkit-transform: translateY(-10vh);
  transform: translateY(-10vh);
  opacity: 0;
  -webkit-transition: transform 1.4s ease-in 0s, opacity 1.4s ease-in 0s;
  -webkit-transition: opacity 1.4s ease-in 0s, -webkit-transform 1.4s ease-in 0s;
  transition: opacity 1.4s ease-in 0s, -webkit-transform 1.4s ease-in 0s;
  transition: transform 1.4s ease-in 0s, opacity 1.4s ease-in 0s;
  transition: transform 1.4s ease-in 0s, opacity 1.4s ease-in 0s, -webkit-transform 1.4s ease-in 0s;
}
#homeLoader .wrapper.hide .text2 {
  -webkit-transform: translateY(-10vh);
  transform: translateY(-10vh);
  opacity: 0;
  -webkit-transition: transform 1.4s ease-in 0s, opacity 1.4s ease-in 0s;
  -webkit-transition: opacity 1.4s ease-in 0s, -webkit-transform 1.4s ease-in 0s;
  transition: opacity 1.4s ease-in 0s, -webkit-transform 1.4s ease-in 0s;
  transition: transform 1.4s ease-in 0s, opacity 1.4s ease-in 0s;
  transition: transform 1.4s ease-in 0s, opacity 1.4s ease-in 0s, -webkit-transform 1.4s ease-in 0s;
}
#homeLoader .wrapper.hide .circle {
  top: calc(-9vw - 10vh);
  opacity: 0 !important;
  -webkit-transition: top 1.4s ease-in 0s, opacity 1.4s ease-in 0s;
  transition: top 1.4s ease-in 0s, opacity 1.4s ease-in 0s;
}
#homeLoader .wrapper.show .text .wrapper__title {
  -webkit-transform: translateY(0);
  transform: translateY(0);
  opacity: 1;
  -webkit-transition: transform 1.4s ease-out 0s, opacity 1.4s ease-out 0s;
  -webkit-transition: opacity 1.4s ease-out 0s, -webkit-transform 1.4s ease-out 0s;
  transition: opacity 1.4s ease-out 0s, -webkit-transform 1.4s ease-out 0s;
  transition: transform 1.4s ease-out 0s, opacity 1.4s ease-out 0s;
  transition: transform 1.4s ease-out 0s, opacity 1.4s ease-out 0s, -webkit-transform 1.4s ease-out 0s;
}
#homeLoader .wrapper.show .text2 {
  -webkit-transform: translateY(0);
  transform: translateY(0);
  opacity: 1;
  -webkit-transition: transform 1.4s ease-out 0s, opacity 1.4s ease-out 0s;
  -webkit-transition: opacity 1.4s ease-out 0s, -webkit-transform 1.4s ease-out 0s;
  transition: opacity 1.4s ease-out 0s, -webkit-transform 1.4s ease-out 0s;
  transition: transform 1.4s ease-out 0s, opacity 1.4s ease-out 0s;
  transition: transform 1.4s ease-out 0s, opacity 1.4s ease-out 0s, -webkit-transform 1.4s ease-out 0s;
}
#homeLoader .wrapper.show .circle {
  top: -9vw;
  opacity: 1 !important;
  -webkit-transition: top 1.4s ease-out 0s, opacity 1.4s ease-out 0s;
  transition: top 1.4s ease-out 0s, opacity 1.4s ease-out 0s;
}
#homeLoader .wrapper .circle {
  position: absolute;
  top: -9vw;
  right: -7vw;
  z-index: 2;
  width: 34.375vw;
  opacity: 0;
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
  -webkit-animation-name: animation-rotation-dots;
          animation-name: animation-rotation-dots;
  -webkit-animation-duration: 30s;
          animation-duration: 30s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
#homeLoader .wrapper .circle svg {
  width: 100%;
  display: block;
  height: auto;
  fill: var(--subColor);
}
#homeLoader .wrapper .new-text-block {
  position: relative;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  padding-left: 12.5vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  gap: 4rem;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #homeLoader .wrapper .new-text-block {
    bottom: 0;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homeLoader .wrapper .new-text-block {
    padding-left: 0;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    padding-top: 13rem;
    padding-bottom: 2rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homeLoader .wrapper .new-text-block {
    position: relative;
    top: 0;
    bottom: auto;
    left: 0;
    padding-top: 6.75rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homeLoader .wrapper .new-text-block {
    position: relative;
    top: 0;
    bottom: auto;
    left: 0;
    padding-top: 6.75rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homeLoader .wrapper .new-text-block {
    position: relative;
    top: 0;
    bottom: auto;
    left: 0;
    padding-top: 17.5rem;
  }
}
#homeLoader .wrapper .new-text-block .text-big h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 5vw;
  line-height: 5vw;
  -webkit-font-smoothing: antialiased;
  -webkit-transform: translateY(50%);
  transform: translateY(50%);
  opacity: 0;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #homeLoader .wrapper .new-text-block .text-big h2 {
    font-size: 8vw;
    line-height: 8vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homeLoader .wrapper .new-text-block .text-big h2 {
    font-size: 2.5rem;
    line-height: 2.5rem;
  }
}
#homeLoader .wrapper .new-text-block .text-scroll {
  position: absolute;
  bottom: 8rem;
  left: 12.5vw;
}
#homeLoader .wrapper .new-text-block .text-scroll span {
  position: relative;
  display: block;
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 24px;
  line-height: 24px;
  margin-top: 10px;
  text-transform: uppercase;
  -webkit-font-smoothing: antialiased;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homeLoader .wrapper .new-text-block .text-scroll span {
    font-size: 16px;
    line-height: 24px;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homeLoader .wrapper .new-text-block .text-scroll {
    position: relative;
    left: auto;
    bottom: auto;
  }
}
#homeLoader .wrapper .text {
  position: absolute;
  bottom: 2vw;
  left: 6.25vw;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #homeLoader .wrapper .text {
    bottom: 0;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homeLoader .wrapper .text {
    position: relative;
    top: 0;
    bottom: auto;
    left: 0;
    padding-top: 6.75rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homeLoader .wrapper .text {
    position: relative;
    top: 0;
    bottom: auto;
    left: 0;
    padding-top: 6.75rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homeLoader .wrapper .text {
    position: relative;
    top: 0;
    bottom: auto;
    left: 0;
    padding-top: 6.75rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homeLoader .wrapper .text {
    position: relative;
    top: 0;
    bottom: auto;
    left: 0;
    padding-top: 17.5rem;
  }
}
#homeLoader .wrapper .text .wrapper__title {
  position: relative;
  display: block;
  -webkit-transform-origin: center top;
          transform-origin: center top;
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
}
#homeLoader .wrapper .text .wrapper__title h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 9vw;
  line-height: 9vw;
  -webkit-font-smoothing: antialiased;
  -webkit-transform: translateY(50%);
  transform: translateY(50%);
  opacity: 0;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #homeLoader .wrapper .text .wrapper__title h2 {
    font-size: 8vw;
    line-height: 8vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homeLoader .wrapper .text .wrapper__title h2 {
    font-size: 2.9rem;
    line-height: 2.9rem;
  }
}
#homeLoader .wrapper .text .wrapper__title h2 span {
  position: relative;
  display: inline-block;
}
#homeLoader .wrapper .text .wrapper__title h2.textColor {
  position: absolute;
  top: 0;
  left: 0;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 9vw;
  -webkit-text-stroke: 0px;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #homeLoader .wrapper .text .wrapper__title h2.textColor {
    font-size: 8vw;
    line-height: 8vw;
  }
}
#homeLoader .wrapper .text .wrapper__title h2.textColor span {
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
}
#homeLoader .wrapper .text .wrapper__title:last-of-type h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 9vw;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #homeLoader .wrapper .text .wrapper__title:last-of-type h2 {
    font-size: 8vw;
    line-height: 8vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homeLoader .wrapper .text .wrapper__title:last-of-type h2 {
    font-size: 2.9rem;
    line-height: 2.9rem;
  }
}
#homeLoader .wrapper .text2 {
  position: absolute;
  bottom: 2vw;
  right: 6.25vw;
  width: 25vw;
  z-index: 3;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #homeLoader .wrapper .text2 {
    bottom: 0;
    width: 30vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homeLoader .wrapper .text2 {
    position: relative;
    bottom: auto;
    right: auto;
    width: 100%;
    margin-left: 0;
    margin-top: 2.5rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homeLoader .wrapper .text2 {
    position: relative;
    bottom: auto;
    right: auto;
    width: 100%;
    margin-left: 0;
    margin-top: 2.5rem;
    width: 56.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homeLoader .wrapper .text2 {
    position: relative;
    bottom: auto;
    right: auto;
    width: 100%;
    margin-left: 0;
    margin-top: 2.5rem;
    width: 56.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homeLoader .wrapper .text2 {
    position: relative;
    bottom: auto;
    right: auto;
    width: 100%;
    margin-left: 0;
    margin-top: 2.5rem;
    width: 56.25vw;
  }
}
#homeLoader .wrapper .text2 .wrapper__desc {
  position: relative;
  overflow: hidden;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#homeLoader .wrapper .text2 .wrapper__desc .title-projects.mobile {
  position: relative;
  margin-top: 2.5rem;
}
#homeLoader .wrapper .text2 .wrapper__desc .title-projects.mobile h2 {
  line-height: 1.4rem;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 1.4rem;
  text-align: center;
}
#homeLoader .wrapper .text2 .wrapper__desc p {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  line-height: 30px;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homeLoader .wrapper .text2 .wrapper__desc p {
    font-size: 0.9rem;
    line-height: 1.08rem;
  }
}
#homeLoader .wrapper .text2 .wrapper__desc:first-of-type p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 30px;
  line-height: 40px;
  margin-bottom: 2vh;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #homeLoader .wrapper .text2 .wrapper__desc:first-of-type p {
    font-size: 26px;
    line-height: 32px;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homeLoader .wrapper .text2 .wrapper__desc:first-of-type p {
    font-size: 1.4rem;
    line-height: 1.68rem;
  }
}
#homeLoader .wrapper .scrollDownHomepage {
  position: absolute;
  bottom: -13rem;
  left: 6.25vw;
  opacity: 0;
  width: 10rem;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #homeLoader .wrapper .scrollDownHomepage {
    bottom: -10rem;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homeLoader .wrapper .scrollDownHomepage {
    position: relative;
    left: 0;
    bottom: 0;
    margin-top: 2.5rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homeLoader .wrapper .scrollDownHomepage {
    left: auto;
    right: 6.25vw;
    bottom: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homeLoader .wrapper .scrollDownHomepage {
    left: auto;
    right: 6.25vw;
    bottom: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homeLoader .wrapper .scrollDownHomepage {
    left: auto;
    right: 6.25vw;
    bottom: 0;
  }
}
#homeLoader .wrapper .scrollDownHomepage .image-circle {
  -webkit-animation-name: animation-rotation-dots;
          animation-name: animation-rotation-dots;
  -webkit-animation-duration: 30s;
          animation-duration: 30s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
#homeLoader .wrapper .scrollDownHomepage .image-circle .svg-circle {
  fill: var(--subColor);
}
#homeLoader .wrapper .scrollDownHomepage .image-arrow {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
}
#homeLoader .wrapper .scrollDownHomepage .image-arrow .svg-arrow {
  fill: white;
}

#homepage {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
  min-height: 100vh;
  z-index: 3;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage {
    min-height: 0;
    min-height: initial;
    margin-top: 2.5rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage {
    min-height: 0;
    min-height: initial;
    margin-top: 5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage {
    min-height: 0;
    min-height: initial;
    margin-top: 5rem;
    padding-bottom: 5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage {
    min-height: 0;
    min-height: initial;
    margin-top: 7.5rem;
  }
}
#homepage .counter {
  position: absolute;
  top: 12.5vw;
  left: 6.25vw;
  overflow: hidden;
  opacity: 0;
  z-index: 10;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .counter {
    display: none;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .counter {
    display: none;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .counter {
    display: none;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .counter {
    display: none;
  }
}
#homepage .counter span {
  line-height: 16px;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  float: left;
}
#homepage .counter span.current {
  color: var(--subColor);
}
#homepage .counter span.divider {
  content: "";
  background-color: var(--subColor);
  width: 6.25vw;
  margin: 7px 10px;
  height: 1px;
  display: inline-block;
}
#homepage .counter span.total {
  display: inline-block;
}
#homepage .wrapper {
  /* position: absolute;
  top: 0;
  left: 0;
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto; */
  position: relative;
  width: 100%;
  height: auto;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper.mobile .row {
    position: relative;
    width: 87.5vw;
    margin: 0 auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper.mobile .row {
    position: relative;
    width: 87.5vw;
    margin: 0 auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper.mobile .row {
    position: relative;
    width: 87.5vw;
    margin: 0 auto;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper {
    position: relative;
    top: auto;
    left: auto;
    display: block;
    overflow: visible;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper {
    position: relative;
    top: auto;
    left: auto;
    display: block;
    overflow: visible;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper {
    position: relative;
    top: auto;
    left: auto;
    display: block;
    overflow: visible;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper {
    position: relative;
    top: auto;
    left: auto;
    display: block;
    overflow: visible;
  }
}
#homepage .wrapper .homeElement {
  position: relative;
  width: 100vw;
  height: 100vh;
  float: left;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper .homeElement:nth-child(even) {
    margin-left: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement:nth-child(even) {
    margin-left: 6.25vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper .homeElement {
    height: auto;
    -webkit-box-flex: 0;
        -ms-flex: none;
            flex: none;
    margin-bottom: 0;
    padding-bottom: 3.75rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper .homeElement {
    width: 40.625vw;
    height: auto;
    -webkit-box-flex: 0;
        -ms-flex: none;
            flex: none;
    margin-bottom: 0;
    padding-bottom: 3.75rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement {
    width: 40.625vw;
    height: auto;
    -webkit-box-flex: 0;
        -ms-flex: none;
            flex: none;
    margin-bottom: 0;
    padding-bottom: 3.75rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement {
    width: 87.5vw;
    height: auto;
    -webkit-box-flex: 0;
        -ms-flex: none;
            flex: none;
    margin-bottom: 0;
    padding-bottom: 3.75rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper .homeElement .bottom-element {
    position: relative;
    display: block;
    text-decoration: none;
    margin-top: -2rem;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper .homeElement .bottom-element {
    position: relative;
    display: block;
    text-decoration: none;
    margin-top: -2rem;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement .bottom-element {
    position: relative;
    display: block;
    text-decoration: none;
    margin-top: -2rem;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement .bottom-element {
    position: relative;
    display: block;
    text-decoration: none;
    margin-top: -2rem;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
}
#homepage .wrapper .homeElement .image {
  position: absolute;
  top: 50%;
  right: 0;
  height: 80vh;
  width: 142.2222222222vh;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  overflow: hidden;
  z-index: 3;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper .homeElement .image {
    position: relative;
    top: auto;
    right: auto;
    width: 87.5vw;
    margin: 0 6.25vw;
    height: auto;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper .homeElement .image {
    position: relative;
    top: auto;
    right: auto;
    width: 100%;
    margin: 0;
    height: auto;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement .image {
    position: relative;
    top: auto;
    right: auto;
    width: 100%;
    margin: 0;
    height: auto;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement .image {
    position: relative;
    top: auto;
    right: auto;
    width: 100%;
    margin: 0;
    height: auto;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
}
#homepage .wrapper .homeElement .image .image__wrapper {
  height: 80vh;
  width: 142.2222222222vh;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper .homeElement .image .image__wrapper {
    width: 100%;
    height: 131.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper .homeElement .image .image__wrapper {
    width: 100%;
    height: 60.9375vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement .image .image__wrapper {
    width: 100%;
    height: 60.9375vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement .image .image__wrapper {
    width: 100%;
    height: 49.21875vw;
  }
}
#homepage .wrapper .homeElement .image .image__wrapper .image__container {
  height: 80vh;
  width: 142.2222222222vh;
  overflow: hidden;
  -webkit-transform: translateX(-20vw);
  transform: translateX(-20vw);
  -webkit-transform-origin: right center;
          transform-origin: right center;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper .homeElement .image .image__wrapper .image__container {
    height: 131.25vw;
    width: 100%;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    background-color: var(--project-color);
    clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper .homeElement .image .image__wrapper .image__container {
    height: 60.9375vw;
    width: 100%;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    background-color: var(--project-color);
    clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement .image .image__wrapper .image__container {
    height: 60.9375vw;
    width: 100%;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    background-color: var(--project-color);
    clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement .image .image__wrapper .image__container {
    height: 60.9375vw;
    width: 100%;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    background-color: var(--project-color);
    clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  }
}
#homepage .wrapper .homeElement .image .image__wrapper .image__container picture {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper .homeElement .image .image__wrapper .image__container picture {
    -webkit-transform: translateY(10vh);
    transform: translateY(10vh);
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper .homeElement .image .image__wrapper .image__container picture {
    -webkit-transform: translateY(10vh);
    transform: translateY(10vh);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement .image .image__wrapper .image__container picture {
    -webkit-transform: translateY(10vh);
    transform: translateY(10vh);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement .image .image__wrapper .image__container picture {
    -webkit-transform: translateY(10vh);
    transform: translateY(10vh);
  }
}
#homepage .wrapper .homeElement .image .image__wrapper .image__container picture img {
  position: relative;
  width: 100%;
  display: block;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper .homeElement .image .image__wrapper .image__container picture img {
    clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -webkit-transform: scale(1.4);
    transform: scale(1.4);
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper .homeElement .image .image__wrapper .image__container picture img {
    clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -webkit-transform: scale(1.4);
    transform: scale(1.4);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement .image .image__wrapper .image__container picture img {
    clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -webkit-transform: scale(1.4);
    transform: scale(1.4);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement .image .image__wrapper .image__container picture img {
    clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -webkit-transform: scale(1.4);
    transform: scale(1.4);
  }
}
#homepage .wrapper .homeElement .text {
  position: absolute;
  bottom: 9.375vw;
  left: 6.25vw;
  z-index: 4;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper .homeElement .text {
    position: relative;
    bottom: auto;
    left: auto;
    padding: 0 6.25vw 0 12.5vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper .homeElement .text {
    position: relative;
    bottom: auto;
    left: auto;
    padding: 0 0 0 3.125vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement .text {
    position: relative;
    bottom: auto;
    left: auto;
    padding: 0 0 0 3.125vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement .text {
    position: relative;
    bottom: auto;
    left: auto;
    padding: 0 0 0 3.125vw;
  }
}
#homepage .wrapper .homeElement .text h3 {
  position: relative;
  line-height: 6vw;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 6vw;
  -webkit-font-smoothing: antialiased;
  -webkit-transform: translateX(12.5vw);
  transform: translateX(12.5vw);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper .homeElement .text h3 {
    line-height: 3rem;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 3rem;
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
    opacity: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper .homeElement .text h3 {
    line-height: 3rem;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 3rem;
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
    opacity: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement .text h3 {
    line-height: 3rem;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 3rem;
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
    opacity: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement .text h3 {
    line-height: 3rem;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 3rem;
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
    opacity: 0;
  }
}
#homepage .wrapper .homeElement .text h2 {
  position: relative;
  line-height: 6vw;
  color: transparent;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 6vw;
  -webkit-font-smoothing: antialiased;
  -webkit-transform: translateX(18.75vw);
  transform: translateX(18.75vw);
  -webkit-text-stroke: 2px var(--project-color);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper .homeElement .text h2 {
    position: relative;
    line-height: 1.4rem;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 1.4rem;
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
    opacity: 0;
    margin-bottom: 10px;
    -webkit-text-stroke: unset;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper .homeElement .text h2 {
    position: relative;
    line-height: 1.4rem;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 1.4rem;
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
    opacity: 0;
    margin-bottom: 10px;
    -webkit-text-stroke: unset;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement .text h2 {
    position: relative;
    line-height: 1.4rem;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 1.4rem;
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
    opacity: 0;
    margin-bottom: 10px;
    -webkit-text-stroke: unset;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement .text h2 {
    position: relative;
    line-height: 1.4rem;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 1.4rem;
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
    opacity: 0;
    margin-bottom: 10px;
    -webkit-text-stroke: unset;
  }
}
#homepage .wrapper .homeElement .text h4 {
  position: relative;
  line-height: 24px;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 24px;
  -webkit-font-smoothing: antialiased;
  -webkit-transform: translateX(15.625vw);
  transform: translateX(15.625vw);
  margin-top: 2vh;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper .homeElement .text h4 {
    line-height: 0.9rem;
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 0.9rem;
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
    opacity: 0;
    margin: 0.5rem 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper .homeElement .text h4 {
    line-height: 0.9rem;
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 0.9rem;
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
    opacity: 0;
    margin: 0.5rem 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement .text h4 {
    line-height: 0.9rem;
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 0.9rem;
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
    opacity: 0;
    margin: 0.5rem 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement .text h4 {
    line-height: 0.9rem;
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 0.9rem;
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
    opacity: 0;
    margin: 0.5rem 0;
  }
}
#homepage .wrapper .homeElement .text a {
  position: relative;
  width: 6.25vw;
  height: 6.25vw;
  border-radius: 50%;
  display: inline-block;
  background-color: var(--project-color);
  text-align: center;
  text-decoration: none;
  margin-top: 3.125vw;
  left: 31.25vw;
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper .homeElement .text a {
    width: 25vw;
    height: 25vw;
    margin-top: 2vh;
    -webkit-transform: translate(0, 10vh) scale(1);
    transform: translate(0, 10vh) scale(1);
    opacity: 0;
  }
}
#homepage .wrapper .homeElement .text a.preventClick {
  visibility: hidden;
}
#homepage .wrapper .homeElement .works {
  position: absolute;
  left: 0;
  bottom: 3.125vw;
  -webkit-transform: translateY(50%);
  transform: translateY(50%);
  z-index: 4;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper .homeElement .works {
    position: relative;
    left: auto;
    bottom: auto;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    margin: 2vh 6.25vw 0 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper .homeElement .works {
    position: relative;
    left: auto;
    bottom: auto;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    margin: 2vh 6.25vw 0 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement .works {
    position: relative;
    left: auto;
    bottom: auto;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    margin: 2vh 6.25vw 0 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement .works {
    position: relative;
    left: auto;
    bottom: auto;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    margin: 2vh 6.25vw 0 6.25vw;
  }
}
#homepage .wrapper .homeElement .works p {
  line-height: 20px;
  color: var(--project-color);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  -webkit-font-smoothing: antialiased;
  -webkit-transform: translateX(75vw);
  transform: translateX(75vw);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper .homeElement .works p {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 14px;
    opacity: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper .homeElement .works p {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 14px;
    opacity: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement .works p {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 14px;
    opacity: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement .works p {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 14px;
    opacity: 0;
  }
}
#homepage .wrapper .homeElement:not([data-order="1"]) .image .image__wrapper .image__container {
  -webkit-transform: scale(0.6);
  transform: scale(0.6);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper .homeElement:not([data-order="1"]) .image .image__wrapper .image__container {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper .homeElement:not([data-order="1"]) .image .image__wrapper .image__container {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement:not([data-order="1"]) .image .image__wrapper .image__container {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement:not([data-order="1"]) .image .image__wrapper .image__container {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper .homeElement:not([data-order="1"]) .works p {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
    opacity: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper .homeElement:not([data-order="1"]) .works p {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
    opacity: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement:not([data-order="1"]) .works p {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
    opacity: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement:not([data-order="1"]) .works p {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
    opacity: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper .homeElement[data-order="1"] {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement[data-order="1"] {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement[data-order="1"] {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
#homepage .wrapper .homeElement[data-order="1"] .image .image__wrapper .image__container {
  -webkit-transform: translateX(0);
  transform: translateX(0);
}
#homepage .wrapper .homeElement[data-order="1"] .text h3 {
  -webkit-transform: translateX(0);
  transform: translateX(0);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper .homeElement[data-order="1"] .text h3 {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper .homeElement[data-order="1"] .text h3 {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement[data-order="1"] .text h3 {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement[data-order="1"] .text h3 {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
  }
}
#homepage .wrapper .homeElement[data-order="1"] .text h2 {
  -webkit-transform: translateX(0);
  transform: translateX(0);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper .homeElement[data-order="1"] .text h2 {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper .homeElement[data-order="1"] .text h2 {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement[data-order="1"] .text h2 {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement[data-order="1"] .text h2 {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
  }
}
#homepage .wrapper .homeElement[data-order="1"] .text h4 {
  -webkit-transform: translateX(0);
  transform: translateX(0);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper .homeElement[data-order="1"] .text h4 {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper .homeElement[data-order="1"] .text h4 {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement[data-order="1"] .text h4 {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement[data-order="1"] .text h4 {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
  }
}
#homepage .wrapper .homeElement[data-order="1"] .text a {
  -webkit-transform: translateY(0);
  transform: translateY(0);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper .homeElement[data-order="1"] .text a {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper .homeElement[data-order="1"] .text a {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement[data-order="1"] .text a {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement[data-order="1"] .text a {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
  }
}
#homepage .wrapper .homeElement[data-order="1"] .works p {
  -webkit-transform: translateX(15.625vw);
  transform: translateX(15.625vw);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper .homeElement[data-order="1"] .works p {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
    opacity: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper .homeElement[data-order="1"] .works p {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
    opacity: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement[data-order="1"] .works p {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
    opacity: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper .homeElement[data-order="1"] .works p {
    -webkit-transform: translate(0, 10vh);
    transform: translate(0, 10vh);
    opacity: 0;
  }
}
#homepage .wrapper .homeElement:last-of-type {
  margin-right: 0;
}
#homepage .new-block-title-big {
  position: relative;
  width: 100%;
  height: auto;
  padding: 9.375vw 6.25vw 0 6.25vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .new-block-title-big {
    display: none;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    gap: 2rem;
    padding-top: 0;
    padding-bottom: 10vh;
  }
}
#homepage .new-block-title-big .title {
  position: relative;
  width: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
#homepage .new-block-title-big .title h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 9vw;
  line-height: 9vw;
  -webkit-font-smoothing: antialiased;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #homepage .new-block-title-big .title h3 {
    font-size: 8vw;
    line-height: 8vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .new-block-title-big .title h3 {
    font-size: 4rem;
    line-height: 4rem;
  }
}
#homepage .new-block-title-big .title h3:last-of-type {
  -webkit-text-stroke: 2px #fff;
  color: transparent;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .new-block-title-big .title h3:last-of-type {
    -webkit-text-stroke: 1px var(--subColor);
  }
}
#homepage .new-block-title-big span {
  position: relative;
  display: block;
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 24px;
  line-height: 24px;
  /* margin-top: 10px; */
  text-transform: uppercase;
  -webkit-font-smoothing: antialiased;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .new-block-title-big span {
    font-size: 16px;
    line-height: 16px;
  }
}
#homepage .new-block-title-big.insight {
  padding-top: 3.125vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .new-block-title-big.insight {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    gap: 2rem;
    padding-top: 10vh;
    padding-bottom: 10vh;
  }
}
#homepage .wrapper-without-slider {
  position: relative;
  width: 100%;
  height: auto;
}
#homepage .wrapper-without-slider section {
  position: relative;
  width: 100%;
  height: auto;
}
#homepage .wrapper-without-slider section.full {
  position: relative;
  width: 100vw;
  height: auto;
  margin: 12.5vw 0;
  text-align: right;
  padding-bottom: 0;
  /* @include mobile {
  	width: 14*$grid;
  	margin:0;
  	padding: 0 $grid 4*$grid $grid;
  	text-align: left;
  }
  @include tablet_landscape {
  	width: 14*$grid;
  	padding: 3*$grid $grid 0 $grid;
  	text-align: left;
  }
  @include pro12_portrait {
  	width: 14*$grid;
  	padding: 3*$grid $grid 0 $grid;
  	text-align: left;
  }
  @include pro12_landscape {
  	padding-top: 1.5*$grid;
  } */
}
#homepage .wrapper-without-slider section.full[data-order="0"] {
  margin-top: 6.25vw;
}
#homepage .wrapper-without-slider section.full[data-order="7"] {
  margin-top: 0;
}
#homepage .wrapper-without-slider section.full .listItem {
  position: relative;
  z-index: 10;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 6.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper-without-slider section.full .listItem {
    margin-top: 1.25rem;
    mix-blend-mode: unset;
    gap: 0;
  }
}
#homepage .wrapper-without-slider section.full .listItem .projectImage {
  position: relative;
  width: 75vw;
  margin: 0vw 12.5vw 0 12.5vw;
  height: auto;
  background-color: var(--subColor);
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper-without-slider section.full .listItem .projectImage {
    width: 87.5vw;
    margin-left: 0;
    clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
    -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
    -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
    -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper-without-slider section.full .listItem .projectImage {
    width: 87.5vw;
    margin-left: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper-without-slider section.full .listItem .projectImage {
    width: 87.5vw;
    margin-left: 0;
  }
}
#homepage .wrapper-without-slider section.full .listItem .projectImage picture {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper-without-slider section.full .listItem .projectImage picture {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
#homepage .wrapper-without-slider section.full .listItem .projectImage picture img {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper-without-slider section.full .listItem .projectImage picture img {
    clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
    -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
    -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
    -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
#homepage .wrapper-without-slider section.full .listItem .info {
  position: absolute;
  bottom: 0;
  left: 15.625vw;
  width: 100%;
  z-index: 5;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
  -moz-text-align-last: left;
       text-align-last: left;
  -webkit-transform: translateY(50%);
          transform: translateY(50%);
}
#homepage .wrapper-without-slider section.full .listItem .info h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 3vw;
  line-height: 3vw;
  display: inline-block;
  text-indent: -5px;
}
#homepage .wrapper-without-slider section.full .listItem .info h4 {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 24px;
  line-height: 24px;
  margin-top: 10px;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper-without-slider section.full .listItem .info {
    position: relative;
    bottom: auto;
    left: auto;
    margin-top: -1.5rem;
    overflow: visible;
    padding: 0 6.25vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  #homepage .wrapper-without-slider section.full .listItem .info h3 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 2.7rem;
    line-height: 2.7rem;
  }
  #homepage .wrapper-without-slider section.full .listItem .info h4 {
    position: relative;
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 0.9rem;
    line-height: 1rem;
  }
}
#homepage .wrapper-without-slider section.three-cols {
  position: relative;
  width: 100vw;
  height: auto;
  margin: 6.25vw 0 6.25vw 0;
  padding: 0 6.25vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
#homepage .wrapper-without-slider section.three-cols .wrapper {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 100%));
  grid-gap: 6.25vw;
  gap: 6.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper-without-slider section.three-cols .wrapper {
    grid-template-columns: repeat(1, minmax(0, 100%));
    gap: 12.5vw;
  }
}
#homepage .wrapper-without-slider section.three-cols .wrapper .listItem {
  position: relative;
  width: 100%;
  height: auto;
}
#homepage .wrapper-without-slider section.three-cols .wrapper .listItem:first-of-type {
  margin-top: 6.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper-without-slider section.three-cols .wrapper .listItem:first-of-type {
    margin-top: 0;
  }
}
#homepage .wrapper-without-slider section.three-cols .wrapper .listItem:last-of-type {
  margin-top: 12.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper-without-slider section.three-cols .wrapper .listItem:last-of-type {
    margin-top: 0;
  }
}
#homepage .wrapper-without-slider section.three-cols .wrapper .listItem .linkCont {
  position: relative;
  width: 100%;
  height: auto;
  text-decoration: none;
  display: block;
}
#homepage .wrapper-without-slider section.three-cols .wrapper .listItem .linkCont .wrp {
  position: relative;
  width: 100%;
  height: auto;
}
#homepage .wrapper-without-slider section.three-cols .wrapper .listItem .linkCont .wrp .imageprj {
  position: relative;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
}
#homepage .wrapper-without-slider section.three-cols .wrapper .listItem .linkCont .wrp .imageprj picture {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
}
#homepage .wrapper-without-slider section.three-cols .wrapper .listItem .linkCont .wrp .imageprj picture img {
  position: relative;
  width: 100%;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#homepage .wrapper-without-slider section.three-cols .wrapper .listItem .linkCont .wrp .imageprj .info {
  position: absolute;
  bottom: 0;
  left: -3.125vw;
}
#homepage .wrapper-without-slider section.three-cols .wrapper .listItem .linkCont .info {
  position: absolute;
  bottom: 0;
  left: -1.875vw;
  -webkit-transform: translateY(35%);
  transform: translateY(35%);
  width: 100%;
  z-index: 5;
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#homepage .wrapper-without-slider section.three-cols .wrapper .listItem .linkCont .info h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 3vw;
  line-height: 3vw;
  display: inline-block;
  text-indent: -5px;
}
#homepage .wrapper-without-slider section.three-cols .wrapper .listItem .linkCont .info h4 {
  position: absolute;
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 24px;
  line-height: 24px;
  margin-top: 10px;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper-without-slider section.three-cols .wrapper .listItem .linkCont .info {
    position: relative;
    bottom: auto;
    left: auto;
    margin-top: -1.5rem;
    overflow: visible;
    padding: 0 6.25vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  #homepage .wrapper-without-slider section.three-cols .wrapper .listItem .linkCont .info h3 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 2.7rem;
    line-height: 2.7rem;
  }
  #homepage .wrapper-without-slider section.three-cols .wrapper .listItem .linkCont .info h4 {
    position: relative;
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 0.9rem;
    line-height: 1rem;
  }
}
#homepage .wrapper-without-slider section.two-cols {
  position: relative;
  width: 100vw;
  height: auto;
  margin: 12.5vw 0 6.25vw 0;
  padding: 0 6.25vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
#homepage .wrapper-without-slider section.two-cols .wrapper {
  position: relative;
  width: 100%;
  display: grid;
  grid-template-columns: 6.25vw auto auto 6.25vw;
  grid-gap: 6.25vw;
  gap: 6.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper-without-slider section.two-cols .wrapper {
    grid-template-columns: repeat(1, minmax(0, 100%));
    gap: 12.5vw;
  }
}
#homepage .wrapper-without-slider section.two-cols .wrapper .listItem {
  position: relative;
  width: 100%;
  height: auto;
}
#homepage .wrapper-without-slider section.two-cols .wrapper .listItem:first-of-type {
  margin-top: 6.25vw;
  grid-column: 2/span 1;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper-without-slider section.two-cols .wrapper .listItem:first-of-type {
    margin-top: 0;
    grid-column: 1;
  }
}
#homepage .wrapper-without-slider section.two-cols .wrapper .listItem:last-of-type {
  grid-column: 3/span 1;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper-without-slider section.two-cols .wrapper .listItem:last-of-type {
    margin-top: 0;
    grid-column: 1;
  }
}
#homepage .wrapper-without-slider section.two-cols .wrapper .listItem .linkCont {
  position: relative;
  width: 100%;
  height: auto;
  text-decoration: none;
  display: block;
}
#homepage .wrapper-without-slider section.two-cols .wrapper .listItem .linkCont .wrp {
  position: relative;
  width: 100%;
  height: auto;
}
#homepage .wrapper-without-slider section.two-cols .wrapper .listItem .linkCont .wrp .imageprj {
  position: relative;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
}
#homepage .wrapper-without-slider section.two-cols .wrapper .listItem .linkCont .wrp .imageprj picture {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
}
#homepage .wrapper-without-slider section.two-cols .wrapper .listItem .linkCont .wrp .imageprj picture img {
  position: relative;
  width: 100%;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#homepage .wrapper-without-slider section.two-cols .wrapper .listItem .linkCont .wrp .imageprj .info {
  position: absolute;
  bottom: 0;
  left: -3.125vw;
}
#homepage .wrapper-without-slider section.two-cols .wrapper .listItem .linkCont .info {
  position: absolute;
  bottom: 0;
  left: -1.875vw;
  -webkit-transform: translateY(35%);
  transform: translateY(35%);
  width: 100%;
  z-index: 5;
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#homepage .wrapper-without-slider section.two-cols .wrapper .listItem .linkCont .info h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 3vw;
  line-height: 3vw;
  display: inline-block;
  text-indent: -5px;
}
#homepage .wrapper-without-slider section.two-cols .wrapper .listItem .linkCont .info h4 {
  position: absolute;
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 24px;
  line-height: 24px;
  margin-top: 10px;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper-without-slider section.two-cols .wrapper .listItem .linkCont .info {
    position: relative;
    bottom: auto;
    left: auto;
    margin-top: -1.5rem;
    overflow: visible;
    padding: 0 6.25vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  #homepage .wrapper-without-slider section.two-cols .wrapper .listItem .linkCont .info h3 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 2.7rem;
    line-height: 2.7rem;
  }
  #homepage .wrapper-without-slider section.two-cols .wrapper .listItem .linkCont .info h4 {
    position: relative;
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 0.9rem;
    line-height: 1rem;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper-without-slider section.two-cols .wrapper .listItem .linkCont .info {
    position: relative;
    bottom: auto;
    left: auto;
    margin-top: -1.5rem;
    overflow: visible;
    padding: 0 6.25vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  #homepage .wrapper-without-slider section.two-cols .wrapper .listItem .linkCont .info h3 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 2.7rem;
    line-height: 2.7rem;
  }
  #homepage .wrapper-without-slider section.two-cols .wrapper .listItem .linkCont .info h4 {
    position: relative;
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 0.9rem;
    line-height: 1rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper-without-slider section.two-cols .wrapper .listItem .linkCont .info {
    position: relative;
    bottom: auto;
    left: auto;
    margin-top: -1.5rem;
    overflow: visible;
    padding: 0 6.25vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  #homepage .wrapper-without-slider section.two-cols .wrapper .listItem .linkCont .info h3 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 2.7rem;
    line-height: 2.7rem;
  }
  #homepage .wrapper-without-slider section.two-cols .wrapper .listItem .linkCont .info h4 {
    position: relative;
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 0.9rem;
    line-height: 1rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper-without-slider section.two-cols .wrapper .listItem .linkCont .info {
    position: relative;
    bottom: auto;
    left: auto;
    margin-top: -1.5rem;
    overflow: visible;
    padding: 0 6.25vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  #homepage .wrapper-without-slider section.two-cols .wrapper .listItem .linkCont .info h3 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 2.7rem;
    line-height: 2.7rem;
  }
  #homepage .wrapper-without-slider section.two-cols .wrapper .listItem .linkCont .info h4 {
    position: relative;
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 0.9rem;
    line-height: 1rem;
  }
}
#homepage .wrapper-without-slider section.new-text-block-about {
  position: relative;
  width: 100vw;
  height: 100vh;
  text-align: left;
  padding: 0 6.25vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding-bottom: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 4rem;
}
#homepage .wrapper-without-slider section.new-text-block-about .text-big h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 4vw;
  line-height: 4vw;
  -webkit-font-smoothing: antialiased;
  -webkit-transform: translateY(50%);
  transform: translateY(50%);
  opacity: 0;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #homepage .wrapper-without-slider section.new-text-block-about .text-big h3 {
    font-size: 8vw;
    line-height: 8vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper-without-slider section.new-text-block-about .text-big h3 {
    font-size: 2.9rem;
    line-height: 2.9rem;
  }
}
#homepage .wrapper-without-slider section.new-text-block-about .text-scroll {
  position: relative;
}
#homepage .wrapper-without-slider section.new-text-block-about .text-scroll a {
  position: relative;
  display: block;
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 24px;
  line-height: 24px;
  text-transform: uppercase;
  -webkit-font-smoothing: antialiased;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
  text-decoration: none;
}
#homepage .wrapper-without-slider section.new-text-marquee {
  /* .nextProjectMarquees {
         position: absolute;
         top: 50%;
         @include translateY(-50%);
         width: 100%;
         @include mobile{
  		position: relative;
  		top: 0;
  		@include translateY(0);
         } */
}
#homepage .wrapper-without-slider section.new-text-marquee h3 {
  font-size: 4vw;
  line-height: 4vw;
  color: transparent;
  -webkit-text-stroke: 2px #fff;
  -webkit-font-smoothing: antialiased;
  white-space: nowrap;
  font-family: "Monument Grotesk";
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper-without-slider section.new-text-marquee h3 {
    font-size: 1.9rem;
    line-height: 2.28rem;
    -webkit-text-stroke: 1px #fff;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper-without-slider section.new-text-marquee h3 {
    font-size: 6vw;
    line-height: 6vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper-without-slider section.new-text-marquee h3 {
    font-size: 6vw;
    line-height: 6vw;
  }
}
#homepage .wrapper-without-slider section.new-text-marquee .one {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
#homepage .wrapper-without-slider section.new-text-marquee .two {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
#homepage .wrapper-without-slider section.new-text-marquee .two h3 {
  color: white;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 4vw;
  font-weight: bold;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper-without-slider section.new-text-marquee .two h3 {
    font-size: 1.9rem;
    line-height: 2.28rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper-without-slider section.new-text-marquee .two h3 {
    font-size: 6vw;
    line-height: 6vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper-without-slider section.new-text-marquee .two h3 {
    font-size: 6vw;
    line-height: 6vw;
  }
}
#homepage .wrapper-without-slider section.new-text-marquee .three {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-transform: translateX(-60%);
  transform: translateX(-60%);
}
#homepage .wrapper-without-slider section.new-text-marquee .four {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
#homepage .wrapper-without-slider section.new-text-marquee .four h3 {
  color: white;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 4vw;
  font-weight: bold;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .wrapper-without-slider section.new-text-marquee .four h3 {
    font-size: 1.9rem;
    line-height: 2.28rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #homepage .wrapper-without-slider section.new-text-marquee .four h3 {
    font-size: 6vw;
    line-height: 6vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .wrapper-without-slider section.new-text-marquee .four h3 {
    font-size: 6vw;
    line-height: 6vw;
  }
}
#homepage .wrapper-without-slider section.new-text-marquee .five {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
#homepage .mob-new-text-block-about {
  position: relative;
  width: 100vw;
  height: 100vh;
  text-align: left;
  padding: 0 6.25vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding-bottom: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 4rem;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .mob-new-text-block-about {
    height: auto;
    padding: 10vh 6.25vw calc(10vh + 3.75rem) 6.25vw;
  }
}
#homepage .mob-new-text-block-about .text-big h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 4vw;
  line-height: 4vw;
  -webkit-font-smoothing: antialiased;
  -webkit-transform: translateY(50%);
  transform: translateY(50%);
  opacity: 0;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #homepage .mob-new-text-block-about .text-big h3 {
    font-size: 8vw;
    line-height: 8vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .mob-new-text-block-about .text-big h3 {
    font-size: 2rem;
    line-height: 2rem;
  }
}
#homepage .mob-new-text-block-about .text-scroll {
  position: relative;
}
#homepage .mob-new-text-block-about .text-scroll a {
  text-decoration: none;
  position: relative;
  display: block;
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 24px;
  line-height: 24px;
  text-transform: uppercase;
  -webkit-font-smoothing: antialiased;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .mob-new-text-block-about .text-scroll a {
    font-size: 16px;
    line-height: 16px;
  }
}
#homepage .new-numbers-block {
  position: relative;
  width: 100%;
  height: auto;
  padding: 9.375vw 6.25vw 0 6.25vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 100%));
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .new-numbers-block {
    padding: 12.5vw 6.25vw;
    grid-template-columns: repeat(1, minmax(0, 100%));
    gap: 12.5vw;
  }
}
#homepage .new-numbers-block .item {
  position: relative;
  width: 100%;
  height: auto;
}
#homepage .new-numbers-block .item .cont {
  position: relative;
  width: 100%;
  height: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
#homepage .new-numbers-block .item .cont h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 3rem;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .new-numbers-block .item .cont h2 {
    margin: 0;
    font-size: 1.3rem;
  }
}
#homepage .new-numbers-block .item .cont .inner {
  position: relative;
  width: 100%;
  height: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
#homepage .new-numbers-block .item .cont .inner h3 {
  position: relative;
  color: transparent;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .new-numbers-block .item .cont .inner h3 {
    font-size: 9rem;
    line-height: 9rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .new-numbers-block .item .cont .inner h3 {
    font-size: 9rem;
    line-height: 9rem;
  }
}
#homepage .new-numbers-block .item .cont .inner h4 {
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  color: transparent;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12vw;
  line-height: 10vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #homepage .new-numbers-block .item .cont .inner h4 {
    font-size: 16rem;
    line-height: 7rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #homepage .new-numbers-block .item .cont .inner h4 {
    font-size: 9rem;
    line-height: 9rem;
  }
}

#homeContacts {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  z-index: 3;
}
#homeContacts .wrapper {
  position: absolute;
  bottom: 20vh;
  left: 6.25vw;
  width: 87.5vw;
}
#homeContacts .wrapper .mail {
  position: relative;
  overflow: hidden;
}
#homeContacts .wrapper .mail h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 6vw;
}
#homeContacts .wrapper .mail a {
  color: transparent;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 6vw;
  -webkit-text-stroke: 2px var(--color-main);
  text-decoration: none;
}
#homeContacts .wrapper .addresses {
  position: relative;
  margin-top: 10vh;
}
#homeContacts .wrapper .addresses .ele {
  position: relative;
  float: left;
  margin-left: 6.25vw;
}
#homeContacts .wrapper .addresses .ele:first-of-type {
  margin-left: 0;
}
#homeContacts .wrapper .addresses .ele h3 {
  color: var(--color-main);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  text-transform: uppercase;
  margin-bottom: 2vh;
}
#homeContacts .wrapper .addresses .ele p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 25px;
  margin-bottom: 25px;
}
#homeContacts .wrapper .addresses .ele span {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 25px;
  display: block;
}
#homeContacts .wrapper .addresses .ele a {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 25px;
  display: block;
  text-decoration: none;
  margin-top: 25px;
}
#homeContacts .wrapper .addresses .ele ul {
  list-style: none;
}
#homeContacts .wrapper .addresses .ele ul li a {
  text-decoration: none;
}
#homeContacts .wrapper #continueNavigation {
  position: absolute;
  bottom: 0;
  right: 0;
}
#homeContacts .wrapper #continueNavigation span {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 30px;
}

.loader-up #main {
  opacity: 0;
  -webkit-transform: translateY(5vh);
  transform: translateY(5vh);
}
.loader-up #sub {
  opacity: 0;
  -webkit-transform: translateY(5vh);
  transform: translateY(5vh);
}
.loader-up #social {
  opacity: 0;
  -webkit-transform: translateY(5vh);
  transform: translateY(5vh);
}
.loader-up #languages {
  opacity: 0;
  -webkit-transform: translateY(5vh);
  transform: translateY(5vh);
}
.loader-up footer .left {
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
}
.loader-up footer .right {
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
}
.loader-up #darkMode {
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
  opacity: 0;
}
.loader-up #darkTransition {
  opacity: 0;
}

#aboutUs {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs .inview-item-mobile {
    position: relative;
    -webkit-transform: translateY(10vh);
    transform: translateY(10vh);
    opacity: 0;
  }
}
#aboutUs .before-underline {
  position: relative;
  display: inline-block;
}
#aboutUs .before-underline::before {
  position: absolute;
  left: 0;
  bottom: 1px;
  width: 100%;
  height: 1px;
  content: "";
  background: #fff;
}
#aboutUs section {
  position: relative;
  width: 100%;
  height: auto;
  float: left;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section {
    float: none;
  }
}
#aboutUs section.first {
  min-height: 130vh;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.first {
    margin-bottom: 7.5rem;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.first {
    min-height: 0;
    min-height: initial;
    padding-top: 7.5rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.first {
    min-height: 0;
    min-height: initial;
    padding-bottom: 7.5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.first {
    min-height: 0;
    min-height: initial;
    padding-bottom: 7.5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.first {
    min-height: 0;
    min-height: initial;
    padding-bottom: 7.5rem;
  }
}
#aboutUs section.first .text {
  position: relative;
  margin-left: 12.5vw;
  margin-top: calc(40vh - 8vw);
  z-index: 6;
  width: 75vw;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.first .text {
    margin-top: calc(46vh - 8vw);
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.first .text {
    margin-left: 6.25vw;
    margin-top: 0;
    width: 88.5vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.first .text {
    width: 87.5vw;
    margin-left: 6.25vw;
    margin-top: 15rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.first .text {
    width: 87.5vw;
    margin-left: 6.25vw;
    margin-top: 15rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.first .text {
    margin-left: 6.25vw;
    margin-top: 17.5rem;
  }
}
#aboutUs section.first .text h1 {
  margin-bottom: 10vh;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.first .text h1 {
    margin-bottom: 0;
  }
}
#aboutUs section.first .text h1 span {
  display: block;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10vw;
  line-height: 10vw;
}
#aboutUs section.first .text h1 span:nth-of-type(2) {
  -webkit-font-smoothing: antialiased;
}
#aboutUs section.first .text h1 span:nth-of-type(3) {
  color: transparent;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.first .text h1 span:nth-of-type(3) {
    -webkit-text-stroke: 1px var(--subColor);
  }
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.first .text h1 span {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 6.5rem;
    line-height: 6.5rem;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.first .text h1 span {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 3.5rem;
    line-height: 3.5rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.first .text h1 span {
    font-size: 10rem;
    line-height: 10rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.first .text h1 span {
    font-size: 10rem;
    line-height: 10rem;
  }
}
#aboutUs section.first .text p {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  line-height: 30px;
  width: 28.125vw;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.first .text p {
    width: 100%;
    font-size: 1.4rem;
    line-height: 1.68rem;
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.first .text p {
    width: 50vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.first .text p {
    width: 50vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.first .text p {
    width: 50vw;
    margin-bottom: 0;
  }
}
#aboutUs section.first .text p:first-of-type {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 30px;
  line-height: 40px;
  margin-bottom: 5vh;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.first .text p:first-of-type {
    font-size: 26px;
    line-height: 32px;
  }
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.first .text p:first-of-type {
    font-size: 26px;
    line-height: 32px;
    width: 46.875vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.first .text p:first-of-type {
    width: 100%;
    font-size: 1.4rem;
    line-height: 1.68rem;
    margin-bottom: 0;
    margin-top: 5rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.first .text p:first-of-type {
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.first .text p:first-of-type {
    margin-bottom: 0;
  }
}
#aboutUs section.first .image {
  position: absolute;
  top: 20vh;
  left: 50vw;
  width: 31.25vw;
  height: 46.875vw;
  display: block;
  z-index: 5;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.first .image {
    top: 26vh;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.first .image {
    top: 10vh;
    width: 40vw;
    height: 60vw;
    left: auto;
    right: 10.625vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.first .image {
    top: 15rem;
    width: 37.5vw;
    height: 56.25vw;
    left: auto;
    right: 12.5vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.first .image {
    top: 15rem;
    width: 37.5vw;
    height: 56.25vw;
    left: auto;
    right: 12.5vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.first .image {
    top: 15rem;
    width: 34.375vw;
    height: 51.5625vw;
    left: auto;
    right: 18.75vw;
  }
}
#aboutUs section.first .image picture {
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
#aboutUs section.first .image picture img {
  width: 100%;
  height: auto;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.second {
    margin-top: 3.75rem;
    margin-bottom: 3.75rem;
  }
}
#aboutUs section.second .titleTilt {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 5;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
#aboutUs section.second .titleTilt h2 {
  line-height: 10vw;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10vw;
  -webkit-transform: translateX(-12.5vw);
  transform: translateX(-12.5vw);
  -webkit-font-smoothing: antialiased;
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.second .titleTilt h2 {
    font-size: 3.5rem;
    line-height: 3.5rem;
    text-align: center;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.second .titleTilt h2 {
    font-size: 10rem;
    line-height: 10rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.second .titleTilt h2 {
    font-size: 10rem;
    line-height: 10rem;
  }
}
#aboutUs section.second .image {
  position: relative;
  width: 21.875vw;
  height: 32.8125vw;
  display: block;
  z-index: 2;
  margin: 0 auto;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.second .image {
    width: 43.75vw;
    height: 65.625vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.second .image {
    width: 50vw;
    height: 75vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.second .image {
    width: 50vw;
    height: 75vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.second .image {
    width: 37.5vw;
    height: 56.25vw;
  }
}
#aboutUs section.second .image picture {
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
#aboutUs section.second .image picture img {
  width: 100%;
  height: auto;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#aboutUs section.third {
  padding: 15vh 6.25vw 15vh 12.5vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.third {
    padding: 0 0 5rem 0;
    margin: 0 auto;
    width: 87.5vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.third {
    padding: 5rem 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.third {
    padding: 5rem 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.third {
    padding: 10rem 0 12.5rem 0;
  }
}
#aboutUs section.third .flex {
  position: relative;
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  z-index: 4;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.third .flex {
    overflow: visible;
    display: block;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.third .flex {
    overflow: visible;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 87.5vw;
    margin: 0 auto;
  }
}
#aboutUs section.third .flex .image {
  position: relative;
  width: 40.625vw;
  height: 30.46875vw;
  float: left;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.third .flex .image {
    width: 50vw;
    -ms-flex-preferred-size: 50vw;
        flex-basis: 50vw;
    height: 37.5vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.third .flex .image {
    display: none;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.third .flex .image {
    width: 43.75vw;
  }
}
#aboutUs section.third .flex .image picture {
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
#aboutUs section.third .flex .image picture img {
  width: 100%;
  height: auto;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#aboutUs section.third .flex .image img {
  width: 100%;
  height: auto;
  display: block;
}
#aboutUs section.third .flex .text {
  position: relative;
  width: 50%;
  float: left;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.third .flex .text {
    width: 28.125vw;
    -ms-flex-preferred-size: 28.125vw;
        flex-basis: 28.125vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.third .flex .text {
    float: none;
    width: 100%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.third .flex .text {
    float: none;
    width: 100%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.third .flex .text {
    float: none;
    width: 100%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.third .flex .text {
    width: 37.5vw;
  }
}
#aboutUs section.third .flex .text .wrp {
  position: absolute;
  width: 80%;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.third .flex .text .wrp {
    position: relative;
    width: 100%;
    left: 0;
    top: 0;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.third .flex .text .wrp {
    position: relative;
    width: 100%;
    left: 0;
    top: 0;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.third .flex .text .wrp {
    position: relative;
    width: 100%;
    left: 0;
    top: 0;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.third .flex .text .wrp {
    position: relative;
    width: 100%;
    left: 0;
    top: 0;
    margin-left: 6.25vw;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}
#aboutUs section.third .flex .text .wrp p {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  line-height: 30px;
  width: 25vw;
}
#aboutUs section.third .flex .text .wrp p:first-of-type {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 30px;
  line-height: 40px;
  margin-bottom: 5vh;
}
@media only screen and (min-device-width: 1440px) and (max-device-width: 1440px) and (min-device-height: 900px) and (max-device-Height: 1440px) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.third .flex .text .wrp p:first-of-type {
    font-size: 26px;
    line-height: 30px;
  }
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.third .flex .text .wrp p:first-of-type {
    font-size: 26px;
    line-height: 32px;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.third .flex .text .wrp p:first-of-type {
    width: 100%;
    font-size: 1.4rem;
    line-height: 1.68rem;
    margin-bottom: 0;
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.third .flex .text .wrp p:first-of-type {
    width: 100%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.third .flex .text .wrp p:first-of-type {
    width: 100%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.third .flex .text .wrp p:first-of-type {
    width: 100%;
    margin: 0;
  }
}
#aboutUs section.fourth .image {
  position: relative;
  width: 100vw;
  height: 66.6796875vw;
  float: left;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.fourth .image {
    float: none;
  }
}
#aboutUs section.fourth .image picture {
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
#aboutUs section.fourth .image picture img {
  width: 100%;
  height: auto;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#aboutUs section.fourth .text {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 90%;
}
#aboutUs section.fourth .text .desc {
  position: relative;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#aboutUs section.fourth .text .desc p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 70px;
  line-height: 80px;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.fourth .text .desc p {
    font-size: 54px;
    line-height: 60px;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.fourth .text .desc p {
    width: 100%;
    font-size: 1.4rem;
    line-height: 1.68rem;
    margin-bottom: 0;
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.fourth .text .desc p {
    width: 100%;
    font-size: 3rem;
    line-height: 3.6rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.fourth .text .desc p {
    width: 100%;
    font-size: 3rem;
    line-height: 3.6rem;
  }
}
#aboutUs section.fourth img {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
}
#aboutUs section.fifth {
  position: relative;
  width: 87.5vw;
  margin: 0 auto;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.fifth {
    padding: 5rem 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.fifth {
    width: 100%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.fifth {
    width: 100%;
  }
}
#aboutUs section.fifth .text {
  padding: 15vh 12.5vw 0 18.75vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.fifth .text {
    padding: 0;
    width: 100%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.fifth .text {
    padding: 15rem 6.25vw 10rem 6.25vw;
    width: 100%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.fifth .text {
    padding: 15rem 6.25vw 10rem 6.25vw;
    width: 100%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.fifth .text {
    padding: 15rem 12.5vw 10rem 12.5vw;
  }
}
#aboutUs section.fifth .text h2 {
  line-height: 10vw;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10vw;
  -webkit-transform: translateX(-12.5vw);
  transform: translateX(-12.5vw);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.fifth .text h2 {
    font-size: 2.9rem;
  }
}
#aboutUs section.fifth .text .desc {
  position: relative;
  margin-top: 10vh;
  width: 60vw;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.fifth .text .desc {
    width: 100%;
    margin-top: 2.5rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.fifth .text .desc {
    width: 100%;
    margin-top: 5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.fifth .text .desc {
    width: 100%;
    margin-top: 5rem;
  }
}
#aboutUs section.fifth .text .desc p {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  line-height: 30px;
  width: 100%;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.fifth .text .desc p {
    font-size: 0.9rem;
    line-height: 1.08rem;
    margin-bottom: 0;
    margin-top: 2.5rem;
  }
}
#aboutUs section.fifth .text .desc p:first-of-type {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 30px;
  line-height: 40px;
  margin-bottom: 5vh;
  width: 100%;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.fifth .text .desc p:first-of-type {
    font-size: 26px;
    line-height: 32px;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.fifth .text .desc p:first-of-type {
    font-size: 1.4rem;
    line-height: 1.68rem;
    margin-bottom: 0;
    margin-top: 0;
  }
}
#aboutUs section.sezione-team-mobile {
  position: relative;
  padding-bottom: 5rem;
}
#aboutUs section.sezione-team-mobile .img {
  position: relative;
}
#aboutUs section.sezione-team-mobile img {
  width: 100%;
  pointer-events: none;
}
#aboutUs section.sezione-team-mobile .swiper-container {
  overflow: visible;
  padding-left: 15vw;
  padding-right: 20vw;
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide {
  z-index: 1;
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .text {
  position: absolute;
  bottom: 2rem;
  left: 2rem;
  z-index: 4;
  -webkit-transition: all 0.5s linear 0s;
  transition: all 0.5s linear 0s;
  opacity: 0;
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .text h3 {
  position: relative;
  /*@include translateY(10vh);
  opacity: 0;*/
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .text h3 span {
  line-height: 1.9rem;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 1.9rem;
  -webkit-font-smoothing: antialiased;
  display: block;
  text-indent: -3px;
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .text h3 span:last-of-type {
  line-height: 0.8rem;
  margin-top: 0.35rem;
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 0.8rem;
  color: var(--subColor);
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .avatar {
  position: absolute;
  left: 90%;
  top: 0%;
  width: 18vw;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  z-index: 11;
  -webkit-transition: all 0.3s linear 0s;
  transition: all 0.3s linear 0s;
  opacity: 0;
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .avatar .circle {
  position: absolute;
  width: 30vw;
  -webkit-animation-name: animation-rotation-dots;
          animation-name: animation-rotation-dots;
  -webkit-animation-duration: 14s;
          animation-duration: 14s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .avatar .circle {
    width: 27vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .avatar .circle {
    width: 27vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .avatar .circle {
    width: 27vw;
  }
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .avatar .circle svg {
  fill: var(--subColor);
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .avatar .circle .st0 {
  fill: var(--subColor);
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide.swiper-slide-active {
  position: relative;
  z-index: 2;
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide.swiper-slide-active .text {
  -webkit-transition: all 0.5s linear 0s;
  transition: all 0.5s linear 0s;
  opacity: 1;
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide.swiper-slide-active .avatar {
  -webkit-transition: all 0.5s linear 0s;
  transition: all 0.5s linear 0s;
  opacity: 1;
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide.swiper-slide-active .timer-mobile {
  -webkit-transition: all 0.5s linear 0s;
  transition: all 0.5s linear 0s;
  opacity: 1;
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .timer-mobile {
  position: relative;
  width: 100%;
  -webkit-transition: all 0.3s linear 0s;
  transition: all 0.3s linear 0s;
  opacity: 0;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .timer-mobile .caption {
  position: relative;
  margin-bottom: 0.5rem;
  margin-top: 1rem;
  width: 100%;
  pointer-events: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .timer-mobile .caption p {
  color: #515151;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 0.8rem;
  line-height: 0.8rem;
  pointer-events: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .timer-mobile .caption p {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 1.2rem;
    line-height: 1.2rem;
  }
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .timer-mobile p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 0.8rem;
  line-height: 0.8rem;
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .timer-mobile p {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 1.2rem;
    line-height: 1.2rem;
  }
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .timer-mobile .title {
  margin-bottom: 1rem;
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .timer-mobile .title p {
  font-size: 1.3rem;
  line-height: 1.3rem;
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .timer-mobile .timer__wrapper {
  position: relative;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .timer-mobile .timer__wrapper .col {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  -ms-flex-preferred-size: 25%;
      flex-basis: 25%;
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .timer-mobile .timer__wrapper .col {
    width: 25%;
  }
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .timer-mobile .timer__wrapper .col.col--days {
  -ms-flex-preferred-size: 25%;
      flex-basis: 25%;
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .timer-mobile .timer__wrapper .col.col--days .number {
  width: 65%;
  -ms-flex-preferred-size: 65%;
      flex-basis: 65%;
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .timer-mobile .timer__wrapper .col.col--days .txt {
  width: 35%;
  -ms-flex-preferred-size: 35%;
      flex-basis: 35%;
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .timer-mobile .timer__wrapper .col .number {
  width: 45%;
  -ms-flex-preferred-size: 45%;
      flex-basis: 45%;
  text-align: right;
  margin-right: 0.25rem;
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .timer-mobile .timer__wrapper .col .number p {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 1.1rem;
  line-height: 1.1rem;
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .timer-mobile .timer__wrapper .col .number p {
    color: invertColor;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 1.6rem;
    line-height: 1.6rem;
  }
}
#aboutUs section.sezione-team-mobile .swiper-container .swiper-slide .timer-mobile .timer__wrapper .col .txt {
  width: 55%;
  -ms-flex-preferred-size: 55%;
      flex-basis: 55%;
}
#aboutUs section.sezione-team-mobile .control {
  position: absolute;
  right: calc(6.25vw - 1rem);
  bottom: 4.5rem;
  padding: 1rem;
  z-index: 19;
  outline: none;
  -webkit-transition: all 0.3s linear 0s;
  transition: all 0.3s linear 0s;
  opacity: 1;
}
#aboutUs section.sezione-team-mobile .control.swiper-button-disabled {
  opacity: 0.2;
}
#aboutUs section.sezione-team-mobile .control .control__wrapper {
  position: relative;
  width: 3rem;
}
#aboutUs section.sezione-team-mobile .control .control__wrapper.swiper-button-disabled {
  opacity: 0.2;
}
#aboutUs section.sezione-team-mobile .control .control__wrapper .svg-circle {
  fill: #292929;
}
#aboutUs section.sezione-team-mobile .control .control__wrapper .svg-arrow {
  fill: var(--subColor);
}
#aboutUs section.horizontalAbout {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
  min-height: 100vh;
  z-index: 3;
}
#aboutUs section.horizontalAbout .st0 {
  stroke: unset;
}
#aboutUs section.horizontalAbout .wrapper {
  position: absolute;
  top: 0;
  left: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  overflow-x: auto;
  padding-left: 25vw;
}
#aboutUs section.horizontalAbout .wrapper .team-element {
  position: relative;
  width: 33vw;
  height: 100vh;
  float: left;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
}
#aboutUs section.horizontalAbout .wrapper .team-element .bg {
  position: absolute;
  top: 50%;
  left: 1vh;
  height: 68vh;
  width: 47.8833333333vh;
  -webkit-transform: translate(0, -50%) rotate(0deg);
  transform: translate(0, -50%) rotate(0deg);
  background-color: var(--subColor);
  opacity: 0;
  visibility: hidden;
  -webkit-transition: transform 0.5s ease-in-out 0s;
  -webkit-transition: -webkit-transform 0.5s ease-in-out 0s;
  transition: -webkit-transform 0.5s ease-in-out 0s;
  transition: transform 0.5s ease-in-out 0s;
  transition: transform 0.5s ease-in-out 0s, -webkit-transform 0.5s ease-in-out 0s;
}
#aboutUs section.horizontalAbout .wrapper .team-element .image {
  position: absolute;
  top: 50%;
  left: 0;
  height: 70vh;
  width: 49.2916666667vh;
  overflow: hidden;
  z-index: 3;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
}
#aboutUs section.horizontalAbout .wrapper .team-element .image .image__wrapper {
  height: 70vh;
  width: 49.2916666667vh;
}
#aboutUs section.horizontalAbout .wrapper .team-element .image .image__wrapper .image__container {
  height: 70vh;
  width: 49.2916666667vh;
  overflow: hidden;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  background-color: var(--subColor);
}
#aboutUs section.horizontalAbout .wrapper .team-element .image .image__wrapper .image__container picture {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
#aboutUs section.horizontalAbout .wrapper .team-element .image .image__wrapper .image__container picture img {
  position: relative;
  width: 100%;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#aboutUs section.horizontalAbout .wrapper .team-element .text {
  position: absolute;
  bottom: calc(15vh + 0.5*6.25vw);
  left: 3.125vw;
  z-index: 4;
  -webkit-transition: opacity 0.5s ease-in-out 0s;
  transition: opacity 0.5s ease-in-out 0s;
  opacity: 0;
}
#aboutUs section.horizontalAbout .wrapper .team-element .text h3 {
  position: relative;
  /*@include translateY(10vh);
  opacity: 0;*/
}
#aboutUs section.horizontalAbout .wrapper .team-element .text h3 span {
  line-height: 2.5vw;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 2.5vw;
  -webkit-font-smoothing: antialiased;
  display: block;
  text-indent: -5px;
}
#aboutUs section.horizontalAbout .wrapper .team-element .text h3 span:last-of-type {
  line-height: 1vw;
  text-indent: 0px;
  margin-top: 1vh;
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 1vw;
  color: var(--subColor);
}
#aboutUs section.horizontalAbout .wrapper .team-element .text h4 {
  position: relative;
  line-height: 20px;
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  margin-top: 2vh;
  -webkit-font-smoothing: antialiased;
}
#aboutUs section.horizontalAbout .wrapper .team-element .text h4 span {
  position: relative;
  display: block;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#aboutUs section.horizontalAbout .wrapper .team-element .badge {
  position: absolute;
  top: 15vh;
  left: 49.2916666667vh;
  width: 9.375vw;
  z-index: 5;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  opacity: 0;
  -webkit-transition: opacity 0.5s ease-in-out 0s;
  transition: opacity 0.5s ease-in-out 0s;
}
#aboutUs section.horizontalAbout .wrapper .team-element .badge .circle {
  position: relative;
  width: 100%;
  height: auto;
  -webkit-animation-name: animation-rotation-dots;
          animation-name: animation-rotation-dots;
  -webkit-animation-duration: 14s;
          animation-duration: 14s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
#aboutUs section.horizontalAbout .wrapper .team-element .badge .circle svg {
  fill: var(--subColor);
}
#aboutUs section.horizontalAbout .wrapper .team-element .badge .circle .st0 {
  fill: var(--subColor);
}
#aboutUs section.horizontalAbout .wrapper .team-element .badge .avatar {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 5vw;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
#aboutUs section.horizontalAbout .wrapper .team-element .badge .avatar img {
  width: 100%;
  height: auto;
  display: block;
}
#aboutUs section.horizontalAbout .wrapper .team-element .timer {
  position: absolute;
  width: 49.2916666667vh;
  opacity: 0;
  -webkit-transition: opacity 0.5s ease-in-out 0s;
  transition: opacity 0.5s ease-in-out 0s;
  top: 87vh;
  left: 0;
}
#aboutUs section.horizontalAbout .wrapper .team-element .timer p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 1rem;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.horizontalAbout .wrapper .team-element .timer p {
    font-size: 12px;
  }
}
#aboutUs section.horizontalAbout .wrapper .team-element .timer .timer__wrapper {
  position: relative;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
#aboutUs section.horizontalAbout .wrapper .team-element .timer .timer__wrapper .col {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  width: 18%;
  -ms-flex-preferred-size: 18%;
      flex-basis: 18%;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.horizontalAbout .wrapper .team-element .timer .timer__wrapper .col {
    width: 20%;
    -ms-flex-preferred-size: 20%;
        flex-basis: 20%;
  }
}
#aboutUs section.horizontalAbout .wrapper .team-element .timer .timer__wrapper .col.col--title {
  width: 22%;
  -ms-flex-preferred-size: 22%;
      flex-basis: 22%;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.horizontalAbout .wrapper .team-element .timer .timer__wrapper .col.col--title {
    width: 20%;
    -ms-flex-preferred-size: 20%;
        flex-basis: 20%;
  }
}
#aboutUs section.horizontalAbout .wrapper .team-element .timer .timer__wrapper .col.col--days {
  width: 24%;
  -ms-flex-preferred-size: 24%;
      flex-basis: 24%;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.horizontalAbout .wrapper .team-element .timer .timer__wrapper .col.col--days {
    width: 20%;
    -ms-flex-preferred-size: 20%;
        flex-basis: 20%;
  }
}
#aboutUs section.horizontalAbout .wrapper .team-element .timer .timer__wrapper .col.col--days .number {
  width: 65%;
  -ms-flex-preferred-size: 65%;
      flex-basis: 65%;
}
#aboutUs section.horizontalAbout .wrapper .team-element .timer .timer__wrapper .col.col--days .txt {
  width: 35%;
  -ms-flex-preferred-size: 35%;
      flex-basis: 35%;
}
#aboutUs section.horizontalAbout .wrapper .team-element .timer .timer__wrapper .col .number {
  width: 55%;
  -ms-flex-preferred-size: 55%;
      flex-basis: 55%;
  text-align: right;
  margin-right: 0.25rem;
}
#aboutUs section.horizontalAbout .wrapper .team-element .timer .timer__wrapper .col .number p {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 2.2rem;
  line-height: 2.2rem;
}
@media only screen and (min-device-width: 1440px) and (max-device-width: 1440px) and (min-device-height: 900px) and (max-device-Height: 1440px) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.horizontalAbout .wrapper .team-element .timer .timer__wrapper .col .number p {
    font-size: 1.6rem;
    line-height: 1.6rem;
  }
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.horizontalAbout .wrapper .team-element .timer .timer__wrapper .col .number p {
    font-size: 16px;
    line-height: 16px;
  }
}
#aboutUs section.horizontalAbout .wrapper .team-element .timer .timer__wrapper .col .txt {
  width: 45%;
  -ms-flex-preferred-size: 45%;
      flex-basis: 45%;
}
#aboutUs section.horizontalAbout .wrapper .team-element:hover .bg {
  -webkit-transform: translate(0, -50%) rotate(5deg);
  transform: translate(0, -50%) rotate(5deg);
  -webkit-transition: transform 0.5s ease-in-out 0s;
  -webkit-transition: -webkit-transform 0.5s ease-in-out 0s;
  transition: -webkit-transform 0.5s ease-in-out 0s;
  transition: transform 0.5s ease-in-out 0s;
  transition: transform 0.5s ease-in-out 0s, -webkit-transform 0.5s ease-in-out 0s;
}
#aboutUs section.horizontalAbout .wrapper .team-element:hover .text {
  opacity: 1;
  -webkit-transition: opacity 0.5s ease-in-out 0s;
  transition: opacity 0.5s ease-in-out 0s;
}
#aboutUs section.horizontalAbout .wrapper .team-element:hover .badge {
  opacity: 1;
  -webkit-transition: opacity 0.5s ease-in-out 0s;
  transition: opacity 0.5s ease-in-out 0s;
}
#aboutUs section.horizontalAbout .wrapper .team-element:hover .timer {
  opacity: 1;
  -webkit-transition: opacity 0.5s ease-in-out 0s;
  transition: opacity 0.5s ease-in-out 0s;
}
#aboutUs section.sixth {
  padding-bottom: 15vh;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.sixth {
    padding-bottom: 5rem;
    width: 87.5vw;
    margin: 0 auto;
  }
}
#aboutUs section.sixth .text {
  padding: 15vh 12.5vw 15vh 18.75vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  overflow: hidden;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.sixth .text {
    padding-left: 6.25vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.sixth .text {
    padding: 0;
    overflow: visible;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.sixth .text {
    padding: 10rem 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.sixth .text {
    padding: 10rem 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.sixth .text {
    padding: 10rem 12.5vw;
  }
}
#aboutUs section.sixth .text .title h2 {
  line-height: 10vw;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10vw;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.sixth .text .title h2 {
    font-size: 2.9rem;
  }
}
#aboutUs section.sixth .text .title .wrp {
  margin-top: 10vh;
  width: 41vw;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.sixth .text .title .wrp {
    width: 87.5vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.sixth .text .title .wrp {
    margin-top: 2.5rem;
    width: 100%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.sixth .text .title .wrp {
    margin-top: 5rem;
    width: 100%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.sixth .text .title .wrp {
    margin-top: 5rem;
    width: 100%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.sixth .text .title .wrp {
    width: 100%;
  }
}
#aboutUs section.sixth .text .title .wrp p {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  line-height: 30px;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.sixth .text .title .wrp p {
    width: 100%;
    font-size: 0.9rem;
    line-height: 1.08rem;
    margin-bottom: 0;
    margin-top: 1.25rem;
  }
}
#aboutUs section.sixth .text .title .wrp p:first-of-type {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 30px;
  line-height: 40px;
  margin-bottom: 5vh;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.sixth .text .title .wrp p:first-of-type {
    font-size: 26px;
    line-height: 32px;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.sixth .text .title .wrp p:first-of-type {
    width: 100%;
    font-size: 1.4rem;
    line-height: 1.68rem;
    margin-bottom: 0;
    margin-top: 0;
  }
}
#aboutUs section.sixth .serviceList {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: auto;
}
#aboutUs section.sixth .serviceList .serviceElement {
  position: relative;
  float: left;
  width: 100%;
  height: auto;
  padding: 15vh 0;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.sixth .serviceList .serviceElement:last-of-type {
    padding-bottom: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.sixth .serviceList .serviceElement:last-of-type {
    padding-bottom: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.sixth .serviceList .serviceElement:last-of-type {
    padding-bottom: 0;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.sixth .serviceList .serviceElement {
    padding: 2.5rem 0 0 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.sixth .serviceList .serviceElement {
    padding: 0;
    padding-bottom: 10rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.sixth .serviceList .serviceElement {
    padding: 0;
    padding-bottom: 10rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.sixth .serviceList .serviceElement {
    padding: 0;
    padding-bottom: 10rem;
  }
}
#aboutUs section.sixth .serviceList .serviceElement .serviceText {
  position: relative;
  float: left;
  margin-left: 25vw;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.sixth .serviceList .serviceElement .serviceText {
    margin-left: 18.75vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.sixth .serviceList .serviceElement .serviceText {
    float: none;
    margin-left: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.sixth .serviceList .serviceElement .serviceText {
    float: none;
    width: 75vw;
    margin: 0 auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.sixth .serviceList .serviceElement .serviceText {
    float: none;
    width: 75vw;
    margin: 0 auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.sixth .serviceList .serviceElement .serviceText {
    margin-left: 12.5vw;
  }
}
#aboutUs section.sixth .serviceList .serviceElement .serviceText h2 {
  position: relative;
}
#aboutUs section.sixth .serviceList .serviceElement .serviceText h2 .svg-image {
  position: absolute;
  width: 3rem;
  right: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
#aboutUs section.sixth .serviceList .serviceElement .serviceText h2 .svg-image .image {
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
  position: relative;
  width: 100%;
  line-height: 0;
}
#aboutUs section.sixth .serviceList .serviceElement .serviceText h2 .svg-image .image .img-svg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
}
#aboutUs section.sixth .serviceList .serviceElement .serviceText h2 .svg-image .image .svg-circle {
  stroke: #fff;
  stroke-width: 4;
  fill: none;
}
#aboutUs section.sixth .serviceList .serviceElement .serviceText h2 .svg-image .image .svg-line {
  stroke: #fff;
  stroke-width: 8;
  fill: none;
}
#aboutUs section.sixth .serviceList .serviceElement .serviceText h2 span {
  position: relative;
  display: block;
  line-height: 8vw;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  -webkit-font-smoothing: antialiased;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.sixth .serviceList .serviceElement .serviceText h2 span {
    font-size: 2.9rem;
    line-height: 2.9rem;
  }
}
#aboutUs section.sixth .serviceList .serviceElement .serviceText h2 span:last-of-type {
  color: transparent;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--color-service);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.sixth .serviceList .serviceElement .serviceText h2 span:last-of-type {
    font-size: 2.9rem;
    line-height: 2.9rem;
    -webkit-text-stroke: 1px var(--color-service);
  }
}
#aboutUs section.sixth .serviceList .serviceElement .serviceText .description {
  position: relative;
  margin-top: 5rem;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.sixth .serviceList .serviceElement .serviceText .description {
    margin-top: 1.25rem;
    height: 0;
    overflow: hidden;
  }
}
#aboutUs section.sixth .serviceList .serviceElement .serviceText .description .wrapper {
  position: relative;
  float: left;
  width: 37.5vw;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.sixth .serviceList .serviceElement .serviceText .description .wrapper {
    float: none;
    width: 100%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.sixth .serviceList .serviceElement .serviceText .description .wrapper {
    float: none;
    width: 100%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.sixth .serviceList .serviceElement .serviceText .description .wrapper {
    float: none;
    width: 100%;
  }
}
#aboutUs section.sixth .serviceList .serviceElement .serviceText .description .wrapper p {
  color: var(--color-service);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  line-height: 30px;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.sixth .serviceList .serviceElement .serviceText .description .wrapper p {
    width: 100%;
    margin-bottom: 0;
    margin-top: 1.25rem;
  }
}
#aboutUs section.sixth .serviceList .serviceElement .serviceText .description .wrapper p:first-of-type {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 30px;
  line-height: 40px;
  margin-bottom: 5vh;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.sixth .serviceList .serviceElement .serviceText .description .wrapper p:first-of-type {
    font-size: 26px;
    line-height: 32px;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.sixth .serviceList .serviceElement .serviceText .description .wrapper p:first-of-type {
    width: 100%;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 1.68rem;
    margin-bottom: 0;
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.sixth .serviceList .serviceElement .serviceText .description .wrapper p:first-of-type {
    margin-bottom: 2.5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.sixth .serviceList .serviceElement .serviceText .description .wrapper p:first-of-type {
    margin-bottom: 2.5rem;
  }
}
#aboutUs section.sixth .serviceList .serviceElement .serviceText .description .servicesList {
  position: relative;
  float: left;
  margin-left: 15.625vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.sixth .serviceList .serviceElement .serviceText .description .servicesList {
    margin-left: 0;
    float: none;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.sixth .serviceList .serviceElement .serviceText .description .servicesList {
    margin-left: 0;
    margin-top: 5rem;
    float: none;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.sixth .serviceList .serviceElement .serviceText .description .servicesList {
    margin-left: 0;
    margin-top: 5rem;
    float: none;
  }
}
#aboutUs section.sixth .serviceList .serviceElement .serviceText .description .servicesList .lista.mobile {
  position: relative;
  margin-top: 1.25rem;
}
#aboutUs section.sixth .serviceList .serviceElement .serviceText .description .servicesList .lista.mobile .lista__wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
#aboutUs section.sixth .serviceList .serviceElement .serviceText .description .servicesList .lista.mobile .lista__wrapper ul.colonna1 {
  -ms-flex-preferred-size: 37.5vw;
      flex-basis: 37.5vw;
  width: 37.5vw;
}
#aboutUs section.sixth .serviceList .serviceElement .serviceText .description .servicesList .lista.mobile .lista__wrapper ul.colonna2 {
  -ms-flex-preferred-size: 50vw;
      flex-basis: 50vw;
  width: 50vw;
}
#aboutUs section.sixth .serviceList .serviceElement .serviceText .description .servicesList .lista.mobile .lista__wrapper ul li {
  color: var(--color-service);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 0.8rem;
  line-height: 1.35rem;
  -webkit-font-smoothing: antialiased;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.sixth .serviceList .serviceElement .serviceText .description .servicesList .lista.mobile .lista__wrapper ul li {
    font-size: 30px;
    line-height: 40px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.sixth .serviceList .serviceElement .serviceText .description .servicesList .lista.mobile .lista__wrapper ul li {
    font-size: 30px;
    line-height: 40px;
  }
}
#aboutUs section.sixth .serviceList .serviceElement .serviceText .description .servicesList ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
#aboutUs section.sixth .serviceList .serviceElement .serviceText .description .servicesList ul li {
  color: var(--color-service);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 22px;
  line-height: 40px;
  -webkit-font-smoothing: antialiased;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.seventh {
    margin-top: 0rem;
    margin-bottom: 3.75rem;
  }
}
#aboutUs section.seventh .titleTilt {
  position: absolute;
  top: 50%;
  width: 100%;
  text-align: center;
  z-index: 5;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
#aboutUs section.seventh .titleTilt h2 {
  line-height: 10vw;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10vw;
  -webkit-transform: translateX(-12.5vw);
  transform: translateX(-12.5vw);
  -webkit-font-smoothing: antialiased;
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.seventh .titleTilt h2 {
    font-size: 3.5rem;
    line-height: 3.5rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.seventh .titleTilt h2 {
    font-size: 10rem;
    line-height: 10rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.seventh .titleTilt h2 {
    font-size: 10rem;
    line-height: 10rem;
  }
}
#aboutUs section.seventh .image {
  position: relative;
  width: 25vw;
  height: 37.5vw;
  display: block;
  z-index: 2;
  margin: 0 auto;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.seventh .image {
    width: 43.75vw;
    height: 65.625vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.seventh .image {
    width: 50vw;
    height: 75vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.seventh .image {
    width: 37.5vw;
    height: 56.25vw;
  }
}
#aboutUs section.seventh .image picture {
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
#aboutUs section.seventh .image picture img {
  width: 100%;
  height: auto;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#aboutUs section.eighth {
  padding: 15vh 6.25vw 15vh 12.5vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.eighth {
    padding-left: 6.25vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.eighth {
    padding: 0;
    width: 87.5vw;
    margin: 0 auto;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.eighth {
    padding-top: 7.5rem;
    padding-bottom: 2.5rem;
    width: 87.5vw;
    margin: 0 auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.eighth {
    padding-top: 7.5rem;
    padding-bottom: 2.5rem;
    width: 87.5vw;
    margin: 0 auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.eighth {
    padding: 7.5rem 0;
  }
}
#aboutUs section.eighth .flex {
  position: relative;
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  z-index: 4;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.eighth .flex {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.eighth .flex {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.eighth .flex {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.eighth .flex {
    overflow: visible;
    width: 87.5vw;
    margin: 0 auto;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
#aboutUs section.eighth .flex .image {
  position: relative;
  width: 37.5vw;
  height: 24.7572815534vw;
  float: left;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.eighth .flex .image {
    width: 50vw;
    height: 33.0097087379vw;
    -ms-flex-preferred-size: 50vw;
        flex-basis: 50vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.eighth .flex .image {
    width: 62.5vw;
    height: 41.2621359223vw;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.eighth .flex .image {
    width: 62.5vw;
    height: 41.2621359223vw;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.eighth .flex .image {
    width: 62.5vw;
    height: 41.2621359223vw;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.eighth .flex .image {
    width: 37.5vw;
    height: 24.7572815534vw;
  }
}
#aboutUs section.eighth .flex .image picture {
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
#aboutUs section.eighth .flex .image picture img {
  width: 100%;
  height: auto;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#aboutUs section.eighth .flex .image img {
  width: 100%;
  height: auto;
  display: block;
}
#aboutUs section.eighth .flex .text {
  position: relative;
  width: 50%;
  float: left;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.eighth .flex .text {
    float: none;
    width: 40vw;
    -ms-flex-preferred-size: 40vw;
        flex-basis: 40vw;
  }
}
#aboutUs section.eighth .flex .text.mobile {
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
  width: 100%;
  float: none;
  margin-bottom: 2.5rem;
  opacity: 0;
  -webkit-transform: translateY(20vh);
  transform: translateY(20vh);
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.eighth .flex .text {
    width: 43.75vw;
    margin-left: 6.25vw;
  }
}
#aboutUs section.eighth .flex .text .wrp {
  position: absolute;
  width: 80%;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.eighth .flex .text .wrp {
    position: relative;
    width: 90%;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.eighth .flex .text .wrp {
    position: relative;
    width: 100%;
    top: 0;
    left: 0;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.eighth .flex .text .wrp {
    position: relative;
    width: 100%;
    top: 0;
    left: 0;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.eighth .flex .text .wrp {
    position: relative;
    width: 100%;
    top: 0;
    left: 0;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.eighth .flex .text .wrp {
    position: relative;
    width: 100%;
    top: 0;
    left: 0;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}
#aboutUs section.eighth .flex .text .wrp p {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  line-height: 30px;
}
@media only screen and (min-device-width: 1440px) and (max-device-width: 1440px) and (min-device-height: 900px) and (max-device-Height: 1440px) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.eighth .flex .text .wrp p {
    font-size: 16px;
    line-height: 20px;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.eighth .flex .text .wrp p {
    width: 100%;
    font-size: 0.9rem;
    line-height: 1.08rem;
    margin-bottom: 0;
  }
}
#aboutUs section.eighth .flex .text .wrp p:first-of-type {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 30px;
  line-height: 40px;
  margin-bottom: 5vh;
}
@media only screen and (min-device-width: 1440px) and (max-device-width: 1440px) and (min-device-height: 900px) and (max-device-Height: 1440px) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.eighth .flex .text .wrp p:first-of-type {
    font-size: 26px;
    line-height: 30px;
  }
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #aboutUs section.eighth .flex .text .wrp p:first-of-type {
    font-size: 26px;
    line-height: 32px;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.eighth .flex .text .wrp p:first-of-type {
    width: 100%;
    font-size: 1.4rem;
    line-height: 1.68rem;
    margin-bottom: 0;
  }
}
#aboutUs section.nineth {
  padding-bottom: 15vh;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.nineth {
    padding-bottom: 2.5rem;
    width: 87.5vw;
    margin: 2.5rem auto 0 auto;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.nineth {
    padding-bottom: 7.5rem;
    width: 87.5vw;
    margin: 2.5rem auto 0 auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.nineth {
    padding-bottom: 7.5rem;
    width: 87.5vw;
    margin: 2.5rem auto 0 auto;
  }
}
#aboutUs section.nineth .image {
  position: relative;
  width: 37.5vw;
  height: 24.7572815534vw;
  display: block;
  z-index: 2;
  margin: 0 auto;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.nineth .image {
    float: right;
    width: 62.5vw;
    height: 41.2621359223vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.nineth .image {
    float: right;
    width: 62.5vw;
    height: 41.2621359223vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.nineth .image {
    float: right;
    width: 62.5vw;
    height: 41.2621359223vw;
  }
}
#aboutUs section.nineth .image picture {
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
#aboutUs section.nineth .image picture img {
  width: 100%;
  height: auto;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#aboutUs section.nineth .text.mobile {
  position: relative;
  width: 100%;
  margin-top: 2.5rem;
  float: left;
  -webkit-transform: translateY(20vh);
  transform: translateY(20vh);
  opacity: 0;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.nineth .text.mobile {
    margin-top: 5rem;
    margin-left: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.nineth .text.mobile {
    margin-top: 5rem;
    margin-left: 6.25vw;
  }
}
#aboutUs section.nineth .text.mobile .wrp {
  position: relative;
  width: 100%;
}
#aboutUs section.nineth .text.mobile .wrp p {
  width: 100%;
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 0.9rem;
  line-height: 1.08rem;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.nineth .text.mobile .wrp p {
    font-size: 20px;
    line-height: 30px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.nineth .text.mobile .wrp p {
    font-size: 20px;
    line-height: 30px;
  }
}
#aboutUs section.tenth {
  padding-bottom: 15vh;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.tenth {
    padding-bottom: 5rem;
    width: 100%;
    margin: 0 auto;
  }
}
#aboutUs section.tenth .image {
  position: relative;
  width: 100vw;
  height: 66.69921875vw;
  display: block;
  z-index: 2;
  margin: 0 auto;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
}
#aboutUs section.tenth .image picture {
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
#aboutUs section.tenth .image picture img {
  width: 100%;
  height: auto;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.eleventh {
    position: relative;
    width: 87.5vw;
    margin: 0 auto;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.eleventh {
    padding-bottom: 10rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.eleventh {
    padding-bottom: 10rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.eleventh {
    padding-bottom: 10rem;
  }
}
#aboutUs section.eleventh .text {
  padding: 15vh 12.5vw 15vh 18.75vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  overflow: hidden;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.eleventh .text {
    padding: 0;
    margin-bottom: 1.25rem;
    overflow: visible;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #aboutUs section.eleventh .text {
    padding: 0 15.625vw 5rem 15.625vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.eleventh .text {
    padding: 0 15.625vw 5rem 15.625vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #aboutUs section.eleventh .text {
    padding: 0 15.625vw 5rem 15.625vw;
  }
}
#aboutUs section.eleventh .text .title h2 {
  line-height: 10vw;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10vw;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.eleventh .text .title h2 {
    font-size: 2.9rem;
  }
}
#aboutUs section.eleventh .clients {
  position: relative;
  width: 68.75vw;
  height: auto;
  margin: 0 15.625vw;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.eleventh .clients {
    width: 87.5vw;
    margin: 0 auto;
  }
}
#aboutUs section.eleventh .clients .client_logo {
  position: relative;
  width: 9.375vw;
  height: 9.375vw;
  margin-right: 2.5vw;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.eleventh .clients .client_logo {
    width: 20vw;
    height: 20vw;
    margin-right: 2.5vw;
  }
}
#aboutUs section.eleventh .clients .client_logo svg {
  fill: #fff;
  width: 100%;
  display: block;
}
#aboutUs section.eleventh .clients .client_logo:nth-of-type(6n+6) {
  margin-right: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.eleventh .clients .client_logo:nth-of-type(6n+6) {
    margin-right: 2.5vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #aboutUs section.eleventh .clients .client_logo:nth-of-type(4n+4) {
    margin-right: 0;
  }
}

#services {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
  background-color: var(--mainColor);
  /*img {
      visibility: hidden !important;
  }*/
}
#services section {
  position: relative;
  width: 100%;
  height: auto;
  float: left;
}
#services section.serviceItem .titles {
  position: relative;
  left: 12.5vw;
  z-index: 5;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #services section.serviceItem .titles {
    left: 6.25vw;
  }
}
#services section.serviceItem .titles h2 {
  position: relative;
  top: -3.5vw;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 7vw;
  -webkit-transform: translateX(-12.5vw);
  transform: translateX(-12.5vw);
  opacity: 0;
}
#services section.serviceItem .titles h2:last-of-type {
  margin-left: 6.25vw;
  -webkit-transform: translateX(12.5vw);
  transform: translateX(12.5vw);
  opacity: 0;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #services section.serviceItem .titles h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 12vw;
    line-height: 13vw;
    top: auto;
  }
}
#services section.serviceItem .text {
  position: relative;
  left: 12.5vw;
  width: 31.25vw;
  margin-top: 10vh;
  float: left;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#services section.serviceItem .text h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 2vw;
  margin-bottom: 2vh;
}
#services section.serviceItem .text p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 25px;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #services section.serviceItem .text {
    width: 87.5vw;
    left: auto;
    margin: 5vh 6.25vw 0 6.25vw;
  }
  #services section.serviceItem .text h3 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    margin-bottom: 2vh;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #services section.serviceItem .text {
    width: 50vw;
    left: 6.25vw;
  }
  #services section.serviceItem .text h3 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    margin-bottom: 2vh;
  }
}
#services section.serviceItem .list {
  position: relative;
  float: left;
  left: 31.25vw;
  margin-top: 10vh;
}
#services section.serviceItem .list ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
#services section.serviceItem .list ul li {
  position: relative;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 24px;
  line-height: 30px;
  margin-left: 10px;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#services section.serviceItem .list ul li:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -20px;
  height: 8px;
  width: 8px;
  border: 1px solid #fff;
  border-radius: 50%;
  float: left;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #services section.serviceItem .list {
    left: 6.25vw;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #services section.serviceItem .list {
    left: 12.5vw;
    width: 31.25vw;
  }
}
#services section.serviceItem[data-template=uno] {
  padding: 18.75vw 12.5vw 15vh 12.5vw;
  width: 75vw;
}
#services section.serviceItem[data-template=uno] .images {
  position: relative;
  width: 65.625vw;
  height: 37.5vw;
  display: block;
  z-index: 3;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
}
#services section.serviceItem[data-template=uno] .images picture {
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
#services section.serviceItem[data-template=uno] .images picture img {
  width: 100%;
  height: auto;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #services section.serviceItem[data-template=uno] .images {
    position: relative;
    width: 87.5vw;
    margin: 0 6.25vw 5vh 6.25vw;
    left: auto;
    top: auto;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #services section.serviceItem[data-template=uno] .images {
    position: relative;
    top: auto;
    left: 6.25vw;
    width: 62.5vw;
  }
}
#services section.serviceItem[data-template=due] {
  padding-bottom: 15vh;
}
#services section.serviceItem[data-template=due] .images {
  position: relative;
  height: auto;
  width: 100vw;
  height: 56.25vw;
  display: block;
  z-index: 5;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
}
#services section.serviceItem[data-template=due] .images picture {
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
#services section.serviceItem[data-template=due] .images picture img {
  width: 100%;
  height: auto;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #services section.serviceItem[data-template=due] .images {
    width: 87.5vw;
    margin: 0 6.25vw 5vh 6.25vw;
  }
}
#services section.serviceItem[data-template=tre] {
  padding-bottom: 15vh;
}
#services section.serviceItem[data-template=tre] .images {
  position: relative;
  height: 63.28125vw;
  width: 56.25vw;
  height: 37.4853515625vw;
  display: block;
  z-index: 5;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
}
#services section.serviceItem[data-template=tre] .images picture {
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
#services section.serviceItem[data-template=tre] .images picture img {
  width: 100%;
  height: auto;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#services section.serviceItem[data-template=tre] .images.snc {
  position: absolute;
  top: 10vh;
  right: 0;
}
#services section.serviceItem[data-order="4"] .titles h2:last-of-type {
  margin-left: 0;
}
#services section.serviceItem[data-template=quattro] {
  padding-bottom: 15vh;
}
#services section.serviceItem[data-template=quattro] .images {
  position: relative;
  width: 43.75vw;
  margin-left: 50vw;
  height: 58.3333333333vw;
  display: block;
  z-index: 5;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
}
#services section.serviceItem[data-template=quattro] .images picture {
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
#services section.serviceItem[data-template=quattro] .images picture img {
  width: 100%;
  height: auto;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #services section.serviceItem[data-template=quattro] .images {
    width: 87.5vw;
    height: auto;
    margin: 0 6.25vw 5vh 6.25vw;
  }
}
#services section.serviceItem[data-template=quattro] .text {
  margin-top: 20vh;
}
#services section.serviceItem[data-template=quattro] .list {
  margin-top: 20vh;
}

#contacts {
  position: relative;
  width: 100%;
  height: auto;
  z-index: 5;
}
#contacts img {
  width: 100%;
  display: block;
}
#contacts a {
  text-decoration: none;
}
#contacts .trans-opacity {
  opacity: 0;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
}
#contacts section {
  position: relative;
  width: 100%;
  height: auto;
  float: left;
  z-index: 3;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section {
    width: 87.5vw;
    margin: 0 auto;
    float: none;
  }
}
#contacts section.first {
  min-height: 100vh;
  padding-bottom: 30vh;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.first {
    width: 100vw;
    overflow: hidden;
    padding-bottom: 0;
    min-height: 0;
    min-height: initial;
    padding-top: 7.5rem;
    padding-bottom: 3.75rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #contacts section.first {
    padding-bottom: 0;
    min-height: 0;
    min-height: initial;
    overflow: hidden;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.first {
    padding-bottom: 0;
    min-height: 0;
    min-height: initial;
    overflow: hidden;
  }
}
#contacts section.first h1 {
  position: absolute;
  left: 18.75vw;
  top: 22vh;
  z-index: 3;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #contacts section.first h1 {
    top: 28vh;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.first h1 {
    position: relative;
    left: 0;
    top: 0;
    width: 87.5vw;
    margin: 0 auto;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #contacts section.first h1 {
    top: 15rem;
    left: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.first h1 {
    top: 15rem;
    left: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.first h1 {
    top: 20rem;
    left: 6.25vw;
  }
}
#contacts section.first h1 span {
  display: block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10vw;
  line-height: 10vw;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  -webkit-font-smoothing: antialiased;
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.first h1 span {
    font-size: 3.5rem;
    line-height: 3.5rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #contacts section.first h1 span {
    font-size: 10rem;
    line-height: 10rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.first h1 span {
    font-size: 10rem;
    line-height: 10rem;
  }
}
#contacts section.first h1 span:last-of-type {
  color: transparent;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10vw;
  -webkit-text-stroke: 2px var(--subColor);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.first h1 span:last-of-type {
    font-size: 3.5rem;
    line-height: 3.5rem;
    -webkit-text-stroke: 1px var(--subColor);
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #contacts section.first h1 span:last-of-type {
    font-size: 10rem;
    line-height: 10rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.first h1 span:last-of-type {
    font-size: 10rem;
    line-height: 10rem;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.first .circle__outer {
    position: absolute;
    width: 40vw;
    margin: 2.5rem auto 0 auto;
    top: 12vh;
    right: -10vw;
  }
}
#contacts section.first .circle {
  position: absolute;
  top: 70vh;
  right: -7.5vw;
  z-index: 1;
  opacity: 0;
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
  -webkit-animation-name: animation-rotation-dots;
          animation-name: animation-rotation-dots;
  -webkit-animation-duration: 30s;
          animation-duration: 30s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  width: 30vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.first .circle {
    position: relative;
    top: 0;
    left: 0;
    right: auto;
    width: 100%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #contacts section.first .circle {
    top: calc(10rem + 30.3333333333vw);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.first .circle {
    top: calc(10rem + 30.3333333333vw);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.first .circle {
    right: 5vw;
    width: 25vw;
  }
}
#contacts section.first .circle svg {
  width: 100%;
  display: block;
  height: auto;
  fill: var(--mainColorD10);
}
#contacts section.first .text-mobile {
  position: relative;
  width: 87.5vw;
  margin: 5rem auto 0 auto;
}
#contacts section.first .text-mobile h3 {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 2.7rem;
}
#contacts section.first .text-mobile .via {
  position: relative;
  margin-top: 2.5rem;
}
#contacts section.first .text-mobile .via p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 1.4rem;
}
#contacts section.first .text-mobile .via p.email a:after {
  position: absolute;
  content: "";
  top: calc(100% - 0.675rem);
  left: 0;
  height: 1px;
  width: 100%;
  background-color: #fff;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.first .text-mobile .via p.email a:after {
    top: 100%;
  }
}
#contacts section.first .text-mobile .via p a {
  position: relative;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 1.4rem;
}
#contacts section.first .text-mobile .phone {
  position: relative;
  margin-top: 2.5rem;
}
#contacts section.first .text-mobile .phone p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 1.7rem;
  line-height: 2.04rem;
}
#contacts section.first .image__outer {
  position: relative;
  margin-top: calc(15vh + 3vw);
  margin-left: 43.75vw;
  width: 46.875vw;
  height: 31.25vw;
  z-index: 2;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #contacts section.first .image__outer {
    margin-top: calc(21vh + 3vw);
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.first .image__outer {
    position: absolute;
    margin-top: 0;
    margin-left: 0;
    top: 12vh;
    left: auto;
    right: 6.25vw;
    width: 87.5vw;
    height: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #contacts section.first .image__outer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    width: 62.5vw;
    height: 41.6666666667vw;
    height: auto;
    margin-left: 31.25vw;
    margin-top: 16rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.first .image__outer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    width: 62.5vw;
    height: 41.6666666667vw;
    height: auto;
    margin-left: 31.25vw;
    margin-top: 16rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.first .image__outer {
    margin-top: 20rem;
    width: 62.5vw;
    height: 41.6666666667vw;
    margin-left: 18.75vw;
  }
}
#contacts section.first .image__outer .image__text {
  position: absolute;
  top: 100%;
  left: 0;
  -webkit-transform: translate(-40%, -6rem);
  transform: translate(-40%, -6rem);
  z-index: 3;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.first .image__outer .image__text {
    position: relative;
    margin-top: 5rem;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #contacts section.first .image__outer .image__text {
    position: relative;
    top: 0;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
    -webkit-transform: translate(-30%, -3.5rem);
    transform: translate(-30%, -3.5rem);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.first .image__outer .image__text {
    position: relative;
    top: 0;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
    -webkit-transform: translate(-30%, -3.5rem);
    transform: translate(-30%, -3.5rem);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.first .image__outer .image__text {
    -webkit-transform: translate(-10%, -3.5rem);
    transform: translate(-10%, -3.5rem);
  }
}
#contacts section.first .image__outer .image__text .text {
  position: relative;
}
#contacts section.first .image__outer .image__text .text h3 {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 9rem;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #contacts section.first .image__outer .image__text .text h3 {
    font-size: 7rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #contacts section.first .image__outer .image__text .text h3 {
    font-size: 5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.first .image__outer .image__text .text h3 {
    font-size: 5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.first .image__outer .image__text .text h3 {
    font-size: 6rem;
  }
}
#contacts section.first .image__outer .image__text .text .via {
  position: relative;
  margin-top: 2.5rem;
}
#contacts section.first .image__outer .image__text .text .via p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 2.8rem;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #contacts section.first .image__outer .image__text .text .via p {
    font-size: 2.4rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #contacts section.first .image__outer .image__text .text .via p {
    font-size: 2.2rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.first .image__outer .image__text .text .via p {
    font-size: 2.2rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.first .image__outer .image__text .text .via p {
    font-size: 2.2rem;
  }
}
#contacts section.first .image__outer .image__text .text .phone {
  position: relative;
  margin-top: 2.5rem;
}
#contacts section.first .image__outer .image__text .text .phone p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 3rem;
  line-height: 3.6rem;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #contacts section.first .image__outer .image__text .text .phone p {
    font-size: 2.6rem;
    line-height: 3.12rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #contacts section.first .image__outer .image__text .text .phone p {
    font-size: 2.6rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.first .image__outer .image__text .text .phone p {
    font-size: 2.6rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.first .image__outer .image__text .text .phone p {
    font-size: 2.6rem;
  }
}
#contacts section.first .image__outer .image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  background-color: var(--subColor);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.first .image__outer .image {
    position: relative;
    width: 60vw;
    height: 40vw;
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    -ms-flex-item-align: end;
        align-self: flex-end;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #contacts section.first .image__outer .image {
    position: relative;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.first .image__outer .image {
    position: relative;
  }
}
#contacts section.first .image__outer .image picture {
  width: 100%;
  height: auto;
}
#contacts section.first .image__outer .image picture img {
  width: 100%;
  height: auto;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#contacts section.second {
  text-align: center;
  padding: 10rem 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.second {
    padding: 5rem 0;
  }
}
#contacts section.second .second__wrapper {
  position: relative;
}
#contacts section.second .second__wrapper:hover .linkFoot span {
  clip-path: polygon(0% 100%, 100% 100%, 100% 0%, 0% 0%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 0%, 0% 0%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 0%, 0% 0%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 0%, 0% 0%);
  -webkit-transition: clip-path 0.5s ease-out 0s, -webkit-clip-path 0.5s ease-out 0s;
  transition: clip-path 0.5s ease-out 0s, -webkit-clip-path 0.5s ease-out 0s;
}
#contacts section.second .second__wrapper .linkFoot {
  position: relative;
  display: inline-block;
}
#contacts section.second .second__wrapper .linkFoot p {
  color: transparent;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 7.5vw;
  -webkit-text-stroke: 2px var(--subColor);
  text-decoration: none;
  -webkit-transition: color 0.35s ease-in-out 0s;
  transition: color 0.35s ease-in-out 0s;
  display: block;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.second .second__wrapper .linkFoot p {
    font-size: 1.9rem;
    line-height: 2.28rem;
    -webkit-text-stroke: 1px var(--subColor);
  }
}
#contacts section.second .second__wrapper .linkFoot span {
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 7.5vw;
  -webkit-transition: clip-path 0.5s ease-in 0s, -webkit-clip-path 0.5s ease-in 0s;
  transition: clip-path 0.5s ease-in 0s, -webkit-clip-path 0.5s ease-in 0s;
}
#contacts section.third {
  position: relative;
  padding-top: 10rem;
  height: 37.5vw;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #contacts section.third {
    height: auto;
    padding-top: 5rem;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.third {
    padding-top: 3.75rem;
    height: auto;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #contacts section.third {
    height: auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.third {
    height: auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.third {
    height: auto;
  }
}
#contacts section.third .section__wrapper {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
#contacts section.third .section__wrapper .section__image {
  position: relative;
  width: 25vw;
  -ms-flex-preferred-size: 25vw;
      flex-basis: 25vw;
  margin-left: 18.75vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.third .section__wrapper .section__image {
    position: absolute;
    width: 50vw;
    height: 75vw;
    -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
    margin-left: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #contacts section.third .section__wrapper .section__image {
    margin-left: 6.25vw;
    -ms-flex-preferred-size: 43.75vw;
        flex-basis: 43.75vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.third .section__wrapper .section__image {
    margin-left: 6.25vw;
    -ms-flex-preferred-size: 43.75vw;
        flex-basis: 43.75vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.third .section__wrapper .section__image {
    margin-left: 6.25vw;
    -ms-flex-preferred-size: 31.25vw;
        flex-basis: 31.25vw;
  }
}
#contacts section.third .section__wrapper .section__image .image {
  position: relative;
  width: 100%;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  background-color: var(--subColor);
}
#contacts section.third .section__wrapper .section__image .image picture {
  width: 100%;
  height: auto;
}
#contacts section.third .section__wrapper .section__image .image picture img {
  width: 100%;
  height: auto;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#contacts section.third .section__wrapper .section__text {
  margin-left: 6.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.third .section__wrapper .section__text {
    margin-left: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #contacts section.third .section__wrapper .section__text {
    margin-left: 0;
    -ms-flex-preferred-size: 37.5vw;
        flex-basis: 37.5vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.third .section__wrapper .section__text {
    margin-left: 0;
    -ms-flex-preferred-size: 37.5vw;
        flex-basis: 37.5vw;
  }
}
#contacts section.third .section__wrapper .section__text .title {
  margin-left: -12.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.third .section__wrapper .section__text .title {
    margin-left: 30vw;
    width: 57.5vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #contacts section.third .section__wrapper .section__text .title {
    margin-left: -2.5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.third .section__wrapper .section__text .title {
    margin-left: -2.5rem;
  }
}
#contacts section.third .section__wrapper .section__text .title h3 {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 7rem;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #contacts section.third .section__wrapper .section__text .title h3 {
    font-size: 5rem;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.third .section__wrapper .section__text .title h3 {
    font-size: 2.7rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #contacts section.third .section__wrapper .section__text .title h3 {
    font-size: 5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.third .section__wrapper .section__text .title h3 {
    font-size: 5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.third .section__wrapper .section__text .title h3 {
    font-size: 5rem;
  }
}
#contacts section.third .section__wrapper .section__text .content {
  position: relative;
  margin-top: 2.5rem;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.third .section__wrapper .section__text .content {
    margin-top: 8.75rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #contacts section.third .section__wrapper .section__text .content {
    margin-left: 2.5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.third .section__wrapper .section__text .content {
    margin-left: 2.5rem;
  }
}
#contacts section.third .section__wrapper .section__text .content p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 2.8rem;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #contacts section.third .section__wrapper .section__text .content p {
    font-size: 2.4rem;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.third .section__wrapper .section__text .content p {
    font-size: 1.4rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #contacts section.third .section__wrapper .section__text .content p {
    font-size: 2.2rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.third .section__wrapper .section__text .content p {
    font-size: 2.2rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.third .section__wrapper .section__text .content p {
    font-size: 2.2rem;
  }
}
#contacts section.third .section__wrapper .section__text .content a {
  position: relative;
  color: #fff;
}
#contacts section.third .section__wrapper .section__text .content a:after {
  position: absolute;
  content: "";
  top: calc(100% - 0.675rem);
  left: 0;
  height: 1px;
  width: 100%;
  background-color: #fff;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.third .section__wrapper .section__text .content a:after {
    top: 100%;
  }
}
#contacts section.fourth {
  position: relative;
  margin-left: 18.75vw;
  padding-top: 10rem;
  width: 68.75vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.fourth {
    margin: 0 auto;
    padding-top: 5rem;
    width: 87.5vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #contacts section.fourth {
    margin-left: 12.5vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.fourth {
    margin-left: 12.5vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.fourth {
    margin-left: 6.25vw;
  }
}
#contacts section.fourth .title {
  margin-bottom: 1.25rem;
}
#contacts section.fourth .title h3 {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 7rem;
  line-height: 7rem;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #contacts section.fourth .title h3 {
    font-size: 5rem;
    line-height: 5rem;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.fourth .title h3 {
    font-size: 2.7rem;
    line-height: 2.7rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #contacts section.fourth .title h3 {
    font-size: 5rem;
    line-height: 5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.fourth .title h3 {
    font-size: 5rem;
    line-height: 5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.fourth .title h3 {
    font-size: 5rem;
    line-height: 5rem;
  }
}
#contacts section.fourth .social {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
#contacts section.fourth .social p {
  position: relative;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 3.8rem;
  position: relative;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #contacts section.fourth .social p {
    font-size: 3.2rem;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.fourth .social p {
    font-size: 1.2rem;
    line-height: 1.44rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #contacts section.fourth .social p {
    font-size: 2.8rem;
    line-height: 2.8rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.fourth .social p {
    font-size: 2.8rem;
    line-height: 2.8rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.fourth .social p {
    font-size: 2.8rem;
    line-height: 2.8rem;
  }
}
#contacts section.fourth .social a {
  text-decoration: none;
  color: #fff;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.fourth .social a {
    font-size: 1.2rem;
    line-height: 1.44rem;
  }
}
#contacts section.fourth .social .divider {
  margin-left: 1.25rem;
  margin-right: 1.25rem;
}
#contacts section.fifth {
  position: relative;
  margin-top: 15rem;
  margin-bottom: 12.5rem;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.fifth {
    margin-top: 5rem;
    margin-bottom: 0;
    padding-bottom: 5rem;
  }
}
#contacts section.fifth .section__wrapper {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.fifth .section__wrapper {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
}
#contacts section.fifth .section__wrapper .copyright {
  position: relative;
  margin-right: 1.25rem;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.fifth .section__wrapper .copyright {
    margin-right: 0;
  }
}
#contacts section.fifth .section__wrapper .copyright h2 {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10vw;
  line-height: 10vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.fifth .section__wrapper .copyright h2 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 6rem;
    line-height: 6rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #contacts section.fifth .section__wrapper .copyright h2 {
    font-size: 10rem;
    line-height: 10rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.fifth .section__wrapper .copyright h2 {
    font-size: 10rem;
    line-height: 10rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.fifth .section__wrapper .copyright h2 {
    font-size: 10rem;
    line-height: 10rem;
  }
}
#contacts section.fifth .section__wrapper .legal {
  position: relative;
  margin-top: 1rem;
}
#contacts section.fifth .section__wrapper .legal p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 3.8rem;
  line-height: 3.8rem;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #contacts section.fifth .section__wrapper .legal p {
    font-size: 3.2rem;
    line-height: 3.2rem;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #contacts section.fifth .section__wrapper .legal p {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 2.3rem;
    line-height: 2.3rem;
    white-space: nowrap;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #contacts section.fifth .section__wrapper .legal p {
    font-size: 2.8rem;
    line-height: 2.8rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.fifth .section__wrapper .legal p {
    font-size: 2.8rem;
    line-height: 2.8rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #contacts section.fifth .section__wrapper .legal p {
    font-size: 2.8rem;
    line-height: 2.8rem;
  }
}
#contacts section.fifth .section__wrapper .legal a {
  color: #fff;
}

#awards {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
}
#awards section {
  position: relative;
  width: 100%;
  height: auto;
  float: left;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section {
    width: 87.5vw;
    margin: 0 auto;
    float: none;
  }
}
#awards section.first {
  min-height: 100vh;
  padding-bottom: 40vh;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #awards section.first {
    padding-bottom: 22vh;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.first {
    padding-bottom: 0;
    min-height: 0;
    min-height: initial;
    padding-top: 7.5rem;
    margin-bottom: 3.75rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #awards section.first {
    min-height: 0;
    min-height: initial;
    padding-bottom: 7.5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.first {
    min-height: 0;
    min-height: initial;
    padding-bottom: 7.5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.first {
    min-height: 0;
    min-height: initial;
    padding-bottom: 25rem;
  }
}
#awards section.first h1 {
  position: absolute;
  z-index: 3;
  position: relative;
  margin-left: 18.75vw;
  margin-top: 22vh;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #awards section.first h1 {
    margin-top: 28vh;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.first h1 {
    margin-left: 0;
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #awards section.first h1 {
    margin-left: 6.25vw;
    margin-top: 15rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.first h1 {
    margin-left: 6.25vw;
    margin-top: 15rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.first h1 {
    margin-left: 6.25vw;
    margin-top: 17.5rem;
  }
}
#awards section.first h1 span {
  display: block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10vw;
  line-height: 10vw;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  -webkit-font-smoothing: antialiased;
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.first h1 span {
    font-size: 3.5rem;
    line-height: 3.5rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #awards section.first h1 span {
    font-size: 10rem;
    line-height: 10rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.first h1 span {
    font-size: 10rem;
    line-height: 10rem;
  }
}
#awards section.first h1 span:last-of-type {
  color: transparent;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10vw;
  -webkit-text-stroke: 2px var(--subColor);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.first h1 span:last-of-type {
    font-size: 3.5rem;
    line-height: 3.5rem;
    -webkit-text-stroke: 1px var(--subColor);
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #awards section.first h1 span:last-of-type {
    font-size: 10rem;
    line-height: 10rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.first h1 span:last-of-type {
    font-size: 10rem;
    line-height: 10rem;
  }
}
#awards section.first .circle__outer h3 {
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.first .circle__outer {
    position: relative;
    width: 50vw;
    margin: 2.5rem auto 0 auto;
  }
}
#awards section.first .circle {
  position: absolute;
  top: 70vh;
  left: 50%;
  z-index: 1;
  opacity: 0;
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
  -webkit-animation-name: animation-rotation-dots;
          animation-name: animation-rotation-dots;
  -webkit-animation-duration: 30s;
          animation-duration: 30s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  width: 30vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.first .circle {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #awards section.first .circle {
    left: auto;
    right: 6.25vw;
    top: calc(10rem + 6 * 6.25vw);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.first .circle {
    left: auto;
    right: 6.25vw;
    top: calc(10rem + 6 * 6.25vw / 0.75);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.first .circle {
    left: auto;
    right: 6.25vw;
    top: calc(15rem + 37.5vw);
  }
}
#awards section.first .circle svg {
  width: 100%;
  display: block;
  height: auto;
  fill: var(--mainColorD10);
}
#awards section.first .texts {
  position: absolute;
  z-index: 5;
  position: relative;
  margin-top: 5rem;
  margin-left: 18.75vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.first .texts {
    margin-top: 6.5rem;
    margin-left: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #awards section.first .texts {
    margin-top: 5rem;
    margin-left: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.first .texts {
    margin-top: 5rem;
    margin-left: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.first .texts {
    margin-top: 5rem;
    margin-left: 6.25vw;
  }
}
#awards section.first .texts p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  line-height: 30px;
  width: 25vw;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.first .texts p {
    width: 100%;
    font-size: 0.9rem;
    line-height: 1.08rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #awards section.first .texts p {
    width: 40vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.first .texts p {
    width: 40vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.first .texts p {
    width: 40vw;
  }
}
#awards section.first .texts p:first-of-type {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 30px;
  line-height: 40px;
  margin-bottom: 5vh;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #awards section.first .texts p:first-of-type {
    font-size: 26px;
    line-height: 32px;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.first .texts p:first-of-type {
    font-size: 1.4rem;
    line-height: 1.68rem;
    margin-bottom: 2.5rem;
  }
}
#awards section.first .texts p:last-of-type {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  line-height: 30px;
}
#awards section.first .image {
  position: absolute;
  top: calc(15vh + 3vw);
  left: 56.25vw;
  width: 21.875vw;
  z-index: 2;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #awards section.first .image {
    top: calc(21vh + 3vw);
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.first .image {
    top: 10vh;
    left: auto;
    right: 4.375vw;
    width: 40vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #awards section.first .image {
    width: 37.5vw;
    left: auto;
    right: 12.5vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.first .image {
    width: 37.5vw;
    left: auto;
    right: 12.5vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.first .image {
    width: 34.375vw;
    left: auto;
    right: 21.875vw;
    top: 15rem;
  }
}
#awards section.first .image picture {
  width: 100%;
  height: auto;
}
#awards section.first .image picture img {
  width: 100%;
  height: auto;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#awards section.first h3 {
  position: absolute;
  top: calc(60vh + 13vw);
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20vw;
  display: block;
  line-height: 18vw;
  text-align: right;
  left: 56.25vw;
  z-index: 3;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.first h3 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    top: 50%;
    left: 50%;
    margin-top: -0.25rem;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #awards section.first h3 {
    left: auto;
    right: 12.5vw;
    top: calc(15rem + 6 * 6.25vw);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.first h3 {
    left: auto;
    right: 12.5vw;
    top: calc(15rem + 6 * 6.25vw / 0.75);
  }
}
#awards section.first h3 span {
  position: relative;
  display: inline-block;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#awards section.second {
  padding-bottom: 15vh;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.second {
    padding-bottom: 5rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #awards section.second {
    padding-bottom: 10rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.second {
    padding-bottom: 10rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.second {
    padding-bottom: 10rem;
  }
}
#awards section.second .table {
  position: relative;
  margin: 0 12.5vw;
  width: 75vw;
  overflow: hidden;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.second .table {
    width: 100%;
    margin: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #awards section.second .table {
    width: 87.5vw;
    margin: 0 auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.second .table {
    width: 87.5vw;
    margin: 0 auto;
  }
}
#awards section.second .table .head {
  position: relative;
  width: 100%;
  float: left;
  height: auto;
  overflow: hidden;
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  border-bottom: 1px solid #fff;
  padding: 20px 0;
  opacity: 0;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.second .table .head {
    border: none;
    padding-bottom: 0;
  }
}
#awards section.second .table .head .year {
  width: 18.75vw;
  text-align: left;
  float: left;
  margin-left: 3.125vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.second .table .head .year {
    margin-left: 0;
    width: 15.625vw;
  }
}
#awards section.second .table .head .project {
  width: 21.875vw;
  text-align: left;
  float: left;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.second .table .head .project {
    width: 31.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #awards section.second .table .head .project {
    width: 23vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.second .table .head .project {
    width: 23vw;
  }
}
#awards section.second .table .head .award {
  width: 31.25vw;
  text-align: left;
  float: left;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.second .table .head .award {
    width: 40.625vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.second .table .load-more__wrapper {
    position: relative;
    width: 100%;
    height: 0;
    overflow: hidden;
  }
}
#awards section.second .table .body {
  position: relative;
  width: 100%;
  float: left;
  height: auto;
  overflow: hidden;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  border-bottom: 1px solid #fff;
  padding: 1vw 0;
  line-height: 40px;
  opacity: 0;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #awards section.second .table .body {
    font-size: 18px;
    line-height: 36px;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.second .table .body {
    padding: 0.75rem 0;
    font-size: 16px;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.second .table .body.load-more {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
#awards section.second .table .body .year {
  width: 18.75vw;
  text-align: left;
  float: left;
  margin-left: 3.125vw;
  color: #fff;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.second .table .body .year {
    font-size: 16px;
    line-height: 22.4px;
    margin-left: 0;
    width: 15.625vw;
  }
}
#awards section.second .table .body .project {
  width: 21.875vw;
  text-align: left;
  float: left;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.second .table .body .project {
    font-size: 16px;
    line-height: 22.4px;
    width: 31.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #awards section.second .table .body .project {
    width: 23vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.second .table .body .project {
    width: 23vw;
  }
}
#awards section.second .table .body .award {
  width: 31.25vw;
  text-align: left;
  float: left;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #awards section.second .table .body .award {
    width: auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.second .table .body .award {
    width: auto;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.second .table .body .award {
    width: 40.625vw;
  }
}
#awards section.second .table .body .award img {
  position: relative;
  height: 40px;
  display: inline-block;
  width: auto;
  float: left;
}
#awards section.second .table .body .award span {
  position: relative;
  display: inline-block;
  float: left;
  margin-right: 3.125vw;
  color: #fff;
  width: 12.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.second .table .body .award span {
    margin-left: 0;
    font-size: 16px;
    line-height: 22.4px;
    width: 100%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #awards section.second .table .body .award span {
    width: 25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.second .table .body .award span {
    width: 25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.second .table .body .award span {
    width: 20vw;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #awards section.second .table .body {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 0.8rem;
    padding: 1rem 0;
  }
}
#awards section.second .btn-load-more {
  position: relative;
  margin: 2.5rem auto 0 auto;
  width: 40vw;
  height: 8vw;
  opacity: 0;
  -webkit-transform: translateY(30px);
  transform: translateY(30px);
}
#awards section.second .btn-load-more .btn-load-more__wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
#awards section.second .btn-load-more .btn-load-more__wrapper .btn-load-more__bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: var(--subColor);
}
#awards section.second .btn-load-more .btn-load-more__wrapper .btn-load-more__txt p {
  color: var(--mainColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 0.6rem;
  letter-spacing: 0.2rem;
  text-indent: 0.2rem;
}
#awards section.third {
  padding-bottom: 15vh;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.third {
    padding-bottom: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #awards section.third {
    padding-bottom: 10rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.third {
    padding-bottom: 10rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.third {
    padding-bottom: 10rem;
  }
}
#awards section.third .mentions {
  position: relative;
  margin: 0 12.5vw;
  width: 75vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.third .mentions {
    width: 100%;
    margin: 0;
  }
}
#awards section.third .mentions .item {
  position: relative;
  width: 33.3333333333%;
  float: left;
  text-align: center;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.third .mentions .item {
    float: none;
    width: 100%;
    margin-bottom: 3.75rem;
  }
}
#awards section.third .mentions .item .hidden {
  visibility: hidden;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.third .mentions .item .hidden {
    height: 0;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.third .mentions .item.item--kudos img {
    width: 38vw;
    margin-bottom: 1.25rem;
  }
}
#awards section.third .mentions .item img {
  height: 2vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.third .mentions .item img {
    height: auto;
    width: 30vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #awards section.third .mentions .item img {
    height: 6vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.third .mentions .item img {
    height: 6vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.third .mentions .item img {
    height: 6vw;
  }
}
#awards section.third .mentions .item h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  margin-top: 2.5rem;
  margin-bottom: 5rem;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.third .mentions .item h2 {
    margin: 0;
    font-size: 1.3rem;
  }
}
#awards section.third .mentions .item h3 {
  color: transparent;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.third .mentions .item h3 {
    font-size: 9rem;
    line-height: 9rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.third .mentions .item h3 {
    font-size: 9rem;
    line-height: 9rem;
  }
}
#awards section.third .mentions .item h3:after {
  content: attr(data-after);
  color: transparent;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
  position: relative;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.third .mentions .item h3:after {
    font-size: 9rem;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.third .mentions .item:last-of-type h2 {
    margin: 0;
  }
}
#awards section.fourth {
  margin-top: 5vw;
  padding-bottom: 5vh;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.fourth {
    margin-top: 5rem;
    padding-top: 2.5rem;
    padding-bottom: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #awards section.fourth {
    margin-top: 0;
    padding-bottom: 15rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.fourth {
    margin-top: 0;
    padding-bottom: 15rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.fourth {
    margin-top: 0;
    padding-bottom: 15rem;
  }
}
#awards section.fourth .awardsLogos {
  position: relative;
  margin: 0 auto;
  width: 43.75vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.fourth .awardsLogos {
    width: 100%;
    margin: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #awards section.fourth .awardsLogos {
    width: 62.5vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.fourth .awardsLogos {
    width: 62.5vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.fourth .awardsLogos {
    width: 53.125vw;
  }
}
#awards section.fourth .awardsLogos .row {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
  margin-bottom: 6.25vw;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #awards section.fourth .awardsLogos .row:last-of-type {
    margin-bottom: 0rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.fourth .awardsLogos .row:last-of-type {
    margin-bottom: 0rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.fourth .awardsLogos .row:last-of-type {
    margin-bottom: 0rem;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.fourth .awardsLogos .row {
    margin-bottom: 3.75rem;
  }
}
#awards section.fourth .awardsLogos .row .itm {
  position: relative;
  float: left;
  width: 6.25vw;
  margin-right: 12.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #awards section.fourth .awardsLogos .row .itm {
    width: 18%;
    margin-right: 23%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #awards section.fourth .awardsLogos .row .itm {
    width: 12.5vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.fourth .awardsLogos .row .itm {
    width: 12.5vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #awards section.fourth .awardsLogos .row .itm {
    width: 9.375vw;
  }
}
#awards section.fourth .awardsLogos .row .itm:nth-of-type(3n+3) {
  margin-right: 0;
}
#awards section.fourth .awardsLogos .row .itm img {
  position: relative;
  float: left;
  width: 100%;
}
#awards section.fourth .awardsLogos .row .itm img.smaller {
  width: 50%;
  margin: 0 25%;
}

#career {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
}
#career a {
  text-decoration: none;
}
#career .submit-career {
  position: relative;
  width: 6.25vw;
  height: 6.25vw;
  margin-top: 2.5rem;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #career .submit-career {
    width: 25vw;
    height: 25vw;
  }
}
#career .submit-career:hover .submit__image .svg-plane {
  -webkit-transform: scale(0);
  transform: scale(0);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #career .submit-career:hover .submit__image .svg-plane {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #career .submit-career:hover .submit__image .svg-plane {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #career .submit-career:hover .submit__image .svg-plane {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #career .submit-career:hover .submit__image .svg-plane {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
#career .submit-career .submit__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--subColor);
  border-radius: 50%;
}
#career .submit-career .submit__image {
  position: absolute;
  width: 30px;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
#career .submit-career .submit__image .svg-plane {
  fill: #fff;
  -webkit-transform-origin: center center;
          transform-origin: center center;
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: all 0.2s linear 0s;
  transition: all 0.2s linear 0s;
}
#career section {
  position: relative;
  width: 100%;
  height: auto;
  float: left;
}
#career section.first {
  min-height: 100vh;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #career section.first {
    min-height: 0;
    min-height: initial;
    padding-top: calc(10vh + 2rem);
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #career section.first {
    min-height: 0;
    min-height: initial;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #career section.first {
    min-height: 0;
    min-height: initial;
  }
}
#career section.first h1 {
  z-index: 3;
  position: relative;
  margin-left: 18.75vw;
  margin-top: 22vh;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #career section.first h1 {
    margin-top: 28vh;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #career section.first h1 {
    position: relative;
    top: 3rem;
    left: auto;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 6.25vw;
    width: 87.5vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #career section.first h1 {
    margin-top: 15rem;
    margin-left: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #career section.first h1 {
    margin-top: 15rem;
    margin-left: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #career section.first h1 {
    margin-top: 17.5rem;
    margin-left: 6.25vw;
  }
}
#career section.first h1 span {
  display: block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10vw;
  line-height: 10vw;
  -webkit-font-smoothing: antialiased;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #career section.first h1 span {
    font-size: 3.5rem;
    line-height: 3.5rem;
  }
}
#career section.first h1 span:last-of-type {
  color: transparent;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10vw;
  -webkit-text-stroke: 2px var(--subColor);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #career section.first h1 span:last-of-type {
    font-size: 3.5rem;
    line-height: 3.5rem;
    -webkit-text-stroke: 1px var(--subColor);
  }
}
#career section.first .desc {
  width: 50vw;
  z-index: 3;
  position: relative;
  margin-top: 6vh;
  margin-left: 18.75vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #career section.first .desc {
    position: relative;
    top: 0;
    left: 0;
    margin-left: 6.25vw;
    width: 87.5vw;
    margin-top: 10rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #career section.first .desc {
    margin-top: 5rem;
    margin-left: 6.25vw;
    width: 50vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #career section.first .desc {
    margin-top: 5rem;
    margin-left: 6.25vw;
    width: 50vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #career section.first .desc {
    margin-left: 6.25vw;
    width: 62.5vw;
  }
}
#career section.first .desc p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  line-height: 30px;
  width: 25vw;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #career section.first .desc p {
    width: 38vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #career section.first .desc p {
    width: 100%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #career section.first .desc p {
    width: 100%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #career section.first .desc p {
    width: 100%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #career section.first .desc p {
    width: 100%;
  }
}
#career section.first .desc p:first-of-type {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 30px;
  line-height: 40px;
  margin-bottom: 5vh;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #career section.first .desc p:first-of-type {
    font-size: 26px;
    line-height: 32px;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #career section.first .desc p:first-of-type {
    font-size: 1.4rem;
    line-height: 1.68rem;
  }
}
#career section.first .desc p span {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 30px;
  line-height: 40px;
}
#career section.first .circle {
  position: absolute;
  top: 37vh;
  left: 62%;
  z-index: 1;
  opacity: 0;
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
  -webkit-animation-name: animation-rotation-dots;
          animation-name: animation-rotation-dots;
  -webkit-animation-duration: 30s;
          animation-duration: 30s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  width: 30vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #career section.first .circle {
    width: 45vw;
    top: 22vh;
    left: auto;
    right: 3.125vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #career section.first .circle {
    top: calc(42.6vw + 10rem);
    left: auto;
    right: 3.125vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #career section.first .circle {
    top: calc(42.6vw + 10rem);
    left: auto;
    right: 3.125vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #career section.first .circle {
    top: calc(15vh + 3vw + 28.4vw);
    left: auto;
    right: 3.125vw;
  }
}
#career section.first .circle svg {
  width: 100%;
  display: block;
  height: auto;
  fill: #e54f50;
}
#career section.first .career-slider {
  position: absolute;
  top: calc(15vh + 3vw);
  left: 56.25vw;
  width: 21.875vw;
  z-index: 2;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #career section.first .career-slider {
    top: calc(21vh + 3vw);
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #career section.first .career-slider {
    top: 10vh;
    width: 40vw;
    left: auto;
    right: 10.625vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #career section.first .career-slider {
    top: 10rem;
    width: 45vw;
    left: auto;
    right: 10.625vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #career section.first .career-slider {
    top: 10rem;
    width: 45vw;
    left: auto;
    right: 10.625vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #career section.first .career-slider {
    width: 37.5vw;
    left: auto;
    right: 15.625vw;
  }
}
#career section.first .career-slider .slider__wrapper {
  position: relative;
  width: 100%;
  height: 100%;
}
#career section.first .career-slider .slider__wrapper .slider__container {
  position: relative;
  width: 100%;
  height: 31.0625vw;
  overflow: hidden;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #career section.first .career-slider .slider__wrapper .slider__container {
    height: 56.8vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #career section.first .career-slider .slider__wrapper .slider__container {
    height: 63.9vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #career section.first .career-slider .slider__wrapper .slider__container {
    height: 63.9vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #career section.first .career-slider .slider__wrapper .slider__container {
    height: 53.25vw;
  }
}
#career section.first .career-slider .slider__wrapper .slider__container .slide {
  position: absolute;
  right: 0;
  width: 100%;
  height: 31.0625vw;
  z-index: 31;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #career section.first .career-slider .slider__wrapper .slider__container .slide {
    height: 56.8vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #career section.first .career-slider .slider__wrapper .slider__container .slide {
    height: 63.9vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #career section.first .career-slider .slider__wrapper .slider__container .slide {
    height: 63.9vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #career section.first .career-slider .slider__wrapper .slider__container .slide {
    height: 53.25vw;
  }
}
#career section.first .career-slider .slider__wrapper .slider__container .slide.slide--center {
  z-index: 51;
}
#career section.first .career-slider .slider__wrapper .slider__container .slide.slide--center .slide__wrapper {
  left: 0;
  right: auto;
  width: 100%;
  height: 100%;
}
#career section.first .career-slider .slider__wrapper .slider__container .slide.slide--center .slide__wrapper .slide__container {
  left: 0;
  right: auto;
}
#career section.first .career-slider .slider__wrapper .slider__container .slide.slide--center .slide__wrapper .slide__container .slide__inner {
  -webkit-transform: scale(1);
  transform: scale(1);
}
#career section.first .career-slider .slider__wrapper .slider__container .slide .slide__wrapper {
  position: absolute;
  width: 100%;
  height: 0%;
  right: 0;
  top: 0;
  overflow: hidden;
}
#career section.first .career-slider .slider__wrapper .slider__container .slide .slide__wrapper .slide__container {
  position: absolute;
  width: 21.875vw;
  height: 31.0625vw;
  right: 0;
  top: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #career section.first .career-slider .slider__wrapper .slider__container .slide .slide__wrapper .slide__container {
    width: 40vw;
    height: 56.8vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #career section.first .career-slider .slider__wrapper .slider__container .slide .slide__wrapper .slide__container {
    width: 45vw;
    height: 63.9vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #career section.first .career-slider .slider__wrapper .slider__container .slide .slide__wrapper .slide__container {
    width: 45vw;
    height: 63.9vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #career section.first .career-slider .slider__wrapper .slider__container .slide .slide__wrapper .slide__container {
    width: 37.5vw;
    height: 53.25vw;
  }
}
#career section.first .career-slider .slider__wrapper .slider__container .slide .slide__wrapper .slide__container .slide__inner {
  -webkit-transform: scale(1.2);
  transform: scale(1.2);
}
#career section.first .career-slider .slider__wrapper .slider__container .slide .slide__wrapper .slide__container .slide__inner img {
  width: 100%;
}
#career section.first .image {
  position: absolute;
  top: calc(15vh + 3vw);
  left: 56.25vw;
  width: 21.875vw;
  z-index: 2;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
  /*opacity: 0;
  visibility: hidden;*/
}
#career section.first .image picture {
  width: 100%;
  height: auto;
}
#career section.first .image picture img {
  width: 100%;
  height: auto;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#career section.second {
  min-height: 85vh;
  padding-top: 10vh;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #career section.second {
    margin-top: 0;
    min-height: 0;
    min-height: initial;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #career section.second {
    padding-top: 10rem;
    padding-bottom: 10rem;
    min-height: 0;
    min-height: initial;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #career section.second {
    padding-top: 10rem;
    padding-bottom: 10rem;
    min-height: 0;
    min-height: initial;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #career section.second {
    padding-top: 10rem;
    padding-bottom: 10rem;
    min-height: 0;
    min-height: initial;
  }
}
#career section.second .careerMarquee {
  position: relative;
  margin-bottom: 20vh;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #career section.second .careerMarquee {
    margin-bottom: 5rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #career section.second .careerMarquee {
    margin-bottom: 12.5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #career section.second .careerMarquee {
    margin-bottom: 12.5rem;
  }
}
#career section.second .careerMarquee .one {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-transform: translateX(-20%);
  transform: translateX(-20%);
}
#career section.second .careerMarquee .one h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  -webkit-font-smoothing: antialiased;
  line-height: 8vw;
  white-space: nowrap;
}
#career section.second .title {
  position: relative;
  width: 100%;
  height: auto;
  padding-left: 18.75vw;
  margin-bottom: 5vh;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #career section.second .title {
    padding-left: 0;
    margin-left: 6.25vw;
    width: 87.5vw;
    margin-bottom: 1.25rem;
  }
}
#career section.second .title h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  margin: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #career section.second .title h2 {
    font-size: 1.9rem;
  }
}
#career section.second .form {
  position: relative;
  width: 51.5625vw;
  height: auto;
  padding: 0 18.75vw;
  overflow: visible;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #career section.second .form {
    width: 87.5vw;
    padding: 0;
    margin: 0 auto;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #career section.second .form {
    width: 62.5vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #career section.second .form {
    width: 62.5vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #career section.second .form {
    width: 62.5vw;
    padding: 0;
    margin: 0 auto;
  }
}
#career section.second .form form {
  z-index: 2;
}
#career section.second .form .response {
  position: absolute;
  top: 0;
  left: 18.75vw;
  z-index: 1;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#career section.second .form .response h3 {
  color: transparent;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 4vw;
  -webkit-text-stroke: 2px var(--subColor);
  line-height: 4vw;
  -webkit-font-smoothing: antialiased;
}

#job {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
}
#job section {
  position: relative;
  width: 100%;
  height: auto;
  float: left;
}
#job section.first {
  min-height: 100vh;
  padding-bottom: 15vh;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #job section.first {
    min-height: auto;
    padding-top: calc(60px + 3*6.25vw);
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #job section.first {
    min-height: 0;
  }
}
#job section.first .title {
  position: relative;
  margin-left: 18.75vw;
  margin-top: calc(50vh - 8vw);
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #job section.first .title {
    margin-top: 0;
    margin-left: 6.25vw;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #job section.first .title {
    margin-left: 12.5vw;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #job section.first .title {
    margin-top: 40vh;
    margin-bottom: 5vh;
    margin-left: 6.25vw;
  }
}
#job section.first .title h1 {
  z-index: 3;
}
#job section.first .title h1 span {
  display: block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  -webkit-font-smoothing: antialiased;
}
#job section.first .title h1 span:last-of-type {
  color: transparent;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  -webkit-text-stroke: 2px var(--subColor);
}
#job section.first .title h1 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  z-index: 3;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #job section.first .title h1 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 12vw;
    line-height: 13vw;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #job section.first .title h1 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 12vw;
    line-height: 13vw;
  }
}
#job section.first .informations {
  position: relative;
  margin-top: 5vw;
  margin-left: 18.75vw;
  overflow: hidden;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #job section.first .informations {
    margin-top: 5vh;
    margin-left: 6.25vw;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #job section.first .informations {
    margin-left: 12.5vw;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #job section.first .informations {
    margin-left: 6.25vw;
  }
}
#job section.first .informations p {
  position: relative;
  float: left;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 25px;
  width: 37.5vw;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #job section.first .informations p {
    width: 87.5vw;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #job section.first .informations p {
    width: 56.25vw;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #job section.first .informations p {
    width: 62.5vw;
  }
}
#job section.first .informations .tabs {
  position: relative;
  float: left;
  margin-left: 6.25vw;
  width: 18.75vw;
}
#job section.first .informations .tabs .el {
  position: relative;
  width: auto;
}
#job section.first .informations .tabs .el h3 {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10px;
  text-transform: uppercase;
  margin-bottom: 5px;
  letter-spacing: 2px;
  -webkit-font-smoothing: antialiased;
}
#job section.first .informations .tabs .el span {
  display: block;
  margin-bottom: 20px;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #job section.first .informations .tabs {
    width: 87.5vw;
    margin: 5vh 0 0 0;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #job section.first .informations .tabs {
    width: 25vw;
  }
}
#job section.first .skills {
  position: relative;
  margin-top: 15vh;
  margin-left: 12.5vw;
  overflow: hidden;
  width: 75vw;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #job section.first .skills {
    margin-left: 6.25vw;
    width: 87.5vw;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #job section.first .skills {
    margin-left: 6.25vw;
    width: 87.5vw;
  }
}
#job section.first .skills h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 1.5vw;
  margin: 0 0 5vh 6.25vw;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #job section.first .skills h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    margin: 0 0 5vh 0;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #job section.first .skills h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    margin: 5vw 0;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #job section.first .skills h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    margin: 0 0 5vh 0;
  }
}
#job section.first .skills .row {
  position: relative;
  float: left;
  width: 62.5vw;
  height: auto;
  border-bottom: 1px solid #fff;
  overflow: hidden;
  padding: 2vw 6.25vw;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #job section.first .skills .row {
    width: 87.5vw;
    padding: 20px 0;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #job section.first .skills .row {
    width: 75vw;
    padding: 20px 0;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #job section.first .skills .row {
    width: 87.5vw;
    padding: 20px 0;
  }
}
#job section.first .skills .row:last-of-type {
  border-bottom: none;
}
#job section.first .skills .row .titleSkill {
  position: relative;
  float: left;
  width: 18.75vw;
}
#job section.first .skills .row .titleSkill h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #job section.first .skills .row .titleSkill {
    width: 100%;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #job section.first .skills .row .titleSkill {
    width: 25vw;
  }
}
#job section.first .skills .row .textSkill {
  position: relative;
  float: left;
  width: 25vw;
}
#job section.first .skills .row .textSkill p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #job section.first .skills .row .textSkill {
    width: 100%;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #job section.first .skills .row .textSkill {
    width: calc(9*6.25vw - 90px);
    padding-left: 3.125vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #job section.first .skills .row .textSkill {
    width: 43.75vw;
  }
}
#job section.first .skills .row .valutationSkill {
  position: relative;
  float: left;
  width: 18.75vw;
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #job section.first .skills .row .valutationSkill {
    width: 90px;
  }
}
#job section.first .skills .row .valutationSkill .element {
  position: relative;
  float: right;
}
#job section.first .skills .row .valutationSkill span {
  width: 1vw;
  height: 1vw;
  display: inline-block;
  margin-right: 0.4vw;
  border-radius: 50%;
  border: 1px solid #fff;
}
#job section.first .skills .row .valutationSkill span.full {
  background-color: #fff;
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #job section.first .skills .row .valutationSkill span {
    width: 10px;
    height: 10px;
    margin-right: 5px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #job section.first .skills .row .valutationSkill {
    width: 100%;
    margin: 10px 0;
  }
  #job section.first .skills .row .valutationSkill .element {
    float: left;
  }
  #job section.first .skills .row .valutationSkill span {
    width: 10px;
    height: 10px;
    display: inline-block;
    margin-right: 5px;
    border-radius: 50%;
    border: 1px solid #fff;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #job section.first .skills .row .valutationSkill .element {
    float: left;
  }
  #job section.first .skills .row .valutationSkill span {
    width: 10px;
    height: 10px;
    display: inline-block;
    margin-right: 5px;
    border-radius: 50%;
    border: 1px solid #fff;
  }
}
#job section.second {
  min-height: 85vh;
  padding-bottom: 15vh;
  margin-top: 15vh;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #job section.second {
    margin-top: 0;
    min-height: auto;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #job section.second {
    margin-top: 0;
    min-height: 0;
  }
}
#job section.second .title {
  position: relative;
  width: 100%;
  height: auto;
  padding-left: 18.75vw;
  margin-bottom: 5vh;
}
#job section.second .title h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  margin: 0;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #job section.second .title {
    padding-left: 6.25vw;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #job section.second .title {
    padding-left: 12.5vw;
    margin-bottom: 5vw;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #job section.second .title {
    padding-left: 6.25vw;
    margin-bottom: 5vh;
  }
}
#job section.second .form {
  position: relative;
  width: 51.5625vw;
  height: auto;
  padding: 0 18.75vw;
  overflow: visible;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
#job section.second .form form {
  z-index: 2;
}
#job section.second .form .response {
  position: absolute;
  top: 0;
  left: 18.75vw;
  z-index: 1;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#job section.second .form .response h3 {
  color: transparent;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 4vw;
  -webkit-text-stroke: 2px var(--subColor);
  line-height: 4vw;
  -webkit-font-smoothing: antialiased;
}

#relatedProjects {
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 10px;
  height: 10px;
  /*width: 100%;
  height: 100vh;*/
  z-index: 15;
  opacity: 0;
  visibility: hidden;
}
#relatedProjects .projectRel {
  position: relative;
  width: auto;
  height: 100%;
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
}
#relatedProjects .projectRel .projectRail {
  position: relative;
}
#relatedProjects .projectRel .projectRail .railItem {
  position: absolute;
  top: 0;
  width: 100vw;
  height: 100vh;
  opacity: 0;
  visibility: hidden;
  background-size: cover;
  background-repeat: no-repeat;
}
#relatedProjects .projectRel .projectRail .railItem h2 {
  position: absolute;
  bottom: 0;
  left: 2vw;
  -webkit-transform: translateY(45%);
  transform: translateY(45%);
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10vw;
}
#relatedProjects .projectRel .projectRail .railItem h2 span {
  position: relative;
  float: left;
  opacity: 0;
  visibility: hidden;
  -webkit-transform: translateX(5vw) scale(1.3);
  transform: translateX(5vw) scale(1.3);
}
#relatedProjects #linkRelPro {
  position: absolute;
  bottom: 25vh;
  right: 30vw;
  -webkit-transform: translateY(50%);
  transform: translateY(50%);
  z-index: 5;
  visibility: hidden;
  opacity: 0;
}
#relatedProjects #linkRelPro a {
  position: relative;
  width: 180px;
  height: 45px;
  overflow: hidden;
  border-radius: 5vw;
  cursor: pointer;
  display: block;
}
#relatedProjects #linkRelPro a img {
  position: absolute;
  top: 15px;
  left: 15px;
  width: 15px;
  height: 15px;
}
#relatedProjects #linkRelPro a p {
  position: absolute;
  top: 50%;
  right: 30px;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  margin: 0;
}
#relatedProjects #linkRelPro a p span {
  position: relative;
  float: left;
}
#relatedProjects #proDragger {
  position: absolute;
  bottom: 12.5vh;
  left: 12.5vw;
  width: 75vw;
  height: 10px;
  -webkit-transform: translateY(50%);
  transform: translateY(50%);
  background-color: transparent;
  visibility: hidden;
  opacity: 0;
}
#relatedProjects #proDragger .bar {
  position: absolute;
  top: 4px;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: rgba(0, 0, 0, 0.3);
}
#relatedProjects #proDragger .red-bar {
  width: 40px;
  height: 10px;
  background-color: #000;
}
#relatedProjects #proDragger .markers {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: auto;
}
#relatedProjects #proDragger .markers span {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 1px;
  height: 15px;
  background-color: rgba(0, 0, 0, 0.3);
}
#relatedProjects #closeRelPro {
  position: absolute;
  top: 25vh;
  left: 75vw;
  z-index: 2;
  width: 4.375vw;
  height: 4.375vw;
  border-radius: 50%;
  text-align: center;
  background-color: var(--subColor);
  cursor: pointer;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
#relatedProjects #closeRelPro span {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  text-transform: uppercase;
  line-height: 4.375vw;
}

#customerPage {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
}
#customerPage section {
  position: relative;
  width: 100%;
  height: auto;
  float: left;
}
#customerPage section.first {
  min-height: 100vh;
  padding-bottom: 15vh;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #customerPage section.first {
    min-height: 0;
    padding-top: calc(60px + 3*6.25vw);
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #customerPage section.first {
    padding-top: calc(60px + 6.25vw);
  }
}
#customerPage section.first .breadCrumb {
  position: relative;
  margin-left: 18.75vw;
  margin-top: calc(50vh - 8vw);
  overflow: hidden;
}
#customerPage section.first .breadCrumb a {
  position: relative;
  float: left;
  display: inline-block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 14px;
  line-height: 16px;
  text-decoration: none;
}
#customerPage section.first .breadCrumb p {
  position: relative;
  float: left;
  display: inline-block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 14px;
  line-height: 16px;
}
#customerPage section.first .breadCrumb span {
  position: relative;
  float: left;
  display: inline-block;
  width: 10px;
  height: 10px;
  margin: 3px 10px;
}
#customerPage section.first .breadCrumb span img {
  position: relative;
  width: 100%;
  margin: 0;
  display: block;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #customerPage section.first .breadCrumb {
    position: relative;
    overflow: hidden;
    width: 87.5vw;
    left: 6.25vw;
    top: auto;
    margin-bottom: 2vh;
    margin-left: 0;
    margin-top: 0;
  }
  #customerPage section.first .breadCrumb a {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 20px;
  }
  #customerPage section.first .breadCrumb p {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 20px;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #customerPage section.first .breadCrumb {
    position: relative;
    overflow: hidden;
    width: 75vw;
    left: 12.5vw;
    top: auto;
    margin: 0 0 2vh 0;
  }
  #customerPage section.first .breadCrumb a {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 20px;
  }
  #customerPage section.first .breadCrumb p {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 20px;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #customerPage section.first .breadCrumb {
    position: relative;
    overflow: hidden;
    width: 87.5vw;
    left: 6.25vw;
    top: auto;
    margin-bottom: 2vh;
    margin-left: 0;
    margin-top: 40vh;
  }
  #customerPage section.first .breadCrumb a {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 20px;
  }
  #customerPage section.first .breadCrumb p {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 20px;
  }
}
#customerPage section.first .text {
  position: relative;
  margin-left: 18.75vw;
  margin-top: 10px;
  margin-bottom: 15vh;
  width: 68.75vw;
  overflow: hidden;
}
#customerPage section.first .text h1 {
  position: relative;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  z-index: 3;
  margin: 0 0 10vh 0;
}
#customerPage section.first .text p {
  position: relative;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 25px;
  width: 43.75vw;
  float: left;
}
#customerPage section.first .text ul {
  position: relative;
  float: left;
  width: 12.5vw;
  margin: 0 0 0 12.5vw;
  padding: 0;
  list-style: none;
}
#customerPage section.first .text ul li {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 25px;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #customerPage section.first .text {
    margin-left: 6.25vw;
    margin-top: 0;
    margin-bottom: 0;
    width: 87.5vw;
  }
  #customerPage section.first .text h1 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 12vw;
    line-height: 12vw;
    margin: 0 0 5vh 0;
  }
  #customerPage section.first .text p {
    width: 87.5vw;
  }
  #customerPage section.first .text ul {
    width: 87.5vw;
    margin: 5vh 0 0 0;
  }
  #customerPage section.first .text ul li {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 16px;
  }
  #customerPage section.first .text img {
    position: relative;
    width: 87.5vw;
    margin: 0 6.25vw 5vh 0;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #customerPage section.first .text {
    margin-left: 12.5vw;
    margin-top: 0;
    margin-bottom: 0;
    width: 75vw;
  }
  #customerPage section.first .text h1 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 12vw;
    line-height: 12vw;
    margin: 0 0 5vh 0;
  }
  #customerPage section.first .text p {
    width: 75vw;
  }
  #customerPage section.first .text ul {
    width: 75vw;
    margin: 5vh 0 0 0;
  }
  #customerPage section.first .text ul li {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 16px;
  }
  #customerPage section.first .text img {
    position: relative;
    width: 75vw;
    margin: 0 12.5vw 5vh 0;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #customerPage section.first .text {
    margin-left: 6.25vw;
    margin-top: 0;
    margin-bottom: 0;
    width: 87.5vw;
  }
  #customerPage section.first .text h1 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 12vw;
    line-height: 12vw;
    margin: 0 0 5vh 0;
  }
  #customerPage section.first .text p {
    width: 87.5vw;
  }
  #customerPage section.first .text ul {
    width: 87.5vw;
    margin: 5vh 0 0 0;
  }
  #customerPage section.first .text ul li {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 16px;
  }
  #customerPage section.first .text img {
    position: relative;
    width: 87.5vw;
    margin: 0 6.25vw 5vh 0;
  }
}
#customerPage section.first img {
  position: relative;
  width: 75vw;
  margin: 0 12.5vw;
  display: block;
}
#customerPage section.first .relatedProButton {
  position: absolute;
  top: 30vh;
  right: 18.75vw;
  -webkit-transform: translateX(50%);
  transform: translateX(50%);
  z-index: 6;
  width: 6.25vw;
  height: 6.25vw;
}
#customerPage section.first .relatedProButton .bg {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  cursor: pointer;
}
#customerPage section.first .relatedProButton #continue2 {
  position: absolute;
  top: -0.5vw;
  left: -0.5vw;
  width: calc(100% + 1vw);
  height: calc(100% + 1vw);
}
#customerPage section.first .relatedProButton #continue2 circle {
  -webkit-transform: rotate(-90deg);
          transform: rotate(-90deg);
  -webkit-transform-origin: center;
          transform-origin: center;
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  cx: 3.625vw;
  cy: 3.625vw;
}
#customerPage section.first .relatedProButton #continue2 circle.active {
  -webkit-animation-name: circle-chart-fill;
          animation-name: circle-chart-fill;
  -webkit-animation-duration: 3s;
          animation-duration: 3s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  stroke-dasharray: 1000;
  stroke-dashoffset: 0;
}
#customerPage section.first .relatedProButton #dotted2 {
  position: absolute;
  top: -0.5vw;
  left: -0.5vw;
  width: calc(100% + 1vw);
  height: calc(100% + 1vw);
}
#customerPage section.first .relatedProButton #dotted2 circle {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transform-origin: center;
          transform-origin: center;
  stroke-dasharray: 1 3;
  stroke-dashoffset: 5;
  stroke-linecap: round;
  cx: 3.625vw;
  cy: 3.625vw;
  stroke: #fff;
}
#customerPage section.first .relatedProButton:hover #dotted2 circle {
  -webkit-animation-name: animation-rotation-dots;
          animation-name: animation-rotation-dots;
  -webkit-animation-duration: 20s;
          animation-duration: 20s;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
#customerPage section.first .relatedProButton .count {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 33.3333333333%;
  height: auto;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  cursor: pointer;
}
#customerPage section.first .relatedProButton .count svg {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#customerPage section.first .relatedProButton .count svg path {
  fill: #fff;
}
#customerPage section.first .relatedProButton .count svg path#extCircle {
  opacity: 0;
}
#customerPage section.first .relatedProButton .count svg path#inCircle {
  opacity: 0;
}
#customerPage section.first .relatedProButton .count .visible {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#customerPage section.first .relatedProButton .count:hover svg {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#customerPage section.first .relatedProButton .count:hover svg path#inCircle {
  -webkit-animation-name: inner-circle-ani;
          animation-name: inner-circle-ani;
  -webkit-animation-duration: 1.5s;
          animation-duration: 1.5s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
#customerPage section.first .relatedProButton .count:hover svg path#extCircle {
  -webkit-animation-name: ext-circle-ani;
          animation-name: ext-circle-ani;
  -webkit-animation-duration: 1.5s;
          animation-duration: 1.5s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
#customerPage section.first .relatedProButton .count:hover .visible {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #customerPage section.first .relatedProButton {
    display: none;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #customerPage section.first .relatedProButton {
    display: none;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #customerPage section.first .relatedProButton {
    display: none;
  }
}
#customerPage section.sectionImage[data-type="1"] picture img {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #customerPage section.sectionImage[data-type="1"] picture img {
    width: 87.5vw;
    margin: 0 6.25vw;
  }
}
#customerPage section.sectionImage[data-type="2"] picture {
  position: relative;
  display: block;
  width: 75vw;
  margin: 0 12.5vw;
}
#customerPage section.sectionImage[data-type="2"] picture img {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #customerPage section.sectionImage[data-type="2"] picture {
    width: 87.5vw;
    margin: 0 6.25vw;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #customerPage section.sectionImage[data-type="2"] picture {
    width: 87.5vw;
    margin: 0 6.25vw;
  }
}
#customerPage section.sectionImage[data-type="3"] picture {
  position: relative;
  display: block;
  width: 50vw;
  margin: 0 37.5vw 0 12.5vw;
}
#customerPage section.sectionImage[data-type="3"] picture img {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #customerPage section.sectionImage[data-type="3"] picture {
    width: 87.5vw;
    margin: 0 6.25vw;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #customerPage section.sectionImage[data-type="3"] picture {
    width: 87.5vw;
    margin: 0 6.25vw;
  }
}
#customerPage section.sectionImage[data-type="4"] picture {
  position: relative;
  display: block;
  width: 50vw;
  margin: 0 12.5vw 0 37.5vw;
}
#customerPage section.sectionImage[data-type="4"] picture img {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #customerPage section.sectionImage[data-type="4"] picture {
    width: 87.5vw;
    margin: 0 6.25vw;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #customerPage section.sectionImage[data-type="4"] picture {
    width: 87.5vw;
    margin: 0 6.25vw;
  }
}
#customerPage section.sectionImage[data-type="5"] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 15vh 12.5vw 0 12.5vw;
}
#customerPage section.sectionImage[data-type="5"] .image {
  position: relative;
  width: 31.25vw;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}
#customerPage section.sectionImage[data-type="5"] .image img {
  width: 100%;
}
#customerPage section.sectionImage[data-type="5"] .text {
  position: relative;
  width: 37.5vw;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  margin-left: 6.25vw;
}
#customerPage section.sectionImage[data-type="5"] .text .cont {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
#customerPage section.sectionImage[data-type="5"] .text .cont h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  margin-top: 10vh;
}
#customerPage section.sectionImage[data-type="5"] .text .cont h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 2vw;
  margin-bottom: 2vh;
}
#customerPage section.sectionImage[data-type="5"] .text .cont p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 25px;
}
#customerPage section.sectionImage[data-type="5"] .text .cont .link {
  overflow: hidden;
  position: relative;
  text-decoration: none;
  display: inline-block;
  padding: 0 15px;
  border-radius: 5vw;
  margin-top: 5vh;
  width: auto;
  heighT: 45px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background-color: var(--subColor);
}
#customerPage section.sectionImage[data-type="5"] .text .cont .link img {
  position: relative;
  float: left;
  display: inline-block;
  width: 15px;
  height: 15px;
  margin: 15px 15px 15px 0;
}
#customerPage section.sectionImage[data-type="5"] .text .cont .link span {
  position: relative;
  float: left;
  display: inline-block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 45px;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #customerPage section.sectionImage[data-type="5"] {
    display: block;
    padding: 15vh 6.25vw 0 6.25vw;
  }
  #customerPage section.sectionImage[data-type="5"] .image {
    position: relative;
    width: 87.5vw;
  }
  #customerPage section.sectionImage[data-type="5"] .image img {
    width: 100%;
  }
  #customerPage section.sectionImage[data-type="5"] .text {
    position: relative;
    width: 87.5vw;
    margin-left: 0;
    margin-top: 5vh;
  }
  #customerPage section.sectionImage[data-type="5"] .text .cont {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  #customerPage section.sectionImage[data-type="5"] .text .cont h3 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 25px;
    margin-bottom: 2vh;
  }
  #customerPage section.sectionImage[data-type="5"] .text .cont h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    line-height: 8vw;
    margin-top: 0;
  }
  #customerPage section.sectionImage[data-type="5"] .text .cont p {
    margin-bottom: 2vh;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #customerPage section.sectionImage[data-type="5"] {
    display: block;
    padding: 0 6.25vw;
  }
  #customerPage section.sectionImage[data-type="5"] .image {
    position: relative;
    width: 87.5vw;
  }
  #customerPage section.sectionImage[data-type="5"] .image img {
    width: 100%;
  }
  #customerPage section.sectionImage[data-type="5"] .text {
    position: relative;
    width: 87.5vw;
    margin-left: 0;
    margin-top: 5vh;
  }
  #customerPage section.sectionImage[data-type="5"] .text .cont {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  #customerPage section.sectionImage[data-type="5"] .text .cont h3 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 25px;
    margin-bottom: 2vh;
  }
  #customerPage section.sectionImage[data-type="5"] .text .cont h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    line-height: 8vw;
    margin-top: 0;
  }
  #customerPage section.sectionImage[data-type="5"] .text .cont p {
    margin-bottom: 2vh;
  }
}
#customerPage section.sectionImage[data-type="6"] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 15vh 12.5vw 0 12.5vw;
}
#customerPage section.sectionImage[data-type="6"] .image {
  position: relative;
  width: 31.25vw;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}
#customerPage section.sectionImage[data-type="6"] .image img {
  width: 100%;
}
#customerPage section.sectionImage[data-type="6"] .text {
  position: relative;
  width: 37.5vw;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  margin-right: 6.25vw;
}
#customerPage section.sectionImage[data-type="6"] .text .cont {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  text-align: right;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
#customerPage section.sectionImage[data-type="6"] .text .cont h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  margin-top: 10vh;
}
#customerPage section.sectionImage[data-type="6"] .text .cont h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 2vw;
  margin-bottom: 2vh;
}
#customerPage section.sectionImage[data-type="6"] .text .cont p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 25px;
}
#customerPage section.sectionImage[data-type="6"] .text .cont .link {
  overflow: hidden;
  position: relative;
  text-decoration: none;
  display: inline-block;
  padding: 0 15px;
  border-radius: 5vw;
  margin-top: 5vh;
  width: auto;
  heighT: 45px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background-color: var(--subColor);
}
#customerPage section.sectionImage[data-type="6"] .text .cont .link img {
  position: relative;
  float: left;
  display: inline-block;
  width: 15px;
  height: 15px;
  margin: 15px 15px 15px 0;
}
#customerPage section.sectionImage[data-type="6"] .text .cont .link span {
  position: relative;
  float: left;
  display: inline-block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 45px;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #customerPage section.sectionImage[data-type="6"] {
    display: block;
    padding: 15vh 6.25vw 0 6.25vw;
  }
  #customerPage section.sectionImage[data-type="6"] .image {
    position: relative;
    width: 87.5vw;
    margin-top: 5vh;
  }
  #customerPage section.sectionImage[data-type="6"] .image img {
    width: 100%;
  }
  #customerPage section.sectionImage[data-type="6"] .text {
    position: relative;
    width: 87.5vw;
    margin-left: 0;
  }
  #customerPage section.sectionImage[data-type="6"] .text .cont {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    text-align: left;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  #customerPage section.sectionImage[data-type="6"] .text .cont h3 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 25px;
    margin-bottom: 2vh;
  }
  #customerPage section.sectionImage[data-type="6"] .text .cont h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    line-height: 8vw;
    margin-top: 0;
  }
  #customerPage section.sectionImage[data-type="6"] .text .cont p {
    margin-bottom: 2vh;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #customerPage section.sectionImage[data-type="6"] {
    display: block;
    padding: 0 6.25vw;
  }
  #customerPage section.sectionImage[data-type="6"] .image {
    position: relative;
    width: 87.5vw;
    margin-top: 5vh;
  }
  #customerPage section.sectionImage[data-type="6"] .image img {
    width: 100%;
  }
  #customerPage section.sectionImage[data-type="6"] .text {
    position: relative;
    width: 87.5vw;
    margin-left: 0;
  }
  #customerPage section.sectionImage[data-type="6"] .text .cont {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    text-align: left;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  #customerPage section.sectionImage[data-type="6"] .text .cont h3 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 25px;
    margin-bottom: 2vh;
  }
  #customerPage section.sectionImage[data-type="6"] .text .cont h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    line-height: 8vw;
    margin-top: 0;
  }
  #customerPage section.sectionImage[data-type="6"] .text .cont p {
    margin-bottom: 2vh;
  }
}
#customerPage section.sectionImage[data-type="7"] picture {
  float: left;
}
#customerPage section.sectionImage[data-type="7"] picture:first-of-type {
  position: relative;
  display: block;
  width: 50vw;
  margin: 0 0 0 12.5vw;
}
#customerPage section.sectionImage[data-type="7"] picture:first-of-type img {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #customerPage section.sectionImage[data-type="7"] picture:nth-of-type(2) {
    width: 87.5vw;
    margin: 0 0 5vh 6.25vw;
  }
  #customerPage section.sectionImage[data-type="7"] picture:nth-of-type(2) img {
    position: relative;
    width: 100%;
    height: auto;
    display: block;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #customerPage section.sectionImage[data-type="7"] picture:nth-of-type(2) {
    width: 87.5vw;
    margin: 0 0 5vh 6.25vw;
  }
  #customerPage section.sectionImage[data-type="7"] picture:nth-of-type(2) img {
    position: relative;
    width: 100%;
    height: auto;
    display: block;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #customerPage section.sectionImage[data-type="7"] picture:nth-of-type(3) {
    position: absolute;
    width: 37.5vw;
    left: 50vw;
    bottom: 0;
  }
  #customerPage section.sectionImage[data-type="7"] picture:nth-of-type(3) img {
    width: 100%;
    display: block;
  }
}
#customerPage section.sectionImage[data-type="7"] picture:last-of-type {
  position: absolute;
  width: 37.5vw;
  left: 50vw;
  bottom: 0;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #customerPage section.sectionImage[data-type="7"] picture:last-of-type {
    position: relative;
    width: 87.5vw;
    left: auto;
    bottom: auto;
    margin: 0 0 0 6.25vw;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #customerPage section.sectionImage[data-type="7"] picture:last-of-type {
    position: relative;
    width: 87.5vw;
    left: auto;
    bottom: auto;
    margin: 0 0 0 6.25vw;
  }
}
#customerPage section.sectionImage[data-type="7"] picture:last-of-type img {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
}
#customerPage section.sectionImage[data-type="8"] {
  margin-bottom: 40vh;
}
#customerPage section.sectionImage[data-type="8"] picture {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
}
#customerPage section.sectionImage[data-type="8"] picture img {
  width: 100%;
  height: auto;
  display: block;
}
#customerPage section.sectionImage[data-type="8"] h2:first-of-type {
  position: absolute;
  bottom: calc(100% - 4vw);
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  left: 12.5vw;
}
#customerPage section.sectionImage[data-type="8"] h2:last-of-type {
  position: absolute;
  top: calc(100% - 4vw);
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  left: 18.75vw;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #customerPage section.sectionImage[data-type="8"] {
    margin-bottom: 0;
    padding-bottom: 15vh;
  }
  #customerPage section.sectionImage[data-type="8"] picture {
    widtH: 87.5vw;
    margin: 0 6.25vw;
  }
  #customerPage section.sectionImage[data-type="8"] h2:first-of-type {
    position: relative;
    bottom: auto;
    left: auto;
    margin-left: 6.25vw;
    margin-bottom: 2vh;
  }
  #customerPage section.sectionImage[data-type="8"] h2:last-of-type {
    position: relative;
    bottom: auto;
    left: auto;
    margin-left: 6.25vw;
    margin-top: 2vh;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #customerPage section.sectionImage[data-type="8"] {
    margin-bottom: 0;
    padding-bottom: 15vh;
  }
  #customerPage section.sectionImage[data-type="8"] picture {
    widtH: 75vw;
    margin: 0 12.5vw;
  }
  #customerPage section.sectionImage[data-type="8"] h2:first-of-type {
    position: relative;
    bottom: auto;
    left: auto;
    margin-left: 12.5vw;
    margin-bottom: 2vh;
  }
  #customerPage section.sectionImage[data-type="8"] h2:last-of-type {
    position: relative;
    bottom: auto;
    left: auto;
    margin-left: 12.5vw;
    margin-top: 2vh;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #customerPage section.sectionImage[data-type="8"] {
    margin-bottom: 0;
    padding-bottom: 15vh;
  }
  #customerPage section.sectionImage[data-type="8"] picture {
    widtH: 87.5vw;
    margin: 0 6.25vw;
  }
  #customerPage section.sectionImage[data-type="8"] h2:first-of-type {
    position: relative;
    bottom: auto;
    left: auto;
    margin-left: 6.25vw;
    margin-bottom: 2vh;
  }
  #customerPage section.sectionImage[data-type="8"] h2:last-of-type {
    position: relative;
    bottom: auto;
    left: auto;
    margin-left: 6.25vw;
    margin-top: 2vh;
  }
}
#customerPage section.gallerySec {
  padding-top: 15vh;
}
#customerPage section.gallerySec .has-slider {
  position: relative;
  width: 100%;
  height: auto;
}
#customerPage section.gallerySec .has-slider .slider {
  position: relative;
  left: 12.5vw;
  overflow: hidden;
}
#customerPage section.gallerySec .has-slider .slider.is-animating {
  transition: -webkit-transform 400ms cubic-bezier(0.5, 0, 0.5, 1);
  -webkit-transition: -webkit-transform 400ms cubic-bezier(0.5, 0, 0.5, 1);
  transition: transform 400ms cubic-bezier(0.5, 0, 0.5, 1);
  transition: transform 400ms cubic-bezier(0.5, 0, 0.5, 1), -webkit-transform 400ms cubic-bezier(0.5, 0, 0.5, 1);
}
#customerPage section.gallerySec .has-slider .slider .slider-panel {
  position: relative;
  width: 25vw;
  height: auto;
  overflow: hidden;
  float: left;
  margin-right: 3.125vw;
}
#customerPage section.gallerySec .has-slider .slider .slider-panel:last-of-type {
  margin: 0;
}
#customerPage section.gallerySec .has-slider .slider .slider-panel img {
  position: relative;
  float: left;
  width: 100%;
  height: auto;
  display: block;
  pointer-events: none;
}
#customerPage section.gallerySec .has-slider .slider .slider-panel .description {
  margin-top: 3vh;
  position: relative;
  width: 100%;
  height: auto;
  float: left;
}
#customerPage section.gallerySec .has-slider .slider .slider-panel .description h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 1.5vw;
  margin-bottom: 1.5vh;
}
#customerPage section.gallerySec .has-slider .slider .slider-panel .description span {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #customerPage section.gallerySec .has-slider .slider {
    left: 6.25vw;
  }
  #customerPage section.gallerySec .has-slider .slider .slider-panel {
    width: 81.25vw;
    margin-right: 6.25vw;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #customerPage section.gallerySec .has-slider .slider {
    left: 12.5vw;
    /*.slider-panel {
    	width: 13*$grid;
    	margin-right: $grid;
    }*/
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #customerPage section.gallerySec .has-slider .slider {
    left: 6.25vw;
  }
  #customerPage section.gallerySec .has-slider .slider .slider-panel {
    width: 62.5vw;
    margin-right: 6.25vw;
  }
}
#customerPage section.gallerySec .has-slider .postSliderNav {
  position: absolute;
  top: -3.125vw;
  left: 60.9375vw;
  -webkit-transform: translateX(50%);
  transform: translateX(50%);
  z-index: 6;
  width: 6.25vw;
  height: 6.25vw;
}
#customerPage section.gallerySec .has-slider .postSliderNav .bg {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: var(--subColor);
}
#customerPage section.gallerySec .has-slider .postSliderNav .prev {
  position: absolute;
  top: 50%;
  left: 16.6666666667%;
  width: auto;
  height: auto;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  cursor: pointer;
}
#customerPage section.gallerySec .has-slider .postSliderNav .prev img {
  width: 14px;
  height: 14px;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  display: block;
}
#customerPage section.gallerySec .has-slider .postSliderNav .next {
  position: absolute;
  top: 50%;
  right: 16.6666666667%;
  width: auto;
  height: auto;
  -webkit-transform: translate(50%, -50%);
  transform: translate(50%, -50%);
  cursor: pointer;
}
#customerPage section.gallerySec .has-slider .postSliderNav .next img {
  width: 14px;
  height: 14px;
  display: block;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #customerPage section.gallerySec .has-slider .postSliderNav {
    top: -9.375vw;
    left: 62.5vw;
    -webkit-transform: translateX(50%);
    transform: translateX(50%);
    z-index: 6;
    width: 18.75vw;
    height: 18.75vw;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #customerPage section.gallerySec .has-slider .postSliderNav {
    top: 50%;
    left: 0;
    -webkit-transform: translate(50%, -50%);
    transform: translate(50%, -50%);
    z-index: 6;
    width: 12.5vw;
    height: 12.5vw;
  }
}
#customerPage section.gallerySec .clienteSliderNav {
  position: absolute;
  top: -3.125vw;
  left: 60.9375vw;
  -webkit-transform: translateX(50%);
  transform: translateX(50%);
  z-index: 6;
  width: 6.25vw;
  height: 6.25vw;
}
#customerPage section.gallerySec .clienteSliderNav .bg {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: var(--subColor);
}
#customerPage section.gallerySec .clienteSliderNav .prev {
  position: absolute;
  top: 50%;
  left: 16.6666666667%;
  width: auto;
  height: auto;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  cursor: pointer;
}
#customerPage section.gallerySec .clienteSliderNav .prev img {
  width: 14px;
  height: 14px;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  display: block;
}
#customerPage section.gallerySec .clienteSliderNav .next {
  position: absolute;
  top: 50%;
  right: 16.6666666667%;
  width: auto;
  height: auto;
  -webkit-transform: translate(50%, -50%);
  transform: translate(50%, -50%);
  cursor: pointer;
}
#customerPage section.gallerySec .clienteSliderNav .next img {
  width: 14px;
  height: 14px;
  display: block;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #customerPage section.gallerySec .clienteSliderNav {
    top: -9.375vw;
    left: 62.5vw;
    -webkit-transform: translateX(50%);
    transform: translateX(50%);
    z-index: 6;
    width: 18.75vw;
    height: 18.75vw;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #customerPage section.gallerySec .clienteSliderNav {
    top: 50%;
    left: 0;
    -webkit-transform: translate(50%, -50%);
    transform: translate(50%, -50%);
    z-index: 6;
    width: 12.5vw;
    height: 12.5vw;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #customerPage section.gallerySec .clienteSliderNav {
    top: -9.375vw;
    left: 62.5vw;
    -webkit-transform: translateX(50%);
    transform: translateX(50%);
    z-index: 6;
    width: 18.75vw;
    height: 18.75vw;
  }
}
#customerPage section.textSection {
  padding: 15vh 0;
}
#customerPage section.textSection h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
}
#customerPage section.textSection h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 2vw;
  margin-bottom: 2vh;
}
#customerPage section.textSection p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 25px;
}
#customerPage section.textSection[data-type="1"] .cont {
  position: relative;
  height: auto;
}
#customerPage section.textSection[data-type="1"] .cont {
  position: relative;
  height: auto;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #customerPage section.textSection {
    position: relative;
    width: 87.5vw;
    margin: 0 6.25vw;
  }
  #customerPage section.textSection h3 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 25px;
    margin-bottom: 2vh;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #customerPage section.textSection {
    position: relative;
    width: 75vw;
    margin: 0 12.5vw;
  }
  #customerPage section.textSection h3 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 25px;
    margin-bottom: 2vh;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #customerPage section.textSection {
    position: relative;
    width: 87.5vw;
    margin: 0 6.25vw;
  }
  #customerPage section.textSection h3 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 25px;
    margin-bottom: 2vh;
  }
}
#customerPage section.videoSec .sliderCont {
  position: relative;
  overflow: hidden;
  left: 18.75vw;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #customerPage section.videoSec .sliderCont {
    left: 6.25vw;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #customerPage section.videoSec .sliderCont {
    left: 12.5vw;
  }
}
#customerPage section.videoSec .sliderCont .videoElement {
  position: relative;
  width: 62.5vw;
  height: auto;
  overflow: hidden;
  float: left;
  margin-right: 3.125vw;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #customerPage section.videoSec .sliderCont .videoElement {
    width: 87.5vw;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #customerPage section.videoSec .sliderCont .videoElement {
    width: 75vw;
  }
}
#customerPage section.videoSec .sliderCont .videoElement:last-of-type {
  margin-bottom: 0;
}
#customerPage section.videoSec .sliderCont .videoElement:full-screen {
  width: 100%;
}
#customerPage section.videoSec .sliderCont .videoElement:-webkit-full-screen {
  width: 100%;
}
#customerPage section.videoSec .sliderCont .videoElement:-ms-fullscreen {
  width: 100%;
}
#customerPage section.videoSec .sliderCont .videoElement:fullscreen {
  width: 100%;
}
#customerPage section.videoSec .sliderCont .videoElement:-webkit-full-screen {
  width: 100%;
}
#customerPage section.videoSec .sliderCont .videoElement:-moz-full-screen {
  width: 100%;
}
#customerPage section.videoSec .sliderCont .videoElement video {
  width: 100%;
  height: auto;
  display: block;
}
#customerPage section.videoSec .sliderCont .videoElement .handler {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 30;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .centerButton {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: block;
  background-color: #fff;
  cursor: pointer;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .centerButton span {
  position: absolute;
  left: 50%;
  top: 0;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  color: #000;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  text-transform: uppercase;
  line-height: 80px;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .centerButton.activePlay .play {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .centerButton.activePlay .pause {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .centerButton.activePause .play {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .centerButton.activePause .pause {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav {
  position: absolute;
  bottom: 0;
  left: 0;
  width: calc(100% - 40px);
  height: 20px;
  padding: 10px 20px;
  background: var(--mainColor);
  background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(var(--mainColor)));
  background: linear-gradient(to bottom, transparent 0%, var(--mainColor) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=transparent, endColorstr=var(--mainColor));
  /*@include translateY(100%);
  &.visible {
  	@include translateY(0%);
  }*/
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .commandButton {
  position: relative;
  width: 20px;
  height: 20px;
  float: left;
  cursor: pointer;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .commandButton svg {
  position: absolute;
  width: 100%;
  height: auto;
  fill: #fff;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .commandButton.play .playVideo {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .commandButton.play .pauseVideo {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .commandButton.pause .playVideo {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .commandButton.pause .pauseVideo {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .commandBar {
  position: relative;
  float: left;
  width: calc(70% - 240px);
  margin-left: 20px;
  height: 5px;
  border: none;
  background-color: #fff;
  border-radius: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  cursor: pointer;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .commandBar .ui-slider-range {
  border-radius: 0;
  background: none;
  background-color: var(--mainColor);
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .commandBar .ui-slider-handle {
  display: none;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .time {
  position: relative;
  width: auto;
  float: left;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  line-height: 20px;
  margin: 0 20px;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .time span {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  line-height: 20px;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .volume {
  position: relative;
  width: calc(30% - 40px);
  height: 20px;
  float: left;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .volume .buttonVol {
  position: relative;
  width: 20px;
  height: 20px;
  float: left;
  margin: 0 0 0 40px;
  cursor: pointer;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .volume .buttonVol svg {
  position: absolute;
  width: 100%;
  height: auto;
  fill: #fff;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .volume .buttonVol svg .big {
  opacity: 1;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .volume .buttonVol svg .medium {
  opacity: 1;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .volume .buttonVol svg .small {
  opacity: 1;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .volume .buttonVol.high svg .big {
  opacity: 1;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .volume .buttonVol.high svg .middle {
  opacity: 1;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .volume .buttonVol.high svg .small {
  opacity: 1;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .volume .buttonVol.middle svg .big {
  opacity: 0;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .volume .buttonVol.middle svg .middle {
  opacity: 1;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .volume .buttonVol.middle svg .small {
  opacity: 1;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .volume .buttonVol.low svg .big {
  opacity: 0;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .volume .buttonVol.low svg .middle {
  opacity: 0;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .volume .buttonVol.low svg .small {
  opacity: 1;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .volume .buttonVol.mute svg .big {
  opacity: 0;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .volume .buttonVol.mute svg .middle {
  opacity: 0;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .volume .buttonVol.mute svg .small {
  opacity: 0;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .volume .buttonVol.muted svg .big {
  opacity: 0;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .volume .buttonVol.muted svg .middle {
  opacity: 0;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .volume .buttonVol.muted svg .small {
  opacity: 0;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .volume .volumeBar {
  position: relative;
  float: left;
  width: calc(100% - 80px);
  margin-left: 20px;
  height: 5px;
  border: none;
  background-color: #fff;
  border-radius: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  cursor: pointer;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .volume .volumeBar .ui-slider-range {
  border-radius: 0;
  background: none;
  background-color: var(--mainColor);
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .volume .volumeBar .ui-slider-handle {
  display: none;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .qualityIcon {
  position: relative;
  width: 20px;
  height: 20px;
  float: left;
  margin-left: 40px;
  cursor: pointer;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .qualityIcon svg {
  position: absolute;
  width: 100%;
  height: auto;
  fill: #fff;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .qualitySet {
  position: absolute;
  right: 80px;
  top: 0;
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
  text-align: center;
  background-color: var(--mainColor);
  opacity: 0;
  visibility: hidden;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .qualitySet.open {
  opacity: 1;
  visibility: visible;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .qualitySet span {
  position: relative;
  display: block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  cursor: pointer;
  padding: 5px 10px;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .qualitySet span.selected {
  background-color: var(--subColor);
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .fullScreen {
  position: relative;
  width: 20px;
  height: 20px;
  float: left;
  margin-left: 40px;
  cursor: pointer;
}
#customerPage section.videoSec .sliderCont .videoElement .handler .videoNav .fullScreen svg {
  position: absolute;
  width: 100%;
  height: auto;
  fill: #fff;
}
#customerPage section.videoSec .clienteSliderNavVideo {
  position: absolute;
  top: -3.125vw;
  left: 76.5625vw;
  -webkit-transform: translateX(50%);
  transform: translateX(50%);
  z-index: 6;
  width: 6.25vw;
  height: 6.25vw;
}
#customerPage section.videoSec .clienteSliderNavVideo .bg {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: var(--subColor);
}
#customerPage section.videoSec .clienteSliderNavVideo .prev {
  position: absolute;
  top: 50%;
  left: 16.6666666667%;
  width: auto;
  height: auto;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  cursor: pointer;
}
#customerPage section.videoSec .clienteSliderNavVideo .prev img {
  width: 14px;
  height: 14px;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  display: block;
}
#customerPage section.videoSec .clienteSliderNavVideo .next {
  position: absolute;
  top: 50%;
  right: 16.6666666667%;
  width: auto;
  height: auto;
  -webkit-transform: translate(50%, -50%);
  transform: translate(50%, -50%);
  cursor: pointer;
}
#customerPage section.videoSec .clienteSliderNavVideo .next img {
  width: 14px;
  height: 14px;
  display: block;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #customerPage section.videoSec .clienteSliderNavVideo {
    top: -9.375vw;
    left: 62.5vw;
    -webkit-transform: translateX(50%);
    transform: translateX(50%);
    z-index: 6;
    width: 18.75vw;
    height: 18.75vw;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #customerPage section.videoSec .clienteSliderNavVideo {
    top: 50%;
    left: 0;
    -webkit-transform: translate(50%, -50%);
    transform: translate(50%, -50%);
    z-index: 6;
    width: 12.5vw;
    height: 12.5vw;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #customerPage section.videoSec .clienteSliderNavVideo {
    top: -9.375vw;
    left: 62.5vw;
    -webkit-transform: translateX(50%);
    transform: translateX(50%);
    z-index: 6;
    width: 18.75vw;
    height: 18.75vw;
  }
}
#customerPage section.nextProject {
  width: 100%;
  height: 100vh;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #customerPage section.nextProject {
    height: auto;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #customerPage section.nextProject {
    height: auto;
    padding-bottom: 5vh;
  }
}
#customerPage section.nextProject .NXbackground {
  position: relative;
  width: 75vw;
  height: 42.19vw;
  margin: calc((100vh - 42.19vw) / 2) 12.5vw;
  display: block;
}
#customerPage section.nextProject .NXbackground img {
  width: auto;
  height: 100%;
  display: block;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #customerPage section.nextProject .NXbackground {
    width: 87.5vw;
    margin: 0 6.25vw;
    height: auto;
  }
  #customerPage section.nextProject .NXbackground img {
    width: 87.5vw;
    height: auto;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #customerPage section.nextProject .NXbackground {
    width: 75vw;
    margin: 0 12.5vw;
    height: auto;
  }
  #customerPage section.nextProject .NXbackground img {
    width: 75vw;
    height: auto;
  }
}
#customerPage section.nextProject .NXtitle {
  position: absolute;
  top: 50%;
  left: 18.75vw;
  -webkit-transform: translateY(30%);
  transform: translateY(30%);
}
#customerPage section.nextProject .NXtitle h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 9vw;
}
#customerPage section.nextProject .NXtitle p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #customerPage section.nextProject .NXtitle {
    bottom: 2vh;
    top: auto;
    left: calc(6.25vw + 2vh);
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #customerPage section.nextProject .NXtitle {
    bottom: 7vh;
    top: auto;
    left: calc(2*6.25vw + 2vh);
  }
}
#customerPage section.nextProject .NXbutton {
  position: absolute;
  top: 30vh;
  right: 18.75vw;
  -webkit-transform: translateX(50%);
  transform: translateX(50%);
  z-index: 6;
  width: 6.25vw;
  height: 6.25vw;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #customerPage section.nextProject .NXbutton {
    display: none;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #customerPage section.nextProject .NXbutton {
    display: none;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #customerPage section.nextProject .NXbutton {
    display: none;
  }
}
#customerPage section.nextProject .NXbutton .bg {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  cursor: pointer;
}
#customerPage section.nextProject .NXbutton #continue {
  position: absolute;
  top: -0.5vw;
  left: -0.5vw;
  width: calc(100% + 1vw);
  height: calc(100% + 1vw);
}
#customerPage section.nextProject .NXbutton #continue circle {
  -webkit-transform: rotate(-90deg);
          transform: rotate(-90deg);
  -webkit-transform-origin: center;
          transform-origin: center;
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  cx: 3.625vw;
  cy: 3.625vw;
}
#customerPage section.nextProject .NXbutton #continue circle.active {
  -webkit-animation-name: circle-chart-fill;
          animation-name: circle-chart-fill;
  -webkit-animation-duration: 3s;
          animation-duration: 3s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  stroke-dasharray: 1000;
  stroke-dashoffset: 0;
}
#customerPage section.nextProject .NXbutton #dotted {
  position: absolute;
  top: -0.5vw;
  left: -0.5vw;
  width: calc(100% + 1vw);
  height: calc(100% + 1vw);
}
#customerPage section.nextProject .NXbutton #dotted circle {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transform-origin: center;
          transform-origin: center;
  stroke-dasharray: 1 3;
  stroke-dashoffset: 5;
  stroke-linecap: round;
  cx: 3.625vw;
  cy: 3.625vw;
  stroke: #fff;
}
#customerPage section.nextProject .NXbutton:hover #dotted circle {
  -webkit-animation-name: animation-rotation-dots;
          animation-name: animation-rotation-dots;
  -webkit-animation-duration: 20s;
          animation-duration: 20s;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
#customerPage section.nextProject .NXbutton .count {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 33.3333333333%;
  height: auto;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  cursor: pointer;
}
#customerPage section.nextProject .NXbutton .count svg {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#customerPage section.nextProject .NXbutton .count svg path {
  fill: #fff;
}
#customerPage section.nextProject .NXbutton .count svg path#extCircle {
  opacity: 0;
}
#customerPage section.nextProject .NXbutton .count svg path#inCircle {
  opacity: 0;
}
#customerPage section.nextProject .NXbutton .count .visible {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#customerPage section.nextProject .NXbutton .count:hover svg {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#customerPage section.nextProject .NXbutton .count:hover svg path#inCircle {
  -webkit-animation-name: inner-circle-ani;
          animation-name: inner-circle-ani;
  -webkit-animation-duration: 1.5s;
          animation-duration: 1.5s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
#customerPage section.nextProject .NXbutton .count:hover svg path#extCircle {
  -webkit-animation-name: ext-circle-ani;
          animation-name: ext-circle-ani;
  -webkit-animation-duration: 1.5s;
          animation-duration: 1.5s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
#customerPage section.nextProject .NXbutton .count:hover .visible {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}

#listingTipologia {
  position: relative;
  width: 100%;
  height: auto;
  padding: 10vh 0 0 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia {
    padding: 0;
    overflow: hidden;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia {
    padding-top: 10rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia {
    padding-top: 15rem;
  }
}
#listingTipologia .mobileedit .sezione-title .title__wrapper {
  padding-top: 7.5rem;
  margin: 0 auto;
  width: 87.5vw;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia .mobileedit .sezione-title .title__wrapper {
    padding-top: 12.5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia .mobileedit .sezione-title .title__wrapper {
    padding-top: 12.5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia .mobileedit .sezione-title .title__wrapper {
    padding-top: 15rem;
  }
}
#listingTipologia .mobileedit .sezione-title .title__wrapper .title__top h1 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 3rem;
  line-height: 3rem;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia .mobileedit .sezione-title .title__wrapper .title__top h1 {
    font-size: 10vw;
    line-height: 10vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia .mobileedit .sezione-title .title__wrapper .title__top h1 {
    font-size: 10vw;
    line-height: 10vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia .mobileedit .sezione-title .title__wrapper .title__top h1 {
    font-size: 10vw;
    line-height: 10vw;
  }
}
#listingTipologia .mobileedit .sezione-title .title__wrapper .title__bottom h1 {
  color: transparent;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 3rem;
  line-height: 3rem;
  -webkit-text-stroke: 1px var(--subColor);
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia .mobileedit .sezione-title .title__wrapper .title__bottom h1 {
    font-size: 10vw;
    line-height: 10vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia .mobileedit .sezione-title .title__wrapper .title__bottom h1 {
    font-size: 10vw;
    line-height: 10vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia .mobileedit .sezione-title .title__wrapper .title__bottom h1 {
    font-size: 10vw;
    line-height: 10vw;
  }
}
#listingTipologia .mobileedit .sezione-title .subtitle {
  position: relative;
  margin-top: 2.5rem;
  width: 87.5vw;
  margin: 2.5rem auto 5rem auto;
}
#listingTipologia .mobileedit .sezione-title .subtitle p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 1.68rem;
  margin-bottom: 1.25rem;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia .mobileedit .sezione-title .subtitle p {
    font-size: 30px;
    line-height: 40px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia .mobileedit .sezione-title .subtitle p {
    font-size: 30px;
    line-height: 40px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia .mobileedit .sezione-title .subtitle p {
    font-size: 30px;
    line-height: 40px;
  }
}
#listingTipologia .mobileedit .sezione-title .subtitle p:last-of-type {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 0.9rem;
  line-height: 1.08rem;
  margin-bottom: 0;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia .mobileedit .sezione-title .subtitle p:last-of-type {
    font-size: 20px;
    line-height: 30px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia .mobileedit .sezione-title .subtitle p:last-of-type {
    font-size: 20px;
    line-height: 30px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia .mobileedit .sezione-title .subtitle p:last-of-type {
    font-size: 20px;
    line-height: 30px;
  }
}
#listingTipologia section {
  position: relative;
  width: 100%;
  height: 85vh;
  padding-bottom: 15vh;
}
#listingTipologia section.sezione-title {
  height: auto;
  padding-bottom: 0;
}
#listingTipologia section.row-mobile {
  height: auto;
  padding-bottom: 0;
  margin: 0 auto 2.5rem auto;
  opacity: 0;
  -webkit-transform: translateY(80px);
  transform: translateY(80px);
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.row-mobile {
    margin-bottom: 7.5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.row-mobile {
    margin-bottom: 7.5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.row-mobile {
    margin-bottom: 7.5rem;
  }
}
#listingTipologia section.row-mobile a {
  text-decoration: none;
}
#listingTipologia section.row-mobile img {
  width: 100%;
}
#listingTipologia section.row-mobile h2 {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 1.68rem;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.row-mobile h2 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 30px;
    line-height: 36px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.row-mobile h2 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 30px;
    line-height: 36px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.row-mobile h2 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 2.8rem;
    line-height: 3.36rem;
  }
}
#listingTipologia section.row-mobile h3 {
  color: white;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 3rem;
  line-height: 3.6rem;
}
#listingTipologia section.row-mobile.last {
  margin-bottom: 7.5rem;
}
#listingTipologia section.row-mobile .titoletto {
  width: 87.5vw;
  margin: 0 auto 1.25rem auto;
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.row-mobile .titoletto {
    margin-bottom: 2.5rem;
  }
}
#listingTipologia section.row-mobile .swiper-container {
  padding-left: 6.25vw;
}
#listingTipologia section.row-mobile .swiper-container .slide .slide__caption {
  position: relative;
  padding: 0 6.25vw;
  margin-top: -2rem;
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.row-mobile .swiper-container .slide .slide__caption {
    padding-left: 3.125vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.row-mobile .swiper-container .slide .slide__caption .caption__wrapper .caption__titolo h2 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 1.68rem;
  }
}
#listingTipologia section.first {
  height: 70vh;
  padding-bottom: 5vh;
  height: auto;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.first {
    width: 87.5vw;
    margin: 0 auto;
    height: auto;
    padding: 7.5rem 6.25vw 5rem 6.25vw;
    overflow: hidden;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.first {
    padding-bottom: 5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.first {
    padding-bottom: 5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.first {
    padding-bottom: 5rem;
  }
}
#listingTipologia section.first h1 {
  position: absolute;
  line-height: 10vw;
  z-index: 3;
  color: transparent;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
  left: 0;
  top: 0;
  position: relative;
  margin-left: 18.75vw;
  margin-top: 12vh;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #listingTipologia section.first h1 {
    margin-top: 18vh;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.first h1 {
    margin-left: 6.25vw;
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.first h1 {
    margin-left: 6.25vw;
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.first h1 {
    margin-left: 6.25vw;
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.first h1 {
    position: relative;
    color: transparent;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 3rem;
    line-height: 3rem;
    margin-left: 0;
    margin-top: 0;
  }
}
#listingTipologia section.first h1 span {
  display: block;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#listingTipologia section.first h1 span:first-of-type {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10vw;
  -webkit-text-stroke: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.first h1 span:first-of-type {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 3rem;
  }
}
#listingTipologia section.first .scroll-archives {
  position: absolute;
  top: 40%;
  right: 6.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.first .scroll-archives {
    right: 12.5vw;
    top: 12.5rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.first .scroll-archives {
    top: 20%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.first .scroll-archives {
    top: 20%;
  }
}
#listingTipologia section.first .scroll-archives span {
  position: relative;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 2vw;
  text-transform: uppercase;
  line-height: 2vw;
  margin-right: 6.25vw;
  text-align: right;
  display: block;
  z-index: 5;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.first .scroll-archives span {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 0.9rem;
    line-height: 1.08rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.first .scroll-archives span {
    font-size: 2.2rem;
    line-height: 2.2rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.first .scroll-archives span {
    font-size: 2.2rem;
    line-height: 2.2rem;
  }
}
#listingTipologia section.first .scroll-archives .circle {
  position: absolute;
  top: calc(-1.5*6.25vw + 2vw);
  right: 0;
  z-index: 2;
  width: 18.75vw;
  opacity: 0;
  z-index: 4;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.first .scroll-archives .circle {
    width: 40vw;
    top: -15vw;
    right: -10vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.first .scroll-archives .circle {
    width: 25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.first .scroll-archives .circle {
    width: 25vw;
  }
}
#listingTipologia section.first .scroll-archives .circle svg {
  width: 100%;
  display: block;
  height: auto;
  fill: var(--mainColorD10);
  -webkit-animation-name: animation-rotation-dots;
          animation-name: animation-rotation-dots;
  -webkit-animation-duration: 30s;
          animation-duration: 30s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
#listingTipologia section.first .scroll-archives .arrow {
  position: absolute;
  top: 2vw;
  right: -1.5625vw;
  width: 9.375vw;
  z-index: 5;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.first .scroll-archives .arrow {
    width: 20vw;
    right: -10vw;
    top: 5vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.first .scroll-archives .arrow {
    width: 12.5vw;
    right: -3.125vw;
    top: 3.125vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.first .scroll-archives .arrow {
    width: 12.5vw;
    right: -3.125vw;
    top: 3.125vw;
  }
}
#listingTipologia section.first .scroll-archives .arrow svg {
  fill: transparent;
  stroke-width: 5;
  stroke: var(--subColor);
}
#listingTipologia section.first .texts {
  position: absolute;
  top: calc(12vh + 13vw);
  left: 18.75vw;
  z-index: 5;
  position: relative;
  top: 0;
  left: 0;
  margin-top: 5rem;
  margin-left: 18.75vw;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.first .texts {
    margin-left: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.first .texts {
    margin-left: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.first .texts {
    margin-left: 6.25vw;
  }
}
#listingTipologia section.first .texts p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 30px;
  line-height: 40px;
  width: 31.25vw;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #listingTipologia section.first .texts p {
    font-size: 26px;
    line-height: 32px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.first .texts p {
    width: 62.5vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.first .texts p {
    width: 62.5vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.first .texts p {
    width: 62.5vw;
  }
}
#listingTipologia section.first .texts p:last-of-type {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  line-height: 30px;
  width: 40.625vw;
  margin-top: 1.25rem;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.first .texts p:last-of-type {
    width: 62.5vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.first .texts p:last-of-type {
    width: 62.5vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.first .texts p:last-of-type {
    width: 62.5vw;
  }
}
#listingTipologia section.first .image {
  position: absolute;
  top: calc(15vh + 3vw);
  left: 56.25vw;
  width: 21.875vw;
  z-index: 1;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
  /*opacity: 0;
  visibility: hidden;*/
}
#listingTipologia section.first .image picture {
  width: 100%;
  height: auto;
}
#listingTipologia section.first .image picture img {
  width: 100%;
  height: auto;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#listingTipologia section.first h3 {
  position: absolute;
  top: calc(60vh + 13vw);
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20vw;
  display: block;
  line-height: 18vw;
  text-align: right;
  left: 56.25vw;
  z-index: 3;
}
#listingTipologia section.first h3 span {
  position: relative;
  display: inline-block;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.first.web-digital .texts, #listingTipologia section.first.web-and-digital .texts {
    position: relative;
    top: 0;
    left: 0;
    margin-top: 6.25rem;
    margin-left: 0;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.first.web-digital .texts p, #listingTipologia section.first.web-and-digital .texts p {
    width: 100%;
    font-size: 1.4rem;
    line-height: 1.68rem;
  }
  #listingTipologia section.first.web-digital .texts p:last-of-type, #listingTipologia section.first.web-and-digital .texts p:last-of-type {
    font-size: 0.9rem;
    line-height: 1.08rem;
    margin-bottom: 0;
    margin-top: 2.5rem;
  }
}
#listingTipologia section.first.web-digital .scroll-archives .circle svg, #listingTipologia section.first.web-and-digital .scroll-archives .circle svg {
  opacity: 0.5;
}
#listingTipologia section.title-big {
  position: relative;
  width: 100vw;
  height: auto;
  margin: 12.5vw 0 6.25vw 0;
  text-align: right;
  padding-bottom: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.title-big {
    width: 87.5vw;
    margin: 0;
    padding: 0 6.25vw;
    text-align: left;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.title-big {
    width: 87.5vw;
    padding: 18.75vw 6.25vw 0 6.25vw;
    text-align: left;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.title-big {
    width: 87.5vw;
    padding: 18.75vw 6.25vw 0 6.25vw;
    text-align: left;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.title-big {
    padding-top: 9.375vw;
  }
}
#listingTipologia section.title-big .wrapper {
  position: relative;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  /* @include mobile {
  	justify-content: flex-start;
  } */
}
#listingTipologia section.title-big .wrapper h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 6vw;
  line-height: 6vw;
  display: inline-block;
  text-indent: -5px;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.title-big .wrapper h2 {
    font-size: 2.7rem;
    line-height: 2.7rem;
  }
}
#listingTipologia section.last-project-web {
  position: relative;
  width: 100vw;
  height: auto;
  margin: 12.5vw 0 6.25vw 0;
  text-align: right;
  padding-bottom: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.last-project-web {
    width: 87.5vw;
    margin: 0;
    padding: 0 6.25vw 25vw 6.25vw;
    text-align: left;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.last-project-web {
    width: 87.5vw;
    padding: 18.75vw 6.25vw 0 6.25vw;
    text-align: left;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.last-project-web {
    width: 87.5vw;
    padding: 18.75vw 6.25vw 0 6.25vw;
    text-align: left;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.last-project-web {
    padding-top: 9.375vw;
  }
}
#listingTipologia section.last-project-web .lstPrj {
  position: relative;
  z-index: 10;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 6.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.last-project-web .lstPrj {
    margin-top: 1.25rem;
    mix-blend-mode: unset;
    gap: 0;
  }
}
#listingTipologia section.last-project-web .lstPrj .sec-title {
  position: relative;
  width: 100%;
  height: auto;
  text-align: center;
  display: none;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.last-project-web .lstPrj .sec-title {
    display: none;
  }
}
#listingTipologia section.last-project-web .lstPrj .sec-title h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 6vw;
  line-height: 6vw;
  display: inline-block;
  text-indent: -5px;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.last-project-web .lstPrj .sec-title h2 {
    font-size: 2.7rem;
    line-height: 2.7rem;
  }
}
#listingTipologia section.last-project-web .lstPrj .title-rotate {
  position: absolute;
  top: calc(-1*6.25vw + 2vw);
  right: 9.375vw;
  z-index: 2;
  width: 12.5vw;
  opacity: 0;
  z-index: 4;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.last-project-web .lstPrj .title-rotate {
    width: 40vw;
    top: -15vw;
    right: -10vw;
    opacity: 1;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.last-project-web .lstPrj .title-rotate {
    width: 25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.last-project-web .lstPrj .title-rotate {
    width: 25vw;
  }
}
#listingTipologia section.last-project-web .lstPrj .title-rotate svg {
  width: 100%;
  display: block;
  height: auto;
  fill: var(--subColor);
  -webkit-animation-name: animation-rotation-dots;
          animation-name: animation-rotation-dots;
  -webkit-animation-duration: 30s;
          animation-duration: 30s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
#listingTipologia section.last-project-web .lstPrj .lastProjectImage {
  position: relative;
  width: 75vw;
  margin: 0vw 12.5vw 0 12.5vw;
  height: auto;
  background-color: var(--col-back-project);
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.last-project-web .lstPrj .lastProjectImage {
    width: 87.5vw;
    margin-left: 0;
    clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
    -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
    -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
    -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.last-project-web .lstPrj .lastProjectImage {
    width: 87.5vw;
    margin-left: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.last-project-web .lstPrj .lastProjectImage {
    width: 87.5vw;
    margin-left: 0;
  }
}
#listingTipologia section.last-project-web .lstPrj .lastProjectImage a.goToNextProject {
  position: relative;
  display: block;
}
#listingTipologia section.last-project-web .lstPrj .lastProjectImage a.goToNextProject .goToNextProject__cta-mobile {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 6rem;
  height: 6rem;
  border-radius: 100px;
  border: 3px solid var(--col-back-project);
  z-index: 2;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.last-project-web .lstPrj .lastProjectImage a.goToNextProject .goToNextProject__cta-mobile {
    width: 7.5rem;
    height: 7.5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.last-project-web .lstPrj .lastProjectImage a.goToNextProject .goToNextProject__cta-mobile {
    width: 7.5rem;
    height: 7.5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.last-project-web .lstPrj .lastProjectImage a.goToNextProject .goToNextProject__cta-mobile {
    width: 7.5rem;
    height: 7.5rem;
  }
}
#listingTipologia section.last-project-web .lstPrj .lastProjectImage a.goToNextProject .goToNextProject__cta-mobile .cta__wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
#listingTipologia section.last-project-web .lstPrj .lastProjectImage a.goToNextProject .goToNextProject__cta-mobile .cta__wrapper p.cta__text {
  font-family: "Monument Grotesk";
  color: white;
  font-size: 0.7rem;
  text-transform: uppercase;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.last-project-web .lstPrj .lastProjectImage a.goToNextProject .goToNextProject__cta-mobile .cta__wrapper p.cta__text {
    font-size: 1rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.last-project-web .lstPrj .lastProjectImage a.goToNextProject .goToNextProject__cta-mobile .cta__wrapper p.cta__text {
    font-size: 1rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.last-project-web .lstPrj .lastProjectImage a.goToNextProject .goToNextProject__cta-mobile .cta__wrapper p.cta__text {
    font-size: 1rem;
  }
}
#listingTipologia section.last-project-web .lstPrj .lastProjectImage picture {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.last-project-web .lstPrj .lastProjectImage picture {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
#listingTipologia section.last-project-web .lstPrj .lastProjectImage picture img {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.last-project-web .lstPrj .lastProjectImage picture img {
    clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
    -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
    -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
    -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
#listingTipologia section.last-project-web .lstPrj .info {
  position: absolute;
  bottom: 0;
  left: 15.625vw;
  width: 100%;
  z-index: 5;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
  -moz-text-align-last: left;
       text-align-last: left;
  -webkit-transform: translateY(50%);
          transform: translateY(50%);
}
#listingTipologia section.last-project-web .lstPrj .info h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 3vw;
  line-height: 3vw;
  display: inline-block;
  text-indent: -5px;
}
#listingTipologia section.last-project-web .lstPrj .info h4 {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 24px;
  line-height: 24px;
  margin-top: 10px;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.last-project-web .lstPrj .info {
    position: relative;
    bottom: auto;
    left: auto;
    margin-top: -1.5rem;
    overflow: visible;
    padding: 0 6.25vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  #listingTipologia section.last-project-web .lstPrj .info h3 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 2.7rem;
    line-height: 2.7rem;
  }
  #listingTipologia section.last-project-web .lstPrj .info h4 {
    position: relative;
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 0.9rem;
    line-height: 1rem;
  }
}
#listingTipologia section.last-project-web .lstPrj .nextProjectBtn {
  position: absolute;
  right: 8.125vw;
  top: 50%;
  width: 6.25vw;
  height: 6.25vw;
  border-radius: 50%;
  background-color: transparent;
  margin-left: 3.125vw;
  cursor: pointer;
  overflow: hidden;
  opacity: 0;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: 5;
}
#listingTipologia section.last-project-web .lstPrj .nextProjectBtn svg {
  fill: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 30px;
  height: 30px;
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#listingTipologia section.last-project-web .lstPrj .nextProjectBtn:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0;
  background-color: #fff;
  -webkit-transition: height 0.35s ease-in-out 0s;
  transition: height 0.35s ease-in-out 0s;
}
#listingTipologia section.last-project-web .lstPrj .nextProjectBtn.btnAnimated svg {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0.3s;
  transition: opacity 0.35s ease-in-out 0.3s;
}
#listingTipologia section.last-project-web .lstPrj .nextProjectBtn.btnAnimated:before {
  height: 100%;
  -webkit-transition: height 0.35s ease-in-out 0s;
  transition: height 0.35s ease-in-out 0s;
}
#listingTipologia section.last-project-web .tx {
  position: absolute;
  top: 50%;
  right: 9.375vw;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
#listingTipologia section.last-project-web .tx .wrapper {
  position: relative;
  float: right;
  text-align: right;
  padding-right: 9.375vw;
  z-index: 2;
}
#listingTipologia section.last-project-web .tx .wrapper h4 {
  position: relative;
  color: var(--col-back-project);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  text-transform: uppercase;
  -webkit-font-smoothing: antialiased;
  letter-spacing: 5px;
  line-height: 20px;
  opacity: 0;
  width: 100%;
  display: block;
}
#listingTipologia section.last-project-web .tx .wrapper .tit {
  position: relative;
  float: left;
  width: 100%;
  display: block;
}
#listingTipologia section.last-project-web .tx .wrapper .tit h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 4vw;
  -webkit-font-smoothing: antialiased;
  line-height: 4vw;
  width: 100%;
  display: block;
}
#listingTipologia section.last-project-web .tx .wrapper .tit h2 span {
  position: relative;
  -webkit-transform: scale(1.6);
  transform: scale(1.6);
  opacity: 0;
  display: inline-block;
}
#listingTipologia section.last-project-web .tx .wrapper .cli {
  position: relative;
  float: left;
  width: 100%;
  display: block;
}
#listingTipologia section.last-project-web .tx .wrapper .cli h3 {
  color: transparent;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 4vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--col-back-project);
  line-height: 4vw;
  width: 100%;
  display: block;
}
#listingTipologia section.last-project-web .tx .wrapper .cli h3 span {
  position: relative;
  -webkit-transform: scale(1.6);
  transform: scale(1.6);
  opacity: 0;
  display: inline-block;
}
#listingTipologia section.last-project-web .tx a {
  position: absolute;
  right: 0;
  top: 50%;
  width: 6.25vw;
  height: 6.25vw;
  border-radius: 50%;
  background-color: transparent;
  margin-left: 3.125vw;
  cursor: pointer;
  overflow: hidden;
  opacity: 0;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: 5;
}
#listingTipologia section.last-project-web .tx a svg {
  fill: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 30px;
  height: 30px;
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#listingTipologia section.last-project-web .tx a:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0;
  background-color: var(--col-back-project);
  -webkit-transition: height 0.35s ease-in-out 0s;
  transition: height 0.35s ease-in-out 0s;
}
#listingTipologia section.last-project-web .tx a.btnAnimated svg {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0.3s;
  transition: opacity 0.35s ease-in-out 0.3s;
}
#listingTipologia section.last-project-web .tx a.btnAnimated:before {
  height: 100%;
  -webkit-transition: height 0.35s ease-in-out 0s;
  transition: height 0.35s ease-in-out 0s;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.last-project-web .tx {
    position: relative;
    top: auto;
    right: auto;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  #listingTipologia section.last-project-web .tx a {
    position: relative;
    right: auto;
    top: auto;
    width: 25vw;
    height: 25vw;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    margin-left: 0;
    margin-top: 6.25vw;
    float: left;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
  #listingTipologia section.last-project-web .tx .wrapper {
    float: left;
    text-align: left;
    padding-right: 0;
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    margin-top: 6.25vw;
  }
  #listingTipologia section.last-project-web .tx .wrapper h4 {
    color: var(--col-back-project);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    letter-spacing: 0px;
    line-height: 20px;
  }
  #listingTipologia section.last-project-web .tx .wrapper .tit h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
  }
  #listingTipologia section.last-project-web .tx .wrapper .cli h3 {
    color: var(--col-back-project);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    -webkit-text-stroke: 0 var(--col-back-project);
    line-height: 10vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.last-project-web .tx {
    position: relative;
    top: auto;
    right: auto;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  #listingTipologia section.last-project-web .tx a {
    position: relative;
    right: auto;
    top: auto;
    width: 25vw;
    height: 25vw;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    margin-left: 0;
    margin-top: 6.25vw;
    float: left;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
  #listingTipologia section.last-project-web .tx .wrapper {
    float: left;
    text-align: left;
    padding-right: 0;
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    margin-top: 6.25vw;
  }
  #listingTipologia section.last-project-web .tx .wrapper h4 {
    color: var(--col-back-project);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    letter-spacing: 0px;
    line-height: 20px;
  }
  #listingTipologia section.last-project-web .tx .wrapper .tit h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
  }
  #listingTipologia section.last-project-web .tx .wrapper .cli h3 {
    color: var(--col-back-project);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    -webkit-text-stroke: 0 var(--col-back-project);
    line-height: 10vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.last-project-web .tx {
    position: relative;
    top: auto;
    right: auto;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  #listingTipologia section.last-project-web .tx a {
    position: relative;
    right: auto;
    top: auto;
    width: 25vw;
    height: 25vw;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    margin-left: 0;
    margin-top: 6.25vw;
    float: left;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
  #listingTipologia section.last-project-web .tx .wrapper {
    float: left;
    text-align: left;
    padding-right: 0;
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    margin-top: 6.25vw;
  }
  #listingTipologia section.last-project-web .tx .wrapper h4 {
    color: var(--col-back-project);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    letter-spacing: 0px;
    line-height: 20px;
  }
  #listingTipologia section.last-project-web .tx .wrapper .tit h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
  }
  #listingTipologia section.last-project-web .tx .wrapper .cli h3 {
    color: var(--col-back-project);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    -webkit-text-stroke: 0 var(--col-back-project);
    line-height: 10vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.last-project-web .tx {
    position: relative;
    top: auto;
    right: auto;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  #listingTipologia section.last-project-web .tx a {
    position: relative;
    right: auto;
    top: auto;
    width: 25vw;
    height: 25vw;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    margin-left: 0;
    margin-top: 6.25vw;
    float: left;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
  #listingTipologia section.last-project-web .tx .wrapper {
    float: left;
    text-align: left;
    padding-right: 0;
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    margin-top: 6.25vw;
  }
  #listingTipologia section.last-project-web .tx .wrapper h4 {
    color: var(--col-back-project);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    letter-spacing: 0px;
    line-height: 20px;
  }
  #listingTipologia section.last-project-web .tx .wrapper .tit h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
  }
  #listingTipologia section.last-project-web .tx .wrapper .cli h3 {
    color: var(--col-back-project);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    -webkit-text-stroke: 0 var(--col-back-project);
    line-height: 10vw;
  }
}
#listingTipologia section.next-project-web {
  position: relative;
  width: 100vw;
  height: auto;
  margin: 12.5vw 0;
  text-align: right;
  padding-bottom: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.next-project-web {
    width: 87.5vw;
    margin: 0;
    padding: 0 6.25vw 25vw 6.25vw;
    text-align: left;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.next-project-web {
    width: 87.5vw;
    padding: 18.75vw 6.25vw 0 6.25vw;
    text-align: left;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.next-project-web {
    width: 87.5vw;
    padding: 18.75vw 6.25vw 0 6.25vw;
    text-align: left;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.next-project-web {
    padding-top: 9.375vw;
  }
}
#listingTipologia section.next-project-web .lstPrj {
  position: relative;
  z-index: 10;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 6.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.next-project-web .lstPrj {
    margin-top: 1.25rem;
    mix-blend-mode: unset;
    gap: 0;
  }
}
#listingTipologia section.next-project-web .lstPrj .sec-title {
  position: relative;
  width: 100%;
  height: auto;
  text-align: center;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.next-project-web .lstPrj .sec-title {
    display: none;
  }
}
#listingTipologia section.next-project-web .lstPrj .sec-title h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 6vw;
  line-height: 6vw;
  display: inline-block;
  text-indent: -5px;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.next-project-web .lstPrj .sec-title h2 {
    font-size: 2.7rem;
    line-height: 2.7rem;
  }
}
#listingTipologia section.next-project-web .lstPrj .title-rotate {
  position: absolute;
  top: calc(-1*6.25vw + 2vw);
  right: 9.375vw;
  z-index: 2;
  width: 12.5vw;
  opacity: 0;
  z-index: 4;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.next-project-web .lstPrj .title-rotate {
    width: 40vw;
    top: -15vw;
    right: -10vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.next-project-web .lstPrj .title-rotate {
    width: 25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.next-project-web .lstPrj .title-rotate {
    width: 25vw;
  }
}
#listingTipologia section.next-project-web .lstPrj .title-rotate svg {
  width: 100%;
  display: block;
  height: auto;
  fill: var(--subColor);
  -webkit-animation-name: animation-rotation-dots;
          animation-name: animation-rotation-dots;
  -webkit-animation-duration: 30s;
          animation-duration: 30s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
#listingTipologia section.next-project-web .lstPrj .lastProjectImage {
  position: relative;
  width: 75vw;
  margin: 0vw 12.5vw 0 12.5vw;
  height: auto;
  background-color: var(--col-back-project);
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.next-project-web .lstPrj .lastProjectImage {
    width: 87.5vw;
    margin-left: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.next-project-web .lstPrj .lastProjectImage {
    width: 87.5vw;
    margin-left: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.next-project-web .lstPrj .lastProjectImage {
    width: 87.5vw;
    margin-left: 0;
  }
}
#listingTipologia section.next-project-web .lstPrj .lastProjectImage picture {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
#listingTipologia section.next-project-web .lstPrj .lastProjectImage picture img {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#listingTipologia section.next-project-web .lstPrj .info {
  position: absolute;
  bottom: 0;
  left: 15.625vw;
  width: 100%;
  z-index: 5;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
  -moz-text-align-last: left;
       text-align-last: left;
  -webkit-transform: translateY(50%);
          transform: translateY(50%);
}
#listingTipologia section.next-project-web .lstPrj .info h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 3vw;
  line-height: 3vw;
  display: inline-block;
  text-indent: -5px;
}
#listingTipologia section.next-project-web .lstPrj .info h4 {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 24px;
  line-height: 24px;
  margin-top: 10px;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.next-project-web .lstPrj .info {
    position: relative;
    bottom: auto;
    left: auto;
    margin-top: -1.5rem;
    overflow: visible;
    padding: 0 6.25vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  #listingTipologia section.next-project-web .lstPrj .info h3 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 2.7rem;
    line-height: 2.7rem;
  }
  #listingTipologia section.next-project-web .lstPrj .info h4 {
    position: relative;
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 0.9rem;
    line-height: 1rem;
  }
}
#listingTipologia section.next-project-web .lstPrj .nextProjectBtn {
  position: absolute;
  right: 8.125vw;
  top: 50%;
  width: 6.25vw;
  height: 6.25vw;
  border-radius: 50%;
  background-color: transparent;
  margin-left: 3.125vw;
  cursor: pointer;
  overflow: hidden;
  opacity: 0;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: 5;
}
#listingTipologia section.next-project-web .lstPrj .nextProjectBtn svg {
  fill: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 30px;
  height: 30px;
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#listingTipologia section.next-project-web .lstPrj .nextProjectBtn:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0;
  background-color: #fff;
  -webkit-transition: height 0.35s ease-in-out 0s;
  transition: height 0.35s ease-in-out 0s;
}
#listingTipologia section.next-project-web .lstPrj .nextProjectBtn.btnAnimated svg {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0.3s;
  transition: opacity 0.35s ease-in-out 0.3s;
}
#listingTipologia section.next-project-web .lstPrj .nextProjectBtn.btnAnimated:before {
  height: 100%;
  -webkit-transition: height 0.35s ease-in-out 0s;
  transition: height 0.35s ease-in-out 0s;
}
#listingTipologia section.next-project-web .tx {
  position: absolute;
  top: 50%;
  right: 9.375vw;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
#listingTipologia section.next-project-web .tx .wrapper {
  position: relative;
  float: right;
  text-align: right;
  padding-right: 9.375vw;
  z-index: 2;
}
#listingTipologia section.next-project-web .tx .wrapper h4 {
  position: relative;
  color: var(--col-back-project);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  text-transform: uppercase;
  -webkit-font-smoothing: antialiased;
  letter-spacing: 5px;
  line-height: 20px;
  opacity: 0;
  width: 100%;
  display: block;
}
#listingTipologia section.next-project-web .tx .wrapper .tit {
  position: relative;
  float: left;
  width: 100%;
  display: block;
}
#listingTipologia section.next-project-web .tx .wrapper .tit h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 4vw;
  -webkit-font-smoothing: antialiased;
  line-height: 4vw;
  width: 100%;
  display: block;
}
#listingTipologia section.next-project-web .tx .wrapper .tit h2 span {
  position: relative;
  -webkit-transform: scale(1.6);
  transform: scale(1.6);
  opacity: 0;
  display: inline-block;
}
#listingTipologia section.next-project-web .tx .wrapper .cli {
  position: relative;
  float: left;
  width: 100%;
  display: block;
}
#listingTipologia section.next-project-web .tx .wrapper .cli h3 {
  color: transparent;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 4vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--col-back-project);
  line-height: 4vw;
  width: 100%;
  display: block;
}
#listingTipologia section.next-project-web .tx .wrapper .cli h3 span {
  position: relative;
  -webkit-transform: scale(1.6);
  transform: scale(1.6);
  opacity: 0;
  display: inline-block;
}
#listingTipologia section.next-project-web .tx a {
  position: absolute;
  right: 0;
  top: 50%;
  width: 6.25vw;
  height: 6.25vw;
  border-radius: 50%;
  background-color: transparent;
  margin-left: 3.125vw;
  cursor: pointer;
  overflow: hidden;
  opacity: 0;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: 5;
}
#listingTipologia section.next-project-web .tx a svg {
  fill: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 30px;
  height: 30px;
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#listingTipologia section.next-project-web .tx a:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0;
  background-color: var(--col-back-project);
  -webkit-transition: height 0.35s ease-in-out 0s;
  transition: height 0.35s ease-in-out 0s;
}
#listingTipologia section.next-project-web .tx a.btnAnimated svg {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0.3s;
  transition: opacity 0.35s ease-in-out 0.3s;
}
#listingTipologia section.next-project-web .tx a.btnAnimated:before {
  height: 100%;
  -webkit-transition: height 0.35s ease-in-out 0s;
  transition: height 0.35s ease-in-out 0s;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.next-project-web .tx {
    position: relative;
    top: auto;
    right: auto;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  #listingTipologia section.next-project-web .tx a {
    position: relative;
    right: auto;
    top: auto;
    width: 25vw;
    height: 25vw;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    margin-left: 0;
    margin-top: 6.25vw;
    float: left;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
  #listingTipologia section.next-project-web .tx .wrapper {
    float: left;
    text-align: left;
    padding-right: 0;
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    margin-top: 6.25vw;
  }
  #listingTipologia section.next-project-web .tx .wrapper h4 {
    color: var(--col-back-project);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    letter-spacing: 0px;
    line-height: 20px;
  }
  #listingTipologia section.next-project-web .tx .wrapper .tit h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
  }
  #listingTipologia section.next-project-web .tx .wrapper .cli h3 {
    color: var(--col-back-project);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    -webkit-text-stroke: 0 var(--col-back-project);
    line-height: 10vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.next-project-web .tx {
    position: relative;
    top: auto;
    right: auto;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  #listingTipologia section.next-project-web .tx a {
    position: relative;
    right: auto;
    top: auto;
    width: 25vw;
    height: 25vw;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    margin-left: 0;
    margin-top: 6.25vw;
    float: left;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
  #listingTipologia section.next-project-web .tx .wrapper {
    float: left;
    text-align: left;
    padding-right: 0;
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    margin-top: 6.25vw;
  }
  #listingTipologia section.next-project-web .tx .wrapper h4 {
    color: var(--col-back-project);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    letter-spacing: 0px;
    line-height: 20px;
  }
  #listingTipologia section.next-project-web .tx .wrapper .tit h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
  }
  #listingTipologia section.next-project-web .tx .wrapper .cli h3 {
    color: var(--col-back-project);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    -webkit-text-stroke: 0 var(--col-back-project);
    line-height: 10vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.next-project-web .tx {
    position: relative;
    top: auto;
    right: auto;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  #listingTipologia section.next-project-web .tx a {
    position: relative;
    right: auto;
    top: auto;
    width: 25vw;
    height: 25vw;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    margin-left: 0;
    margin-top: 6.25vw;
    float: left;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
  #listingTipologia section.next-project-web .tx .wrapper {
    float: left;
    text-align: left;
    padding-right: 0;
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    margin-top: 6.25vw;
  }
  #listingTipologia section.next-project-web .tx .wrapper h4 {
    color: var(--col-back-project);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    letter-spacing: 0px;
    line-height: 20px;
  }
  #listingTipologia section.next-project-web .tx .wrapper .tit h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
  }
  #listingTipologia section.next-project-web .tx .wrapper .cli h3 {
    color: var(--col-back-project);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    -webkit-text-stroke: 0 var(--col-back-project);
    line-height: 10vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.next-project-web .tx {
    position: relative;
    top: auto;
    right: auto;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  #listingTipologia section.next-project-web .tx a {
    position: relative;
    right: auto;
    top: auto;
    width: 25vw;
    height: 25vw;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    margin-left: 0;
    margin-top: 6.25vw;
    float: left;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
  #listingTipologia section.next-project-web .tx .wrapper {
    float: left;
    text-align: left;
    padding-right: 0;
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    margin-top: 6.25vw;
  }
  #listingTipologia section.next-project-web .tx .wrapper h4 {
    color: var(--col-back-project);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    letter-spacing: 0px;
    line-height: 20px;
  }
  #listingTipologia section.next-project-web .tx .wrapper .tit h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
  }
  #listingTipologia section.next-project-web .tx .wrapper .cli h3 {
    color: var(--col-back-project);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    -webkit-text-stroke: 0 var(--col-back-project);
    line-height: 10vw;
  }
}
#listingTipologia section.web-project-col-3 {
  position: relative;
  width: 100vw;
  height: auto;
  margin: 6.25vw 0 6.25vw 0;
  padding: 0 6.25vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
#listingTipologia section.web-project-col-3 .wrapper {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 100%));
  grid-gap: 6.25vw;
  gap: 6.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.web-project-col-3 .wrapper {
    grid-template-columns: repeat(1, minmax(0, 100%));
    gap: 12.5vw;
  }
}
#listingTipologia section.web-project-col-3 .wrapper .listItem {
  position: relative;
  width: 100%;
  height: auto;
}
#listingTipologia section.web-project-col-3 .wrapper .listItem:first-of-type {
  margin-top: 6.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.web-project-col-3 .wrapper .listItem:first-of-type {
    margin-top: 0;
  }
}
#listingTipologia section.web-project-col-3 .wrapper .listItem:last-of-type {
  margin-top: 12.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.web-project-col-3 .wrapper .listItem:last-of-type {
    margin-top: 0;
  }
}
#listingTipologia section.web-project-col-3 .wrapper .listItem a {
  position: relative;
  width: 100%;
  height: auto;
  text-decoration: none;
  display: block;
}
#listingTipologia section.web-project-col-3 .wrapper .listItem a .wrp {
  position: relative;
  width: 100%;
  height: auto;
}
#listingTipologia section.web-project-col-3 .wrapper .listItem a .wrp .imageprj {
  position: relative;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
}
#listingTipologia section.web-project-col-3 .wrapper .listItem a .wrp .imageprj picture {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
}
#listingTipologia section.web-project-col-3 .wrapper .listItem a .wrp .imageprj picture img {
  position: relative;
  width: 100%;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#listingTipologia section.web-project-col-3 .wrapper .listItem a .wrp .imageprj .info {
  position: absolute;
  bottom: 0;
  left: -3.125vw;
}
#listingTipologia section.web-project-col-3 .wrapper .listItem a .info {
  position: absolute;
  bottom: 0;
  left: -3.125vw;
  -webkit-transform: translateY(35%);
  transform: translateY(35%);
  width: 100%;
  z-index: 5;
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#listingTipologia section.web-project-col-3 .wrapper .listItem a .info h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 3vw;
  line-height: 3vw;
  display: inline-block;
  text-indent: -5px;
}
#listingTipologia section.web-project-col-3 .wrapper .listItem a .info h4 {
  position: absolute;
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 24px;
  line-height: 24px;
  margin-top: 10px;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.web-project-col-3 .wrapper .listItem a .info {
    position: relative;
    bottom: auto;
    left: auto;
    margin-top: -1.5rem;
    overflow: visible;
    padding: 0 6.25vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  #listingTipologia section.web-project-col-3 .wrapper .listItem a .info h3 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 2.7rem;
    line-height: 2.7rem;
  }
  #listingTipologia section.web-project-col-3 .wrapper .listItem a .info h4 {
    position: relative;
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 0.9rem;
    line-height: 1rem;
  }
}
#listingTipologia section.web-project-col-2 {
  position: relative;
  width: 100vw;
  height: auto;
  margin: 12.5vw 0 6.25vw 0;
  padding: 0 6.25vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
#listingTipologia section.web-project-col-2 .wrapper {
  position: relative;
  width: 100%;
  display: grid;
  grid-template-columns: 6.25vw auto auto 6.25vw;
  grid-gap: 6.25vw;
  gap: 6.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.web-project-col-2 .wrapper {
    grid-template-columns: repeat(1, minmax(0, 100%));
    gap: 12.5vw;
  }
}
#listingTipologia section.web-project-col-2 .wrapper .listItem {
  position: relative;
  width: 100%;
  height: auto;
}
#listingTipologia section.web-project-col-2 .wrapper .listItem:first-of-type {
  margin-top: 6.25vw;
  grid-column: 2/span 1;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.web-project-col-2 .wrapper .listItem:first-of-type {
    margin-top: 0;
    grid-column: 1;
  }
}
#listingTipologia section.web-project-col-2 .wrapper .listItem:last-of-type {
  grid-column: 3/span 1;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.web-project-col-2 .wrapper .listItem:last-of-type {
    margin-top: 0;
    grid-column: 1;
  }
}
#listingTipologia section.web-project-col-2 .wrapper .listItem a {
  position: relative;
  width: 100%;
  height: auto;
  text-decoration: none;
  display: block;
}
#listingTipologia section.web-project-col-2 .wrapper .listItem a .wrp {
  position: relative;
  width: 100%;
  height: auto;
}
#listingTipologia section.web-project-col-2 .wrapper .listItem a .wrp .imageprj {
  position: relative;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
}
#listingTipologia section.web-project-col-2 .wrapper .listItem a .wrp .imageprj picture {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
}
#listingTipologia section.web-project-col-2 .wrapper .listItem a .wrp .imageprj picture img {
  position: relative;
  width: 100%;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#listingTipologia section.web-project-col-2 .wrapper .listItem a .wrp .imageprj .info {
  position: absolute;
  bottom: 0;
  left: -3.125vw;
}
#listingTipologia section.web-project-col-2 .wrapper .listItem a .info {
  position: absolute;
  bottom: 0;
  left: -3.125vw;
  -webkit-transform: translateY(35%);
  transform: translateY(35%);
  width: 100%;
  z-index: 5;
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#listingTipologia section.web-project-col-2 .wrapper .listItem a .info h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 3vw;
  line-height: 3vw;
  display: inline-block;
  text-indent: -5px;
}
#listingTipologia section.web-project-col-2 .wrapper .listItem a .info h4 {
  position: absolute;
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 24px;
  line-height: 24px;
  margin-top: 10px;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.web-project-col-2 .wrapper .listItem a .info {
    position: relative;
    bottom: auto;
    left: auto;
    margin-top: -1.5rem;
    overflow: visible;
    padding: 0 6.25vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  #listingTipologia section.web-project-col-2 .wrapper .listItem a .info h3 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 2.7rem;
    line-height: 2.7rem;
  }
  #listingTipologia section.web-project-col-2 .wrapper .listItem a .info h4 {
    position: relative;
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 0.9rem;
    line-height: 1rem;
  }
}
#listingTipologia section.web-project-col-full {
  position: relative;
  width: 100vw;
  height: auto;
  margin: 12.5vw 0;
  padding: 0 6.25vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
#listingTipologia section.web-project-col-full .wrapper {
  position: relative;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
#listingTipologia section.web-project-col-full .wrapper .listItem {
  position: relative;
  width: calc(100% - 12.5vw);
  height: auto;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.web-project-col-full .wrapper .listItem {
    width: 100%;
  }
}
#listingTipologia section.web-project-col-full .wrapper .listItem a {
  position: relative;
  width: 100%;
  height: auto;
  text-decoration: none;
  display: block;
}
#listingTipologia section.web-project-col-full .wrapper .listItem a .wrp {
  position: relative;
  width: 100%;
  height: auto;
}
#listingTipologia section.web-project-col-full .wrapper .listItem a .wrp .imageprj {
  position: relative;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
}
#listingTipologia section.web-project-col-full .wrapper .listItem a .wrp .imageprj picture {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
}
#listingTipologia section.web-project-col-full .wrapper .listItem a .wrp .imageprj picture img {
  position: relative;
  width: 100%;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#listingTipologia section.web-project-col-full .wrapper .listItem a .wrp .imageprj .info {
  position: absolute;
  bottom: 0;
  left: -3.125vw;
}
#listingTipologia section.web-project-col-full .wrapper .listItem a .info {
  position: absolute;
  bottom: 0;
  left: 3.125vw;
  -webkit-transform: translateY(35%);
  transform: translateY(35%);
  width: 100%;
  z-index: 5;
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#listingTipologia section.web-project-col-full .wrapper .listItem a .info h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 3vw;
  line-height: 3vw;
  display: inline-block;
  text-indent: -5px;
}
#listingTipologia section.web-project-col-full .wrapper .listItem a .info h4 {
  position: absolute;
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 24px;
  line-height: 24px;
  margin-top: 10px;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.web-project-col-full .wrapper .listItem a .info {
    position: relative;
    bottom: auto;
    left: auto;
    margin-top: -1.5rem;
    overflow: visible;
    padding: 0 6.25vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  #listingTipologia section.web-project-col-full .wrapper .listItem a .info h3 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 2.7rem;
    line-height: 2.7rem;
  }
  #listingTipologia section.web-project-col-full .wrapper .listItem a .info h4 {
    position: relative;
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 0.9rem;
    line-height: 1rem;
  }
}
#listingTipologia section.draggableSection .aside-txt {
  position: absolute;
  left: 6.25vw;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
#listingTipologia section.draggableSection .aside-txt .txt__wrapper {
  position: relative;
}
#listingTipologia section.draggableSection .aside-txt .txt__wrapper span {
  text-transform: uppercase;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
}
#listingTipologia section.draggableSection .title {
  position: absolute;
  top: 50%;
  left: -5%;
  width: 110%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  opacity: 0.1;
}
#listingTipologia section.draggableSection .counter {
  position: absolute;
  bottom: 12.5vw;
  left: 75vw;
  /*overflow: hidden;
  opacity: 0;*/
  z-index: 10;
}
#listingTipologia section.draggableSection .counter span {
  line-height: 16px;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  float: left;
}
#listingTipologia section.draggableSection .counter span.current {
  color: var(--subColor);
}
#listingTipologia section.draggableSection .counter span.divider {
  content: "";
  background-color: var(--subColor);
  width: 6.25vw;
  margin: 7px 10px;
  height: 1px;
  display: inline-block;
}
#listingTipologia section.draggableSection .counter span.total {
  display: inline-block;
}
#listingTipologia section.draggableSection .list {
  position: relative;
  width: auto;
  height: 100%;
  z-index: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-transition-property: -webkit-transform;
  transition-property: -webkit-transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  padding-left: calc(50% - ((960*70vh) / 1440) / 2);
}
#listingTipologia section.draggableSection .list .item {
  position: relative;
  float: left;
  height: 70vh;
  margin: 7.5vh 0;
  width: 46.6666666667vh;
  margin-right: 3vw;
}
#listingTipologia section.draggableSection .list .item .info {
  position: absolute;
  bottom: 0;
  left: -30%;
  -webkit-transform: translateY(35%);
  transform: translateY(35%);
  width: 150%;
  z-index: 5;
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#listingTipologia section.draggableSection .list .item .info h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 5vw;
  line-height: 5vw;
  display: inline-block;
  text-indent: -5px;
}
#listingTipologia section.draggableSection .list .item .info h4 {
  position: absolute;
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 24px;
  line-height: 24px;
  margin-top: 20px;
}
#listingTipologia section.draggableSection .list .item .wrapper {
  position: relative;
  width: 100%;
  height: auto;
  z-index: 4;
}
#listingTipologia section.draggableSection .list .item .wrapper .image {
  position: relative;
  height: 70vh;
  width: 46.6666666667vh;
  z-index: 5;
  clip-path: polygon(20% 0%, 80% 0%, 80% 60%, 20% 60%);
  -webkit-clip-path: polygon(20% 0%, 80% 0%, 80% 60%, 20% 60%);
  -o-clip-path: polygon(20% 0%, 80% 0%, 80% 60%, 20% 60%);
  -ms-clip-path: polygon(20% 0%, 80% 0%, 80% 60%, 20% 60%);
}
#listingTipologia section.draggableSection .list .item .wrapper .image picture {
  height: 100%;
  width: auto;
}
#listingTipologia section.draggableSection .list .item .wrapper .image picture img {
  height: 100%;
  width: auto;
  -webkit-transform: scale(1.15);
  transform: scale(1.15);
}
#listingTipologia section.draggableSection .list .item .wrapper .titleItem {
  position: absolute;
  bottom: calc(-60px - 2.5vw);
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  opacity: 0;
  -webkit-transition: opacity 0.5s ease-in-out 0s;
  transition: opacity 0.5s ease-in-out 0s;
}
#listingTipologia section.draggableSection .list .item .wrapper .titleItem h4 {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  line-height: 24px;
  text-transform: uppercase;
}
#listingTipologia section.draggableSection .list .item:last-of-type {
  margin-right: 0;
}
#listingTipologia section.draggableSection .list .item[data-order="1"] .wrapper .image {
  clip-path: polygon(0.01% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0.01% 0%, 100% 0%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0.01% 0%, 100% 0%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0.01% 0%, 100% 0%, 100% 100%, 0% 100%);
}
#listingTipologia section.draggableSection .list .item[data-order="1"] .wrapper .image picture img {
  -webkit-transform: scale(1);
  transform: scale(1);
}
#listingTipologia section.draggableSection .list .item[data-order="2"] .wrapper .image {
  clip-path: polygon(20% 20%, 80% 20%, 80% 80%, 20% 80%);
  -webkit-clip-path: polygon(20% 20%, 80% 20%, 80% 80%, 20% 80%);
  -o-clip-path: polygon(20% 20%, 80% 20%, 80% 80%, 20% 80%);
  -ms-clip-path: polygon(20% 20%, 80% 20%, 80% 80%, 20% 80%);
}
#listingTipologia section.draggableSection .list .item.current-active-slide .info {
  opacity: 1;
  -webkit-transition: opacity 0.5s ease-in-out 0s;
  transition: opacity 0.5s ease-in-out 0s;
}
#listingTipologia section.draggableSection .list .item.current-active-slide .wrapper .titleItem {
  opacity: 1;
  -webkit-transition: opacity 0.5s ease-in-out 0s;
  transition: opacity 0.5s ease-in-out 0s;
}
#listingTipologia section.secondary-projects {
  position: relative;
  height: auto;
  padding-top: 10vh;
  padding-bottom: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.secondary-projects {
    padding-bottom: 10vh;
  }
}
#listingTipologia section.secondary-projects .table {
  position: relative;
  margin: 0 12.5vw;
  width: 75vw;
  overflow: hidden;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.secondary-projects .table {
    width: 87.5vw;
    margin: 0 auto;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.secondary-projects .table {
    width: 87.5vw;
    margin: 0 auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.secondary-projects .table {
    width: 87.5vw;
    margin: 0 auto;
  }
}
#listingTipologia section.secondary-projects .table .head {
  position: relative;
  width: 100%;
  float: left;
  height: auto;
  overflow: hidden;
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  border-bottom: 1px solid #fff;
  padding: 20px 0;
  opacity: 0;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.secondary-projects .table .head {
    border: none;
    padding-bottom: 0;
  }
}
#listingTipologia section.secondary-projects .table .head .cliente {
  width: 18.75vw;
  text-align: left;
  float: left;
  margin-left: 3.125vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.secondary-projects .table .head .cliente {
    margin-left: 0;
    width: 40.625vw;
  }
}
#listingTipologia section.secondary-projects .table .head .type {
  width: 21.875vw;
  text-align: left;
  float: left;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.secondary-projects .table .head .type {
    width: 46.875vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.secondary-projects .table .head .type {
    width: 23vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.secondary-projects .table .head .type {
    width: 23vw;
  }
}
#listingTipologia section.secondary-projects .table .head .works {
  width: 21.875vw;
  text-align: left;
  float: left;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.secondary-projects .table .head .works {
    display: none;
  }
}
#listingTipologia section.secondary-projects .table .head .link {
  width: 9.375vw;
  text-align: left;
  float: left;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.secondary-projects .table .head .link {
    display: none;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.secondary-projects .table .load-more__wrapper {
    position: relative;
    width: 100%;
    height: 0;
    overflow: hidden;
  }
}
#listingTipologia section.secondary-projects .table .body {
  position: relative;
  width: 100%;
  float: left;
  height: auto;
  overflow: hidden;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  border-bottom: 1px solid #fff;
  line-height: 40px;
  opacity: 0;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
}
#listingTipologia section.secondary-projects .table .body a {
  position: relative;
  display: block;
  width: 100%;
  overflow: hidden;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 1vw 0;
  text-decoration: none;
  color: #fff;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #listingTipologia section.secondary-projects .table .body {
    font-size: 18px;
    line-height: 36px;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.secondary-projects .table .body {
    padding: 0.75rem 0;
    font-size: 16px;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.secondary-projects .table .body.load-more {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
#listingTipologia section.secondary-projects .table .body .cliente {
  width: 18.75vw;
  text-align: left;
  float: left;
  margin-left: 3.125vw;
  color: #fff;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.secondary-projects .table .body .cliente {
    font-size: 16px;
    margin-left: 0;
    width: 40.625vw;
  }
}
#listingTipologia section.secondary-projects .table .body .type {
  width: 21.875vw;
  text-align: left;
  float: left;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.secondary-projects .table .body .type {
    width: 46.875vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.secondary-projects .table .body .type {
    width: 23vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.secondary-projects .table .body .type {
    width: 23vw;
  }
}
#listingTipologia section.secondary-projects .table .body .works {
  width: 21.875vw;
  text-align: left;
  float: left;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.secondary-projects .table .body .works {
    width: auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.secondary-projects .table .body .works {
    width: auto;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.secondary-projects .table .body .works {
    display: none;
  }
}
#listingTipologia section.secondary-projects .table .body .works img {
  position: relative;
  height: 40px;
  display: inline-block;
  width: auto;
  float: left;
}
#listingTipologia section.secondary-projects .table .body .works span {
  position: relative;
  display: inline-block;
  float: left;
  margin-right: 3.125vw;
  color: #fff;
  width: 100%;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.secondary-projects .table .body .works span {
    margin-left: 0;
    font-size: 16px;
    line-height: 22.4px;
    width: 100%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.secondary-projects .table .body .works span {
    width: 25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.secondary-projects .table .body .works span {
    width: 25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.secondary-projects .table .body .works span {
    width: 20vw;
  }
}
#listingTipologia section.secondary-projects .table .body .link {
  width: 6.25vw;
  margin-right: 0.5rem;
  text-align: right;
  float: left;
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia section.secondary-projects .table .body .link {
    display: none;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia section.secondary-projects .table .body .link {
    opacity: 1;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.secondary-projects .table .body .link {
    opacity: 1;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia section.secondary-projects .table .body .link {
    opacity: 1;
  }
}
#listingTipologia section.secondary-projects .table .body .link span {
  text-decoration: none;
  color: var(--subColor);
  text-transform: uppercase;
  font-size: 0.8rem;
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #listingTipologia section.secondary-projects .table .body {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 0.8rem;
    padding: 1rem 0;
  }
}
#listingTipologia section.secondary-projects .table .body:hover .link {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}

#listingTipologia-child * {
  -webkit-font-smoothing: antialiased;
}
#listingTipologia-child a {
  text-decoration: none;
}
#listingTipologia-child .img {
  line-height: 0;
}
#listingTipologia-child .img img {
  display: block;
  width: 100%;
}
#listingTipologia-child .desktop section {
  position: relative;
  width: 100%;
}
#listingTipologia-child .desktop section.first {
  padding-bottom: 5vh;
  width: 62.5vw;
  margin-left: 18.75vw;
}
#listingTipologia-child .desktop section.first h1 {
  position: relative;
  padding-top: 22vh;
  line-height: 10vw;
  z-index: 3;
  color: transparent;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
}
#listingTipologia-child .desktop section.first h1 span {
  display: block;
}
#listingTipologia-child .desktop section.first h1 span:first-of-type {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10vw;
  -webkit-text-stroke: 0;
}
#listingTipologia-child .desktop section.first .scroll-archives {
  position: absolute;
  top: 50%;
  right: -12.5vw;
}
#listingTipologia-child .desktop section.first .scroll-archives span {
  position: relative;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 2vw;
  text-transform: uppercase;
  line-height: 2vw;
  margin-right: 6.25vw;
  text-align: right;
  display: block;
  z-index: 5;
}
#listingTipologia-child .desktop section.first .scroll-archives .circle {
  position: absolute;
  top: calc(-1.5*6.25vw + 2vw);
  right: 0;
  z-index: 2;
  width: 18.75vw;
  z-index: 4;
}
#listingTipologia-child .desktop section.first .scroll-archives .circle svg {
  width: 100%;
  display: block;
  height: auto;
  fill: var(--mainColorD10);
  -webkit-animation-name: animation-rotation-dots;
          animation-name: animation-rotation-dots;
  -webkit-animation-duration: 30s;
          animation-duration: 30s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
#listingTipologia-child .desktop section.first .scroll-archives .arrow {
  position: absolute;
  top: 2vw;
  right: -1.5625vw;
  width: 9.375vw;
  z-index: 5;
}
#listingTipologia-child .desktop section.first .scroll-archives .arrow svg {
  fill: transparent;
  stroke-width: 5;
  stroke: var(--subColor);
}
#listingTipologia-child .desktop section.first .texts {
  position: relative;
  padding-top: 5rem;
  z-index: 5;
  width: 43.75vw;
}
#listingTipologia-child .desktop section.first .texts p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 30px;
  line-height: 40px;
  margin-bottom: 5vh;
}
#listingTipologia-child .desktop section.first .texts p:last-of-type {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  line-height: 30px;
  width: 40.625vw;
}
#listingTipologia-child .desktop section.first .image {
  position: absolute;
  top: calc(15vh + 3vw);
  left: 56.25vw;
  width: 21.875vw;
  z-index: 1;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
  /*opacity: 0;
  visibility: hidden;*/
}
#listingTipologia-child .desktop section.first .image picture {
  width: 100%;
  height: auto;
}
#listingTipologia-child .desktop section.first .image picture img {
  width: 100%;
  height: auto;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#listingTipologia-child .desktop section.first h3 {
  position: absolute;
  top: calc(60vh + 13vw);
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20vw;
  display: block;
  line-height: 18vw;
  text-align: right;
  left: 56.25vw;
  z-index: 3;
}
#listingTipologia-child .desktop section.first h3 span {
  position: relative;
  display: inline-block;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#listingTipologia-child .desktop section.first.web-digital .texts {
  position: absolute;
  top: calc(14vh + 22vw);
  left: 18.75vw;
  z-index: 5;
}
#listingTipologia-child .desktop section.first.web-digital .texts p {
  width: 43.75vw;
}
#listingTipologia-child .desktop section.first.web-digital .scroll-archives .circle svg {
  opacity: 0.5;
}
#listingTipologia-child .desktop section.draggableSection .counter {
  position: absolute;
  bottom: 12.5vw;
  left: 75vw;
  /*overflow: hidden;
  opacity: 0;*/
  z-index: 10;
}
#listingTipologia-child .desktop section.draggableSection .counter span {
  line-height: 16px;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  float: left;
}
#listingTipologia-child .desktop section.draggableSection .counter span.current {
  color: var(--subColor);
}
#listingTipologia-child .desktop section.draggableSection .counter span.divider {
  content: "";
  background-color: var(--subColor);
  width: 6.25vw;
  margin: 7px 10px;
  height: 1px;
  display: inline-block;
}
#listingTipologia-child .desktop section.draggableSection .counter span.total {
  display: inline-block;
}
#listingTipologia-child .desktop section.draggableSection .list {
  position: relative;
  width: auto;
  height: 100%;
  z-index: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-transition-property: -webkit-transform;
  transition-property: -webkit-transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  padding-left: calc(50% - ((960*70vh) / 1440) / 2);
}
#listingTipologia-child .desktop section.draggableSection .list .item {
  position: relative;
  float: left;
  height: 70vh;
  margin: 7.5vh 0;
  width: 46.6666666667vh;
  margin-right: 3vw;
}
#listingTipologia-child .desktop section.draggableSection .list .item .info {
  position: absolute;
  bottom: 0;
  left: -30%;
  -webkit-transform: translateY(35%);
  transform: translateY(35%);
  width: 150%;
  z-index: 5;
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#listingTipologia-child .desktop section.draggableSection .list .item .info h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 5vw;
  line-height: 5vw;
  display: inline-block;
}
#listingTipologia-child .desktop section.draggableSection .list .item .info h4 {
  position: absolute;
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 24px;
  line-height: 24px;
  margin-top: 20px;
}
#listingTipologia-child .desktop section.draggableSection .list .item .wrapper {
  position: relative;
  width: 100%;
  height: auto;
  z-index: 4;
}
#listingTipologia-child .desktop section.draggableSection .list .item .wrapper .image {
  position: relative;
  height: 70vh;
  width: 46.6666666667vh;
  z-index: 5;
  clip-path: polygon(20% 0%, 80% 0%, 80% 60%, 20% 60%);
  -webkit-clip-path: polygon(20% 0%, 80% 0%, 80% 60%, 20% 60%);
  -o-clip-path: polygon(20% 0%, 80% 0%, 80% 60%, 20% 60%);
  -ms-clip-path: polygon(20% 0%, 80% 0%, 80% 60%, 20% 60%);
}
#listingTipologia-child .desktop section.draggableSection .list .item .wrapper .image picture {
  height: 100%;
  width: auto;
}
#listingTipologia-child .desktop section.draggableSection .list .item .wrapper .image picture img {
  height: 100%;
  width: auto;
  -webkit-transform: scale(1.15);
  transform: scale(1.15);
}
#listingTipologia-child .desktop section.draggableSection .list .item .wrapper .titleItem {
  position: absolute;
  bottom: calc(-60px - 2.5vw);
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  opacity: 0;
  -webkit-transition: opacity 0.5s ease-in-out 0s;
  transition: opacity 0.5s ease-in-out 0s;
}
#listingTipologia-child .desktop section.draggableSection .list .item .wrapper .titleItem h4 {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  line-height: 24px;
  text-transform: uppercase;
}
#listingTipologia-child .desktop section.draggableSection .list .item:last-of-type {
  margin-right: 0;
}
#listingTipologia-child .desktop section.draggableSection .list .item[data-order="1"] .wrapper .image {
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}
#listingTipologia-child .desktop section.draggableSection .list .item[data-order="1"] .wrapper .image picture img {
  -webkit-transform: scale(1);
  transform: scale(1);
}
#listingTipologia-child .desktop section.draggableSection .list .item[data-order="2"] .wrapper .image {
  clip-path: polygon(20% 20%, 80% 20%, 80% 80%, 20% 80%);
  -webkit-clip-path: polygon(20% 20%, 80% 20%, 80% 80%, 20% 80%);
  -o-clip-path: polygon(20% 20%, 80% 20%, 80% 80%, 20% 80%);
  -ms-clip-path: polygon(20% 20%, 80% 20%, 80% 80%, 20% 80%);
}
#listingTipologia-child .desktop section.draggableSection .list .item.current-active-slide .info {
  opacity: 1;
  -webkit-transition: opacity 0.5s ease-in-out 0s;
  transition: opacity 0.5s ease-in-out 0s;
}
#listingTipologia-child .desktop section.draggableSection .list .item.current-active-slide .wrapper .titleItem {
  opacity: 1;
  -webkit-transition: opacity 0.5s ease-in-out 0s;
  transition: opacity 0.5s ease-in-out 0s;
}
#listingTipologia-child .mobile .sezione-title .title__wrapper {
  padding-top: 7.5rem;
  margin: 0 auto;
  width: 87.5vw;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia-child .mobile .sezione-title .title__wrapper {
    padding-top: 12.5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia-child .mobile .sezione-title .title__wrapper {
    padding-top: 12.5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia-child .mobile .sezione-title .title__wrapper {
    padding-top: 15rem;
  }
}
#listingTipologia-child .mobile .sezione-title .title__wrapper .title__top h1 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 3rem;
  line-height: 3rem;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia-child .mobile .sezione-title .title__wrapper .title__top h1 {
    font-size: 10vw;
    line-height: 10vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia-child .mobile .sezione-title .title__wrapper .title__top h1 {
    font-size: 10vw;
    line-height: 10vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia-child .mobile .sezione-title .title__wrapper .title__top h1 {
    font-size: 10vw;
    line-height: 10vw;
  }
}
#listingTipologia-child .mobile .sezione-title .title__wrapper .title__bottom h1 {
  color: transparent;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 3rem;
  line-height: 3rem;
  -webkit-text-stroke: 1px var(--subColor);
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia-child .mobile .sezione-title .title__wrapper .title__bottom h1 {
    font-size: 10vw;
    line-height: 10vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia-child .mobile .sezione-title .title__wrapper .title__bottom h1 {
    font-size: 10vw;
    line-height: 10vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia-child .mobile .sezione-title .title__wrapper .title__bottom h1 {
    font-size: 10vw;
    line-height: 10vw;
  }
}
#listingTipologia-child .mobile .sezione-title .subtitle {
  position: relative;
  margin-top: 2.5rem;
  width: 87.5vw;
  margin: 2.5rem auto 5rem auto;
}
#listingTipologia-child .mobile .sezione-title .subtitle p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 1.68rem;
  margin-bottom: 1.25rem;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia-child .mobile .sezione-title .subtitle p {
    font-size: 30px;
    line-height: 40px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia-child .mobile .sezione-title .subtitle p {
    font-size: 30px;
    line-height: 40px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia-child .mobile .sezione-title .subtitle p {
    font-size: 30px;
    line-height: 40px;
  }
}
#listingTipologia-child .mobile .sezione-title .subtitle p:last-of-type {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 0.9rem;
  line-height: 1.08rem;
  margin-bottom: 0;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia-child .mobile .sezione-title .subtitle p:last-of-type {
    font-size: 20px;
    line-height: 30px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia-child .mobile .sezione-title .subtitle p:last-of-type {
    font-size: 20px;
    line-height: 30px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia-child .mobile .sezione-title .subtitle p:last-of-type {
    font-size: 20px;
    line-height: 30px;
  }
}
#listingTipologia-child .mobile .sezione-title .scroll-archives {
  position: absolute;
  right: 12.5vw;
  top: 12.5rem;
}
#listingTipologia-child .mobile .sezione-title .scroll-archives span {
  position: relative;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 0.9rem;
  line-height: 1.08rem;
  text-transform: uppercase;
  margin-right: 6.25vw;
  text-align: right;
  display: block;
  z-index: 5;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#listingTipologia-child .mobile .sezione-title .scroll-archives .circle {
  position: absolute;
  width: 40vw;
  top: -15vw;
  right: -10vw;
  z-index: 2;
  opacity: 0;
  z-index: 4;
}
#listingTipologia-child .mobile .sezione-title .scroll-archives .circle svg {
  width: 100%;
  display: block;
  height: auto;
  fill: var(--mainColorD10);
  -webkit-animation-name: animation-rotation-dots;
          animation-name: animation-rotation-dots;
  -webkit-animation-duration: 30s;
          animation-duration: 30s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
#listingTipologia-child .mobile .sezione-title .scroll-archives .arrow {
  position: absolute;
  top: 2vw;
  right: -1.5625vw;
  width: 9.375vw;
  z-index: 5;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia-child .mobile .sezione-title .scroll-archives .arrow {
    width: 20vw;
    right: -10vw;
    top: 5vw;
  }
}
#listingTipologia-child .mobile .sezione-title .scroll-archives .arrow svg {
  fill: transparent;
  stroke-width: 5;
  stroke: var(--subColor);
}
#listingTipologia-child .mobile .sezione-listing {
  position: relative;
  overflow: hidden;
}
#listingTipologia-child .mobile .sezione-listing .listing__wrapper {
  position: relative;
  width: 87.5vw;
  margin: 0 auto;
}
#listingTipologia-child .mobile .sezione-listing .listing__wrapper .listing__item {
  padding-bottom: 3.75rem;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia-child .mobile .sezione-listing .listing__wrapper .listing__item {
    width: 40.625vw;
    float: left;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia-child .mobile .sezione-listing .listing__wrapper .listing__item {
    width: 40.625vw;
    float: left;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia-child .mobile .sezione-listing .listing__wrapper .listing__item {
    width: 40.625vw;
    float: left;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia-child .mobile .sezione-listing .listing__wrapper .listing__item:nth-child(even) {
    margin-left: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia-child .mobile .sezione-listing .listing__wrapper .listing__item:nth-child(even) {
    margin-left: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia-child .mobile .sezione-listing .listing__wrapper .listing__item:nth-child(even) {
    margin-left: 6.25vw;
  }
}
#listingTipologia-child .mobile .sezione-listing .listing__wrapper .listing__item .item__caption {
  position: relative;
  margin-top: -2rem;
  padding: 0 6.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia-child .mobile .sezione-listing .listing__wrapper .listing__item .item__caption {
    margin-top: -1.5rem;
    overflow: visible;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia-child .mobile .sezione-listing .listing__wrapper .listing__item .item__caption {
    padding-left: 3.125vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia-child .mobile .sezione-listing .listing__wrapper .listing__item .item__caption {
    padding-left: 3.125vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia-child .mobile .sezione-listing .listing__wrapper .listing__item .item__caption {
    padding-left: 3.125vw;
  }
}
#listingTipologia-child .mobile .sezione-listing .listing__wrapper .listing__item .item__caption .caption__wrapper {
  position: relative;
  overflow: hidden;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia-child .mobile .sezione-listing .listing__wrapper .listing__item .item__caption .caption__wrapper {
    overflow: visible;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #listingTipologia-child .mobile .sezione-listing .listing__wrapper .listing__item .item__caption .caption__wrapper {
    overflow: visible;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia-child .mobile .sezione-listing .listing__wrapper .listing__item .item__caption .caption__wrapper {
    overflow: visible;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #listingTipologia-child .mobile .sezione-listing .listing__wrapper .listing__item .item__caption .caption__wrapper {
    overflow: visible;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia-child .mobile .sezione-listing .listing__wrapper .listing__item .item__caption .caption__wrapper .item__titolo {
    margin-top: 0.5rem;
  }
}
#listingTipologia-child .mobile .sezione-listing .listing__wrapper .listing__item .item__caption .caption__wrapper h3 {
  position: relative;
  line-height: 3.6rem;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 3rem;
  text-transform: none;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #listingTipologia-child .mobile .sezione-listing .listing__wrapper .listing__item .item__caption .caption__wrapper h3 {
    font-size: 2.7rem;
    line-height: 2.7rem;
  }
}
#listingTipologia-child .mobile .sezione-listing .listing__wrapper .listing__item .item__caption .caption__wrapper h2 {
  position: relative;
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 1.4rem;
  line-height: 1.68rem;
  -webkit-text-stroke: 0;
  text-transform: none;
  margin-bottom: 10px;
  -webkit-text-stroke: unset;
}

#singleProject {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject {
    padding-bottom: 10rem;
  }
}
#singleProject a {
  text-decoration: none;
}
#singleProject .js-stagger {
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #singleProject .js-stagger {
    -webkit-transform: translateY(0vh);
    transform: translateY(0vh);
    opacity: 1;
  }
}
#singleProject .goBack {
  position: absolute;
  top: 50vh;
  left: 3.125vw;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  visibility: hidden;
  opacity: 0;
  -webkit-transition: visibility 0.5s, opacity 0.5s;
  transition: visibility 0.5s, opacity 0.5s;
  z-index: 5;
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .goBack {
    position: fixed;
  }
}
#singleProject .goBack .st0 {
  fill: var(--subColor);
}
#singleProject .goBack a {
  text-decoration: none;
}
#singleProject .goBack a .cont {
  position: relative;
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}
#singleProject .goBack a .cont span {
  position: absolute;
  top: 50%;
  right: calc(100% + 1rem);
  white-space: nowrap;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  -webkit-transform-origin: top left;
          transform-origin: top left;
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  text-transform: uppercase;
  margin-bottom: 5px;
  letter-spacing: 2px;
  -webkit-font-smoothing: antialiased;
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#singleProject .goBack a .cont svg {
  width: 50px;
  fill: var(--subColor);
  display: block;
}
#singleProject .goBack:hover a .cont span {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#singleProject .goBack.show {
  visibility: visible;
  opacity: 1;
  -webkit-transition: visibility 0.5s, opacity 0.5s;
  transition: visibility 0.5s, opacity 0.5s;
}
#singleProject .featImage {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
  background-color: var(--subColor);
  /*clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);*/
  overflow: hidden;
}
#singleProject .featImage picture {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
  z-index: 2;
}
#singleProject .featImage picture img {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
  /*clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  @include scale(1.4);*/
}
#singleProject .featImage .cover {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.2);
  z-index: 3;
}
#singleProject .featImage .mainText {
  position: absolute;
  left: 50%;
  top: 50vh;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: 4;
  width: calc(100% - 2*6.25vw);
  text-align: center;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .featImage .mainText {
    top: 50%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .featImage .mainText {
    top: 50%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .featImage .mainText {
    top: 50%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .featImage .mainText {
    top: 50%;
  }
}
#singleProject .featImage .mainText h1 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 9vw;
  line-height: 9vw;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#singleProject .sezione-infoProject-mobile .infoProject-mobile {
  position: relative;
  float: none;
  padding: 0 6.25vw;
  margin: 6.25vw auto 0 auto;
  width: 87.5vw;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #singleProject .sezione-infoProject-mobile .infoProject-mobile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-left: 12.5vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .sezione-infoProject-mobile .infoProject-mobile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #singleProject .sezione-infoProject-mobile .infoProject-mobile .sub-row.right {
    margin-left: 10rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .sezione-infoProject-mobile .infoProject-mobile .sub-row.right {
    margin-left: 10rem;
  }
}
#singleProject .sezione-infoProject-mobile .infoProject-mobile ul {
  list-style-type: none;
  margin-bottom: 20px;
}
#singleProject .sezione-infoProject-mobile .infoProject-mobile ul li span.text {
  margin-bottom: 0rem;
}
#singleProject .sezione-infoProject-mobile .infoProject-mobile span {
  position: relative;
  display: block;
}
#singleProject .sezione-infoProject-mobile .infoProject-mobile span.title {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  text-transform: uppercase;
  margin-bottom: 5px;
  letter-spacing: 2px;
  -webkit-font-smoothing: antialiased;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .sezione-infoProject-mobile .infoProject-mobile span.title {
    margin-bottom: 0;
  }
}
#singleProject .sezione-infoProject-mobile .infoProject-mobile span.text {
  margin-bottom: 20px;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  width: 100%;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #singleProject .sezione-infoProject-mobile .infoProject-mobile span.text {
    line-height: 16px;
  }
}
#singleProject .sezione-infoProject-mobile .infoProject-mobile span.text a {
  color: #fff;
  line-height: 16px;
}
#singleProject .sezione-infoProject-mobile .infoProject-mobile span.text a em {
  position: relative;
  float: left;
  font-style: normal;
}
#singleProject .sezione-infoProject-mobile .infoProject-mobile span.fromTop {
  margin-top: 10vh;
}
#singleProject .featVideo {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
}
#singleProject .featVideo video {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
  z-index: 2;
}
#singleProject .featVideo .cover {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 6;
  opacity: 0.4;
}
#singleProject .featVideo .mainText {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: 7;
  width: 100%;
  text-align: center;
}
#singleProject .featVideo .mainText h1 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 9vw;
  line-height: 9vw;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#singleProject .write2UsProject {
  position: relative;
  width: 81.25vw;
  height: auto;
  padding: 0 9.375vw;
  z-index: 9;
}
#singleProject .write2UsProject .wrapper {
  position: relative;
  float: left;
  -webkit-transform: translateY(-2.5vw);
  transform: translateY(-2.5vw);
}
#singleProject .write2UsProject .wrapper h3 {
  color: transparent;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 4vw;
  font-weight: 500;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
  line-height: 4vw;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#singleProject .write2UsProject .wrapper h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 4vw;
  -webkit-font-smoothing: antialiased;
  line-height: 4vw;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#singleProject .write2UsProject .writeUsbtnProject {
  position: relative;
  float: left;
  width: 6.25vw;
  height: 6.25vw;
  border-radius: 50%;
  background-color: transparent;
  -webkit-transform: translate(-75%, 2.5vw);
  transform: translate(-75%, 2.5vw);
  cursor: pointer;
  overflow: hidden;
  opacity: 0;
}
#singleProject .write2UsProject .writeUsbtnProject:hover path {
  -webkit-transform: scale(0);
  transform: scale(0);
}
#singleProject .write2UsProject .writeUsbtnProject path {
  -webkit-transform-origin: center center;
          transform-origin: center center;
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: all 0.2s linear 0s;
  transition: all 0.2s linear 0s;
}
#singleProject .write2UsProject .writeUsbtnProject a {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
}
#singleProject .write2UsProject .writeUsbtnProject .image-circle {
  position: relative;
  width: 6.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .write2UsProject .writeUsbtnProject .image-circle {
    width: auto;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .write2UsProject .writeUsbtnProject .image-circle {
    width: auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .write2UsProject .writeUsbtnProject .image-circle {
    width: auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .write2UsProject .writeUsbtnProject .image-circle {
    width: auto;
  }
}
#singleProject .write2UsProject .writeUsbtnProject .image-circle .svg-circle {
  fill: var(--subColor);
}
#singleProject .write2UsProject .writeUsbtnProject .image-fumetto {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 30px;
  height: 30px;
}
#singleProject .write2UsProject .writeUsbtnProject .image-fumetto .svg-fumetto {
  fill: #fff;
}
#singleProject .write2UsProject .writeUsbtnProject svg {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#singleProject .write2UsProject .writeUsbtnProject.btnAnimated svg {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0.3s;
  transition: opacity 0.35s ease-in-out 0.3s;
}
#singleProject .write2UsProject .writeUsbtnProject.btnAnimated:before {
  height: 100%;
  -webkit-transition: height 0.35s ease-in-out 0s;
  transition: height 0.35s ease-in-out 0s;
}
#singleProject .write2UsProject.dark_mode__ON .writeUsbtnProject svg {
  fill: var(--mainColor);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .write2UsProject {
    width: 87.5vw;
    padding: 6.25vw;
  }
  #singleProject .write2UsProject .wrapper {
    float: none;
    z-index: 2;
  }
  #singleProject .write2UsProject .wrapper h3 {
    color: transparent;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 3rem;
    -webkit-text-stroke: 1px #fff;
    line-height: 3.6rem;
  }
  #singleProject .write2UsProject .wrapper h2 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 3rem;
    line-height: 3.6rem;
  }
  #singleProject .write2UsProject .writeUsbtnProject {
    position: absolute;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    top: 0;
    right: 6.25vw;
    left: auto;
    float: none;
    display: block;
    margin-top: 0;
    margin-left: 0;
    width: 25vw;
    height: 25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .write2UsProject {
    width: 87.5vw;
  }
  #singleProject .write2UsProject .wrapper {
    -webkit-transform: translateY(-5vw);
    transform: translateY(-5vw);
  }
  #singleProject .write2UsProject .wrapper h3 {
    font-size: 10vw;
    line-height: 10vw;
  }
  #singleProject .write2UsProject .wrapper h2 {
    font-size: 10vw;
    line-height: 10vw;
  }
  #singleProject .write2UsProject .writeUsbtnProject {
    -webkit-transform: translate(-75%, 7.5vw);
    transform: translate(-75%, 7.5vw);
    width: 15.625vw;
    height: 15.625vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .write2UsProject {
    width: 87.5vw;
  }
  #singleProject .write2UsProject .wrapper {
    -webkit-transform: translateY(-5vw);
    transform: translateY(-5vw);
  }
  #singleProject .write2UsProject .wrapper h3 {
    font-size: 10vw;
    line-height: 10vw;
  }
  #singleProject .write2UsProject .wrapper h2 {
    font-size: 10vw;
    line-height: 10vw;
  }
  #singleProject .write2UsProject .writeUsbtnProject {
    -webkit-transform: translate(-75%, 7.5vw);
    transform: translate(-75%, 7.5vw);
    width: 15.625vw;
    height: 15.625vw;
  }
}
#singleProject .write2UsProject.videow2u {
  height: 40vh;
}
#singleProject .write2UsProject.videow2u .wrapper {
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
}
#singleProject .write2UsProject.videow2u .writeUsbtnProject {
  -webkit-transform: translate(-5vw, 20vh);
  transform: translate(-5vw, 20vh);
}
#singleProject .nextProject {
  position: relative;
  width: 100vw;
  height: auto;
  overflow: hidden;
  margin: 18.75vw 0 6.25vw 0;
  text-align: right;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .nextProject {
    width: 87.5vw;
    margin: 0;
    padding: 12.5vw 6.25vw;
    text-align: left;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .nextProject {
    width: 87.5vw;
    padding: 18.75vw 6.25vw 0 6.25vw;
    text-align: left;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .nextProject {
    width: 87.5vw;
    padding: 18.75vw 6.25vw 0 6.25vw;
    text-align: left;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .nextProject {
    padding-top: 9.375vw;
  }
}
#singleProject .nextProject .goToNextProject__cta-mobile {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 6rem;
  height: 6rem;
  border-radius: 100px;
  border: 1px solid var(--subColor);
  border: 1px solid var(--col-back-project);
  z-index: 2;
}
#singleProject .nextProject .goToNextProject__cta-mobile .cta__wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
#singleProject .nextProject .goToNextProject__cta-mobile .cta__wrapper p.cta__text {
  font-family: "Monument Grotesk";
  color: white;
  font-size: 0.9rem;
  text-transform: uppercase;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .nextProject .goToNextProject__cta-mobile .cta__wrapper p.cta__text {
    font-size: 1.6rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .nextProject .goToNextProject__cta-mobile .cta__wrapper p.cta__text {
    font-size: 1.6rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .nextProject .goToNextProject__cta-mobile .cta__wrapper p.cta__text {
    font-size: 1.6rem;
  }
}
#singleProject .nextProject.nextVid .nextProjectVideo {
  position: relative;
  width: 75vw;
  margin: 6.25vw 12.5vw 0 12.5vw;
  height: auto;
  background-color: var(--col-back-project);
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .nextProject.nextVid .nextProjectVideo {
    width: 87.5vw;
    margin: 6.25vw auto;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .nextProject.nextVid .nextProjectVideo {
    width: 87.5vw;
    margin: 6.25vw auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .nextProject.nextVid .nextProjectVideo {
    width: 87.5vw;
    margin: 6.25vw auto;
  }
}
#singleProject .nextProject.nextVid .nextProjectVideo video {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#singleProject .nextProject.nextSite .nextProjectVideo {
  position: relative;
  width: 75vw;
  margin: 6.25vw 12.5vw 0 12.5vw;
  height: auto;
  background-color: var(--col-back-project);
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
}
#singleProject .nextProject.nextSite .nextProjectVideo video {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#singleProject .nextProject .nextProjectMarquees {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 100%;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .nextProject .nextProjectMarquees {
    position: relative;
    top: 0;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
#singleProject .nextProject .nextProjectMarquees h3 {
  font-size: 4vw;
  line-height: 4vw;
  color: transparent;
  -webkit-text-stroke: 2px #fff;
  -webkit-font-smoothing: antialiased;
  white-space: nowrap;
  font-family: "Monument Grotesk";
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .nextProject .nextProjectMarquees h3 {
    font-size: 1.9rem;
    line-height: 2.28rem;
    -webkit-text-stroke: 1px #fff;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .nextProject .nextProjectMarquees h3 {
    font-size: 6vw;
    line-height: 6vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .nextProject .nextProjectMarquees h3 {
    font-size: 6vw;
    line-height: 6vw;
  }
}
#singleProject .nextProject .nextProjectMarquees .one {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
#singleProject .nextProject .nextProjectMarquees .two {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
#singleProject .nextProject .nextProjectMarquees .two h3 {
  color: white;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 4vw;
  font-weight: bold;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .nextProject .nextProjectMarquees .two h3 {
    font-size: 1.9rem;
    line-height: 2.28rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .nextProject .nextProjectMarquees .two h3 {
    font-size: 6vw;
    line-height: 6vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .nextProject .nextProjectMarquees .two h3 {
    font-size: 6vw;
    line-height: 6vw;
  }
}
#singleProject .nextProject .nextProjectMarquees .three {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-transform: translateX(-60%);
  transform: translateX(-60%);
}
#singleProject .nextProject .nxPr {
  position: relative;
  mix-blend-mode: difference;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .nextProject .nxPr {
    margin-top: 1.25rem;
    mix-blend-mode: unset;
  }
}
#singleProject .nextProject .nxPr .nextProjectImage {
  position: relative;
  width: 75vw;
  margin: 0vw 12.5vw 0 12.5vw;
  height: auto;
  background-color: var(--col-back-project);
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .nextProject .nxPr .nextProjectImage {
    width: 87.5vw;
    margin-left: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .nextProject .nxPr .nextProjectImage {
    width: 87.5vw;
    margin-left: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .nextProject .nxPr .nextProjectImage {
    width: 87.5vw;
    margin-left: 0;
  }
}
#singleProject .nextProject .nxPr .nextProjectImage a.goToNextProject {
  position: relative;
  display: block;
}
#singleProject .nextProject .nxPr .nextProjectImage a.goToNextProject .goToNextProject__cta-mobile {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 6rem;
  height: 6rem;
  border-radius: 100px;
  border: 3px solid var(--col-back-project);
  z-index: 2;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .nextProject .nxPr .nextProjectImage a.goToNextProject .goToNextProject__cta-mobile {
    width: 7.5rem;
    height: 7.5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .nextProject .nxPr .nextProjectImage a.goToNextProject .goToNextProject__cta-mobile {
    width: 7.5rem;
    height: 7.5rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .nextProject .nxPr .nextProjectImage a.goToNextProject .goToNextProject__cta-mobile {
    width: 7.5rem;
    height: 7.5rem;
  }
}
#singleProject .nextProject .nxPr .nextProjectImage a.goToNextProject .goToNextProject__cta-mobile .cta__wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
#singleProject .nextProject .nxPr .nextProjectImage a.goToNextProject .goToNextProject__cta-mobile .cta__wrapper p.cta__text {
  font-family: "Monument Grotesk";
  color: white;
  font-size: 0.7rem;
  text-transform: uppercase;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .nextProject .nxPr .nextProjectImage a.goToNextProject .goToNextProject__cta-mobile .cta__wrapper p.cta__text {
    font-size: 1rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .nextProject .nxPr .nextProjectImage a.goToNextProject .goToNextProject__cta-mobile .cta__wrapper p.cta__text {
    font-size: 1rem;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .nextProject .nxPr .nextProjectImage a.goToNextProject .goToNextProject__cta-mobile .cta__wrapper p.cta__text {
    font-size: 1rem;
  }
}
#singleProject .nextProject .nxPr .nextProjectImage picture {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
#singleProject .nextProject .nxPr .nextProjectImage picture img {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#singleProject .nextProject .nxPr .nextProjectBtn {
  position: absolute;
  right: 8.125vw;
  top: 50%;
  width: 6.25vw;
  height: 6.25vw;
  border-radius: 50%;
  background-color: transparent;
  margin-left: 3.125vw;
  cursor: pointer;
  overflow: hidden;
  opacity: 0;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: 5;
}
#singleProject .nextProject .nxPr .nextProjectBtn svg {
  fill: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 30px;
  height: 30px;
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#singleProject .nextProject .nxPr .nextProjectBtn:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0;
  background-color: #fff;
  -webkit-transition: height 0.35s ease-in-out 0s;
  transition: height 0.35s ease-in-out 0s;
}
#singleProject .nextProject .nxPr .nextProjectBtn.btnAnimated svg {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0.3s;
  transition: opacity 0.35s ease-in-out 0.3s;
}
#singleProject .nextProject .nxPr .nextProjectBtn.btnAnimated:before {
  height: 100%;
  -webkit-transition: height 0.35s ease-in-out 0s;
  transition: height 0.35s ease-in-out 0s;
}
#singleProject .nextProject .tx {
  position: absolute;
  top: 50%;
  right: 9.375vw;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
#singleProject .nextProject .tx .wrapper {
  position: relative;
  float: right;
  text-align: right;
  padding-right: 9.375vw;
  z-index: 2;
}
#singleProject .nextProject .tx .wrapper h4 {
  position: relative;
  color: var(--col-back-project);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  text-transform: uppercase;
  -webkit-font-smoothing: antialiased;
  letter-spacing: 5px;
  line-height: 20px;
  opacity: 0;
  width: 100%;
  display: block;
}
#singleProject .nextProject .tx .wrapper .tit {
  position: relative;
  float: left;
  width: 100%;
  display: block;
}
#singleProject .nextProject .tx .wrapper .tit h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 4vw;
  -webkit-font-smoothing: antialiased;
  line-height: 4vw;
  width: 100%;
  display: block;
}
#singleProject .nextProject .tx .wrapper .tit h2 span {
  position: relative;
  -webkit-transform: scale(1.6);
  transform: scale(1.6);
  opacity: 0;
  display: inline-block;
}
#singleProject .nextProject .tx .wrapper .cli {
  position: relative;
  float: left;
  width: 100%;
  display: block;
}
#singleProject .nextProject .tx .wrapper .cli h3 {
  color: transparent;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 4vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--col-back-project);
  line-height: 4vw;
  width: 100%;
  display: block;
}
#singleProject .nextProject .tx .wrapper .cli h3 span {
  position: relative;
  -webkit-transform: scale(1.6);
  transform: scale(1.6);
  opacity: 0;
  display: inline-block;
}
#singleProject .nextProject .tx a {
  position: absolute;
  right: 0;
  top: 50%;
  width: 6.25vw;
  height: 6.25vw;
  border-radius: 50%;
  background-color: transparent;
  margin-left: 3.125vw;
  cursor: pointer;
  overflow: hidden;
  opacity: 0;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: 5;
}
#singleProject .nextProject .tx a svg {
  fill: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 30px;
  height: 30px;
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#singleProject .nextProject .tx a:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0;
  background-color: var(--col-back-project);
  -webkit-transition: height 0.35s ease-in-out 0s;
  transition: height 0.35s ease-in-out 0s;
}
#singleProject .nextProject .tx a.btnAnimated svg {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0.3s;
  transition: opacity 0.35s ease-in-out 0.3s;
}
#singleProject .nextProject .tx a.btnAnimated:before {
  height: 100%;
  -webkit-transition: height 0.35s ease-in-out 0s;
  transition: height 0.35s ease-in-out 0s;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .nextProject .tx {
    position: relative;
    top: auto;
    right: auto;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  #singleProject .nextProject .tx a {
    position: relative;
    right: auto;
    top: auto;
    width: 25vw;
    height: 25vw;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    margin-left: 0;
    margin-top: 6.25vw;
    float: left;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
  #singleProject .nextProject .tx .wrapper {
    float: left;
    text-align: left;
    padding-right: 0;
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    margin-top: 6.25vw;
  }
  #singleProject .nextProject .tx .wrapper h4 {
    color: var(--col-back-project);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    letter-spacing: 0px;
    line-height: 20px;
  }
  #singleProject .nextProject .tx .wrapper .tit h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
  }
  #singleProject .nextProject .tx .wrapper .cli h3 {
    color: var(--col-back-project);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    -webkit-text-stroke: 0 var(--col-back-project);
    line-height: 10vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .nextProject .tx {
    position: relative;
    top: auto;
    right: auto;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  #singleProject .nextProject .tx a {
    position: relative;
    right: auto;
    top: auto;
    width: 25vw;
    height: 25vw;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    margin-left: 0;
    margin-top: 6.25vw;
    float: left;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
  #singleProject .nextProject .tx .wrapper {
    float: left;
    text-align: left;
    padding-right: 0;
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    margin-top: 6.25vw;
  }
  #singleProject .nextProject .tx .wrapper h4 {
    color: var(--col-back-project);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    letter-spacing: 0px;
    line-height: 20px;
  }
  #singleProject .nextProject .tx .wrapper .tit h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
  }
  #singleProject .nextProject .tx .wrapper .cli h3 {
    color: var(--col-back-project);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    -webkit-text-stroke: 0 var(--col-back-project);
    line-height: 10vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .nextProject .tx {
    position: relative;
    top: auto;
    right: auto;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  #singleProject .nextProject .tx a {
    position: relative;
    right: auto;
    top: auto;
    width: 25vw;
    height: 25vw;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    margin-left: 0;
    margin-top: 6.25vw;
    float: left;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
  #singleProject .nextProject .tx .wrapper {
    float: left;
    text-align: left;
    padding-right: 0;
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    margin-top: 6.25vw;
  }
  #singleProject .nextProject .tx .wrapper h4 {
    color: var(--col-back-project);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    letter-spacing: 0px;
    line-height: 20px;
  }
  #singleProject .nextProject .tx .wrapper .tit h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
  }
  #singleProject .nextProject .tx .wrapper .cli h3 {
    color: var(--col-back-project);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    -webkit-text-stroke: 0 var(--col-back-project);
    line-height: 10vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .nextProject .tx {
    position: relative;
    top: auto;
    right: auto;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  #singleProject .nextProject .tx a {
    position: relative;
    right: auto;
    top: auto;
    width: 25vw;
    height: 25vw;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    margin-left: 0;
    margin-top: 6.25vw;
    float: left;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
  #singleProject .nextProject .tx .wrapper {
    float: left;
    text-align: left;
    padding-right: 0;
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    margin-top: 6.25vw;
  }
  #singleProject .nextProject .tx .wrapper h4 {
    color: var(--col-back-project);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    letter-spacing: 0px;
    line-height: 20px;
  }
  #singleProject .nextProject .tx .wrapper .tit h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
  }
  #singleProject .nextProject .tx .wrapper .cli h3 {
    color: var(--col-back-project);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    -webkit-text-stroke: 0 var(--col-back-project);
    line-height: 10vw;
  }
}
#singleProject .nextProject.dark_mode__ON .tx .wrapper h4 {
  color: var(--subColor);
}
#singleProject .nextProject.dark_mode__ON .tx .wrapper .cli h3 {
  -webkit-text-stroke: 2px var(--subColor);
}
#singleProject .nextProject.dark_mode__ON .tx a:before {
  background-color: var(--subColor);
}
#singleProject .nextProject.dark_mode__ON .tx a svg {
  fill: var(--mainColor);
}
#singleProject .videoControls .playPause {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 4.6875vw;
  height: 4.6875vw;
  background-color: var(--subColor);
  border-radius: 50%;
}
#singleProject .videoControls .playPause:hover path {
  -webkit-transform: scale(0);
  transform: scale(0);
}
#singleProject .videoControls .playPause path {
  -webkit-transform-origin: center center;
          transform-origin: center center;
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: all 0.2s linear 0s;
  transition: all 0.2s linear 0s;
}
#singleProject .videoControls .playPause[data-status=pause] .play {
  position: absolute;
  top: 50%;
  left: calc(50% + 5px);
  width: 30px;
  height: 30px;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
#singleProject .videoControls .playPause[data-status=pause] .play svg {
  position: relative;
  width: 100%;
  height: 100%;
  fill: #fff;
}
#singleProject .videoControls .playPause[data-status=pause] .pause {
  position: absolute;
  top: 50%;
  left: calc(50% + 5px);
  width: 30px;
  height: 30px;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  opacity: 0;
}
#singleProject .videoControls .playPause[data-status=pause] .pause svg {
  position: relative;
  width: 100%;
  height: 100%;
  fill: #fff;
}
#singleProject .videoControls .playPause[data-status=play] .play {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 30px;
  height: 30px;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  opacity: 0;
}
#singleProject .videoControls .playPause[data-status=play] .play svg {
  position: relative;
  width: 100%;
  height: 100%;
  fill: #fff;
}
#singleProject .videoControls .playPause[data-status=play] .pause {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 30px;
  height: 30px;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
#singleProject .videoControls .playPause[data-status=play] .pause svg {
  position: relative;
  width: 100%;
  height: 100%;
  fill: #fff;
}
#singleProject .videoControls .controlBar {
  position: absolute;
  bottom: 60px;
  right: 10px;
  width: 40px;
  height: 40px;
  background-color: var(--subColor);
  border-radius: 20px;
  -webkit-transition: width 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s;
}
#singleProject .videoControls .controlBar .cntBar {
  position: absolute;
  right: 60px;
  top: 17px;
  width: calc(100% - 80px);
  height: 6px;
  background-color: rgba(0, 0, 0, 0.3);
  border: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}
#singleProject .videoControls .controlBar .cntBar .noUi-handle {
  display: none;
}
#singleProject .videoControls .controlBar .cntBar .noUi-base .noUi-connects .noUi-connect {
  background-color: rgba(0, 0, 0, 0.5);
}
#singleProject .videoControls .controlBar .time {
  position: relative;
  float: right;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  text-align: center;
}
#singleProject .videoControls .controlBar .time span {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  line-height: 40px;
  -webkit-font-smoothing: antialiased;
}
#singleProject .videoControls .controlBar .time span em {
  font-style: normal;
}
#singleProject .videoControls .controlBar.active {
  width: 12.5vw;
  -webkit-transition: width 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s;
}
#singleProject .videoControls .controlVolume {
  position: absolute;
  bottom: 10px;
  right: 10px;
  width: 40px;
  background-color: var(--subColor);
  border-radius: 20px;
  overflow: hidden;
  -webkit-transition: width 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s;
}
#singleProject .videoControls .controlVolume .volumeIcon {
  position: relative;
  width: 40px;
  height: 40px;
  float: right;
  border-radius: 50%;
}
#singleProject .videoControls .controlVolume .volumeIcon svg {
  position: relative;
  width: 20px;
  height: 20px;
  fill: #fff;
  margin: 10px;
}
#singleProject .videoControls .controlVolume .volumeIcon[data-level=off] .small {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#singleProject .videoControls .controlVolume .volumeIcon[data-level=off] .medium {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#singleProject .videoControls .controlVolume .volumeIcon[data-level=off] .big {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#singleProject .videoControls .controlVolume .volumeIcon[data-level=off] .cross {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#singleProject .videoControls .controlVolume .volumeIcon[data-level="1"] .small {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#singleProject .videoControls .controlVolume .volumeIcon[data-level="1"] .medium {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#singleProject .videoControls .controlVolume .volumeIcon[data-level="1"] .big {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#singleProject .videoControls .controlVolume .volumeIcon[data-level="1"] .cross {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#singleProject .videoControls .controlVolume .volumeIcon[data-level="2"] svg .small {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#singleProject .videoControls .controlVolume .volumeIcon[data-level="2"] svg .medium {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#singleProject .videoControls .controlVolume .volumeIcon[data-level="2"] svg .big {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#singleProject .videoControls .controlVolume .volumeIcon[data-level="2"] svg .cross {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#singleProject .videoControls .controlVolume .volumeIcon[data-level="3"] .small {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#singleProject .videoControls .controlVolume .volumeIcon[data-level="3"] .medium {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#singleProject .videoControls .controlVolume .volumeIcon[data-level="3"] .big {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#singleProject .videoControls .controlVolume .volumeIcon[data-level="3"] .cross {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#singleProject .videoControls .controlVolume .volumeBar {
  position: absolute;
  right: 60px;
  top: 17px;
  width: calc(100% - 80px);
  height: 6px;
  background-color: rgba(0, 0, 0, 0.3);
  border: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}
#singleProject .videoControls .controlVolume .volumeBar .noUi-handle {
  position: absolute;
  border: none;
  background: #FFF;
  cursor: default;
  width: 14px;
  height: 14px;
  border-radius: 50% !important;
  right: -7px;
  top: -4px;
}
#singleProject .videoControls .controlVolume .volumeBar .noUi-handle:before {
  display: none;
}
#singleProject .videoControls .controlVolume .volumeBar .noUi-handle:after {
  display: none;
}
#singleProject .videoControls .controlVolume .volumeBar .noUi-base .noUi-connects .noUi-connect {
  background-color: rgba(0, 0, 0, 0.5);
}
#singleProject .videoControls .controlVolume.active {
  width: 12.5vw;
  -webkit-transition: width 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s;
}
#singleProject .videoList {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
}
#singleProject .videoList.lay-video {
  padding: 6.25vw 12.5vw 0 12.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .videoList.lay-video {
    padding: 2.5rem 0;
    width: 87.5vw;
    margin: 0 auto;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .videoList.lay-video {
    padding: 6.25vw 0;
    width: 87.5vw;
    margin: 0 auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .videoList.lay-video {
    padding: 6.25vw 0;
    width: 87.5vw;
    margin: 0 auto;
  }
}
#singleProject .videoList.lay-video .cover-mobile {
  position: relative;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
}
#singleProject .videoList.lay-video .cover-mobile .cover-mobile__wrapper {
  position: relative;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
  display: block;
  width: 100%;
}
#singleProject .videoList.lay-video .cover-mobile .cover-mobile__wrapper .img {
  line-height: 0;
}
#singleProject .videoList.lay-video .cover-mobile .cover-mobile__wrapper .img img {
  width: 100%;
}
#singleProject .videoList.lay-video .cover-mobile .cover-mobile__wrapper .center {
  position: absolute;
  width: 6rem;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
#singleProject .videoList.lay-video .cover-mobile .cover-mobile__wrapper .center .center__wrapper {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 100%;
}
#singleProject .videoList.lay-video .cover-mobile .cover-mobile__wrapper .center .center__wrapper .circle {
  position: relative;
  width: 100%;
  opacity: 0.4;
}
#singleProject .videoList.lay-video .cover-mobile .cover-mobile__wrapper .center .center__wrapper .circle .svg-circle {
  fill: black;
}
#singleProject .videoList.lay-video .cover-mobile .cover-mobile__wrapper .center .center__wrapper .play {
  position: absolute;
  width: 100%;
}
#singleProject .videoList.lay-video .cover-mobile .cover-mobile__wrapper .center .center__wrapper .play .svg-play {
  fill: white;
}
#singleProject .videoList.lay-video .textItem2 {
  position: relative;
  width: 50%;
  float: left;
  opacity: 0;
  -webkit-transform: translateY(20vh);
  transform: translateY(20vh);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .videoList.lay-video .textItem2 {
    width: 100%;
  }
}
#singleProject .videoList.lay-video .textItem2 h3 {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  text-transform: uppercase;
  margin-bottom: 5px;
  letter-spacing: 2px;
  -webkit-font-smoothing: antialiased;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .videoList.lay-video .textItem2 h3 {
    margin-bottom: 0;
  }
}
#singleProject .videoList.lay-video .textItem2 p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  width: 80%;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .videoList.lay-video .textItem2 p {
    width: 100%;
  }
}
#singleProject .videoList.lay-video .textItem3 {
  position: relative;
  width: 50%;
  float: left;
  -webkit-transform: translateY(20vh);
  transform: translateY(20vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .videoList.lay-video .textItem3 {
    width: 100%;
    margin-bottom: 20px;
  }
}
#singleProject .videoList.lay-video .textItem3 h3 {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  text-transform: uppercase;
  margin-bottom: 5px;
  letter-spacing: 2px;
  -webkit-font-smoothing: antialiased;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #singleProject .videoList.lay-video .textItem3 h3 {
    text-transform: uppercase;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .videoList.lay-video .textItem3 h3 {
    top: 0;
    left: 0;
    width: 87.5vw;
    color: transparent;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 3.5rem;
    line-height: 3.5rem;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
    -webkit-text-stroke: 1px var(--subColor);
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .videoList.lay-video .textItem3 h3 {
    top: 0;
    left: 0;
    width: 87.5vw;
    color: transparent;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    line-height: 8vw;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
    -webkit-text-stroke: 1px var(--subColor);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .videoList.lay-video .textItem3 h3 {
    text-transform: uppercase;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .videoList.lay-video .textItem3 h3 {
    text-transform: uppercase;
  }
}
#singleProject .videoList.lay-video .textItem3 p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  width: 80%;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .videoList.lay-video .textItem3 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .videoList.lay-video .textItem3 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
#singleProject .videoList.lay-video .row {
  position: relative;
  width: 75vw;
  float: left;
  height: auto;
  overflow: hidden;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding-bottom: 6.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .videoList.lay-video .row {
    width: 100%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .videoList.lay-video .row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    width: 100%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .videoList.lay-video .row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    width: 100%;
  }
}
#singleProject .videoList.lay-video .row .right {
  position: relative;
  float: left;
  width: 56.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .videoList.lay-video .row .right {
    width: 100%;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .videoList.lay-video .row .right {
    width: 100%;
  }
}
#singleProject .videoList.lay-video .row .left {
  position: relative;
  float: left;
  width: 18.75vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .videoList.lay-video .row .left {
    width: 100%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .videoList.lay-video .row .left {
    padding-left: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .videoList.lay-video .row .left {
    padding-left: 0;
  }
}
#singleProject .videoList.lay-video .row .left .infoProject {
  position: relative;
  float: left;
  padding-left: 3.125vw;
  opacity: 0;
  -webkit-transform: translateY(20vh);
  transform: translateY(20vh);
  width: 90%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .videoList.lay-video .row .left .infoProject {
    padding-left: 0;
    width: 100%;
  }
}
#singleProject .videoList.lay-video .row .left .infoProject span {
  position: relative;
  display: block;
}
#singleProject .videoList.lay-video .row .left .infoProject span.title {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  text-transform: uppercase;
  margin-bottom: 5px;
  letter-spacing: 2px;
  -webkit-font-smoothing: antialiased;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .videoList.lay-video .row .left .infoProject span.title {
    margin-bottom: 0;
  }
}
#singleProject .videoList.lay-video .row .left .infoProject span.text {
  margin-bottom: 20px;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  width: 80%;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .videoList.lay-video .row .left .infoProject span.text {
    width: 100%;
  }
}
#singleProject .videoList.lay-video .row .eleVideo {
  position: relative;
  width: 75vw;
  height: 42.1875vw;
  float: left;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
}
#singleProject .videoList.lay-video .row .eleVideo video {
  position: relative;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
  display: block;
  width: 100%;
}
#singleProject .videoList.lay-video .row .eleVideo.run {
  z-index: 11;
}
#singleProject .videoList.lay-video .row .eleVideo.run .videoControls {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#singleProject .videoList.lay-video .row .eleVideo.run:hover .videoControls {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#singleProject .videoList.lay-video .row:last-of-type .eleVideo video {
  margin-bottom: 0;
}
#singleProject .videoList.lay-video .row .categoryProject {
  position: relative;
  text-align: right;
  width: 100%;
  margin-top: 10px;
  margin-bottom: 3.125vw;
  float: left;
}
#singleProject .videoList.lay-video .row .categoryProject span {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
}
#singleProject .videoList.lay-video .row:last-of-type {
  padding-bottom: 0;
}
#singleProject .webList {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
}
#singleProject .webList.lay-web-1 {
  z-index: 3;
  padding-top: 3.125vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .webList.lay-web-1 {
    padding-top: 1.25rem;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .webList.lay-web-1 {
    padding-top: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .webList.lay-web-1 {
    padding-top: 6.25vw;
  }
}
#singleProject .webList.lay-web-1 .row {
  position: relative;
  width: 100%;
  float: left;
  height: auto;
  overflow: hidden;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
#singleProject .webList.lay-web-1 .row .listItem {
  position: relative;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
}
#singleProject .webList.lay-web-1 .row .listItem video {
  position: relative;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
  display: block;
  width: 100%;
}
#singleProject .webList.lay-web-1 .row .listItem picture {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
}
#singleProject .webList.lay-web-1 .row .listItem picture img {
  position: relative;
  width: 100%;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#singleProject .webList.lay-web-1 .row .infoProject {
  position: relative;
  float: left;
  padding-left: 3.125vw;
  width: 25vw;
  z-index: 5;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .webList.lay-web-1 .row .infoProject {
    padding: 0 6.25vw;
    margin: 6.25vw auto 0 auto;
    width: 87.5vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .webList.lay-web-1 .row .infoProject {
    margin-right: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .webList.lay-web-1 .row .infoProject {
    margin-right: 6.25vw;
  }
}
#singleProject .webList.lay-web-1 .row .infoProject span {
  position: relative;
  display: block;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#singleProject .webList.lay-web-1 .row .infoProject span.title {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  text-transform: uppercase;
  margin-bottom: 5px;
  letter-spacing: 2px;
  -webkit-font-smoothing: antialiased;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .webList.lay-web-1 .row .infoProject span.title {
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .webList.lay-web-1 .row .infoProject span.title {
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .webList.lay-web-1 .row .infoProject span.title {
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .webList.lay-web-1 .row .infoProject span.title {
    margin-bottom: 0;
  }
}
#singleProject .webList.lay-web-1 .row .infoProject span.title.moreMargin {
  margin-top: 3.125vw;
}
@media only screen and (min-width: 1281px) and (max-width: 1920px) and (max-device-height: 1080px) {
  #singleProject .webList.lay-web-1 .row .infoProject span.title.moreMargin {
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .webList.lay-web-1 .row .infoProject span.title.moreMargin {
    margin-top: 0;
  }
}
#singleProject .webList.lay-web-1 .row .infoProject span.fromTop {
  margin-top: 10vh;
}
@media only screen and (min-width: 1281px) and (max-width: 1920px) and (max-device-height: 1080px) {
  #singleProject .webList.lay-web-1 .row .infoProject span.fromTop {
    margin-top: 5vh;
  }
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #singleProject .webList.lay-web-1 .row .infoProject span.fromTop {
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .webList.lay-web-1 .row .infoProject span.fromTop {
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .webList.lay-web-1 .row .infoProject span.fromTop {
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .webList.lay-web-1 .row .infoProject span.fromTop {
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .webList.lay-web-1 .row .infoProject span.fromTop {
    margin-top: 0;
  }
}
#singleProject .webList.lay-web-1 .row .infoProject span.text {
  margin-bottom: 20px;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  width: 80%;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .webList.lay-web-1 .row .infoProject span.text {
    width: 100%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .webList.lay-web-1 .row .infoProject span.text {
    width: 100%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .webList.lay-web-1 .row .infoProject span.text {
    width: 100%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .webList.lay-web-1 .row .infoProject span.text {
    width: 100%;
  }
}
#singleProject .webList.lay-web-1 .row .infoProject span.text a {
  position: relative;
  text-decoration: none;
  color: #fff;
  line-height: 16px;
  display: inline-block;
  overflow: hidden;
}
#singleProject .webList.lay-web-1 .row .infoProject span.text a em {
  position: relative;
  float: left;
  font-style: normal;
}
#singleProject .webList.lay-web-1 .row .infoProject span.text a svg {
  position: relative;
  float: left;
  width: 13px;
  height: auto;
  fill: #fff;
  margin: 4px 0 4px 10px;
}
#singleProject .webList.lay-web-1 .row .infoProject ul {
  list-style: none;
  margin-bottom: 20px;
}
#singleProject .webList.lay-web-1 .row .infoProject ul li span.text {
  margin-bottom: 0;
}
#singleProject .webList.lay-web-1 .row .categoryProject {
  position: absolute;
  bottom: 0;
  left: 71.875vw;
}
#singleProject .webList.lay-web-1 .row .categoryProject span {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
}
#singleProject .webList.lay-web-1 .row[data-order="1"] .listItem {
  position: relative;
  float: left;
  margin-left: 12.5vw;
  width: 56.25vw;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
}
#singleProject .webList.lay-web-1 .row[data-order="1"] .listItem video {
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .webList.lay-web-1 .row[data-order="1"] .listItem {
    margin-left: 6.25vw;
    width: 87.5vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .webList.lay-web-1 .row[data-order="1"] .listItem {
    margin-left: 6.25vw;
    width: 59.375vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .webList.lay-web-1 .row[data-order="1"] .listItem {
    margin-left: 6.25vw;
    width: 59.375vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .webList.lay-web-1 .row[data-order="1"] .listItem {
    margin-left: 6.25vw;
    width: 62.5vw;
  }
}
#singleProject .webList.lay-web-1 .row[data-order="2"] {
  padding: 6.25vw 6.25vw 0 6.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .webList.lay-web-1 .row[data-order="2"] {
    padding-top: 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .webList.lay-web-1 .row[data-order="2"] {
    padding-top: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .webList.lay-web-1 .row[data-order="2"] {
    padding-top: 6.25vw;
  }
}
#singleProject .webList.lay-web-1 .row[data-order="2"] .listItem {
  float: left;
  width: 56.25vw;
  margin-left: 18.75vw;
  height: 31.640625vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .webList.lay-web-1 .row[data-order="2"] .listItem {
    margin-left: 0;
    width: 87.5vw;
    height: auto;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .webList.lay-web-1 .row[data-order="2"] .listItem {
    margin-left: 0;
    width: 87.5vw;
    height: auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .webList.lay-web-1 .row[data-order="2"] .listItem {
    margin-left: 0;
    width: 87.5vw;
    height: auto;
  }
}
#singleProject .webList.lay-web-1 .row[data-order="2"] .textItem2 {
  position: relative;
  width: 75vw;
  float: left;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 6.25vw 6.25vw 1.5625vw 6.25vw;
  -webkit-transform: translateY(20vh);
  transform: translateY(20vh);
  opacity: 0;
}
#singleProject .webList.lay-web-1 .row[data-order="2"] .textItem2 h3 {
  position: relative;
  float: left;
  width: 12.5vw;
  white-space: nowrap;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  text-transform: uppercase;
  -webkit-font-smoothing: antialiased;
  letter-spacing: 2px;
}
#singleProject .webList.lay-web-1 .row[data-order="2"] .textItem2 p {
  position: relative;
  width: 62.5vw;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  -webkit-font-smoothing: antialiased;
}
#singleProject .webList.lay-web-1 .row[data-order="2"] .textItem3 {
  position: relative;
  width: 75vw;
  float: left;
  padding: 6.25vw;
  -webkit-transform: translateY(20vh);
  transform: translateY(20vh);
  opacity: 0;
}
#singleProject .webList.lay-web-1 .row[data-order="2"] .textItem3 h3 {
  position: relative;
  float: left;
  width: 100%;
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  text-transform: uppercase;
  -webkit-font-smoothing: antialiased;
  letter-spacing: 2px;
}
#singleProject .webList.lay-web-1 .row[data-order="2"] .textItem3 p {
  position: relative;
  width: 100%;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 30px;
  -webkit-font-smoothing: antialiased;
  margin-top: 5vh;
}
#singleProject .webList.lay-web-1 .row[data-order="3"] {
  padding: 6.25vw 6.25vw 0 6.25vw;
}
#singleProject .webList.lay-web-1 .row[data-order="3"] .listItem {
  float: left;
  width: 75vw;
  margin-left: 6.25vw;
  height: 42.1875vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .webList.lay-web-1 .row[data-order="3"] .listItem {
    width: 100%;
    margin-left: 0;
    height: auto;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .webList.lay-web-1 .row[data-order="3"] .listItem {
    width: 100%;
    margin-left: 0;
    height: auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .webList.lay-web-1 .row[data-order="3"] .listItem {
    width: 100%;
    margin-left: 0;
    height: auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .webList.lay-web-1 .row[data-order="3"] .listItem {
    width: 100%;
    margin-left: 0;
    height: auto;
  }
}
#singleProject .webList.lay-web-1 .row[data-order="4"] {
  padding: 6.25vw 6.25vw 0 6.25vw;
}
#singleProject .webList.lay-web-1 .row[data-order="4"] .listItem {
  float: left;
  width: 25vw;
  height: 37.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .webList.lay-web-1 .row[data-order="4"] .listItem {
    width: 100%;
    height: auto;
    margin-left: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .webList.lay-web-1 .row[data-order="4"] .listItem {
    width: 100%;
    height: auto;
    margin-left: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .webList.lay-web-1 .row[data-order="4"] .listItem {
    width: 100%;
    height: auto;
    margin-left: 0;
  }
}
#singleProject .webList.lay-web-1 .row[data-order="4"] .listItem:nth-of-type(2) {
  margin: 0 6.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .webList.lay-web-1 .row[data-order="4"] .listItem:nth-of-type(2) {
    margin-left: 0;
    margin-top: 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .webList.lay-web-1 .row[data-order="4"] .listItem:nth-of-type(2) {
    margin-left: 0;
    margin-top: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .webList.lay-web-1 .row[data-order="4"] .listItem:nth-of-type(2) {
    margin-left: 0;
    margin-top: 6.25vw;
  }
}
#singleProject .webList.lay-web-1 .row[data-order="4"] .listItem:nth-of-type(3) {
  margin-top: 6.25vw;
}
#singleProject .webList.lay-web-1 .row[data-order="4"] .listItem:nth-of-type(1) {
  margin-top: 12.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .webList.lay-web-1 .row[data-order="4"] .listItem:nth-of-type(1) {
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .webList.lay-web-1 .row[data-order="4"] .listItem:nth-of-type(1) {
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .webList.lay-web-1 .row[data-order="4"] .listItem:nth-of-type(1) {
    margin-top: 0;
  }
}
#singleProject .webList.lay-web-1 .row[data-order="4"] .textBlock {
  position: relative;
  width: 56.25vw;
  float: left;
  padding-left: 31.25vw;
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-transform: translateY(-3.125vw);
  transform: translateY(-3.125vw);
}
#singleProject .webList.lay-web-1 .row[data-order="4"] .textBlock .textItem {
  position: relative;
  float: left;
  width: 25vw;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}
#singleProject .webList.lay-web-1 .row[data-order="4"] .textBlock .textItem:last-of-type {
  margin-left: 6.25vw;
}
#singleProject .webList.lay-web-1 .row[data-order="4"] .textBlock .textItem h3 {
  position: relative;
  display: block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10px;
  -webkit-font-smoothing: antialiased;
  margin-bottom: 20px;
  opacity: 0.6;
  text-transform: uppercase;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#singleProject .webList.lay-web-1 .row[data-order="4"] .textBlock .textItem h2 {
  -webkit-font-smoothing: antialiased;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 5vw;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#singleProject .webList.lay-web-1 .row[data-order="4"] .textBlock .textItem p {
  position: relative;
  display: block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
  -webkit-font-smoothing: antialiased;
}
#singleProject .webList.lay-web-1 .row[data-order="5"] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 6.25vw 6.25vw 0 6.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .webList.lay-web-1 .row[data-order="5"] {
    padding-top: 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .webList.lay-web-1 .row[data-order="5"] {
    padding-top: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .webList.lay-web-1 .row[data-order="5"] {
    padding-top: 6.25vw;
  }
}
#singleProject .webList.lay-web-1 .row[data-order="5"] .textItem {
  position: relative;
  float: left;
  width: 18.75vw;
  margin-right: 6.25vw;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}
#singleProject .webList.lay-web-1 .row[data-order="5"] .textItem .wrapper {
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
#singleProject .webList.lay-web-1 .row[data-order="5"] .textItem h3 {
  position: relative;
  display: block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10px;
  -webkit-font-smoothing: antialiased;
  margin-bottom: 20px;
  opacity: 0.6;
  text-transform: uppercase;
}
#singleProject .webList.lay-web-1 .row[data-order="5"] .textItem h2 {
  -webkit-font-smoothing: antialiased;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 5vw;
}
#singleProject .webList.lay-web-1 .row[data-order="5"] .textItem p {
  position: relative;
  display: block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
}
#singleProject .webList.lay-web-1 .row[data-order="5"] .listItem {
  position: relative;
  float: left;
  width: 56.25vw;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  height: 31.640625vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .webList.lay-web-1 .row[data-order="5"] .listItem {
    width: 100%;
    margin: 0;
    height: auto;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .webList.lay-web-1 .row[data-order="5"] .listItem {
    width: 100%;
    margin: 0;
    height: auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .webList.lay-web-1 .row[data-order="5"] .listItem {
    width: 100%;
    margin: 0;
    height: auto;
  }
}
#singleProject .webList.lay-web-1 .row[data-order="6"] {
  padding: 6.25vw 6.25vw 0 6.25vw;
}
#singleProject .webList.lay-web-1 .row[data-order="6"] .listItem {
  float: left;
  width: 56.25vw;
  margin-left: 15.625vw;
  height: 31.640625vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .webList.lay-web-1 .row[data-order="6"] .listItem {
    width: 100%;
    margin: 0;
    height: auto;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .webList.lay-web-1 .row[data-order="6"] .listItem {
    width: 100%;
    margin: 0;
    height: auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .webList.lay-web-1 .row[data-order="6"] .listItem {
    width: 100%;
    margin: 0;
    height: auto;
  }
}
#singleProject .webList.lay-web-2 {
  padding-top: 3.125vw;
}
#singleProject .webList.lay-web-2 .row {
  position: relative;
  width: 100%;
  float: left;
  height: auto;
  overflow: hidden;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
#singleProject .webList.lay-web-2 .row .listItem {
  position: relative;
}
#singleProject .webList.lay-web-2 .row .listItem video {
  width: 100%;
  heighT: auto;
  display: block;
}
#singleProject .webList.lay-web-2 .row .listItem picture {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
}
#singleProject .webList.lay-web-2 .row .listItem picture img {
  position: relative;
  width: 100%;
  display: block;
}
#singleProject .webList.lay-web-2 .row .listItem {
  position: relative;
  width: 75vw;
  float: left;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
  background-color: var(--subColor);
}
#singleProject .webList.lay-web-2 .row .listItem video {
  position: relative;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
  display: block;
  width: 100%;
}
#singleProject .webList.lay-web-2 .row .listItem picture {
  position: relative;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
  display: block;
  width: 100%;
  height: auto;
}
#singleProject .webList.lay-web-2 .row .listItem picture img {
  position: relative;
  width: 100%;
  display: block;
}
#singleProject .webList.lay-web-2 .row[data-order="1"] .listItem {
  position: relative;
  float: left;
  margin-left: 12.5vw;
  width: 56.25vw;
}
#singleProject .webList.lay-web-2 .row[data-order="1"] .infoProject {
  position: relative;
  float: left;
  padding-left: 3.125vw;
  width: 25vw;
}
#singleProject .webList.lay-web-2 .row[data-order="1"] .infoProject span {
  position: relative;
  display: block;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#singleProject .webList.lay-web-2 .row[data-order="1"] .infoProject span.title {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  text-transform: uppercase;
  margin-bottom: 5px;
  letter-spacing: 2px;
  -webkit-font-smoothing: antialiased;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .webList.lay-web-2 .row[data-order="1"] .infoProject span.title {
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .webList.lay-web-2 .row[data-order="1"] .infoProject span.title {
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .webList.lay-web-2 .row[data-order="1"] .infoProject span.title {
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .webList.lay-web-2 .row[data-order="1"] .infoProject span.title {
    margin-bottom: 0;
  }
}
#singleProject .webList.lay-web-2 .row[data-order="1"] .infoProject span.title.moreMargin {
  margin-top: 3.125vw;
}
#singleProject .webList.lay-web-2 .row[data-order="1"] .infoProject span.text {
  margin-bottom: 20px;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  width: 80%;
}
#singleProject .webList.lay-web-2 .row[data-order="1"] .infoProject span.fromTop {
  margin-top: 10vh;
}
#singleProject .webList.lay-web-2 .row[data-order="1"] .categoryProject {
  position: absolute;
  bottom: 0;
  left: 71.875vw;
}
#singleProject .webList.lay-web-2 .row[data-order="1"] .categoryProject span {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
}
#singleProject .webList.lay-web-2 .row[data-order="2"] {
  padding: 3.125vw 6.25vw 0 6.25vw;
}
#singleProject .webList.lay-web-2 .row[data-order="2"] .listItem {
  float: left;
  width: 56.25vw;
  margin-left: 18.75vw;
}
#singleProject .webList.lay-web-2 .row[data-order="2"] .textItem2 {
  position: relative;
  width: 75vw;
  float: left;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 6.25vw 6.25vw 1.5625vw 6.25vw;
  -webkit-transform: translateY(20vh);
  transform: translateY(20vh);
  opacity: 0;
}
#singleProject .webList.lay-web-2 .row[data-order="2"] .textItem2 h3 {
  position: relative;
  float: left;
  width: 12.5vw;
  white-space: nowrap;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  text-transform: uppercase;
  -webkit-font-smoothing: antialiased;
  letter-spacing: 2px;
  /*opacity: 0.4;*/
}
#singleProject .webList.lay-web-2 .row[data-order="2"] .textItem2 p {
  position: relative;
  width: 62.5vw;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  -webkit-font-smoothing: antialiased;
}
#singleProject .webList.lay-web-2 .row[data-order="2"] .textItem3 {
  position: relative;
  width: 75vw;
  float: left;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 6.25vw 6.25vw 6.25vw 6.25vw;
  -webkit-transform: translateY(20vh);
  transform: translateY(20vh);
  opacity: 0;
}
#singleProject .webList.lay-web-2 .row[data-order="2"] .textItem3 h3 {
  position: relative;
  float: left;
  width: 12.5vw;
  white-space: nowrap;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  text-transform: uppercase;
  -webkit-font-smoothing: antialiased;
  letter-spacing: 2px;
  /*opacity: 0.4;*/
}
#singleProject .webList.lay-web-2 .row[data-order="2"] .textItem3 p {
  position: relative;
  width: 62.5vw;
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  -webkit-font-smoothing: antialiased;
}
#singleProject .webList.lay-web-2 .row[data-order="3"] {
  padding: 6.25vw 6.25vw 0 6.25vw;
}
#singleProject .webList.lay-web-2 .row[data-order="3"] .listItem {
  float: left;
  width: 75vw;
  margin-left: 6.25vw;
}
#singleProject .webList.lay-web-2 .row[data-order="4"] {
  padding: 6.25vw 0 0 0;
}
#singleProject .webList.lay-web-2 .row[data-order="4"] .listItem {
  float: left;
  width: 25vw;
}
#singleProject .webList.lay-web-2 .row[data-order="4"] .listItem:nth-of-type(2) {
  margin: 0 6.25vw;
}
#singleProject .webList.lay-web-2 .row[data-order="4"] .listItem:nth-of-type(3) {
  margin-top: 6.25vw;
}
#singleProject .webList.lay-web-2 .row[data-order="4"] .listItem:nth-of-type(1) {
  margin-top: 12.5vw;
  margin-left: 6.25vw;
}
#singleProject .webList.lay-web-2 .row[data-order="4"] .textBlock {
  position: relative;
  width: 56.25vw;
  float: left;
  padding-left: 37.5vw;
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-transform: translateY(-3.125vw);
  transform: translateY(-3.125vw);
}
#singleProject .webList.lay-web-2 .row[data-order="4"] .textBlock .textItem {
  position: relative;
  float: left;
  width: 25vw;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}
#singleProject .webList.lay-web-2 .row[data-order="4"] .textBlock .textItem:last-of-type {
  margin-left: 6.25vw;
}
#singleProject .webList.lay-web-2 .row[data-order="4"] .textBlock .textItem h3 {
  position: relative;
  display: block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10px;
  -webkit-font-smoothing: antialiased;
  margin-bottom: 20px;
  opacity: 0.6;
  text-transform: uppercase;
  -webkit-transform: translateY(20vh);
  transform: translateY(20vh);
  opacity: 0;
}
#singleProject .webList.lay-web-2 .row[data-order="4"] .textBlock .textItem h2 {
  -webkit-font-smoothing: antialiased;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 5vw;
  -webkit-transform: translateY(20vh);
  transform: translateY(20vh);
  opacity: 0;
}
#singleProject .webList.lay-web-2 .row[data-order="4"] .textBlock .textItem p {
  position: relative;
  display: block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  -webkit-transform: translateY(20vh);
  transform: translateY(20vh);
  opacity: 0;
}
#singleProject .webList.lay-web-2 .row[data-order="4"] .sliderWeb {
  position: relative;
  float: left;
  width: 100%;
}
#singleProject .webList.lay-web-2 .row[data-order="4"] .sliderWeb .swiper-container {
  width: 100%;
  height: 70vh;
}
#singleProject .webList.lay-web-2 .row[data-order="4"] .sliderWeb .swiper-container .swiper-slide {
  text-align: center;
  font-size: 18px;
  height: 70vh;
  width: auto;
  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
#singleProject .webList.lay-web-2 .row[data-order="4"] .sliderWeb .swiper-container .swiper-slide img {
  height: 100%;
  width: auto;
}
#singleProject .webList.lay-web-2 .row[data-order="5"] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 6.25vw 6.25vw 0 6.25vw;
}
#singleProject .webList.lay-web-2 .row[data-order="5"] .textItem {
  position: relative;
  float: left;
  width: 18.75vw;
  margin-right: 6.25vw;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}
#singleProject .webList.lay-web-2 .row[data-order="5"] .textItem .wrapper {
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
#singleProject .webList.lay-web-2 .row[data-order="5"] .textItem h3 {
  position: relative;
  display: block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10px;
  -webkit-font-smoothing: antialiased;
  margin-bottom: 20px;
  opacity: 0.6;
  text-transform: uppercase;
}
#singleProject .webList.lay-web-2 .row[data-order="5"] .textItem h2 {
  -webkit-font-smoothing: antialiased;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 5vw;
}
#singleProject .webList.lay-web-2 .row[data-order="5"] .textItem p {
  position: relative;
  display: block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
}
#singleProject .webList.lay-web-2 .row[data-order="5"] .listItem {
  position: relative;
  float: left;
  width: 56.25vw;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}
#singleProject .webList.lay-web-2 .row[data-order="6"] {
  padding: 6.25vw 6.25vw 0 6.25vw;
}
#singleProject .webList.lay-web-2 .row[data-order="6"] .listItem {
  float: left;
  width: 56.25vw;
  margin-left: 15.625vw;
}
#singleProject .photoList {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
}
#singleProject .photoList.lay-vertical {
  padding-top: 3.125vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical {
    padding-top: 0;
  }
}
#singleProject .photoList.lay-vertical .row {
  position: relative;
  width: 100%;
  float: left;
  height: auto;
  overflow: hidden;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row {
    overflow: visible;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row {
    overflow: visible;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row {
    overflow: visible;
  }
}
#singleProject .photoList.lay-vertical .row .listItem {
  position: relative;
  background-color: var(--subColor);
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
}
#singleProject .photoList.lay-vertical .row .listItem picture {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
#singleProject .photoList.lay-vertical .row .listItem picture img {
  position: relative;
  width: 100%;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#singleProject .photoList.lay-vertical .row .infoProject {
  position: relative;
  float: left;
  padding-left: 3.125vw;
  width: 25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row .infoProject {
    padding: 0 6.25vw;
    margin: 6.25vw auto 0 auto;
    width: 87.5vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row .infoProject {
    padding-right: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row .infoProject {
    padding-right: 6.25vw;
  }
}
#singleProject .photoList.lay-vertical .row .infoProject span {
  position: relative;
  display: block;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#singleProject .photoList.lay-vertical .row .infoProject span.title {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  text-transform: uppercase;
  margin-bottom: 5px;
  letter-spacing: 2px;
  -webkit-font-smoothing: antialiased;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row .infoProject span.title {
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row .infoProject span.title {
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row .infoProject span.title {
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row .infoProject span.title {
    margin-bottom: 0;
  }
}
#singleProject .photoList.lay-vertical .row .infoProject span.text {
  margin-bottom: 20px;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  width: 80%;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row .infoProject span.text {
    margin-bottom: 0;
    width: 100%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row .infoProject span.text {
    margin-bottom: 0;
    width: 100%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row .infoProject span.text {
    margin-bottom: 0;
    width: 100%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row .infoProject span.text {
    margin-bottom: 0;
    width: 100%;
  }
}
#singleProject .photoList.lay-vertical .row .infoProject span.fromTop {
  margin-top: 10vh;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row .infoProject span.fromTop {
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row .infoProject span.fromTop {
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row .infoProject span.fromTop {
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row .infoProject span.fromTop {
    margin-top: 0;
  }
}
#singleProject .photoList.lay-vertical .row .animatedTitle h3 span {
  position: relative;
  float: left;
  -webkit-transform: scale(1.6);
  transform: scale(1.6);
  opacity: 0;
}
#singleProject .photoList.lay-vertical .row .categoryProject {
  position: absolute;
  bottom: 0;
  left: 71.875vw;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#singleProject .photoList.lay-vertical .row .categoryProject span {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row .categoryProject {
    display: none;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row .categoryProject {
    display: none;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row .categoryProject {
    display: none;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row .categoryProject {
    display: none;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="1"] .listItem {
  position: relative;
  float: left;
  margin-left: 12.5vw;
  width: 56.25vw;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="1"] .listItem {
    margin-left: 6.25vw;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="1"] .listItem picture {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
#singleProject .photoList.lay-vertical .row[data-order="1"] .listItem picture img {
  position: relative;
  width: 100%;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row[data-order="1"] .listItem {
    margin-left: 6.25vw;
    width: 87.5vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row[data-order="1"] .listItem {
    margin-left: 6.25vw;
    width: 59.375vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="1"] .listItem {
    margin-left: 6.25vw;
    width: 59.375vw;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="2"] {
  padding: 3.125vw 6.25vw 0 6.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] {
    padding-top: 6.25vw;
    margin-bottom: 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] {
    padding-top: 6.25vw;
    margin-bottom: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] {
    padding-top: 6.25vw;
    margin-bottom: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] {
    padding-top: 6.25vw;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="2"] .listItem {
  float: left;
  width: 25vw;
  height: 37.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .listItem {
    margin-top: 6.25vw;
    width: 87.5vw;
    height: 131.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .listItem {
    margin-top: 6.25vw;
    width: 87.5vw;
    height: 131.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .listItem {
    margin-top: 6.25vw;
    width: 87.5vw;
    height: 131.25vw;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="2"] .listItem:nth-of-type(2) {
  margin: 0 6.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .listItem:nth-of-type(2) {
    margin: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .listItem:nth-of-type(2) {
    margin: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .listItem:nth-of-type(2) {
    margin: 0;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="2"] .listItem:nth-of-type(3) {
  margin-top: 6.25vw;
}
#singleProject .photoList.lay-vertical .row[data-order="2"] .listItem:nth-of-type(1) {
  margin-top: 12.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .listItem:nth-of-type(1) {
    margin-top: 0;
    margin-bottom: 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .listItem:nth-of-type(1) {
    margin-top: 0;
    margin-bottom: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .listItem:nth-of-type(1) {
    margin-top: 0;
    margin-bottom: 6.25vw;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="2"] .textItem2 {
  position: relative;
  width: 75vw;
  float: left;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 6.25vw 6.25vw 1.5625vw 6.25vw;
  -webkit-transform: translateY(20vh);
  transform: translateY(20vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .textItem2 {
    position: relative;
    width: 87.5vw;
    display: block;
    padding: 0;
    margin: 12.5vw 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .textItem2 {
    position: relative;
    width: 87.5vw;
    display: block;
    padding: 0;
    margin: 12.5vw 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .textItem2 {
    position: relative;
    width: 87.5vw;
    display: block;
    padding: 0;
    margin: 12.5vw 0;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="2"] .textItem2 h3 {
  position: relative;
  float: left;
  width: 12.5vw;
  white-space: nowrap;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  text-transform: uppercase;
  -webkit-font-smoothing: antialiased;
  letter-spacing: 2px;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .textItem2 h3 {
    width: 87.5vw;
    white-space: nowrap;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .textItem2 h3 {
    width: 87.5vw;
    white-space: nowrap;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .textItem2 h3 {
    width: 87.5vw;
    white-space: nowrap;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="2"] .textItem2 p {
  position: relative;
  width: 62.5vw;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  -webkit-font-smoothing: antialiased;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .textItem2 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .textItem2 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .textItem2 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="2"] .textItem3 {
  position: relative;
  width: 75vw;
  float: left;
  padding: 0 6.25vw 3.125vw 6.25vw;
  -webkit-transform: translateY(20vh);
  transform: translateY(20vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .textItem3 {
    position: relative;
    width: 87.5vw;
    padding: 0;
    margin-top: 0;
    margin-bottom: 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .textItem3 {
    position: relative;
    width: 87.5vw;
    padding: 0;
    margin-top: 0;
    margin-bottom: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .textItem3 {
    position: relative;
    width: 87.5vw;
    padding: 0;
    margin-top: 0;
    margin-bottom: 6.25vw;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="2"] .textItem3 h3 {
  position: relative;
  top: -3.125vw;
  left: 6.25vw;
  margin-right: 6.25vw;
  white-space: pre;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
  color: transparent;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .textItem3 h3 {
    top: 0;
    left: 0;
    margin-right: 0;
    width: 87.5vw;
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 3.5rem;
    line-height: 3.5rem;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
    color: transparent;
    -webkit-text-stroke: 1px var(--subColor);
    -webkit-font-smoothing: antialiased;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .textItem3 h3 {
    top: 0;
    left: 0;
    margin-right: 0;
    width: 87.5vw;
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    line-height: 8vw;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
    color: transparent;
    -webkit-text-stroke: 1px var(--subColor);
    -webkit-font-smoothing: antialiased;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .textItem3 h3 {
    top: 0;
    left: 0;
    margin-right: 0;
    width: 87.5vw;
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    line-height: 8vw;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
    color: transparent;
    -webkit-text-stroke: 1px var(--subColor);
    -webkit-font-smoothing: antialiased;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="2"] .textItem3 p {
  position: relative;
  width: 100%;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 30px;
  -webkit-font-smoothing: antialiased;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .textItem3 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .textItem3 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .textItem3 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="2"] .textItem3 p {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="3"] {
  padding: 3.125vw 12.5vw 0 25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row[data-order="3"] {
    padding: 0 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row[data-order="3"] {
    padding: 0 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="3"] {
    padding: 0 6.25vw;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="3"] .listItem {
  position: relative;
  float: left;
}
#singleProject .photoList.lay-vertical .row[data-order="3"] .listItem:nth-of-type(1) {
  width: 25vw;
  margin-top: 15.625vw;
  z-index: 3;
  height: 37.5vw;
}
#singleProject .photoList.lay-vertical .row[data-order="3"] .listItem:nth-of-type(2) {
  width: 31.25vw;
  margin-left: 6.25vw;
  height: 46.875vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row[data-order="3"] .listItem {
    margin-top: 6.25vw;
  }
  #singleProject .photoList.lay-vertical .row[data-order="3"] .listItem:nth-of-type(1) {
    width: 87.5vw;
    margin-top: 0;
    height: 131.25vw;
  }
  #singleProject .photoList.lay-vertical .row[data-order="3"] .listItem:nth-of-type(2) {
    width: 87.5vw;
    margin-left: 0;
    height: 131.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row[data-order="3"] .listItem {
    margin-top: 6.25vw;
  }
  #singleProject .photoList.lay-vertical .row[data-order="3"] .listItem:nth-of-type(1) {
    width: 87.5vw;
    margin-top: 0;
    height: 131.25vw;
  }
  #singleProject .photoList.lay-vertical .row[data-order="3"] .listItem:nth-of-type(2) {
    width: 87.5vw;
    margin-left: 0;
    height: 131.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="3"] .listItem {
    margin-top: 6.25vw;
  }
  #singleProject .photoList.lay-vertical .row[data-order="3"] .listItem:nth-of-type(1) {
    width: 87.5vw;
    margin-top: 0;
    height: 131.25vw;
  }
  #singleProject .photoList.lay-vertical .row[data-order="3"] .listItem:nth-of-type(2) {
    width: 87.5vw;
    margin-left: 0;
    height: 131.25vw;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="3"] .textItem {
  position: absolute;
  top: calc(12.5vw - 8vw);
  left: 12.5vw;
  z-index: 7;
}
#singleProject .photoList.lay-vertical .row[data-order="3"] .textItem h3 {
  position: relative;
  margin-right: 6.25vw;
  white-space: pre;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
  color: transparent;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row[data-order="3"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row[data-order="3"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="3"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="4"] {
  padding: 3.125vw 12.5vw 0 18.75vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row[data-order="4"] {
    padding: 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row[data-order="4"] {
    padding: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="4"] {
    padding: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="4"] {
    padding: 6.25vw;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="4"] .listItem {
  position: relative;
  float: left;
}
#singleProject .photoList.lay-vertical .row[data-order="4"] .listItem:nth-of-type(1) {
  width: 37.5vw;
  height: 56.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row[data-order="4"] .listItem:nth-of-type(1) {
    width: 87.5vw;
    height: 131.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row[data-order="4"] .listItem:nth-of-type(1) {
    width: 87.5vw;
    height: 131.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="4"] .listItem:nth-of-type(1) {
    width: 87.5vw;
    height: 131.25vw;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="4"] .listItem:nth-of-type(2) {
  width: 25vw;
  height: 37.5vw;
  margin-left: 6.25vw;
  margin-top: 6.25vw;
  z-index: 3;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row[data-order="4"] .listItem:nth-of-type(2) {
    width: 87.5vw;
    margin-left: 0;
    margin-top: 6.25vw;
    height: 131.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row[data-order="4"] .listItem:nth-of-type(2) {
    width: 87.5vw;
    margin-left: 0;
    margin-top: 6.25vw;
    height: 131.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="4"] .listItem:nth-of-type(2) {
    width: 87.5vw;
    margin-left: 0;
    margin-top: 6.25vw;
    height: 131.25vw;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="4"] .textItem {
  position: absolute;
  bottom: calc(9.375vw - 1vw);
  right: 12.5vw;
  z-index: 6;
}
#singleProject .photoList.lay-vertical .row[data-order="4"] .textItem h3 {
  position: relative;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 6vw;
  line-height: 6vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
  color: transparent;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row[data-order="4"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row[data-order="4"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="4"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="5"] {
  overflow: visible;
  padding: 3.125vw 25vw 0 12.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row[data-order="5"] {
    padding: 0 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row[data-order="5"] {
    padding: 0 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="5"] {
    padding: 0 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="5"] {
    padding-top: 0;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="5"] .listItem {
  position: relative;
  float: left;
}
#singleProject .photoList.lay-vertical .row[data-order="5"] .listItem:nth-of-type(1) {
  width: 31.25vw;
  height: 46.875vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row[data-order="5"] .listItem:nth-of-type(1) {
    width: 87.5vw;
    height: 131.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row[data-order="5"] .listItem:nth-of-type(1) {
    width: 87.5vw;
    height: 131.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="5"] .listItem:nth-of-type(1) {
    width: 87.5vw;
    height: 131.25vw;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="5"] .listItem:nth-of-type(2) {
  width: 25vw;
  height: 37.5vw;
  margin-left: 6.25vw;
  margin-top: 3.125vw;
  z-index: 3;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row[data-order="5"] .listItem:nth-of-type(2) {
    width: 87.5vw;
    margin-left: 0;
    margin-top: 6.25vw;
    height: 131.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row[data-order="5"] .listItem:nth-of-type(2) {
    width: 87.5vw;
    margin-left: 0;
    margin-top: 6.25vw;
    height: 131.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="5"] .listItem:nth-of-type(2) {
    width: 87.5vw;
    margin-left: 0;
    margin-top: 6.25vw;
    height: 131.25vw;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="6"] {
  overflow: visible;
  padding: 6.25vw 18.75vw 0 18.75vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row[data-order="6"] {
    padding: 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row[data-order="6"] {
    padding: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="6"] {
    padding: 6.25vw;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="6"] .listItem {
  position: relative;
  float: left;
  width: 56.25vw;
  height: 37.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row[data-order="6"] .listItem {
    width: 87.5vw;
    height: 58.3333333333vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row[data-order="6"] .listItem {
    width: 87.5vw;
    height: 58.3333333333vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="6"] .listItem {
    width: 87.5vw;
    height: 58.3333333333vw;
  }
}
#singleProject .photoList.lay-vertical .row[data-order="6"] .textItem {
  position: absolute;
  top: -6vw;
  left: 40.625vw;
  z-index: 6;
}
#singleProject .photoList.lay-vertical .row[data-order="6"] .textItem h3 {
  position: relative;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 6vw;
  line-height: 6vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
  color: transparent;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-vertical .row[data-order="6"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-vertical .row[data-order="6"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-vertical .row[data-order="6"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
#singleProject .photoList.lay-horizontal {
  padding-top: 3.125vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal {
    padding-top: 0;
  }
}
#singleProject .photoList.lay-horizontal .row {
  position: relative;
  width: 100%;
  float: left;
  height: auto;
  overflow: hidden;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row {
    overflow: visible;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row {
    overflow: visible;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row {
    overflow: visible;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row {
    overflow: visible;
  }
}
#singleProject .photoList.lay-horizontal .row .listItem {
  position: relative;
  background-color: var(--subColor);
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
}
#singleProject .photoList.lay-horizontal .row .listItem picture {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
#singleProject .photoList.lay-horizontal .row .listItem picture img {
  position: relative;
  width: 100%;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#singleProject .photoList.lay-horizontal .row .infoProject {
  position: relative;
  float: left;
  padding-left: 3.125vw;
  width: 25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row .infoProject {
    width: 87.5vw;
    margin: 6.25vw;
    padding: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row .infoProject {
    padding-right: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row .infoProject {
    padding-right: 6.25vw;
  }
}
#singleProject .photoList.lay-horizontal .row .infoProject span {
  position: relative;
  display: block;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#singleProject .photoList.lay-horizontal .row .infoProject span.title {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  text-transform: uppercase;
  margin-bottom: 5px;
  letter-spacing: 2px;
  -webkit-font-smoothing: antialiased;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row .infoProject span.title {
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row .infoProject span.title {
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row .infoProject span.title {
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row .infoProject span.title {
    margin-bottom: 0;
  }
}
#singleProject .photoList.lay-horizontal .row .infoProject span.text {
  margin-bottom: 20px;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  width: 80%;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row .infoProject span.text {
    width: 100%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row .infoProject span.text {
    width: 100%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row .infoProject span.text {
    width: 100%;
  }
}
#singleProject .photoList.lay-horizontal .row .infoProject span.fromTop {
  margin-top: 10vh;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #singleProject .photoList.lay-horizontal .row .infoProject span.fromTop {
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row .infoProject span.fromTop {
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row .infoProject span.fromTop {
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row .infoProject span.fromTop {
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row .infoProject span.fromTop {
    margin-top: 0;
  }
}
#singleProject .photoList.lay-horizontal .row .animatedTitle h3 span {
  position: relative;
  float: left;
  -webkit-transform: scale(1.6);
  transform: scale(1.6);
  opacity: 0;
}
#singleProject .photoList.lay-horizontal .row .categoryProject {
  position: absolute;
  bottom: 0;
  left: 71.875vw;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row .categoryProject {
    display: none;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row .categoryProject {
    display: none;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row .categoryProject {
    display: none;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row .categoryProject {
    display: none;
  }
}
#singleProject .photoList.lay-horizontal .row .categoryProject span {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
}
#singleProject .photoList.lay-horizontal .row[data-order="1"] .listItem {
  position: relative;
  float: left;
  margin-left: 12.5vw;
  width: 56.25vw;
  position: relative;
  background-color: var(--subColor);
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row[data-order="1"] .listItem {
    margin-left: 6.25vw;
    width: 87.5vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row[data-order="1"] .listItem {
    margin-left: 6.25vw;
    width: 59.375vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="1"] .listItem {
    margin-left: 6.25vw;
    width: 59.375vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="1"] .listItem {
    margin-left: 6.25vw;
    width: 62.5vw;
  }
}
#singleProject .photoList.lay-horizontal .row[data-order="1"] .listItem picture {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
#singleProject .photoList.lay-horizontal .row[data-order="1"] .listItem picture img {
  position: relative;
  width: 100%;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#singleProject .photoList.lay-horizontal .row[data-order="2"] {
  padding-top: 3.125vw;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] {
    padding-top: 6.25vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] {
    padding-top: 0;
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] {
    padding-top: 6.25vw;
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] {
    padding-top: 6.25vw;
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] {
    padding-top: 6.25vw;
    margin-bottom: 0;
  }
}
#singleProject .photoList.lay-horizontal .row[data-order="2"] .listItem {
  margin-left: 25vw;
  width: 56.25vw;
  height: 37.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] .listItem {
    margin-left: 6.25vw;
    width: 87.5vw;
    height: 58.3333333333vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] .listItem {
    margin-left: 6.25vw;
    width: 87.5vw;
    height: 58.3333333333vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] .listItem {
    margin-left: 6.25vw;
    width: 87.5vw;
    height: 58.3333333333vw;
  }
}
#singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem2 {
  position: relative;
  width: 75vw;
  float: left;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 6.25vw 6.25vw 1.5625vw 6.25vw;
  -webkit-transform: translateY(20vh);
  transform: translateY(20vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem2 {
    position: relative;
    width: 87.5vw;
    display: block;
    padding: 0 6.25vw;
    margin: 12.5vw 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem2 {
    position: relative;
    width: 87.5vw;
    display: block;
    padding: 0 6.25vw;
    margin: 12.5vw 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem2 {
    position: relative;
    width: 87.5vw;
    display: block;
    padding: 0 6.25vw;
    margin: 12.5vw 0;
  }
}
#singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem2 h3 {
  position: relative;
  float: left;
  width: 12.5vw;
  white-space: nowrap;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  text-transform: uppercase;
  -webkit-font-smoothing: antialiased;
  letter-spacing: 2px;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem2 h3 {
    width: 87.5vw;
    white-space: nowrap;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem2 h3 {
    width: 87.5vw;
    white-space: nowrap;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem2 h3 {
    width: 87.5vw;
    white-space: nowrap;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
  }
}
#singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem2 p {
  position: relative;
  width: 62.5vw;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  -webkit-font-smoothing: antialiased;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem2 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem2 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem2 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
#singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem3 {
  position: relative;
  width: 75vw;
  float: left;
  padding: 6.25vw 12.5vw 3.125vw 12.5vw;
  -webkit-transform: translateY(20vh);
  transform: translateY(20vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem3 {
    position: relative;
    width: 87.5vw;
    display: block;
    padding: 0 6.25vw;
    margin-top: 6.25vw;
    -webkit-transform: translateY(0vh);
    transform: translateY(0vh);
    opacity: 1;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem3 {
    position: relative;
    width: 87.5vw;
    display: block;
    padding: 0 6.25vw;
    margin-top: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem3 {
    position: relative;
    width: 87.5vw;
    display: block;
    padding: 0 6.25vw;
    margin-top: 6.25vw;
  }
}
#singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem3 h3 {
  position: relative;
  top: -3.125vw;
  left: 12.5vw;
  margin-right: 6.25vw;
  white-space: pre;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
  color: transparent;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem3 h3 {
    top: 0;
    left: 0;
    margin-right: 0;
    width: 87.5vw;
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 12px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
    font-size: 3.5rem;
    line-height: 3.5rem;
    color: transparent;
    -webkit-text-stroke: 1px var(--subColor);
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem3 h3 {
    top: 0;
    left: 0;
    margin-right: 0;
    width: 87.5vw;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 12px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
    font-size: 8vw;
    line-height: 8vw;
    color: transparent;
    -webkit-text-stroke: 1px var(--subColor);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem3 h3 {
    top: 0;
    left: 0;
    margin-right: 0;
    width: 87.5vw;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 12px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
    font-size: 8vw;
    line-height: 8vw;
    color: transparent;
    -webkit-text-stroke: 1px var(--subColor);
  }
}
#singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem3 p {
  position: relative;
  width: 100%;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 30px;
  -webkit-font-smoothing: antialiased;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem3 p {
    font-size: 26px;
    line-height: 32px;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem3 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem3 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem3 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="2"] .textItem3 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
#singleProject .photoList.lay-horizontal .row[data-order="3"] {
  padding-top: 3.125vw;
  overflow: visible;
}
#singleProject .photoList.lay-horizontal .row[data-order="3"] .listItem {
  margin-left: 18.75vw;
  width: 56.25vw;
  z-index: 3;
  height: 37.5vw;
}
#singleProject .photoList.lay-horizontal .row[data-order="3"] .textItem {
  position: absolute;
  bottom: -10vw;
  left: 6.25vw;
  z-index: 7;
}
#singleProject .photoList.lay-horizontal .row[data-order="3"] .textItem h3 {
  position: relative;
  margin-right: 6.25vw;
  white-space: pre;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
  color: transparent;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row[data-order="3"] {
    padding-top: 6.25vw;
  }
  #singleProject .photoList.lay-horizontal .row[data-order="3"] .listItem {
    margin-left: 6.25vw;
    width: 87.5vw;
    height: 58.3333333333vw;
  }
  #singleProject .photoList.lay-horizontal .row[data-order="3"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row[data-order="3"] {
    padding-top: 6.25vw;
  }
  #singleProject .photoList.lay-horizontal .row[data-order="3"] .listItem {
    margin-left: 6.25vw;
    width: 87.5vw;
    height: 58.3333333333vw;
  }
  #singleProject .photoList.lay-horizontal .row[data-order="3"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="3"] {
    padding-top: 6.25vw;
  }
  #singleProject .photoList.lay-horizontal .row[data-order="3"] .listItem {
    margin-left: 6.25vw;
    width: 87.5vw;
    height: 58.3333333333vw;
  }
  #singleProject .photoList.lay-horizontal .row[data-order="3"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
#singleProject .photoList.lay-horizontal .row[data-order="4"] {
  padding-top: 3.125vw;
  overflow: visible;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #singleProject .photoList.lay-horizontal .row[data-order="4"] {
    padding-top: 6.25vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row[data-order="4"] {
    padding: 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row[data-order="4"] {
    padding: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="4"] {
    padding: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="4"] {
    padding-top: 6.25vw;
  }
}
#singleProject .photoList.lay-horizontal .row[data-order="4"] .listItem {
  position: relative;
  float: left;
  z-index: 3;
}
#singleProject .photoList.lay-horizontal .row[data-order="4"] .listItem:nth-of-type(1) {
  margin-top: 12.5vw;
  margin-left: 6.25vw;
  width: 56.25vw;
  height: 37.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row[data-order="4"] .listItem:nth-of-type(1) {
    margin-top: 0;
    margin-left: 0;
    width: 87.5vw;
    height: 58.3333333333vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row[data-order="4"] .listItem:nth-of-type(1) {
    margin-top: 0;
    margin-left: 0;
    width: 87.5vw;
    height: 58.3333333333vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="4"] .listItem:nth-of-type(1) {
    margin-top: 0;
    margin-left: 0;
    width: 87.5vw;
    height: 58.3333333333vw;
  }
}
#singleProject .photoList.lay-horizontal .row[data-order="4"] .listItem:nth-of-type(2) {
  margin-left: 6.25vw;
  width: 25vw;
  height: 37.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row[data-order="4"] .listItem:nth-of-type(2) {
    margin-left: 0;
    margin-top: 6.25vw;
    width: 87.5vw;
    height: 131.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row[data-order="4"] .listItem:nth-of-type(2) {
    margin-left: 0;
    margin-top: 6.25vw;
    width: 87.5vw;
    height: 131.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="4"] .listItem:nth-of-type(2) {
    margin-left: 0;
    margin-top: 6.25vw;
    width: 87.5vw;
    height: 131.25vw;
  }
}
#singleProject .photoList.lay-horizontal .row[data-order="4"] .textItem {
  position: absolute;
  bottom: -4vw;
  right: 6.25vw;
  z-index: 2;
}
#singleProject .photoList.lay-horizontal .row[data-order="4"] .textItem h3 {
  position: relative;
  margin-right: 6.25vw;
  white-space: pre;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
  color: transparent;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row[data-order="4"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row[data-order="4"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="4"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
#singleProject .photoList.lay-horizontal .row[data-order="5"] {
  padding-top: 3.125vw;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #singleProject .photoList.lay-horizontal .row[data-order="5"] {
    padding-top: 6.25vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row[data-order="5"] {
    padding: 0 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row[data-order="5"] {
    padding: 0 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="5"] {
    padding: 0 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="5"] {
    padding-top: 6.25vw;
  }
}
#singleProject .photoList.lay-horizontal .row[data-order="5"] .listItem {
  position: relative;
  float: left;
  z-index: 3;
}
#singleProject .photoList.lay-horizontal .row[data-order="5"] .listItem:nth-of-type(1) {
  margin-left: 12.5vw;
  width: 25vw;
  height: 37.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row[data-order="5"] .listItem:nth-of-type(1) {
    margin-top: 0;
    margin-left: 0;
    width: 87.5vw;
    height: 131.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row[data-order="5"] .listItem:nth-of-type(1) {
    margin-top: 0;
    margin-left: 0;
    width: 87.5vw;
    height: 131.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="5"] .listItem:nth-of-type(1) {
    margin-top: 0;
    margin-left: 0;
    width: 87.5vw;
    height: 131.25vw;
  }
}
#singleProject .photoList.lay-horizontal .row[data-order="5"] .listItem:nth-of-type(2) {
  margin-left: 6.25vw;
  margin-top: 12.5vw;
  width: 50vw;
  height: 33.3333333333vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row[data-order="5"] .listItem:nth-of-type(2) {
    margin-left: 0;
    margin-top: 6.25vw;
    width: 87.5vw;
    height: 58.3333333333vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row[data-order="5"] .listItem:nth-of-type(2) {
    margin-left: 0;
    margin-top: 6.25vw;
    width: 87.5vw;
    height: 58.3333333333vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="5"] .listItem:nth-of-type(2) {
    margin-left: 0;
    margin-top: 6.25vw;
    width: 87.5vw;
    height: 58.3333333333vw;
  }
}
#singleProject .photoList.lay-horizontal .row[data-order="5"] .textItem {
  position: absolute;
  bottom: calc(9.375vw - 1vw);
  right: 6.25vw;
  z-index: 2;
}
#singleProject .photoList.lay-horizontal .row[data-order="5"] .textItem h3 {
  position: relative;
  margin-right: 6.25vw;
  white-space: pre;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
  color: transparent;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row[data-order="5"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row[data-order="5"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="5"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
#singleProject .photoList.lay-horizontal .row[data-order="6"] {
  padding-top: 3.125vw;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #singleProject .photoList.lay-horizontal .row[data-order="6"] {
    padding-top: 6.25vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row[data-order="6"] {
    padding: 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row[data-order="6"] {
    padding: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="6"] {
    padding: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="6"] {
    padding-top: 6.25vw;
  }
}
#singleProject .photoList.lay-horizontal .row[data-order="6"] .listItem {
  margin-left: 25vw;
  width: 56.25vw;
  z-index: 3;
  height: 37.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row[data-order="6"] .listItem {
    margin-left: 0;
    width: 87.5vw;
    height: 58.3333333333vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row[data-order="6"] .listItem {
    margin-left: 0;
    width: 87.5vw;
    height: 58.3333333333vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="6"] .listItem {
    margin-left: 0;
    width: 87.5vw;
    height: 58.3333333333vw;
  }
}
#singleProject .photoList.lay-horizontal .row[data-order="6"] .textItem {
  position: absolute;
  top: 50%;
  left: 9.375vw;
  z-index: 4;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
#singleProject .photoList.lay-horizontal .row[data-order="6"] .textItem h3 {
  position: relative;
  margin-right: 6.25vw;
  white-space: pre;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
  color: transparent;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row[data-order="6"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="6"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
#singleProject .photoList.lay-horizontal .row[data-order="7"] {
  padding-top: 6.25vw;
  overflow: visible;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row[data-order="7"] {
    padding: 0 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row[data-order="7"] {
    padding: 0 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="7"] {
    padding: 0 6.25vw;
  }
}
#singleProject .photoList.lay-horizontal .row[data-order="7"] .listItem {
  margin-left: 18.75vw;
  width: 56.25vw;
  z-index: 3;
  height: 37.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-horizontal .row[data-order="7"] .listItem {
    margin-left: 0;
    width: 87.5vw;
    height: 58.3333333333vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-horizontal .row[data-order="7"] .listItem {
    margin-left: 0;
    width: 87.5vw;
    height: 58.3333333333vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-horizontal .row[data-order="7"] .listItem {
    margin-left: 0;
    width: 87.5vw;
    height: 58.3333333333vw;
  }
}
#singleProject .photoList.lay-mixed {
  padding-top: 3.125vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed {
    padding: 0;
  }
}
#singleProject .photoList.lay-mixed .row {
  position: relative;
  width: 100%;
  float: left;
  height: auto;
  overflow: hidden;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row {
    overflow: visible;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row {
    overflow: visible;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row {
    overflow: visible;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row {
    overflow: visible;
  }
}
#singleProject .photoList.lay-mixed .row .listItem {
  position: relative;
  background-color: var(--subColor);
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
}
#singleProject .photoList.lay-mixed .row .listItem picture {
  position: relative;
  width: 100%;
  height: 100%;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
#singleProject .photoList.lay-mixed .row .listItem picture img {
  position: relative;
  width: 100%;
  height: 100%;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#singleProject .photoList.lay-mixed .row .infoProject {
  position: relative;
  float: left;
  padding-left: 3.125vw;
  width: 25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row .infoProject {
    padding: 0 6.25vw;
    margin: 6.25vw auto 0 auto;
    width: 87.5vw;
  }
}
#singleProject .photoList.lay-mixed .row .infoProject span {
  position: relative;
  display: block;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#singleProject .photoList.lay-mixed .row .infoProject span.title {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  text-transform: uppercase;
  margin-bottom: 5px;
  letter-spacing: 2px;
  -webkit-font-smoothing: antialiased;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row .infoProject span.title {
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row .infoProject span.title {
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row .infoProject span.title {
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row .infoProject span.title {
    margin-bottom: 0;
  }
}
#singleProject .photoList.lay-mixed .row .infoProject span.text {
  margin-bottom: 20px;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  width: 80%;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row .infoProject span.text {
    width: 100%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row .infoProject span.text {
    width: 100%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row .infoProject span.text {
    width: 100%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row .infoProject span.text {
    width: 100%;
  }
}
#singleProject .photoList.lay-mixed .row .infoProject span.fromTop {
  margin-top: 10vh;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #singleProject .photoList.lay-mixed .row .infoProject span.fromTop {
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row .infoProject span.fromTop {
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row .infoProject span.fromTop {
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row .infoProject span.fromTop {
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row .infoProject span.fromTop {
    margin-top: 0;
  }
}
#singleProject .photoList.lay-mixed .row .animatedTitle h3 span {
  position: relative;
  float: left;
  -webkit-transform: scale(1.6);
  transform: scale(1.6);
  opacity: 0;
}
#singleProject .photoList.lay-mixed .row .categoryProject {
  position: absolute;
  bottom: 0;
  left: 71.875vw;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row .categoryProject {
    display: none;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row .categoryProject {
    display: none;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row .categoryProject {
    display: none;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row .categoryProject {
    display: none;
  }
}
#singleProject .photoList.lay-mixed .row .categoryProject span {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
}
#singleProject .photoList.lay-mixed .row[data-order="1"] .listItem {
  position: relative;
  float: left;
  margin-left: 12.5vw;
  width: 56.25vw;
  background-color: var(--subColor);
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="1"] .listItem {
    margin-left: 6.25vw;
    width: 87.5vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="1"] .listItem {
    margin-left: 6.25vw;
    width: 59.375vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="1"] .listItem {
    margin-left: 6.25vw;
    width: 59.375vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="1"] .listItem {
    margin-left: 6.25vw;
    width: 62.5vw;
  }
}
#singleProject .photoList.lay-mixed .row[data-order="1"] .listItem picture {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
#singleProject .photoList.lay-mixed .row[data-order="1"] .listItem picture img {
  position: relative;
  width: 100%;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#singleProject .photoList.lay-mixed .row[data-order="1"] .titleProject {
  position: absolute;
  top: 50%;
  left: 71.875vw;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 18.75vw;
}
#singleProject .photoList.lay-mixed .row[data-order="1"] .titleProject h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 4vw;
  line-height: 3.5vw;
  -webkit-font-smoothing: antialiased;
}
#singleProject .photoList.lay-mixed .row[data-order="1"] .titleProject span {
  position: relative;
  display: block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 14px;
  -webkit-font-smoothing: antialiased;
}
#singleProject .photoList.lay-mixed .row[data-order="1"] .titleProject span em {
  position: relative;
  display: block;
  font-style: normal;
  /*text-transform: uppercase;*/
  opacity: 0.6;
}
#singleProject .photoList.lay-mixed .row[data-order="2"] {
  padding-top: 3.125vw;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] {
    padding-top: 6.25vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] {
    padding-top: 0;
    margin-bottom: 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] {
    padding-top: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] {
    padding-top: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] {
    padding-top: 6.25vw;
  }
}
#singleProject .photoList.lay-mixed .row[data-order="2"] .listItem {
  position: relative;
  float: left;
  z-index: 3;
  width: 31.25vw;
  margin-left: 12.5vw;
  height: 46.875vw;
}
#singleProject .photoList.lay-mixed .row[data-order="2"] .listItem:nth-of-type(1) {
  margin-left: 18.75vw;
  margin-top: 3.125vw;
  width: 25vw;
  height: 37.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .listItem:nth-of-type(1) {
    margin-left: 6.25vw;
    margin-top: 0;
    width: 87.5vw;
    height: 131.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .listItem:nth-of-type(1) {
    margin-left: 6.25vw;
    margin-top: 0;
    margin-bottom: 6.25vw;
    width: 87.5vw;
    height: 131.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .listItem:nth-of-type(1) {
    margin-left: 6.25vw;
    margin-top: 0;
    margin-bottom: 6.25vw;
    width: 87.5vw;
    height: 131.25vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .listItem:nth-of-type(2) {
    width: 87.5vw;
    margin-left: 6.25vw;
    margin-top: 6.25vw;
    height: 131.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .listItem:nth-of-type(2) {
    width: 87.5vw;
    margin-left: 6.25vw;
    margin-bottom: 6.25vw;
    height: 131.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .listItem:nth-of-type(2) {
    width: 87.5vw;
    margin-left: 6.25vw;
    margin-bottom: 6.25vw;
    height: 131.25vw;
  }
}
#singleProject .photoList.lay-mixed .row[data-order="2"] .textItem {
  position: absolute;
  top: calc(50% - 6.25vw);
  left: 50%;
  z-index: 4;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem {
    top: 131.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem {
    top: 131.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem {
    top: 131.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem {
    top: 131.25vw;
  }
}
#singleProject .photoList.lay-mixed .row[data-order="2"] .textItem h3 {
  position: relative;
  margin-right: 6.25vw;
  white-space: pre;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
  color: transparent;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
#singleProject .photoList.lay-mixed .row[data-order="2"] .textItem2 {
  position: relative;
  width: 75vw;
  float: left;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 6.25vw 6.25vw 1.5625vw 6.25vw;
  -webkit-transform: translateY(20vh);
  transform: translateY(20vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem2 {
    position: relative;
    width: 87.5vw;
    display: block;
    padding: 0 6.25vw;
    margin: 12.5vw 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem2 {
    position: relative;
    width: 87.5vw;
    display: block;
    padding: 0 6.25vw;
    margin: 12.5vw 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem2 {
    position: relative;
    width: 87.5vw;
    display: block;
    padding: 0 6.25vw;
    margin: 12.5vw 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem2 {
    position: relative;
    width: 87.5vw;
    display: block;
    padding: 0 6.25vw;
    margin: 12.5vw 0;
  }
}
#singleProject .photoList.lay-mixed .row[data-order="2"] .textItem2 h3 {
  position: relative;
  float: left;
  width: 12.5vw;
  white-space: nowrap;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  text-transform: uppercase;
  -webkit-font-smoothing: antialiased;
  letter-spacing: 2px;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem2 h3 {
    width: 87.5vw;
    white-space: nowrap;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem2 h3 {
    width: 87.5vw;
    white-space: nowrap;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem2 h3 {
    width: 87.5vw;
    white-space: nowrap;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem2 h3 {
    width: 87.5vw;
    white-space: nowrap;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
  }
}
#singleProject .photoList.lay-mixed .row[data-order="2"] .textItem2 p {
  position: relative;
  width: 62.5vw;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  -webkit-font-smoothing: antialiased;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem2 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem2 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem2 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem2 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
#singleProject .photoList.lay-mixed .row[data-order="2"] .textItem3 {
  position: relative;
  width: 75vw;
  float: left;
  padding: 6.25vw 12.5vw 3.125vw 12.5vw;
  -webkit-transform: translateY(20vh);
  transform: translateY(20vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem3 {
    position: relative;
    width: 87.5vw;
    display: block;
    padding: 0 6.25vw;
    margin-top: 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem3 {
    position: relative;
    width: 87.5vw;
    display: block;
    padding: 0 6.25vw 6.25vw 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem3 {
    position: relative;
    width: 87.5vw;
    display: block;
    padding: 0 6.25vw 6.25vw 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem3 {
    padding: 6.25vw 12.5vw;
  }
}
#singleProject .photoList.lay-mixed .row[data-order="2"] .textItem3 h3 {
  position: relative;
  top: -3.125vw;
  left: 6.25vw;
  margin-right: 6.25vw;
  white-space: pre;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
  color: transparent;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem3 h3 {
    top: 0;
    left: 0;
    width: 87.5vw;
    color: transparent;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 3.5rem;
    line-height: 3.5rem;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
    -webkit-text-stroke: 1px var(--subColor);
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem3 h3 {
    top: 0;
    left: 0;
    width: 87.5vw;
    color: transparent;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    line-height: 8vw;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
    -webkit-text-stroke: 1px var(--subColor);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem3 h3 {
    top: 0;
    left: 0;
    width: 87.5vw;
    color: transparent;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    line-height: 8vw;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
    -webkit-text-stroke: 1px var(--subColor);
  }
}
#singleProject .photoList.lay-mixed .row[data-order="2"] .textItem3 p {
  position: relative;
  width: 100%;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 30px;
  -webkit-font-smoothing: antialiased;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem3 p {
    font-size: 26px;
    line-height: 32px;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem3 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem3 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem3 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="2"] .textItem3 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
#singleProject .photoList.lay-mixed .row[data-order="3"] {
  padding-top: 3.125vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="3"] {
    padding-top: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="3"] {
    padding-top: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="3"] {
    padding-top: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="3"] {
    padding-top: 0;
  }
}
#singleProject .photoList.lay-mixed .row[data-order="3"] .listItem {
  position: relative;
  float: left;
  margin-left: 12.5vw;
  width: 56.25vw;
  height: 37.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="3"] .listItem {
    position: relative;
    float: left;
    margin-left: 6.25vw;
    width: 87.5vw;
    height: 58.3333333333vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="3"] .listItem {
    position: relative;
    float: left;
    margin-left: 6.25vw;
    width: 87.5vw;
    height: 58.3333333333vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="3"] .listItem {
    position: relative;
    float: left;
    margin-left: 6.25vw;
    width: 87.5vw;
    height: 58.3333333333vw;
  }
}
#singleProject .photoList.lay-mixed .row[data-order="3"] .textItem {
  position: absolute;
  top: calc(12.5vw - 8vw);
  right: 12.5vw;
  z-index: 2;
}
#singleProject .photoList.lay-mixed .row[data-order="3"] .textItem h3 {
  position: relative;
  margin-right: 6.25vw;
  white-space: pre;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
  color: transparent;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="3"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="3"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="3"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
#singleProject .photoList.lay-mixed .row[data-order="4"] {
  padding: 3.125vw 12.5vw 0 18.75vw;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #singleProject .photoList.lay-mixed .row[data-order="4"] {
    padding-top: 6.25vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="4"] {
    padding: 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="4"] {
    padding: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="4"] {
    padding: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="4"] {
    padding-top: 6.25vw;
  }
}
#singleProject .photoList.lay-mixed .row[data-order="4"] .listItem {
  position: relative;
  float: left;
  width: 56.25vw;
  height: 37.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="4"] .listItem {
    float: none;
    width: 100%;
    height: auto;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="4"] .listItem {
    float: none;
    width: 100%;
    height: auto;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="4"] .listItem {
    float: none;
    width: 100%;
    height: auto;
  }
}
#singleProject .photoList.lay-mixed .row[data-order="4"] .textItem {
  position: absolute;
  bottom: 12.5vw;
  right: 0;
  z-index: 4;
  -webkit-transform: translate(0, 50%);
  transform: translate(0, 50%);
  text-align: center;
}
#singleProject .photoList.lay-mixed .row[data-order="4"] .textItem h3 {
  position: relative;
  margin-right: 6.25vw;
  white-space: pre;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
  color: transparent;
}
#singleProject .photoList.lay-mixed .row[data-order="5"] {
  padding: 3.125vw 18.75vw 0 18.75vw;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #singleProject .photoList.lay-mixed .row[data-order="5"] {
    padding-top: 6.25vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="5"] {
    padding: 0 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="5"] {
    padding: 0 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="5"] {
    padding: 0 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="5"] {
    padding-top: 6.25vw;
  }
}
#singleProject .photoList.lay-mixed .row[data-order="5"] .listItem {
  position: relative;
  float: left;
}
#singleProject .photoList.lay-mixed .row[data-order="5"] .listItem:nth-of-type(1) {
  width: 31.25vw;
  margin-top: 3.125vw;
  height: 46.875vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="5"] .listItem:nth-of-type(1) {
    width: 100%;
    margin-top: 0;
    height: 131.25vw;
    float: none;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="5"] .listItem:nth-of-type(1) {
    width: 100%;
    margin-top: 0;
    height: 131.25vw;
    float: none;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="5"] .listItem:nth-of-type(1) {
    width: 100%;
    margin-top: 0;
    height: 131.25vw;
    float: none;
  }
}
#singleProject .photoList.lay-mixed .row[data-order="5"] .listItem:nth-of-type(2) {
  width: 25vw;
  margin-left: 6.25vw;
  z-index: 3;
  height: 37.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="5"] .listItem:nth-of-type(2) {
    width: 100%;
    height: 131.25vw;
    float: none;
    margin-top: 6.25vw;
    margin-left: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="5"] .listItem:nth-of-type(2) {
    width: 100%;
    height: 131.25vw;
    float: none;
    margin-top: 6.25vw;
    margin-left: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="5"] .listItem:nth-of-type(2) {
    width: 100%;
    height: 131.25vw;
    float: none;
    margin-top: 6.25vw;
    margin-left: 0;
  }
}
#singleProject .photoList.lay-mixed .row[data-order="6"] {
  padding: 3.125vw 25vw 0 25vw;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #singleProject .photoList.lay-mixed .row[data-order="6"] {
    padding-top: 6.25vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="6"] {
    padding: 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="6"] {
    padding: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="6"] {
    padding: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="6"] {
    padding-top: 6.25vw;
  }
}
#singleProject .photoList.lay-mixed .row[data-order="6"] .listItem {
  position: relative;
  float: left;
  width: 50vw;
  height: 33.3333333333vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="6"] .listItem {
    width: 100%;
    height: 58.3333333333vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="6"] .listItem {
    width: 100%;
    height: 58.3333333333vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="6"] .listItem {
    width: 100%;
    height: 58.3333333333vw;
  }
}
#singleProject .photoList.lay-mixed .row[data-order="7"] {
  padding: 3.125vw 18.75vw 0 12.5vw;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  #singleProject .photoList.lay-mixed .row[data-order="7"] {
    padding-top: 6.25vw;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="7"] {
    padding: 0 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="7"] {
    padding: 0 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="7"] {
    padding: 0 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="7"] {
    padding-top: 6.25vw;
  }
}
#singleProject .photoList.lay-mixed .row[data-order="7"] .listItem {
  position: relative;
  float: left;
}
#singleProject .photoList.lay-mixed .row[data-order="7"] .listItem:nth-of-type(1) {
  width: 25vw;
  height: 37.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="7"] .listItem:nth-of-type(1) {
    width: 100%;
    height: 131.25vw;
    float: none;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="7"] .listItem:nth-of-type(1) {
    width: 100%;
    height: 131.25vw;
    float: none;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="7"] .listItem:nth-of-type(1) {
    width: 100%;
    height: 131.25vw;
    float: none;
  }
}
#singleProject .photoList.lay-mixed .row[data-order="7"] .listItem:nth-of-type(2) {
  width: 31.25vw;
  margin-left: 12.5vw;
  margin-top: 3.125vw;
  height: 46.875vw;
  z-index: 3;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="7"] .listItem:nth-of-type(2) {
    width: 100%;
    height: 131.25vw;
    float: none;
    margin-top: 6.25vw;
    margin-left: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="7"] .listItem:nth-of-type(2) {
    width: 100%;
    height: 131.25vw;
    float: none;
    margin-top: 6.25vw;
    margin-left: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="7"] .listItem:nth-of-type(2) {
    width: 100%;
    height: 131.25vw;
    float: none;
    margin-top: 6.25vw;
    margin-left: 0;
  }
}
#singleProject .photoList.lay-mixed .row[data-order="7"] .textItem {
  position: absolute;
  top: 3vw;
  left: 43.75vw;
  z-index: 4;
}
#singleProject .photoList.lay-mixed .row[data-order="7"] .textItem h3 {
  position: relative;
  margin-right: 6.25vw;
  white-space: pre;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
  color: transparent;
}
#singleProject .photoList.lay-mixed .row[data-order="8"] {
  padding: 6.25vw 25vw 0 18.75vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="8"] {
    padding: 6.25vw;
    padding-bottom: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="8"] {
    padding: 6.25vw;
    padding-bottom: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="8"] {
    padding: 6.25vw;
    padding-bottom: 0;
  }
}
#singleProject .photoList.lay-mixed .row[data-order="8"] .listItem {
  position: relative;
  float: left;
  width: 56.25vw;
  height: 37.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-mixed .row[data-order="8"] .listItem {
    width: 100%;
    height: 58.3333333333vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-mixed .row[data-order="8"] .listItem {
    width: 100%;
    height: 58.3333333333vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-mixed .row[data-order="8"] .listItem {
    width: 100%;
    height: 58.3333333333vw;
  }
}
#singleProject .photoList.lay-square {
  padding-top: 3.125vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-square {
    padding-top: 6.25vw;
  }
}
#singleProject .photoList.lay-square .row {
  position: relative;
  width: 100%;
  float: left;
  height: auto;
  overflow: hidden;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-square .row {
    overflow: visible;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-square .row {
    overflow: visible;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row {
    overflow: visible;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row {
    overflow: visible;
  }
}
#singleProject .photoList.lay-square .row .listItem {
  position: relative;
  background-color: var(--subColor);
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  overflow: hidden;
}
#singleProject .photoList.lay-square .row .listItem picture {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
#singleProject .photoList.lay-square .row .listItem picture img {
  position: relative;
  width: 100%;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#singleProject .photoList.lay-square .row .infoProject {
  position: relative;
  float: left;
  padding-left: 3.125vw;
  width: 25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-square .row .infoProject {
    margin-top: 6.25vw;
    padding: 0 6.25vw;
    width: 87.5vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-square .row .infoProject {
    padding-right: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row .infoProject {
    padding-right: 6.25vw;
  }
}
#singleProject .photoList.lay-square .row .infoProject span {
  position: relative;
  display: block;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
#singleProject .photoList.lay-square .row .infoProject span.title {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  text-transform: uppercase;
  margin-bottom: 5px;
  letter-spacing: 2px;
  -webkit-font-smoothing: antialiased;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-square .row .infoProject span.title {
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-square .row .infoProject span.title {
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row .infoProject span.title {
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row .infoProject span.title {
    margin-bottom: 0;
  }
}
#singleProject .photoList.lay-square .row .infoProject span.text {
  margin-bottom: 20px;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  width: 80%;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-square .row .infoProject span.text {
    width: 100%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-square .row .infoProject span.text {
    width: 100%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row .infoProject span.text {
    width: 100%;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row .infoProject span.text {
    width: 100%;
  }
}
#singleProject .photoList.lay-square .row .infoProject span.fromTop {
  margin-top: 10vh;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-square .row .infoProject span.fromTop {
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-square .row .infoProject span.fromTop {
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row .infoProject span.fromTop {
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row .infoProject span.fromTop {
    margin-top: 0;
  }
}
#singleProject .photoList.lay-square .row .animatedTitle h3 span {
  position: relative;
  float: left;
  -webkit-transform: scale(1.6);
  transform: scale(1.6);
  opacity: 0;
}
#singleProject .photoList.lay-square .row .categoryProject {
  position: absolute;
  bottom: 0;
  left: 71.875vw;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-square .row .categoryProject {
    display: none;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-square .row .categoryProject {
    display: none;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row .categoryProject {
    display: none;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row .categoryProject {
    display: none;
  }
}
#singleProject .photoList.lay-square .row .categoryProject span {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
}
#singleProject .photoList.lay-square .row[data-order="1"] .listItem {
  position: relative;
  float: left;
  margin-left: 12.5vw;
  width: 56.25vw;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-square .row[data-order="1"] .listItem {
    margin-left: 6.25vw;
    width: 87.5vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-square .row[data-order="1"] .listItem {
    margin-left: 6.25vw;
    width: 59.375vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row[data-order="1"] .listItem {
    margin-left: 6.25vw;
    width: 59.375vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row[data-order="1"] .listItem {
    margin-left: 6.25vw;
    width: 62.5vw;
  }
}
#singleProject .photoList.lay-square .row[data-order="1"] .listItem picture {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateY(30vh);
  transform: translateY(30vh);
}
#singleProject .photoList.lay-square .row[data-order="1"] .listItem picture img {
  position: relative;
  width: 100%;
  display: block;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
#singleProject .photoList.lay-square .row[data-order="2"] {
  padding-top: 6.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-square .row[data-order="2"] {
    padding-top: 6.25vw;
    margin-bottom: 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-square .row[data-order="2"] {
    padding-top: 6.25vw;
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row[data-order="2"] {
    padding-top: 6.25vw;
    margin-bottom: 0;
  }
}
#singleProject .photoList.lay-square .row[data-order="2"] .listItem {
  position: relative;
  float: left;
  z-index: 3;
  width: 37.5vw;
  height: 37.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-square .row[data-order="2"] .listItem {
    width: 87.5vw;
    margin-left: 6.25vw;
    height: 87.5vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-square .row[data-order="2"] .listItem {
    width: 87.5vw;
    margin-left: 6.25vw;
    height: 87.5vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row[data-order="2"] .listItem {
    width: 87.5vw;
    margin-left: 6.25vw;
    height: 87.5vw;
  }
}
#singleProject .photoList.lay-square .row[data-order="2"] .listItem:nth-of-type(1) {
  margin-left: 6.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-square .row[data-order="2"] .listItem:nth-of-type(1) {
    margin-left: 6.25vw;
    margin-bottom: 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-square .row[data-order="2"] .listItem:nth-of-type(1) {
    margin-left: 6.25vw;
    margin-bottom: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row[data-order="2"] .listItem:nth-of-type(1) {
    margin-left: 6.25vw;
    margin-bottom: 6.25vw;
  }
}
#singleProject .photoList.lay-square .row[data-order="2"] .listItem:nth-of-type(2) {
  margin-left: 12.5vw;
  margin-top: 3.125vw;
  margin-bottom: 6.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-square .row[data-order="2"] .listItem:nth-of-type(2) {
    margin-left: 6.25vw;
    margin-top: 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-square .row[data-order="2"] .listItem:nth-of-type(2) {
    margin-left: 6.25vw;
    margin-top: 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row[data-order="2"] .listItem:nth-of-type(2) {
    margin-left: 6.25vw;
    margin-top: 6.25vw;
  }
}
#singleProject .photoList.lay-square .row[data-order="2"] .textItem2 {
  position: relative;
  width: 75vw;
  float: left;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 6.25vw 6.25vw 1.5625vw 6.25vw;
  -webkit-transform: translateY(20vh);
  transform: translateY(20vh);
  opacity: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-square .row[data-order="2"] .textItem2 {
    position: relative;
    width: 87.5vw;
    display: block;
    padding: 0;
    margin: 12.5vw 6.25vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-square .row[data-order="2"] .textItem2 {
    position: relative;
    width: 87.5vw;
    display: block;
    padding: 0;
    margin: 12.5vw 6.25vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row[data-order="2"] .textItem2 {
    position: relative;
    width: 87.5vw;
    display: block;
    padding: 0;
    margin: 12.5vw 6.25vw;
  }
}
#singleProject .photoList.lay-square .row[data-order="2"] .textItem2 h3 {
  position: relative;
  float: left;
  width: 12.5vw;
  white-space: nowrap;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  text-transform: uppercase;
  -webkit-font-smoothing: antialiased;
  letter-spacing: 2px;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-square .row[data-order="2"] .textItem2 h3 {
    width: 87.5vw;
    white-space: nowrap;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row[data-order="2"] .textItem2 h3 {
    width: 87.5vw;
    white-space: nowrap;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
  }
}
#singleProject .photoList.lay-square .row[data-order="2"] .textItem2 p {
  position: relative;
  width: 62.5vw;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  -webkit-font-smoothing: antialiased;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-square .row[data-order="2"] .textItem2 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-square .row[data-order="2"] .textItem2 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row[data-order="2"] .textItem2 p {
    width: 87.5vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
#singleProject .photoList.lay-square .row[data-order="2"] .textItem3 {
  position: relative;
  width: 75vw;
  float: left;
  padding: 0 12.5vw 6.25vw 6.25vw;
  -webkit-transform: translateY(20vh);
  transform: translateY(20vh);
  opacity: 0;
  z-index: 10;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-square .row[data-order="2"] .textItem3 {
    position: relative;
    width: 87.5vw;
    display: block;
    margin: 0 6.25vw 6.25vw 6.25vw;
    padding: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-square .row[data-order="2"] .textItem3 {
    position: relative;
    width: 87.5vw;
    display: block;
    margin: 0 6.25vw 6.25vw 6.25vw;
    padding: 0;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row[data-order="2"] .textItem3 {
    position: relative;
    width: 87.5vw;
    display: block;
    margin: 0 6.25vw 6.25vw 6.25vw;
    padding: 0;
  }
}
#singleProject .photoList.lay-square .row[data-order="2"] .textItem3 h3 {
  position: relative;
  top: -3.125vw;
  left: 6.25vw;
  margin-right: 6.25vw;
  white-space: pre;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
  color: transparent;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-square .row[data-order="2"] .textItem3 h3 {
    top: 0;
    left: 0;
    width: 87.5vw;
    -webkit-text-stroke: 1px var(--subColor);
    color: transparent;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 3.5rem;
    line-height: 3.5rem;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-square .row[data-order="2"] .textItem3 h3 {
    top: 0;
    left: 0;
    width: 87.5vw;
    -webkit-text-stroke: 1px var(--subColor);
    color: transparent;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    line-height: 8vw;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row[data-order="2"] .textItem3 h3 {
    top: 0;
    left: 0;
    width: 87.5vw;
    -webkit-text-stroke: 1px var(--subColor);
    color: transparent;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    line-height: 8vw;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin-bottom: 20px;
  }
}
#singleProject .photoList.lay-square .row[data-order="2"] .textItem3 p {
  position: relative;
  width: 100%;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 30px;
  -webkit-font-smoothing: antialiased;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-square .row[data-order="2"] .textItem3 p {
    width: 87.5vw;
    color: white;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-square .row[data-order="2"] .textItem3 p {
    width: 87.5vw;
    color: white;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row[data-order="2"] .textItem3 p {
    width: 87.5vw;
    color: white;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
#singleProject .photoList.lay-square .row[data-order="3"] {
  padding: 0 6.25vw 0 18.75vw;
}
#singleProject .photoList.lay-square .row[data-order="3"] .listItem {
  position: relative;
  float: left;
  z-index: 3;
}
#singleProject .photoList.lay-square .row[data-order="3"] .listItem:nth-of-type(1) {
  width: 37.5vw;
  margin-top: 3.125vw;
  height: 37.5vw;
}
#singleProject .photoList.lay-square .row[data-order="3"] .listItem:nth-of-type(2) {
  width: 31.25vw;
  margin-left: 6.25vw;
  height: 31.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-square .row[data-order="3"] {
    padding: 0 6.25vw;
  }
  #singleProject .photoList.lay-square .row[data-order="3"] .listItem:nth-of-type(1) {
    width: 87.5vw;
    margin-top: 0;
    height: 87.5vw;
  }
  #singleProject .photoList.lay-square .row[data-order="3"] .listItem:nth-of-type(2) {
    width: 87.5vw;
    margin-left: 0;
    margin-top: 6.25vw;
    height: 87.5vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-square .row[data-order="3"] {
    padding: 0 6.25vw;
  }
  #singleProject .photoList.lay-square .row[data-order="3"] .listItem:nth-of-type(1) {
    width: 87.5vw;
    margin-top: 0;
    height: 87.5vw;
  }
  #singleProject .photoList.lay-square .row[data-order="3"] .listItem:nth-of-type(2) {
    width: 87.5vw;
    margin-left: 0;
    margin-top: 6.25vw;
    height: 87.5vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row[data-order="3"] {
    padding: 0 6.25vw;
  }
  #singleProject .photoList.lay-square .row[data-order="3"] .listItem:nth-of-type(1) {
    width: 87.5vw;
    margin-top: 0;
    height: 87.5vw;
  }
  #singleProject .photoList.lay-square .row[data-order="3"] .listItem:nth-of-type(2) {
    width: 87.5vw;
    margin-left: 0;
    margin-top: 6.25vw;
    height: 87.5vw;
  }
}
#singleProject .photoList.lay-square .row[data-order="4"] {
  padding: 6.25vw 18.75vw 0 6.25vw;
}
#singleProject .photoList.lay-square .row[data-order="4"] .listItem {
  position: relative;
  float: left;
  z-index: 3;
}
#singleProject .photoList.lay-square .row[data-order="4"] .listItem:nth-of-type(1) {
  width: 31.25vw;
  margin-top: 3.125vw;
  height: 31.25vw;
}
#singleProject .photoList.lay-square .row[data-order="4"] .listItem:nth-of-type(2) {
  width: 37.5vw;
  margin-left: 6.25vw;
  height: 37.5vw;
}
#singleProject .photoList.lay-square .row[data-order="4"] .textItem {
  position: absolute;
  bottom: calc(12.5vw - 8vw);
  right: 6.25vw;
  z-index: 4;
}
#singleProject .photoList.lay-square .row[data-order="4"] .textItem h3 {
  position: relative;
  margin-right: 6.25vw;
  white-space: pre;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
  color: transparent;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-square .row[data-order="4"] {
    padding: 6.25vw 6.25vw 0 6.25vw;
  }
  #singleProject .photoList.lay-square .row[data-order="4"] .listItem:nth-of-type(1) {
    width: 87.5vw;
    margin-top: 0;
    height: 87.5vw;
  }
  #singleProject .photoList.lay-square .row[data-order="4"] .listItem:nth-of-type(2) {
    width: 87.5vw;
    margin-left: 0;
    margin-top: 6.25vw;
    height: 87.5vw;
  }
  #singleProject .photoList.lay-square .row[data-order="4"] .textItem {
    bottom: auto;
    top: 87.5vw;
  }
  #singleProject .photoList.lay-square .row[data-order="4"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-square .row[data-order="4"] {
    padding: 6.25vw 6.25vw 0 6.25vw;
  }
  #singleProject .photoList.lay-square .row[data-order="4"] .listItem:nth-of-type(1) {
    width: 87.5vw;
    margin-top: 0;
    height: 87.5vw;
  }
  #singleProject .photoList.lay-square .row[data-order="4"] .listItem:nth-of-type(2) {
    width: 87.5vw;
    margin-left: 0;
    margin-top: 6.25vw;
    height: 87.5vw;
  }
  #singleProject .photoList.lay-square .row[data-order="4"] .textItem {
    bottom: auto;
    top: 87.5vw;
  }
  #singleProject .photoList.lay-square .row[data-order="4"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row[data-order="4"] {
    padding: 6.25vw 6.25vw 0 6.25vw;
  }
  #singleProject .photoList.lay-square .row[data-order="4"] .listItem:nth-of-type(1) {
    width: 87.5vw;
    margin-top: 0;
    height: 87.5vw;
  }
  #singleProject .photoList.lay-square .row[data-order="4"] .listItem:nth-of-type(2) {
    width: 87.5vw;
    margin-left: 0;
    margin-top: 6.25vw;
    height: 87.5vw;
  }
  #singleProject .photoList.lay-square .row[data-order="4"] .textItem {
    bottom: auto;
    top: 87.5vw;
  }
  #singleProject .photoList.lay-square .row[data-order="4"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
#singleProject .photoList.lay-square .row[data-order="5"] {
  padding: 6.25vw 18.75vw 0 37.5vw;
}
#singleProject .photoList.lay-square .row[data-order="5"] .listItem {
  position: relative;
  float: left;
  width: 37.5vw;
  height: 37.5vw;
  z-index: 3;
}
#singleProject .photoList.lay-square .row[data-order="5"] .textItem {
  position: absolute;
  bottom: calc(12.5vw - 8vw);
  left: 12.5vw;
  z-index: 4;
}
#singleProject .photoList.lay-square .row[data-order="5"] .textItem h3 {
  position: relative;
  margin-right: 6.25vw;
  white-space: pre;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
  color: transparent;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-square .row[data-order="5"] {
    padding: 6.25vw 6.25vw 0 6.25vw;
  }
  #singleProject .photoList.lay-square .row[data-order="5"] .listItem {
    width: 87.5vw;
    height: 87.5vw;
  }
  #singleProject .photoList.lay-square .row[data-order="5"] .textItem {
    bottom: auto;
    top: 87.5vw;
  }
  #singleProject .photoList.lay-square .row[data-order="5"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-square .row[data-order="5"] {
    padding: 6.25vw 6.25vw 0 6.25vw;
  }
  #singleProject .photoList.lay-square .row[data-order="5"] .listItem {
    width: 87.5vw;
    height: 87.5vw;
  }
  #singleProject .photoList.lay-square .row[data-order="5"] .textItem {
    bottom: auto;
    top: 87.5vw;
  }
  #singleProject .photoList.lay-square .row[data-order="5"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row[data-order="5"] {
    padding: 6.25vw 6.25vw 0 6.25vw;
  }
  #singleProject .photoList.lay-square .row[data-order="5"] .listItem {
    width: 87.5vw;
    height: 87.5vw;
  }
  #singleProject .photoList.lay-square .row[data-order="5"] .textItem {
    bottom: auto;
    top: 87.5vw;
  }
  #singleProject .photoList.lay-square .row[data-order="5"] .textItem h3 {
    color: var(--subColor);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10vw;
    line-height: 10vw;
    -webkit-text-stroke: 0px;
  }
}
#singleProject .photoList.lay-square .row[data-order="6"] {
  padding: 6.25vw 6.25vw 0 12.5vw;
}
#singleProject .photoList.lay-square .row[data-order="6"] .listItem {
  position: relative;
  float: left;
  z-index: 3;
}
#singleProject .photoList.lay-square .row[data-order="6"] .listItem:nth-of-type(1) {
  width: 37.5vw;
  height: 37.5vw;
}
#singleProject .photoList.lay-square .row[data-order="6"] .listItem:nth-of-type(2) {
  width: 31.25vw;
  margin-left: 6.25vw;
  margin-top: 3.125vw;
  height: 31.25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #singleProject .photoList.lay-square .row[data-order="6"] {
    padding: 6.25vw 6.25vw 0 6.25vw;
  }
  #singleProject .photoList.lay-square .row[data-order="6"] .listItem:nth-of-type(1) {
    width: 87.5vw;
    height: 87.5vw;
  }
  #singleProject .photoList.lay-square .row[data-order="6"] .listItem:nth-of-type(2) {
    width: 87.5vw;
    margin-left: 0;
    margin-top: 6.25vw;
    height: 87.5vw;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  #singleProject .photoList.lay-square .row[data-order="6"] {
    padding: 6.25vw 6.25vw 0 6.25vw;
  }
  #singleProject .photoList.lay-square .row[data-order="6"] .listItem:nth-of-type(1) {
    width: 87.5vw;
    height: 87.5vw;
  }
  #singleProject .photoList.lay-square .row[data-order="6"] .listItem:nth-of-type(2) {
    width: 87.5vw;
    margin-left: 0;
    margin-top: 6.25vw;
    height: 87.5vw;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  #singleProject .photoList.lay-square .row[data-order="6"] {
    padding: 6.25vw 6.25vw 0 6.25vw;
  }
  #singleProject .photoList.lay-square .row[data-order="6"] .listItem:nth-of-type(1) {
    width: 87.5vw;
    height: 87.5vw;
  }
  #singleProject .photoList.lay-square .row[data-order="6"] .listItem:nth-of-type(2) {
    width: 87.5vw;
    margin-left: 0;
    margin-top: 6.25vw;
    height: 87.5vw;
  }
}

#related {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: 10;
  background: -webkit-gradient(linear, right top, left top, from(var(--color1)), to(var(--color2)));
  background: linear-gradient(270deg, var(--color1), var(--color2));
  background-size: 200% 200%;
  -webkit-animation: colors 12s ease infinite;
          animation: colors 12s ease infinite;
  opacity: 0;
  visibility: hidden;
}
#related .projectRel {
  position: relative;
  width: auto;
  height: 100%;
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
}
#related .projectRel .projectRail {
  position: relative;
}
#related .projectRel .projectRail .railItem {
  position: absolute;
  top: 0;
  width: 100vw;
  height: 100vh;
  opacity: 0;
  visibility: hidden;
  background-size: cover;
  background-repeat: no-repeat;
}
#related .projectRel .projectRail .railItem h2 {
  position: absolute;
  bottom: 0;
  left: 2vw;
  -webkit-transform: translateY(45%);
  transform: translateY(45%);
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10vw;
}
#related .projectRel .projectRail .railItem h2 span {
  position: relative;
  float: left;
  opacity: 0;
  visibility: hidden;
  -webkit-transform: translateX(5vw) scale(1.3);
  transform: translateX(5vw) scale(1.3);
}
#related #linkRelPro {
  position: absolute;
  bottom: 25vh;
  right: 30vw;
  -webkit-transform: translateY(50%);
  transform: translateY(50%);
  z-index: 5;
  visibility: hidden;
  opacity: 0;
}
#related #linkRelPro a {
  position: relative;
  width: 180px;
  height: 45px;
  overflow: hidden;
  border-radius: 5vw;
  cursor: pointer;
  display: block;
}
#related #linkRelPro a img {
  position: absolute;
  top: 15px;
  left: 15px;
  width: 15px;
  height: 15px;
}
#related #linkRelPro a p {
  position: absolute;
  top: 50%;
  right: 30px;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  margin: 0;
}
#related #linkRelPro a p span {
  position: relative;
  float: left;
}
#related #proDragger {
  position: absolute;
  bottom: 12.5vh;
  left: 12.5vw;
  width: 75vw;
  height: 10px;
  -webkit-transform: translateY(50%);
  transform: translateY(50%);
  background-color: transparent;
  visibility: hidden;
  opacity: 0;
}
#related #proDragger .bar {
  position: absolute;
  top: 4px;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: rgba(0, 0, 0, 0.3);
}
#related #proDragger .red-bar {
  width: 40px;
  height: 10px;
  background-color: #000;
}
#related #proDragger .markers {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: auto;
}
#related #proDragger .markers span {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 1px;
  height: 15px;
  background-color: rgba(0, 0, 0, 0.3);
}
#related #closeRelPro {
  position: absolute;
  top: 25vh;
  left: 75vw;
  z-index: 2;
  width: 4.375vw;
  height: 4.375vw;
  border-radius: 50%;
  text-align: center;
  background-color: var(--subColor);
  cursor: pointer;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
#related #closeRelPro span {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  text-transform: uppercase;
  line-height: 4.375vw;
}

@-webkit-keyframes colors {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

@keyframes colors {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
#caseStudy {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
  z-index: 9;
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #caseStudy {
    padding-bottom: 15vh;
  }
}
#caseStudy section {
  position: relative;
  width: 100%;
  height: auto;
  float: left;
}
#caseStudy section.first {
  padding-bottom: 15vh;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #caseStudy section.first {
    min-height: auto;
    padding-top: calc(60px + 3*6.25vw);
    padding-bottom: 0;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #caseStudy section.first {
    padding-top: calc(60px + 6.25vw);
  }
}
#caseStudy section.first h1 {
  position: absolute;
  left: 18.75vw;
  top: calc(50vh - 8vw);
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  z-index: 3;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #caseStudy section.first h1 {
    position: relative;
    left: 6.25vw;
    top: auto;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 12vw;
    line-height: 13vw;
    width: 87.5vw;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #caseStudy section.first h1 {
    display: none;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #caseStudy section.first h1 {
    position: relative;
    left: auto;
    top: auto;
    margin-top: 40vh;
    margin-bottom: 5vh;
    margin-left: 6.25vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 12vw;
    line-height: 13vw;
  }
}
#caseStudy section.first h2 {
  display: none;
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #caseStudy section.first h2 {
    position: relative;
    left: 12.5vw;
    top: auto;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 12vw;
    line-height: 13vw;
    width: 75vw;
    display: block;
    margin-bottom: 5vw;
  }
}
#caseStudy section.first p {
  position: absolute;
  top: calc(50vh + 20vw);
  left: 18.75vw;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 25px;
  width: 30vw;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #caseStudy section.first p {
    position: relative;
    top: auto;
    left: 6.25vw;
    width: 87.5vw;
    margin-top: 5vh;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #caseStudy section.first p {
    position: relative;
    top: auto;
    left: 12.5vw;
    width: 37.5vw;
    margin-top: 0;
    float: left;
    margin-left: 6.25vw;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #caseStudy section.first p {
    position: relative;
    left: auto;
    top: auto;
    width: 50vw;
    margin: 10vh 6.25vw 0 6.25vw;
  }
}
#caseStudy section.first img {
  position: relative;
  margin-top: 20vw;
  left: 62.5vw;
  width: 31.25vw;
  height: auto;
  display: block;
  z-index: 2;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #caseStudy section.first img {
    margin-top: 5vh;
    left: 6.25vw;
    width: 87.5vw;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #caseStudy section.first img {
    margin-top: 0;
    left: 12.5vw;
    float: left;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #caseStudy section.first img {
    position: absolute;
    top: 40vh;
    margin-top: 0;
  }
}
#caseStudy section.caseSection {
  height: 100vh;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #caseStudy section.caseSection {
    height: auto;
    padding: 15vh 0 0 0;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #caseStudy section.caseSection {
    height: auto;
    padding: 15vh 0 0 0;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #caseStudy section.caseSection {
    height: auto;
    padding: 0 0 15vh 0;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #caseStudy section.caseSection.odd .textTablet {
    position: relative;
    float: left;
    width: 50vw;
    left: 6.25vw;
    padding-left: 6.25vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  #caseStudy section.caseSection.odd .textTablet h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
  }
  #caseStudy section.caseSection.odd .textTablet p {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 16px;
    line-height: 25px;
    margin-top: 5vh;
  }
  #caseStudy section.caseSection.odd .textTablet .link {
    overflow: hidden;
    position: relative;
    text-decoration: none;
    display: table;
    padding: 0 15px;
    border-radius: 5vw;
    margin-top: 5vh;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  #caseStudy section.caseSection.odd .textTablet .link img {
    position: relative;
    float: left;
    display: inline-block;
    width: 15px;
    height: 15px;
    margin: 15px 15px 15px 0;
  }
  #caseStudy section.caseSection.odd .textTablet .link span {
    position: relative;
    float: left;
    display: inline-block;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 16px;
    line-height: 45px;
  }
  #caseStudy section.caseSection.odd .textTablet .relatedProButton {
    position: relative;
    border-radius: 5vw;
    display: table;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    height: auto;
    padding: 0 15px;
    top: auto;
    left: auto;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    width: auto;
    height: auto;
    margin-top: 2vh;
  }
  #caseStudy section.caseSection.odd .textTablet .relatedProButton img {
    position: relative;
    float: left;
    display: inline-block;
    width: 15px;
    height: 15px;
    margin: 15px 15px 15px 0;
  }
  #caseStudy section.caseSection.odd .textTablet .relatedProButton span {
    position: relative;
    float: left;
    display: inline-block;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 16px;
    line-height: 45px;
  }
}
#caseStudy section.caseSection.odd .image {
  position: absolute;
  width: 62.5vw;
  left: 6.25vw;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
#caseStudy section.caseSection.odd .image picture {
  width: 100%;
}
#caseStudy section.caseSection.odd .image picture img {
  width: 100%;
  display: block;
}
#caseStudy section.caseSection.odd .image .cover {
  position: absolute;
  top: 0;
  right: 0;
  width: 0;
  height: 100%;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #caseStudy section.caseSection.odd .image {
    position: relative;
    width: 87.5vw;
    margin: 5vh 0;
    top: auto;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  #caseStudy section.caseSection.odd .image img {
    width: 100%;
    height: auto;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #caseStudy section.caseSection.odd .image {
    position: relative;
    width: 75vw;
    margin: 5vh 0;
    top: auto;
    left: 12.5vw;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  #caseStudy section.caseSection.odd .image img {
    width: 100%;
    height: auto;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #caseStudy section.caseSection.odd .image {
    position: relative;
    width: 37.5vw;
    margin: 0;
    top: auto;
    left: 6.25vw;
    float: left;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  #caseStudy section.caseSection.odd .image img {
    width: 100%;
    height: auto;
  }
}
#caseStudy section.caseSection.odd .text {
  position: absolute;
  left: 62.5vw;
  width: 31.25vw;
  text-align: left;
}
#caseStudy section.caseSection.odd .text .link {
  margin-left: 9.375vw;
}
#caseStudy section.caseSection.odd .relatedProButton {
  left: 6.25vw;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #caseStudy section.caseSection.odd h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    width: 87.5vw;
    margin: 0 6.25vw;
  }
  #caseStudy section.caseSection.odd p {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 16px;
    line-height: 25px;
    width: 87.5vw;
    margin: 0 6.25vw;
  }
  #caseStudy section.caseSection.odd .link {
    overflow: hidden;
    position: relative;
    text-decoration: none;
    display: inline-block;
    padding: 0 15px;
    border-radius: 5vw;
    margin-top: 5vh;
    margin-left: 6.25vw;
    width: 87.5vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  #caseStudy section.caseSection.odd .link img {
    position: relative;
    float: left;
    display: inline-block;
    width: 15px;
    height: 15px;
    margin: 15px 15px 15px 0;
  }
  #caseStudy section.caseSection.odd .link span {
    position: relative;
    float: left;
    display: inline-block;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 16px;
    line-height: 45px;
  }
  #caseStudy section.caseSection.odd .relatedProButton {
    position: relative;
    width: 87.5vw;
    left: 6.25vw;
    top: auto;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    border-radius: 5vw;
    display: inline-block;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    height: auto;
    padding: 0 15px;
  }
  #caseStudy section.caseSection.odd .relatedProButton img {
    position: relative;
    float: left;
    display: inline-block;
    width: 15px;
    height: 15px;
    margin: 15px 15px 15px 0;
  }
  #caseStudy section.caseSection.odd .relatedProButton span {
    position: relative;
    float: left;
    display: inline-block;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 16px;
    line-height: 45px;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #caseStudy section.caseSection.odd h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    width: 75vw;
    margin: 0 12.5vw;
  }
  #caseStudy section.caseSection.odd p {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 16px;
    line-height: 25px;
    width: 75vw;
    margin: 0 12.5vw;
  }
  #caseStudy section.caseSection.odd .link {
    overflow: hidden;
    position: relative;
    text-decoration: none;
    display: inline-block;
    padding: 0 15px;
    border-radius: 5vw;
    margin-top: 10vh;
    margin-left: 12.5vw;
    margin-right: 6.25vw;
    width: 31.25vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  #caseStudy section.caseSection.odd .link img {
    position: relative;
    float: left;
    display: inline-block;
    width: 15px;
    height: 15px;
    margin: 15px 15px 15px 0;
  }
  #caseStudy section.caseSection.odd .link span {
    position: relative;
    float: left;
    display: inline-block;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 16px;
    line-height: 45px;
  }
  #caseStudy section.caseSection.odd .relatedProButton {
    position: relative;
    width: 31.25vw;
    left: 6.25vw;
    top: auto;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    border-radius: 5vw;
    display: inline-block;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    height: auto;
    padding: 0 15px;
  }
  #caseStudy section.caseSection.odd .relatedProButton img {
    position: relative;
    float: left;
    display: inline-block;
    width: 15px;
    height: 15px;
    margin: 15px 15px 15px 0;
  }
  #caseStudy section.caseSection.odd .relatedProButton span {
    position: relative;
    float: left;
    display: inline-block;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 16px;
    line-height: 45px;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #caseStudy section.caseSection.even .textTablet {
    position: relative;
    float: left;
    width: 50vw;
    left: 6.25vw;
    padding-right: 6.25vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  #caseStudy section.caseSection.even .textTablet h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
  }
  #caseStudy section.caseSection.even .textTablet p {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 16px;
    line-height: 25px;
    margin-top: 5vh;
  }
  #caseStudy section.caseSection.even .textTablet .link {
    overflow: hidden;
    position: relative;
    text-decoration: none;
    display: table;
    padding: 0 15px;
    border-radius: 5vw;
    margin-top: 5vh;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  #caseStudy section.caseSection.even .textTablet .link img {
    position: relative;
    float: left;
    display: inline-block;
    width: 15px;
    height: 15px;
    margin: 15px 15px 15px 0;
  }
  #caseStudy section.caseSection.even .textTablet .link span {
    position: relative;
    float: left;
    display: inline-block;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 16px;
    line-height: 45px;
  }
  #caseStudy section.caseSection.even .textTablet .relatedProButton {
    position: relative;
    border-radius: 5vw;
    display: table;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    height: auto;
    padding: 0 15px;
    top: auto;
    left: auto;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    width: auto;
    height: auto;
    margin-top: 2vh;
    right: auto;
  }
  #caseStudy section.caseSection.even .textTablet .relatedProButton img {
    position: relative;
    float: left;
    display: inline-block;
    width: 15px;
    height: 15px;
    margin: 15px 15px 15px 0;
  }
  #caseStudy section.caseSection.even .textTablet .relatedProButton span {
    position: relative;
    float: left;
    display: inline-block;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 16px;
    line-height: 45px;
  }
}
#caseStudy section.caseSection.even .image {
  position: absolute;
  width: 62.5vw;
  right: 6.25vw;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
#caseStudy section.caseSection.even .image picture {
  width: 100%;
}
#caseStudy section.caseSection.even .image picture img {
  width: 100%;
  display: block;
}
#caseStudy section.caseSection.even .image .cover {
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #caseStudy section.caseSection.even .image {
    position: relative;
    width: 87.5vw;
    margin: 5vh 0;
    top: auto;
    right: auto;
    left: 6.25vw;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  #caseStudy section.caseSection.even .image img {
    width: 100%;
    height: auto;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #caseStudy section.caseSection.even .image {
    position: relative;
    width: 75vw;
    margin: 5vh 0;
    top: auto;
    right: auto;
    left: 12.5vw;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  #caseStudy section.caseSection.even .image img {
    width: 100%;
    height: auto;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #caseStudy section.caseSection.even .image {
    position: relative;
    width: 37.5vw;
    margin: 5vh 0;
    top: auto;
    right: auto;
    left: 6.25vw;
    float: left;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  #caseStudy section.caseSection.even .image img {
    width: 100%;
    height: auto;
  }
}
#caseStudy section.caseSection.even .text {
  position: absolute;
  right: 62.5vw;
  width: 31.25vw;
  text-align: right;
}
#caseStudy section.caseSection.even .text .link {
  margin-right: 9.375vw;
}
#caseStudy section.caseSection.even .relatedProButton {
  right: 6.25vw;
  -webkit-transform: translateX(50%);
  transform: translateX(50%);
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #caseStudy section.caseSection.even h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    width: 87.5vw;
    margin: 0 6.25vw;
  }
  #caseStudy section.caseSection.even p {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 16px;
    line-height: 25px;
    width: 87.5vw;
    margin: 0 6.25vw;
  }
  #caseStudy section.caseSection.even .link {
    overflow: hidden;
    position: relative;
    text-decoration: none;
    display: inline-block;
    padding: 0 15px;
    border-radius: 5vw;
    margin-top: 5vh;
    margin-left: 6.25vw;
    width: 87.5vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  #caseStudy section.caseSection.even .link img {
    position: relative;
    float: left;
    display: inline-block;
    width: 15px;
    height: 15px;
    margin: 15px 15px 15px 0;
  }
  #caseStudy section.caseSection.even .link span {
    position: relative;
    float: left;
    display: inline-block;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 16px;
    line-height: 45px;
  }
  #caseStudy section.caseSection.even .relatedProButton {
    position: relative;
    width: 87.5vw;
    left: 6.25vw;
    top: auto;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    border-radius: 5vw;
    display: inline-block;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    height: auto;
    padding: 0 15px;
  }
  #caseStudy section.caseSection.even .relatedProButton img {
    position: relative;
    float: left;
    display: inline-block;
    width: 15px;
    height: 15px;
    margin: 15px 15px 15px 0;
  }
  #caseStudy section.caseSection.even .relatedProButton span {
    position: relative;
    float: left;
    display: inline-block;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 16px;
    line-height: 45px;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #caseStudy section.caseSection.even h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    width: 75vw;
    margin: 0 12.5vw;
  }
  #caseStudy section.caseSection.even p {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 16px;
    line-height: 25px;
    width: 75vw;
    margin: 0 12.5vw;
  }
  #caseStudy section.caseSection.even .link {
    overflow: hidden;
    position: relative;
    text-decoration: none;
    display: inline-block;
    padding: 0 15px;
    border-radius: 5vw;
    margin-top: 10vh;
    margin-left: 12.5vw;
    margin-right: 6.25vw;
    width: 31.25vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  #caseStudy section.caseSection.even .link img {
    position: relative;
    float: left;
    display: inline-block;
    width: 15px;
    height: 15px;
    margin: 15px 15px 15px 0;
  }
  #caseStudy section.caseSection.even .link span {
    position: relative;
    float: left;
    display: inline-block;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 16px;
    line-height: 45px;
  }
  #caseStudy section.caseSection.even .relatedProButton {
    position: relative;
    width: 31.25vw;
    left: 6.25vw;
    top: auto;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    border-radius: 5vw;
    display: inline-block;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    height: auto;
    padding: 0 15px;
  }
  #caseStudy section.caseSection.even .relatedProButton img {
    position: relative;
    float: left;
    display: inline-block;
    width: 15px;
    height: 15px;
    margin: 15px 15px 15px 0;
  }
  #caseStudy section.caseSection.even .relatedProButton span {
    position: relative;
    float: left;
    display: inline-block;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 16px;
    line-height: 45px;
  }
}
#caseStudy section.caseSection .text {
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
#caseStudy section.caseSection .text h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 9vw;
  overflow: hidden;
}
#caseStudy section.caseSection .text h2 span {
  position: relative;
  float: left;
  opacity: 1;
  visibility: visible;
  -webkit-transform: scale(1) translateX(0);
  transform: scale(1) translateX(0);
}
#caseStudy section.caseSection .text p {
  margin-top: 5vh;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 25px;
}
#caseStudy section.caseSection .text .link {
  overflow: hidden;
  position: relative;
  text-decoration: none;
  display: inline-block;
  padding: 0 15px;
  border-radius: 5vw;
  margin-top: 5vh;
}
#caseStudy section.caseSection .text .link img {
  position: relative;
  float: left;
  display: inline-block;
  width: 15px;
  height: 15px;
  margin: 15px 15px 15px 0;
}
#caseStudy section.caseSection .text .link span {
  position: relative;
  float: left;
  display: inline-block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 45px;
}
#caseStudy section.caseSection .relatedProButton {
  position: absolute;
  top: 30vh;
  z-index: 6;
  width: 6.25vw;
  height: 6.25vw;
}
#caseStudy section.caseSection .relatedProButton .bg {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  cursor: pointer;
}
#caseStudy section.caseSection .relatedProButton .continue2 {
  position: absolute;
  top: -0.5vw;
  left: -0.5vw;
  width: calc(100% + 1vw);
  height: calc(100% + 1vw);
}
#caseStudy section.caseSection .relatedProButton .continue2 circle {
  -webkit-transform: rotate(-90deg);
          transform: rotate(-90deg);
  -webkit-transform-origin: center;
          transform-origin: center;
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  cx: 3.625vw;
  cy: 3.625vw;
}
#caseStudy section.caseSection .relatedProButton .continue2 circle.active {
  -webkit-animation-name: circle-chart-fill;
          animation-name: circle-chart-fill;
  -webkit-animation-duration: 3s;
          animation-duration: 3s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  stroke-dasharray: 1000;
  stroke-dashoffset: 0;
}
#caseStudy section.caseSection .relatedProButton .dotted2 {
  position: absolute;
  top: -0.5vw;
  left: -0.5vw;
  width: calc(100% + 1vw);
  height: calc(100% + 1vw);
}
#caseStudy section.caseSection .relatedProButton .dotted2 circle {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transform-origin: center;
          transform-origin: center;
  stroke-dasharray: 1 3;
  stroke-dashoffset: 5;
  stroke-linecap: round;
  cx: 3.625vw;
  cy: 3.625vw;
  stroke: #fff;
}
#caseStudy section.caseSection .relatedProButton:hover #dotted circle {
  -webkit-animation-name: animation-rotation-dots;
          animation-name: animation-rotation-dots;
  -webkit-animation-duration: 20s;
          animation-duration: 20s;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
#caseStudy section.caseSection .relatedProButton .count {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 33.3333333333%;
  height: auto;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  cursor: pointer;
}
#caseStudy section.caseSection .relatedProButton .count svg {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#caseStudy section.caseSection .relatedProButton .count svg path {
  fill: #fff;
}
#caseStudy section.caseSection .relatedProButton .count svg path#extCircle {
  opacity: 0;
}
#caseStudy section.caseSection .relatedProButton .count svg path#inCircle {
  opacity: 0;
}
#caseStudy section.caseSection .relatedProButton .count .visible {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#caseStudy section.caseSection .relatedProButton .count:hover svg {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#caseStudy section.caseSection .relatedProButton .count:hover svg path#inCircle {
  -webkit-animation-name: inner-circle-ani;
          animation-name: inner-circle-ani;
  -webkit-animation-duration: 1.5s;
          animation-duration: 1.5s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
#caseStudy section.caseSection .relatedProButton .count:hover svg path#extCircle {
  -webkit-animation-name: ext-circle-ani;
          animation-name: ext-circle-ani;
  -webkit-animation-duration: 1.5s;
          animation-duration: 1.5s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
#caseStudy section.caseSection .relatedProButton .count:hover .visible {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}

@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #mobRelated {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 0;
    z-index: 30;
    -webkit-transition: height 0.35s ease-in-out 0s;
    transition: height 0.35s ease-in-out 0s;
    overflow-y: scroll;
  }
  #mobRelated.open {
    height: 100vh;
    -webkit-transition: height 0.35s ease-in-out 0s;
    transition: height 0.35s ease-in-out 0s;
  }
  #mobRelated .close {
    position: fixed;
    top: 3.125vw;
    left: 3.125vw;
    width: 60px;
    height: 60px;
    line-height: 60px;
    text-align: center;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 12px;
    text-transform: uppercase;
    border-radius: 60px;
    visibility: hidden;
    opacity: 0;
    z-index: 3;
  }
  #mobRelated .list {
    position: relative;
    width: 87.5vw;
    height: auto;
    z-index: 2;
    margin: 0 6.25vw;
    padding: 15vh 0 10vh 0;
  }
  #mobRelated .list .railItem {
    margin-bottom: 5vh;
  }
  #mobRelated .list .railItem h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    margin-bottom: 10px;
  }
  #mobRelated .list .railItem img {
    width: 100%;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #mobRelated {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 0;
    z-index: 30;
    -webkit-transition: height 0.35s ease-in-out 0s;
    transition: height 0.35s ease-in-out 0s;
    overflow-y: scroll;
  }
  #mobRelated.open {
    height: 100vh;
    -webkit-transition: height 0.35s ease-in-out 0s;
    transition: height 0.35s ease-in-out 0s;
  }
  #mobRelated .close {
    position: fixed;
    top: 3.125vw;
    left: 3.125vw;
    width: 60px;
    height: 60px;
    line-height: 60px;
    text-align: center;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 12px;
    text-transform: uppercase;
    border-radius: 60px;
    visibility: hidden;
    opacity: 0;
    z-index: 3;
  }
  #mobRelated .list {
    position: relative;
    width: 87.5vw;
    height: auto;
    z-index: 2;
    margin: 0 6.25vw;
    padding: 15vh 0 10vh 0;
  }
  #mobRelated .list .railItem {
    margin-bottom: 5vh;
  }
  #mobRelated .list .railItem h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    margin-bottom: 10px;
  }
  #mobRelated .list .railItem img {
    width: 100%;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  #mobRelated {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 0;
    z-index: 30;
    -webkit-transition: height 0.35s ease-in-out 0s;
    transition: height 0.35s ease-in-out 0s;
    overflow-y: scroll;
  }
  #mobRelated.open {
    height: 100vh;
    -webkit-transition: height 0.35s ease-in-out 0s;
    transition: height 0.35s ease-in-out 0s;
  }
  #mobRelated .close {
    position: fixed;
    top: 3.125vw;
    left: 3.125vw;
    width: 60px;
    height: 60px;
    line-height: 60px;
    text-align: center;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 12px;
    text-transform: uppercase;
    border-radius: 60px;
    visibility: hidden;
    opacity: 0;
    z-index: 3;
  }
  #mobRelated .list {
    position: relative;
    width: 87.5vw;
    height: auto;
    z-index: 2;
    margin: 0 6.25vw;
    padding: 15vh 0 10vh 0;
  }
  #mobRelated .list .railItem {
    margin-bottom: 5vh;
  }
  #mobRelated .list .railItem h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    margin-bottom: 10px;
  }
  #mobRelated .list .railItem img {
    width: 100%;
  }
}

#stories {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
  z-index: 9;
}
#stories section {
  position: relative;
  width: 100%;
  height: auto;
  float: left;
}
#stories section.first h1 {
  position: absolute;
  left: 18.75vw;
  top: calc(50vh - 4vw);
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  z-index: 3;
}
#stories section.first .firstText {
  position: absolute;
  left: 18.75vw;
  top: calc(50vh + 15vw);
  width: 37.5vw;
}
#stories section.first .firstText h1 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  z-index: 3;
}
#stories section.first .firstText h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 2vw;
  line-height: 2vw;
  z-index: 3;
}
#stories section.first .firstText span {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  line-height: 16px;
  text-transform: uppercase;
  margin-top: 0.5vh;
  margin-bottom: 2vh;
  display: block;
}
#stories section.first .firstText p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 25px;
}
#stories section.first .firstText .tags {
  position: relative;
  overflow: hidden;
  margin-top: 1vh;
}
#stories section.first .firstText .tags a {
  position: relative;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  line-height: 16px;
  text-decoration: none;
  display: inline-block;
  float: left;
}
#stories section.first .firstText .tags .separator {
  position: relative;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  line-height: 16px;
  display: inline-block;
  float: left;
  margin: 0 2px;
}
#stories section.first .firstText .link {
  overflow: hidden;
  position: relative;
  text-decoration: none;
  display: inline-block;
  padding: 0 15px;
  border-radius: 5vw;
  margin-top: 5vh;
  background-color: var(--subColor);
}
#stories section.first .firstText .link img {
  position: relative;
  left: auto;
  float: left;
  display: inline-block;
  width: 15px;
  height: 15px;
  margin: 15px 15px 15px 0;
}
#stories section.first .firstText .link span {
  position: relative;
  float: left;
  display: inline-block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 45px;
  margin: 0;
  text-transform: none;
}
#stories section.first picture {
  position: relative;
  margin-top: 20vw;
  left: 62.5vw;
  width: 31.25vw;
  height: auto;
  display: block;
  z-index: 2;
}
#stories section.first picture img {
  width: 100%;
  display: block;
}
#stories section.first.otherPages {
  position: relative;
  width: 100%;
  height: calc(60vh + 4vw);
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #stories section.first.otherPages {
    height: auto;
  }
  #stories section.first.otherPages h1 {
    margin-bottom: 0;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #stories section.first.otherPages {
    height: auto;
  }
  #stories section.first.otherPages h1 {
    margin-bottom: 0;
  }
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #stories section.first {
    padding-top: calc(60px + 3*6.25vw);
  }
  #stories section.first h1 {
    position: relative;
    left: 6.25vw;
    top: auto;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 12vw;
    line-height: 12vw;
    z-index: 3;
    margin-bottom: 10vh;
  }
  #stories section.first .firstText {
    position: relative;
    left: auto;
    top: auto;
    width: 87.5vw;
    margin: 0 6.25vw;
  }
  #stories section.first .firstText h1 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    line-height: 8vw;
    z-index: 3;
  }
  #stories section.first .firstText h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 30px;
    line-height: 35px;
    z-index: 3;
  }
  #stories section.first .firstText span {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 12px;
    margin-top: 0;
    margin-bottom: 0;
  }
  #stories section.first .firstText picture {
    position: relative;
    margin-top: 5vh;
    left: auto;
    width: 87.5vw;
    height: auto;
    display: block;
    z-index: 2;
  }
  #stories section.first .firstText picture img {
    width: 100%;
    display: block;
  }
  #stories section.first .firstText .tags {
    margin-top: 3vh;
    margin-bottom: 1vh;
  }
  #stories section.first .firstText .tags a {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 12px;
  }
  #stories section.first .firstText .tags .separator {
    margin: 0 5px;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 12px;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #stories section.first {
    padding-top: calc(60px + 6.25vw);
  }
  #stories section.first h1 {
    position: relative;
    left: 12.5vw;
    top: auto;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 12vw;
    line-height: 12vw;
    z-index: 3;
    margin-bottom: 10vh;
  }
  #stories section.first .firstText {
    position: relative;
    left: auto;
    top: auto;
    width: 75vw;
    margin: 0 12.5vw;
    overflow: hidden;
  }
  #stories section.first .firstText h1 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    line-height: 8vw;
    z-index: 3;
  }
  #stories section.first .firstText h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 30px;
    line-height: 35px;
    z-index: 3;
  }
  #stories section.first .firstText span {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 12px;
    margin-top: 0;
    margin-bottom: 0;
  }
  #stories section.first .firstText picture {
    position: relative;
    float: left;
    margin-top: 0;
    left: auto;
    width: 31.25vw;
    height: auto;
    display: block;
    z-index: 2;
  }
  #stories section.first .firstText picture img {
    width: 100%;
    display: block;
  }
  #stories section.first .firstText .cn {
    position: relative;
    width: 43.75vw;
    float: left;
    padding-left: 6.25vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  #stories section.first .firstText .tags {
    margin-top: 3vh;
    margin-bottom: 1vh;
  }
  #stories section.first .firstText .tags a {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 12px;
  }
  #stories section.first .firstText .tags .separator {
    margin: 0 5px;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 12px;
  }
}
#stories section.odd .postText {
  position: absolute;
  left: 43.75vw;
  top: 50%;
  width: 37.5vw;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
#stories section.odd .postText h1 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  z-index: 3;
}
#stories section.odd .postText h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 2vw;
  line-height: 2vw;
  z-index: 3;
}
#stories section.odd .postText span {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  line-height: 16px;
  text-transform: uppercase;
  margin-top: 0.5vh;
  margin-bottom: 2vh;
  display: block;
}
#stories section.odd .postText p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 25px;
}
#stories section.odd .postText .tags {
  position: relative;
  overflow: hidden;
  margin-top: 1vh;
}
#stories section.odd .postText .tags a {
  position: relative;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  line-height: 16px;
  text-decoration: none;
  display: inline-block;
  float: left;
}
#stories section.odd .postText .tags .separator {
  position: relative;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  line-height: 16px;
  display: inline-block;
  float: left;
  margin: 0 2px;
}
#stories section.odd .postText .link {
  overflow: hidden;
  position: relative;
  text-decoration: none;
  display: inline-block;
  padding: 0 15px;
  border-radius: 5vw;
  margin-top: 5vh;
  background-color: var(--subColor);
}
#stories section.odd .postText .link img {
  position: relative;
  left: auto;
  float: left;
  display: inline-block;
  width: 15px;
  height: 15px;
  margin: 15px 15px 15px 0;
}
#stories section.odd .postText .link span {
  position: relative;
  float: left;
  display: inline-block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 45px;
  margin: 0;
  text-transform: none;
}
#stories section.odd picture {
  position: relative;
  left: 6.25vw;
  width: 31.25vw;
  height: auto;
  display: block;
  z-index: 2;
}
#stories section.odd picture img {
  width: 100%;
  display: block;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #stories section.odd {
    padding-top: calc(60px + 3*6.25vw);
  }
  #stories section.odd h1 {
    position: relative;
    left: 6.25vw;
    top: auto;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 12vw;
    line-height: 12vw;
    z-index: 3;
    margin-bottom: 10vh;
  }
  #stories section.odd .postText {
    position: relative;
    left: auto;
    top: auto;
    width: 87.5vw;
    margin: 0 6.25vw;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  #stories section.odd .postText h1 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    line-height: 8vw;
    z-index: 3;
  }
  #stories section.odd .postText h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 30px;
    line-height: 35px;
    z-index: 3;
  }
  #stories section.odd .postText span {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 12px;
    margin-top: 0;
    margin-bottom: 0;
  }
  #stories section.odd .postText picture {
    position: relative;
    margin-top: 5vh;
    left: auto;
    width: 87.5vw;
    height: auto;
    display: block;
    z-index: 2;
  }
  #stories section.odd .postText picture img {
    width: 100%;
    display: block;
  }
  #stories section.odd .postText .tags {
    margin-top: 3vh;
    margin-bottom: 1vh;
  }
  #stories section.odd .postText .tags a {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 12px;
  }
  #stories section.odd .postText .tags .separator {
    margin: 0 5px;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 12px;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #stories section.odd {
    padding-top: calc(60px + 6.25vw);
  }
  #stories section.odd h1 {
    position: relative;
    left: 6.25vw;
    top: auto;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 12vw;
    line-height: 12vw;
    z-index: 3;
    margin-bottom: 10vh;
  }
  #stories section.odd .postText {
    position: relative;
    left: auto;
    top: auto;
    width: 75vw;
    margin: 0 12.5vw;
    overflow: hidden;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  #stories section.odd .postText h1 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    line-height: 8vw;
    z-index: 3;
  }
  #stories section.odd .postText h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 30px;
    line-height: 35px;
    z-index: 3;
  }
  #stories section.odd .postText span {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 12px;
    margin-top: 0;
    margin-bottom: 0;
  }
  #stories section.odd .postText picture {
    position: relative;
    float: right;
    margin-top: 0;
    left: auto;
    width: 31.25vw;
    height: auto;
    display: block;
    z-index: 2;
  }
  #stories section.odd .postText picture img {
    width: 100%;
    display: block;
  }
  #stories section.odd .postText .cn {
    position: relative;
    float: right;
    width: 43.75vw;
    padding-right: 6.25vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  #stories section.odd .postText .tags {
    margin-top: 3vh;
    margin-bottom: 1vh;
  }
  #stories section.odd .postText .tags a {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 12px;
  }
  #stories section.odd .postText .tags .separator {
    margin: 0 5px;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 12px;
  }
}
#stories section.even .postText {
  position: absolute;
  left: 18.75vw;
  top: 50%;
  width: 37.5vw;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
#stories section.even .postText h1 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  z-index: 3;
}
#stories section.even .postText h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 2vw;
  line-height: 2vw;
  z-index: 3;
}
#stories section.even .postText span {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  line-height: 16px;
  text-transform: uppercase;
  margin-top: 0.5vh;
  margin-bottom: 2vh;
  display: block;
}
#stories section.even .postText p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 25px;
}
#stories section.even .postText .tags {
  position: relative;
  overflow: hidden;
  margin-top: 1vh;
}
#stories section.even .postText .tags a {
  position: relative;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  line-height: 16px;
  text-decoration: none;
  display: inline-block;
  float: left;
}
#stories section.even .postText .tags .separator {
  position: relative;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  line-height: 16px;
  display: inline-block;
  float: left;
  margin: 0 2px;
}
#stories section.even .postText .link {
  overflow: hidden;
  position: relative;
  text-decoration: none;
  display: inline-block;
  padding: 0 15px;
  border-radius: 5vw;
  margin-top: 5vh;
  background-color: var(--subColor);
}
#stories section.even .postText .link img {
  position: relative;
  left: auto;
  float: left;
  display: inline-block;
  width: 15px;
  height: 15px;
  margin: 15px 15px 15px 0;
}
#stories section.even .postText .link span {
  position: relative;
  float: left;
  display: inline-block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 45px;
  margin: 0;
  text-transform: none;
}
#stories section.even picture {
  position: relative;
  left: 62.5vw;
  width: 31.25vw;
  height: auto;
  display: block;
  z-index: 2;
}
#stories section.even picture img {
  width: 100%;
  display: block;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #stories section.even {
    padding-top: calc(60px + 3*6.25vw);
  }
  #stories section.even h1 {
    position: relative;
    left: 6.25vw;
    top: auto;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 12vw;
    line-height: 12vw;
    z-index: 3;
    margin-bottom: 10vh;
  }
  #stories section.even .postText {
    position: relative;
    left: auto;
    top: auto;
    width: 87.5vw;
    margin: 0 6.25vw;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  #stories section.even .postText h1 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    line-height: 8vw;
    z-index: 3;
  }
  #stories section.even .postText h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 30px;
    line-height: 35px;
    z-index: 3;
  }
  #stories section.even .postText span {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 12px;
    margin-top: 0;
    margin-bottom: 0;
  }
  #stories section.even .postText picture {
    position: relative;
    margin-top: 5vh;
    left: auto;
    width: 87.5vw;
    height: auto;
    display: block;
    z-index: 2;
  }
  #stories section.even .postText picture img {
    width: 100%;
    display: block;
  }
  #stories section.even .postText .tags {
    margin-top: 3vh;
    margin-bottom: 1vh;
  }
  #stories section.even .postText .tags a {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 12px;
  }
  #stories section.even .postText .tags .separator {
    margin: 0 5px;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 12px;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #stories section.even {
    padding-top: calc(60px + 6.25vw);
  }
  #stories section.even h1 {
    position: relative;
    left: 6.25vw;
    top: auto;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 12vw;
    line-height: 12vw;
    z-index: 3;
    margin-bottom: 10vh;
  }
  #stories section.even .postText {
    position: relative;
    left: auto;
    top: auto;
    width: 75vw;
    margin: 0 12.5vw;
    overflow: hidden;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  #stories section.even .postText h1 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    line-height: 8vw;
    z-index: 3;
  }
  #stories section.even .postText h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 30px;
    line-height: 35px;
    z-index: 3;
  }
  #stories section.even .postText span {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 12px;
    margin-top: 0;
    margin-bottom: 0;
  }
  #stories section.even .postText picture {
    position: relative;
    float: left;
    margin-top: 0;
    left: auto;
    width: 31.25vw;
    height: auto;
    display: block;
    z-index: 2;
  }
  #stories section.even .postText picture img {
    width: 100%;
    display: block;
  }
  #stories section.even .postText .cn {
    position: relative;
    width: 43.75vw;
    float: left;
    padding-left: 6.25vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  #stories section.even .postText .tags {
    margin-top: 3vh;
    margin-bottom: 1vh;
  }
  #stories section.even .postText .tags a {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 12px;
  }
  #stories section.even .postText .tags .separator {
    margin: 0 5px;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 12px;
  }
}
#stories .postsNavigation {
  position: relative;
  width: 100%;
  height: 40px;
  float: left;
  padding: 5vh 0 15vh 0;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #stories .postsNavigation {
    padding-top: 10vh;
  }
}
#stories .postsNavigation .nav {
  position: absolute;
  top: 5vh;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  overflow: hidden;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #stories .postsNavigation .nav {
    width: calc(200px + 6.25vw);
    top: auto;
  }
}
#stories .postsNavigation .nav .prevNav {
  position: relative;
  float: left;
  width: 40px;
  height: 40px;
  margin-right: 3.125vw;
  border-radius: 50%;
}
#stories .postsNavigation .nav .prevNav img {
  width: 16px;
  margin: 12px;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
#stories .postsNavigation .nav .prevNav.disabled {
  opacity: 0;
}
#stories .postsNavigation .nav .nextNav {
  position: relative;
  float: left;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  margin-left: 3.125vw;
}
#stories .postsNavigation .nav .nextNav img {
  width: 16px;
  margin: 12px;
}
#stories .postsNavigation .nav .nextNav.disabled {
  opacity: 0;
}
#stories .postsNavigation .nav .page {
  position: relative;
  float: left;
  width: 40px;
  height: 40px;
  text-align: center;
  line-height: 40px;
  margin-right: 5px;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  border-radius: 50%;
  margin: 0;
}

#storiesPost {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
  z-index: 9;
}
#storiesPost section {
  position: relative;
  width: 100%;
  height: auto;
  float: left;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #storiesPost section.first {
    padding-top: calc(60px + 3*6.25vw);
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #storiesPost section.first {
    padding-top: calc(60px + 6.25vw);
  }
}
#storiesPost section.first .textPost {
  position: absolute;
  left: 18.75vw;
  top: calc(50vh - 4vw);
  z-index: 4;
}
#storiesPost section.first .textPost h1 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  z-index: 3;
}
#storiesPost section.first .textPost p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 25px;
  width: 37.5vw;
  margin-top: 5vh;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #storiesPost section.first .textPost {
    position: relative;
    left: 6.25vw;
    top: auto;
  }
  #storiesPost section.first .textPost h1 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 12vw;
    line-height: 12vw;
  }
  #storiesPost section.first .textPost p {
    width: 87.5vw;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #storiesPost section.first .textPost {
    position: relative;
    left: 12.5vw;
    width: 75vw;
    top: auto;
    overflow: hidden;
  }
  #storiesPost section.first .textPost h1 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 8vw;
    line-height: 8vw;
  }
  #storiesPost section.first .textPost.land {
    position: relative;
    width: 43.75vw;
    float: right;
    padding-right: 6.25vw;
    left: auto;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  #storiesPost section.first .textPost p {
    width: 100%;
  }
}
#storiesPost section.first .breadCrumb {
  position: absolute;
  left: 18.75vw;
  top: calc(50vh - 4vw - 32px);
}
#storiesPost section.first .breadCrumb a {
  position: relative;
  float: left;
  display: inline-block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 14px;
  line-height: 16px;
  text-decoration: none;
}
#storiesPost section.first .breadCrumb p {
  position: relative;
  float: left;
  display: inline-block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 14px;
  line-height: 16px;
}
#storiesPost section.first .breadCrumb span {
  position: relative;
  float: left;
  display: inline-block;
  width: 10px;
  height: 10px;
  margin: 0 10px;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #storiesPost section.first .breadCrumb {
    position: relative;
    overflow: hidden;
    width: 87.5vw;
    left: 6.25vw;
    top: auto;
    margin-bottom: 2vh;
  }
  #storiesPost section.first .breadCrumb a {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 20px;
  }
  #storiesPost section.first .breadCrumb p {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 20px;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #storiesPost section.first .breadCrumb {
    position: relative;
    overflow: hidden;
    width: 75vw;
    left: 12.5vw;
    top: auto;
    margin-bottom: 2vh;
  }
  #storiesPost section.first .breadCrumb a {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 20px;
  }
  #storiesPost section.first .breadCrumb p {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 10px;
    line-height: 20px;
  }
}
#storiesPost section.first picture {
  position: relative;
  margin-top: 20vw;
  left: 62.5vw;
  width: 31.25vw;
  height: auto;
  display: block;
  z-index: 2;
}
#storiesPost section.first picture img {
  width: 100%;
  display: block;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #storiesPost section.first picture {
    left: auto;
    width: 87.5vw;
    margin: 5vh 6.25vw 5vh 6.25vw;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #storiesPost section.first picture {
    position: relative;
    float: right;
    left: auto;
    width: 31.25vw;
    margin: 0 12.5vw 0 0;
  }
}
#storiesPost section.postSec h1 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #storiesPost section.postSec h1 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 12vw;
  }
}
#storiesPost section.postSec h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 2vw;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #storiesPost section.postSec h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 30px;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #storiesPost section.postSec h2 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 30px;
  }
}
#storiesPost section.postSec h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 30px;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #storiesPost section.postSec h3 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #storiesPost section.postSec h3 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
  }
}
#storiesPost section.postSec p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  margin: 5vh 0 0 0;
  line-height: 25px;
}
#storiesPost section.textOnly {
  padding: 15vh 18.75vw;
}
#storiesPost section.textOnly .cont {
  position: relative;
  width: 62.5vw;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #storiesPost section.textOnly {
    padding: 15vh 6.25vw;
  }
  #storiesPost section.textOnly .cont {
    width: 87.5vw;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #storiesPost section.textOnly {
    padding: 15vw 12.5vw;
  }
  #storiesPost section.textOnly .cont {
    width: 75vw;
  }
}
#storiesPost section.imageOnly {
  padding: 15vh 0;
}
#storiesPost section.imageOnly .cont {
  position: relative;
  width: 75vw;
  height: auto;
}
#storiesPost section.imageOnly .cont picture {
  width: 100%;
  height: auto;
  display: block;
  margin: 0 12.5vw;
}
#storiesPost section.imageOnly .cont picture img {
  width: 100%;
  height: auto;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #storiesPost section.imageOnly {
    padding: 0 6.25vw;
  }
  #storiesPost section.imageOnly .cont {
    width: 87.5vw;
  }
  #storiesPost section.imageOnly .cont picture {
    margin: 0;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #storiesPost section.imageOnly {
    padding: 0;
  }
  #storiesPost section.imageOnly .cont {
    width: 100vw;
  }
  #storiesPost section.imageOnly .cont picture {
    margin: 0;
  }
}
#storiesPost section.doubleImage {
  padding: 15vh 0;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #storiesPost section.doubleImage {
    padding: 15vh 6.25vw 0 6.25vw;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #storiesPost section.doubleImage {
    padding: 15vw 0 calc(15vw + 30vh) 0;
  }
}
#storiesPost section.doubleImage .txt {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: 7;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #storiesPost section.doubleImage .txt {
    position: relative;
    top: auto;
    left: auto;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    margin-bottom: 5vh;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #storiesPost section.doubleImage .txt {
    width: 100%;
    text-align: center;
  }
}
#storiesPost section.doubleImage .half {
  width: 56.25vw;
  height: auto;
}
#storiesPost section.doubleImage .half picture {
  width: 100%;
  display: block;
}
#storiesPost section.doubleImage .half picture img {
  width: 100%;
  display: block;
}
#storiesPost section.doubleImage .half:first-of-type {
  position: relative;
  margin-bottom: 15vh;
  z-index: 5;
}
#storiesPost section.doubleImage .half:nth-of-type(2) {
  position: absolute;
  right: 0;
  top: 30vh;
  z-index: 3;
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #storiesPost section.doubleImage .half:nth-of-type(2) {
    top: calc(30vh + 15vw);
  }
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #storiesPost section.doubleImage .half {
    width: 87.5vw;
  }
  #storiesPost section.doubleImage .half:first-of-type {
    position: relative;
  }
  #storiesPost section.doubleImage .half:nth-of-type(2) {
    position: relative;
    right: auto;
    top: auto;
    margin-bottom: 6.25vw;
  }
}
#storiesPost section.tripleImage {
  padding: 15vh 0;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #storiesPost section.tripleImage {
    padding: 15vh 6.25vw 0 6.25vw;
  }
}
#storiesPost section.tripleImage .column {
  width: 30%;
  float: left;
  margin: 0 1.6666666667%;
}
#storiesPost section.tripleImage .column picture {
  width: 100%;
  height: auto;
}
#storiesPost section.tripleImage .column picture img {
  width: 100%;
  display: block;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #storiesPost section.tripleImage .column {
    width: 87.5vw;
    margin: 0 0 6.25vw 0;
  }
  #storiesPost section.tripleImage .column:last-of-type {
    margin-bottom: 0;
  }
}
#storiesPost section.photoText {
  padding: 15vh 0;
}
#storiesPost section.photoText .image {
  position: relative;
  left: 6.25vw;
  float: left;
  width: 31.25vw;
  height: auto;
}
#storiesPost section.photoText .image picture {
  width: 100%;
  height: auto;
}
#storiesPost section.photoText .image picture img {
  width: 100%;
  height: auto;
  display: block;
}
#storiesPost section.photoText .text {
  position: relative;
  float: left;
  left: 12.5vw;
  width: 37.5vw;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #storiesPost section.photoText {
    padding: 15vh 6.25vw 0 6.25vw;
  }
  #storiesPost section.photoText .image {
    left: auto;
    width: 87.5vw;
  }
  #storiesPost section.photoText .text {
    left: auto;
    width: 87.5vw;
    margin-top: 5vh;
  }
}
#storiesPost section.textPhoto {
  padding: 15vh 0;
}
#storiesPost section.textPhoto .text {
  position: relative;
  float: left;
  left: 18.75vw;
  width: 37.5vw;
}
#storiesPost section.textPhoto .image {
  position: relative;
  left: 25vw;
  float: left;
  width: 31.25vw;
  height: auto;
}
#storiesPost section.textPhoto .image picture {
  width: 100%;
  height: auto;
}
#storiesPost section.textPhoto .image picture img {
  width: 100%;
  height: auto;
  display: block;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #storiesPost section.textPhoto {
    padding: 15vh 6.25vw 0 6.25vw;
  }
  #storiesPost section.textPhoto .image {
    left: auto;
    width: 87.5vw;
    margin-top: 5vh;
  }
  #storiesPost section.textPhoto .text {
    left: auto;
    width: 87.5vw;
  }
}
#storiesPost section.gallery {
  padding: 15vh 0;
}
#storiesPost section.gallery .has-slider {
  position: relative;
  width: 100%;
  height: auto;
}
#storiesPost section.gallery .has-slider .slider {
  position: relative;
  left: 12.5vw;
  overflow: hidden;
}
#storiesPost section.gallery .has-slider .slider.is-animating {
  transition: -webkit-transform 400ms cubic-bezier(0.5, 0, 0.5, 1);
  -webkit-transition: -webkit-transform 400ms cubic-bezier(0.5, 0, 0.5, 1);
  transition: transform 400ms cubic-bezier(0.5, 0, 0.5, 1);
  transition: transform 400ms cubic-bezier(0.5, 0, 0.5, 1), -webkit-transform 400ms cubic-bezier(0.5, 0, 0.5, 1);
}
#storiesPost section.gallery .has-slider .slider .slider-panel {
  position: relative;
  width: 25vw;
  height: auto;
  overflow: hidden;
  float: left;
  margin-right: 3.125vw;
}
#storiesPost section.gallery .has-slider .slider .slider-panel:last-of-type {
  margin: 0;
}
#storiesPost section.gallery .has-slider .slider .slider-panel img {
  position: relative;
  float: left;
  width: 100%;
  height: auto;
  display: block;
  pointer-events: none;
}
#storiesPost section.gallery .has-slider .slider .slider-panel .description {
  margin-top: 3vh;
  position: relative;
  width: 100%;
  height: auto;
  float: left;
}
#storiesPost section.gallery .has-slider .slider .slider-panel .description h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 1.5vw;
  margin-bottom: 1.5vh;
}
#storiesPost section.gallery .has-slider .slider .slider-panel .description span {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #storiesPost section.gallery .has-slider .slider {
    left: 6.25vw;
  }
  #storiesPost section.gallery .has-slider .slider .slider-panel {
    width: 81.25vw;
    margin-right: 6.25vw;
  }
}
#storiesPost section.gallery .has-slider .postSliderNav {
  position: absolute;
  top: -3.125vw;
  left: 60.9375vw;
  -webkit-transform: translateX(50%);
  transform: translateX(50%);
  z-index: 6;
  width: 6.25vw;
  height: 6.25vw;
}
#storiesPost section.gallery .has-slider .postSliderNav .bg {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: var(--subColor);
}
#storiesPost section.gallery .has-slider .postSliderNav .prev {
  position: absolute;
  top: 50%;
  left: 16.6666666667%;
  width: auto;
  height: auto;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  cursor: pointer;
}
#storiesPost section.gallery .has-slider .postSliderNav .prev img {
  width: 14px;
  height: 14px;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  display: block;
}
#storiesPost section.gallery .has-slider .postSliderNav .next {
  position: absolute;
  top: 50%;
  right: 16.6666666667%;
  width: auto;
  height: auto;
  -webkit-transform: translate(50%, -50%);
  transform: translate(50%, -50%);
  cursor: pointer;
}
#storiesPost section.gallery .has-slider .postSliderNav .next img {
  width: 14px;
  height: 14px;
  display: block;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #storiesPost section.gallery .has-slider .postSliderNav {
    top: -9.375vw;
    left: 62.5vw;
    -webkit-transform: translateX(50%);
    transform: translateX(50%);
    z-index: 6;
    width: 18.75vw;
    height: 18.75vw;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #storiesPost section.gallery .has-slider .postSliderNav {
    top: 50%;
    left: 0;
    -webkit-transform: translate(50%, -50%);
    transform: translate(50%, -50%);
    z-index: 6;
    width: 12.5vw;
    height: 12.5vw;
  }
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #storiesPost section.gallery {
    padding: 15vh 0 0 0;
  }
}
#storiesPost section.code {
  padding: 15vh 18.75vw;
}
#storiesPost section.code .codeText {
  width: 62.5vw;
}
#storiesPost section.code .hljs {
  width: 62.5vw;
  margin: 5vh 0;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #storiesPost section.code {
    padding: 15vh 6.25vw;
  }
  #storiesPost section.code .codeText {
    width: 87.5vw;
  }
  #storiesPost section.code .hljs {
    width: 87.5vw;
    margin: 5vh 0;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #storiesPost section.code {
    padding: 15vh 12.5vw;
  }
  #storiesPost section.code .codeText {
    width: 75vw;
  }
  #storiesPost section.code .hljs {
    width: 75vw;
    margin: 5vh 0;
  }
}
#storiesPost section.videoSec {
  padding: 15vh 0;
}
#storiesPost section.videoSec .videoElement {
  position: relative;
  width: 62.5vw;
  height: auto;
  overflow: hidden;
  float: left;
  margin: 0 18.75vw 10vh 18.75vw;
}
#storiesPost section.videoSec .videoElement:last-of-type {
  margin-bottom: 0;
}
#storiesPost section.videoSec .videoElement:full-screen {
  width: 100%;
}
#storiesPost section.videoSec .videoElement:-webkit-full-screen {
  width: 100%;
}
#storiesPost section.videoSec .videoElement:-ms-fullscreen {
  width: 100%;
}
#storiesPost section.videoSec .videoElement:fullscreen {
  width: 100%;
}
#storiesPost section.videoSec .videoElement:-webkit-full-screen {
  width: 100%;
}
#storiesPost section.videoSec .videoElement:-moz-full-screen {
  width: 100%;
}
#storiesPost section.videoSec .videoElement video {
  width: 100%;
  height: auto;
  display: block;
}
#storiesPost section.videoSec .videoElement .handler {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 30;
}
#storiesPost section.videoSec .videoElement .handler .centerButton {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: block;
  background-color: #fff;
  cursor: pointer;
}
#storiesPost section.videoSec .videoElement .handler .centerButton span {
  position: absolute;
  left: 50%;
  top: 0;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  color: #000;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  text-transform: uppercase;
  line-height: 80px;
}
#storiesPost section.videoSec .videoElement .handler .centerButton.activePlay .play {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#storiesPost section.videoSec .videoElement .handler .centerButton.activePlay .pause {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#storiesPost section.videoSec .videoElement .handler .centerButton.activePause .play {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#storiesPost section.videoSec .videoElement .handler .centerButton.activePause .pause {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#storiesPost section.videoSec .videoElement .handler .videoNav {
  position: absolute;
  bottom: 0;
  left: 0;
  width: calc(100% - 40px);
  height: 20px;
  padding: 10px 20px;
  background: var(--mainColor);
  background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(var(--mainColor)));
  background: linear-gradient(to bottom, transparent 0%, var(--mainColor) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=transparent, endColorstr=var(--mainColor));
  /*@include translateY(100%);
  &.visible {
  	@include translateY(0%);
  }*/
}
#storiesPost section.videoSec .videoElement .handler .videoNav .commandButton {
  position: relative;
  width: 20px;
  height: 20px;
  float: left;
  cursor: pointer;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .commandButton svg {
  position: absolute;
  width: 100%;
  height: auto;
  fill: #fff;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .commandButton.play .playVideo {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .commandButton.play .pauseVideo {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .commandButton.pause .playVideo {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .commandButton.pause .pauseVideo {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .commandBar {
  position: relative;
  float: left;
  width: calc(70% - 240px);
  margin-left: 20px;
  height: 5px;
  border: none;
  background-color: #fff;
  border-radius: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  cursor: pointer;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .commandBar .ui-slider-range {
  border-radius: 0;
  background: none;
  background-color: var(--mainColor);
}
#storiesPost section.videoSec .videoElement .handler .videoNav .commandBar .ui-slider-handle {
  display: none;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .time {
  position: relative;
  width: auto;
  float: left;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  line-height: 20px;
  margin: 0 20px;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .time span {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  line-height: 20px;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .volume {
  position: relative;
  width: calc(30% - 40px);
  height: 20px;
  float: left;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .volume .buttonVol {
  position: relative;
  width: 20px;
  height: 20px;
  float: left;
  margin: 0 0 0 40px;
  cursor: pointer;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .volume .buttonVol svg {
  position: absolute;
  width: 100%;
  height: auto;
  fill: #fff;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .volume .buttonVol svg .big {
  opacity: 1;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .volume .buttonVol svg .medium {
  opacity: 1;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .volume .buttonVol svg .small {
  opacity: 1;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .volume .buttonVol.high svg .big {
  opacity: 1;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .volume .buttonVol.high svg .middle {
  opacity: 1;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .volume .buttonVol.high svg .small {
  opacity: 1;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .volume .buttonVol.middle svg .big {
  opacity: 0;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .volume .buttonVol.middle svg .middle {
  opacity: 1;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .volume .buttonVol.middle svg .small {
  opacity: 1;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .volume .buttonVol.low svg .big {
  opacity: 0;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .volume .buttonVol.low svg .middle {
  opacity: 0;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .volume .buttonVol.low svg .small {
  opacity: 1;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .volume .buttonVol.mute svg .big {
  opacity: 0;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .volume .buttonVol.mute svg .middle {
  opacity: 0;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .volume .buttonVol.mute svg .small {
  opacity: 0;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .volume .buttonVol.muted svg .big {
  opacity: 0;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .volume .buttonVol.muted svg .middle {
  opacity: 0;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .volume .buttonVol.muted svg .small {
  opacity: 0;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .volume .volumeBar {
  position: relative;
  float: left;
  width: calc(100% - 80px);
  margin-left: 20px;
  height: 5px;
  border: none;
  background-color: #fff;
  border-radius: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  cursor: pointer;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .volume .volumeBar .ui-slider-range {
  border-radius: 0;
  background: none;
  background-color: var(--mainColor);
}
#storiesPost section.videoSec .videoElement .handler .videoNav .volume .volumeBar .ui-slider-handle {
  display: none;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .qualityIcon {
  position: relative;
  width: 20px;
  height: 20px;
  float: left;
  margin-left: 40px;
  cursor: pointer;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .qualityIcon svg {
  position: absolute;
  width: 100%;
  height: auto;
  fill: #fff;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .qualitySet {
  position: absolute;
  right: 80px;
  top: 0;
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
  text-align: center;
  background-color: var(--mainColor);
  opacity: 0;
  visibility: hidden;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .qualitySet.open {
  opacity: 1;
  visibility: visible;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .qualitySet span {
  position: relative;
  display: block;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  cursor: pointer;
  padding: 5px 10px;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .qualitySet span.selected {
  background-color: var(--subColor);
}
#storiesPost section.videoSec .videoElement .handler .videoNav .fullScreen {
  position: relative;
  width: 20px;
  height: 20px;
  float: left;
  margin-left: 40px;
  cursor: pointer;
}
#storiesPost section.videoSec .videoElement .handler .videoNav .fullScreen svg {
  position: absolute;
  width: 100%;
  height: auto;
  fill: #fff;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #storiesPost section.videoSec .videoElement {
    width: 87.5vw;
    margin: 0 6.25vw 0 6.25vw;
  }
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #storiesPost section.videoSec {
    padding: 15vh 0 0 0;
  }
}
#storiesPost section.nextPost {
  padding: 0;
}
#storiesPost section.nextPost .nx {
  position: relative;
  width: 75vw;
  height: 75vh;
  margin: 12.5vh 12.5%;
  background-size: cover;
  background-repeat: no-repeat;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #storiesPost section.nextPost .nx {
    width: 87.5vw;
    margin: 12.5vh 6.25vw 0 6.25vw;
    height: auto;
    background-image: none !important;
  }
  #storiesPost section.nextPost .nx img {
    width: 100%;
    height: auto;
  }
  #storiesPost section.nextPost .nx h2 {
    position: absolute;
    bottom: 6.25vw;
    left: 6.25vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #storiesPost section.nextPost .nx {
    width: 75vw;
    margin: 15vw 12.5vw;
    height: auto;
    background-image: none !important;
  }
  #storiesPost section.nextPost .nx img {
    width: 100%;
    height: auto;
  }
  #storiesPost section.nextPost .nx h2 {
    position: absolute;
    bottom: 6.25vw;
    left: 6.25vw;
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 20px;
  }
}
#storiesPost section.nextPost .nx .NXtitle {
  position: absolute;
  bottom: 5%;
  left: 5%;
  width: 50%;
}
#storiesPost section.nextPost .nx .NXtitle h2 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 2vw;
}
#storiesPost section.nextPost .nx .NXbutton {
  position: absolute;
  top: 30vh;
  right: 18.75vw;
  -webkit-transform: translateX(50%);
  transform: translateX(50%);
  z-index: 6;
  width: 6.25vw;
  height: 6.25vw;
}
#storiesPost section.nextPost .nx .NXbutton .bg {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  cursor: pointer;
}
#storiesPost section.nextPost .nx .NXbutton #continue {
  position: absolute;
  top: -0.5vw;
  left: -0.5vw;
  width: calc(100% + 1vw);
  height: calc(100% + 1vw);
}
#storiesPost section.nextPost .nx .NXbutton #continue circle {
  -webkit-transform: rotate(-90deg);
          transform: rotate(-90deg);
  -webkit-transform-origin: center;
          transform-origin: center;
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  cx: 3.625vw;
  cy: 3.625vw;
}
#storiesPost section.nextPost .nx .NXbutton #continue circle.active {
  -webkit-animation-name: circle-chart-fill;
          animation-name: circle-chart-fill;
  -webkit-animation-duration: 3s;
          animation-duration: 3s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  stroke-dasharray: 1000;
  stroke-dashoffset: 0;
}
#storiesPost section.nextPost .nx .NXbutton #dotted {
  position: absolute;
  top: -0.5vw;
  left: -0.5vw;
  width: calc(100% + 1vw);
  height: calc(100% + 1vw);
}
#storiesPost section.nextPost .nx .NXbutton #dotted circle {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transform-origin: center;
          transform-origin: center;
  stroke-dasharray: 1 3;
  stroke-dashoffset: 5;
  stroke-linecap: round;
  cx: 3.625vw;
  cy: 3.625vw;
  stroke: #fff;
}
#storiesPost section.nextPost .nx .NXbutton:hover #dotted circle {
  -webkit-animation-name: animation-rotation-dots;
          animation-name: animation-rotation-dots;
  -webkit-animation-duration: 20s;
          animation-duration: 20s;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
#storiesPost section.nextPost .nx .NXbutton .count {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 33.3333333333%;
  height: auto;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  cursor: pointer;
}
#storiesPost section.nextPost .nx .NXbutton .count svg {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#storiesPost section.nextPost .nx .NXbutton .count svg path {
  fill: #fff;
}
#storiesPost section.nextPost .nx .NXbutton .count svg path#extCircle {
  opacity: 0;
}
#storiesPost section.nextPost .nx .NXbutton .count svg path#inCircle {
  opacity: 0;
}
#storiesPost section.nextPost .nx .NXbutton .count .visible {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#storiesPost section.nextPost .nx .NXbutton .count:hover svg {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#storiesPost section.nextPost .nx .NXbutton .count:hover svg path#inCircle {
  -webkit-animation-name: inner-circle-ani;
          animation-name: inner-circle-ani;
  -webkit-animation-duration: 1.5s;
          animation-duration: 1.5s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
#storiesPost section.nextPost .nx .NXbutton .count:hover svg path#extCircle {
  -webkit-animation-name: ext-circle-ani;
          animation-name: ext-circle-ani;
  -webkit-animation-duration: 1.5s;
          animation-duration: 1.5s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
#storiesPost section.nextPost .nx .NXbutton .count:hover .visible {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}

.hljs {
  display: block;
  overflow-x: auto;
  padding: 0.5em;
  background: #23241f;
}

.hljs, .hljs-tag, .hljs-subst {
  color: #f8f8f2;
}

.hljs-strong, .hljs-emphasis {
  color: #a8a8a2;
}

.hljs-bullet, .hljs-quote, .hljs-number, .hljs-regexp, .hljs-literal, .hljs-link {
  color: #ae81ff;
}

.hljs-code, .hljs-title, .hljs-section, .hljs-selector-class {
  color: #a6e22e;
}

.hljs-strong {
  font-weight: bold;
}

.hljs-emphasis {
  font-style: italic;
}

.hljs-keyword, .hljs-selector-tag, .hljs-name, .hljs-attr {
  color: #f92672;
}

.hljs-symbol, .hljs-attribute {
  color: #66d9ef;
}

.hljs-params, .hljs-class .hljs-title {
  color: #f8f8f2;
}

.hljs-string, .hljs-type, .hljs-built_in, .hljs-builtin-name, .hljs-selector-id, .hljs-selector-attr, .hljs-selector-pseudo, .hljs-addition, .hljs-variable, .hljs-template-variable {
  color: #e6db74;
}

.hljs-comment, .hljs-deletion, .hljs-meta {
  color: #75715e;
}

#privacy {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
}
#privacy section {
  position: relative;
  width: 100%;
  height: auto;
  float: left;
}
#privacy section.first {
  padding-bottom: 7vh;
  margin-top: 22vh;
  margin-left: 18.75vw;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #privacy section.first {
    min-height: auto;
    margin-top: 0;
    padding-top: calc(60px + 3*6.25vw);
    margin-left: 6.25vw;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #privacy section.first {
    min-height: auto;
    margin-top: 0;
    padding-top: calc(60px + 6.25vw);
    margin-left: 12.5vw;
  }
}
#privacy section.first h1 {
  position: relative;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 8vw;
  line-height: 8vw;
  z-index: 3;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #privacy section.first h1 {
    color: #fff;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 12vw;
    line-height: 12vw;
  }
}
#privacy section.secText .cont {
  width: 62.5vw;
  margin-left: 18.75vw;
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  #privacy section.secText .cont {
    width: 87.5vw;
    margin-left: 6.25vw;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  #privacy section.secText .cont {
    width: 75vw;
    margin-left: 12.5vw;
  }
}
#privacy section.secText .cont p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 20px;
}
#privacy section.secText .cont h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 30px;
  margin: 5vh 0 2vh 0;
}
#privacy section.secText .cont ol {
  padding: 0 0 0 40px;
  margin: 10px 0;
  list-style: lower-alpha;
}
#privacy section.secText .cont ol li {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
}

@-webkit-keyframes danceHeight1 {
  from {
    height: 1px;
  }
  to {
    height: 11px;
  }
}
@-webkit-keyframes danceHeight2 {
  from {
    height: 1px;
  }
  to {
    height: 7px;
  }
}
@-webkit-keyframes danceHeight3 {
  from {
    height: 1px;
  }
  to {
    height: 14px;
  }
}
@-webkit-keyframes danceHeight4 {
  from {
    height: 1px;
  }
  to {
    height: 10px;
  }
}
@-webkit-keyframes danceHeight5 {
  from {
    height: 1px;
  }
  to {
    height: 7px;
  }
}
@-webkit-keyframes danceHeight6 {
  from {
    height: 1px;
  }
  to {
    height: 7px;
  }
}
#scrollTop {
  display: none;
  visibility: hidden;
  opacity: 0;
}

#scrollDown {
  position: fixed;
  bottom: 20px;
  right: 80px;
  width: 40px;
  height: 40px;
  background-color: var(--subColor);
  border-radius: 100%;
  z-index: 50;
}
#scrollDown svg {
  position: absolute;
  width: 15px;
  height: 15px;
  top: 50%;
  left: 50%;
  fill: #fff;
  -webkit-transform: translate(-50%, -50%) rotate(90deg);
  transform: translate(-50%, -50%) rotate(90deg);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #scrollDown {
    bottom: 20px;
  }
}

#scrollNext {
  position: fixed;
  bottom: 20px;
  right: 80px;
  width: 40px;
  height: 40px;
  background-color: var(--subColor);
  border-radius: 100%;
  z-index: 50;
  opacity: 0;
  visibility: hidden;
}
#scrollNext svg {
  position: absolute;
  width: 15px;
  height: 15px;
  top: 50%;
  left: 50%;
  fill: #fff;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #scrollNext {
    bottom: 20px;
  }
}

#darkMode {
  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 40px;
  height: 40px;
  background-color: var(--subColor);
  border-radius: 100%;
  z-index: 50;
}
#darkMode svg {
  position: absolute;
  width: 20px;
  height: 20px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  fill: #fff;
}
#darkMode[data-type=light] svg#light {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#darkMode[data-type=light] svg#dark {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#darkMode[data-type=dark] svg#light {
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#darkMode[data-type=dark] svg#dark {
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#darkMode.hoovered svg {
  opacity: 0 !important;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  #darkMode {
    display: none;
  }
}

footer {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  z-index: 1;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  footer {
    margin: 2.5rem auto 0rem auto;
    padding-bottom: 3.75rem;
    width: 87.5vw;
    height: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  footer {
    margin: 0 auto;
    padding-bottom: 3.75rem;
    width: 87.5vw;
    height: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  footer {
    margin: 0 auto;
    padding-bottom: 3.75rem;
    width: 87.5vw;
    height: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
footer.contact {
  position: fixed;
  height: 10vh;
  bottom: 0;
  left: 0;
  overflow: visible;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  footer.contact {
    position: relative;
    width: 87.5vw;
    margin: 5rem auto 0rem auto;
    height: auto;
    bottom: 0;
    right: 0;
    overflow: visible;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  footer.contact .credits {
    margin-top: 1.25rem;
  }
}
footer a {
  text-decoration: none;
  display: block;
}
footer .wrapper {
  position: absolute;
  top: 50%;
  left: 6.25vw;
  width: 87.5vw;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: 50;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  footer .wrapper {
    position: relative;
    top: 0;
    left: 0;
    margin-bottom: 2.5rem;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  footer .wrapper {
    position: relative;
    top: 0;
    left: 0;
    margin-bottom: 2.5rem;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  footer .wrapper {
    position: relative;
    top: 0;
    left: 0;
    margin-bottom: 2.5rem;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
footer .wrapper .mail {
  position: relative;
}
footer .wrapper .mail h2 {
  color: var(--color-main);
  color: var(--subColor);

  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 7.5vw;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
  line-height: 8.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  footer .wrapper .mail h2 {
    color: var(--color-main);
    color: var(--subColor);

    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 1.9rem;
    line-height: 2.28rem;
    -webkit-text-stroke: unset;
  }
}
footer .wrapper .mail .linkFoot {
  position: relative;
  display: inline-block;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
footer .wrapper .mail .linkFoot.linkFoot--top p {
  -webkit-text-stroke: 2px #fff;
}
footer .wrapper .mail .linkFoot.linkFoot--top.mobile p {
  -webkit-text-stroke: unset;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 1.9rem;
}
footer .wrapper .mail .linkFoot.linkFoot--top span {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 7.5vw;
}
footer .wrapper .mail .linkFoot.linkFoot--bottom span {
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}
footer .wrapper .mail .linkFoot p {
  color: transparent;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 7.5vw;
  -webkit-text-stroke: 2px var(--color-main);
  text-decoration: none;
  -webkit-transition: color 0.35s ease-in-out 0s;
  transition: color 0.35s ease-in-out 0s;
  display: block;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  footer .wrapper .mail .linkFoot p {
    font-size: 1.9rem;
    line-height: 2.28rem;
    -webkit-text-stroke: 1px var(--color-main);
  }
}
footer .wrapper .mail .linkFoot span {
  position: absolute;
  top: 0;
  left: 0;
  color: var(--color-main);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 7.5vw;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
}
footer .wrapper .addresses {
  position: relative;
  margin-top: 10vh;
}
footer .wrapper .addresses .ele {
  position: relative;
  float: left;
  margin-left: 6.25vw;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
footer .wrapper .addresses .ele:first-of-type {
  margin-left: 0;
}
footer .wrapper .addresses .ele h3 {
  color: var(--color-main);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  text-transform: uppercase;
  margin-bottom: 2vh;
}
footer .wrapper .addresses .ele p {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 25px;
  margin-bottom: 25px;
}
footer .wrapper .addresses .ele span {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 25px;
  display: block;
}
footer .wrapper .addresses .ele a {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  line-height: 25px;
  display: block;
  text-decoration: none;
  margin-top: 25px;
}
footer .wrapper .addresses .ele ul {
  list-style: none;
}
footer .wrapper .addresses .ele ul li a {
  text-decoration: none;
}
footer .credits {
  position: absolute;
  bottom: 5vh;
  right: 6.25vw;
  overflow: hidden;
  -webkit-transform: translateY(50%);
  transform: translateY(50%);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  footer .credits {
    position: relative;
    width: 87.5vw;
    margin: 0.5rem auto 0 auto;
    bottom: 0;
    right: 0;
    overflow: visible;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  footer .credits {
    position: relative;
    width: 87.5vw;
    margin: 0.5rem auto 0 auto;
    bottom: 0;
    right: 0;
    overflow: visible;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  footer .credits {
    position: relative;
    width: 87.5vw;
    margin: 0.5rem auto 0 auto;
    bottom: 0;
    right: 0;
    overflow: visible;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
}
footer .credits .credits__wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
footer .credits .credits__wrapper .credits__container {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
footer .credits .credits__wrapper p {
  position: relative;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 27px;
  position: relative;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  footer .credits .credits__wrapper p {
    font-size: 0.8rem;
  }
}
footer .credits .credits__wrapper a {
  text-decoration: none;
  color: #fff;
}
footer .credits .credits__wrapper .divider {
  margin-left: 5px;
  margin-right: 5px;
}
footer .social-footer {
  position: absolute;
  bottom: 5vh;
  left: 6.25vw;
  overflow: hidden;
  -webkit-transform: translateY(50%);
  transform: translateY(50%);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  footer .social-footer {
    position: relative;
    bottom: 0;
    left: 0;
    overflow: visible;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  footer .social-footer {
    position: relative;
    bottom: 0;
    left: 0;
    overflow: visible;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  footer .social-footer {
    position: relative;
    bottom: 0;
    left: 0;
    overflow: visible;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
footer .social-footer .social-footer__wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transform: translateY(10vh);
  transform: translateY(10vh);
  opacity: 0;
}
footer .social-footer .social-footer__wrapper p {
  position: relative;
  color: var(--color-main);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 27px;
  position: relative;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  footer .social-footer .social-footer__wrapper p {
    font-size: 1.2rem;
    line-height: 1.44rem;
  }
}
footer .social-footer .social-footer__wrapper a {
  text-decoration: none;
  color: var(--color-main);
  color: var(--subColor);
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  footer .social-footer .social-footer__wrapper a {
    font-size: 1.2rem;
    line-height: 1.44rem;
  }
}
footer .social-footer .social-footer__wrapper .divider {
  margin-left: 5px;
  margin-right: 5px;
}

#notFound {
  position: relative;
  width: 100%;
  height: 100vh;
}
#notFound .text {
  position: absolute;
  top: 50%;
  left: 6.25vw;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
#notFound .text h2 {
  position: relative;
  color: transparent;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 5vw;
  line-height: 5vw;
  display: block;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke: 2px var(--subColor);
}
#notFound .text h2 span {
  position: relative;
  display: table-cell;
  -webkit-transform: scale(1.6);
  transform: scale(1.6);
  opacity: 0;
}
#notFound .text a {
  position: relative;
  width: 3.125vw;
  height: 3.125vw;
  border-radius: 50%;
  background-color: transparent;
  cursor: pointer;
  overflow: hidden;
  z-index: 5;
  display: block;
  margin-top: 20px;
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
}
#notFound .text a svg {
  fill: #000;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 30px;
  height: 30px;
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#notFound .text a:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--subColor);
  -webkit-transition: height 0.35s ease-in-out 0s;
  transition: height 0.35s ease-in-out 0s;
}
#notFound .face {
  position: absolute;
  top: 50%;
  left: 60%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 50vh;
  height: 50vh;
}
#notFound .face svg {
  stroke: var(--subColor);
  stroke-width: 5px;
  fill: transparent;
}
#notFound .face svg rect {
  width: 0;
}
#notFound .face svg rect.init:first-of-type {
  transform-box: fill-box;
  -webkit-transform-origin: center;
          transform-origin: center;
  -webkit-animation-name: eyesRotation;
          animation-name: eyesRotation;
  -webkit-animation-duration: 10s;
          animation-duration: 10s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
#notFound .face svg rect.init:last-of-type {
  transform-box: fill-box;
  -webkit-transform-origin: center;
          transform-origin: center;
  -webkit-animation-name: eyesRotation2;
          animation-name: eyesRotation2;
  -webkit-animation-duration: 10s;
          animation-duration: 10s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
#notFound .face svg path {
  -webkit-transform: rotateY(90deg);
  transform: rotateY(90deg);
  -webkit-transform-origin: 70% 50%;
          transform-origin: 70% 50%;
}
#notFound .face svg path.init {
  -webkit-transform: rotateY(0deg);
  transform: rotateY(0deg);
  -webkit-transition: transform 0.35s ease-in-out 0s;
  -webkit-transition: -webkit-transform 0.35s ease-in-out 0s;
  transition: -webkit-transform 0.35s ease-in-out 0s;
  transition: transform 0.35s ease-in-out 0s;
  transition: transform 0.35s ease-in-out 0s, -webkit-transform 0.35s ease-in-out 0s;
}
#notFound .face svg path.happy {
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
  -webkit-transition: transform 0.35s ease-in-out 0s;
  -webkit-transition: -webkit-transform 0.35s ease-in-out 0s;
  transition: -webkit-transform 0.35s ease-in-out 0s;
  transition: transform 0.35s ease-in-out 0s;
  transition: transform 0.35s ease-in-out 0s, -webkit-transform 0.35s ease-in-out 0s;
}
#notFound .face svg path.sad {
  -webkit-transform: rotateY(0deg);
  transform: rotateY(0deg);
  -webkit-transition: transform 0.35s ease-in-out 0s;
  -webkit-transition: -webkit-transform 0.35s ease-in-out 0s;
  transition: -webkit-transform 0.35s ease-in-out 0s;
  transition: transform 0.35s ease-in-out 0s;
  transition: transform 0.35s ease-in-out 0s, -webkit-transform 0.35s ease-in-out 0s;
}
@-webkit-keyframes eyesRotation {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes eyesRotation {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-webkit-keyframes eyesRotation2 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
  }
}
@keyframes eyesRotation2 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
  }
}

#prova {
  position: relative;
  width: 100%;
  heigth: auto;
  padding: 15vh 0;
}
#prova section {
  position: relative;
  width: 100%;
  height: 85vh;
  margin-bottom: 15vh;
}
#prova section .title {
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
}
#prova section .title h2 {
  color: rgba(0, 0, 0, 0.1);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 50vh;
  white-space: nowrap;
  text-transform: uppercase;
}
#prova section .list {
  position: relative;
  width: auto;
  height: 100%;
  z-index: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-transition-property: -webkit-transform;
  transition-property: -webkit-transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  padding-left: calc(50% - ((960*70vh) / 1440) / 2);
}
#prova section .list .item {
  position: relative;
  float: left;
  height: 70vh;
  margin: 7.5vh 0;
  width: 46.6666666667vh;
  margin-right: 3vw;
}
#prova section .list .item .info {
  position: absolute;
  bottom: calc(-2.5vw - 20px);
  left: -30%;
  width: 150%;
  z-index: 5;
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
#prova section .list .item .info h3 {
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 5vw;
  line-height: 5vw;
  text-indent: -0.5rem;
}
#prova section .list .item .info h4 {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 24px;
  line-height: 24px;
  margin-top: 20px;
}
#prova section .list .item .wrapper {
  position: relative;
  width: 100%;
  height: auto;
  z-index: 4;
}
#prova section .list .item .wrapper .image {
  position: relative;
  height: 70vh;
  width: 46.6666666667vh;
  z-index: 5;
  clip-path: polygon(20% 0%, 80% 0%, 80% 60%, 20% 60%);
  -webkit-clip-path: polygon(20% 0%, 80% 0%, 80% 60%, 20% 60%);
  -o-clip-path: polygon(20% 0%, 80% 0%, 80% 60%, 20% 60%);
  -ms-clip-path: polygon(20% 0%, 80% 0%, 80% 60%, 20% 60%);
}
#prova section .list .item .wrapper .image picture {
  height: 100%;
  width: auto;
}
#prova section .list .item .wrapper .image picture img {
  height: 100%;
  width: auto;
  -webkit-transform: scale(1.15);
  transform: scale(1.15);
}
#prova section .list .item .wrapper .titleItem {
  position: absolute;
  bottom: calc(-60px - 2.5vw);
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  opacity: 0;
  -webkit-transition: opacity 0.5s ease-in-out 0s;
  transition: opacity 0.5s ease-in-out 0s;
}
#prova section .list .item .wrapper .titleItem h4 {
  color: var(--subColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 20px;
  line-height: 24px;
  text-transform: uppercase;
}
#prova section .list .item:last-of-type {
  margin-right: 0;
}
#prova section .list .item[data-order="1"] .wrapper .image {
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -o-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  -ms-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}
#prova section .list .item[data-order="1"] .wrapper .image picture img {
  -webkit-transform: scale(1);
  transform: scale(1);
}
#prova section .list .item[data-order="2"] .wrapper .image {
  clip-path: polygon(20% 20%, 80% 20%, 80% 80%, 20% 80%);
  -webkit-clip-path: polygon(20% 20%, 80% 20%, 80% 80%, 20% 80%);
  -o-clip-path: polygon(20% 20%, 80% 20%, 80% 80%, 20% 80%);
  -ms-clip-path: polygon(20% 20%, 80% 20%, 80% 80%, 20% 80%);
}
#prova section .list .item.current-active-slide .info {
  opacity: 1;
  -webkit-transition: opacity 0.5s ease-in-out 0s;
  transition: opacity 0.5s ease-in-out 0s;
}
#prova section .list .item.current-active-slide .wrapper .titleItem {
  opacity: 1;
  -webkit-transition: opacity 0.5s ease-in-out 0s;
  transition: opacity 0.5s ease-in-out 0s;
}

@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  .medium-title {
    font-size: 1.4rem;
  }
}

@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  .normal-title {
    font-size: 1.9rem;
  }
}

@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  .big-title {
    font-size: 2.9rem;
  }
}

@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  .normal-text {
    font-size: 0.9rem;
  }
}

.mobile {
  display: none !important;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  .mobile {
    display: block !important;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  .mobile.pro-portrait {
    display: block !important;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  .mobile.pro-portrait {
    display: block !important;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  .mobile.all-tablet {
    display: block !important;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (min-height: 900px) and (-webkit-min-device-pixel-ratio: 2) {
  .mobile.all-tablet {
    display: block !important;
  }
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  .mobile.laptop1280 {
    display: block !important;
  }
}

.desktop {
  display: block;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  .desktop {
    display: none !important;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  .desktop.exclude-pro-portrait {
    display: none !important;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  .desktop.exclude-pro-portrait {
    display: none !important;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  .desktop.exclude-all-tablet {
    display: none !important;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  .desktop.exclude-all-tablet {
    display: none !important;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  .desktop.exclude-all-tablet {
    display: none !important;
  }
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  .desktop.exclude-laptop1280 {
    display: none !important;
  }
}

@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  .landscape {
    display: none !important;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  .landscape {
    display: block !important;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  .landscape {
    display: none !important;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  .landscape {
    display: block !important;
  }
}

@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  .portrait {
    display: block !important;
  }
}
@media only screen and (max-device-width: 926px) and (orientation: landscape) {
  .portrait {
    display: none !important;
  }
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
  .portrait {
    display: block !important;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  .portrait {
    display: none !important;
  }
}

html.has-scroll-smooth {
  overflow: hidden;
}
html.has-scroll-dragging {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

body {
  background-color: var(--mainColor);
  height: 100%;
}
.has-scroll-smooth body {
  overflow: hidden;
}

* {
  margin: 0;
  padding: 0;
  cursor: none !important;
}

::-moz-selection {
  color: var(--mainColor);
  background-color: var(--subColor);
}

::selection {
  color: var(--mainColor);
  background-color: var(--subColor);
}

/* CUSTOM SCROLLBAR */
.awd-scrollbar {
  position: fixed;
  right: -6px;
  top: 0;
  width: 6px;
  height: 100vh;
  -webkit-transform-origin: center right;
          transform-origin: center right;
  -webkit-transition: opacity 0.3s, right 0.7s, -webkit-transform 0.3s;
  transition: opacity 0.3s, right 0.7s, -webkit-transform 0.3s;
  transition: transform 0.3s, opacity 0.3s, right 0.7s;
  transition: transform 0.3s, opacity 0.3s, right 0.7s, -webkit-transform 0.3s;
  opacity: 1;
  background-color: var(--mainColorD10);
  z-index: 45;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  .awd-scrollbar {
    display: none;
  }
}
.awd-scrollbar .awd-scrollbar_thumb {
  position: absolute;
  top: 0;
  right: 0;
  background-color: var(--subColor);
  width: 6px;
  cursor: -webkit-grab;
  cursor: grab;
}
.has-scroll-dragging .awd-scrollbar .awd-scrollbar_thumb {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}
.awd-scrollbar.ready2show {
  right: 0;
  -webkit-transform-origin: center right;
          transform-origin: center right;
  opacity: 1;
  -webkit-transition: opacity 0.3s, right 0.7s, -webkit-transform 0.3s;
  transition: opacity 0.3s, right 0.7s, -webkit-transform 0.3s;
  transition: transform 0.3s, opacity 0.3s, right 0.7s;
  transition: transform 0.3s, opacity 0.3s, right 0.7s, -webkit-transform 0.3s;
}

/* MOUSE CURSOR */
#customMouseCursor {
  position: absolute;
  width: 14px;
  height: 14px;
  top: 50%;
  left: 50%;
  margin: -7px 0 0 -7px;
  border: 3px solid var(--subColor);
  border-radius: 100px;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  pointer-events: none;
  z-index: 10000;
  background-color: var(--subColor);
  -webkit-transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
  transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
}
#customMouseCursor .image-arrow {
  position: absolute;
  width: 1rem;
  top: 50%;
  opacity: 0;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  -webkit-transition: opacity 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s;
}
#customMouseCursor .image-arrow .svg-arrow {
  fill: var(--subColor);
}
#customMouseCursor .image-arrow.right {
  left: 110%;
}
#customMouseCursor .image-arrow.left {
  right: 110%;
}
#customMouseCursor .view {
  position: absolute;
  top: 50%;
  left: 50%;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10px;
  text-transform: uppercase;
  -webkit-font-smoothing: antialiased;
  opacity: 0;
  -webkit-transform: translate(-50%, -50%) scale(0.7);
  transform: translate(-50%, -50%) scale(0.7);
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
}
#customMouseCursor .drag {
  position: absolute;
  top: 50%;
  left: 50%;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10px;
  text-transform: uppercase;
  -webkit-font-smoothing: antialiased;
  opacity: 0;
  -webkit-transform: translate(-50%, -50%) scale(0.7);
  transform: translate(-50%, -50%) scale(0.7);
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
}
#customMouseCursor .slide {
  position: absolute;
  width: 25px;
  height: 25px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%) scale(0.7);
  transform: translate(-50%, -50%) scale(0.7);
  fill: #fff;
  opacity: 0;
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
}
#customMouseCursor .dark {
  position: absolute;
  width: 25px;
  height: 25px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%) scale(0.7);
  transform: translate(-50%, -50%) scale(0.7);
  fill: #fff;
  opacity: 0;
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
}
#customMouseCursor .light {
  position: absolute;
  width: 25px;
  height: 25px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%) scale(0.7);
  transform: translate(-50%, -50%) scale(0.7);
  fill: #fff;
  opacity: 0;
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
}
#customMouseCursor .click {
  position: absolute;
  top: 50%;
  left: 50%;
  color: var(--mainColor);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 1px;
  -webkit-font-smoothing: antialiased;
  opacity: 0;
  -webkit-transform: translate(-50%, -50%) scale(0.7);
  transform: translate(-50%, -50%) scale(0.7);
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
}
#customMouseCursor .write {
  position: absolute;
  width: 25px;
  height: 25px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%) scale(0.7);
  transform: translate(-50%, -50%) scale(0.7);
  fill: #fff;
  opacity: 0;
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
}
#customMouseCursor .write circle {
  fill: var(--subColor);
  -webkit-transform: translateY(0px);
  transform: translateY(0px);
}
#customMouseCursor .plane {
  position: absolute;
  width: 25px;
  height: 25px;
  top: 50%;
  left: 50%;
}
#customMouseCursor .plane .img {
  opacity: 0;
  -webkit-transform: translate(-50%, -50%) scale(0.7);
  transform: translate(-50%, -50%) scale(0.7);
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  position: relative;
  width: 100%;
  height: 100%;
}
#customMouseCursor .plane .svg-plane {
  fill: #fff;
}
#customMouseCursor .image-play {
  position: absolute;
  width: 100px;
  height: 100px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
#customMouseCursor .image-play .img {
  opacity: 0;
  -webkit-transform: translate(-50%, -50%) scale(0.7);
  transform: translate(-50%, -50%) scale(0.7);
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  position: relative;
  width: 100%;
  height: 100%;
  left: 50%;
  top: 50%;
}
#customMouseCursor .image-play .svg-play {
  fill: #fff;
}
#customMouseCursor .image-pause {
  position: absolute;
  width: 100px;
  height: 100px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
#customMouseCursor .image-pause .img {
  opacity: 0;
  -webkit-transform: translate(-50%, -50%) scale(0.7);
  transform: translate(-50%, -50%) scale(0.7);
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  position: relative;
  width: 100%;
  height: 100%;
  left: 50%;
  top: 50%;
}
#customMouseCursor .image-pause .svg-pause {
  fill: #fff;
}
#customMouseCursor .arrow {
  position: absolute;
  width: 25px;
  height: 25px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%) scale(0.7);
  transform: translate(-50%, -50%) scale(0.7);
  fill: #fff;
  opacity: 0;
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
}
#customMouseCursor.is-link {
  width: 30px;
  height: 30px;
  margin: -15px 0 0 -15px;
  z-index: 2;
  -webkit-transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
  transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
}
#customMouseCursor.is-menu-opened {
  width: 30px;
  height: 30px;
  margin: -15px 0 0 -15px;
  z-index: 46;
  -webkit-transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
  transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
}
#customMouseCursor.is-menu-icon {
  width: 30px;
  height: 30px;
  margin: -15px 0 0 -15px;
  z-index: 49;
  -webkit-transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
  transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
}
#customMouseCursor.is-slide {
  background-color: transparent;
  width: 3.125vw;
  height: 3.125vw;
  margin: -1.5625vw 0 0 -1.5625vw;
  -webkit-transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
  transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
}
#customMouseCursor.is-slide .slide {
  opacity: 1;
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
}
#customMouseCursor.is-project-home {
  background-color: transparent;
  width: 6.25vw;
  height: 6.25vw;
  margin: -3.125vw 0 0 -3.125vw;
  -webkit-transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
  transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
}
#customMouseCursor.is-project-home .view {
  opacity: 1;
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
}
#customMouseCursor.is-project-home.cursore-drag .view {
  opacity: 0;
}
#customMouseCursor.cursore-drag {
  background-color: transparent;
  width: 6rem;
  height: 6rem;
  margin: -3rem 0 0 -3rem;
  -webkit-transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
  transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
}
#customMouseCursor.cursore-drag .drag {
  opacity: 1;
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
}
#customMouseCursor.cursore-drag .image-arrow {
  opacity: 1;
}
#customMouseCursor.is-link-type {
  background-color: transparent;
  width: 3.125vw;
  height: 3.125vw;
  margin: -1.5625vw 0 0 -1.5625vw;
  -webkit-transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
  transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
}
#customMouseCursor.is-link-type .view {
  opacity: 1;
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
}
#customMouseCursor.is-next-project {
  background-color: transparent;
  width: 6.25vw;
  height: 6.25vw;
  margin: -1.5625vw 0 0 -1.5625vw;
  -webkit-transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
  transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
}
#customMouseCursor.is-next-project .view {
  opacity: 1;
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
}
#customMouseCursor.is-link-2 {
  width: 3.125vw;
  height: 3.125vw;
  margin: -1.5625vw 0 0 -1.5625vw;
  -webkit-transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
  transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
}
#customMouseCursor.is-link-2 .click {
  opacity: 1;
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
}
#customMouseCursor.is-playVideo {
  width: 3.125vw;
  height: 3.125vw;
  margin: -1.5625vw 0 0 -1.5625vw;
  -webkit-transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
  transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
}
#customMouseCursor.is-playVideo .image-play .img {
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  opacity: 1;
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
}
#customMouseCursor.is-pauseVideo {
  width: 3.125vw;
  height: 3.125vw;
  margin: -1.5625vw 0 0 -1.5625vw;
  -webkit-transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
  transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
}
#customMouseCursor.is-pauseVideo .image-pause .img {
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  opacity: 1;
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
}
#customMouseCursor.is-writeUs {
  width: 3.125vw;
  height: 3.125vw;
  margin: -1.5625vw 0 0 -1.5625vw;
  -webkit-transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
  transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
}
#customMouseCursor.is-writeUs .write {
  opacity: 1;
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
}
#customMouseCursor.is-writeUs .write circle.circle_1 {
  -webkit-animation-name: writeUsIcon;
          animation-name: writeUsIcon;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
#customMouseCursor.is-writeUs .write circle.circle_2 {
  -webkit-animation-name: writeUsIcon;
          animation-name: writeUsIcon;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-delay: 0.25s;
          animation-delay: 0.25s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
#customMouseCursor.is-writeUs .write circle.circle_3 {
  -webkit-animation-name: writeUsIcon;
          animation-name: writeUsIcon;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-delay: 0.5s;
          animation-delay: 0.5s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
#customMouseCursor.is-careerBtn {
  width: 3.125vw;
  height: 3.125vw;
  margin: -1.5625vw 0 0 -1.5625vw;
  -webkit-transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
  transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
}
#customMouseCursor.is-careerBtn .plane {
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
}
#customMouseCursor.is-careerBtn .plane .img {
  opacity: 1;
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  -webkit-animation-name: planeIcon;
          animation-name: planeIcon;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
#customMouseCursor.is-darkMode-1 {
  width: 40px;
  height: 40px;
  margin: -20px 0 0 -20px;
  -webkit-transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
  transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
}
#customMouseCursor.is-darkMode-1 .light {
  opacity: 1;
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
}
#customMouseCursor.is-darkMode-2 {
  width: 40px;
  height: 40px;
  margin: -20px 0 0 -20px;
  -webkit-transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
  transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
}
#customMouseCursor.is-darkMode-2 .dark {
  opacity: 1;
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
}
#customMouseCursor.is-nextProject {
  width: 6.25vw;
  height: 6.25vw;
  margin: -3.125vw 0 0 -3.125vw;
  -webkit-transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
  transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
}
#customMouseCursor.is-nextProject .arrow {
  opacity: 1;
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
}
#customMouseCursor.is-scrollDown {
  width: 40px;
  height: 40px;
  margin: -20px 0 0 -20px;
  -webkit-transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
  transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}
#customMouseCursor.is-scrollDown .arrow {
  opacity: 1;
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
}
#customMouseCursor.is-scrollTop {
  width: 40px;
  height: 40px;
  margin: -20px 0 0 -20px;
  -webkit-transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
  transition: width 0.23s ease-in-out 0s, height 0.23s ease-in-out 0s, margin 0.23s ease-in-out 0s;
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}
#customMouseCursor.is-scrollTop .arrow {
  opacity: 1;
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  -webkit-transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  -webkit-transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s, transform 0.23s ease-in-out 0s, -webkit-transform 0.23s ease-in-out 0s;
}

#cursorCenter {
  position: absolute;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  pointer-events: none;
  z-index: 10000;
  border-radius: 100%;
  top: 50%;
  left: 50%;
  width: 6px;
  height: 6px;
  background-color: var(--subColor);
  opacity: 1;
  -webkit-transition: opacity 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s;
}
#cursorCenter.is-link {
  opacity: 0;
  -webkit-transition: opacity 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s;
}
#cursorCenter.is-menu-opened {
  opacity: 0;
  -webkit-transition: opacity 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s;
}
#cursorCenter.is-project-home {
  opacity: 0;
  -webkit-transition: opacity 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s;
}
#cursorCenter.cursore-drag {
  opacity: 0;
  -webkit-transition: opacity 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s;
}
#cursorCenter.is-link-type {
  opacity: 0;
  -webkit-transition: opacity 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s;
}
#cursorCenter.is-next-project {
  opacity: 0;
  -webkit-transition: opacity 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s;
}
#cursorCenter.is-menu-icon {
  opacity: 0;
  -webkit-transition: opacity 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s;
}
#cursorCenter.is-slide {
  opacity: 0;
  -webkit-transition: opacity 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s;
}
#cursorCenter.is-link-2 {
  opacity: 0;
  -webkit-transition: opacity 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s;
}
#cursorCenter.is-writeUs {
  opacity: 0;
  -webkit-transition: opacity 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s;
}
#cursorCenter.is-playVideo {
  opacity: 0;
  -webkit-transition: opacity 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s;
}
#cursorCenter.is-pauseVideo {
  opacity: 0;
  -webkit-transition: opacity 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s;
}
#cursorCenter.is-careerBtn {
  opacity: 0;
  -webkit-transition: opacity 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s;
}
#cursorCenter.is-nextProject {
  opacity: 0;
  -webkit-transition: opacity 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s;
}
#cursorCenter.is-nextProject {
  opacity: 0;
  -webkit-transition: opacity 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s;
}
#cursorCenter.is-darkMode {
  opacity: 0;
  -webkit-transition: opacity 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s;
}
#cursorCenter.is-scrollDown {
  opacity: 0;
  -webkit-transition: opacity 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s;
}
#cursorCenter.is-scrollTop {
  opacity: 0;
  -webkit-transition: opacity 0.23s ease-in-out 0s;
  transition: opacity 0.23s ease-in-out 0s;
}

/* END */
#loader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: #000000;
  z-index: 50;
}
#loader #logoGraph {
  position: absolute;
  width: 9.375vw;
  height: auto;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
#loader #logoGraph svg {
  width: 100%;
  position: relative;
  margin: 0 auto;
  overflow: visible;
  display: block;
}
#loader #logoGraph svg path {
  stroke: var(--subColor);
  fill: transparent;
  -webkit-transition: fill 1s ease-in-out 0s;
  transition: fill 1s ease-in-out 0s;
}
#loader #logoGraph svg path.withBg {
  fill: var(--subColor);
  -webkit-transition: fill 1s ease-in-out 0s;
  transition: fill 1s ease-in-out 0s;
}
#loader #logoText {
  position: absolute;
  width: 12.5vw;
  height: auto;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
#loader #logoText svg {
  position: relative;
  margin: 0 auto;
  overflow: visible;
  display: block;
  opacity: 0;
  fill: var(--subColor);
}

.linkWithArrow {
  position: relative;
  text-decoration: none;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  display: inline-block;
  margin-top: 3vh;
  margin-left: 30px;
}
.linkWithArrow svg {
  position: absolute;
  top: 50%;
  left: -30px;
  width: 16px;
  height: 16px;
  fill: var(--subColor);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.linkWithArrow:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -6px;
  width: 0%;
  height: 2px;
  background-color: var(--subColor);
  -webkit-transition: width 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s;
}
.linkWithArrow:hover:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -6px;
  width: calc(100% + 12px);
  height: 2px;
  background-color: var(--subColor);
  -webkit-transition: width 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s;
}

.linkWithArrowNoMargin {
  position: relative;
  text-decoration: none;
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
  display: inline-block;
}
.linkWithArrowNoMargin svg {
  position: absolute;
  top: 50%;
  left: -30px;
  width: 16px;
  height: 16px;
  fill: var(--subColor);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.linkWithArrowNoMargin:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -6px;
  width: 0%;
  height: 2px;
  background-color: var(--subColor);
  -webkit-transition: width 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s;
}
.linkWithArrowNoMargin:hover:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -6px;
  width: calc(100% + 12px);
  height: 2px;
  background-color: var(--subColor);
  -webkit-transition: width 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s;
}

#container {
  position: relative;
  width: 100%;
  /*div{
      &[data-barba="container"] {
          overflow: hidden;
      }
  }*/
}

.form {
  overflow: hidden;
}
.form .trigger-element {
  position: absolute;
  right: 5rem;
  bottom: 5rem;
  background-color: #000;
  width: 50px;
  height: 50px;
}
.form .foCont {
  position: relative;
  float: left;
}
.form .foCont .alert {
  position: absolute;
  top: 50%;
  right: 2vw;
  fill: var(--subColor);
  width: 20px;
  height: 20px;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
.form .foCont .alert.visible {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}

@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  .form .foCont input {
    padding: 20px;
  }
}
.form .foCont input.submitButton {
  padding: 0;
}
.form .foCont .customInputFile {
  position: relative;
  padding: 1.5vw 2vw;
  border: none;
  float: left;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  cursor: pointer;
  width: 100%;
}
.form .foCont .customInputFile input {
  display: none;
}
.form .foCont .customInputFile span.fileText {
  color: rgba(255, 255, 255, 0.5);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
}
.form .foCont .customInputFile span.fileText.set {
  color: white;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
}
.form .foCont .customInputFile svg {
  position: absolute;
  top: 50%;
  right: 2vw;
  fill: rgba(255, 255, 255, 0.5);
  width: 20px;
  height: 20px;
  display: block;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.form .foCont .customInputFile .alert {
  right: calc(2vw + 30px);
  fill: var(--subColor);
}
@media only screen and (max-device-width: 428px) and (orientation: portrait) {
  .form .foCont .customInputFile {
    padding: 20px;
  }
  .form .foCont .customInputFile svg {
    right: 20px;
  }
}
.form .foCont textarea {
  resize: none;
  height: 12.5vw;
  border: none;
  padding: 1.5vw 2vw;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 100%;
  border-radius: 0;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  .form .foCont textarea {
    height: 20vh;
    padding: 20px;
  }
}
.form .foCont.half {
  width: 25vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  .form .foCont.half {
    width: 100%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: landscape) {
  .form .foCont.half {
    width: calc(50% - (0.125 * 6.25vw));
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  .form .foCont.half {
    width: calc(50% - (0.125 * 6.25vw));
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  .form .foCont.half {
    width: calc(50% - (0.125 * 6.25vw));
  }
}
.form .foCont.privacyText {
  width: 100%;
  margin-top: 1.5625vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  .form .foCont.privacyText {
    margin-top: 1.25rem;
  }
  .form .foCont.privacyText span.privacyText__bottom {
    margin-top: 1.25rem;
  }
  .form .foCont.privacyText span.privacyText__bottom a {
    color: var(--subColor);
  }
}
.form .foCont.privacyText span {
  color: rgba(255, 255, 255, 0.5);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 14px;
  line-height: 20px;
}
.form .foCont.privacyText span.privacyError {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  -webkit-transform: translateY(-120%);
  transform: translateY(-120%);
  color: #000;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  opacity: 0;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  .form .foCont.privacyText span.privacyError {
    font-size: 10px;
    line-height: 10px;
  }
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  .form .foCont.privacyText span {
    font-size: 11px;
    line-height: 11px;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  .form .foCont.privacyText span {
    color: white;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 0.8rem;
  }
}
.form .foCont.privacyText .check {
  position: relative;
  width: 100%;
  height: auto;
  margin-top: 10px;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  .form .foCont.privacyText .check {
    margin-top: 1.25rem;
  }
}
.form .foCont.privacyText .check input {
  display: none;
}
.form .foCont.privacyText .check .ck {
  position: relative;
  float: left;
  width: 20px;
  height: 20px;
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: 50%;
  margin-right: 10px;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  .form .foCont.privacyText .check .ck {
    width: 1rem;
    height: 1rem;
    border: 1px solid white;
  }
}
.form .foCont.privacyText .check .ck:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  display: block;
  border-radius: 50%;
  width: 0px;
  height: 0px;
  background-color: rgba(255, 255, 255, 0.5);
  -webkit-transition: width 0.35s ease-in-out 0s, height 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s, height 0.35s ease-in-out 0s;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  .form .foCont.privacyText .check .ck:before {
    background-color: white;
  }
}
.form .foCont.privacyText .check p {
  color: rgba(255, 255, 255, 0.5);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 14px;
  line-height: 20px;
}
@media only screen and (min-width: 1025px) and (max-width: 1280px) and (max-device-height: 720px) {
  .form .foCont.privacyText .check p {
    font-size: 11px;
    line-height: 11px;
  }
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  .form .foCont.privacyText .check p {
    color: white;
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 0.8rem;
  }
}
.form .foCont.privacyText .check p a {
  color: var(--subColor);
}
.form .foCont.privacyText .check.clicked .ck:before {
  width: 16px;
  height: 16px;
  -webkit-transition: width 0.35s ease-in-out 0s, height 0.35s ease-in-out 0s;
  transition: width 0.35s ease-in-out 0s, height 0.35s ease-in-out 0s;
}
.form .foCont.full {
  width: 100%;
  margin: 0;
}
.form .foCont.ml {
  margin-left: 0.78125vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  .form .foCont.ml {
    margin-left: 0;
  }
}
.form .foCont.mr {
  margin-right: 0.78125vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  .form .foCont.mr {
    margin-right: 0;
  }
}
.form .foCont.mb {
  margin-bottom: 1.5625vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  .form .foCont.mb {
    margin-bottom: 6.25vw;
  }
}
.form .foCont .dark {
  background-color: rgba(0, 0, 0, 0.1);
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 18px;
}
.form .foCont .dark::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.5);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
}
.form .foCont .dark::-moz-placeholder {
  color: rgba(255, 255, 255, 0.5);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
}
.form .foCont .dark :-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.5);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
}
.form .foCont .dark :-moz-placeholder {
  color: rgba(255, 255, 255, 0.5);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
}
.form .foCont .light {
  background-color: rgba(255, 255, 255, 0.1);
  color: #fff;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 18px;
}
.form .foCont .light::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.5);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
}
.form .foCont .light::-moz-placeholder {
  color: rgba(255, 255, 255, 0.5);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
}
.form .foCont .light :-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.5);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
}
.form .foCont .light :-moz-placeholder {
  color: rgba(255, 255, 255, 0.5);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 16px;
}
.form .foCont .doubleOpacity.light {
  background-color: rgba(255, 255, 255, 0.2);
}
.form .foCont.required:after {
  content: "*";
  color: rgba(255, 255, 255, 0.5);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 0.75vw;
  line-height: 1.5vw;
  position: absolute;
  top: 0;
  left: 0.5vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  .form .foCont.required:after {
    color: rgba(255, 255, 255, 0.5);
    font-family: "Monument Grotesk";
    font-weight: normal;
    font-size: 1rem;
    line-height: 20px;
    left: 5px;
  }
}
.form .foCont .error {
  position: absolute;
  width: 100%;
  height: auto;
  bottom: 0;
  left: 0;
  opacity: 0;
  -webkit-transform: translateY(110%);
  transform: translateY(110%);
  color: #000;
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
.form .foCont .error.visible {
  opacity: 1;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
}
.form .tip {
  position: relative;
  color: rgba(255, 255, 255, 0.5);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 12px;
  line-height: 14px;
  text-align: right;
  width: 100%;
  display: block;
  margin-top: 5px;
  float: left;
}
.form .tip em {
  color: rgba(255, 255, 255, 0.5);
  font-family: "Monument Grotesk";
  font-weight: normal;
  font-size: 0.75vw;
}
@media only screen and (min-device-width: 0px) and (max-device-width: 1023px) {
  .form .tip em {
    font-size: 1rem;
    margin-right: 0.25rem;
  }
}
.form .formWait {
  position: absolute;
  bottom: 0;
  left: 18.75vw;
  opacity: 0;
  visibility: hidden;
}
.form .formWait p {
	color: #fff;
	font-family: "Monument Grotesk";
	font-weight: normal;
	font-size: 3vw;
	display: inline-block;
}
.form .formWait span {
	color: #fff;
	font-family: "Monument Grotesk";
	font-weight: normal;
	font-size: 3vw;
	display: inline-block;
}
.form .formWait span:first-of-type {
  -webkit-animation-name: ellipsis_1;
          animation-name: ellipsis_1;
  -webkit-animation-duration: 3s;
          animation-duration: 3s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
.form .formWait span:nth-of-type(2) {
  -webkit-animation-name: ellipsis_2;
          animation-name: ellipsis_2;
  -webkit-animation-duration: 3s;
          animation-duration: 3s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
.form .formWait span:last-of-type {
  -webkit-animation-name: ellipsis_3;
          animation-name: ellipsis_3;
  -webkit-animation-duration: 3s;
          animation-duration: 3s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
@media only screen and (min-device-width: 429px) and (max-device-width: 768px) and (orientation: portrait) {
	.form .formWait {
		left: 6.25vw;
	}
}
.form .submitButton {
	color: #fff;
	font-family: "Monument Grotesk";
	font-weight: normal;
	font-size: 3vw;
	margin: 2vh 0 0 0;
	cursor: pointer;
	display: inline-block;
	background-color: transparent;
	padding: 0;
	border: none;
}

.form .foCont label {
	color: #DDD;
	font-family: "Monument Grotesk";
	font-size: 14px;
}
.form .foCont input,
.form .foCont select {
	border: none;
	border-radius: 0;
	float: left;
	position: relative;
	padding: 1.5vw 2vw;
	width: 100%;

	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.form .foCont select.light,
.form .foCont select {
	color: #CCCCCC;
	font-size: 14px;
	font-weight: 100;
}

@media only screen and (max-device-width: 428px) and (orientation: portrait) {
	.form .submitButton {
		color: #fff;
		font-family: "Monument Grotesk";
		font-weight: normal;
		font-size: 30px;
	}
}

.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}

* html .clearfix {
	zoom: 1;
}

/* IE6 */
*:first-child + html .clearfix {
	zoom: 1;
}

/* IE7 */

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