@keyframes blink{0%{opacity:0}25%{opacity:.7}50%{opacity:1}75%{opacity:.7}to{opacity:0}}.star1{position:absolute;top:80%;left:70%}.star1 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.5s;display:block}.star2{position:absolute;top:78%;left:40%}.star2 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.6s;display:block}.star3{position:absolute;top:32%;left:70%}.star3 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.8s;display:block}.star4{position:absolute;top:9%;left:36%}.star4 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.3s;display:block}.star5{position:absolute;top:3%;left:68%}.star5 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.1s;display:block}.star6{position:absolute;top:40%;left:42%}.star6 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.9s;display:block}.star7{position:absolute;top:40%;left:20%}.star7 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.6s;display:block}.star8{position:absolute;top:7%;left:9%}.star8 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.9s;display:block}.star9{position:absolute;top:13%;left:65%}.star9 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.7s;display:block}.star10{position:absolute;top:40%;left:77%}.star10 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.1s;display:block}.star11{position:absolute;top:3%;left:25%}.star11 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.1s;display:block}.star12{position:absolute;top:15%;left:79%}.star12 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.1s;display:block}.star13{position:absolute;top:35%;left:47%}.star13 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.4s;display:block}.star14{position:absolute;top:30%;left:80%}.star14 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.3s;display:block}.star15{position:absolute;top:70%;left:50%}.star15 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1s;display:block}.star16{position:absolute;top:73%;left:11%}.star16 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.56s;display:block}.star17{position:absolute;top:62%;left:80%}.star17 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.8s;display:block}.star18{position:absolute;top:60%;left:40%}.star18 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.4s;display:block}.star19{position:absolute;top:52%;left:20%}.star19 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.7s;display:block}.alert{padding:20px;width:300px;background-color:#f44336;color:#fff;position:absolute;top:0;left:50%;transform:translate(-50%);z-index:2}.closebtn{margin-left:15px;color:#fff;font-weight:700;float:right;font-size:22px;line-height:20px;cursor:pointer;transition:.3s}.closebtn:hover{color:#000}.skills-section h2{margin:auto 0;font-size:2rem}.skills{display:flex;flex-direction:row;justify-content:center;gap:20px}h4{color:#fff;font-size:1.1rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;margin:0 auto;width:100px;text-align:center;height:50px}.stack-icon{width:auto;height:20px;margin-left:5px}.front-end{list-style:none;color:#000;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;display:flex;flex-direction:column;width:100px;margin:50px 0;padding:0}.front-end .list{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center;gap:20px}@supports not (gap: 20px){.front-end .list>*:not(:last-child){margin-bottom:20px}}.front-end .list li{border:2px solid white;width:100px;height:40px;font-size:.8rem;display:flex;flex-direction:row;justify-content:center;align-items:center}.front-end .list .html{background-color:orange;border:2px solid rgb(255,213,150)}.front-end .list .typescript{background-color:#269dff;border:2px solid rgb(255,213,150)}.front-end .list .react{background-color:#91ceff;border:2px solid rgb(255,213,150)}.front-end .list .css3{background-color:#005fac;border:2px solid rgb(255,213,150)}.front-end .list .vite{background-color:#f8ff27;border:2px solid rgb(255,213,150)}.front-end .list .sass{background-color:#ed8aff;border:2px solid rgb(255,213,150)}.front-end .list .javascript{background-color:#fcff67;border:2px solid rgb(255,213,150)}.front-end .list .node{background-color:#82ff8a;border:2px solid rgb(255,213,150)}.back-end{list-style:none;color:#000;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;display:flex;flex-direction:column;width:100px;margin:50px 0;padding:0}.back-end .list{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center;gap:20px}@supports not (gap: 20px){.back-end .list>*:not(:last-child){margin-bottom:20px}}.back-end .list li{border:2px solid white;width:100px;height:40px;font-size:.7rem;display:flex;flex-direction:row;justify-content:center;align-items:center}.back-end .list .express{background-color:#fff;border:2px solid rgb(0,0,0)}.back-end .list .digitalOcean{background-color:#4000ff;border:2px solid rgb(255,255,255)}.back-end .list .mySql{background-color:#fff;border:2px solid rgb(0,21,255)}.back-end .list .mongoDB{background-color:#73ff27;border:2px solid rgb(0,0,0)}.back-end .list .postman{background-color:#ff5900;border:2px solid rgb(238,255,0)}.back-end .list .java{background-color:#0bf;border:2px solid rgb(255,153,0)}.other{list-style:none;color:#000;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;display:flex;flex-direction:column;width:100px;margin:50px 0;padding:0}.other .list{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center;gap:20px}@supports not (gap: 20px){.other .list>*:not(:last-child){margin-bottom:20px}}.other .list li{border:2px solid white;width:100px;height:40px;font-size:.8rem;display:flex;flex-direction:row;justify-content:center;align-items:center}.other .list .illustrator{background-color:#ff5900;border:2px solid rgb(0,0,0)}.other .list .photoshop{background-color:#0bf;border:2px solid rgb(0,33,100)}.other .list .figma{background-color:#ff4646;border:2px solid rgb(145,255,0)}.other .list .fl-studio{background-color:#ff9d00;border:2px solid rgb(106,255,0)}.backButton{font-size:1.7rem;color:#fff;padding:0;display:flex;flex-direction:row;align-items:center;margin:20px 0 0 20px;cursor:pointer;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-transform:uppercase}.backButton .arrow{width:30px;margin-right:5px;height:auto}.backButton p{margin:0;width:auto}.gameDisplay{display:flex;flex-direction:column}.gameDisplay a{height:auto;width:120px;margin:30px 0 0 30px}.gameDisplay .image{width:330px;margin:0 auto}.gameDisplay .image img{width:330px;height:auto;margin:0 auto}.gameDisplay .textDiv{width:330px;height:auto;text-align:start;margin:0 auto}.gameDisplay .textDiv p{color:#fff;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:1rem}.gameDisplay .project-buttons{display:flex;flex-direction:row;gap:10px;justify-content:center;width:auto}@supports not (gap: 10px){.gameDisplay .project-buttons>*:not(:last-child){margin-right:10px}}.gameDisplay .project-buttons a{width:auto;text-decoration:none;margin:0 0 30px}.gameDisplay .project-buttons .button-project{font-size:.8rem;border:1px solid white;border-radius:10px;width:150px;height:50px;color:#fff;display:flex;flex-direction:row;align-items:center;justify-content:center}.gameDisplay .project-buttons .button-project .github-on-button{width:auto;height:20px;border:none;margin-left:10px}.gameDisplay .project-buttons .button-project-not-available{font-size:.8rem;border:1px solid white;border-radius:10px;width:170px;height:50px;color:#fff;display:flex;flex-direction:row;align-items:center;justify-content:center;cursor:default;padding:0 15px}.gameDisplay h1{font-size:2rem;margin:30px auto;color:#fff;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:center}.hidden{display:none}html{scroll-behavior:smooth}body{margin:0;background:linear-gradient(180deg,#082752,#2e62ff 50%,#082752 90%)}.loader-container{width:100%;height:100vh;display:flex;justify-content:center;align-items:center;position:fixed;top:0;background:#000;z-index:3;animation:shrink-container .5s linear forwards}@keyframes shrink-container{0%{height:100vh}to{height:0}}header{display:flex;flex-direction:column;align-items:flex-end;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;width:100%}header .nav{display:none}.icons-left{display:flex;flex-direction:row;align-items:center;margin:0 0 0 30px;gap:20px;display:none}.icons-left .linkedin{height:auto;width:30px;fill:#535c91;transition:.2s ease}.icons-left .linkedin:hover{fill:#fff}.icons-left .github{height:auto;width:30px}.icons-left .github path{fill:#535c91;transition:.2s ease}.icons-left .github-link:hover .github path{fill:#fff}button{background:none;border:none;outline:none;box-shadow:none;cursor:pointer}.icons-right{display:none}.icons-right .info{margin:0 30px 0 0;height:50px;width:auto;cursor:pointer}.icons-right .info .info-icon{height:auto;width:35px}.icons-right .info .info-icon path{fill:#535c91;transition:.2s ease-in-out}.icons-right .info:hover .info-icon path{fill:#fff}.info-box{position:absolute;right:0;top:0;width:300px;height:300px;background:#fff;display:flex;flex-direction:column;justify-content:space-evenly;border-radius:10px;margin:20px 20px 0 0}.info-box .info-box-close{text-align:left}.info-box p{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:left;margin-left:20px}.info-box .info-box-button{width:auto;height:auto;border:black 1px solid;display:flex;flex-direction:row;align-items:center;margin:0 auto}.info-box .info-box-button .github-on-button{width:auto;height:30px;border:none;margin:0 0 0 10px}.burger-menu{display:block;margin:0;position:fixed;z-index:1}.burger-menu .burger{display:flex;flex-direction:column;gap:10px;padding:20px 20px 0 0;align-items:flex-end}.burger-menu .burger span{width:40px;height:3px;background-color:#fff;transition:all .3s ease}.burger-content{position:fixed;right:-200px;top:0;width:200px;height:1400px;background-color:#082752;border-left:1px solid white;transition:right .3s ease-in-out}.burger-content a{text-decoration:none}.burger-content a li{color:#fff;list-style:none;padding:10px 0;font-size:1.5rem;margin-left:10px}.burger-content.open{right:0}.burger-close{position:relative;width:45px;height:45px;padding-top:20px;margin-left:5px}.burger-close span{position:absolute;top:50%;left:50%;width:100%;height:3px;background-color:#fff;transform-origin:center;transition:all .3s ease}.burger-close span:nth-child(1){transform:translate(-50%,-50%) rotate(45deg)}.burger-close span:nth-child(2){transform:translate(-50%,-50%) rotate(-45deg)}.sidebar{font-size:1.4rem;position:fixed;top:40%;opacity:0;transition:opacity .3s ease-in-out}.sidebar ul{display:flex;flex-direction:column;gap:20px;list-style:none;padding-left:20px}.sidebar ul a{text-decoration:none;color:inherit}.sidebar ul li{transition:.3s ease-in-out;transform:scale(1);cursor:pointer;text-transform:uppercase;color:#fff;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.sidebar ul li:after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:2px;background:currentColor;transition:width .5s ease-in-out}.sidebar ul li:hover{transform:scale(1.03);color:#838383}.sidebar ul li:hover:after{width:100%}.visible{display:block;opacity:1}.intro{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;height:400px;text-align:center;width:100%;margin:100px auto 0;color:#fff;text-shadow:2px 5px 20px black}.intro h1{font-size:2.5rem;margin:0}.intro .text1{font-size:2rem;margin:0}.intro .text2{font-size:1rem;margin:0}.intro-buttons{display:flex;flex-direction:row;justify-content:center;gap:20px}@supports not (gap: 20px){.intro-buttons>*:not(:last-child){margin-right:20px}}.intro-buttons button{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;width:130px;height:60px;border:1px solid white;border-radius:10px;box-shadow:0 6px 5px -5px #000;margin:100px 0 0;font-size:1rem;color:#fff;transition:.3s ease-in-out;transform:scale(1)}.about-me{padding-top:50px}.about-me .flex{height:auto;width:100%;margin:0 auto}.about-me .flex .profile-image{width:150px;height:auto;border-radius:50%;box-shadow:-10px 10px 30px;float:left;position:relative;margin:0 10px 0 20px}.about-me .flex .text{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;width:90%;margin:0 20px}.about-me .flex .text h3{font-size:1rem;margin:0;color:#fff}.about-me .flex .text p{margin:0;font-size:1rem;color:#fff;position:relative;text-wrap:wrap}h2{font-size:3rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:center;margin:0 0 40px;color:#fff}.my-projects{display:flex;flex-direction:column;margin:0 auto}.my-projects .my-latest-project{width:100%;height:auto;margin:0 auto;border-radius:20px}.my-projects .my-latest-project h3{font-size:2rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:center;color:#fff;margin:0 0 40px;width:300px;padding:0;width:auto}.my-projects .my-latest-project .image{width:300px;height:220px;box-shadow:0 2px 5px;margin:0 auto;overflow:hidden}.my-projects .my-latest-project .image img{width:300px;height:220px}.my-projects .my-latest-project .description{width:340px;height:auto;margin:30px auto 0;border-radius:10px}.my-projects .my-latest-project .description .desc-text{margin:0;padding:0;font-size:1rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:center;color:#fff}.my-projects .my-latest-project .project-buttons{display:flex;flex-direction:row;gap:10px;margin:20px auto 0;justify-content:center;width:100%}@supports not (gap: 15px){.my-projects .my-latest-project .project-buttons>*:not(:last-child){margin-right:15px}}.my-projects .my-latest-project .project-buttons a{width:auto;text-decoration:none}.my-projects .my-latest-project .project-buttons button{font-size:.8rem;border:1px solid white;border-radius:10px;width:160px;height:50px;color:#fff;transition:.3s ease-in-out;transform:scale(1);display:flex;flex-direction:row;align-items:center;justify-content:center}.my-projects .my-latest-project .project-buttons button .github-on-button{width:auto;height:20px;border:none;margin:0 0 0 10px}.my-projects h3{font-size:2rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:center;margin:100px auto 0;color:#fff;width:300px}.my-projects .my-other-projects{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;margin:40px auto 0;gap:20px;width:90%;height:auto;border-radius:10px}@supports not (gap: 20px){.my-projects .my-other-projects>*:nth-child(2n){margin-left:20px;margin-bottom:20px}.my-projects .my-other-projects>*:nth-child(odd){margin-bottom:20px}}.my-projects .my-other-projects .small-project{height:120px;width:150px;overflow:hidden;display:flex;justify-content:center;align-items:center;position:relative;border-radius:10px;transition:.5s ease;opacity:1;box-shadow:0 3px 5px;cursor:pointer}.my-projects .my-other-projects .small-project p{font-size:1.3rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;color:#fff;position:absolute;opacity:0;transition:opacity .5s ease}.my-projects .my-other-projects .small-project img{transition:opacity .5s ease}.my-projects .my-other-projects .small-project .surf-club{width:200px;height:120px}.my-projects .my-other-projects .small-project .coloring-game{width:150px;height:120px}.my-projects .my-other-projects .small-project .swedish-quiz{width:250px;height:auto}.my-projects .my-other-projects .small-project .document-creator,.my-projects .my-other-projects .small-project .webshop{width:200px;height:120px}.contacts{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.contacts h3{text-transform:uppercase;color:#fff;font-size:1.2rem;text-align:center}.contacts p{font-size:1rem;text-align:center;color:#fff}.contacts .headers{display:flex;flex-direction:row;justify-content:center;gap:30px}@supports not (gap: 30px){.contacts .headers>*:not(:last-child){margin-right:30px}}.contacts .headers h5{font-size:1.3rem;text-align:center;color:#fff}.contacts .headers .name-and-link{display:flex;flex-direction:row;gap:10px}@supports not (gap: 10px){.contacts .headers .name-and-link>*:not(:last-child){margin-right:10px}}.contacts .headers .name-and-link p{margin:0}.contacts .headers .name-and-link .icon{fill:#fff;height:auto;width:20px}footer{background-color:#061a36;box-shadow:0 0 0 1px #525252;width:100%;height:160px;display:flex;flex-direction:column;justify-content:center}footer .footer-list{display:flex;justify-content:center;padding:0;gap:10px}@supports not (gap: 10px){footer .footer-list>*:not(:last-child){margin-right:10px}}footer .footer-list a{color:#535c91;text-decoration:none}footer .footer-list li{list-style:none;display:inline;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:.8rem;text-transform:uppercase}footer .footer-icons{display:flex;flex-direction:row;justify-content:center;gap:20px;margin-top:20px}@supports not (gap: 20px){footer .footer-icons>*:not(:last-child){margin-right:20px}}footer .footer-icons .icon{height:auto;width:30px;fill:#535c91}.fading-line-horizontal{margin:50px auto;width:80%;height:1px;background:linear-gradient(to right,#76767600,#767676 20%,#767676 80%,#76767600)}.fading-line-horizontal-footer{margin:0 auto;width:80%;height:1px;background:linear-gradient(to right,#76767600,#767676 20%,#767676 80%,#76767600)}.fading-line-vertical{width:1px;height:200px;margin-bottom:40px;background:linear-gradient(to bottom,#76767600,#767676 20%,#767676 80%,#76767600)}@media (min-width: 744px){@keyframes blink{0%{opacity:0}25%{opacity:.7}50%{opacity:1}75%{opacity:.7}to{opacity:0}}.star1{position:absolute;top:80%;left:70%}.star1 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.5s;display:block}.star2{position:absolute;top:20%;left:40%}.star2 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.6s;display:block}.star3{position:absolute;top:25%;left:63%}.star3 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.8s;display:block}.star4{position:absolute;top:58%;left:36%}.star4 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.3s;display:block}.star5{position:absolute;top:60%;left:68%}.star5 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.1s;display:block}.star6{position:absolute;top:46%;left:22%}.star6 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.9s;display:block}.star7{position:absolute;top:30%;left:24%}.star7 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.6s;display:block}.star8{position:absolute;top:67%;left:9%}.star8 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.9s;display:block}.star9{position:absolute;top:13%;left:65%}.star9 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.7s;display:block}.star10{position:absolute;top:71%;left:77%}.star10 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.1s;display:block}.star11{position:absolute;top:63%;left:25%}.star11 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.1s;display:block}.star12{position:absolute;top:55%;left:79%}.star12 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.1s;display:block}.star13{position:absolute;top:25%;left:90%}.star13 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.4s;display:block}.star14{position:absolute;top:70%;left:50%}.star14 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.3s;display:block}.star15{position:absolute;top:20%;left:80%}.star15 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1s;display:block}.star16{position:absolute;top:17%;left:11%}.star16 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.56s;display:block}.star17{position:absolute;top:40%;left:80%}.star17 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.8s;display:block}.star18{position:absolute;top:30%;left:5%}.star18 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.4s;display:block}.star19{position:absolute;top:40%;left:14%}.star19 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.7s;display:block}.star20{position:absolute;top:40%;left:95%}.star20 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.7s;display:block}.star21{position:absolute;top:50%;left:87%}.star21 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.25s;display:block}.star22{position:absolute;top:60%;left:90%}.star22 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.55s;display:block}.star23{position:absolute;top:50%;left:10%}.star23 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.2s;display:block}.star24{position:absolute;top:50%;left:45%}.star24 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.4s;display:block}.star25{position:absolute;top:64%;left:62%}.star25 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.7s;display:block}.star26{position:absolute;top:31%;left:78%}.star26 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.6s;display:block}.star27{position:absolute;top:12%;left:21%}.star27 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.5s;display:block}.star28{position:absolute;top:12%;left:46%}.star28 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.1s;display:block}.star29{position:absolute;top:10%;left:93%}.star29 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.8s;display:block}.star30{position:absolute;top:55%;left:60%}.star30 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.5s;display:block}.alert{padding:20px;width:500px;background-color:#f44336;color:#fff;position:absolute;top:0;left:50%;transform:translate(-50%);z-index:1}.closebtn{margin-left:15px;color:#fff;font-weight:700;float:right;font-size:22px;line-height:20px;cursor:pointer;transition:.3s}.closebtn:hover{color:#000}.skills-section{margin-top:100px}.skills-section h2{margin:auto 0;font-size:3rem}.skills{display:flex;flex-direction:row;justify-content:center}h4{color:#fff;font-size:2rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;margin:0 auto 50px;width:200px;text-align:center;height:50px}.stack-icon{width:auto;height:30px;margin-left:10px}.front-end{list-style:none;color:#000;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;display:flex;flex-direction:column;width:400px;margin:50px 0;padding:0}.front-end .list{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center;gap:50px}@supports not (gap: 50px){.front-end .list>*:not(:last-child){margin-bottom:50px}}.front-end .list li{border:2px solid white;width:200px;height:70px;font-size:1.1rem;display:flex;flex-direction:row;justify-content:center;align-items:center}.front-end .list .html{background-color:orange;border:2px solid rgb(255,213,150)}.front-end .list .typescript{background-color:#269dff;border:2px solid rgb(255,213,150)}.front-end .list .react{background-color:#91ceff;border:2px solid rgb(255,213,150)}.front-end .list .css3{background-color:#005fac;border:2px solid rgb(255,213,150)}.front-end .list .vite{background-color:#f8ff27;border:2px solid rgb(255,213,150)}.front-end .list .sass{background-color:#ed8aff;border:2px solid rgb(255,213,150)}.front-end .list .javascript{background-color:#fcff67;border:2px solid rgb(255,213,150)}.front-end .list .node{background-color:#82ff8a;border:2px solid rgb(255,213,150)}.back-end{list-style:none;color:#000;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;display:flex;flex-direction:column;width:400px;margin:50px 0;padding:0}.back-end .list{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center;gap:50px}@supports not (gap: 50px){.back-end .list>*:not(:last-child){margin-bottom:50px}}.back-end .list li{border:2px solid white;width:200px;height:70px;font-size:1.1rem;display:flex;flex-direction:row;justify-content:center;align-items:center}.back-end .list .express{background-color:#fff;border:2px solid rgb(0,0,0)}.back-end .list .digitalOcean{background-color:#4000ff;border:2px solid rgb(255,255,255)}.back-end .list .mySql{background-color:#fff;border:2px solid rgb(0,21,255)}.back-end .list .mongoDB{background-color:#73ff27;border:2px solid rgb(0,0,0)}.back-end .list .postman{background-color:#ff5900;border:2px solid rgb(238,255,0)}.back-end .list .java{background-color:#0bf;border:2px solid rgb(255,153,0)}.other{list-style:none;color:#000;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;display:flex;flex-direction:column;width:400px;margin:50px 0;padding:0}.other .list{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center;gap:50px}@supports not (gap: 50px){.other .list>*:not(:last-child){margin-bottom:50px}}.other .list li{border:2px solid white;width:200px;height:70px;font-size:1.1rem;display:flex;flex-direction:row;justify-content:center;align-items:center}.other .list .illustrator{background-color:#ff5900;border:2px solid rgb(0,0,0)}.other .list .photoshop{background-color:#0bf;border:2px solid rgb(0,33,100)}.other .list .figma{background-color:#ff4646;border:2px solid rgb(145,255,0)}.other .list .fl-studio{background-color:#ff9d00;border:2px solid rgb(106,255,0)}.backButton{font-size:1.5rem;color:#fff;padding:0;display:flex;flex-direction:row;align-items:center;margin:30px 0 0 30px;cursor:pointer;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-transform:uppercase}.backButton .arrow{width:30px;margin-right:5px;height:auto}.backButton p{margin:0;width:auto}.gameDisplay{display:flex;flex-direction:column}.gameDisplay a{height:auto;width:120px;padding:10px;margin:30px 0 0 30px}.gameDisplay .image{width:670px;margin:0 auto}.gameDisplay .image img{width:670px;height:auto;margin:0 auto}.gameDisplay .textDiv{width:670px;height:auto;text-align:start;margin:0 auto}.gameDisplay .textDiv p{color:#fff;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:1.2rem}.gameDisplay .project-buttons{display:flex;flex-direction:row;gap:30px;justify-content:center;width:auto}@supports not (gap: 30px){.gameDisplay .project-buttons>*:not(:last-child){margin-right:30px}}.gameDisplay .project-buttons a{width:auto;text-decoration:none;margin:0 0 30px}.gameDisplay .project-buttons .button-project{font-size:1rem;border:1px solid white;border-radius:10px;width:200px;height:70px;color:#fff;display:flex;flex-direction:row;align-items:center;justify-content:center}.gameDisplay .project-buttons .button-project .github-on-button{width:auto;height:20px;border:none;margin-left:10px}.gameDisplay .project-buttons .button-project-not-available{font-size:1rem;border:1px solid white;border-radius:10px;width:auto;height:70px;color:#fff;display:flex;flex-direction:row;align-items:center;justify-content:center;margin-top:10px;cursor:default;padding:0 15px}.gameDisplay h1{font-size:3rem;margin:0 auto 50px;color:#fff;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:center}.hidden{display:none}html{scroll-behavior:smooth}body{margin:0;background:linear-gradient(180deg,#082752,#2e62ff 50%,#082752 90%)}.loader-container{width:100%;height:100vh;display:flex;justify-content:center;align-items:center;position:fixed;top:0;background:#000;z-index:2;animation:shrink-container .5s linear forwards}@keyframes shrink-container{0%{height:100vh}to{height:0}}header{display:flex;flex-direction:column;align-items:center;justify-content:space-between;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}header .nav{height:70px;width:730px;border-radius:0 0 10px 10px;background-color:#070f2b;border-bottom:1px solid #535C91;border-left:1px solid #535C91;border-right:1px solid #535C91;text-align:center;display:flex;flex-direction:row;margin:0 auto;align-items:center;justify-content:center}header .nav .seperation-line{width:1px;height:20px;background-color:#fff;margin:0;padding:0}header .nav .nav-content{font-size:1.2rem;color:#9290c3;width:180px;height:auto}header .nav .nav-content p{height:auto;margin:0;text-transform:uppercase}header .nav .nav-content :hover{color:#fff;transition:.2s ease-in-out}.icons-left{display:flex;flex-direction:row;align-items:center;margin:0 0 0 30px;gap:20px;display:none}.icons-left .linkedin{height:auto;width:30px;fill:#535c91;transition:.2s ease}.icons-left .linkedin:hover{fill:#fff}.icons-left .github{height:auto;width:30px}.icons-left .github path{fill:#535c91;transition:.2s ease}.icons-left .github-link:hover .github path{fill:#fff}button{background:none;border:none;outline:none;box-shadow:none;cursor:pointer}.icons-right{display:none}.icons-right .info{margin:0 30px 0 0;height:50px;width:auto;cursor:pointer}.icons-right .info .info-icon{height:auto;width:35px}.icons-right .info .info-icon path{fill:#535c91;transition:.2s ease-in-out}.icons-right .info:hover .info-icon path{fill:#fff}.info-box{position:absolute;right:0;top:0;width:300px;height:300px;background:#fff;display:flex;flex-direction:column;justify-content:space-evenly;border-radius:10px;margin:20px 20px 0 0}.info-box .info-box-close{text-align:left}.info-box p{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:left;margin-left:20px}.info-box .info-box-button{width:auto;height:auto;border:black 1px solid;display:flex;flex-direction:row;align-items:center;margin:0 auto}.info-box .info-box-button .github-on-button{width:auto;height:30px;border:none;margin:0 0 0 10px}.sidebar{font-size:1.4rem;position:fixed;top:40%;opacity:0;transition:opacity .3s ease-in-out}.sidebar ul{display:flex;flex-direction:column;gap:20px;list-style:none;padding-left:20px}.sidebar ul a{text-decoration:none;color:inherit}.sidebar ul li{transition:.3s ease-in-out;transform:scale(1);cursor:pointer;text-transform:uppercase;color:#fff;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.sidebar ul li:after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:2px;background:currentColor;transition:width .5s ease-in-out}.sidebar ul li:hover{transform:scale(1.03);color:#838383}.sidebar ul li:hover:after{width:100%}.visible{display:block;opacity:1}.intro{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;height:700px;text-align:center;width:730px;margin:200px auto 0;color:#fff;text-shadow:2px 5px 20px black}.intro h1{font-size:4rem;margin:0}.intro .text1{font-size:3rem;margin:0}.intro .text2{font-size:2rem;margin:0}.intro-buttons{display:flex;flex-direction:row;justify-content:center;gap:50px}@supports not (gap: 50px){.intro-buttons>*:not(:last-child){margin-right:50px}}.intro-buttons button{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;width:220px;height:70px;border:1px solid white;border-radius:10px;box-shadow:0 6px 5px -5px #000;margin:100px 0 0;font-size:1.2rem;color:#fff;transition:.3s ease-in-out;transform:scale(1)}.intro-buttons .about-me-button:hover{background-color:#070f2b;color:#00ff1a;transform:scale(1.03)}.intro-buttons .some-other-button:hover{background-color:#070f2b;color:#fff700;transform:scale(1.03)}.about-me{padding-top:50px}.about-me .flex{height:900px;width:100%;margin:0 auto}.about-me .flex .profile-image{width:350px;height:auto;border-radius:50%;box-shadow:-10px 10px 30px;float:left;position:relative;margin:0 50px 20px 30px}.about-me .flex .text{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;width:90%;margin-left:30px}.about-me .flex .text h3{font-size:1.5rem;margin:0;color:#fff}.about-me .flex .text p{margin:0;font-size:1.5rem;color:#fff;position:relative}h2{font-size:3rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:center;margin:0 0 40px;color:#fff}.my-projects{display:flex;flex-direction:column;margin:0 auto}.my-projects .my-latest-project{width:650px;height:auto;margin:50px auto 0;border-radius:20px}.my-projects .my-latest-project h3{font-size:2.5rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:center;color:#fff;margin:0 0 40px;width:300px;padding:0;width:auto}.my-projects .my-latest-project .image{width:650px;height:500px;box-shadow:0 2px 5px}.my-projects .my-latest-project .image img{width:650px;height:500px}.my-projects .my-latest-project .description{width:650px;height:auto;margin:30px 0 0;border-radius:10px}.my-projects .my-latest-project .description .desc-text{margin:0;padding:0;font-size:1.2rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:left;color:#fff}.my-projects .my-latest-project .project-buttons{display:flex;flex-direction:row;gap:30px;margin:20px auto 0;justify-content:flex-start;width:530px}@supports not (gap: 30px){.my-projects .my-latest-project .project-buttons>*:not(:last-child){margin-right:30px}}.my-projects .my-latest-project .project-buttons a{width:auto;text-decoration:none}.my-projects .my-latest-project .project-buttons button{font-size:1.2rem;border:1px solid white;border-radius:10px;width:250px;height:70px;color:#fff;transition:.3s ease-in-out;transform:scale(1);display:flex;flex-direction:row;align-items:center;justify-content:center}.my-projects .my-latest-project .project-buttons button .github-on-button{width:auto;height:30px;border:none;margin:0 0 0 10px}.my-projects .my-latest-project .project-buttons .button-project:hover{background-color:#070f2b;color:#fff700;transform:scale(1.03)}.my-projects h3{font-size:2.5rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:center;margin:100px auto 0;color:#fff;width:400px}.my-projects .my-other-projects{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;margin:40px auto 0;gap:20px;width:90%;height:auto;border-radius:10px}@supports not (gap: 20px){.my-projects .my-other-projects>*:nth-child(2n){margin-left:20px;margin-bottom:20px}.my-projects .my-other-projects>*:nth-child(odd){margin-bottom:20px}}.my-projects .my-other-projects .small-project{height:170px;width:300px;overflow:hidden;display:flex;justify-content:center;align-items:center;position:relative;border-radius:10px;transition:.5s ease;opacity:1;box-shadow:0 3px 5px;cursor:pointer}.my-projects .my-other-projects .small-project .mobile-header{display:none}.my-projects .my-other-projects .small-project p{font-size:1.3rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;color:#fff;position:absolute;opacity:0;transition:opacity .5s ease}.my-projects .my-other-projects .small-project img{width:350px;height:auto;transition:opacity .5s ease}.my-projects .my-other-projects .small-project .surf-club{width:400px;height:200px}.my-projects .my-other-projects .small-project .coloring-game{width:400px;height:170px}.my-projects .my-other-projects .small-project .swedish-quiz{width:400px;height:auto}.my-projects .my-other-projects .small-project .document-creator,.my-projects .my-other-projects .small-project .webshop{width:300px;height:170px}.my-projects .my-other-projects .small-project:hover img{opacity:.3}.my-projects .my-other-projects .small-project:hover p{opacity:1}.contacts{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.contacts h3{text-transform:uppercase;color:#fff;font-size:1.4rem;text-align:center}.contacts p{font-size:1.3rem;text-align:center;color:#fff}.contacts .headers{display:flex;flex-direction:row;justify-content:center;gap:100px}@supports not (gap: 100px){.contacts .headers>*:not(:last-child){margin-right:100px}}.contacts .headers h5{font-size:1.5rem;text-align:center;color:#fff}.contacts .headers .name-and-link{display:flex;flex-direction:row;gap:20px}@supports not (gap: 20px){.contacts .headers .name-and-link>*:not(:last-child){margin-right:20px}}.contacts .headers .name-and-link p{margin:0}.contacts .headers .name-and-link .icon{fill:#fff;height:auto;width:27px;margin-top:5px}@supports not (margin-top: 5px){.contacts .headers .name-and-link .icon>*:not(:last-child){margin-top:0}}footer{background-color:#061a36;box-shadow:0 0 0 1px #525252;width:100%;height:300px;display:flex;flex-direction:column;justify-content:center}footer .footer-list{display:flex;justify-content:center;gap:40px}@supports not (gap: 40px){footer .footer-list>*:not(:last-child){margin-right:40px}}footer .footer-list a{color:#535c91;text-decoration:none}footer .footer-list li{list-style:none;display:inline;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:1.2rem;text-transform:uppercase}footer .footer-icons{display:flex;flex-direction:row;justify-content:center;gap:50px;margin-top:20px}@supports not (gap: 50px){footer .footer-icons>*:not(:last-child){margin-right:50px}}footer .footer-icons .icon{height:auto;width:30px;fill:#535c91}.fading-line-horizontal{margin:100px auto;width:80%;height:1px;background:linear-gradient(to right,#76767600,#767676 20%,#767676 80%,#76767600)}.fading-line-horizontal-footer{margin:0 auto;width:80%;height:1px;background:linear-gradient(to right,#76767600,#767676 20%,#767676 80%,#76767600)}.fading-line-vertical{width:1px;height:300px;margin-bottom:40px;background:linear-gradient(to bottom,#76767600,#767676 20%,#767676 80%,#76767600)}}@media (min-width: 1000px){.backButton{font-size:1.8rem;color:#fff;padding:0;display:flex;flex-direction:row;align-items:center;margin:30px 0 0 30px;cursor:pointer;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-transform:uppercase}.backButton .arrow{width:35px;margin-right:5px;height:auto}.backButton p{margin:0;width:auto}.gameDisplay{display:flex;flex-direction:column}.gameDisplay a{height:auto;width:120px;padding:10px;margin:30px 0 0 30px}.gameDisplay .image{width:900px;margin:0 auto}.gameDisplay .image img{width:900px;height:auto;margin:0 auto}.gameDisplay .textDiv{width:900px;height:auto;text-align:start;margin:0 auto}.gameDisplay .textDiv p{color:#fff;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:1.4rem}.gameDisplay .project-buttons{display:flex;flex-direction:row;gap:30px;justify-content:center;width:auto}@supports not (gap: 30px){.gameDisplay .project-buttons>*:not(:last-child){margin-right:30px}}.gameDisplay .project-buttons a{width:auto;text-decoration:none;margin:0 0 30px}.gameDisplay .project-buttons .button-project{font-size:1.2rem;border:1px solid white;border-radius:10px;width:200px;height:70px;color:#fff;display:flex;flex-direction:row;align-items:center;justify-content:center}.gameDisplay .project-buttons .button-project .github-on-button{width:auto;height:25px;border:none;margin-left:10px}.gameDisplay .project-buttons .button-project-not-available{font-size:1.2rem;border:1px solid white;border-radius:10px;width:auto;height:70px;color:#fff;display:flex;flex-direction:row;align-items:center;justify-content:center;margin-top:10px;cursor:default;padding:0 15px}.gameDisplay h1{font-size:3rem;margin:0 auto 50px;color:#fff;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:center}.hidden{display:none}header{display:flex;flex-direction:row;align-items:center;justify-content:space-between;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;position:relative;height:70px}header .nav{height:70px;width:744px;border-radius:0 0 10px 10px;background-color:#070f2b;border-bottom:1px solid #535C91;border-left:1px solid #535C91;border-right:1px solid #535C91;text-align:center;display:flex;flex-direction:row;margin:0 auto;align-items:center;justify-content:center;position:absolute;top:0;left:50%;transform:translate(-50%)}header .nav .seperation-line{width:1px;height:20px;background-color:#fff;margin:0;padding:0}header .nav .nav-content{font-size:1.2rem;color:#9290c3;width:180px;height:auto}header .nav .nav-content p{height:auto;margin:0;text-transform:uppercase}header .nav .nav-content :hover{color:#fff;transition:.2s ease-in-out}.icons-left{display:flex;flex-direction:row;align-items:center;margin:0 0 0 30px;gap:20px;display:none}.icons-left .linkedin{height:auto;width:30px;fill:#535c91;transition:.2s ease}.icons-left .linkedin:hover{fill:#fff}.icons-left .github{height:auto;width:30px}.icons-left .github path{fill:#535c91;transition:.2s ease}.icons-left .github-link:hover .github path{fill:#fff}.icons-right{display:none}.icons-right .info{margin:0 30px 0 0;height:50px;width:auto;cursor:pointer}.icons-right .info .info-icon{height:auto;width:35px}.icons-right .info .info-icon path{fill:#535c91;transition:.2s ease-in-out}.icons-right .info:hover .info-icon path{fill:#fff}.info-box{position:absolute;right:0;top:0;width:300px;height:300px;background:#fff;display:flex;flex-direction:column;justify-content:space-evenly;border-radius:10px;margin:20px 20px 0 0}.info-box .info-box-close{text-align:left}.info-box p{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:left;margin-left:20px}.info-box .info-box-button{width:auto;height:auto;border:black 1px solid;display:flex;flex-direction:row;align-items:center;margin:0 auto}.info-box .info-box-button .github-on-button{width:auto;height:30px;border:none;margin:0 0 0 10px}.burger-menu{display:block;margin:0 30px 0 0;position:unset}.burger-menu .burger{display:flex;flex-direction:column;gap:10px}.burger-menu .burger span{width:40px;height:2px;background-color:#fff}.about-me{padding-top:50px}.about-me .flex{height:800px;width:800px;margin:0 auto}.about-me .flex .profile-image{width:350px;height:auto;border-radius:50%;box-shadow:-10px 10px 30px;float:left;position:relative;margin:0 50px 30px 0}.about-me .flex .text{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;width:800px}.about-me .flex .text h3{font-size:1.5rem;margin:0;color:#fff}.about-me .flex .text p{margin:0;font-size:1.5rem;color:#fff;position:relative}}@media (min-width: 1440px) and (min-height: 700px){@keyframes blink{0%{opacity:0}25%{opacity:.7}50%{opacity:1}75%{opacity:.7}to{opacity:0}}.star1{position:absolute;top:80%;left:70%}.star1 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.5s;display:block}.star2{position:absolute;top:20%;left:40%}.star2 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.6s;display:block}.star3{position:absolute;top:25%;left:63%}.star3 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.8s;display:block}.star4{position:absolute;top:58%;left:36%}.star4 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.3s;display:block}.star5{position:absolute;top:60%;left:68%}.star5 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.1s;display:block}.star6{position:absolute;top:46%;left:22%}.star6 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.9s;display:block}.star7{position:absolute;top:25%;left:24%}.star7 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.6s;display:block}.star8{position:absolute;top:67%;left:9%}.star8 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.9s;display:block}.star9{position:absolute;top:13%;left:65%}.star9 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.7s;display:block}.star10{position:absolute;top:81%;left:77%}.star10 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.1s;display:block}.star11{position:absolute;top:63%;left:25%}.star11 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.1s;display:block}.star12{position:absolute;top:55%;left:79%}.star12 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.1s;display:block}.star13{position:absolute;top:35%;left:47%}.star13 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.4s;display:block}.star14{position:absolute;top:80%;left:50%}.star14 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.3s;display:block}.star15{position:absolute;top:20%;left:80%}.star15 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1s;display:block}.star16{position:absolute;top:17%;left:11%}.star16 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.56s;display:block}.star17{position:absolute;top:40%;left:80%}.star17 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.8s;display:block}.star18{position:absolute;top:76%;left:19%}.star18 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.4s;display:block}.star19{position:absolute;top:40%;left:14%}.star19 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.7s;display:block}.star20{position:absolute;top:40%;left:95%}.star20 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.7s;display:block}.star21{position:absolute;top:50%;left:87%}.star21 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.25s;display:block}.star22{position:absolute;top:90%;left:90%}.star22 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.55s;display:block}.star23{position:absolute;top:90%;left:10%}.star23 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.2s;display:block}.star24{position:absolute;top:90%;left:45%}.star24 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.4s;display:block}.star25{position:absolute;top:84%;left:62%}.star25 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.7s;display:block}.star26{position:absolute;top:91%;left:78%}.star26 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.6s;display:block}.star27{position:absolute;top:92%;left:21%}.star27 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.5s;display:block}.star28{position:absolute;top:92%;left:56%}.star28 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.1s;display:block}.star29{position:absolute;top:76%;left:93%}.star29 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.8s;display:block}.star30{position:absolute;top:90%;left:30%}.star30 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.5s;display:block}.skills-section h2{margin:100px 0 auto;font-size:4rem}.skills{display:flex;flex-direction:row;justify-content:center}h4{color:#fff;font-size:2.5rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;margin:0 auto 50px;width:200px;text-align:center;height:50px}.stack-icon{width:auto;height:30px;margin-left:10px}.front-end{list-style:none;color:#000;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;display:flex;flex-direction:column;width:400px;margin:150px 0 50px;padding:0}.front-end .list{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center;gap:40px}.front-end .list li{border:2px solid white;width:250px;height:70px;font-size:1.3rem;display:flex;flex-direction:row;justify-content:center;align-items:center}.front-end .list .html{background-color:orange;border:2px solid rgb(255,213,150)}.front-end .list .typescript{background-color:#269dff;border:2px solid rgb(255,213,150)}.front-end .list .react{background-color:#91ceff;border:2px solid rgb(255,213,150)}.front-end .list .css3{background-color:#005fac;border:2px solid rgb(255,213,150)}.front-end .list .vite{background-color:#f8ff27;border:2px solid rgb(255,213,150)}.front-end .list .sass{background-color:#ed8aff;border:2px solid rgb(255,213,150)}.front-end .list .javascript{background-color:#fcff67;border:2px solid rgb(255,213,150)}.front-end .list .node{background-color:#82ff8a;border:2px solid rgb(255,213,150)}.back-end{list-style:none;color:#000;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;display:flex;flex-direction:column;width:400px;margin:150px 0 50px;padding:0}.back-end .list{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center;gap:40px}.back-end .list li{border:2px solid white;width:250px;height:70px;font-size:1.3rem;display:flex;flex-direction:row;justify-content:center;align-items:center}.back-end .list .express{background-color:#fff;border:2px solid rgb(0,0,0)}.back-end .list .digitalOcean{background-color:#4000ff;border:2px solid rgb(255,255,255)}.back-end .list .mySql{background-color:#fff;border:2px solid rgb(0,21,255)}.back-end .list .mongoDB{background-color:#73ff27;border:2px solid rgb(0,0,0)}.back-end .list .postman{background-color:#ff5900;border:2px solid rgb(238,255,0)}.back-end .list .java{background-color:#0bf;border:2px solid rgb(255,153,0)}.other{list-style:none;color:#000;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;display:flex;flex-direction:column;width:400px;margin:150px 0 50px;padding:0}.other .list{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center;gap:40px}.other .list li{border:2px solid white;width:250px;height:70px;font-size:1.3rem;display:flex;flex-direction:row;justify-content:center;align-items:center}.other .list .illustrator{background-color:#ff5900;border:2px solid rgb(0,0,0)}.other .list .photoshop{background-color:#0bf;border:2px solid rgb(0,33,100)}.other .list .figma{background-color:#ff4646;border:2px solid rgb(145,255,0)}.other .list .fl-studio{background-color:#ff9d00;border:2px solid rgb(106,255,0)}.backButton{font-size:2rem;color:#fff;padding:0;display:flex;flex-direction:row;align-items:center;margin:30px 0 0 30px;transition:.3s ease-in-out;transform:scale(1);cursor:pointer;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-transform:uppercase}.backButton:after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:2px;background:currentColor;transition:width .5s ease-in-out}.backButton:hover{transform:scale(1.03)}.backButton:hover:after{width:100%}.backButton .arrow{width:40px;margin-right:5px;height:auto}.backButton p{margin:0;width:auto}.gameDisplay{display:flex;flex-direction:column}.gameDisplay a{height:auto;width:120px;padding:10px;margin:30px 0 0 30px}.gameDisplay .image{width:800px;margin:0 auto}.gameDisplay .image img{width:800px;height:auto;margin:0 auto}.gameDisplay .textDiv{width:800px;height:auto;text-align:start;margin:0 auto}.gameDisplay .textDiv p{color:#fff;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:1.3rem}.gameDisplay .project-buttons{display:flex;flex-direction:row;gap:30px;justify-content:center;width:auto}.gameDisplay .project-buttons a{width:auto;text-decoration:none;margin:0 0 30px}.gameDisplay .project-buttons .button-project{font-size:1.2rem;border:1px solid white;border-radius:10px;width:250px;height:70px;color:#fff;transition:.3s ease-in-out;transform:scale(1);display:flex;flex-direction:row;align-items:center;justify-content:center}.gameDisplay .project-buttons .button-project .github-on-button{width:auto;height:30px;border:none;margin:0 0 0 10px}.gameDisplay .project-buttons .button-project:hover{background-color:#070f2b;color:#fff700;transform:scale(1.03)}.gameDisplay .project-buttons .button-project-not-available{font-size:1.2rem;border:1px solid white;border-radius:10px;width:auto;height:70px;color:#fff;transition:.3s ease-in-out;transform:scale(1);display:flex;flex-direction:row;align-items:center;justify-content:center;margin-top:10px;cursor:default;padding:0 15px}.gameDisplay .project-buttons .button-project-not-available .button-project-not-available:hover{background-color:#070f2b;color:#fff700;transform:scale(1.03)}.gameDisplay h1{font-size:3rem;margin:0 auto 20px;color:#fff;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:center}.icons-right{display:block}.icons-right .info{margin:0 30px 0 80px;height:50px;width:auto;cursor:pointer}.icons-right .info .info-icon{height:auto;width:50px}.icons-right .info .info-icon path{fill:#535c91;transition:.2s ease-in-out}.icons-right .info:hover .info-icon path{fill:#fff}.info-box{position:absolute;right:0;top:0;width:300px;height:300px;background:#fff;display:flex;flex-direction:column;justify-content:space-evenly;border-radius:10px;margin:20px 20px 0 0}.info-box .info-box-close{text-align:left}.info-box p{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:left;margin-left:20px}.info-box .info-box-button{width:auto;height:auto;border:black 1px solid;display:flex;flex-direction:row;align-items:center;margin:0 auto}.info-box .info-box-button .github-on-button{width:auto;height:30px;border:none;margin:0 0 0 10px}.alert{padding:20px;width:500px;background-color:#f44336;color:#fff;position:absolute;top:0;left:50%;transform:translate(-50%);z-index:1}.closebtn{margin-left:15px;color:#fff;font-weight:700;float:right;font-size:22px;line-height:20px;cursor:pointer;transition:.3s}.closebtn:hover{color:#000}.hidden{display:none}html{scroll-behavior:smooth}body{margin:0;background:linear-gradient(180deg,#082752,#2e62ff 50%,#082752 90%)}body.hidden-content #main,body.hidden-content #sidebar,body.hidden-content #hiddenProjects{display:none}.loader-container{width:100%;height:100vh;display:flex;justify-content:center;align-items:center;position:fixed;background:#000;z-index:999;animation:shrink-container 1s linear forwards}@keyframes shrink-container{0%{height:100vh}to{height:0}}header{display:flex;flex-direction:row;align-items:center;justify-content:space-between;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}header .nav{height:70px;width:900px;border-radius:0 0 10px 10px;background-color:#070f2b;border-bottom:1px solid #535C91;border-left:1px solid #535C91;border-right:1px solid #535C91;text-align:center;display:flex;flex-direction:row;margin:0 auto;align-items:center;justify-content:center}header .nav .seperation-line{width:1px;height:20px;background-color:#fff;margin:0;padding:0}header .nav .nav-content{font-size:1.4rem;color:#9290c3;width:200px;height:100%}header .nav .nav-content p{height:auto;margin:0;text-transform:uppercase}header .nav .nav-content :hover{color:#fff;transition:.2s ease-in-out}.icons-left{display:flex;flex-direction:row;align-items:center;margin:0 0 0 40px;gap:40px}.icons-left .linkedin{height:auto;width:40px;fill:#535c91;transition:.2s ease}.icons-left .linkedin:hover{fill:#fff}.icons-left .github{height:auto;width:40px}.icons-left .github path{fill:#535c91;transition:.2s ease}.icons-left .github-link:hover .github path{fill:#fff}button{background:none;border:none;outline:none;box-shadow:none;cursor:pointer}.sidebar{font-size:1.4rem;position:fixed;top:40%;opacity:0;transition:opacity .3s ease-in-out}.sidebar ul{display:flex;flex-direction:column;gap:20px;list-style:none;padding-left:20px}.sidebar ul a{text-decoration:none;color:inherit}.sidebar ul li{transition:.3s ease-in-out;transform:scale(1);cursor:pointer;text-transform:uppercase;color:#fff;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.sidebar ul li:after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:2px;background:currentColor;transition:width .5s ease-in-out}.sidebar ul li:hover{transform:scale(1.03);color:#838383}.sidebar ul li:hover:after{width:100%}.visible{display:block;opacity:1}.intro{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;height:700px;text-align:center;width:1000px;margin:100px auto 0;color:#fff;text-shadow:2px 5px 20px black}.intro h1{font-size:6rem;margin:0}.intro .text1{font-size:4rem;margin:0}.intro .text2{font-size:3rem;margin:0}.intro-buttons{display:flex;flex-direction:row;justify-content:center;gap:50px}.intro-buttons button{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;width:220px;height:70px;border:1px solid white;border-radius:10px;box-shadow:0 6px 5px -5px #000;margin:100px 0 0;font-size:1.2rem;color:#fff;transition:.3s ease-in-out;transform:scale(1)}.intro-buttons .about-me-button:hover{background-color:#070f2b;color:#00ff1a;transform:scale(1.03)}.intro-buttons .some-other-button:hover{background-color:#070f2b;color:#fff700;transform:scale(1.03)}.about-me{padding-top:30px}.about-me .flex{height:700px;width:1000px;margin:0 auto}.about-me .flex .profile-image{width:500px;height:auto;border-radius:50%;box-shadow:-10px 10px 30px;float:left;position:relative;margin:0 50px 30px 0}.about-me .flex .text{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;width:1100px}.about-me .flex .text h3{font-size:2rem;margin:0;color:#fff}.about-me .flex .text p{margin:0;font-size:1.3rem;color:#fff;position:relative}h2{font-size:3rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:center;margin:0 0 40px;color:#fff}.my-projects{display:flex;flex-direction:column;margin:0 auto}.my-projects .my-latest-project{width:700px;height:auto;margin:20px auto 0;border-radius:20px}.my-projects .my-latest-project h3{font-size:2.5rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:center;color:#fff;margin:0 0 40px;width:300px;padding:0;width:auto}.my-projects .my-latest-project .image{width:700px;box-shadow:0 2px 5px}.my-projects .my-latest-project .image img{width:700px;height:auto}.my-projects .my-latest-project .description{width:700px;height:auto;margin:30px 0 0;border-radius:10px}.my-projects .my-latest-project .description .desc-text{margin:0;padding:0;font-size:1.5rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:left;color:#fff}.my-projects .my-latest-project .project-buttons{display:flex;flex-direction:row;gap:30px;margin:20px 0 0;justify-content:flex-start;width:530px}.my-projects .my-latest-project .project-buttons a{width:auto;text-decoration:none}.my-projects .my-latest-project .project-buttons button{font-size:1.2rem;border:1px solid white;border-radius:10px;width:250px;height:70px;color:#fff;transition:.3s ease-in-out;transform:scale(1);display:flex;flex-direction:row;align-items:center;justify-content:center}.my-projects .my-latest-project .project-buttons button .github-on-button{width:auto;height:30px;border:none;margin:0 0 0 10px}.my-projects .my-latest-project .project-buttons .button-project:hover{background-color:#070f2b;color:#fff700;transform:scale(1.03)}.my-projects h3{font-size:2.5rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:center;margin:100px auto 0;color:#fff;width:300px}.my-projects .my-other-projects{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;margin:40px auto 0;gap:20px;width:80%;height:auto;border-radius:10px}.my-projects .my-other-projects .small-project{height:200px;width:400px;overflow:hidden;display:flex;justify-content:center;align-items:center;position:relative;border-radius:10px;transition:.5s ease;opacity:1;box-shadow:0 3px 5px;cursor:pointer}.my-projects .my-other-projects .small-project .mobile-header{display:none}.my-projects .my-other-projects .small-project p{font-size:1.7rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;color:#fff;position:absolute;opacity:0;transition:opacity .5s ease;display:flex}.my-projects .my-other-projects .small-project img{width:400px;height:auto;transition:opacity .5s ease}.my-projects .my-other-projects .small-project:hover img{opacity:.3}.my-projects .my-other-projects .small-project:hover p{opacity:1}.contacts{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.contacts h3{text-transform:uppercase;color:#fff;font-size:1.7rem;text-align:center}.contacts p{font-size:1.6rem;text-align:center;color:#fff}.contacts .headers{display:flex;flex-direction:row;justify-content:center;gap:150px}.contacts .headers h5{font-size:2rem;text-align:center;color:#fff}.contacts .headers .name-and-link{display:flex;flex-direction:row;gap:20px}.contacts .headers .name-and-link p{margin:0}.contacts .headers .name-and-link .icon{fill:#fff;height:auto;width:27px;margin-top:5px}footer{background-color:#061a36;box-shadow:0 0 0 1px #525252;width:100%;height:300px;display:flex;flex-direction:column;justify-content:center}footer .footer-list{display:flex;justify-content:center;gap:40px}footer .footer-list a{color:#535c91;text-decoration:none}footer .footer-list li{list-style:none;display:inline;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:1.2rem;text-transform:uppercase}footer .footer-icons{display:flex;flex-direction:row;justify-content:center;gap:50px;margin-top:20px}footer .footer-icons .icon{height:auto;width:30px;fill:#535c91}.fading-line-horizontal{margin:100px auto;width:80%;height:1px;background:linear-gradient(to right,#76767600,#767676 20%,#767676 80%,#76767600)}.fading-line-horizontal-footer{margin:0 auto;width:80%;height:1px;background:linear-gradient(to right,#76767600,#767676 20%,#767676 80%,#76767600)}.fading-line-vertical{width:1px;height:300px;margin-bottom:40px;background:linear-gradient(to bottom,#76767600,#767676 20%,#767676 80%,#76767600)}}@media (min-width: 1440px) and (min-height: 900px){@keyframes blink{0%{opacity:0}25%{opacity:.7}50%{opacity:1}75%{opacity:.7}to{opacity:0}}.star1{position:absolute;top:80%;left:70%}.star1 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.5s;display:block}.star2{position:absolute;top:20%;left:40%}.star2 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.6s;display:block}.star3{position:absolute;top:25%;left:63%}.star3 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.8s;display:block}.star4{position:absolute;top:58%;left:36%}.star4 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.3s;display:block}.star5{position:absolute;top:60%;left:68%}.star5 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.1s;display:block}.star6{position:absolute;top:46%;left:22%}.star6 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.9s;display:block}.star7{position:absolute;top:25%;left:24%}.star7 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.6s;display:block}.star8{position:absolute;top:67%;left:9%}.star8 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.9s;display:block}.star9{position:absolute;top:13%;left:65%}.star9 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.7s;display:block}.star10{position:absolute;top:81%;left:77%}.star10 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.1s;display:block}.star11{position:absolute;top:63%;left:25%}.star11 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.1s;display:block}.star12{position:absolute;top:55%;left:79%}.star12 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.1s;display:block}.star13{position:absolute;top:35%;left:47%}.star13 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.4s;display:block}.star14{position:absolute;top:80%;left:50%}.star14 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.3s;display:block}.star15{position:absolute;top:20%;left:80%}.star15 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1s;display:block}.star16{position:absolute;top:17%;left:11%}.star16 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.56s;display:block}.star17{position:absolute;top:40%;left:80%}.star17 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.8s;display:block}.star18{position:absolute;top:76%;left:19%}.star18 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:1.4s;display:block}.star19{position:absolute;top:40%;left:14%}.star19 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.7s;display:block}.star20{position:absolute;top:40%;left:95%}.star20 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.7s;display:block}.star21{position:absolute;top:50%;left:87%}.star21 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.25s;display:block}.star22{position:absolute;top:90%;left:90%}.star22 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.55s;display:block}.star23{position:absolute;top:90%;left:10%}.star23 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.2s;display:block}.star24{position:absolute;top:90%;left:45%}.star24 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.4s;display:block}.star25{position:absolute;top:84%;left:62%}.star25 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.7s;display:block}.star26{position:absolute;top:91%;left:78%}.star26 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.6s;display:block}.star27{position:absolute;top:92%;left:21%}.star27 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.5s;display:block}.star28{position:absolute;top:92%;left:56%}.star28 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.1s;display:block}.star29{position:absolute;top:76%;left:93%}.star29 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.8s;display:block}.star30{position:absolute;top:90%;left:30%}.star30 span{width:2px;height:2px;border-radius:100%;background-color:#fff;animation:blink 2s linear infinite;animation-delay:.5s;display:block}.skills-section h2{margin:100px 0 auto;font-size:4rem}.skills{display:flex;flex-direction:row;justify-content:center}h4{color:#fff;font-size:2.5rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;margin:0 auto 50px;width:200px;text-align:center;height:50px}.stack-icon{width:auto;height:30px;margin-left:10px}.front-end{list-style:none;color:#000;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;display:flex;flex-direction:column;width:400px;margin:150px 0 50px;padding:0}.front-end .list{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center;gap:40px}.front-end .list li{border:2px solid white;width:250px;height:70px;font-size:1.3rem;display:flex;flex-direction:row;justify-content:center;align-items:center}.front-end .list .html{background-color:orange;border:2px solid rgb(255,213,150)}.front-end .list .typescript{background-color:#269dff;border:2px solid rgb(255,213,150)}.front-end .list .react{background-color:#91ceff;border:2px solid rgb(255,213,150)}.front-end .list .css3{background-color:#005fac;border:2px solid rgb(255,213,150)}.front-end .list .vite{background-color:#f8ff27;border:2px solid rgb(255,213,150)}.front-end .list .sass{background-color:#ed8aff;border:2px solid rgb(255,213,150)}.front-end .list .javascript{background-color:#fcff67;border:2px solid rgb(255,213,150)}.front-end .list .node{background-color:#82ff8a;border:2px solid rgb(255,213,150)}.back-end{list-style:none;color:#000;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;display:flex;flex-direction:column;width:400px;margin:150px 0 50px;padding:0}.back-end .list{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center;gap:40px}.back-end .list li{border:2px solid white;width:250px;height:70px;font-size:1.3rem;display:flex;flex-direction:row;justify-content:center;align-items:center}.back-end .list .express{background-color:#fff;border:2px solid rgb(0,0,0)}.back-end .list .digitalOcean{background-color:#4000ff;border:2px solid rgb(255,255,255)}.back-end .list .mySql{background-color:#fff;border:2px solid rgb(0,21,255)}.back-end .list .mongoDB{background-color:#73ff27;border:2px solid rgb(0,0,0)}.back-end .list .postman{background-color:#ff5900;border:2px solid rgb(238,255,0)}.back-end .list .java{background-color:#0bf;border:2px solid rgb(255,153,0)}.other{list-style:none;color:#000;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;display:flex;flex-direction:column;width:400px;margin:150px 0 50px;padding:0}.other .list{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center;gap:40px}.other .list li{border:2px solid white;width:250px;height:70px;font-size:1.3rem;display:flex;flex-direction:row;justify-content:center;align-items:center}.other .list .illustrator{background-color:#ff5900;border:2px solid rgb(0,0,0)}.other .list .photoshop{background-color:#0bf;border:2px solid rgb(0,33,100)}.other .list .figma{background-color:#ff4646;border:2px solid rgb(145,255,0)}.other .list .fl-studio{background-color:#ff9d00;border:2px solid rgb(106,255,0)}.backButton{font-size:2rem;color:#fff;padding:0;display:flex;flex-direction:row;align-items:center;margin:30px 0 0 30px;transition:.3s ease-in-out;transform:scale(1);cursor:pointer;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-transform:uppercase}.backButton:after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:2px;background:currentColor;transition:width .5s ease-in-out}.backButton:hover{transform:scale(1.03)}.backButton:hover:after{width:100%}.backButton .arrow{width:40px;margin-right:5px;height:auto}.backButton p{margin:0;width:auto}.gameDisplay{display:flex;flex-direction:column}.gameDisplay a{height:auto;width:120px;padding:10px;margin:30px 0 0 30px}.gameDisplay .image{width:1000px;margin:0 auto}.gameDisplay .image img{width:1000px;height:auto;margin:0 auto}.gameDisplay .textDiv{width:1000px;height:auto;text-align:start;margin:0 auto}.gameDisplay .textDiv p{color:#fff;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:1.5rem}.gameDisplay .project-buttons{display:flex;flex-direction:row;gap:30px;justify-content:center;width:auto}.gameDisplay .project-buttons a{width:auto;text-decoration:none;margin:0 0 30px}.gameDisplay .project-buttons .button-project{font-size:1.2rem;border:1px solid white;border-radius:10px;width:250px;height:70px;color:#fff;transition:.3s ease-in-out;transform:scale(1);display:flex;flex-direction:row;align-items:center;justify-content:center}.gameDisplay .project-buttons .button-project .github-on-button{width:auto;height:30px;border:none;margin:0 0 0 10px}.gameDisplay .project-buttons .button-project:hover{background-color:#070f2b;color:#fff700;transform:scale(1.03)}.gameDisplay .project-buttons .button-project-not-available{font-size:1.2rem;border:1px solid white;border-radius:10px;width:auto;height:70px;color:#fff;transition:.3s ease-in-out;transform:scale(1);display:flex;flex-direction:row;align-items:center;justify-content:center;margin-top:10px;cursor:default;padding:0 15px}.gameDisplay .project-buttons .button-project-not-available .button-project-not-available:hover{background-color:#070f2b;color:#fff700;transform:scale(1.03)}.gameDisplay h1{font-size:4rem;margin:0 auto 50px;color:#fff;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:center}.icons-right{display:block}.icons-right .info{margin:0 30px 0 80px;height:50px;width:auto;cursor:pointer}.icons-right .info .info-icon{height:auto;width:50px}.icons-right .info .info-icon path{fill:#535c91;transition:.2s ease-in-out}.icons-right .info:hover .info-icon path{fill:#fff}.info-box{position:absolute;right:0;top:0;width:300px;height:300px;background:#fff;display:flex;flex-direction:column;justify-content:space-evenly;border-radius:10px;margin:20px 20px 0 0}.info-box .info-box-close{text-align:left}.info-box p{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:left;margin-left:20px}.info-box .info-box-button{width:auto;height:auto;border:black 1px solid;display:flex;flex-direction:row;align-items:center;margin:0 auto}.info-box .info-box-button .github-on-button{width:auto;height:30px;border:none;margin:0 0 0 10px}.alert{padding:20px;width:500px;background-color:#f44336;color:#fff;position:absolute;top:0;left:50%;transform:translate(-50%);z-index:1}.closebtn{margin-left:15px;color:#fff;font-weight:700;float:right;font-size:22px;line-height:20px;cursor:pointer;transition:.3s}.closebtn:hover{color:#000}.hidden{display:none}html{scroll-behavior:smooth}body{margin:0;background:linear-gradient(180deg,#082752,#2e62ff 50%,#082752 90%)}body.hidden-content #main,body.hidden-content #sidebar,body.hidden-content #hiddenProjects{display:none}.loader-container{width:100%;height:100vh;display:flex;justify-content:center;align-items:center;position:fixed;background:#000;z-index:9999;animation:shrink-container 1s linear forwards}@keyframes shrink-container{0%{height:100vh}to{height:0}}header{display:flex;flex-direction:row;align-items:center;justify-content:space-between;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}header .nav{height:70px;width:900px;border-radius:0 0 10px 10px;background-color:#070f2b;border-bottom:1px solid #535C91;border-left:1px solid #535C91;border-right:1px solid #535C91;text-align:center;display:flex;flex-direction:row;margin:0 auto;align-items:center;justify-content:center}header .nav .seperation-line{width:1px;height:20px;background-color:#fff;margin:0;padding:0}header .nav .nav-content{font-size:1.4rem;color:#9290c3;width:200px;height:100%}header .nav .nav-content p{height:auto;margin:0;text-transform:uppercase}header .nav .nav-content :hover{color:#fff;transition:.2s ease-in-out}.icons-left{display:flex;flex-direction:row;align-items:center;margin:0 0 0 40px;gap:40px}.icons-left .linkedin{height:auto;width:40px;fill:#535c91;transition:.2s ease}.icons-left .linkedin:hover{fill:#fff}.icons-left .github{height:auto;width:40px}.icons-left .github path{fill:#535c91;transition:.2s ease}.icons-left .github-link:hover .github path{fill:#fff}button{background:none;border:none;outline:none;box-shadow:none;cursor:pointer}.sidebar{font-size:1.4rem;position:fixed;top:40%;opacity:0;transition:opacity .3s ease-in-out}.sidebar ul{display:flex;flex-direction:column;gap:20px;list-style:none;padding-left:20px}.sidebar ul a{text-decoration:none;color:inherit}.sidebar ul li{transition:.3s ease-in-out;transform:scale(1);cursor:pointer;text-transform:uppercase;color:#fff;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.sidebar ul li:after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:2px;background:currentColor;transition:width .5s ease-in-out}.sidebar ul li:hover{transform:scale(1.03);color:#838383}.sidebar ul li:hover:after{width:100%}.visible{display:block;opacity:1}.intro{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;height:900px;text-align:center;width:1000px;margin:200px auto 0;color:#fff;text-shadow:2px 5px 20px black}.intro h1{font-size:6rem;margin:0}.intro .text1{font-size:4rem;margin:0}.intro .text2{font-size:3rem;margin:0}.intro-buttons{display:flex;flex-direction:row;justify-content:center;gap:50px}.intro-buttons button{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;width:220px;height:70px;border:1px solid white;border-radius:10px;box-shadow:0 6px 5px -5px #000;margin:100px 0 0;font-size:1.2rem;color:#fff;transition:.3s ease-in-out;transform:scale(1)}.intro-buttons .about-me-button:hover{background-color:#070f2b;color:#00ff1a;transform:scale(1.03)}.intro-buttons .some-other-button:hover{background-color:#070f2b;color:#fff700;transform:scale(1.03)}.about-me{padding-top:100px}.about-me .flex{height:1000px;width:1000px;margin:0 auto}.about-me .flex .profile-image{width:500px;height:auto;border-radius:50%;box-shadow:-10px 10px 30px;float:left;position:relative;margin:0 50px 30px 0}.about-me .flex .text{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;width:1100px}.about-me .flex .text h3{font-size:2.2rem;margin:0;color:#fff}.about-me .flex .text p{margin:0;font-size:1.6rem;color:#fff;position:relative}h2{font-size:3rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:center;margin:0 0 40px;color:#fff}.my-projects{display:flex;flex-direction:column;margin:0 auto}.my-projects .my-latest-project{width:1000px;height:auto;margin:50px auto 0;border-radius:20px}.my-projects .my-latest-project h3{font-size:2.5rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:center;color:#fff;margin:0 0 40px;width:300px;padding:0;width:auto}.my-projects .my-latest-project .image{width:1000px;height:800px;box-shadow:0 2px 5px}.my-projects .my-latest-project .image img{width:1000px;height:800px}.my-projects .my-latest-project .description{width:1000px;height:auto;margin:30px 0 0;border-radius:10px}.my-projects .my-latest-project .description .desc-text{margin:0;padding:0;font-size:1.5rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:left;color:#fff}.my-projects .my-latest-project .project-buttons{display:flex;flex-direction:row;gap:30px;margin:20px 0 0;justify-content:flex-start;width:530px}.my-projects .my-latest-project .project-buttons a{width:auto;text-decoration:none}.my-projects .my-latest-project .project-buttons button{font-size:1.2rem;border:1px solid white;border-radius:10px;width:250px;height:70px;color:#fff;transition:.3s ease-in-out;transform:scale(1);display:flex;flex-direction:row;align-items:center;justify-content:center}.my-projects .my-latest-project .project-buttons button .github-on-button{width:auto;height:30px;border:none;margin:0 0 0 10px}.my-projects .my-latest-project .project-buttons .button-project:hover{background-color:#070f2b;color:#fff700;transform:scale(1.03)}.my-projects h3{font-size:2.5rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-align:center;margin:100px auto 0;color:#fff;width:300px}.my-projects .my-other-projects{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;margin:40px auto 0;gap:20px;width:80%;height:auto;border-radius:10px}.my-projects .my-other-projects .small-project{height:250px;width:500px;overflow:hidden;display:flex;justify-content:center;align-items:center;position:relative;border-radius:10px;transition:.5s ease;opacity:1;box-shadow:0 3px 5px;cursor:pointer}.my-projects .my-other-projects .small-project .mobile-header{display:none}.my-projects .my-other-projects .small-project p{font-size:1.7rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;color:#fff;position:absolute;opacity:0;transition:opacity .5s ease;display:flex}.my-projects .my-other-projects .small-project img{width:500px;height:auto;transition:opacity .5s ease}.my-projects .my-other-projects .small-project .surf-club,.my-projects .my-other-projects .small-project .coloring-game{width:500px;height:250px}.my-projects .my-other-projects .small-project .swedish-quiz{width:500px;height:auto}.my-projects .my-other-projects .small-project .document-creator,.my-projects .my-other-projects .small-project .webshop{width:500px;height:250px}.my-projects .my-other-projects .small-project:hover img{opacity:.3}.my-projects .my-other-projects .small-project:hover p{opacity:1}.contacts{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.contacts h3{text-transform:uppercase;color:#fff;font-size:1.7rem;text-align:center}.contacts p{font-size:1.6rem;text-align:center;color:#fff}.contacts .headers{display:flex;flex-direction:row;justify-content:center;gap:150px}.contacts .headers h5{font-size:2rem;text-align:center;color:#fff}.contacts .headers .name-and-link{display:flex;flex-direction:row;gap:20px}.contacts .headers .name-and-link p{margin:0}.contacts .headers .name-and-link .icon{fill:#fff;height:auto;width:27px;margin-top:5px}footer{background-color:#061a36;box-shadow:0 0 0 1px #525252;width:100%;height:300px;display:flex;flex-direction:column;justify-content:center}footer .footer-list{display:flex;justify-content:center;gap:40px}footer .footer-list a{color:#535c91;text-decoration:none}footer .footer-list li{list-style:none;display:inline;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:1.2rem;text-transform:uppercase}footer .footer-icons{display:flex;flex-direction:row;justify-content:center;gap:50px;margin-top:20px}footer .footer-icons .icon{height:auto;width:30px;fill:#535c91}.fading-line-horizontal{margin:100px auto;width:80%;height:1px;background:linear-gradient(to right,#76767600,#767676 20%,#767676 80%,#76767600)}.fading-line-horizontal-footer{margin:0 auto;width:80%;height:1px;background:linear-gradient(to right,#76767600,#767676 20%,#767676 80%,#76767600)}.fading-line-vertical{width:1px;height:300px;margin-bottom:40px;background:linear-gradient(to bottom,#76767600,#767676 20%,#767676 80%,#76767600)}}