*{box-sizing:border-box;margin:0;padding:0;font-family:Calibri,Trebuchet MS,sans-serif}html,body{height:auto;width:100%;background-color:var(--dark-gray);color:var(--light-text)}.header{padding:10px;margin-bottom:10px}.pending{padding:10px;margin-bottom:20px}#root{width:100%;height:100%;display:flex;flex-direction:column;align-items:center}:root{--dark-gray: #1a2a32;--gray: #2e4756;--turquoise: #3cc4bf;--yellow: #f2b147;--light-gray: #d3d3d3;--light-text: #dcdcdc}button{background-color:#008b8b;border:none;color:var(--light-text);padding:5px;border-radius:3px}button:hover{opacity:.9;cursor:pointer}.sorters{margin-bottom:15px}.sorters>button{margin:10px}.subject{margin:10px;width:90%;max-width:800px}table{border-collapse:collapse;width:100%}table,th,td{border:1px solid var(--light-text)}td,th{padding:5px;text-align:center}.add{margin-top:10px}.button-table{display:flex;justify-content:space-between}.tasks{display:flex;flex-direction:column;align-items:center;width:100%}.tasks>h2{margin-bottom:10px}.adding-task{width:100%;height:100vh;background-color:#1a2a32cc;position:fixed;left:0;top:0;display:flex;justify-content:center;align-items:center}.adding-contents{width:450px;height:250px;background-color:#2a4451;opacity:1;color:var(--light-text);padding:20px;border-radius:8px}.adding-contents>form{height:100%;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:space-around}.task-details{display:flex;gap:10px}.btns>button{margin:10px}@media (max-width: 450px){.adding-contents{width:350px}}input{background-color:transparent;border:none;border-bottom:1px solid var(--light-text);color:var(--light-text)}select{background-color:transparent;color:var(--light-text);border:1px solid var(--light-text)}input:focus{outline:none;border-bottom:2px solid var(--light-text)}#add-subject{width:450px;height:150px}