:root {
	--menu-links-color: #ffffff;
	--footer-links-color: #ffffff;
	--footer-bg-color: rgb(37,56,60);
	/* --link-color: #1111FF; 
    --link-hover-color: #1111FF;
    --link-active-color: #2222FF; */
	--menu-width: 10rem;
	--menu-offset: -10rem;
	--menu-opener-posn-fix: 10.1rem;
	/* menu-opener */
	--menu-opener-bg: rgb(17,46,20);
	--menu-opener-bg-hover: #66ee66;
	/* --menu-opener-bg-open: #33dd33; */
	/* ******************  background colors  ************* */
	--body-color: #eee;
	/* MENU COLOR */
    --menu-left-color: #10243f;
	--menu-mid-color: #10243f;
    --menu-right-color: rgba(37, 56, 60, 0);
	--toggled-menu-mid-color: rgba(97, 106, 110, 1);
	--toggled-menu-right-color: rgba(112, 120, 120, 0.9);
	--toggled-menu-shadow-color: rgba(112, 110, 90, 0.5);
	/* FOOTER COLOR */
	--footer-top-color: rgba(238, 238, 238, 0.1);
	--footer-mid-color: #10243f;
	--footer-bottom-color: #10243f;
	/* menu HOVER color */
	/* --menuitem-hover-left-color: #99cB75;
    -- */
	menuitem-hover-right-color: rgba(187,255,187, 0);
	/* SUBMENU */
	/* --submenu-left-color: #99cB75;
    --submenu-right-color: rgba(187,255,187, 0);
    --submenuitem-hover-left-color: #55dB65;
    --submenuitem-hover-right-color: rgba(187,255,187, 0); */
	/*  */
	--submenu-border-color: #99aB75;
	/* Mid-Right end of gradients: rgba(187,255,187, 0) */
	--menuitem-hover-mid-right-color: rgba(187,255,187, 0.4);
	--submenuitem-hover-mid-right-color: rgba(187,255,187, 0.4);
	/* Right end of gradients: rgba(187,255,187, 0) */
	/* --menuitem-hover-border-color: #558B65; NOT USED */
	--footer-height: 70px;
}
body, html {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
}
.container-basic-page-layout {
	display: grid;
	justify-items: stretch;
	align-items: stretch;
	margin: 0;
	padding: 0;
	width: 100%;
	min-height: 100%;
	grid-template-areas: "vmenu header" "vmenu basic-page-content" "vmenu next-and-prev" "footer footer";
	grid-template-rows: auto 1fr var(--footer-height);
	grid-template-columns: 200px 1fr;
	grid-gap: 0;
	/* font-size: 130%; */
}
.troutfly-home-link {
	font-weight: 700;
	font-size: 120%;
}
@media (max-width: 767px) {
	.container-basic-page-layout {
		grid-template-columns: 0 1fr;
	}
	.training-section-heading {
		margin-left: 40px;
	}
}
@media (max-width: 580px) {
}
.basic-page-header {
	grid-area: header;
	/* background: rgba(120, 120, 200, 0.1); */
	color: #eee;
}
.training-section-heading {
	color: #000000;
	font-family: Raleway;
	font-weight: 200;
	margin-bottom: 25px;
}
@media (min-width: 481px) and (max-width: 850px) {
	.training-section-heading {
		font-size: 2.1em;
		margin-bottom: 15px;
	}
}
@media (min-width: 560px) and (max-width: 850px) {
	h3 {
		font-size: 1.4em;
	}
}
@media (max-width: 559px) {
	h3 {
		font-size: 1em;
	}
}
@media (max-width: 480px) {
	.training-section-heading {
		font-size: 1.6em;
		margin-bottom: 10px;
	}
}
.basic-page-content {
	grid-area: basic-page-content;
	color: #eee;
	text-align: center;
}
.basic-page-vmenu {
	grid-area: vmenu;
	background-image: linear-gradient(to right, var(--menu-left-color), var(--menu-mid-color) 90%, var(--menu-right-color));
}
.empty-box {
	grid-area: empty-box;
	background-image: linear-gradient(to right, var(--menu-left-color), var(--menu-mid-color) 90%, var(--menu-right-color));
}
.basic-page-footer {
	grid-area: footer;
	/* background: var(--footer-bg-color); */
	color: var(--footer-links-color);
	background-image: linear-gradient(var(--footer-top-color), var(--menu-mid-color) 10%, var(--footer-bottom-color));
	align-content: center;
}
.footer-grid {
	display: grid;
	border-top: 1px solid rgba(238, 238, 238, 0.1);
	background: none;
	align-items: center;
	justify-items: center;
	grid-template-rows: var(--footer-height);
	grid-template-columns: 1fr;
	/* background-image: linear-gradient(var(--footer-top-color), var(--footer-mid-color) 13%, var(--footer-bottom-color)); */
}
.footer-grid-item {
	grid-row: 1;
	grid-column: 1;
}
.next-and-prev {
	grid-area: next-and-prev;
	align-self: center;
	justify-self: center;
	display: inline-flex;
	flex-wrap: nowrap;
	margin-top: 6px;
	margin-bottom: 36px;
	text-align: center;
	font-size: 1em;
}
.next-and-prev a {
	padding: 9px;
	color: #fff;
	padding: 9px;
	background-color: var(--menu-left-color);
	border: 2px solid rgba(200, 200, 200, 0.3);
	border-radius: 9px;
	text-decoration: none;
}
.next-and-prev a:hover {
	text-decoration: none;
	color: var(--menu-item-hov-color);
}
.next-and-prev>span:nth-of-type(1) {
	box-shadow: 4px 14px 15px var(--menu-left-color);
	margin-right: 3.5vw;
}
.next-and-prev>span:nth-of-type(2) {
	box-shadow: -4px 14px 15px var(--menu-left-color);
	margin-left: 3.5vw;
}
@media (min-width: 600px) {
	.next-and-prev-widescreen {
		display: inline;
	}
	.next-and-prev-narrowscreen {
		display: none;
	}
}
@media (max-width: 599px) {
	.next-and-prev-widescreen {
		display: none;
	}
	.next-and-prev-narrowscreen {
		display: inline-flex;
		font-size: 80%;
	}
}
@media (min-width: 960px) and (max-width: 1019px) {
	.next-and-prev {
		font-size: 0.9em;
	}
}
@media (min-width: 900px) and (max-width: 959px) {
	.next-and-prev {
		font-size: 0.8em;
	}
}
@media (min-width: 700px) and (max-width: 899px) {
	.next-and-prev {
		font-size: 0.7em;
	}
}
@media (min-width: 600px) and (max-width: 699px) {
	.next-and-prev {
		font-size: 0.6em;
	}
}