body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}*{margin:0;padding:0;box-sizing:border-box}.app{width:100vw;height:100vh;display:flex;flex-direction:column;align-items:center;background-color:#000}.heading{color:#fff;margin:10px 10px 0;padding:10px;font-size:45px;border:none;z-index:1}.input{width:95%;display:flex;position:relative;align-items:center}.input_box{width:100%;border-radius:50px;padding:20px 30px;margin:10px black;font-size:20px;border:none;transition:.2s;box-shadow:inset 0 0 5px #000}.input_box:focus{box-shadow:0 0 100px 1000px #00000080;border:none}.input_button{color:#fff;height:53px;width:53px;border-radius:50px;border:none;background-color:#52528b;font-size:20px;position:absolute;right:0px;margin:13px;transition:.2s;box-shadow:0 0 10px #000;cursor:pointer}.input_button:hover{background-color:#299929}.input_button:active{transform:scale(.5);box-shadow:0 0 7px #000}.container{width:95%;margin-top:10px;align-items:flex-start;padding:6px}.todos{display:flex;flex-direction:column;max-width:100%;padding:16px;border-radius:5px;background-color:#409ea5;margin-bottom:10px}.todos_remove{display:flex;width:100%;flex-direction:column;padding:16px;border-radius:5px;background-color:#479047}.dragactive{background-color:#07e8f8}.dragcomplete{background-color:green}.singledrag{box-shadow:0 0 25px #000}.todos_heading{font-size:30px;color:#fff}.todos_single{display:flex;background-color:#ff0;margin-top:10px;padding:10px 20px;border-radius:5px;transition:.2s}.todos_single:hover{box-shadow:0 0 5px #000;transform:scale(1.06)}.todos_single--text{flex:1;padding:4px;border:none;font-size:22px}.todos_single--text:focus{outline:none}.icon{cursor:pointer;margin-left:10px;font-size:25px}.icon_edit:hover{color:#00f}.icon_edit:active{transform:scale(.8)}.icon_delete:hover{color:red}.icon_delete:active{transform:scale(.8)}.icon_done:hover{color:#02b302}.icon_done:active{transform:scale(.8)}@media (max-width: 700px){.input{width:95%}.todos,.todos_remove{width:95%;margin-bottom:10px}.container{width:95%;flex-direction:column}}