body {
    margin: 0;
    padding: 0;
    background-image: url('images/bg_bluetile.png');
    background-repeat: repeat;
    background-position: center;
}

.container {
    display: flex;
    flex-direction: column;
    height: 100vh;
    position: relative;
}

.content {
    flex: 1;
    /* Create space at the bottom equal to the height of the footer */
    margin-bottom: 73px; /* Adjust to the height of the footer */
    /* Additional styles for the content */
    padding-inline: 10px; /* Add padding for spacing around the content */
    overflow-y: auto; /* Allows the content to be scrollable */
}

.footer {
    position: fixed;
    bottom: 0;
    width: 100%;
    padding-inline: 10px; /* Add padding for spacing around the content */
    height: 80px; /* Set the desired height for the footer */
    /* Additional styles for the footer */
}

.align-center-horizontal {
    text-align: center;
}

.align-center {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align: center;
}

.marquee {
    font-family: 'Comic Sans MS', cursive;
    white-space: nowrap; /* Ensure content stays in a single line */
    overflow: hidden; /* Hide content exceeding container */
    position: relative;
    animation: marquee 20s linear infinite; /* Adjust the duration or animation properties as needed */
    align-self: flex-end;
}

.marquee p {
    display: inline-block; /* Display the text in a single line */
}

@keyframes marquee {
    0% { transform: translateX(100%); }
    100% { transform: translateX(-100%); }
}

.align-bottom {
    position: fixed; 
    width:100%;
    bottom:0;
}