*{box-sizing:border-box}body{padding:0;margin:0;background-color:#000000de}.main-div{display:flex;justify-content:center;align-items:center;height:100vh;font-family:Roboto}.todolist-div{background-color:#fff;text-align:center;padding:5px}.todolist-div ul{padding:0;margin-top:-30px;background-color:#fff0}.mytodo{background-color:#00fc;color:#fff;display:flex;justify-content:space-between;padding:10px;align-items:center;margin:15px 0;transition:all .2s}.mytodo h2{margin-bottom:0}.mytodo p{margin-top:10px}.mytodo:hover{padding:20px 15px}.button-group{margin:25px 0}.button-group button:focus{color:red}.mytodo-icon button{padding:0;border-radius:50%;background-color:transparent;border:none;outline:none;cursor:pointer;transition:all .3s}.mytodo-icon button:hover{opacity:.7}.mytodo .mytodo-icon svg{margin:5px;border:none;border-radius:50%;padding:5px;width:1.5em;height:1.5em;background-color:#fff;outline:none}.mytodo .mytodo-icon button:first-of-type{border-color:red;color:red}.mytodo .mytodo-icon button:nth-of-type(2){border-color:#029802;color:#029802}.mytodo .mytodo-icon button:last-of-type{border-color:#2be02b;color:#2be02b}.add-buttons{margin-top:10px}.add-buttons input{padding:15px}@font-face{font-family:Roboto;src:url(/Todo-List/Roboto/static/Roboto-Bold.ttf);font-weight:700}@font-face{font-family:Roboto;src:url(/Todo-List/Roboto/static/Roboto-Light.ttf);font-weight:lighter}@font-face{font-family:Roboto;src:url(/Todo-List/Roboto/static/Roboto-Medium.ttf);font-weight:400}@font-face{font-family:Roboto;src:url(/Todo-List/Roboto/static/Roboto-Bold.ttf);font-weight:bolder}
