:root{--bg-color: #0b103f;--font-color: #cdced5;--link-color: lightblue;--text-color-1: rgba(0, 179, 119, 1);--text-color-2: rgba(214, 255, 127, 1);--headline-color: white}html{scroll-behavior:smooth}*{box-sizing:border-box;margin:0;padding:0}body{min-height:100vh;background-color:var(--bg-color);text-align:center;font-family:Work Sans,sans-serif;color:var(--font-color)}h1,h2,h3{font-family:Montserrat,sans-serif}h1{font-size:36px;color:var(--headline-color);animation:fadeInLeft 1s ease}h2{color:var(--font-color);font-weight:900}h3{color:var(--text-color-1)}a{color:var(--link-color);text-decoration:none}p{color:var(--font-color);font-size:14px;line-height:1.1rem}ul{list-style:none}nav{position:fixed;top:0;left:50%;transform:translate(-50%);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:6;width:100%}nav ul{display:grid;grid-template-columns:2fr 1fr 1fr;justify-content:center;margin:0 1rem}nav li{display:block}nav li a{display:block;text-align:center;padding:1rem;font-size:12px;color:#fff;font-weight:800;transition:color .3s ease,text-decoration .3s ease}nav li a:hover{color:var(--link-color);text-decoration:underline}nav ul li:nth-child(1){justify-self:start;margin-right:2rem}main{padding:0 10vw;display:flex;flex-direction:column;justify-content:space-around;gap:2rem}.img-info-container{display:flex;flex-direction:row;justify-content:center;gap:.7rem}.img-container{display:flex;justify-content:center;animation:fadeInUp 1s ease;padding-right:0;background-color:#404469;transition:1s all cubic-bezier(.075,.82,.165,1)}.img-container:hover{padding:5px 5px 5px 50px}.img-container img{z-index:1}.info-container{display:flex;flex-direction:column;justify-content:end;position:relative}.social-container{transition:1s all cubic-bezier(.075,.82,.165,1);position:absolute;top:0;right:-20px;opacity:0;display:flex;gap:5px;animation:fadeInUp 1s ease forwards .5s;background-color:var(--bg-color)}.social-container:hover{background-color:#404469;padding-left:100px}main hr{display:block;height:1px;border:0;width:0;border-top:1px solid #cdced5;position:absolute;bottom:8px;animation:slide-in 1s cubic-bezier(.42,0,1,1) forwards}.user-bio{margin-top:4rem;margin-bottom:2rem;opacity:0;animation:fadeInUp 1s cubic-bezier(.075,.82,.165,1) 1s forwards}.quote-container{padding:16px;background-color:#838596;opacity:1;border-radius:3px;filter:drop-shadow(0 0 0 rgba(54,54,54,.2));transition:.3s all cubic-bezier(.075,.82,.165,1);transform-origin:right;will-change:filter;animation:gradientAnimation 10s ease-in-out infinite}@keyframes gradientAnimation{0%{background:linear-gradient(-45deg,#1bb6b6,#d6ff7f)}50%{background:linear-gradient(-45deg,#d6ff7f,#1bb6b6)}to{background:linear-gradient(-45deg,#1bb6b6,#d6ff7f)}}.quote-container p{color:#000}.quote-container:hover{filter:drop-shadow(10px 10px 2px rgba(255,255,255,.25))}#project{padding:15vh 16px}#project h2{font-size:xx-large;text-align:left;margin-left:1rem}.project-container{display:grid;grid-template-columns:1fr;gap:12px;padding-top:5vh}.repository-container{border:1px solid #7b8383;display:flex;flex-direction:column;justify-content:space-evenly;gap:8px;padding:16px;border-radius:5px;background:#222431}.repository-container h3{text-align:left}.repository-container img{vertical-align:bottom}.repository-container p{font-size:12px}.repository-head{display:flex;flex-direction:row;gap:3px;justify-content:flex-start}.repository-description{text-align:left}.repository-language-used-container{display:flex;flex-direction:row;font-weight:lighter;gap:8px}.language-used{font-size:12px;color:#1bb6b6}.more-repo{margin-top:10px;display:block}.more-repo a{font-weight:800;color:var(--link-color)}#about{padding-top:15vh}.about-img-container{display:flex;justify-content:center;margin-bottom:20px}.about-img-container img{border-radius:50%;border:2px solid white}.about-social-container{margin:10px 0;display:flex;justify-content:space-around;padding:0 1em}#about p{margin:20px}.about-social-container li{display:flex;gap:5px;justify-content:space-between}.skill{display:grid;grid-template-columns:repeat(2,1fr);text-align:left;margin:0 30px}#about h3{text-align:left;margin:10px 20px}.skill li{line-height:30px}#about ul.skill li:before{font-size:10px;padding-right:10px;content:"▸";vertical-align:bottom}footer{padding:10vh}@media screen and (min-width: 768px){main{margin-left:20%;margin-right:20%}#about,#project,nav ul{margin-left:30%;margin-right:30%}}@media screen and (min-width: 1025px){.project-container{grid-template-columns:repeat(2,1fr)}.more-repo{display:block}.skill{grid-template-columns:repeat(3,1fr)}}@keyframes slide-in{to{width:115%}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInLeft{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes dropShadow{0%{opacity:0;scale:.9}to{opacity:1;scale:1}}@keyframes animated_text{0%{background-position:0px 50%}50%{background-position:100% 50%}to{background-position:0px 50%}}.gradient{text-align:center;font-size:2rem;background:linear-gradient(-35deg,var(--text-color-1) 0%,var(--text-color-2) 100%);background-size:300%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:animated_text 10s ease-in-out infinite}.center{display:flex;justify-content:center;align-items:center;min-height:100vh}.flex-end{align-items:flex-end;padding-bottom:15vh}