.snackbar{position:fixed;bottom:20px;right:20px;z-index:9999;animation:fadeIn .6s ease,fadeOut .6s ease 2.7s}.snackbar-content{background-color:#4caf50;color:#fff;padding:16px 24px;border-radius:8px;box-shadow:0 2px 8px #0003;display:flex;align-items:center}.snackbar-success .snackbar-content{background-color:#4caf50}.snackbar-error .snackbar-content{background-color:red}.snackbar-info .snackbar-content{background-color:#2196f3}.snackbar-warning .snackbar-content{background-color:#ff9800}.snackbar-message{font-size:14px}@keyframes fadeIn{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translate(20px)}}*{margin:0;padding:0;font-family:Roboto,"sans-serif"}body.dark{background-color:#1c1c1c}body.no-scroll{overflow-y:hidden;position:fixed;height:100%;width:100%}footer{height:8vh;display:flex;align-items:center;justify-content:space-between;padding:0 10%;background-color:#3f3f3f}footer p{color:#fff;font-size:1.5rem}@media (min-width: 320px) and (max-width: 520px){footer{padding:0 2%}footer p{font-size:1.1rem}}.navbar{display:flex;justify-content:space-between;background-color:#1c1c1c;height:10svh;padding:0 5%}body.light .navbar{background-color:#fff;transition:background-color 1s ease}body.dark .navbar{transition:background-color 1s ease}.navbar-left{display:flex;align-items:center}.navbar-right{display:flex;align-items:center;width:50%}.logo{display:flex;align-items:center}.logo img{height:65px}.lang{display:flex;align-items:center;margin:0 20px}#langbtn{display:flex;align-items:center;cursor:pointer;background-color:#fff;border-radius:30px;color:#1c1c1c;height:45px;width:100px;padding:0 6px}body.light #langbtn{background-color:#1c1c1c;color:#f5f0e1;transition:background-color 1s ease}body.white #langbtn{transition:background-color 1s ease}.lang img{height:32px;margin-right:5px;margin-left:3px}.lang p{font-size:20px;font-weight:600;margin-left:4px;color:#1c1c1c}body.light .lang p{color:#fff}.color-switch{display:flex;align-items:center;margin:auto 0;height:45px;width:100px;border:2px solid #000000;background-color:#fff;border-radius:30px}body.light .color-switch{background-color:#1c1c1c;transition:background-color 1s ease}#colorbtn{height:36px;width:36px;border-radius:50%;background-color:#1c1c1c;margin-left:6px;cursor:pointer}body.light #colorbtn{background-color:#fff;transform:translate(150%);transition:transform 1s ease}body.dark #colorbtn{transform:translate(0);transition:transform 1s ease}.navbar ul{display:flex;list-style-type:none;align-items:center;justify-content:end;width:100%}.navbar ul.active{display:flex;position:fixed;flex-direction:column;justify-content:space-evenly;left:0;bottom:0;height:100vh;width:100vw;background-color:#fffffffd;transition:background-color 1s ease}body.dark .navbar ul.active{background-color:#1c1c1c}.navbar ul li{margin:0 5%}.navbar ul li a{text-decoration:none;color:#fff;font-weight:700;font-size:1.5rem}body.light .navbar ul li a{color:#1c1c1c}.navbar ul li a:hover{text-decoration:underline}.menu-brg{display:none;cursor:pointer}@media (max-width: 940px){.navbar ul{display:none}.navbar-right{justify-content:end}.menu-brg{display:initial;z-index:999}.menu-brg img{height:4vh}}@media (min-width: 320px) and (max-width: 440px){.menu-brg img{height:3vh}.color-switch{height:36px;width:70px}#colorbtn{height:26px;width:26px}body.light #colorbtn{transform:translate(140%)}#langbtn{height:40px;width:90px}.lang img{height:18px}.lang p{font-size:16px}.logo img{height:44px}}@media (max-height: 800px){.navbar ul li a{font-size:1rem}.menu-brg img{height:5vh}.color-switch{height:35px;width:80px}#colorbtn{height:26px;width:26px}body.light #colorbtn{transform:translate(160%)}.lang img{height:28px}.lang p{font-size:18px}.logo img{height:56px}}@media (max-height: 600px){.menu-brg img{height:6vh}.color-switch{height:35px;width:80px}#colorbtn{height:26px;width:26px}body.light #colorbtn{transform:translate(160%)}#langbtn{height:40px;width:90px}.lang img{height:24px}.lang p{font-size:18px}.logo img{height:50px}}@media (max-height: 500px){.menu-brg img{height:6vh}.color-switch{height:26px;width:70px}#colorbtn{height:22px;width:22px}body.light #colorbtn{transform:translate(170%)}#langbtn{height:30px;width:80px}.lang img{height:18px}.lang p{font-size:16px}.logo img{height:36px}}.main{display:flex;height:90svh}.left-side{display:flex;align-items:center;justify-content:center;width:50%;background-color:#3f3f3f}.photo{display:flex;align-items:center;justify-content:center;height:50%}.photo img{height:100%;width:100%;object-fit:cover;border-radius:50px}body.light .left-side{background-color:#1c1c1c;color:#fff;transition:background-color 1s ease}body.dark .left-side{transition:background-color 1s ease}.photo p{color:#000;font-size:24px;font-weight:700}.right-side{display:flex;width:50%;flex-direction:column;justify-content:center;padding:0 50px;color:#fff}body.light .right-side{background-color:#fff;color:#1c1c1c;transition:background-color 1s ease}body.dark .right-side{transition:background-color 1s ease}.right-side h1{font-size:5rem}.right-side p{font-style:italic;margin:100px 0;font-size:26px;max-width:90%}.right-side a{text-decoration:none}.btn{display:flex;background-color:#fff;color:#1c1c1c;border:2px solid #1E3D59;padding:15px 30px;font-size:28px;font-weight:700;border-radius:50px;text-decoration:none;width:220px;cursor:pointer;transition:background-color 1s ease}.btn span{font-size:30px;margin-left:10px}.btn:hover{background-color:#ffffffb9}body.light .btn:hover{background-color:#1c1c1c;color:#fff}@media (min-width: 1125px) and (max-width: 1380px){.right-side h1{font-size:4rem}.right-side p{margin:80px 0;font-size:24px;max-width:100%}}@media (min-width: 768px) and (max-width: 1125px){.main{flex-direction:column}.left-side{width:100%;height:50%}.photo{height:90%;width:50%}.right-side{padding:0;width:100%;height:50%;align-items:center;justify-content:space-evenly;overflow:hidden;text-align:center}.right-side h1{font-size:4rem}.right-side p{margin:0;font-size:24px;max-width:100%;padding:0 10px}}@media (min-width: 500px) and (max-width: 767px){.main{flex-direction:column}.left-side{width:100%;height:50%}.photo{height:90%;width:60%}.right-side{padding:0;width:100%;height:50%;align-items:center;justify-content:space-evenly;overflow:hidden;text-align:center}.right-side h1{font-size:3rem}.right-side p{margin:0;font-size:20px;max-width:100%;padding:0 10px}}@media (min-width: 320px) and (max-width: 499px){.main{flex-direction:column}.left-side{width:100%;height:50%}.photo{height:90%;width:90%}.right-side{padding:0;width:100%;height:50%;align-items:center;justify-content:space-evenly;overflow:hidden;text-align:center}.right-side h1{font-size:2.5rem}.right-side p{margin:0;font-size:16px;max-width:100%;padding:0 10px}}@media (max-height: 700px) and (max-width: 499px){.photo{height:90%;width:70%}.right-side{padding:0;width:100%;height:50%;align-items:center;justify-content:space-evenly;overflow:hidden;text-align:center}.right-side h1{font-size:2rem}.right-side p{margin:0;font-size:14px;max-width:100%;padding:0 10px}.btn{display:flex;align-items:center;padding:8px 30px;width:200px;font-size:24px}}.main-competences{margin:100px 0}body.light .main-competences{background-color:#fff;transition:background-color 1s ease}.description-compétences{display:flex;flex-direction:column;align-items:center;justify-content:center;height:30%;margin-bottom:50px}.description-compétences h1{font-size:7rem;margin:30px 0;color:#fff}body.light .description-compétences h1{color:#1c1c1c}.description-compétences p{font-size:24px;text-align:center;margin:0 10%;color:#fff}body.light .description-compétences p{color:#1c1c1c}.card-compétences{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;justify-items:center;align-items:center;height:70%;padding:0 20%}@media (min-width: 1500px) and (max-width: 2040px){.card-compétences{padding:0 10%}}@media (min-width: 1000px) and (max-width: 1499px){.card-compétences{padding:0 10%;grid-template-columns:repeat(3,1fr);height:80%}.description-compétences{height:20%}.description-compétences h1{font-size:5.5rem;margin:20px 0}.description-compétences p{font-size:20px;margin:0 5%}}@media (min-width: 700px) and (max-width: 999px){.card-compétences{padding:0 10%;grid-template-columns:repeat(2,1fr);height:80%}.description-compétences{height:20%}.description-compétences h1{font-size:5.5rem;margin:20px 0}.description-compétences p{font-size:20px;margin:0 5%}}@media (min-width: 500px) and (max-width: 699px){.card-compétences{padding:0 10%;grid-template-columns:repeat(2,1fr);height:92%}.description-compétences{height:8%}.description-compétences h1{font-size:3.5rem;margin:20px 0}.description-compétences p{font-size:14px;margin:0 5%}}@media (min-width: 320px) and (max-width: 499px){.card-compétences{padding:0 15%;grid-template-columns:repeat(1,1fr);height:92%}.description-compétences{height:8%;margin-bottom:20px}.description-compétences h1{font-size:3rem;margin:20px 0}.description-compétences p{font-size:12px;margin:0 5%}}.main-project{height:100vh}body.light .main-project{background-color:#fff}.project-title{display:flex;align-items:center;justify-content:center;height:20%}.project-title h1{font-size:6rem;margin:40px;color:#fff}body.light .project-title h1{color:#1c1c1c}.projets-container{display:flex;justify-content:center;height:80%;padding:0 10%;gap:0 5%}.projets{width:50%}.projet-image{position:relative;height:70%;display:flex;flex-direction:column;justify-content:center;align-items:center;border:2px solid gray}.projet-image img{height:100%;width:100%;object-fit:cover}.images-slides{display:flex;align-items:center;justify-content:space-between;position:absolute;width:100%}.images-slides button{height:40px;width:40px;border-radius:50%;border:2px solid gray;background-color:transparent;cursor:pointer;margin:0 10px}.images-slides i{color:#000}.images-slides button:hover{border:3px solid #000000}.dots{position:absolute;bottom:3%;left:50%;transform:translate(-50%);display:flex;gap:20px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.dots button{height:16px;width:16px;border-radius:50%;cursor:pointer;background-color:transparent;border:2px solid gray}button.active{background-color:#000}.projet-description{display:flex;flex-direction:column;align-items:center;justify-content:center;height:30%}.projet-description h2{font-style:italic;margin-bottom:20px;font-size:3rem;color:#fff}body.light .projet-description h2{color:#1c1c1c}.projet-description p{font-size:1.4rem;color:#ccc;text-align:center}body.light .projet-description p{color:#646464}@media (min-width: 2050px) and (max-width: 2300px){.projets-container{padding:0 5%;gap:0 5%}}@media (min-width: 1850px) and (max-width: 2049px){.projets-container{padding:0 2%;gap:0 2%}}@media (min-width: 1000px) and (max-width: 1849px){.main-project{height:auto}.project-title{height:10%;margin-bottom:20px}.projets-container{flex-direction:column;padding:0 2%;gap:0;height:90%}.projets{width:100%;height:45%}.projet-image{margin:0 10%}.projet-description{margin:40px 0}}@media (min-width: 400px) and (max-width: 999px){.main-project{height:auto}.project-title{height:10%;margin-bottom:20px}.projets-container{flex-direction:column;padding:0 2%;gap:0;height:90%}.projets{width:100%;height:45%}.projet-image{margin:0 2%}.projet-description{margin:40px 0}.projet-description p{max-width:90%;font-size:16px}}@media (min-width: 300px) and (max-width: 399px){.main-project{height:auto}.project-title{height:10%;margin-bottom:20px}.project-title h1{font-size:4rem}.projets-container{flex-direction:column;padding:0 2%;gap:0;height:90%}.projets{width:100%;height:45%}.projet-image{margin:0 2%}.projet-description{margin:40px 0}.projet-description p{max-width:90%;font-size:12px}}.comming-soon-container{display:flex;align-items:center;justify-content:center;padding:0 10%;margin:50px 0;gap:5%}body.light .comming-soon-container{background-color:#fff}.comming-soon-left{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;width:50%}.comming-soon-left h1{font-size:6rem;margin-bottom:30px;color:#fff}body.light .comming-soon-left h1{color:#1c1c1c}.comming-soon-left p{font-size:18px;font-style:italic;color:#ccc;text-align:center}body.light .comming-soon-left p{color:#646464}.comming-soon-right{display:flex;align-items:center;justify-content:center;width:50%}.comming-soon-right img{width:100%}@media (min-width: 1350px) and (max-width: 1700px){.comming-soon-left h1{font-size:5rem}}@media (min-width: 1100px) and (max-width: 1349px){.comming-soon-left h1{font-size:4rem}}@media (min-width: 700px) and (max-width: 1099px){.comming-soon-container{padding:0 5%}.comming-soon-left h1{font-size:3rem}}@media (min-width: 300px) and (max-width: 699px){.comming-soon-container{padding:0 2%;gap:30px;flex-direction:column}.comming-soon-left{width:100%}.comming-soon-left h1{font-size:2.5rem}.comming-soon-right{width:100%}.comming-soon-right img{width:60%;height:50%}}@media (max-width: 400px){.comming-soon-left p{font-size:14px}}.form-container{height:100svh;display:flex;align-items:center;justify-content:center;padding:20px 0}body.light .form-container{background-color:#fff}.contact-form{background-color:#cccccc1f;height:90%;width:50%;padding:20px;border-radius:10px}body.light .contact-form{background-color:#1c1c1c}.contact-form h2{text-align:center;font-size:2.5rem;margin-bottom:10px;color:#fff}.contact-form form{height:90%;display:flex;flex-direction:column;justify-content:space-evenly}.contact-form label{margin:8px 0;color:#fff}.contact-form input{height:7%;margin-bottom:5%;border-radius:5px;border:none;padding:0 10px;color:#000}#commentaire{height:15%;padding:10px;color:#000;margin-bottom:50px;border-radius:5px}.contact-form button{height:50px;color:#fff;font-size:1.2rem;background-color:#777;cursor:pointer}.contact-form button:hover{background-color:#777777af}@media (min-width: 1700px) and (max-width: 3000px){.contact-form{width:30%}}@media (min-width: 1000px) and (max-width: 1699px){.contact-form{width:50%}}@media (min-width: 400px) and (max-width: 999px){.contact-form{width:70%}}@media (min-width: 1px) and (max-width: 399px){.contact-form{width:80%}}.card{background-color:#fff;border-radius:20px;padding:5%;height:350px;width:80%;text-align:center}body.light .card{background-color:#1c1c1c;color:#fff;transition:background-color 1s ease}.card-image{width:80px}.progress-bar{background-color:#98df59;border-radius:10px;height:10px;margin:20px 0}.card-details{list-style:none;display:flex;flex-direction:column;align-items:center;justify-content:space-between;height:60%}.card-details li{font-size:20px;font-weight:700;color:#1c1c1c}body.light .card-details li{color:#fff}@media (min-width: 320px) and (max-width: 499px){.card{height:250px}.card-image{width:60px}.card-details{height:50%}.card-details li{font-size:16px}}
