html, body {
	box-sizing: border-box;
}
html {
	margin: 0;
}
body {
	margin: 0 auto;
	padding: 0 1rem;
	font: 1rem/1.5 sans-serif;
	overflow-wrap: break-word;
	word-break: break-word;
}
/* Define main layout. */
.left-sidebar-grid {
	display: grid;
	grid-template-columns: 1fr;
	grid-template-areas:
		'header'
		'left-sidebar'
		'main-content'
		'footer';
	grid-gap: 1rem;
}
.left-sidebar-grid > * {
	max-width: 100%;
}

/* Define main grid areas. */
.left-sidebar-grid > .header {
	grid-area: header;
}
.left-sidebar-grid > .main-content {
	grid-area: main-content;
}
.left-sidebar-grid > .left-sidebar {
	grid-area: left-sidebar;
	padding: 1rem;
	display: flex;
	gap: 1rem;
	flex-direction: row;
}
.left-sidebar-grid > .footer {
	grid-area: footer;
	display: flex;
	align-items: center;
	justify-content: center;
}

a {
	color: #2895cc;
	text-decoration: none;
}
a:hover {
	color: #2382b2;
}
img {
	max-width: 100%;
}
img.logo {
	display: block;
	max-width: 75%;
	max-height: 100%;
	margin: auto;
}

@media (min-width: 1200px) {
	.left-sidebar-grid {
		grid-template-columns: 1fr 2fr 1fr;
		grid-template-areas: 
			'header header header'
			'left-sidebar main-content .'
			'footer footer footer';
	}
	.left-sidebar-grid > .left-sidebar {
		flex-direction: column;
	}
	img.logo {
		margin: 0;
	}
}

@media (max-width: 750px) {
	.left-sidebar-grid > .left-sidebar {
		flex-direction: column;
	}
}
