.top-nav .btn {
    display:inline-block;
}
.top-nav {
    border:1px solid #ccc;
    margin:20px;
    padding:20px;
}

.kopje {
    color: #008;
}

.list-of-tasks{
    max-width:800px;
    margin-top: 20px;
    margin-bottom: 20px;
}

form label {
    display:inline-block;
    width:100px;
}

.to-login.btn  {
    margin:20px;
}

.btn a, span.btn {
    text-decoration:none;
    color:black;
    background-color:#eee;
    border: 1px solid #ccc;
    border-radius:9px;
    padding: 4px 20px;
}
.row .btn {
  background-color: #eee;
  border: 1px solid #aaa;
  border-radius: 8px;
  text-align: center;
  cursor: pointer;
  padding: 2px 10px;
}

.list-of-tasks .row.header div{
    font-weight:600;
}
.list-of-tasks .row > .description{
    display:none;
}
.list-of-tasks .row > .created-at {
    display:none;
}
.list-of-tasks .row.completed > div.title{
    background-color: #efe;
}
.list-of-tasks .row.todo > div.title {
    background-color: #fee;
}
.list-of-tasks .row{
    display:grid;
    grid-template-columns: 30% 60% 10%;
    margin:3px;
}
.row.data > div{
    background-color: #eee;
    margin:3px;
    padding:3px;
}

.row .overdue{
    border-bottom: 1px solid #c00;
    color: #c00;
}
.list-of-tags .row{
    display:grid;
    grid-template-columns: repeat(2, 1fr);
    margin:3px;
}
.edit-form .descr-html {
    border:1px solid #ccc;
    padding:5px;
}
.edit-form div {
    margin:4px;
    
}
.edit-form .created {
    display:grid;
    width:100%;
    grid-template-columns:80% 20%;
}
.edit-form textarea {
    width:100%;
    height:200px;
}
.row.data .edit-form {
    margin:10px;
    padding:20px;
    background-color: #eef;
    grid-column-start: 1;
    grid-column-end: 4;
}
.edit-form .with-btn{
    text-align:right;
}
.edit-form .tags {
    border: 1px solid #ccc;
}
.edit-form .current-tags > span {
    margin:2px;
    padding:2px 10px;;
    background-color:white;
    border:1px solid #88c;
    border-radius:8px;
}

#tasks-with-tag-id {
    width:300px;
}

#task-category-buttons {
    margin: 20px 2px;
}
#task-category-buttons span {
    background-color: #eee;
    margin: 2px;
    padding: 2px 10px;
}
#task-category-buttons span.current {
    border-bottom:2px solid red;
}