html, body {
    height: 100%;
    margin: 0;
}

body {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #000000; /* solid background color */
    color: #ffffff;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; /* different font */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.container {
    text-align: center; /* center text */
    padding: 2rem;
}

.title {
    font-size: clamp(2rem, 5vw, 4rem); /* bigger text */
    font-weight: 700;
    letter-spacing: 0.5px;
    margin: 0 0 0.5rem 0;
    color: #00b5fa
}

.subtitle {
    font-size: clamp(1rem, 2.5vw, 1.5rem);
    opacity: 0.9;
    margin: 0;
    color: #f54a6b
}

/* utility: hidden element that should not display on the front end */
.hidden {
    display: none !important;
}