.animation{width:100%;height:100px;position:relative;overflow:hidden}.ball{width:50px;height:50px;background-color:#747fe0;border-radius:50%;position:absolute;bottom:0;animation:bounce .5s infinite ease-in-out,moveSideways 8s infinite linear}.shadow{width:50px;height:10px;background-color:#0000004d;position:absolute;bottom:10px;left:0;border-radius:50%;animation:shadowScale 4s infinite linear}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-50px)}}@keyframes moveSideways{0%{left:0}to{left:100%;transform:translate(-100%)}}@keyframes shadowScale{0%,to{transform:scaleX(1);opacity:.5}50%{transform:scaleX(.5);opacity:.2}}.winky-sans{font-family:Winky Sans,sans-serif;font-optical-sizing:auto;font-weight:600;font-style:normal}.andada-pro{font-family:Andada Pro,serif;font-optical-sizing:auto;font-weight:600;font-style:normal}.fade-in{opacity:0;animation:fadeIn 2s forwards}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.float{animation:float 2s infinite alternate ease-in-out}@keyframes float{0%{transform:translateY(0)}to{transform:translateY(-10px)}}header .nav--bar{height:100%;background-color:#747fe0;border-radius:4px;width:100%;display:flex;flex-wrap:wrap;justify-content:flex-end;align-content:center}header .nav--bar ul{display:flex;gap:30px;padding:0;margin:0;list-style:none}header .nav--bar li{display:flex}header .nav--bar a{text-decoration:none;color:#f5f5f5;font-weight:700;font-size:larger;padding:15px}.hover{background-color:#747fe0;font-size:x-large}.name{display:flex;flex-wrap:wrap;justify-content:flex-start;font-size:40px;color:#747fe0}h1:before{content:"> "}.intro{margin:0}.main .detail{font-size:20px;color:#525f7f}.main .highlight{color:#747fe0;font-weight:bolder;font-size:25px}.extra--info{flex:1;display:flex;flex-direction:column;flex-wrap:wrap}.extra--info .upper--bar{background-color:#e4e3e5;width:100%;height:20px;display:flex;justify-content:left;border-top-left-radius:10px;border-top-right-radius:10px}.extra--info .upper--bar .content{display:flex;flex-direction:row}.extra--info .content .color{width:10px;height:10px;border-radius:50%;margin:5px}.extra--info .lower--bar{width:100%;background-color:#5a5d7a;font-size:20px;border-bottom-right-radius:10px;border-bottom-left-radius:10px}.extra--info .lower--bar .command{color:#fff;margin:0;padding:25px 0 5px 20px}.extra--info .lower--bar .command:before{content:"> "}.extra--info .lower--bar .info{color:#e7d184;margin:0;padding:2px 0 15px 20px}.main .projects{text-align:center;padding-top:30px}.project-slider{display:flex;flex-direction:column;align-items:center;gap:1.5rem;padding:1rem}.project-card{width:100%;max-width:600px;background-color:#efeff4;border:.5rem solid #747fe0;padding:1.5rem;border-radius:1rem;box-shadow:0 4px 8px #0000001a;transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;word-wrap:break-word;overflow-wrap:break-word}.project-title{font-size:1.5rem;color:#333}.project-description{font-size:1rem;margin:1rem 0;color:#444}.project-link{color:#3a3ae0;text-decoration:none;font-weight:700}.project-link:hover{text-decoration:underline}.project-card.hover{transform:scale(1.05);border-color:#3a3ae0;box-shadow:0 8px 16px #0003;transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}.contact--me{display:flex;flex-direction:column;align-items:center}.contact--me .heading{margin:auto}.contact--me .info ul{display:flex;flex-wrap:wrap}.contact--me .info li{list-style:none;margin:10px 10px 20px 5px}.contact--me .info a{text-decoration:none;color:#383f3d;padding:10px;margin:10px;font-family:andada-pro,sans-serif}.contact--me.info li a:hover{color:#747fe0;font-size:large}footer{position:sticky;font-size:small;color:#1009398b;text-align:center;justify-content:center}.spotify-section .command{color:#fff;margin:0;padding:25px 0 5px 20px}.spotify-section .command:before{content:"> "}.spotify-content{color:#e7d184;padding:0 0 15px 20px}.spotify-content .track-list{list-style:none;padding:0;margin:0}.spotify-content .track-item{display:flex;align-items:center;gap:10px;padding:5px 0}.spotify-content .track-item img{width:40px;height:40px;border-radius:4px}.spotify-content .track-info{display:flex;flex-direction:column}.spotify-content .track-name{color:#fff;font-size:14px}.spotify-content .artist-name{color:#aaa;font-size:12px}.spotify-content .now-playing{display:flex;align-items:center;gap:15px}.spotify-content .album-art{width:60px;height:60px;border-radius:4px}.spotify-content .track-details{display:flex;flex-direction:column}.spotify-content .playing-label{color:#1db954;font-size:12px;font-weight:700}.spotify-content .spotify-link{color:#1db954;font-size:12px;text-decoration:none}.spotify-content .spotify-login-btn{background-color:#1db954;color:#fff;border:none;padding:10px 20px;border-radius:20px;cursor:pointer;font-size:14px;font-weight:700}.spotify-content .spotify-login-btn:hover{background-color:#1ed760}
