/* Project filter */
.project-filter {display: flex; justify-content: center; align-items: center; list-style-type: none; margin: 50px 0;}
.project-filter li {cursor: pointer; font-weight: 700; font-size: 18px;}
.project-filter li.active {color: #E5007D;}
.project-filter li:not(:last-of-type):after {content: '/'; margin: 0 10px; color: #303030!important;}

/* Archive projects */
.listing-projects {display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
.listing-projects article {width: 24.25%; margin: 0.5%;}
.listing-projects article:nth-child(4n+1) {margin-left: 0;}
.listing-projects article:nth-child(4n) {margin-right: 0;}
.listing-projects article a {width: 100%; height: 20vw; position: relative; display: flex; justify-content: center; align-items: center; overflow: hidden;}
.listing-projects article img {position: absolute; object-fit: cover; height: 100%; z-index: 0; transition: all ease-out 0.6s;}
.listing-projects article .post-infos {background: #ffffffe6; opacity: 0; transition: all ease-out 0.3s; width: 90%; height: 90%; display: flex; justify-content: center; align-items: center; transform: translateY(5%);}
.listing-projects article h2 {text-align: center; font-size: 18px; font-weight: 700; color: #303030; margin-bottom: 0;}
.listing-projects article a:hover {text-decoration: none;}
.listing-projects article a:hover img {transform: scale(1.1);}
.listing-projects article a:hover .post-infos {opacity: 1; transform: translateY(0);}