html {
	overflow-y: hidden;
	overflow-x: scroll;
}
::-webkit-scrollbar {
	display: none;
}

body {
  font-family: sans-serif;
  background-color: #f2f2f7;
  color: #333;
  padding: 20px 0 28px 0;
  margin: 0;
}

#app {
	overflow-x: scroll;
  overflow-y: hidden;
	white-space: nowrap;
	scroll-snap-type: x mandatory;
}

.card {
  width: 40vh;
	height: 80vh;
	/* padding: 20px; */
  margin: 10px calc((100vw - 40vh) / 2);
  background-color: #fff;
  box-shadow: 0px 0px 5px gray;
  overflow: hidden;
  border: 0.1px solid grey;
	border-radius: 15px;
	display: inline-block;
	scroll-snap-align: center;
  text-align: center;
  position: relative;
}

.title {
  color: white;
  font-size: 3vh;
  font-weight: bold;
  background-image: linear-gradient(
    45deg,
    rgb(70, 67, 81) 0%,
    rgb(70, 67, 81) 1%,
    rgb(0, 0, 0) 100%
  );
  margin-top: 0;
  padding-top: 3vh;
  padding-bottom: 3vh;
}

.title-2 {
  font-size: 2.5vh;
  font-weight: bold;
  margin-top: 4vh;
}

.text-body {
  font-size: 2vh;
  margin-top: 2vh;
}

.text {
  max-width: 100%;
  margin-left: 3vh;
  margin-right: 3vh;
	text-align: center;
  white-space: normal;
}

.title-image {
  position: relative;
  bottom: 0;
	display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
}

.bottom-image {
  position: absolute;
  bottom: 0;
	display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
}

.person-list {
  list-style-type: none;
  padding-inline-start: 0;
}