body {
	font-family: sans-serif;
}

/* Make content area fill the entire browser window */
html,.fullscreen {
	display: flex;
	height: 100%;
	margin: 0;
	padding: 0;
	width: 100%;
}

/* Center the content in the browser window */
.container {
	margin: auto;
	text-align: center;
}

.title {
	font-size: 2em;
}

#map {
	height: 400px;
	/* The height is 400 pixels */
	width: 100%;
	/* The width is the width of the web page */
}

.image-container {
  width: 100px; /* Adjust to your image width */
  height: 300px; /* Adjust to your image height */
  overflow: hidden;
  position: relative;
}

.image-container img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
  transition: transform 0.7s ease-in-out; /* Smooth up to down transition */
}

.image-container img.new-image {
  transform: translateY(-100%); /* Initially moves the image up */
}

.image-container img.show {
  transform: translateY(0); /* Resets to its normal position */
}