*{padding:0;margin:0;font-family:Ubuntu,sans-serif}::-webkit-scrollbar{width:7px}::-webkit-scrollbar-track{background:none}::-webkit-scrollbar-thumb{background:#292929;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#555}.line{width:60%;margin-left:20%;height:2px;background-color:#000}.home .container{width:100%;height:93.5vh;min-height:700px;display:flex;align-items:center;justify-content:center;position:relative}.home .container h1{font-size:130px;display:flex;justify-content:center}.home .container h3{font-size:25px;display:flex;justify-content:center}.home .container .title{width:80%;height:100%;flex-direction:column}.home .container .title .button-container{width:100%;padding-top:25px;display:flex;justify-content:center}.home .container .title .button-container button{font-weight:700;padding:5px;background-color:#fff;border:3px solid black;border-radius:20px;width:260px;transition:.2s;font-size:15px;cursor:pointer}.home .container .title .button-container button:hover{background-color:#000;color:#fff;transition:.2s}.home .container .title .skills{height:auto;width:100%;display:flex;justify-content:center;align-items:center;overflow-x:hidden;padding-top:100px}.home .container .title .skills .skills-inner{width:80%;max-width:500px;height:100px;overflow:hidden;display:flex;align-items:center}.home .container .title .skills .skills-inner .skills-slide{display:flex;align-items:center;animation:30s slide infinite linear}.home .container .title .skills .skills-inner .skills-slide img{max-height:80px;padding:5px;width:80px;animation:bounce infinite}.home .container .title .project-button{width:100%;height:50px;display:flex;justify-content:center;position:absolute;bottom:40px;left:0;right:0}.home .container .title .project-button .down-arrow{font-size:25px;animation:3s arrow infinite}.home .container .title .project-button .project-container{border:none;background:none;display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:700;transition:.2s;font-size:20px;cursor:pointer}.home .container .title .project-button .project-container:hover{font-size:25px;transition:.2s}@media (max-width: 800px){.home .container h1{font-size:90px}.home .container h3{font-size:20px}.home .container .title .button-container button{width:190px}}@media (max-width: 450px){.home .container h1{font-size:70px}.home .container h3{font-size:15px}}@media (max-width: 360px){.home .container h1{font-size:50px}.home .container h3{font-size:12px}}@keyframes arrow{0%{transform:translateY(0)}50%{transform:translateY(10px)}to{transform:translateY(0)}}@keyframes bounce{0%{transform:translateY(0)}40%{transform:translateY(0) rotate(0)}45%{transform:translateY(-2px) rotate(-2deg)}50%{transform:translateY(-5px) rotate(0)}55%{transform:translateY(0) rotate(4deg)}58%{transform:translateY(0) rotate(0)}to{transform:translateY(0)}}@keyframes slide{0%{transform:translate(-100%)}to{transform:translate(100%)}}.portfolio .container{width:100%;padding-top:50px;padding-bottom:50px;height:auto;display:flex;justify-content:center;align-items:center}.portfolio .container .grid-container{display:grid;gap:50px 50px;grid-template-columns:auto auto auto}@media (max-width: 1280px){.portfolio .container .grid-container{grid-template-columns:auto auto}}@media (max-width: 700px){.portfolio .container .grid-container{grid-template-columns:auto;padding:0;gap:50px 0}}.grid-item{background-color:#fff;border:2px solid rgb(0,0,0);width:320px;height:169px;padding:5px;border-radius:10px;position:relative;transition:transform .3s ease;z-index:5}.grid-item:hover{transform:scale(1.4);z-index:20;cursor:pointer;box-shadow:5px 5px 10px 5px #0003;transition:.3s ease}.grid-item img{width:100%;height:100%;object-fit:cover;border-radius:5px}.grid-item .overlay-text{position:absolute;left:25%;bottom:-20px;width:150px;background-color:#000;border-radius:5px;color:#fff;font-size:16px;padding:8px;text-align:center}@media (max-width: 1550px){.grid-item:hover{transform:scale(1.2)}}@media (max-width: 450px){.grid-item:hover{transform:scale(1)}}@media (max-width: 350px){.grid-item{width:210px}}.about{display:flex;justify-content:center}.about .container{max-width:1000px;width:60%;padding:50px;height:auto;display:grid;justify-content:center;grid-template-columns:30% auto;gap:40px}.about .container .avatar-container{display:flex;align-items:center;flex-direction:column}.about .container .avatar-container span{padding:10px;font-size:25px}.about .container .avatar-container img{width:100%;max-width:200px}.about .container .about-me-container{display:flex;align-items:center}.about .container .about-me-container .about-me{display:flex;flex-direction:column;align-items:center}.about .container .about-me-container .about-me span{width:auto;font-size:23px}.about .container .about-me-container .about-me button{margin:20px;background:none;border:none;font-size:15px;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:5px}.about .container .about-me-container .about-me button .react-icon{font-size:20px}@media (max-width: 1050px){.about .container{grid-template-columns:100%;grid-template-rows:auto auto}.about .container .avatar-container{display:flex;align-items:center;justify-content:center}.about .container .avatar-container img{width:100%;max-width:200px}.about .container .about-me{display:flex;align-items:center;justify-content:center;grid-template-rows:auto}}.contact .container{display:flex;justify-content:center;height:auto;width:100%;padding-bottom:50px}.contact .container .inner-container{display:grid;justify-content:center;padding-top:100px;grid-template-columns:30% 40%;width:100%;max-width:1100px;gap:10px}@media (max-width: 1050px){.contact .container .inner-container{grid-template-columns:60%}}.footer .container{width:100%;height:250px;display:flex;justify-content:center;align-items:center;background-color:#000;color:#fff}.modal-container{border-radius:20px;border:none;background-color:#fff;top:50%;left:50%;transform:translate(-50%,-50%);position:fixed;z-index:1000;max-width:800px;width:90%;height:95vh;animation:modalDrop .5s}.modal-container .close-container{background-color:#000;width:100%;height:40px;display:flex;justify-content:flex-end;border-radius:10px 10px 0 0}.modal-container .close-container .close-button{background:none;border:none;color:#fff;padding:0 20px 0 0;font-weight:700;font-size:20px}.modal-container .inner-container{display:flex;flex-direction:column;margin-top:5px;padding:30px;width:calc(100% - 65px);height:calc(100% - 120px);overflow-y:auto;overflow-x:hidden}.modal-container .inner-container .main-image{display:flex;max-width:100%;max-height:370px;border-radius:10px;border:2px solid black;background-color:#000;object-fit:contain}.modal-container .inner-container .image-grid{padding:20px 0;width:98%;min-height:95px;overflow-x:scroll;overflow-y:hidden;display:flex;flex-direction:row}.modal-container .inner-container .image-grid img{max-width:150px;width:400px;height:77px;border-radius:10px;border:3px solid black;margin-right:15px;transition:.3s;object-fit:contain;background-color:#000}.modal-container .inner-container .image-grid img:hover{transition:.3s;border:3px solid #ae00ff}.modal-container .inner-container .image-grid img.selected-image{border:3px solid #ae00ff}.modal-container .inner-container .code-demo-container{padding-top:15px;display:flex;height:65px;width:300px}.modal-container .inner-container .code-demo-container .code-button{background-color:#ae00ff;display:flex;justify-content:center;align-items:center;border:none;border-radius:5px;height:40px;width:130px;transition:.5s}.modal-container .inner-container .code-demo-container .code-button .button-content{display:flex;align-items:center;gap:5px}.modal-container .inner-container .code-demo-container .code-button:hover{background-color:#bc2bff;transition:.5s}.modal-container .inner-container .code-demo-container .code-button a{text-decoration:none;color:#fff}.modal-container .inner-container .code-demo-container .demo-button{background-color:#000;display:flex;justify-content:center;align-items:center;border:none;border-radius:5px;margin-left:10px;height:40px;width:120px;transition:.5s}.modal-container .inner-container .code-demo-container .demo-button .button-content{display:flex;align-items:center;gap:5px}.modal-container .inner-container .code-demo-container .demo-button a{color:#fff;text-decoration:none}.modal-container .inner-container .code-demo-container .demo-button:hover{background-color:#212121;transition:.5s}.modal-container .inner-container .description,.modal-container .inner-container .technologies{padding-top:20px}.modal-gray-background{position:fixed;background-color:#000000b3;top:0;left:0;right:0;bottom:0;z-index:999;animation:fadeIn .5s}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalDrop{0%{transform:translate(-50%,-150%)}to{transform:translate(-50%,-50%)}}.emailjs .form{display:grid;grid-template-columns:auto;gap:10px}.emailjs .form .small-input{border:2px solid black;border-radius:5px;width:100%;padding:10px}.emailjs .form .message{border:2px solid black;border-radius:5px;padding:10px;width:100%;height:300px;resize:none}.emailjs .form .button{background:none;font-weight:700;margin-left:auto;font-size:16px;transition:.3s;border:2px solid black;border-radius:5px;padding:10px}.emailjs .form .button:hover{border:2px solid transparent;transition:.3s}.socials ul .float-right{display:flex;align-items:center;float:right}.socials ul .float-right a{padding:20px 15px 15px 5px;display:block;color:#000;text-decoration:none}.socials ul{list-style-type:none;margin:0;padding:0;overflow:hidden}.socials ul .float-left{display:flex;align-items:center;float:left}.socials ul .float-left a{padding:20px 15px 15px 5px;display:block;color:#000;text-decoration:none}