div#layoutWrapper {
	grid-template-rows: 4rem auto auto;
	grid-template-columns: 100%;
	grid-template-areas: "header" "content" "footer";
}

section#navMenu { 
	display: block;
	position: fixed;
	top: 4rem;
	height: calc(100% - 4rem);
	width: 100vw;
	left: -100vw;
	overflow-x: scroll;
}

header#mainHeader {
	display: flex;
}

header#mainHeader div.header-logo {
	display: inline-block;
	flex: 0 0 5em;
	height: 100%;
}

header#mainHeader div.header-button {
	flex: 0 0 2.5em;
	padding-right: 0.5em;
	align-self: center;
	margin-left: auto;
}

div.header-button input.mobile-menu {
	width: 1.5em;
	height: 1em;
	display: block;
	border: none;
	background-color: transparent;
	font-family: "Font Awesome\ 5 Free";
	font-weight: 900;
	color: var(--menu-button);
	cursor: pointer;
	font-size: 2em;
	outline: none;
}


@media (max-width: 61.9rem) {
	nav#public { display: none; }
	div.quickLogin { display: none; }
}

@media (min-width: 62rem) {
	
	nav#public ul {
		display: flex;
		align-items: center;
		height: 100%;
		padding: 0 5em;
	}
	
	nav#public ul li {
		border: 0.5em solid transparent;
		list-style: none;
	}
	
	nav#public ul li.selected a {
		color: var(--color2);
	}
	
	nav#public ul li a {
		color: #FFF;
	}

	div.header-button { display: none; }
	
	div.quickLogin { 
		display: inline-block;
		flex: 1;
	}
	
	div.quickLogin form {
		display: block;
		height: 100%;
	}
	
	header#mainHeader div.quickLogin section.formGroup {
		display: flex;
		height: 100%;
		align-items: center;
		justify-content: flex-end;
		padding-right: 5em;
	}
	
	header#mainHeader div.quickLogin section.formGroup input {
		margin: 0;
		border: 0;
	}
	
	header#mainHeader div.quickLogin section.formGroup input.save {
		padding-left: 2em;
		padding-right: 2em;
	}
	
}

header#pageHeader {
	display: block;
	max-width: 60em;
	padding: 0.5em 1em;
	border-left: 0.3em solid var(--color2);
	margin: 0.5em auto;
}

header#pageHeader h1 {
	margin-bottom: 0;
}

/* Breadcrumbs */

nav.breadcrumbs {
	display: block;
	width: calc(100% - 1.5em);
	font-size: 0.8em;
	padding: 0.8em 0.5em 0.8em 2em;
}

nav.breadcrumbs ol {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
}

nav.breadcrumbs li:not(:first-of-type)::before {
    display: inline-block;
    content: "/";
    padding: 0 0.5em;
}

/* Jumper */

div.articleAsideWrapper {
	display: grid;
	margin: 2em auto 0 auto;
	grid-template-columns: auto 15em;
	grid-template-areas: "section aside";
	grid-gap: 2em;
}

@media (max-width: 59.9rem) {
	div.articleAsideWrapper {
		grid-template-columns: auto;
		grid-template-rows: 1fr 1fr;
		grid-template-areas: "section"
								"aside";
	}
}

div.articleAsideWrapper > div.coverContainer {
	grid-area: section;
	padding-top: 0;
}

div.articleAsideWrapper > aside.aSubSections {
	padding: 1em;
	grid-area: aside;
	border-radius: 5px;
	background-color: var(--blue-tricady);
}

@media (max-width: 59.9rem) {
	aside.aSubSections {
		margin: auto;
		width: 80%;
	}
}

aside.aSubSections h4 {
	margin-bottom: 1em;
}

aside.aSubSections ul li {
	padding: 0.5em;
	list-style: none;
}


div.quickPoints {
	display: flex;
	width: calc(100% - 2em);
	padding: 1em;
	background-color: var(--color6);
	color: #FFF;
}

@media (max-width: 61.9rem) {
	div.quickPoints {
		flex-wrap: wrap;
	}
}

div.quickPoints > div {
	flex: 1 0 25%;
	padding: 0.5em;
	text-align: center;
	font-size: 1.5em;
	border: 2em solid transparent;
}

div.quickPoints figure {
	color: var(--color2);
	font-size: 2em;
}

body#body_overview section.mainBlock {
	display: block;
}