body {
  color: rgb(63,56,51);
  font-family: "Comic Sans MS", "Comic Sans", "Chalkboard SE", "Comic Neue", cursive;
  font-weight: bold;
  background-color: rgb(176,170,157);
  background-image: url("assets/texture-large.jpg");
  background-size: cover;
  background-repeat: repeat;
}

a {
    font-size: 1.2em;
    color: rgb(63,56,51);
}

.album-container {
    display: flex;
    align-items: center;
    gap: 20px;
}

.album-cover {
    max-width: 50%;
    border: 2px solid rgb(63,56,51);
}

/* Scrolling text animation */
@keyframes scroll {
  to { transform: translateX(-50%); }
}

.scroll-container {
  overflow: hidden;
  white-space: nowrap;
}

.scroll {
  display: inline-block;
  animation: scroll 60s linear infinite;
  font-size: .8em;
}

/* Responsive design for smaller screens */

@media (max-width: 768px) {
    .album-container {
        flex-direction: column;
        align-items: flex-start;

    }
    
    .album-cover {
        max-width: 90%;
        align-self: center;
    }

    .album-container > div {
        margin-left: 5%; /* half of (100% - 90%) */
    }
}