* {
	box-sizing: border-box;

}
body {
	font-family: Arial, sans-serif;
	margin: 0;
}
/* Header */
.header {
	padding: 60px;
	text-align: center;
	background: #1abc9c;
	color: white;
}
/*Navigation bar*/
.navbar {
	display: flex;
	background-color: #333;
	
}
.navbar a {
	color: white;
	padding: 14px 20px;
	text-decoration: none;
	text-align: center;
	
}
.navbar a:hover {
	background-color: #ddd;
	color: black;
}
/*Row layout*/
.row {
	display: flex;
	flex-wrap: wrap;
}
/*Sidebar*/
.side {
	flex: 30px;
	background-color: #f1f1f1;
	padding: 20px;
}
.main {
	flex: 70%;
	background-color: white;
	padding: 20px;
}
.footer {
	padding: 20px;
	text-align: center;
	background: #ddd;
}
@media (max-width: 700px) {
	.row, .navbar {
		flex-direction: column;
	}
}
table, th, td {
	border: 1px solid black;
}
th, td {
	padding: 10px;
	text-align: center;
}
td:hover {
	font-size: 1.2em;
	font-weight: bold;
}