.title {
    font-family: 'Kaisei Opti', serif;
}

.about.title {
    cursor: pointer;
}

#levelButtons-2 > button {
    border: 3px solid #f8c7e5;
}

#type_area {
    z-index: 4;
}

#typing_area {
    position: absolute;
    caret-color: transparent;
    z-index: 5;
}

.heart-powered {
    border: none;
    outline: none;
    box-shadow: 0 0 10px rgba(255, 20, 147, 0.5);
    animation: glow 1.5s ease-in-out infinite alternate;
}

@keyframes glow {
    from {
        box-shadow: 0 0 10px rgba(255, 20, 147, 0.5), 0 0 20px rgba(255, 20, 147, 0.4), 0 0 30px rgba(255, 20, 147, 0.3);
    }
    to {
        box-shadow: 0 0 20px rgba(255, 20, 147, 0.6), 0 0 30px rgba(255, 20, 147, 0.5), 0 0 40px rgba(255, 20, 147, 0.4);
    }
}

.block {
    z-index: 3;
}

.block2 {
    z-index: 2 !important;
    opacity: 0.93;
}

#tweet {
    background-color: #1d9bf0;
    color: #FFFFFF;
}

#sidebar {
    background-color: #f8ecf3;
    box-shadow: 2px 2px 6px #e4e4e4;
}

.footer {
    background-color: #ece3e9;
}

@keyframes missType {
    0% {
        background-color: beige;
    }
}

.missed {
    animation: missType 1s forwards;
}

@keyframes rot {
    0% {
        transform: rotate3d(1, 1, 1, 0deg);
        opacity: 1;
    }

    100% {
        transform: rotate3d(1, 1, 1, 360deg);
        opacity: 0;
    }
}

.typedBlock {
    animation: rot 0.5s forwards;
}

.activeLevel {
    opacity: 0.6;
}

.main-content {
    min-height: calc(100vh - 6rem);
}

.statCount {
    font-size: 1.5rem;
    color: red;
}

#lvex {
    color: white;
    background: black;
}

.loader {
    border: 16px solid #f3f3f3;
    border-top: 16px solid #f8c7e5;
    border-radius: 50%;
    width: 120px;
    height: 120px;
    animation: spin 2s linear infinite;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.unlockedGirl {
    cursor: pointer;
}

.hidden {
    display: none;
}

.fixed {
    position: fixed;
    bottom: 3vh;
}

#language-switcher {
    position: absolute;
    background-color: #f8ecf3;
    font-size:1.5em;
    font-family: 'Kaisei Opti', serif;
    border:#f8c7e5 solid;
    opacity:0.7;
    top: 0px;
    right: 0px;
    cursor: pointer;
    z-index: 5;
}

.row-gradient-1 {
    background-color: #fffbfd !important;
}
.row-gradient-2 {
    background-color: #f7f0f4 !important;
}
.row-gradient-3 {
    background-color: #fff1f9 !important;
}
.row-gradient-4 {
    background-color: #fae6f4 !important;
}
.row-gradient-5 {
    background-color: #ffe6f9 !important;
}

#area.wide {
    width: 100%;
}

#area.fullscreen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: white;
}

#area.fullscreen img {
    position: absolute;
}

#area.fullscreen .input {
    font-size: 3em;
}