body {
	margin: 0;
	padding: 0;
	background-color: White;
}

div.cols {
	margin-bottom: 2em;
	margin-left: -40px;
}

div.cols > div.col {
	padding-left: 40px;
}

#header {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	z-index: 100;
	width: 100%;
	background-color: #770000;
	color: White;
	padding: 0 20px;
	font-size: 10pt;
	background-image: url(../graphics/header-bg.jpg);
	background-position: 50% -25px;
	background-size: cover;
}

#header div.nav {
	display: flex;
	justify-content: space-between;
	align-items: center;
}


body.js #header div.menu-button {
	display: block;
}

#header div.menu-button {
    display: none;
    font-size: 20pt;
    vertical-align: middle;
	cursor: pointer;
	margin-left: 20px;
	background-color: rgba(119,0,0,0.7);
	padding: 5px 10px;
	border-radius: 10px;
	text-transform: uppercase;
}

#header div.menu-button * {
	line-height: 1em;

}

#header a.logo {
	display: inline-block;
	text-decoration: none;
	width: 400px;
	max-width: 100%;
	background-color: rgba(119,0,0,0.7);
	background: linear-gradient(to right, rgba(119,0,0,0) 0%,rgba(119,0,0,0.7) 15%,rgba(119,0,0,0.7) 85%,rgba(119,0,0,0) 100%);
}

#header a.logo img {
	width: 100%;
	vertical-align: middle;
}

#header ul.menu {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	margin: 0;
}

div.menu-container {
	background-color: #DFA725;
	box-sizing: content-box;
    width: 100%;
    padding: 10px 20px 0 20px;
    position: relative;
    left: -20px;
	
}

body.js #header div.menu-container {
	display: none;
}

body.home #header div.menu-container {
	display: block;
}

#header ul.menu li {
	display: block;
	margin: 0 10px 10px 10px;
}


#header ul.menu li.admin,
#header ul.menu li.home {
	display: none;
}

#header ul.menu li a {
	font-weight: bold;
	text-transform: uppercase;
	text-decoration: none;
	text-decoration: none;
	background-color: White;
	padding: 0.1em 0.5em;
	color: #700;
	border-radius: 7px;
	font-size: 1.4em;
}

#header ul.menu li.current a {
	color: White;
	background-color: #700;
}

#header ul.menu li a:hover {
	color: #DFA725;
}

#content {
	padding: 40px 0 0 0;
}

#footer {
	color: #AAA;
	font-size: 0.8em;
	text-align: center;	
}

#footer ul.ebook-links {
	background-color: White;
	padding: 5px 0 0 0;
	margin: 0 0 10px 0;
	text-align: center;
}

#footer ul.ebook-links {
	margin-bottom: 3em;
}

#footer ul.ebook-links li {
	display: inline-block;
	vertical-align: middle;
	margin: 5px 20px;
}

#footer ul.ebook-links li:first-child {
	display: block;
}

#footer span.mediaicons {
	font-size: 2em;
}

#footer span.mediaicons a:hover {
	color: #700;
}

#footer a, #header a {
	color: inherit;
}

#header div.inner,
#content > div.inner,
#footer > div.inner {
	max-width: 960px;
	margin: 0 auto;
	padding: 0 20px;
}