body {
    width: 800px;
    max-width: 800px;
    margin: auto;
    
    text-align: center;
    font-size: 18px;

    background: #fff9ed;
    background-image: url('../img/bg.jpeg');
    background-size: cover;
    background-position: center center; /* Centers the image */
    background-repeat: no-repeat; /* Prevents image tiling */
    background-attachment: fixed; /* Keeps the background fixed even when scrolling */
    
    animation: 1000ms fadeIn;
    animation-fill-mode: forwards;
    visibility: hidden;
}

#content {
    padding: 1rem 3rem;
    margin-top: 20%;
    vertical-align: middle;
    text-align: center;

    animation: 3000ms fadeIn;
    animation-fill-mode: forwards;
    visibility: hidden;
}


h1 {
    font-family: "Ephesis", cursive;
    font-weight: 400;
    font-size: 104px;
    margin: 1rem;
}


#dateInfo { 
    margin-top: 2rem;
}

section#dateInfo>span {
    display: inline-block;
    width: 28%;


    vertical-align: middle;
    padding: auto;
    padding-top: 1rem;
    padding-bottom: 1rem;
}


#day, #time {
    border-top: solid 2px black;
    border-bottom: solid 2px black;
    font-size: 30px;
}

#dateInfo#date {
    font-size: 36px;
    width: 32%;
}

#march,
#year {
    display: block;
    font-size: 30px;
}

#day6 {
    font-size: 60px;
}


.desktop  { 
    visibility: visible;
}

.mobile { 
    display: none !important;
}

.linehigher { 
    line-height: 2rem;
}






@keyframes fadeIn {
    0% {
      opacity: 0;
    }
    100% {
      visibility: visible;
      opacity: 1;
    }
}