*{margin:0;padding:0}body{padding:2rem;font-family:Arial,Helvetica,sans-serif;background-color:#222}.form{width:80%;display:grid;grid-template-columns:2fr 6fr 1fr;margin:0 auto}.form input:first-child{margin-left:0}.form button:last-child{margin-right:0}.tasks{display:flex;padding:5px;background-color:#333;margin:5px auto;border-radius:10px;width:80%;box-sizing:border-box}.pull-left{display:flex}.pull-right{margin-left:auto;margin-right:0;display:flex}.buttons button{height:100%;margin-top:0}p{padding-top:10px;padding-left:10px;color:#fff;stroke:#fff}p:last-child{padding-bottom:10px}input,button{border-width:0;border-radius:10px;padding:15px;color:#fff;margin:3px;font-size:15px}button{cursor:pointer}input{background-color:#333;outline:none;min-width:none}.danger-btn{background-color:#f33}.secondary-btn{background-color:#888}.primary-btn{background-color:#55f}.name{font-size:20px}.description{color:#d3d3d3}input[type=checkbox]{width:25px}.completed{display:flex;align-items:center}.completed span{border-radius:5px;color:#fff;padding:5px;margin:5px;background-color:#31b731}.completed-info p{text-decoration:line-through;text-decoration-thickness:2px}.modal{position:fixed;z-index:1;left:0;top:0;width:100%;height:100%;background-color:#000;background-color:#0009}.modal-disabled{display:none}.modal-content{background-color:#444;margin:5% auto;padding:10px;border-radius:10px;width:80%}.close{color:#fff;text-align:right;float:right;padding:5px 15px;font-size:30px;cursor:pointer}.modal-input{display:flex;flex-direction:column;clear:both}@media (max-width: 800px){body{padding:1rem}.form{width:100%;grid-template-columns:1fr}.form *{margin-left:0;margin-right:0}.tasks{width:100%;display:block}.pull-right span{margin-left:auto;margin-right:auto;width:100%;text-align:center}.pull-right{margin:0;display:block}.pull-right .buttons{display:grid;grid-template-columns:1fr 1fr;width:100%}.pull-right .buttons button:first-child{margin-left:0}.pull-right .buttons button:last-child{margin-right:0}.modal-content{margin:30% auto}}