#admin-info-table td {
	margin: 0 10px;
	padding: 0 5px;
	vertical-align: top;
	text-align: left;
}

@media screen and (min-width: 480px) {
	.admin-info-table-key {
		white-space: nowrap;
		text-align: left;
	}
}

#hw-assignment-table {
	border-collapse: collapse;
	border: solid 2px;
}

#hw-assignment-table th, #hw-assignment-table td {
	border: solid 1px;
	padding: 5px;
}

#schedule-table {
	border-collapse: collapse;
	border: solid 2px;
}

#schedule-table th, #schedule-table td {
	border: solid 1px;
	padding: 5px;

}

.schedule-table-topic-area {
	text-align: center;
	font-weight: bold;
	font-size: 14pt;
}

#fig-desc {
	float: right;
}

#fig-desc img {
	max-width: 100%;
	height: auto;
}

#course-staff {
	margin: 1.5em auto 2em;
	max-width: 720px;
}

.staff-instructor-row {
	display: flex;
	justify-content: center;
	margin-bottom: 1.75em;
}

.staff-tas-row {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 2.5em;
}

.staff-card {
	text-align: center;
	max-width: 220px;
}

.staff-card img {
	width: 150px;
	height: 150px;
	object-fit: cover;
	border-radius: 50%;
	border: solid 2px #888;
	background-color: #eee;
}

.staff-instructor .staff-card img {
	width: 170px;
	height: 170px;
}

.staff-name {
	font-weight: bold;
	margin: 0.6em 0 0.15em;
}

.staff-role {
	font-size: 0.95em;
	color: #444;
	margin: 0;
}

.staff-email {
	font-size: 0.9em;
	margin: 0.25em 0 0;
}

#sec-office-hours {
	margin-top: 1.5em;
	padding-top: 1.25em;
	border-top: solid 1px #999;
}

#sec-office-hours h3 {
	text-align: center;
	margin-top: 0;
}

#office-hours-table {
	border-collapse: collapse;
	width: 100%;
	max-width: 900px;
	margin: 0 auto;
}

#office-hours-table th,
#office-hours-table td {
	padding: 10px 12px;
	vertical-align: top;
	text-align: left;
	border-bottom: solid 1px #ccc;
}

#office-hours-table th {
	font-weight: bold;
	white-space: nowrap;
	width: 28%;
}

@media screen and (max-width: 600px) {
	.staff-tas-row {
		gap: 1.5em;
	}

	.staff-card img {
		width: 120px;
		height: 120px;
	}

	.staff-instructor .staff-card img {
		width: 140px;
		height: 140px;
	}

	#office-hours-table th,
	#office-hours-table td {
		display: block;
		width: 100%;
		border-bottom: none;
		padding: 4px 0;
	}

	#office-hours-table tr {
		display: block;
		padding-bottom: 1em;
		margin-bottom: 0.5em;
		border-bottom: solid 1px #ccc;
	}
}
