body {
    margin: 0;
    min-width: 250px;
    background-color: #fdf5e6;
}


/* Style the header */
.header {
    background-color: #f44336;
    padding: 30px 40px;
    color: white;
    text-align: center;
}
/* Clear floats after the header */
.header:after {
    content: "";
    display: table;
    clear: both;
}


/* input box settings */
input {
    margin: 0;
    border: none;
    border-radius: 0;
    width: 55%;
    padding: 10px;
    float: left;
    font-size: 16px;
}


/*add button settings*/
.addBtn {
    padding: 8.25px;
    width: 10%;
    background: #d9d9d9;
    color: #555;
    float: left;
    text-align: center;
    font-size: 16px;
    cursor: pointer;
    transition: 0.3s;
    border-radius: 0;
    border:2px solid rgb(90, 90, 90);
    border-left: 1px solid rgb(90, 90, 90);

}
.addBtn:hover {
    background-color: #bbb;
}

.buttonPersons{
    padding: 7.5px;
    width: 15%;
    background: #d9d9d9;
    color: #555;
    float: left;
    text-align: center;
    font-size: 16px;
    cursor: pointer;
    transition: 0.3s;
    border-radius: 0;
    border:2px solid rgb(90, 90, 90);
    border-right: 1px solid rgb(90, 90, 90);

}
.buttonPersons:hover {
    background-color: #bbb;
}


/*priority & persons button settings*/
.buttonDDL {
    padding: 7.5px;
    width: 8%;
    background: #d9d9d9;
    color: #555;
    float: left;
    text-align: center;
    font-size: 16px;
    cursor: pointer;
    transition: 0.3s;
    border-radius: 0;
    border:2px solid rgb(90, 90, 90);
    border-right: 1px solid rgb(90, 90, 90);

}
.buttonDDL:hover {
    background-color: #bbb;
}


/*Table size */
table{
    width: 100%;
    margin-bottom: 20px;
    border-collapse: collapse;
}


/*set table size*/
tr td{
    position: relative;
    padding: 12px 8px 12px 40px;
    list-style-type: none;
    font-size: 18px;
    transition: 0.2s;

    /* make the list items unselectable */
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    text-align: center;
}


/*Color odd rows*/
tr:nth-child(odd) td:nth-child(odd) {
    background-color: #ff000085; /* dark blue */
}
tr:nth-child(odd) td:nth-child(even) {
    background-color: #ff000098; /* dark blue */
}


/* color even rows */
tr:nth-child(even) td:nth-child(odd) {
    background-color: #f66e6e88; /* dark green */   
}
tr:nth-child(even) td:nth-child(even) {
    background-color: #f66e6e98; 
}


/*Color last cell upon hovering over it*/
tr td:last-child:hover{
    background-color: rgb(249, 60, 60) !important; 
    cursor: pointer;
}


/*Show selected row*/
tr:hover td {
    background-color: #d5d0d0 !important;
    cursor: pointer;
}


/*Row is completed*/
.completed {
    background-color: lab(0% 0 0 / 0.675) !important;
    text-decoration: line-through;
    text-decoration-color: #ffffff;
}



/*table head*/
th {
    padding: 12px 8px 12px 40px;
    list-style-type: none;
    background: #f44336db;
    font-size: 18px;
    transition: 0.2s;
    
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}