/* the below code makes the container display properly without padding around it */

html,
body {
	margin: 0;
	padding: 0;
	height: 100%;
}

.container {
	width: 60%;
	min-width:900px;
	margin: 0 auto;
	padding: 0;
	min-height: 100vh;
	display:flex;
	flex-direction:column;
	align-items: stretch;
}

/* main content and navigation */
.maincont {
	display: flex;
	flex-direction: row;
	min-width:900px;
	align-items: stretch;
	min-height: 50vh;
	flex: 9;
}

/* section styling */

.container {
	background-color:lightgray;
}

.navigation {
	flex:1;
	background-color:lightpink;
}

.content {
	flex:4;
	background-color:darkseagreen;
}

.footer {
	background-color:lightblue;
}