*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    background-color: rgb(0, 26, 41);
    color: rgb(206, 206, 206);
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    padding-top:50px;
    padding-right:5px;
    padding-left:5px;
    font-family: "Orbitron", sans-serif;
}

body h1 {
    font-family: "Orbitron", sans-serif;
    font-size:2rem;
}

body #box-date p {
    font-weight: bold;
    text-align: center;
    margin-top: 50px;
    font-family: "Orbitron", sans-serif;
    background-color: rgb(2, 30, 46);
    border-radius: 2px;
    padding:30px;
}

body #box-hours p {
    font-weight: bold;
    text-align: center;
    margin-top: 50px;
    font-family: "Orbitron", sans-serif;
    background-color: rgb(1, 35, 54);
    border-radius: 10px;
    padding:30px;
}

body #box-hours p {
    font-size: 5.5rem;
}

body #box-date p {
    font-size: 2.7rem;
}

#date::before {
    content: "\f133";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
}

#hours::before {
    content: "\f017";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
}

footer {
    margin-top:50px;
    padding:30px;
}

footer p {
    font-size: 0.7rem;    
    font-family:Arial, Helvetica, sans-serif;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 2px;
    text-align: center;
}

@media (max-width: 768px) {

    body #box-hours p {
        font-size: 4rem;
    }

    body #box-date p {
        font-size: 2.3rem;
    }
}

@media (max-width: 480px) {
    body h1 {
        font-size:1.3rem;
    }

    body #box-hours p, body #box-date p {
        padding:20px;
    }

    body #box-hours p {
        font-size: 2.5rem;
    }

    body #box-date p {
        font-size: 1.5rem;
    }

    footer p {
        font-size: 0.5rem;    
    }
}
