.face-holder {
    width: 7vw;
    height: 9vw;
    border-radius: 30% 30% 50% 50%;
    position: absolute;
    overflow: hidden;
    left: 47%;
    top: 40%;
}

.face-eye {
    width: 2vw;
    height: 1vw;
    background-image: repeating-radial-gradient(circle at center, rgb(164, 130, 112) 0%, rgb(0, 0, 0) 48%, rgb(163, 99, 77) 100%);
    border-radius: 50%;
    box-shadow: 0px 0px 4px 2px #ffffff;
    position: absolute;
    top: 2vw;
}

.face-mouth {
    position: relative;
    width: 3vw;
    height: 1vw;
    border-style: ridge;
    border-width: 0.4vw;
    border-bottom-left-radius: 50%;
    border-bottom-right-radius: 50%;
    margin-left: auto;
    bottom: -7vw;
    margin-right: auto;
}

.face {
    background-image: radial-gradient(circle at center, #000 0%, rgb(37, 37, 37) 100%);
    width: 100%;
    height: 100%;
}

.face:active {
    background-image: radial-gradient(circle at center, rgb(0, 109, 6) 0%, rgb(0, 161, 9) 100%);
}