.memory__wrap {
    /* display: none; */
    position: absolute;
    left: 300px;
    top: 100px;
    background: #000;
    box-sizing: border-box;
    padding: 20px;
    border-radius: 20px;
    width: 600px;
    display: none;
}
.memory__box {
    width: 100%;
    /* height: 800px; */
    background: #fff;
    border-radius: 20px;
}

.memory__inner {
    transform: scale(0.9);
    width: 100%;
    /* height: 700px; */
    /* border: 2px solid #e27e40cc; */
    background: rgba(0, 0, 0, 0.9);

    border-radius: 20px;
    animation: flicker 1.5s infinite alternate;
}
.memory__card {
    padding: 30px;
}
.memory__card .cards {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 auto;
    justify-content: center;
}
.memory__card .cards li {
    list-style: none;
    width: 125px;
    height: 125px;
    /* background: #2a0e11; */
    position: relative;
    border-radius: 20px;
    transform-style: preserve-3d;
    perspective: 500px;
    box-sizing: border-box;
}

.memory__card .cards li img {
    width: 100%;
    border-radius: 20px;
}
.memory__card .cards li .view {
    position: absolute;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
    /* border: 1px solid #e27e408f; */
    user-select: none;
    pointer-events: none;
}
.memory__card .cards li .front {
    transition: all 0.5s;
    border-radius: 20px;
    box-sizing: border-box;
    /* background: #2a0e11; */
    background: #0f0708;
    /* border: 1px solid #e27e408f; */
    /* box-shadow: inset 0px 0px 5px #e36c1c; */
}
.memory__card .cards li:hover .front {
    transform: scale(1.15);
    filter: brightness(150%);
}

.memory__card .cards li.flip .front {
    transform: rotateY(180deg);
}
.memory__card .cards li.shakeX {
    animation: shakeX 1s 1;
}
.memory__card .cards li.shakeY {
    animation: shakeX 1s 1;
}

.memory__card .cards li .back {
    transform: rotateY(180deg);
    transition: all 0.5s;
    border-radius: 20px;
    /* background: #0f0708; */
    background: #260d01;
    box-shadow: inset 0px 0px 15px #e36c1c9d;
}
.memory__card .cards li.flip .back {
    transform: rotateY(0deg);
}

@keyframes flicker {
    0%,
    19%,
    21%,
    23%,
    25%,
    54%,
    56%,
    100% {
        box-shadow: 0 0 0.5rem #fff, inset 0 0 0.5rem #fff, 0 0 2rem #e36c1c, inset 0 0 2rem #e36c1c, 0 0 4rem #e36c1c, inset 0 0 1rem #e36c1c;
    }
}

@keyframes shakeX {
    from,
    to {
        transform: translate3d(0, 0, 0);
    }

    10%,
    30%,
    50%,
    70%,
    90% {
        transform: translate3d(-10px, 0, 0);
    }

    20%,
    40%,
    60%,
    80% {
        transform: translate3d(10px, 0, 0);
    }
}
@keyframes flash {
    from,
    50%,
    to {
        opacity: 1;
    }

    25%,
    75% {
        opacity: 0;
    }
}

.memory__desc {
    width: 100%;
    height: 300px;
    background: #000;
    border-radius: 20px;
}