/* ===== Grid */
#wrapper-main {
	display: grid;
	grid: 'header header header' 'left content right' 'footer footer footer' / auto 1fr auto;
}

@media only screen and (max-width: 1024px) {
	#wrapper-main {
		grid: 'header' 'left' 'right' 'content' 'footer';
	}
}

#section-top {
	grid-area: header;
}

#section-left {
	grid-area: left;
	width: 300px;
}

#section-content {
	grid-area: content;
}

#section-right {
	grid-area: right;
}

#section-bottom {
	grid-area: footer;
}
/* ===== */


/* General */
.section-wrapper > .section-content {
	box-sizing: border-box;
	display: flow-root;
}


/* Section Left */
#section-left > .section-content > div {
	margin-bottom: 1.2rem;
}

#section-left > .section-content.mobile {
	display: none;
}


/* Section Content */
#section-content > .section-content > div {
	margin: 1.2rem;
}