@import url(//fonts.googleapis.com/css?family=Voltaire);

:root {
	--img-bg: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAAOCAYAAAAFdM1fAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAABtJREFUeNpi/P//PwMM+II4jCAWTJTGIgABBgCYIiv5MTGY1QAAAABJRU5ErkJggg==");
}

body {
	background: url(images/noise.png)
}

#container,
footer {
	font-family: Helvetica,Arial,sans-serif;
	font-size: 0.8125rem;
}

#container{
	background: repeat-x bottom;
	background-image: var(--img-bg);
}

#container > header {
	width: 100%;
	background-color: #2d2d2d;
}
	#container > header .inner {
		position: relative;
		max-width: 960px;
		width: 100%;
		margin: auto;
	}
		#container > header h1 {
			font-family: 'Voltaire',sans-serif;
			font-size: 1.875rem;
			font-weight: normal;
			position: absolute;
			z-index: 13;
			top: 20px;
		}
		#container h1 a { color: #eee; }
	#header-image {
		padding-top: 83px;
		width : 960px;
		height: 300px;
	}

#mobile-menu-toggle,
#mobile-menu-panel {
    display: none;
}

#menu {
	text-align: right;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 12;
}
	#menu menu {
		max-width: 960px;
		margin: auto;
		display: flex;
		justify-content: flex-end;
	}
	#menu menu .placeholder {
		outline-color: #fff;
		min-width: 100%;
		min-height: 83px;
	}
#menu menu.placeholder {
	min-height: 48px;
}
	#menu menu h3 {
		display: none;
	}

		#menu a {
			color: #DCD2BE;
			display: block;
			line-height: 80px;
			font-weight: normal;
		}

		#menu .menu-sub > .menu-item {
			border-top: 3px solid #2d2d2d;
			background-color: #2d2d2d;
		}

		#menu .menu-sub > .menu-item:hover {
			border-color: #CB5432;
			background-color: #333;
		}

		#menu .menu-sub > .menu-item > a,
		#menu menu .menu-parent .menu-parent > a {
			color: #DCD2BE;
		}

		#menu .menu-sub > .menu-item > a:hover {
			padding-top: 0;
		}

#content {
	padding-top: 30px;
	background-size: 2px 14px;

	background-image: var(--img-bg);
	background-repeat: repeat-x;
}
	#content .inner {
		width: 100%;
		max-width: 960px;
		margin: auto;
		display: grid;
		grid-template-columns: auto auto auto;
		gap: 25px;
	}
	article hgroup h1 {
		font-weight: normal;
		font-size: 2rem;
		margin-bottom: 20px;
		text-align: right;
		border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	}

article {
	order: 1;
	padding: 0 0 40px;
	font-size: 0.75rem;
}

	article h1,
	article h2,
	article h3,
	article h4 {
		font-family: 'Voltaire',sans-serif;
		text-shadow: 4px 4px 0 rgba(0, 0, 0, 0.1);
		margin: 0 0 10px 0;
		letter-spacing: -1px;
		font-weight: 400;
		color: #444;
	}
	article h1, article h2 {
		font-size: 1.875rem;
		margin: 0 0 15px 0;
	}
	
	article h3 {
		border-bottom: 1px solid #444;
		font-size: 1.25rem;
		padding: 5px 0;
	}
	
	article h4 {
		font-size: 1rem;
		font-weight: 100;
	}
	
	article p, article dl{
		padding: 0 0 10px 0;
		line-height: 17px;
	}
	
	article a {
		color: #CB5432;
		text-decoration: underline;
	}
	article a:hover {
		text-decoration: none;
	}

	article em {
		color: #FF0D40;
	}
	
	article dt {
		color: #444;
	}
	article dd {
		padding: 0 0 0 20px;
		line-height: 18px;
	}
	article table {
		margin: 30px 0;
	}
		article table td {
			padding: 5px;		
		}

	article ul, article ol {
		margin: 0 0 15px 30px;
	}

	article > section > ul, article > section > ol {
		margin: 0 0 15px 30px;
	}
		article ul li{ padding: 2px 0; list-style-type: disc; }
		article ol li{ padding: 1px 0; list-style-type: decimal; }
	
	article blockquote, article pre {
		color: #333;
		margin: 10px 0;
		line-height: 18px;
		padding: 15px;
	}
		article blockquote {
			background: #2d2d2d;
			font-style: italic;
			color: #DCD2BE;
		}
		article pre {
			font-size: 0.75rem;
			line-height: 14px;

			background: none repeat scroll 0 0 #F8F5F2;
			box-shadow: 0 0 2px rgba(0, 0, 0, 0.2);
		}
	
	article code {
		padding: 0; margin: 0;
	}
	
	article hr {
		background-color: #333;
		margin: 20px auto;
		width: 60%;
	}
	
#navigation-main{ order: 0; }
#navigation-sec{ order: 2; }
	aside .block {
		box-shadow: 0 0 2px rgba(0, 0, 0, 0.2);
		background: #F8F5F2;
		padding: 10px;
		margin-bottom: 20px;
		width: 180px;
	}
	aside h3 {
		font-weight: normal;
		padding: 0 5px 2px 5px;
		margin: 0;
		display: inline-block;
		border-bottom: 2px solid #444;
	}
	aside .block > ul,
	aside .menu-content	{
		border-top: 1px solid #999999;
		padding: 10px 0 20px 0;
	}
		aside .block > ul > li {
			margin: 4px 0;
			color: #444;
			list-style-type: circle;
			list-style-position: inside;
		}
			aside .block > ul > li > a {
				text-indent: 10px;
				line-height: 16px;
				/*margin-left: -10px;*/
			}

	aside a {
		color: #CB5432;
		text-decoration: underline;
	}
	aside a:hover {
		text-decoration: none;
	}
	aside input[type="text"],
	aside input[type="email"]{
		width: 145px;
	}
	
	aside .phorm .buttons {
		text-align: center;
	}

#footer {
	width: 100%;
	color: #DCD2BE;
	background-color: #2d2d2d;
}
	#footer footer {
		margin: auto;
		width: 936px;
		padding: 0 12px 15px 12px;
		overflow: hidden;
	}
	#footer p {
		padding: 15px 0 0;
	}
		#footer p a {
			color: #CB5432;
			text-decoration: underline;
		}
		#footer p a:hover {
			text-decoration: none;
		}

/* Dropdown */
#menu ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	gap: 6px;
}
	#menu .menu-children {
		display: none;
	}
	#menu menu .menu-sub > .menu-parent {
		width: 120px;
		/* Preloads the image */
		background: url(images/dropdown-down.png) no-repeat -100px -100px #2d2d2d;
	}
		/*#menu menu .menu-parent > a:hover + .menu-children,
		#menu menu .menu-parent > a:focus + .menu-children,
		#menu menu .menu-parent > a:active + .menu-children,*/
		#menu menu .menu-children.show-menu {
			display: block;
		}
	#menu menu .menu-sub > .menu-parent > a {
		width: 114px;
		background: url(images/dropdown-up.png) no-repeat right center;
	}
	#menu menu .menu-sub > .menu-parent.item-hover > a {
		background: url(images/dropdown-down.png) no-repeat right center;
	}
	#menu menu .menu-parent .menu-parent > a {
		background: url(images/dropdown-right.png) no-repeat right center;
	}
	#menu menu .menu-parent .menu-parent .menu-children {
		top: 0;
		left: 120px;
	}
	/*#menu menu .menu-sub > .menu-parent:hover > a,
	#menu menu .menu-sub > .menu-parent:focus > a,
	#menu menu .menu-sub > .menu-parent:active > a*/
	#menu menu .menu-sub > .menu-parent > a:focus {
		background-image: url(images/dropdown-down.png);
	}
		#menu menu .menu-sub > .menu-parent li {
			display: block;
			padding: 0;
		}
			#menu menu .menu-sub > .menu-parent li > a {
				line-height: 20px;
				padding: 5px 0 5px 3px;
				width: 114px;
			}
	#menu menu a {
		display: block;
		width: 120px;
		text-decoration: none;
	}
	#menu menu .menu-children {
		background: #2d2d2d;
		position: absolute;
	}
	#menu menu .menu-sub a {
		position: relative;
		text-align: center;
	}
	#menu menu .menu-sub .item-hover {
		background-color: #333;
	}
/* When dragged */
#menu menu.placeholder .menu-children {
	display: none;
}