body{margin:0;padding:0;background-color:#212121}canvas{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1}.particles{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;pointer-events:none}p,div,a{font-family:var(--font-text);color:#c5c4c4;margin:0}h1,h2,h3,h4,h5{font-family:var(--font-title);margin:0}button{font-family:var(--font-title);text-transform:uppercase;font-size:1.2rem}.title{color:#b5b5b5;font-family:var(--font-title);text-transform:uppercase;font-size:5rem}.no-scroll{overflow:hidden;height:100vh}header .burger{width:30px;height:15px;position:fixed;right:50px;top:50px;cursor:pointer;z-index:11;display:flex;flex-direction:column;justify-content:space-between}header .burger .lines{display:block;height:3px;width:100%;background-color:#dedede;border-radius:2px;transition:all .3s ease;transform-origin:center}header .burger .lines:first-child{transform:translateY(0)}header .burger .lines:last-child{transform:translateY(0)}header input#openMenu{display:none}header #openMenu:checked~.burger .lines:first-child{transform:translateY(6px) rotate(45deg)}header #openMenu:checked~.burger .lines:last-child{transform:translateY(-6px) rotate(-45deg)}header nav{position:fixed;top:0;right:-100%;height:100vh;width:25vw;background-color:#303030;z-index:10;transition:right .3s ease;padding:2rem;color:#fff;display:flex;flex-direction:column;justify-content:center;padding:0 5vw}header nav .navigation{display:flex;justify-content:space-between}header nav .navigation .right .items *,header nav .navigation .left .items *{font-size:1.25rem;font-weight:700;text-decoration:none}header nav .navigation .right .items,header nav .navigation .left .items{display:flex;flex-direction:column;gap:1rem}header nav .navigation .right p,header nav .navigation .left p{margin-bottom:2rem}header nav .navigation .right a:hover:before{width:13px;height:13px}header nav .navigation .right a:before{content:"";display:inline-block;height:10px;width:10px;background-color:#01a7f3;border-radius:100%;vertical-align:middle;margin-right:15px}header nav .contact{position:absolute;bottom:100px}header nav .contact p{margin-bottom:1rem}header nav .contact a{text-decoration:none;font-weight:700}header .overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#00000080;z-index:5;opacity:0;pointer-events:none;transition:opacity .3s ease}header #openMenu:checked~.overlay{opacity:1;pointer-events:all}header #openMenu:checked~nav{right:0}@media screen and (max-width: 992px){header nav{width:50vw}}@media screen and (max-width: 768px){header nav{width:100vw;padding:0}header .wrapper{padding:0 5vw}}footer{margin:0 10vw}.mail{position:fixed;left:15px;top:75vh;transform:rotate(90deg);transform-origin:left bottom}.mail a{text-decoration:none;color:#b5b5b5}section{padding-bottom:250px}section.entry{height:100vh;max-height:100vh;position:relative}section.entry .container{display:flex;align-items:center}section.entry .container .entry-content .title{margin-bottom:50px}section.entry .container .entry-content .title span{display:block;line-height:1}section.entry .container .entry-content .title span:first-child{color:#01a7f3}section.entry .container .entry-content .title span:last-child{margin-left:20px}section.entry .container .entry-content .text{margin-bottom:50px}section.entry .container .entry-content .text p:last-of-type{margin-bottom:0}section.entry .container .entry-content button a{text-decoration:none;font-family:var(--font-title);color:#212121;padding:15px}section.entry .container .informations{position:absolute;right:50px;bottom:25vh;display:flex;flex-direction:column;gap:2rem}section.entry .container .informations .item{display:flex;flex-direction:column;align-items:end}section.entry .container .informations .item .number{color:#01a7f3;font-family:var(--font-title);font-size:2.25rem}section.about h2{font-size:3.75rem;font-family:var(--font-text);font-weight:lighter;margin-bottom:5rem}section.about .separateur{padding-bottom:1rem;border-bottom:1px solid #3c3c3c}section.about .about-me{display:grid;grid-template-columns:40% 60%;margin-top:1rem}section.about .about-me .prenom{font-size:3rem;margin:0}section.about .about-me .description{display:flex;flex-direction:column;gap:1rem}section.about .about-me .description *{line-height:1.75rem}section.stacks .titre-section p{display:flex;align-items:center;gap:10px}section.stacks .category{display:grid;grid-template-columns:40% 60%}section.stacks .category:not(:first-child){margin-top:5rem}section.stacks .category h3{font-size:3rem;font-weight:400}section.stacks .category .stack{display:flex;flex-wrap:wrap;column-gap:2.25rem;row-gap:2.25rem}section.stacks .category .stack div{display:flex;justify-content:center;align-items:center;gap:1rem;font-size:1.5rem;line-height:2rem}section.experiences .titre-section{margin-bottom:3.5rem}section.experiences .titre-section p{display:flex;align-items:center;gap:1rem}section.experiences .experience{margin-bottom:3.5rem}section.experiences .experience .date,section.experiences .experience .entreprise{font-size:1.25rem;line-height:1.75rem}section.experiences .experience .poste{color:#01a7f3;font-size:3rem;line-height:1;font-family:var(--font-title);text-transform:uppercase;margin:1rem 0}section.projets img{width:350px;height:450px;object-fit:contain;position:absolute;right:0;opacity:0;top:-80px;transition:all .6s cubic-bezier(.25,.46,.45,.94);transform:translate(30px) scale(.9);filter:blur(8px);z-index:5}section.projets img.visible{animation:breathe 4s ease-in-out infinite}section.projets .content:hover+img{opacity:1;transform:translate(0) scale(1);filter:blur(0px)}section.projets .titre-section{margin-bottom:3.5rem}section.projets .titre-section p{display:flex;align-items:center;gap:10px}section.projets .listing-projets:hover .projet{opacity:.5}section.projets .listing-projets:hover .projet:hover{opacity:1}section.projets .listing-projets .projet{transition:opacity .3s ease;border-bottom:1px solid #3c3c3c;padding-bottom:1.25rem;display:flex;gap:1rem;position:relative}section.projets .listing-projets .projet:hover{opacity:1}section.projets .listing-projets .projet:hover .content{transform:translate(10px);transition:transform .4s cubic-bezier(.25,.46,.45,.94)}section.projets .listing-projets .projet .number{padding-top:1rem;font-family:var(--font-title);transition:color .3s ease}.projet:hover section.projets .listing-projets .projet .number{color:#01a7f3}section.projets .listing-projets .projet .content{transition:transform .4s cubic-bezier(.25,.46,.45,.94)}section.projets .listing-projets .projet .nom-projet{font-family:var(--font-title);text-transform:uppercase;font-size:3.75rem;background:linear-gradient(to right,#01a7f3 50%,#c5c4c4 50%);background-size:200% 100%;background-position:100% 0;-webkit-background-clip:text;-webkit-text-fill-color:transparent;transition:background-position 1s cubic-bezier(.25,.46,.45,.94);text-decoration:none}section.projets .listing-projets .projet .nom-projet:hover{background-position:0 0}section.projets .listing-projets .projet .stacks span{position:relative;margin-right:10px;transition:all .3s ease}section.projets .listing-projets .projet .stacks span:not(:last-child):after{content:"";display:inline-block;height:5px;width:5px;background-color:#01a7f3;border-radius:100%;margin-left:10px;vertical-align:middle;transition:all .3s ease}.projet:hover section.projets .listing-projets .projet .stacks span{transform:translateY(-2px);color:#c5c4c4}.projet:hover section.projets .listing-projets .projet .stacks span:not(:last-child):after{transform:scale(1.2);box-shadow:0 0 8px #01a7f3}@keyframes breathe{0%,to{transform:translate(0) scale(1)}50%{transform:translate(0) scale(1.02)}}footer{padding:0 0 25px;display:flex;flex-direction:column;align-items:center;gap:1.5rem}footer a{font-family:var(--font-title);text-transform:none;text-decoration:none;color:#c5c4c4;font-size:2.25rem}footer .copy{font-size:.8rem}@media screen and (max-width: 1780px){section.about .about-me .description{max-width:100%}}@media screen and (max-width: 1450px){.mail{top:60vh}section.entry .container .informations{bottom:40vh}section.about h2{font-size:2.5rem;margin-bottom:5rem}section.about .about-me .prenom{font-size:2.5rem}section.about .about-me .description{max-width:100%}section.stacks .category{grid-template-columns:30% 70%}section.projets img{width:250px;height:350px;right:-100px;object-fit:contain;background-color:transparent}}@media screen and (max-width: 992px){section{padding-bottom:150px}.mail{top:70vh}section.entry .container .informations{bottom:20vh}section.about h2{font-size:2rem;margin-bottom:2rem}section.about .about-me{grid-template-columns:30% 70%;margin-top:2.25rem}section.about .about-me .prenom{font-size:1.75rem}section.about .about-me .description{max-width:45vw}section.stacks .category{gap:0;grid-template-columns:30% 70%}section.stacks .category h3{font-size:2rem}section.stacks .category .stack div{font-size:1rem}section.experiences .experience .poste{font-size:2rem}section.experiences .experience .entreprise,section.experiences .experience .date{font-size:1rem}section.projets .listing-projets .projet .nom-projet{font-size:2.75rem}section.projets img{display:none}footer a{font-size:2.25rem}.mail{display:initial}}@media screen and (max-width: 576px){section.entry .container{flex-direction:column;justify-content:center}section.entry .container .entry-content{margin-bottom:50px}section.entry .container h1{font-size:3rem}section.entry .container .informations{flex-direction:row;position:initial}section.entry .container .informations .item{align-items:initial}section.about h2{font-size:1.5rem;margin-bottom:2rem}section.about .about-me{grid-template-columns:1fr;gap:25px;margin-top:25px}section.about .about-me .prenom{font-size:1.5rem}section.about .about-me .description{max-width:100%}section.stacks .category{gap:25px;grid-template-columns:1fr}section.stacks .category h3{font-size:1.5rem}section.stacks .category .stack div{font-size:1rem}section.experiences .experience .poste{font-size:1.5rem}section.projets .listing-projets .projet .nom-projet{font-size:2rem}section.projets .listing-projets .projet .stacks span{font-size:.8rem}footer a{font-size:1.5rem}.mail{display:none}}ul.description li{margin-bottom:.5rem}article{margin-top:20vh}article ul li:not(:last-child){margin-bottom:1rem}article .back{display:flex;align-items:center;gap:10px;text-decoration:none;margin-bottom:2rem}article h1{font-size:2.25rem;margin-bottom:2.25rem}article .year,article .stack,article .description,article .role,article .interventions{margin-bottom:1.75rem}article .titre-content{margin-bottom:.75rem;font-family:var(--font-title);font-size:1rem;font-weight:400}.imgs{display:grid;grid-template-areas:". ." "full full";gap:1.75rem;margin-top:4rem}.imgs img{width:100%;height:100%;object-fit:cover}.imgs .full{grid-area:full}.loader{padding-bottom:0;position:absolute;top:0;left:0;width:100%;height:100vh;z-index:9999;overflow:hidden;background:#212121;animation:fadeOutLoader 1s ease forwards;animation-delay:3.4s}.loader .grid{grid-template-columns:repeat(6,minmax(0,1fr));border:none}.loader .rectangle{background-color:#000;height:100vh;animation:dropDown .5s ease-in forwards;animation-delay:2s;border:none}.loader .rectangle[data-index="0"]{animation-delay:2s;border:none}.loader .rectangle[data-index="1"]{animation-delay:2.1s;border:none}.loader .rectangle[data-index="2"]{animation-delay:2.2s;border:none}.loader .rectangle[data-index="3"]{animation-delay:2.3s;border:none}.loader .rectangle[data-index="4"]{animation-delay:2.4s;border:none}.loader .rectangle[data-index="5"]{animation-delay:2.5s;border:none}.loader .name{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:120px;line-height:1;text-align:center;overflow:hidden;z-index:10}.loader .name span{display:block;transform:translateY(100%);opacity:0;color:#dedede;font-family:var(--font-title);animation:slideIn 1s ease forwards,fadeOutText .5s ease forwards;animation-delay:.2s,2.1s}.loader .name span:nth-child(2){animation-delay:.6s,2.4s}@keyframes slideIn{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes fadeOutText{0%{opacity:1}to{opacity:0}}@keyframes dropDown{0%{transform:translateY(0);height:100vh}to{transform:translateY(100vh);height:0}}@keyframes fadeOutLoader{0%{opacity:1;visibility:visible}to{opacity:0;visibility:hidden;pointer-events:none}}@media screen and (max-width: 768px){.loader .name{font-size:60px}}button{background-color:#01a7f3;border:none;padding:15px;color:#212121}.base{display:grid;grid-template-columns:[gutter-l] minmax(25px,7.5%) [container] 1fr [gutter-r] minmax(25px,7.5%)}@media (min-width: 768px){.base{grid-template-columns:[gutter-l] 20vw [container] 1fr [gutter-r] 20vw}}.container,.container-semi-l,.container-semi-r{grid-column:container}.container-full{grid-column:1/4}.grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:minmax(0,auto);width:100%}.col-1{grid-column:span 1}.col-2{grid-column:span 2}.col-3{grid-column:span 3}.col-4{grid-column:span 4}.col-5{grid-column:span 5}.col-6{grid-column:span 6}.col-7{grid-column:span 7}.col-8{grid-column:span 8}.col-9{grid-column:span 9}.col-10{grid-column:span 10}.col-11{grid-column:span 11}.col-12{grid-column:span 12}@font-face{font-family:Roboto;src:url(/fonts/Roboto-Regular.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Roboto;src:url(/fonts/Roboto-Medium.ttf) format("truetype");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:Roboto;src:url(/fonts/Roboto-Light.ttf) format("truetype");font-weight:200;font-style:normal;font-display:swap}@font-face{font-family:Anton;src:url(/fonts/Anton.ttf) format("truetype");font-style:normal;font-display:swap}:root{--font-text: "Roboto", sans-serif;--font-title: "Anton", sans-serif}
