Ravenous Project Smooshed Images Together

Hello I am currently working on the Ravenous project. I’ve “finished” and am seeing no errors. But when the site comes up it appears there is big mistake in the layout of the page but I can’t find it. I’ve looked through the other questions asked on this project and I haven’t seen another instance of this yet.

RESOLVED - i somehow messed up adding in the app.css content

I’ll include it here just in case anyone else does this.

/* Universal Styles */

html {
  font-size: 18px;
}

@media only screen and (max-width: 560px) {
  html {
    font-size: 15px;
  }
}

input:focus {
  outline: none;
}

/* Reusable Component - Image Container */

.image-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
  background: #000;
}

.image-container img {
  width: 100%;
}

/* App Styles */

.App {
  font-family: 'Work Sans', sans-serif;
}

h1 {
  padding: .66rem 0;
  text-align: center;
  background-color: #cca353;
  font-family: Poppins, sans-serif;
  font-size: 1.8rem;
  color: #fff;
}