:root{--speed: .5s}.menu{display:none;justify-content:space-between;align-items:center;padding:10px 20px}.logo1{height:6pc;border-radius:50%}.menu__list{display:flex;flex-direction:column;justify-content:center;align-items:center;list-style:none;margin:0;padding:0}.menu__item{margin:0 10px;font-weight:600;font-size:25px;color:#000;cursor:pointer}.menu__toggle{display:none;cursor:pointer}.menu__toggle span{display:block;width:45px;height:7px;border-radius:10px;margin-bottom:5px;background-color:#fff;transition:all .3s ease-in-out}.menu__list--open{display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#fffffff4;text-align:center;z-index:1;padding:10px;transition:var(--speed) ease}.social1{margin-left:1.3pc}.social-icon1{color:#000;font-size:2.2pc;margin-right:20px;cursor:pointer}.hide{opacity:0;visibility:hidden;transform:translateY(-20px);transition:var(--speed) ease}@media screen and (max-width: 700px){.menu{display:flex;flex-direction:column;align-items:flex-start}.menu__item{margin:10px 0}.menu__toggle{display:block}}@keyframes down{0%{height:10%}to{height:100%}}.down{animation-name:down;transition:.1s}.styyle{background-color:#ffffff54;border:2px solid #ffffff00;transition:.5s}.styyle:hover{border:2px solid #fff}.projects_animations{margin-top:4pc;height:20pc;width:1000px;display:flex;align-items:center;overflow-x:hidden;position:relative;pointer-events:none}.projects_animations:before,.projects_animations:after{content:"";position:absolute;top:0;width:100px;height:100%;z-index:2}.projects_animations:before{left:0;background:linear-gradient(to right,rgb(0,0,0),transparent)}.projects_animations:after{right:0;background:linear-gradient(to left,rgba(0,0,0),transparent)}@keyframes slideIn{0%{transform:translate(0)}to{transform:translate(-1180px)}}.images-div{display:flex;gap:15px;align-items:center;animation:slideIn 40s ease-in-out infinite;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;pointer-events:none}@font-face{font-family:Roboto;src:url(/assets/Roboto-Medium-BPszL6FQ.ttf) format("truetype")}*{font-family:Roboto,sans-serif}body{margin:0;padding:0;overflow-x:hidden;background-color:#000;color:#51bb73}.container{display:flex;align-items:center;justify-content:center;flex-direction:column;overflow-x:hidden;overflow-y:hidden}.header{background-color:#000;color:#fff;display:flex;flex-direction:column;align-items:center;width:700px;height:4pc;transition:1s;margin-top:30px;border-radius:70px;box-shadow:5px 5px 30px #ffffff42;position:fixed;top:0;z-index:1000}.header-side{width:100%;display:flex;align-items:center;gap:60px;margin-left:8pc;margin-top:-16px}.li-contact{background-color:#fff;padding:10px 20px;color:#000;border-radius:30px;border:2px solid rgb(255,255,255)}.li-contact:hover{background-color:#000;border:2px solid rgb(204,162,83)}.menuToggle{width:100vw;visibility:hidden;z-index:1}.logo{margin-left:-3.5pc;margin-top:17px;height:4pc;border-radius:50%;cursor:pointer}.a-logo{height:6pc;width:6pc;border-radius:50%}ul{list-style:none;display:flex;gap:30px;font-size:19px}.li{cursor:pointer;transition:1s}.li:hover{color:#cca253}.section{display:flex;align-items:center;gap:5pc}.social-icon{font-size:23px;margin-right:20px;cursor:pointer}@media only screen and (min-width: 1125px){.project{border-radius:20px;height:22pc;width:27pc}}@media only screen and (max-width: 1125px){.project{border-radius:20px;height:22pc;width:27pc}.h1-home{font-size:50px}}@media only screen and (max-width: 435px){.project{width:22.7pc}.site{height:14pc}.desc{flex-direction:column;gap:1.5pc;text-align:center}.submit-btn{margin-left:0%}form{width:90%}}@media only screen and (max-width: 588px){.ul-footer{display:flex;flex-direction:column}.sec2{display:flex;flex-direction:column;align-items:center}.h1-home{font-size:26px}}@media only screen and (max-width: 700px){.section{display:none}.menuToggle{visibility:visible}.header{width:100%;min-height:6pc;border-radius:0%;background-color:#000;color:#fff;display:flex;flex-direction:column;justify-content:space-between;align-items:center;height:6pc;transition:1s;box-shadow:5px 5px 30px #00000042;position:relative}.header-side{width:100%;display:flex;justify-content:space-between;align-items:center}.logo{margin-left:-3pc}.menu{margin-right:5pc}}.section1 .transition{display:block;opacity:0}.home{margin-top:5pc;display:flex;flex-direction:column;align-items:center;text-align:center;margin-bottom:9pc}h1{color:#fff;font-size:70px}.contact-btn{padding:10px 20px;font-size:15px;font-weight:600;border-radius:20px;border:2px solid rgb(255,255,255);background-color:#000;color:#fff;cursor:pointer;transition:1s}.contact-btn:hover{color:#000;background-color:#fff}.pers-img{height:8pc;width:8pc;border-radius:50%;background-image:url(/assets/personal-BtkMPIAy.jpg);background-position:center;background-size:cover}.aboutme{width:100vw;margin-bottom:9pc}.sides{width:100%;display:flex;justify-content:space-around}.title{display:flex;flex-direction:column;align-items:center;color:#fff;text-align:center;margin-bottom:5pc;width:100%}h2{font-size:37px;font-weight:100;letter-spacing:4px}.underline{background-color:#cca253;margin-top:-25px;height:4px;width:20px;border-radius:10px}.about-desc{max-width:35pc;color:#949697}h3{font-size:27px;color:#fff}.description{font-size:20px;color:#e4e4e4;max-width:40pc}span{color:#cca253;font-weight:900}.side2{color:#fff}.skill-icon{font-size:clamp(3pc,1pc + 5vw,5pc);margin-right:3pc;margin-bottom:3pc}.porto{max-width:100%;display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:3pc;transition:1s}.project{border-radius:20px;max-height:22pc;max-width:27pc;margin-bottom:12pc}.site{background-color:#649e9e;max-height:16.5pc;max-width:100%;overflow:hidden;border-radius:20px;border:none;transition:1s}.desc{display:flex;align-items:center;justify-content:space-between;padding:1pc;transition:1s}.site-name,.tools{margin-bottom:-.8pc;font-size:21px;font-weight:100;color:#fff;position:relative;bottom:.4pc;transition:1s}.tools{font-weight:100;font-size:18px;color:#9e9e9e;transition:1s}.cercle{color:#fff;font-size:14px;position:relative;bottom:2px;color:#9e9e9e}.a{color:#fff;text-decoration:none;border:2px solid white;padding:10px 20px;border-radius:20px;font-weight:600;letter-spacing:1px;position:relative;top:8px;transition:1s}.a:hover{background-color:#fff;color:#000}.arrow-icon{font-size:15px}.web-img{width:100%;cursor:pointer;transition:15s}.web-img1{height:60pc}.web-img1:hover{transform:translateY(-43pc)}.web-img2{height:150pc}.web-img2:hover{transform:translateY(-133pc)}.web-img3{height:120pc}.web-img3:hover{transform:translateY(-103.5pc)}.web-img4{height:83pc}.web-img4:hover{transform:translateY(-66.5pc)}.web-img5{position:relative;height:100pc}.web-img5:hover{transform:translateY(-83pc)}.web-img6:hover{transform:translateY(-93.8pc)}.contact{margin-top:9pc;width:100vw}form{height:30pc;min-width:60%;background-color:#fff;text-align:start;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:2pc;border-radius:20px;margin-top:5pc;margin-bottom:9pc}.input{width:100%;margin-left:30%}label{color:#292929;font-weight:600;letter-spacing:2px}input{height:2.3pc;width:70%;margin-top:6px;border-radius:5px;border:2px solid #ccc;font-size:13px;font-weight:600;text-indent:20px;letter-spacing:1px}textarea{margin-top:6px;font-weight:600;width:71.4%;height:150px;padding:10px 20px;box-sizing:border-box;border:2px solid #ccc;border-radius:4px;font-size:13px;letter-spacing:1px;resize:none}.submit-btn{padding:10px 20px;font-size:15px;font-weight:100;background-color:#000;border:2px solid;color:#fff;border-radius:20px;transition:1s;cursor:pointer;margin-top:-1.5pc}.submit-btn:hover{background-color:#fff;color:#000}footer{display:flex;flex-direction:column;align-items:center;background-color:#0a0a0a;width:100%;min-height:16pc}.sec1{padding-top:1pc;display:flex;align-items:center;justify-content:space-between;width:80%}.ul-footer{color:#f0f8ff}.sec2{width:82%;display:flex;justify-content:space-between;color:#fff;border-top:2px solid;margin-top:3pc;padding-top:1pc;padding-bottom:2pc}.a1{text-decoration:none;color:#cca253}.social-icon{color:#fff}.pricing-container{width:100%;display:flex;flex-direction:row;gap:30px}@media only screen and (max-width: 860px){.sides{display:flex;flex-direction:column;text-align:center;align-items:center}.skills{display:flex;flex-direction:row}.skill-icon{margin-right:0;margin-bottom:0}.pricing-container{flex-direction:column}}