.Header{max-width:580px;margin:0 auto 40px}.Header h1{font-size:3rem;transition:font-size .5s ease;font-weight:600;margin-bottom:1rem;line-height:1em;text-transform:lowercase;text-align:center;color:#aeadad}.About{height:100vh;padding:0 50px 20px}.About__wrapper__list{list-style:none;display:inline-block;margin-bottom:20px}.About__wrapper__list a{font-size:1rem;transition:font-size .5s ease;color:#4d4c4c;text-transform:lowercase;text-decoration:none;display:inline-block;padding:10px 10px 10px 0}.About__wrapper__list .active{color:#8a4baf}.About__wrapper .About__wrapper__content{max-width:500px}.About__wrapper .About__wrapper__content h2,.About__wrapper .About__wrapper__content p{color:#4d4c4c}.About__wrapper .About__wrapper__content h2{font-size:2rem;transition:font-size .5s ease;padding-top:20px;border-top:10px solid #8a4baf}.About__wrapper .About__wrapper__content p{font-size:1rem;transition:font-size .5s ease;margin-top:20px}.Input__container{font-size:1rem;display:flex;justify-content:space-around;background:#fff;box-shadow:0 4px 14px #46464661;border-radius:10px;margin-top:10px}.Input__container ::placeholder{color:#4d4c4c}.Input__container__text{font-size:1rem;width:85%;padding:0 5px 0 10px;border-radius:10px}.Input__container__addbtn{font-weight:600;background-color:transparent;margin-right:10px;cursor:pointer}.Input__container__text,.Input__container__addbtn{height:45px;outline:none;border:none}.Input__warning{font-size:.75rem;color:red;margin-top:5px;display:block}.TaskItem{font-size:1rem;list-style-type:none;padding:15px 25px;color:#4d4c4c;background-color:#f0efef;border-bottom:1px solid white}.TaskItem__content{display:flex;justify-content:space-between;align-items:center;gap:1rem}.TaskItem__content__checkbox{accent-color:#8a4baf}.TaskItem__content button{cursor:pointer;background-color:transparent;outline:none;border:none}.TaskItem__content span{flex:1}.TaskItem__content span.completed{font-style:italic;color:#595959;opacity:.4;text-decoration:line-through}.TaskItem__editsection{width:100%;margin-top:1rem;padding:.8rem;border:1px solid #dfdfdf;outline:none}.Content{width:300px;margin:0 auto}.Content .Input{margin-top:20px}.Content .TaskList{margin-top:10px}.Home{height:100vh;padding:0 50px 20px}.Home .text{margin-bottom:40px}.Home p{font-size:1rem;transition:font-size .5s ease;text-align:center;color:#aeadad}.Profile{height:100vh;padding:0 50px 20px}.Profile p{font-size:1rem;transition:font-size .5s ease}.Profile__content{display:flex;flex-direction:column;align-items:center;gap:20px;color:#4d4c4c}.Profile__content h2{font-size:2rem;transition:font-size .5s ease;text-align:center}.Profile__content h2 span{color:#8a4baf}.Profile__content img{width:100px;height:100px;object-fit:cover;object-position:bottom;border-radius:50%}.Profile__content__switch{display:flex;flex-direction:column;align-items:center;margin-top:20px}.Profile__content__switch__btn{font-size:1rem;display:flex;justify-content:center;align-items:center;width:80px;height:30px;margin:10px 0;padding:10px;outline:none;border:none;color:#fff;background-color:#8a4baf;box-shadow:0 4px 14px #46464661;border-radius:10px;transition:height .5s ease,font-size .5s ease}.Login__wrapper{display:flex;justify-content:center;margin-top:100px}.Login__wrapper__form{width:100%;max-width:500px;display:flex;flex-direction:column}.Login__wrapper__form input{height:50px;font-size:1rem;padding:10px 20px;color:#4d4c4c;outline:none;border-radius:3px;border:1px solid #4d4c4c}.Login__wrapper__form button{width:100%;height:50px;font-size:1.5rem;font-weight:700;text-transform:uppercase;margin-top:20px;color:#fff;background-color:#8a4baf;border:none;outline:none;border-radius:3px}.Navbar{width:100%;height:130px;display:flex;justify-content:space-between;padding:0 40px}.Navbar button{cursor:pointer;color:#4d4c4c;background:transparent;border:none}.Navbar__right__logout{color:#8a4baf;right:0;display:flex;justify-content:space-around;align-items:center;gap:1rem}.Navbar__right__logout p,.Navbar__right__logout button{font-size:1.125rem;transition:font-size .5s ease}.Navbar__left{align-self:center}.Navbar__left__menu-toggle .mdclose,.Navbar__left__menu-toggle .fimenu{font-size:2rem;transition:font-size .5s ease}.Navbar__left__menu-nav{max-width:290px;font-size:1rem;list-style:none;background-color:#fff;position:absolute;top:130px;left:0;width:0;overflow:hidden;z-index:9;box-shadow:0 10px 15px -3px #2e293314,0 4px 6px -2px #473f4f29;transform:translate(-100px);transition:transform ease-in-out .2s}.Navbar__left__menu-nav li a,.Navbar__left__menu-nav li span{display:block;padding:1rem;text-decoration:none;color:#4d4c4c}.Navbar__left__menu-nav li span{color:#8a4baf;font-style:italic}.Navbar__left__menu-nav.show-menu{width:100%;transform:translate(0)}.Navbar__left__menu-nav .active{color:#8a4baf;border-left:5px solid #8a4baf;background-color:#e6e6e6}.Navbar__left__menu-nav__log-in{font-size:.75rem;border-top:1px solid #efecec;margin-top:20px}.Layout{display:flex;flex-direction:column}:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-size:16px;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}*{box-sizing:border-box;margin:0;padding:0}.About.dark,.Profile.dark,.Navbar.dark,.Home.dark{background-color:#141e33}.About.dark h2,.About.dark p,.Profile.dark h2,.Profile.dark p,.Navbar.dark h2,.Navbar.dark p,.Home.dark h2,.Home.dark p,.About.dark a{color:#aeadad}.About.dark .active{color:#8a4baf}.Navbar.dark button{color:#aeadad}.Navbar.dark p{color:#8a4baf}@media screen and (min-width: 768px){.Navbar .mdclose,.Navbar .fimenu{font-size:2.5rem;transition:font-size .5s ease}.Navbar__right__logout p,.Navbar__right__logout button{font-size:1.5rem;transition:font-size .5s ease}.Header h1{font-size:5rem;transition:font-size .5s ease}.Header p{font-size:1.25rem;transition:font-size .5s ease}.Content{width:580px}.Home p{font-size:1.25rem;transition:font-size .5s ease}.About__wrapper{display:grid;grid-template-columns:200px minmax(0,1fr);gap:50px}.About__wrapper__list a{font-size:1.25rem;transition:font-size .5s ease}.About__wrapper .About__wrapper__content{border-left:10px solid #8a4baf;padding-left:30px}.About__wrapper .About__wrapper__content h2{border:none;padding-top:0;font-size:2.5rem;transition:font-size .5s ease}.About__wrapper .About__wrapper__content p,.Profile p{font-size:1.25rem;transition:font-size .5s ease}.Profile__content__switch__btn{font-size:1.25rem;height:40px;transition:height .5s ease,font-size .5s ease}.Profile__content h2{font-size:2.5rem;transition:font-size .5s ease}}