header {
	border-bottom: solid 10px var(--csugold);
}

#logo h2 {
	font-size: 2.5em;
}

#logo h3 {
	font-size: 1.5em;
}

/* Responsive tables */

/* Force table to not be like tables anymore */

table,
thead,
tbody,
th,
td,
tr {
	display: block;
}

/* Hide table headers (but not display: none; for accessibility) */

table thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}

table tr {
	border: 1px solid black;
}

/* .schedule table */

.schedule td:nth-child(1),
.schedule td:nth-child(2) {
	width: 100%;
}

.schedule td {
	/* Behave  like a "row" */
	border: none;
	position: relative;
	padding-left: 30%;
	padding-top: 6px;
	min-height: 2.5em;
}

.schedule td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
	font-weight: bold;
}

.schedule caption {
	background-color: #ccc;
	padding: 6px;
}

/* Label the data */

.schedule td:nth-of-type(1):before {
	content: "Date";
}

.schedule td:nth-of-type(2):before {
	content: "Due";
}

.schedule td:nth-of-type(3):before {
	content: "Activity";
}

/* .assignments table */

/* Label the data */

.assignments td:nth-child(1),
.assignments td:nth-child(2) {
	width: 100%;
}

.assignments td {
	/* Behave  like a "row" */
	border: none;
	position: relative;
	padding-left: 35%;
	padding-top: 6px;
	min-height: 2.5em;
}

.assignments td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
	font-weight: bold;
}


.assignments td:nth-of-type(1):before {
	content: "Assignment";
}

.assignments td:nth-of-type(2):before {
	content: "Due";
}

.assignments td:nth-of-type(3):before {
	content: "Percent";
}

.assignments caption {
	background-color: #ccc;
	padding: 6px;
}

/* .stylestable */

/* Label the data */

.stylestable td:nth-child(1),
.stylestable td:nth-child(2) {
	width: 100%;
}

.stylestable td {
	/* Behave  like a "row" */
	border: none;
	position: relative;
	padding-left: 35%;
	padding-top: 6px;
	min-height: 2.5em;
}

.stylestable td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
	font-weight: bold;
}


.stylestable td:nth-of-type(1):before {
	content: "CSS Property";
}

.stylestable td:nth-of-type(2):before {
	content: "Description";
}

.stylestable td:nth-of-type(3):before {
	content: "Examples";
}

.stylestable caption {
	background-color: #ccc;
	padding: 6px;
}

/* Nav */

nav.primary {
	display: none;
}

/* Styles for hamburger menu */

header button {
	display: block;
}

.hamburger {
	color: #fff;
	font-size: 3rem;
}

.cross {
	color: #fff;
	font-size: 3rem;
}

.menu {
	font-family: "Open Sans", Arial, Helvetica;
	font-weight: bold;
	background: #f1f1f1;
	font-size: 1rem;
}

/* Footer */

.ralign {

	justify-content: center;
	text-align: center;
}

footer div img {
	margin: 1rem auto 0;
}