*,
*::before,
*::after {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

html {
	scroll-behavior: smooth;
}

body {
	/* min-height: 100vh; */
	background-color: #80ffff;
	font-family: Verdana;
	font-size: 15px;
}

table,
th,
td {
	border: solid 1px black;
	text-align: center;
	padding-top: 5px;
}

TD {
	font-family: Verdana;
	font-size: 15px;
}

.page {
	max-width: min(1500px, 98vw);
	margin: auto;
	border: 5px solid grey;
	outline: solid 2px black;
}

.header {
	margin: 0 auto;
	padding: 0.5% 0;
	width: 100%;
	top: 0px;
	background-color: #acb993;
	color: white;
	text-align: center;
	outline: solid 3px black;
}

.header h1 {
	font-size: 2.5rem;
	color: white;
	padding: 1% 0;
}

.header h3 {
	padding: 1% 0;
}

.container {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background-color: #fffcdd;
	width: 100%;
	margin: 0 auto;
}

.centre-box {
	display: flex;
	border: 2px solid blue;
}

.comment {
	background-color: hsl(192, 80%, 49%);
	color: black;
	font-family: aerial;
	font-size: 1.3em;
	padding: 10px 50px;
}

.snapshot {
	width: 20%;
	padding-top: 1%;
	top: 12%;
	left: -37%;
}

.footer {
	/* clear: both; */
	padding: 10px;
	background-color: #999999;
	color: white;
	text-align: right;
	outline: solid 3px black;
}

.frame {
	display: flex;
	justify-content: space-around;
}

.card {
	width: 50%;
	display: flex;
	background-color: #f8d09f;
	text-align: center;
	margin: 20px;
	padding: 2% 10px;
	border-radius: 50%;
	border: solid 2px red;
}

.photo {
	width: 65%;
	/* height: 90%; */
	inset: 0;
	margin: auto;
	aspect-ratio: 1/1;
	border: 0;
	border-radius: 50%;
}

.text {
	font-size: 1.5vw;
	width: 50%;
	background-color: white;
	text-align: center;
	margin: 20px;
	padding: 2% 10px;
	border: solid 2px red;
}

.label-1 {
	font-size: min(1.5vw, 2em);
}

.slide {
	background-color: yellow;
	height: 100%;
	width: 0;
	position: absolute;
	left: 0;
	bottom: 0;
	transition: 0.5s;
}

.btn a {
	text-decoration: none;
	color: white;
}

.btn {
	margin-bottom: 1%;
	padding: 2%;
	background-color: #acb993;
	text-align: center;
	border-radius: 50%;
	transition: 0.5s;
}

.btn:hover {
	transform: scale(1.2);
}

.note {
	color: blue;
}