*{margin:0}:root{display:flex;justify-content:center;align-items:flex-start;max-height:100vh;font-family:Montserrat,sans-serif}body{width:100vw;display:flex;justify-content:center}#task-manager{display:flex;flex-flow:column wrap;gap:25px;width:80vw;margin-top:40px;max-height:100%}h2{font-size:2rem}.form{display:flex;justify-content:space-between;flex-flow:row nowrap;gap:20px}.input{border:1px solid rgba(0,0,0,.164);min-height:45px;padding:0 20px;font-size:1.25rem;border-radius:10px;width:100%;box-shadow:0 2px 5px #0000001c;transition:box-shadow .2s}.input:focus{outline:3px solid #5d8bff}#navbarre{display:flex;flex-flow:row wrap;justify-content:space-between;gap:20px}.sortButtons{display:flex;justify-content:space-between;gap:10px}.button{border:0;font-size:1.2rem;padding:10px 15px;border-radius:8px;transition:background-color .2s,color .2s}.selected{background-color:#1b57f3;color:#fff}#selector:focus{outline:3px solid #5d8bff}#selector{font-size:1.2rem;padding:10px 15px;border-radius:8px}.option{font-size:1.2rem}#task-list{max-width:100%;max-height:570px;height:100%;overflow-y:auto}#task-contener{display:flex;height:max-content;flex-direction:column}.task{margin-bottom:10px;display:flex;flex-flow:row wrap;justify-content:space-between;gap:20px;align-items:center;border:1px solid rgba(0,0,0,.164);min-height:35px;max-height:200px;overflow-y:auto;overflow-x:hidden;max-height:none;padding:10px 20px;font-size:1.25rem;border-radius:10px;box-shadow:0 2px 5px #0000001c;transition:box-shadow .2s}.checkbox{min-width:20px;min-height:20px}.checked{color:#696969;text-decoration:line-through}.date{display:flex;justify-content:center;align-items:center;font-size:1rem;color:#5e5e5e}.priority{border:0;border-radius:10px;padding:5px 7px;border:1px solid rgba(0,0,0,0);transition:border .2s}.low{background-color:#f2f2f6}.medium{background-color:#fbfac4;color:#9c7934}.high{background-color:#fddde0;color:#a8354f}.task-info{display:flex;gap:20px}.sub-task{min-height:40px;height:max-content;display:flex;flex-flow:row wrap;gap:10px;justify-content:space-between;align-items:center;overflow-wrap:anywhere;min-width:100px}.remove{border:0;background-color:#0000;color:#a5a7b0;transition:color .2s;font-size:1.25rem}.priority:hover{border:1px solid rgba(0,0,0,.15)}.task:hover{box-shadow:0 2px 5px #0000004d}.remove:hover{color:#ce2149}