nav{background-color:transparent;color:#222020;position:absolute;font-family:Inter;font-size:12px;top:0;left:50%;transform:translate(-50%);border-radius:10px;border-top:10px;padding-top:10px;display:flex;justify-content:center;align-items:center}nav ul{list-style-type:none;margin:0;padding:0;justify-content:center;display:flex}nav li{display:flex;color:#302d2d;text-align:center;padding:14px 16px;text-decoration:none;position:relative;font-family:Inter}.About,.Projects,.Contact{cursor:pointer;transition:transform .3s ease}.About:hover,.Projects:hover,.Contact:hover{transform:scale(1.2)}.AboutCard,.ContactCard{display:flex;position:absolute;top:20%;left:42.5%;transform:translate(-50%);width:280px;height:400px;opacity:1;transition:opacity .3s ease;box-shadow:2px 2px 5px #00000080;border-radius:10px;justify-content:center;align-items:center;background:#ffffff1a;border-top:2px solid rgba(255,255,255,.1);border-left:2px solid rgba(255,255,255,.1);border-right:2px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:2px solid rgba(255,255,255,.1);animation:fadeIn 1s ease}.ProjectsCard{display:flex;position:absolute;top:10%;left:29%;transform:translate(-50%);transition:opacity .3s ease;width:780px;height:680px;opacity:1;box-shadow:2px 2px 5px #00000080;border-radius:10px;justify-content:center;align-items:center;background:#ffffff1a;border-top:2px solid rgba(255,255,255,.1);border-left:2px solid rgba(255,255,255,.1);border-right:2px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:2px solid rgba(255,255,255,.1);animation:fadeIn 1s ease}.AboutCard,.ProjectsCard,.ContactCard{display:flex;opacity:1;transform:translateY(0)}nav li:hover{text-decoration-line:underline;text-underline-offset:5px;text-decoration-thickness:1px;transition:text-decoration .3s ease}.ProfilePic{position:absolute;width:100%;height:50%;top:10px;object-fit:contain;margin:5px}.text{position:absolute;top:70%;left:25%;transform:translate(-50%,-50%);color:#222020;font-size:12px;font-family:Inter;text-align:left;width:40%}.Line{font-family:inter;position:absolute;top:70%;left:50%;transform:translate(-50%,-50%);width:3px;height:30%;background:gray}.Skills{font-family:inter;position:absolute;top:59%;left:53%;transform:translateY(-100%);font-size:12px}.SkillLogo,.SkillLogo img:hover,.SkillLogo img{width:30px;height:30px;margin:5px;animation:fadeIn 1s ease;transition:transform .3s ease}.SkillLogo:hover{transform:scale(1.2)}.SkillsContainer{position:absolute;top:101%;left:44%;transform:translateY(-50%);display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;align-content:flex-start;align-items:center;width:40%;height:80%;padding:5px}strong{cursor:pointer;transition:transform .3s ease}strong:hover{transform:scale(1.2)}.Resume{position:absolute;top:42%;left:18%;transform:translate(-50%,-50%);font-size:12px;font-family:Inter;color:#222020;cursor:pointer;transition:transform .3s ease;color:#000;height:33px;width:100px;background-color:#d9dde2;border-radius:4px;border-left-color:#faebd7;border-right-color:#faebd7;border-top:3px snow;border-left:3px snow}:root{font-family:Inter}.bg{position:relative;animation:fadeIn 3s ease-in-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.bg:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid rgba(255,255,255,.1)}.bg img{width:75%;height:75%;object-fit:cover;display:block;margin:-7% auto;transform:rotate(10deg)}.top-left-rexism{position:relative;top:-1200px;left:px}.top-left-rexism img{width:65px;height:auto;transition:transform .3s ease}.top-left-rexism img:hover{transform:scale(1.1)}