body {
    height: 4000px;
    transition: all .5s;
    background-color: rgb(0, 0, 0);
    color: white;
}

.card{
padding: 20px;
background-color: rgb(13, 20, 22);
color: white;
}
.card-body{
    padding: 20px;
background-color: rgb(20, 30, 33);
color: white;
}
.none {
    display: none;
}


.borderR {
    border-radius: 10px;
    border: 1px solid pink;
}

i {
    cursor: pointer;
    transition: all .4s;
}

i:hover {
    transform: scale(1.2);
}


.invalid {
    border: 1px solid rgb(168, 5, 5);
}

.checked {
    background-color: gray;
    text-decoration: line-through;
}
 
 
.layout{
    /* dis */

    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    right: 0;
    z-index: 87654345;
    background-color: rgba(34, 34, 34, 0.8);
    display: none;
    justify-content: space-around;
    align-items: center;
}