:root{--base-font-size:16px;--bg-dark-blue:#112d4e;--bg-third-blue:#3f72af;--bg-second-blue:#dbe2ef;--bg-white:#f9f7f7;--font-yellow:#ffde7d;--font-white:#f9f7f7;--font-dark-blue:#112d4e;--shadow:#b2b2b2}body,html{margin:0;padding:0;height:100%;display:flex}h1{font-size:30px}h2{margin:.75em 0}h2,h4{font-size:24px}p{font-size:20px}.page{display:flex;min-height:100vh;background-color:var(--bg-second-blue)}.left-section{flex:1;flex-direction:column;color:var(--font-yellow)}.left-section,.right-section{display:flex;background-color:var(--bg-third-blue);padding:20px}.right-section{flex:2;flex-direction:column;color:var(--bg-dark-blue)}.Topbar-container{background-color:var(--bg-white);border-radius:10px 10px 0 0;color:var(--font-dark-blue);font-family:Arial,sans-serif;padding:40px 100px;box-shadow:0 2px 2px rgba(0,0,0,.15);z-index:100;position:relative}.Topbar{display:flex;gap:40px}.tab-item{font-size:20px;cursor:pointer;padding:5px 5px 5px 0;border-radius:5px;transition:background-color .3s,color .3s;color:var(--shadow)}.tab-item.active,.tab-item:hover{color:var(--bg-dark-blue)}.tab-item.active{font-weight:700}@media screen and (max-width:480px){*{box-sizing:border-box}body,html{width:100%;overflow-x:hidden}.aboutme{width:100vw;padding:20px!important;margin:0 auto;box-sizing:border-box}.aboutme-inner{width:100%}.skill-name,p{font-size:16px}p{line-height:1.5}.left-section{display:none!important}.right-section{flex:1;width:100%}.github-wrapper{display:none!important}.Topbar-container{padding:20px}.Topbar,.Topbar-container{width:100%;box-sizing:border-box}.Topbar{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}.tab-item{font-size:18px;padding:10px}.aboutme,.aboutme-inner{width:100%;max-width:100%;padding-left:16px;padding-right:16px;box-sizing:border-box}.project-page{padding:20px!important}.projects-container{flex-direction:column;gap:16px}.project{width:100%;padding:16px}.resume-container{padding:20px!important}.resume img{max-width:100%}}@media screen and (max-width:1024px){*{box-sizing:border-box}body,html{width:100%;overflow-x:hidden}.aboutme{width:100vw;padding:20px!important;margin:0 auto;box-sizing:border-box}.aboutme-inner{width:100%}.skill-name,p{font-size:16px}p{line-height:1.5}.github-wrapper{display:none!important}.personal-photo{width:250px!important;height:250px!important}.right-section{flex:1;width:100%}.sidebar a,.sidebar h2,.sidebar span{font-size:14px!important}.Topbar-container{padding:20px}.Topbar,.Topbar-container{width:100%;box-sizing:border-box}.Topbar{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}.tab-item{font-size:18px;padding:10px}.aboutme,.aboutme-inner{width:100%;max-width:100%;padding-left:16px;padding-right:16px;box-sizing:border-box}.project-page{padding:40px!important}.projects-container{flex-direction:column;gap:16px}.project{width:100%;padding:16px}.resume-container{padding:20px!important}.resume img{max-width:100%}}@media screen and (max-width:1280px){*{box-sizing:border-box}body,html{width:100%;overflow-x:hidden}.resume-container{padding:20px!important}.Topbar-container,.project-page{padding:40px 80px!important}.personal-photo{width:300px!important;height:300px!important}}