@charset "UTF-8";
/*************** 1. GLOBAL ***************/
html { height: 100%; background-color: #f2f3f3; isolation: isolate; }

body { overflow: hidden; height: 100%; }

body.loaded { overflow-y: auto; }

@font-face { font-family: 'Chivo'; src: url("fonts/Chivo.woff2") format("woff2"), url("fonts/Chivo.wofmenu-aboutf") format("woff"); font-weight: normal; font-style: normal; font-display: swap; }
@font-face { font-family: 'Lausanne'; src: url("fonts/Lausanne-300.woff2") format("woff2"), url("fonts/Lausanne-300.woff") format("woff"); font-weight: normal; font-style: normal; font-display: swap; }
[x-cloak] { display: none !important; }

/*************** 2. GRID ***************/
.container { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 0 auto; }

.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; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; height: 100%; }

a { color: #00ff7f; }
a:hover { color: black; }

.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; }

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { img[src*=".svg"] { width: 100%; height: auto; }
  svg { width: 100%; height: auto; }
  .row { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: none; flex-wrap: none; margin: 0 auto; -webkit-box-sizing: border-box; box-sizing: border-box; } }
body { font-family: 'Chivo', sans-serif; font-size: 16px; background-color: transparent; min-height: 100vh; overflow: hidden; position: relative; }
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; }
body.init #homepage { max-height: none; padding-top: 20vh; -webkit-transition: .5s all; transition: .5s all; }

body { color: #00ff7f; }

a { color: #00ff7f; }

a:hover { color: black; }

a:hover .title-project { color: #00ff7f; }

svg { fill: #00ff7f; }

#projects-home:before { border-top: 3px solid #00ff7f; }

.about-text p:hover { color: black; }

.logo-home:hover svg { fill: black; }

.menu-btn span { background-color: #00ff7f; }

.fancybox__container { z-index: 2000000; }

header { width: 100%; padding: 20px 15px; -webkit-box-sizing: border-box; box-sizing: border-box; position: static; z-index: 1000; top: 0px; opacity: 0; -webkit-transition: opacity .2s ease-out; transition: opacity .2s ease-out; }
header.is_stuck { opacity: 1; }
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 .logo { position: absolute; left: 15px; }

.menu-about { list-style: none; padding-left: 0; }

.logo-header { width: 280px; }

.menu-list { list-style: none; 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; margin-top: 0; margin-bottom: 0; padding-left: 0; }
.menu-list a { text-decoration: none; font-size: 2.1875em; }

.a-right { text-align: right; }

.f-left { float: left; }

.f-right { float: right; }

a { -webkit-transition: all 0.2s cubic-bezier(0.17, 0.67, 0.41, 0.91); transition: all 0.2s cubic-bezier(0.17, 0.67, 0.41, 0.91); }

a:hover { color: black; }

.hide { display: none; }

/*************** 3. HOMEPAGE ***************/
#introduction { height: 100%; -webkit-transition-delay: 5s; transition-delay: 5s; -webkit-transition-delay: 1500ms; transition-delay: 1500ms; -webkit-transition-property: height; transition-property: height; -webkit-transition-duration: 1s; transition-duration: 1s; position: relative; overflow: hidden; }
#introduction .container { position: absolute; width: 100%; }

.container { padding: 30px; -webkit-box-sizing: border-box; box-sizing: border-box; }

.logo-holder { width: 80%; padding-bottom: 15px; padding-top: 27px; }
.logo-holder svg { width: 100%; height: auto; }

.description-cat { display: none; font-size: 1.75em; line-height: 1em; }
.description-cat p { margin-top: 0; margin-bottom: 0; }

.arrow_down { width: 40px; height: auto; opacity: 0; }

.loaded .arrow_down { width: 40px; height: auto; opacity: 1; }

.scroll-button { position: absolute; top: calc(100vh - 50px); left: 25%; z-index: 1000; }

.col-about { width: 33%; }

.category { list-style: none; padding-left: 0; width: 100%; }
.category li { height: 60px; width: 100%; overflow: visible; }
.category a { color: inherit; text-decoration: none; display: block; width: 100%; }
.category a:hover .title-cat { display: none; }
.category a:hover .description-cat { display: block; }
.category .title-cat { font-size: 3.75em; line-height: 1; }

.category { margin-top: 0; margin-bottom: 0; }

.col-about a { font-size: clamp(18px, 6vh, 40px); line-height: 1; text-transform: none; text-align: right; text-decoration: none; }

.last-col a { text-align: right; }

.row { display: -webkit-box; display: -ms-flexbox; display: flex; min-height: 100dvh; -ms-flex-wrap: nowrap; flex-wrap: nowrap; }
.row .col-4 { width: 50%; }

.row-menu { width: 100%; padding-bottom: 30px; }
.row-menu .col-logos { -ms-flex-preferred-size: 66%; flex-basis: 66%; }

.logos-holder { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; padding-right: 15px; height: auto; }

.logo-home { -ms-flex-preferred-size: 14%; flex-basis: 14%; width: 14%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding-left: 5px; padding-right: 5px; -webkit-box-sizing: border-box; box-sizing: border-box; position: relative; height: 8vh; }
.logo-home svg { -o-object-fit: contain; object-fit: contain; width: 80%; max-height: 100%; height: auto; -o-object-position: center; object-position: center; -webkit-transition: fill .2s ease-in-out; transition: fill .2s ease-in-out; }
.logo-home:hover svg { fill: black; }

.logo-home svg .st0 { -webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out; }

.col-images { height: 100dvh; }

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .logo-home { padding-left: 0px; padding-right: 0px; } }
.swiper.mySwiper { height: 100%; width: 100%; }

.swiper-slide { height: 100%; width: 100%; padding: 10% 5%; -webkit-box-sizing: border-box; box-sizing: border-box; }

picture { display: block; width: 100%; height: 100%; }

.slide-img { width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; }

/*****---------- 3.1 Projects ----------*****/
.project .logo-project { position: absolute; left: 30px; bottom: 30px; width: 80px; height: 80px; display: none; }
.project .logo-project svg { width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; -o-object-position: center; object-position: center; position: absolute; bottom: 0; left: 0; }
.project .logo-project .logo-1 { -webkit-animation-duration: 4s; animation-duration: 4s; -webkit-animation-name: rotate1; animation-name: rotate1; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: linear; animation-timing-function: linear; }
.project .logo-project .logo-2 { -webkit-animation-duration: 4s; animation-duration: 4s; -webkit-animation-name: rotate; animation-name: rotate; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: linear; animation-timing-function: linear; }

.safari .project .logo-project .logo-1 { display: none; }
.safari .project .logo-project .logo-2 { display: block; -webkit-animation-name: none; animation-name: none; }

.owl-carousel .owl-item .owl-lazy:not([src]), .owl-carousel .owl-item .owl-lazy[src^=""] { max-height: none; }

@-webkit-keyframes rotate1 { 0% { -webkit-transform: rotateY(-90deg); transform: rotateY(-90deg); }
  50% { -webkit-transform: rotateY(90deg); transform: rotateY(90deg); }
  100% { -webkit-transform: rotateY(90deg); transform: rotateY(90deg); } }

@keyframes rotate1 { 0% { -webkit-transform: rotateY(-90deg); transform: rotateY(-90deg); }
  50% { -webkit-transform: rotateY(90deg); transform: rotateY(90deg); }
  100% { -webkit-transform: rotateY(90deg); transform: rotateY(90deg); } }
@-webkit-keyframes rotate { 0% { -webkit-transform: rotateY(90deg); transform: rotateY(90deg); }
  50% { -webkit-transform: rotateY(90deg); transform: rotateY(90deg); }
  100% { -webkit-transform: rotateY(-90deg); transform: rotateY(-90deg); } }
@keyframes rotate { 0% { -webkit-transform: rotateY(90deg); transform: rotateY(90deg); }
  50% { -webkit-transform: rotateY(90deg); transform: rotateY(90deg); }
  100% { -webkit-transform: rotateY(-90deg); transform: rotateY(-90deg); } }
/*************** 4. PROJECTS ***************/
.about-page { padding-top: 30px; }

.list-project { padding-left: 0; list-style: none; padding-top: 0; font-size: 2.1875em; line-height: 1; }
.list-project li { margin-bottom: 0px; }
.list-project a { text-decoration: none; padding-top: 6px; padding-bottom: 6px; display: block; text-transform: capitalize; }

.logo-about { width: 130px; height: 130px; }

/*************** 5. PROJECT ***************/
.page-project header { opacity: 1; }

.logo-loading { height: 78px; width: 78px; -webkit-animation-duration: 4s; animation-duration: 4s; -webkit-animation-name: rotation; animation-name: rotation; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: linear; animation-timing-function: linear; }

@-webkit-keyframes rotation { 0% { -webkit-transform: rotateY(-90deg); transform: rotateY(-90deg); }
  50% { -webkit-transform: rotateY(90deg); transform: rotateY(90deg); }
  100% { -webkit-transform: rotateY(-90deg); transform: rotateY(-90deg); } }

@keyframes rotation { 0% { -webkit-transform: rotateY(-90deg); transform: rotateY(-90deg); }
  50% { -webkit-transform: rotateY(90deg); transform: rotateY(90deg); }
  100% { -webkit-transform: rotateY(-90deg); transform: rotateY(-90deg); } }
.page-projects header { opacity: 1; }

.page-about header, .page-client header, .page-clientprojects header { opacity: 1; }

#project { overflow: hidden; }

.project-legend { padding: 30px; width: 100%; }

.video-holder { position: relative; height: 100%; width: auto; }

.text-project { font-size: 1.75em; font-weight: normal; cursor: pointer; width: 37.5%; }
.text-project h2, .text-project h3 { text-transform: uppercase; margin-bottom: 0; font-size: 1em; margin-top: 0; font-weight: 400; }
.text-project p { margin-bottom: 0; margin-top: 0; }

#project-description { font-size: 0.77em; }

.slide-video { height: 100%; width: auto; position: relative; }
.slide-video .placeholder { height: 100%; width: auto; }
.slide-video.playing .play-button-holder { display: none; }
.slide-video video { position: absolute; top: 0; left: 0; z-index: 1000; }

.slide-image { height: 100%; width: 100%; }

.full-button { position: absolute; height: 100%; width: 100%; z-index: 1000000; }
.full-button.playing .play-button-holder { opacity: 0; }

.play-button-holder { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 100000; cursor: pointer; opacity: 1; -webkit-transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1); }

.play-button { width: 75px; height: 75px; }

.owl-carousel .owl-item img.play-button { height: 70px; width: 70px; }

.owl-item { height: 100%; width: 100%; margin-right: -1px; margin-left: -1px; }

.diaporama .owl-carousel .owl-item img { height: 100%; width: 100%; -o-object-fit: contain; object-fit: contain; -o-object-position: center; object-position: center; }

.next_project { position: absolute; right: 0; top: 0; z-index: 10000; width: 30%; display: block; height: 100%; }

.diaporama { height: calc(100vh - 250px); padding-top: 20px; padding-left: 0; -webkit-box-sizing: border-box; box-sizing: border-box; position: absolute; width: 100%; top: 80px; }

.grid-gallery { height: calc(100vh - 250px); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }

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

.owl-carousel .owl-item { padding-left: 40px; -webkit-box-sizing: border-box; box-sizing: border-box; }

.owl-carousel .owl-item img { display: block; width: auto; height: 100%; }

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

.custom-owl-nav { right: 15px; height: calc(100vh - 311px); z-index: 1000; margin-top: 93px; cursor: none; }

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

.owl-prev, .owl-next { width: 15%; height: calc(100% - 60px); background-color: transparent; border: none !important; z-index: 100; cursor: pointer; position: absolute; top: 40px; }
.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: block; height: auto; }
.owl-prev svg, .owl-next svg { height: 50px; width: auto; }

.owl-next { right: 0; }

.loading-animation { position: absolute; top: calc(50% - 150px); left: 50%; z-index: 100000000; -webkit-transform: translate(-50%); transform: translate(-50%); }

.diaporama, .grid-gallery { opacity: 0; -webkit-transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1); }

.loaded-animation .diaporama, .loaded-animation .grid-gallery { opacity: 1; }
.loaded-animation .loading-animation { display: none; }

.grid-thumbnails { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; width: 100%; padding-left: 8%; padding-right: 8%; -webkit-box-sizing: border-box; box-sizing: border-box; max-height: calc(100vh - 250px); overflow-y: auto; }
.grid-thumbnails .grid-content { width: auto; height: 20vh; margin-bottom: 10px; margin-right: 10px; -webkit-transition: opacity 0.3s ease-in-out; transition: opacity 0.3s ease-in-out; }
.grid-thumbnails .grid-content img, .grid-thumbnails .grid-content video { height: 100%; width: auto; }
.grid-thumbnails .grid-content:hover { opacity: 0.5; }

.fancybox__toolbar, .fancybox__nav, .fancybox__thumbs { display: none; }

.fancybox__backdrop { background: rgba(255, 255, 255, 0.92); }

.fancybox__carousel .fancybox__slide.has-map .fancybox__content, .fancybox__carousel .fancybox__slide.has-pdf .fancybox__content, .fancybox__carousel .fancybox__slide.has-video .fancybox__content, .fancybox__carousel .fancybox__slide.has-html5video .fancybox__content { padding: 0; background: white; color: #fff; }

.fancybox__content img, .fancybox__content video { width: 100%; max-height: 100%; -o-object-fit: contain; object-fit: contain; }

.video-holder.fancybox__content { cursor: pointer; }

/* Définition des animations */
@-webkit-keyframes fadeIn { from { opacity: 0; -webkit-transform: scale(0.95); transform: scale(0.95); }
  to { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } }
@keyframes fadeIn { from { opacity: 0; -webkit-transform: scale(0.95); transform: scale(0.95); }
  to { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } }
@keyframes fadeOut { from { opacity: 1; -webkit-transform: scale(1); transform: scale(1); }
  to { opacity: 0; -webkit-transform: scale(0.95); transform: scale(0.95); } }
.cursor { position: fixed; width: 25px; 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 svg { width: 100%; height: auto; }
.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); }

.project-legend { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; position: fixed; bottom: 0; z-index: 1000; }
.project-legend .row-legend { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }

.logo-project { width: 90px; height: auto; }
.logo-project img { width: 100%; position: absolute; top: 0; left: 0; }

.col-images { position: relative; }

.hover-cover-container { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; background-color: #f2f3f3; padding: 10% 5%; -webkit-box-sizing: border-box; box-sizing: border-box; opacity: 0; -webkit-transition: opacity 0.3s ease-in-out; transition: opacity 0.3s ease-in-out; }
.hover-cover-container.active { opacity: 1; }

#hover-cover { width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; opacity: 0; -webkit-transition: opacity 0.3s ease-in-out; transition: opacity 0.3s ease-in-out; }

#hover-cover.hidden { opacity: 0; }

.view-switcher { margin-bottom: 1em; }
.view-switcher button { background-color: transparent; border: none; text-transform: uppercase; font-size: 1.5em; font-weight: 400; color: #00ff7f; -webkit-box-shadow: none; box-shadow: none; display: block; padding: 0; margin-bottom: 0.2em; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; }
.view-switcher button:hover { color: black; }

/*************** 5.5 Page client ***************/
.grid.infinite-grid { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.grid.infinite-grid .item { width: 25%; position: relative; }
.grid.infinite-grid .item:hover .info-item { opacity: 1; }
.grid.infinite-grid .info-item { background-color: #00ff7f; position: absolute; top: 0; left: 0; color: black; 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; opacity: 0; -webkit-transition: .2s ease-out; transition: .2s ease-out; padding: 0px; }
.grid.infinite-grid .info-item h2, .grid.infinite-grid .info-item h3, .grid.infinite-grid .info-item p { font-size: 1em; font-weight: normal; line-height: 1.2em; margin-top: 0; margin-bottom: 0; }
.grid.infinite-grid .info-item p + p { margin-top: 1em; }
.grid.infinite-grid .info-item h2 { margin-bottom: 0; }

.p-cover { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; }

#listing-footer { display: none; }

.spinning-wheel { position: relative; width: 100%; height: 120px; padding: 21px; -webkit-box-sizing: border-box; box-sizing: border-box; }
.spinning-wheel .loading-animation { top: 22px; }

/*************** 7. Page publications ***************/
.page-publications header { opacity: 1; }

.featherlight:last-of-type { background: rgba(0, 255, 127, 0.6); }

.featherlight .featherlight-content { padding: 0; border-bottom: 0; }

.featherlight .featherlight-close-icon { display: none; }

.fancybox__caption { -ms-flex-item-align: center; align-self: center; max-width: 100%; -ms-flex-negative: 0; flex-shrink: 0; margin: 0; padding: 14px 0 4px 0; line-height: 1.375; color: #00ff7f; }

.is-compact .fancybox__footer { position: absolute; bottom: 0; left: 0; right: 0; z-index: 20; background: transparent; }

.fancybox__toolbar__column.is-left, .fancybox__toolbar__column.is-middle { display: none; }

.is-compact .fancybox__thumbs { display: none; }

/*************** 8. ABOUT ***************/
img.logo-about { width: 130px; height: 130px; }

.contact { padding-top: 30px; padding-bottom: 30px; position: absolute; bottom: 0; }
.contact p { font-size: 1.375em; line-height: 1.4090909091em; margin-bottom: 0; }
.contact p a { text-decoration: none; }

.about-text { padding-left: 3px; margin-bottom: 0; }
.about-text p { font-size: 2.1875em; line-height: 1.2857142857em; -webkit-transition: all 0.2s cubic-bezier(0.17, 0.67, 0.41, 0.91); transition: all 0.2s cubic-bezier(0.17, 0.67, 0.41, 0.91); }
.about-text p:hover { color: black; }

.about-page { padding-left: 15px; padding-right: 15px; }

.col-full-height { height: calc(100vh - 120px); position: relative; }

/*************** 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: 28px; height: 28px; 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 { width: 28px; height: 28px; position: fixed; -webkit-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .5s ease-in-out; transition: .5s ease-in-out; cursor: pointer; top: 15px; right: 15px; }

.menu-btn span { display: block; position: absolute; height: 2px; width: 100%; opacity: 1; left: 0; -webkit-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .25s ease-in-out; transition: .25s ease-in-out; }

header.open { background-color: #f2f3f3; }

.p-description { margin-top: 1em; }

.menu-btn span:nth-child(1) { top: 0px; }

.menu-btn span:nth-child(2), .menu-btn span:nth-child(3) { top: 9px; }

.menu-btn span:nth-child(4) { top: 18px; }

.menu-btn.open span:nth-child(1) { top: 9px; width: 0%; left: 50%; }

.menu-btn.open span:nth-child(2) { -webkit-transform: rotate(45deg); transform: rotate(45deg); }

.menu-btn.open span:nth-child(3) { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }

.menu-btn.open span:nth-child(4) { top: 18px; width: 0%; left: 50%; }

/* to remove slide effect  css */
.animated { -webkit-animation-duration: 0 ms !important; animation-duration: 0 ms !important; -webkit-animation-fill-mode: both !important; animation-fill-mode: both !important; }

.fadeOut { -webkit-animation-name: fadeOut; animation-name: fadeOut; }

@-webkit-keyframes fadeOut { 0% { opacity: 0; }
  100% { opacity: 0; } }
@keyframes fadeOut { 0% { opacity: 0; }
  100% { opacity: 0; } }
#help-logos { padding-bottom: 80px; }

.logos-table { margin-top: 50px; margin-left: 50px; color: black; font-size: 21px; margin-bottom: 60px; }
.logos-table th { background-color: black; color: white; }
.logos-table td, .logos-table th { padding: 15px; border: 1px solid; }
.logos-table svg { fill: black; width: 50px; }

@supports not (mix-blend-mode: hard-light) { .project-holder:hover .legend-text, .project-holder:hover .legend-bg { opacity: 0.95; } }
/*****---------- 7.2 Media Queries ----------*****/
@media screen and (min-width: 1920px) { .grid.infinite-grid .item { width: 20%; }
  .row-menu .col-logos { width: 75%; -ms-flex-preferred-size: 75%; flex-basis: 75%; }
  .row-menu .col-about { width: 25%; } }
@media screen and (max-width: 780px) { .projects .project.show-xs { display: none; }
  .projects-hover .project.show-xs { display: none; }
  #about:hover, #about.hover { color: black; }
  #about:hover a, #about.hover a { color: black; }
  .grid.infinite-grid .info-item { padding: 10px; -webkit-box-sizing: border-box; box-sizing: border-box; }
  .project .logo-project { position: absolute; left: 15px; bottom: auto; top: 15px; width: 60px; height: 60px; display: block; }
  .row-menu { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column; flex-flow: column; }
  .project .logo-project .logo-1 { -webkit-animation-name: none; animation-name: none; display: none; }
  .project .logo-project .logo-2 { -webkit-animation-name: none; animation-name: none; }
  .project { width: 100%; height: 70vh; }
  .project a { position: relative; width: 100%; height: 100%; }
  .project video, .project img { -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; width: 100%; height: 100%; }
  .slide-video .placeholder { display: none; }
  .slide-video video { position: static; }
  .slide-legend { margin-top: 2em; margin-bottom: 0em; padding: 15px; }
  .show-xs { display: block; }
  .hide-xs { display: none; }
  header { position: fixed; opacity: 1; }
  .menu-mobile.show-xs { display: none; }
  .text-project { font-size: 1.5625em; font-weight: normal; cursor: pointer; float: none; width: 100%; }
  .project-legend { padding: 15px; padding-top: 11px; }
  .slide-description { font-size: 0.77em; }
  .page-home .logos-holder { margin-bottom: -5px; height: auto; }
  #projects-home:before { margin-left: 15px; }
  .loaded #projects-home:before { width: calc(100% - 30px); }
  .next-project { display: none !important; }
  .diaporama { height: auto; padding-left: 0; position: relative; width: 100%; }
  .project-legend .logo-project { width: 80px; height: auto; float: left; margin-top: 18px; float: none; }
  .owl-carousel { display: block; width: 100%; z-index: 1; }
  .owl-carousel img, .owl-carousel video { width: 100%; line-height: 0; height: auto; display: block; }
  .slide-video { height: 100%; width: auto; position: relative; }
  .slide-video { height: 100%; width: auto; position: relative; }
  .play-button-holder img { width: 40px; height: 40px; }
  .owl-prev, .owl-next { display: none; }
  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; }
  .row-menu .col-logos { -ms-flex-preferred-size: 100%; flex-basis: 100%; }
  .logo-home { height: auto; margin-bottom: 15px; -ms-flex-preferred-size: 25%; flex-basis: 25%; width: 25%; }
  .hover-cover-container { padding: 2em 7px; }
  .swiper-slide { height: auto; width: 100%; padding: 2em 7px; -webkit-box-sizing: border-box; box-sizing: border-box; }
  .row-menu .col-category { -ms-flex-preferred-size: 100%; flex-basis: 100%; }
  .title-project { display: none; }
  #introduction { height: auto; }
  .loaded #projects-home { padding-top: 40vh; }
  .category .title-cat { font-size: 2.40em; line-height: 1; }
  .description-cat { display: none !important; }
  .category li { height: auto; width: 100%; overflow: visible; }
  .container { padding: 15px; -webkit-box-sizing: border-box; box-sizing: border-box; }
  .about-text p { font-size: 1.25em; line-height: 1.125em; margin-bottom: 0; }
  img.logo-about { width: 88px; }
  .contact { position: static; }
  .logos-holder { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; }
  #about h2 { font-size: 1.875em; font-weight: normal; margin-bottom: 0.5em; }
  .contact p { font-size: 1.25em; line-height: 1.125em; margin-bottom: 0; margin-top: 0; }
  .about-link { font-size: 30px; text-decoration: none; line-height: 1em; margin-top: -9px; display: inline-block; margin-right: 20px; }
  header { padding: 16px 17px; }
  .logo-holder { padding-bottom: 0; }
  .featherlight .featherlight-content { max-width: 90%; }
  .about-page { padding-top: 15px; }
  .grid.infinite-grid .item { width: 50%; }
  .col-1 { -ms-flex-preferred-size: 100%; flex-basis: 100%; padding-left: 7px; padding-right: 7px; -webkit-box-sizing: border-box; box-sizing: border-box; }
  .col-2 { -ms-flex-preferred-size: 100%; flex-basis: 100%; padding-left: 7px; padding-right: 7px; -webkit-box-sizing: border-box; box-sizing: border-box; }
  .col-3 { -ms-flex-preferred-size: 100%; flex-basis: 100%; padding-left: 7px; padding-right: 7px; -webkit-box-sizing: border-box; box-sizing: border-box; }
  .col-4 { -ms-flex-preferred-size: 100%; flex-basis: 100%; padding-left: 7px; padding-right: 7px; -webkit-box-sizing: border-box; box-sizing: border-box; }
  .col-5 { -ms-flex-preferred-size: 100%; flex-basis: 100%; padding-left: 7px; padding-right: 7px; -webkit-box-sizing: border-box; box-sizing: border-box; }
  .col-6 { -ms-flex-preferred-size: 100%; flex-basis: 100%; padding-left: 7px; padding-right: 7px; -webkit-box-sizing: border-box; box-sizing: border-box; }
  .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; } }
@media screen and (max-width: 720px) { #introduction .row { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
  #introduction .row .col-4 { width: 100%; }
  .project-row { height: auto; }
  .project-legend { position: static; }
  .diaporama { height: auto; position: static; width: 100%; }
  .menu-mobile { display: block; height: auto; }
  header { -webkit-transition: all .2s ease-out; transition: all .2s ease-out; }
  .menu-list-mobile { list-style: none; padding-left: 0px; margin-top: 0; margin-bottom: 0; }
  .menu-list-mobile li { font-size: 30px; text-decoration: none; line-height: 1em; margin-bottom: 14px; }
  .menu-list-mobile li a { text-decoration: none; }
  .row { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
  .col-images { height: auto; }
  .fancybox__toolbar { display: block; }
  .fancybox__toolbar__column.is-right button { visibility: hidden; }
  .fancybox__toolbar__column.is-right button:last-of-type { visibility: visible; }
  .f-button { 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; -webkit-box-sizing: content-box; box-sizing: content-box; position: relative; margin: 0; padding: 0; color: #00ff7f; background: transparent; -webkit-box-shadow: none; box-shadow: none; pointer-events: all; cursor: pointer; -webkit-transition: var(--f-button-transition); transition: var(--f-button-transition); } }

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