body {
    background-color: rgb(69, 75, 58);
    /* background-image: url('/images/Website-BG-1.png'); */
}

h1{
    font-family: 'Coral Pixels';
    text-align: center;
}

h2 {
    font-family: 'Bitcount Grid Single';
    color:rgb(42, 45, 35);
    text-align: left;
    font-size: 25px;
}

.info {
    font-family: 'Bitcount Grid Single';
    background-color: rgb(130, 145, 138);
    color: black;
    border: 2px solid rgb(139, 61, 91);
    border-radius: 12px;
    border-style: dashed;
    padding: 5px 15px 5px;
    margin-top: 10px;
}

.info img {
    width: 100%;
    height: 70%;
    object-fit: cover;
    object-position: top;
}

.info-scrolling {
    overflow: hidden;
    white-space: nowrap;
    box-sizing: border-box;
    font-family: 'Bitcount Grid Single';
    background-color: rgb(193, 141, 191);
    color: black;
    border: 2px solid rgb(139, 61, 91);
    border-radius: 12px;
    border-style: dashed;
    padding: 5px 15px;
}

.info-scrolling p {
    min-width: max-content;
    margin: 0;
    white-space: nowrap;
    display: inline-block;
    animation: marquee 6s linear infinite;
}

.info-scrolling span {
    display: inline-block;
    margin-right: 2rem;
}

@keyframes marquee {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-33%);
    }
}

/* Pause on Hover */
.info-scrolling:hover p {
    animation-play-state: paused;
}

.container {
  display: grid;
  margin: 0 15%;
  grid-gap: 10px;
  grid-template:
    "header header header"
    "nav main sidebar"
    "footer footer footer"
    / 1fr 4fr 2fr;
}

header { grid-area: header; }
nav { grid-area: nav; }
main { grid-area: main; }
aside { grid-area: sidebar; }
footer { grid-area: footer; }

a {
    color: rgb(69, 75, 58);
}