*{margin:0;padding:0;box-sizing:border-box}h1{margin:15px}#home{flex-direction:column}#home,#nav{display:flex;align-items:center}#nav{background-color:#039be5;justify-content:space-between;padding:0 0 0 5px;font-weight:500;font-size:16px}#note{margin-top:15px}#create,#note{display:flex;flex-direction:column;align-items:center}#create,#create form{justify-content:center}#create form{display:flex;flex-direction:column}#create form .btn{align-self:center}#create form label{margin:5px 0;align-self:center;font-weight:600}.taskCard{box-shadow:0 4px 8px 0 rgba(0,0,0,.2);transition:.3s;padding:15px 30px;word-break:break-all;max-width:600px;display:flex;justify-content:space-between;align-items:center;margin:5px 0}.tasks .editInput{width:80%}.nav-area{list-style:none}.nav-area li{padding:15px 15px;margin:0 0;display:inline-block;text-transform:uppercase;height:100%}.nav-area li a{text-decoration:none;color:#fff}.nav-area li:hover{background-color:#10affc;color:#f3f3f3}.custom-checkbox{position:absolute;z-index:-1;opacity:0}.custom-checkbox+label{display:inline-flex;align-items:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.custom-checkbox+label:before{content:"";display:inline-block;width:1em;height:1em;flex-shrink:0;flex-grow:0;border:1px solid #adb5bd;border-radius:.25em;margin-right:.5em;background-repeat:no-repeat;background-position:50%;background-size:50% 50%}.custom-checkbox:checked+label:before{border-color:#0b76ef;background-color:#0b76ef;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26l2.974 2.99L8 2.193z'/%3E%3C/svg%3E")}.custom-checkbox:not(:disabled):not(:checked)+label:hover:before{border-color:#b3d7ff}.custom-checkbox:focus+label:before{box-shadow:0 0 0 .2rem rgba(0,123,255,.25)}.custom-checkbox:focus:not(:checked)+label:before{border-color:#80bdff}.note__title{align-self:center;margin:10px;margin-bottom:25px;color:#666}.note__taskList{list-style:none;width:100%}.note__taskList label{width:100%}.note__buttons{width:100%;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-around;margin:10px 5px 5px 5px}.note__taskPoint{margin-top:20px;display:flex}.editInput{width:95%;font-size:13px;padding:6px 0 4px 10px;border:1px solid #cecece;background:#f6f6f6;border-radius:8px;outline:none}.cardNote{box-shadow:0 4px 8px 0 rgba(0,0,0,.2);transition:.3s;padding:15px 30px;margin-top:20px;word-break:break-all;max-width:900px;display:flex;flex-direction:column;justify-content:start;align-items:flex-start}.btn{box-shadow:inset 0 1px 0 0 #fff;background:-moz-linear-gradient(center top,#fff 5%,#f6f6f6 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#f6f6f6");background-color:#fff;border-top-left-radius:6px;border-top-right-radius:6px;border-bottom-right-radius:6px;border-bottom-left-radius:6px;text-indent:0;border:1px solid #dcdcdc;display:inline-block;color:#666;font-family:arial;font-size:15px;font-weight:700;font-style:normal;height:50px;line-height:50px;width:140px;text-decoration:none;text-align:center;text-shadow:0 1px 0 #fff;margin:4px 0}.btn:hover{background:-moz-linear-gradient(center top,#f6f6f6 5%,#fff 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#f6f6f6",endColorstr="#ffffff");background-color:#f6f6f6;cursor:pointer}.btn-undo-redo{max-width:70px;margin:4px 5px}.btn_delete_task{max-height:30px;max-width:50px;line-height:30px;margin-left:10px}.btn_add_task{width:40px;height:30px;line-height:30px;margin-left:5px}.addTaskInput{width:95%;font-size:13px;padding:6px 0 4px 10px;margin:10px;border:1px solid #cecece;background:#f6f6f6;border-radius:8px;outline:none}.addTaskModal .container_modal{display:flex;flex-direction:column}.addTaskModal .container_modal label{margin-top:5px;font-weight:600;align-self:center;font-family:arial;color:#666}.addTaskModal .container_modal .btn{align-self:center}.addTaskModal .container_modal .btnCloseModal{position:absolute;top:0;right:0;width:30px;height:20px;line-height:20px}.deleteNoteModal .container_modal{display:flex;flex-direction:column}.deleteNoteModal .container_modal p{margin-top:15px;font-weight:600;align-self:center;font-family:arial;color:#666}.deleteNoteModal .container_modal div{display:flex;justify-content:space-around;margin-top:15px}