body{
    user-select: none;
}


.header{
    text-align: center;
}

.header button{
    width: 140px;
    height: 60px;
    background-color: rgb(156, 202, 28);
    box-shadow: 10px 10px rgba(156, 202, 28, 0.1);
    border-radius: 10px;
}

.delete{
    opacity: 0;
    -webkit-user-drag: none;
    pointer-events: none;
}

.card
{
    border: 4px solid rgb(156, 202, 28);
    width: 40px;
    height: 50px;
    border-radius: 10%;
    padding: 40px;
    margin:10px; 
    display: flex;
    justify-content: center;
    align-content: center;
    flex-direction: column;
    color: rgba(0, 0, 0, 0);
    background-color: aliceblue;
    box-shadow: 10px 10px 1px 1px rgba(156, 202, 28, 0.3);
    font-size: 70px;
}

.container
{
    display: inline;
    margin-top: 400px;
    margin:20px;
    width: auto;
    height: 100%;
    text-align: center;
}
.row{
    display: flex;
    justify-content:center;
    align-content: space-between;
    flex-direction: row;
    width: 100%;
    align-items: center;
    text-align: center;
}
.h1{
    font-size: 10px;
}

.selected-card{
    background-color: rgb(200, 208, 243);
}

.applyAnimationRottaion{
    animation: rotation 0.5s ease-in-out 0s 1;
    animation-fill-mode: forwards;
}
.applyAnimationRottaionBackwards{
    animation: rotation-backwards 0.3s ease-in-out 0s 1;
    animation-fill-mode: forwards;
}
.dissapearAnimation{
    animation: dissapear 1.4s ease-in-out 0s 1;
    animation-fill-mode: forwards;
}
.jumpOutAnimation{
    animation: jumpOut 1.4s ease-in-out 0s 1;
    animation-fill-mode: forwards;
}

@keyframes rotation {
    0%{
        transform: rotateY(-180deg);
        color: rgba(0,0,0,0);
    }
    100%{
        transform: rotateY(0deg);
        color: rgba(0,0,0,1);
    }
}

@keyframes rotation-backwards {
    0%{
        transform: rotateY(0deg);
        color: rgba(0,0,0,1);
    }
    100%{
        transform: rotateY(-180deg);
        color: rgba(0,0,0,0);
    }
}

@keyframes dissapear {
    0%{
        opacity: 100;
        color: rgba(0,0,0,1);
    }
    100%{
        opacity: 0;
        color: rgba(0,0,0,0);
    }
}

@keyframes jumpOut {
    0%{
        transform:scale(0%);
    }
    0%{
        transform:scale(10%);
    }
    0%{
        transform:scale(0%);
    }
    
}