/*************** 1. GLOBAL ***************/
html {
  height: 100%;
  background-color: #eef8f9;
  isolation: isolate; }

body {
  min-height: 100%; }

/*Edge*/
@supports (-ms-accelerator: true) {
  html {
    overflow: hidden;
    height: 100%; }

  body {
    overflow: auto;
    height: 100%; } }
/*Ie 10/11*/
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  html {
    overflow: hidden;
    height: 100%; }

  body {
    overflow: auto;
    height: 100%; } }
@font-face {
  font-family: 'Sharp Grotesk';
  src: url("fonts/SharpGrotesk-Medium20.woff2") format("woff2"), url("fonts/SharpGrotesk-Medium20.woff") format("woff");
  font-weight: 500;
  font-style: normal; }
@font-face {
  font-family: 'Sharp Grotesk';
  src: url("fonts/SharpGrotesk-Book20.woff2") format("woff2"), url("fonts/SharpGrotesk-Book20.woff") format("woff");
  font-weight: normal;
  font-style: normal; }
/*************** 2. GRID ***************/
.container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin: 0 auto;
  max-width: 1280px; }

.row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin: 0 auto;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

.col-1 {
  -ms-flex-preferred-size: 12.5%;
      flex-basis: 12.5%;
  padding-left: 15px;
  padding-right: 15px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

.col-2 {
  -ms-flex-preferred-size: 25%;
      flex-basis: 25%;
  padding-left: 15px;
  padding-right: 15px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

.col-3 {
  -ms-flex-preferred-size: 37.5%;
      flex-basis: 37.5%;
  padding-left: 15px;
  padding-right: 15px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

.col-4 {
  -ms-flex-preferred-size: 50%;
      flex-basis: 50%;
  padding-left: 15px;
  padding-right: 15px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

.col-5 {
  -ms-flex-preferred-size: 62.5%;
      flex-basis: 62.5%;
  padding-left: 15px;
  padding-right: 15px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

.col-6 {
  -ms-flex-preferred-size: 75%;
      flex-basis: 75%;
  padding-left: 15px;
  padding-right: 15px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

.col-7 {
  -ms-flex-preferred-size: 87.5%;
      flex-basis: 87.5%;
  padding-left: 15px;
  padding-right: 15px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

.col-8 {
  -ms-flex-preferred-size: 100%;
      flex-basis: 100%;
  padding-left: 15px;
  padding-right: 15px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

.col6-1 {
  -ms-flex-preferred-size: 16.6666666667%;
      flex-basis: 16.6666666667%;
  padding-left: 12px;
  padding-right: 12px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

.col6-2 {
  -ms-flex-preferred-size: 33.3333333333%;
      flex-basis: 33.3333333333%;
  padding-left: 12px;
  padding-right: 12px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

.col6-3 {
  -ms-flex-preferred-size: 50%;
      flex-basis: 50%;
  padding-left: 12px;
  padding-right: 12px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

.col6-4 {
  -ms-flex-preferred-size: 66.6666666667%;
      flex-basis: 66.6666666667%;
  padding-left: 12px;
  padding-right: 12px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

.col6-5 {
  -ms-flex-preferred-size: 83.3333333333%;
      flex-basis: 83.3333333333%;
  padding-left: 12px;
  padding-right: 12px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

.col6-6 {
  -ms-flex-preferred-size: 100%;
      flex-basis: 100%;
  padding-left: 12px;
  padding-right: 12px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

body {
  font-family: 'Sharp Grotesk', sans-serif;
  font-size: 20px;
  background-color: transparent;
  color: #747f8f;
  min-height: 100vh;
  overflow: hidden; }
  body .projects {
    opacity: 0; }
  body:before {
    content: " ";
    height: 100%;
    width: 100%; }
  body #homepage {
    padding-top: 30vh; }
  body.init {
    overflow: auto; }
    body.init .projects {
      opacity: 1; }

header {
  width: 100%;
  padding: 30px 15px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: relative;
  position: fixed;
  z-index: 100000000;
  padding-right: 11px; }
  header .logo {
    position: absolute;
    left: 15px;
    top: 0; }
    header .logo a {
      color: #747f8f;
      text-decoration: none; }
      header .logo a:hover {
        opacity: 0.6; }
  header .menu-holder {
    width: 100%; }
  header .menu {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    position: relative; }
  header ul.menu-list {
    margin-top: 0;
    margin-bottom: 0;
    list-style: none;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    padding: 0; }
    header ul.menu-list li {
      display: inline-block; }
      header ul.menu-list li a {
        text-decoration: none;
        text-transform: uppercase;
        color: #747f8f; }
        header ul.menu-list li a:hover {
          opacity: 0.6; }
  header .logo-header {
    height: 30px;
    display: inline-block; }

/*************** 3. HOMEPAGE ***************/
#homepage {
  background-size: auto 83vh;
  background-repeat: no-repeat;
  background-position: center center;
  background-attachment: fixed; }

[data-aos="custom-fade-up"] {
  -webkit-transform: translateY(880px);
          transform: translateY(880px);
  opacity: 0;
  -webkit-transition-property: opacity, -webkit-transform;
  transition-property: opacity, -webkit-transform;
  transition-property: transform, opacity;
  transition-property: transform, opacity, -webkit-transform;
  -webkit-transition-duration: 1500ms;
          transition-duration: 1500ms; }
  [data-aos="custom-fade-up"].aos-animate {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1; }

.bg-1 {
  position: fixed;
  z-index: -1;
  top: 0;
  left: 0;
  min-height: 100vh;
  width: 100%;
  padding-top: 0px;
  background-size: auto 83vh;
  background-repeat: no-repeat;
  background-position: center center;
  background-attachment: fixed; }

.bg-1 {
  display: block; }

.bg-logo {
  position: fixed;
  height: 100%;
  width: 100%;
  top: 50%;
  left: 50%;
  margin-top: 14px;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%); }
  .bg-logo img {
    height: 83vh;
    width: auto;
    -o-object-position: center;
       object-position: center;
    isolation: isolate; }

.bg-logo-2 {
  mix-blend-mode: color;
  opacity: 1; }
  .bg-logo-2 img {
    margin-top: 29px;
    height: calc(83vh - 8px); }

.projects-hover {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  opacity: 0.1; }

@supports not (mix-blend-mode: color) {
  .bg-logo-2 {
    opacity: 0.3; } }
.no-mix-blend-mode .bg-logo-2, .safari .bg-logo-2 {
  opacity: 0.3; }

.projects {
  margin-left: 0;
  padding-left: 15px;
  padding-right: 15px;
  background-size: auto 83vh;
  background-repeat: no-repeat;
  background-position: center;
  background-attachment: fixed;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start; }
  .projects .col-projects {
    -webkit-transition: all .3s;
    transition: all .3s;
    -webkit-transform: translate3d(0px, 0px, 0px);
            transform: translate3d(0px, 0px, 0px); }
  .projects .column {
    padding-left: 15px;
    padding-right: 15px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box; }
  .projects .project {
    margin-bottom: 200px;
    display: block;
    text-decoration: none; }
    .projects .project img {
      width: 100%; }
    .projects .project h3 {
      opacity: 0;
      -webkit-transition: all .2s;
      transition: all .2s;
      font-weight: 400;
      font-size: 1em;
      line-height: 1;
      text-decoration: none;
      color: #747f8f;
      margin-top: 8px; }
    .projects .project:hover h3 {
      opacity: 1; }
  .projects .column-2 {
    padding-top: 160px; }

/*************** 4. PROJECTS ***************/
#projects {
  min-height: 98vh; }

.projects-holder {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin: 0 auto;
  padding-top: 86px;
  padding: 86px 18px 30px 18px; }

.project-holder {
  display: block;
  position: relative;
  color: #747f8f;
  text-decoration: none;
  margin-bottom: 24px; }
  .project-holder img {
    width: 100%;
    height: auto; }
  .project-holder .project-legend {
    font-size: 0.6em;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    color: #747f8f;
    -webkit-transition: all .3s ease-out;
    transition: all .3s ease-out; }
    .project-holder .project-legend h3 {
      font-size: 1em;
      font-weight: 500;
      margin-top: 0;
      margin-bottom: 0.3em; }
    .project-holder .project-legend .legend-bg {
      height: 100%;
      width: 100%;
      background-color: #eef8f9;
      mix-blend-mode: hard-light; }
    .project-holder .project-legend .legend-text {
      padding: 10px;
      -webkit-box-sizing: border-box;
              box-sizing: border-box;
      line-height: 1.28em; }
      .project-holder .project-legend .legend-text h3 {
        line-height: 1.43em; }
      .project-holder .project-legend .legend-text p {
        margin-top: 0;
        margin-bottom: 0; }
    .project-holder .project-legend .legend-text, .project-holder .project-legend .legend-bg {
      position: absolute;
      top: 0;
      left: 0;
      opacity: 0;
      -webkit-transition: all .2s ease-out;
      transition: all .2s ease-out; }
  .project-holder:hover .legend-text, .project-holder:hover .legend-bg {
    opacity: 1; }

/*************** 5. PROJECT ***************/
.diaporama {
  max-width: 62.5%;
  padding-left: 0;
  position: relative; }
  .diaporama img {
    width: 100%; }
  .diaporama .diaporama-holder {
    height: calc(100vh - 80px);
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -o-object-fit: contain;
       object-fit: contain;
    -o-object-position: top left;
       object-position: top left; }
  .diaporama .counter {
    font-size: 1em;
    line-height: 27px;
    font-weight: 400;
    width: calc(100% + 15px);
    position: relative;
    height: 80px;
    line-height: 1;
    -webkit-box-sizing: border-box;
            box-sizing: border-box; }
  .diaporama .slide-number {
    position: absolute;
    left: 40%;
    bottom: 30px;
    text-align: left;
    width: 20%;
    padding-left: 15px;
    padding-right: 15px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box; }
  .diaporama .slide-total {
    position: absolute;
    right: 0;
    text-align: right;
    bottom: 30px;
    width: 20%;
    padding-left: 15px;
    padding-right: 15px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box; }

.owl-carousel.owl-drag .owl-item {
  height: 100%;
  width: 100%; }
  .owl-carousel.owl-drag .owl-item img {
    height: 100%;
    width: 100%;
    float: right;
    -o-object-position: top right;
       object-position: top right;
    -o-object-fit: contain;
       object-fit: contain; }
  .owl-carousel.owl-drag .owl-item img.landscape {
    height: 100%;
    width: 100%;
    float: right;
    -o-object-position: top right;
       object-position: top right;
    -o-object-fit: contain;
       object-fit: contain; }

.ptext-holder {
  margin-top: 180px; }
  .ptext-holder h2 {
    font-size: 1.5em;
    font-weight: 400;
    margin-top: 0;
    margin-bottom: 5px; }
  .ptext-holder .legend {
    font-size: 1em; }

.cursor {
  position: fixed;
  width: 30px;
  height: auto;
  left: -100px;
  cursor: none;
  pointer-events: none;
  z-index: 1000;
  pointer-events: none;
  -webkit-transition: -webkit-transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  transition: -webkit-transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  opacity: 1;
  -webkit-transform-origin: 50% 50%;
          transform-origin: 50% 50%; }
  .cursor.left {
    -webkit-transform: translate3d(-50%, -50%, 0) scale(1, 1) rotate(180deg);
            transform: translate3d(-50%, -50%, 0) scale(1, 1) rotate(180deg);
    -webkit-transition: -webkit-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    transition: -webkit-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1); }
  .cursor.right {
    -webkit-transform: translate3d(-50%, -50%, 0) scale(1, 1) rotate(0deg);
            transform: translate3d(-50%, -50%, 0) scale(1, 1) rotate(0deg);
    -webkit-transition: -webkit-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    transition: -webkit-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1); }

.owl-nav {
  position: absolute;
  width: 100%;
  top: 0;
  height: 100%;
  cursor: none; }

.custom-owl-nav {
  right: 15px;
  height: calc(85vh);
  z-index: 1000;
  margin-top: 53px; }

.owl-carousel.owl-drag .owl-item, .owl-stage {
  height: 100%; }

.owl-prev, .owl-next {
  width: 50%;
  height: 100%;
  cursor: none;
  background-color: transparent;
  border: none !important;
  z-index: 100; }
  .owl-prev:focus, .owl-next:focus {
    border: none;
    box-shadow: none;
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none; }
  .owl-prev span, .owl-next span {
    display: none; }

.projects-hover {
  position: absolute;
  top: 0;
  left: 0;
  position: absolute;
  top: 0;
  left: 0;
  margin-left: 0;
  padding-left: 15px;
  padding-right: 15px;
  background-size: auto 83vh;
  background-repeat: no-repeat;
  background-position: center;
  background-attachment: fixed;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  padding-top: 30vh;
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  opacity: 1; }
  .projects-hover .project {
    display: block;
    text-decoration: none;
    line-height: 1; }
    .projects-hover .project h3 {
      color: #747f8f;
      text-decoration: none;
      opacity: 0;
      -webkit-transition: all .2s ease-out;
      transition: all .2s ease-out;
      font-weight: 400;
      font-size: 1em;
      margin-top: 14px; }
  .projects-hover .placeholder {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    opacity: 0; }

.projects-hover .column-2 {
  padding-top: 160px; }

.projects-hover .project {
  margin-bottom: 200px;
  display: block;
  text-decoration: none; }
  .projects-hover .project img {
    width: 100%;
    opacity: 0; }
  .projects-hover .project:hover h3 {
    opacity: 1; }

/*************** 6. ABOUT ***************/
#about {
  background-color: white;
  z-index: 100000;
  position: relative;
  padding: 0px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  max-height: 0;
  overflow: hidden;
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  min-height: none;
  padding-left: 15px;
  padding-right: 15px; }
  #about.open-about {
    max-height: none;
    padding: 15px;
    padding-top: 20px;
    -webkit-transition: all 0.25s ease-out;
    transition: all 0.25s ease-out; }
  #about .descript {
    display: inline-block;
    cursor: pointer; }
    #about .descript img {
      display: none;
      width: 300px;
      height: auto; }

.logo-about {
  display: inline-block;
  height: 27px; }

#overlay {
  position: absolute;
  height: 300px;
  width: 185px;
  z-index: 10000000;
  display: none; }
  #overlay img {
    width: 100%; }

.slide-text {
  display: none; }

.about-text {
  z-index: 100000;
  text-transform: uppercase;
  font-size: 1em;
  font-weight: 400;
  padding: 0px;
  line-height: 1.4em;
  color: #747f8f;
  max-width: 800px; }
  .about-text h3, .about-text h4 {
    font-size: 1em;
    text-transform: uppercase;
    font-weight: 400;
    margin-bottom: 0; }
  .about-text h4 {
    margin-top: 0.8em; }
  .about-text h3 {
    margin-top: 0; }
  .about-text H
  .big-text {
    font-size: 1.15em;
    line-height: 28px; }
  .about-text p {
    margin-top: 15px; }
  .about-text ul {
    list-style: none;
    margin-left: 0;
    padding-left: 0; }
  .about-text li {
    font-size: 1em;
    text-transform: none;
    line-height: 1.4em; }
  .about-text a {
    color: #747f8f;
    text-decoration: none; }
  .about-text .small-text {
    font-size: 0.7em;
    line-height: 1.4em;
    text-transform: none;
    margin-top: 0; }

.col-contact {
  font-size: 1em;
  padding-top: 15px;
  text-transform: none;
  line-height: 1.4; }
  .col-contact p {
    margin-top: 0; }
  .col-contact h3 {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 1em;
    font-weight: 500; }

.slide:nth-of-type(2) {
  margin-top: 0;
  -webkit-transition: margin-top .2s ease-out;
  transition: margin-top .2s ease-out; }
  .slide:nth-of-type(2).opened {
    margin-top: 40px;
    -webkit-transition: margin-top .2s ease-out;
    transition: margin-top .2s ease-out; }

span.more-img:last-of-type:after, span.more-img:last-of-type:before {
  position: absolute;
  content: '';
  width: 11px;
  height: 2px;
  top: 13px;
  background: #747f8f;
  -webkit-transition: .3s all;
  transition: .3s all; }

span.more-img {
  opacity: 0;
  pointer-events: none;
  width: 21px;
  height: 21px;
  border-radius: 100%;
  position: relative;
  display: inline-block;
  margin-left: 10px;
  -webkit-transition: .3s all;
  transition: .3s all; }

span.more-img:last-of-type:before {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  left: 3px; }

span.more-img:last-of-type:after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  left: 9px; }

.opened span.more-img:after {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  left: 5px;
  top: 9px; }

.opened span.more-img:before {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  left: 5px;
  top: 9px; }

.opened span.more-img:last-of-type:after, .opened span.more-img:last-of-type:before {
  position: absolute;
  content: '';
  width: 19px;
  height: 2px;
  top: 12px;
  background: #747f8f;
  -webkit-transition: .3s all;
  transition: .3s all; }

.slide-button:hover span.more-img, .opened .slide-button span.more-img {
  opacity: 1; }

.about-opened header {
  background-color: #eef8f9; }
.about-opened .open-about #about {
  min-height: 100vh; }
.about-opened #about {
  -webkit-transition: all .3s ease-out;
  transition: all .3s ease-out; }

.exhibition:hover {
  text-decoration: none !important; }

/*************** 7.MEDIA QUERIES ***************/
.show-xs {
  display: none; }

/*****---------- 7.1 Menu mobile ----------*****/
.menu-btn {
  position: relative;
  display: none;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 25px;
  height: 25px;
  cursor: pointer;
  -webkit-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out;
  position: fixed;
  top: 15px;
  right: 15px;
  z-index: 1000; }

/* This creates the middle line */
.menu-btn__burger {
  width: 100%;
  -webkit-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
  z-index: 100; }

/* This creates the top and bottom lines but it does not position them */
.menu-btn__burger::before,
.menu-btn__burger::after {
  content: '';
  position: absolute;
  width: 100%;
  height: 1px;
  background: #747f8f;
  border-radius: 0px;
  -webkit-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out;
  left: 0; }

/* This positions the top and bottom lines */
.menu-btn__burger::before {
  -webkit-transform: translateY(0px);
          transform: translateY(0px); }

.menu-btn__burger::after {
  -webkit-transform: translateY(7px);
          transform: translateY(7px); }

.menu-btn__burger.burger-2::before {
  -webkit-transform: translateY(14px);
          transform: translateY(14px); }

.menu-btn__burger.burger-2::after {
  -webkit-transform: translateY(21px);
          transform: translateY(21px); }

/* Animation */
.menu-btn.open .menu-btn__burger {
  -webkit-transform: translate(0px, 0px);
          transform: translate(0px, 0px);
  background: transparent; }

.menu-btn.open .menu-btn__burger::before {
  -webkit-transform: rotate(45deg) translate(2px, 4px);
          transform: rotate(45deg) translate(2px, 4px);
  width: 17px; }

.menu-btn.open .menu-btn__burger::after {
  -webkit-transform: rotate(-45deg) translate(4px, 10px);
          transform: rotate(-45deg) translate(4px, 10px);
  width: 17px; }

.menu-btn.open .menu-btn__burger.burger-2::before {
  -webkit-transform: rotate(-45deg) translate(-13px, 10px);
          transform: rotate(-45deg) translate(-13px, 10px);
  width: 17px; }

.menu-btn.open .menu-btn__burger.burger-2::after {
  -webkit-transform: rotate(45deg) translate(19px, 4px);
          transform: rotate(45deg) translate(19px, 4px);
  width: 17px; }

@supports not (mix-blend-mode: hard-light) {
  .project-holder:hover .legend-text, .project-holder:hover .legend-bg {
    opacity: 0.95; } }
.projects .project.show-xs {
  display: none; }

.projects-hover .project.show-xs {
  display: none; }

/*****---------- 7.2 Media Queries ----------*****/
@media screen and (max-width: 780px) {
  .show-xs {
    display: block; }

  .hide-xs {
    display: none; }

  .menu-mobile {
    display: none;
    background-color: #eef8f9;
    width: 100%;
    padding: 15px;
    padding-top: 10px; }

  header {
    padding: 0; }

  body #homepage {
    padding-top: 0; }
    body #homepage .col-4 {
      -ms-flex-preferred-size: 100%;
          flex-basis: 100%;
      width: 100%; }

  h1 {
    font-size: 0.7em;
    color: #747f8f;
    text-transform: uppercase;
    font-weight: 400;
    padding-left: 15px;
    margin-top: 10px; }

  .ptext-holder {
    margin-top: 12px; }
    .ptext-holder h2 {
      font-size: 0.7em;
      margin-bottom: 2px; }
    .ptext-holder .legend {
      font-size: 0.625em; }
      .ptext-holder .legend p {
        margin-top: 0;
        margin-bottom: 0; }

  .diaporama {
    max-width: 100%;
    -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
    padding-left: 0;
    position: relative;
    margin-top: 20px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    padding: 0;
    overflow-x: hidden; }

  #overlay {
    display: none; }

  .custom-owl-nav {
    left: 0;
    height: 100%;
    z-index: 1000;
    margin-top: 0px; }

  .diaporama .diaporama-holder {
    height: calc(100vh - 124px);
    width: 100%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box; }

  .owl-carousel.owl-drag .owl-item img {
    -o-object-fit: contain;
       object-fit: contain;
    width: 100% !important;
    -o-object-position: top center;
       object-position: top center;
    -webkit-box-sizing: border-box;
            box-sizing: border-box; }

  .btn-close-project {
    width: 25px;
    height: 25px;
    position: fixed;
    right: 15px;
    top: 15px; }

  .btn-close-project::before,
  .btn-close-project::after {
    content: '';
    position: absolute;
    width: 35px;
    height: 1px;
    background: #747f8f;
    border-radius: 0px;
    -webkit-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
    left: 0; }

  /* This positions the top and bottom lines */
  .btn-close-project::before {
    -webkit-transform: rotate(-45deg) translate(-11px, 5px);
            transform: rotate(-45deg) translate(-11px, 5px); }

  .btn-close-project::after {
    -webkit-transform: rotate(45deg) translate(5px, 11px);
            transform: rotate(45deg) translate(5px, 11px); }

  .diaporama .counter {
    font-size: 1em;
    line-height: 27px;
    font-weight: 400;
    width: calc(100% + 15px);
    position: relative;
    height: 40px;
    line-height: 1;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }

  .diaporama .slide-number {
    position: absolute;
    left: 15px;
    bottom: 10px;
    text-align: left;
    width: 20%;
    padding-left: 0;
    padding-right: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    line-height: 1; }

  .diaporama .slide-total {
    position: absolute;
    right: 15px;
    text-align: right;
    bottom: 10px;
    width: 20%;
    padding-left: 0;
    padding-right: 15px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    line-height: 1; }

  .projects-holder {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0 auto;
    padding: 60px 8px 30px 8px;
    padding-top: 60px; }

  .project-holder {
    margin-bottom: 15px; }

  .projects, .projects-hover {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column; }

  .projects-hover .project, .projects .project {
    margin-bottom: 60px; }

  .projects .column-2 {
    padding-top: 0px; }

  .projects .project h3 {
    opacity: 1;
    display: none; }

  .projects-hover .project h3 {
    opacity: 1;
    display: none; }

  .projects-hover .project h3.show-xs {
    opacity: 0;
    display: block;
    margin-top: 0;
    margin-bottom: 20px;
    font-size: 1em; }

  .projects .project h3.show-xs {
    opacity: 1;
    display: block;
    margin-top: 0;
    margin-bottom: 20px;
    font-size: 1em; }

  .bg-logo-2 img {
    margin-top: 0; }

  .bg-logo img {
    width: 98%;
    height: auto;
    -o-object-position: center;
    object-position: center;
    isolation: isolate; }

  .project {
    line-height: 0; }

  .bg-logo {
    margin-top: 0px; }

  .texte-intro-mobile p, .menu-mobile {
    font-size: 0.85em;
    margin-top: 0;
    text-transform: uppercase; }

  .texte-intro-mobile {
    padding: 15px;
    max-width: calc(100% - 70px);
    padding-top: 10px; }

  .menu-list {
    list-style: none;
    display: block; }
    .menu-list li {
      display: block;
      line-height: 1.23em; }

  header ul.menu-list li {
    display: block;
    margin-bottom: 5px; }
    header ul.menu-list li:last-of-type {
      margin-bottom: 0px; }

  header ul.menu-list {
    display: block; }

  .projects {
    padding-top: 35vh; }

  .projects-hover {
    padding-top: 35vh; }
    .projects-hover .texte-intro-mobile {
      opacity: 0; }

  #homepage {
    position: relative; }

  .projects .project.show-xs {
    display: block; }

  [data-aos][data-aos][data-aos-delay="700"].aos-animate, body[data-aos-delay="700"] [data-aos].aos-animate {
    -webkit-transition-delay: 0s;
            transition-delay: 0s; }

  [data-aos][data-aos][data-aos-duration="1000"], body[data-aos-delay="1000"] [data-aos] {
    -webkit-transition-duration: 200ms !important;
            transition-duration: 200ms !important; }

  [data-aos-duration] {
    -webkit-transition-duration: 200ms !important;
            transition-duration: 200ms !important; }

  header .menu.header-project {
    display: none; }

  #about.about-page {
    max-height: none;
    font-size: 14px;
    padding-left: 0;
    padding-right: 0;
    min-height: 100vh; }
    #about.about-page span.descript.imgOverlay {
      display: none; }

  .about-text {
    padding-top: 40px; }

  span.more-img:last-of-type:after, span.more-img:last-of-type:before {
    width: 9px;
    height: 1px;
    top: 13px; }

  .opened span.more-img:last-of-type:after, .opened span.more-img:last-of-type:before {
    position: absolute;
    content: '';
    width: 19px;
    height: 1px;
    top: 12px;
    background: #747f8f;
    -webkit-transition: .3s all;
    transition: .3s all; }

  .about-text .big-text {
    font-size: 1.15em;
    line-height: 1.2em; }

  span.more-img {
    opacity: 1; }

  span.descript.imgOverlay {
    display: none; }

  .projects .project.show-xs {
    display: block; }

  .projects-hover .project.show-xs {
    display: block; }

  .col6-1 {
    -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
    padding-left: 7px;
    padding-right: 7px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box; }

  .col6-2 {
    -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
    padding-left: 7px;
    padding-right: 7px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box; } }

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