.gallery-image
{
  display: flex;

  flex-wrap: wrap;

  justify-content: center;

  padding-bottom: 10px;
}

.gallery-image img
{
  height: 250px;
  width: 350px;

  transform: scale(1.0);

  transition: transform 0.4s;
}

.img-box
{
  background-color: white;

  color: white;

  display: inline-block;

  height: 250px;
  width: 350px;

  margin: 10px;

  overflow: hidden;

  position: relative;
}

.img-box:hover
{
  cursor: pointer;
}

.img-box:hover img
{
  transform: scale(1.1);
}

.img-box:hover .transparent-box
{
  background-color:rgba(0, 0, 0, 0.6); /* Opacity of the shadow over the image when hovered */
}

.img-box:hover .caption
{
  opacity: 1.0;

  transform: translateY(-20px); /* Raise caption text into the image */
}

.img-box a
{
  color: white;

  text-decoration: none;
}

.caption
{
  opacity: 0.0;

  position: absolute;
  bottom: 5px;
  left: 20px;

  transition: transform 0.3s, opacity 0.3s;
}

.caption > p:nth-child(2)
{
  font-size: 0.8em;
}

.transparent-box
{
  background-color:rgba(0, 0, 0, 0);

  height: 250px;
  width: 350px;

  position: absolute;
  top: 0;
  left: 0;

  transition: background-color 0.3s;
}