@font-face {
    font-family: 'The Better Days';
    src: url('fonts/The Better Days-Regular.woff2') format('woff2');
}

@font-face {
    font-family: 'Kurdis';
    src: url('fonts/Kurdis-SemiCondensedExtraBold.woff2') format('woff2');
}

@font-face {
    font-family: 'AOTSerialMono-Bold';
    src: url('fonts/AOTSerialMono-Bold.woff2') format('woff2');
    font-weight: 700;
}

@font-face {
    font-family: 'AOTSerialMono-SemiBold';
    src: url('fonts/AOTSerialMono-SemiBold.woff2') format('woff2');
    font-weight: 600;
}


body {
    min-height: 100vh;
    font-family: Inter Variable, sans-serif;
    color: #3D3D3D;
    background-image: url("images/paper.jpg");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

.content {
    padding: 2rem;
}

.hibiscus {
    position: fixed;
    top: 5px;
    left: 5px;
    width: 200px;
    z-index: 10;
    pointer-events: none;
}

.hibiscus img {
    display: block;
    width: 100%;
    height: auto;
}

.title {
    font-family: 'The Better Days', sans-serif;
    font-size: 2.2rem;
    margin: 40px 0 0 40px;
}

.subtitle {
    font-family: 'Kurdis', sans-serif;
    font-size: 1rem;
    text-transform: uppercase;
    margin: 10px 0 0 40px;
}

.text {
    font-family: 'AOTSerialMono-SemiBold', monospace;
    margin: 10px 0 0 40px;
    font-weight: 600;
}