.timeline{position:relative}.container{width:50%}.content{padding:1em;box-sizing:border-box;border:2px solid hsla(0,0%,100%,.2);margin:0 40px;border-radius:10px}.before:before{left:calc(0% - 2px)}.after:after,.before:before{content:"";position:absolute;width:15px;height:15px;border-radius:50%;background-color:#979696;top:10%;transform:translate(-50%,-50%)}.after:after{right:calc(0% - 17px)}.container:nth-child(odd){border-left:3px solid #423b3b;transform:translateX(100%)}.container:nth-child(2n){border-right:3px solid #423b3b;transform:translateX(2.5px)}@media screen and (max-width:768px){.container:nth-child(odd){transform:translateX(0);border-left:0 solid #423b3b}.container:nth-child(2n){border-right:0;transform:translateX(0)}.timeline{display:flex;justify-content:center;align-items:center}.main{border-left:3px solid #423b3b;margin:0 auto;display:flex;flex-direction:column;row-gap:40px}.container,.main{width:100%}.content{padding:1em;box-sizing:border-box;background-color:transparent;border:1px solid #423b3b;border-radius:10px;margin-top:-5px!important}.content:before{content:"";position:absolute;width:15px;height:15px;border-radius:50%;background-color:#979696;left:calc(0% - 2px);top:0;transform:translate(-50%,-50%)}.content:nth-child(odd){margin:0 30px}.before:before{content:""}.after:after{content:"";display:none}}.navbar{position:relative;border-radius:100px;height:64px;margin:32px}.navbar:after,.navbar:before{content:"";position:absolute;top:50%;left:50%;translate:-50% -50%;background:linear-gradient(90deg,orange,pink,lime);padding:3px;width:100%;height:100%;border-radius:100px;box-sizing:content-box;z-index:-1}.navbar:before{filter:blur(10px)}.nav-item{border:1px solid transparent;position:relative;z-index:2}.nav-item:hover{border-radius:100px;cursor:pointer;position:relative}@keyframes navItemLarge{0%{width:20px;height:20px;border-radius:0;filter:blur(5px)}to{width:100%;height:100%;border-radius:100px;filter:blur(10px)}}.nav-item:before{padding-inline:24px;border-radius:100px;background:#181824;z-index:-1;color:#fff}.nav-item:before,.nav-item:hover:after{content:"";position:absolute;top:50%;left:50%;translate:-50% -50%;width:100%;height:100%}.nav-item:hover:after{background:linear-gradient(90deg,orange,pink,lime);box-sizing:content-box;z-index:-2;transition:all .2s;animation:navItemLarge .5s forwards}.project-section::-webkit-scrollbar{width:0;height:0;background:transparent}.project-desc{-webkit-line-clamp:9;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.project-card{border:1px solid #333}.code-bg{font-size:72px}