body {
  font-family: "Modern Antiqua", serif;
}

.metalfont {
  font-family: "Metal Mania", serif;
}

h2 {
  font-family: "Metal Mania", serif;
}

.gallery {
  display: grid;
  gap: 15px;
  margin: auto;
  padding: auto;
}

.gallery {
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 15px;
  padding: 1rem;
}

@media (min-width: 768px) {
  .gallery {
    grid-template-columns: repeat(2, 1fr);
  }

  .gallery a:hover {
  transform: scale(1.2);
  z-index: 100;
}
}

@media (min-width: 1024px) {
  .gallery {
    grid-template-columns: repeat(3, 1fr);
    padding: 1rem 3rem;
  }
}

.gallery a {
  display: block;
  overflow: hidden;
  transition: transform 0.3s ease-in-out, z-index 0s, box-shadow 0.3s ease-in-out;
}


.gallery img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.jumbotron {
  background-image: url("webimages/JoCole (40).jpg");
  background-size: cover;
  background-position: center;
  color: #fff;
  padding: 9.375rem 1rem 3.125rem 1rem;
  height: 80%;
  text-align: center;
  margin-bottom: 0;
}

.jumbotron-text {
  background-color: rgba(0, 0, 0, 0.4);
  color: #fff;
  
  max-width: 25rem;
}

@media (max-width: calc(25rem / 0.75)) {
  .jumbotron-text {
    max-width: 100%;
    border-radius: 0;
  }
}