.sidenav{display:flex;flex-direction:column;height:100vh;width:0;position:fixed;z-index:1000;top:0;left:0;background-color:#202123;overflow-x:hidden;transition:width .5s ease;padding-top:3rem}.navigation{display:flex;align-items:center;flex-direction:column}.nav-pages{padding:1rem 0 0}.nav-pages li{list-style:none}.nav-pages a{display:flex;align-items:center;text-decoration:none;font-size:1.2rem;color:#ccc;transition:.3s;margin-bottom:1rem}.nav-social-links{display:flex;list-style:none;flex-direction:row;position:absolute;font-size:1.1rem;bottom:0;padding-inline-start:20px}.nav-social-links a{margin-left:-.2em;margin-right:1em;justify-content:center;color:#ccc}.nav-pages a:hover,.nav-social-links a:hover{color:#f1f1f1;transform:scale(1.02);transition:transform .3s;text-shadow:0 0 1px #f1f1f1}.sidenav-content{display:flex;flex-direction:column;align-items:center}.my-image{width:125px;height:125px;border-radius:50%;object-fit:cover;border:3px solid #444}.brand-holder-one a{color:#ccc;text-decoration:none;font-weight:400}.brand-holder-sub{margin:0 0 1em;padding:0}.style-one{border:0;margin-top:1rem;width:60%;height:2px;text-align:center;background-image:linear-gradient(to right,transparent,rgba(102,102,102,.75),transparent)}@media only screen and (min-width:1024px){.sidenav{display:flex!important;transition:transform .3s ease;width:260px}}