body{
    background-color: aliceblue;
}
img {
    height: 40px;
    margin: 5px;
}
input{
    height: 20px;
    margin: 5px;
    padding: 2.5px;
    border-radius: 5px;
    background-color:dodgerblue;
}
.flex {
    display: flex;
    justify-content:space-between;
    flex-flow: row wrap;
    width: 130px;
    border-radius: 7.5px;
    padding-right: 10px;
    background-color: aqua;
    margin: 10px;
}
.flexi {
    display: flex;
    justify-content:space-between;
    flex-flow: row wrap;
    border-radius: 7.5px;
    padding-right: 10px;
    background-color:darkcyan;
    margin: 5px;
}
.flexc {
    display: flex;
    justify-content:space-between;
    flex-flow: row wrap;
    border-radius: 7.5px;
    padding-right: 10px;
    background-color: rgb(45, 100, 100);
    margin: 5px;
}
#x {
    grid-area: a;
}
#incompleteTasks {
    grid-area: b;
}
#completeTasks {
    grid-area: c;
}
body{
    display: grid;
    grid-template-areas:
    'a b'
    'a c';
    gap: 10px;
    padding: 10px;
}