body {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
	margin: 0;
	padding: 0;
	background-color: #f0f0f0;
}
.student-card {
	border: 1px solid #ddd;
	margin: 10px;
	padding: 10px;
	border-radius: 5px;
	background-color: #fff;
	max-width: 750px;
}
.student-card h2 {
	font-size: 1.2em;
	margin: 0 0 5px 0;
	color: #333;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	width: fit-content;
	margin-right: 12em;
}
.student-card div {
	margin-left: 10px;
}
.student-card p {
	margin: 0 0 5px 0;
	font-size: 0.9em;
	color: #666;
}

.division-student-card {
	border: 1px solid #ddd;
	margin: 10px;
	padding: 10px;
	border-radius: 5px;
	background-color: #fff;
	max-width: 750px;
}
.division-student-card h2 {
	font-size: 1.2em;
	margin: 0 0 5px 0;
	color: #333;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	width: fit-content;
	margin-right: 12em;
}
.division-student-card div {
	margin-left: 10px;
}
.division-student-card p {
	margin: 0 0 5px 0;
	font-size: 0.9em;
	color: #666;
}
@media (min-width: 600px) {
	.student-card {
		display: grid;
		grid-template-columns: 1fr 4fr;
		grid-auto-rows: auto;
		gap: 10px;
	}
	.student-card div {
		margin-left: 0;
		max-width: 750px;
	}
	.student-card p {
		display: grid;
		grid-template-columns: 1fr 0.5fr 2fr 1fr 0.5fr;
	}

	.code, .description {
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	.age-group {
		text-align: right;
		margin-right: 1em;
		white-space: nowrap;
	}
	.code {
		text-align: right;
		margin-right: 1em;
	}

	.division-student-card {
		display: grid;
		grid-template-columns: 1fr 4fr;
		grid-auto-rows: auto;
		gap: 10px;
	}
	.division-student-card div {
		margin-left: 0;
		max-width: 750px;
	}
	.division-student-card p {
		display: grid;
	}
}
.last-update {
	margin-left: 20px;
}
a {
	text-decoration: none;
}