@font-face {
	font-family: 'AmericanTypewriter';
	src: url('../fonts/american-typewriter.ttf')  format('truetype');
}

@font-face {
	font-family: 'Segoe';
	src: url('../fonts/segoeui.ttf')  format('truetype');
}

 /* ===========================================
	Common
	=========================================== */

	div {
		box-sizing: border-box;
	}

	.wrapper {
		margin: 0 auto;
		max-width: 65em;
	}

	#content {
		height: auto;
		display: inline-block;
		font-family: 'Segoe';
		width: 100%;
		padding: 1rem;
	}

	a, a:visited {
		text-decoration: none;
		color: black;
	}

 /* ===========================================
	Body
	=========================================== */

	body {
		background-color: #CA9F33;
		margin: 0rem;
	}

 /* ===========================================
	Menu
	=========================================== */

	header {
		background-image: url("../images/structural/wood_texture_medium.jpg");
	}

	#logo {
		width: 100%;
		display: inline-block;
		margin: 0rem;
		padding: 0rem;
	}

	#logo #left {
		padding: 1.2rem;
		width: 80%;
		float: left;
	}

	#logo #right {
		width: 20%;
		float: left;
	}

	#logo h1 {
		margin: 0em;
		font-family: 'AmericanTypewriter', 'Arial', sans-serif;
		font-size: 2.3rem;
		float: left;
		color: black;
	}

	#logo p {
		margin: 0em;
		width: 100%;
		display: inline-block;
		font-family: 'AmericanTypewriter', 'Arial', sans-serif;
		font-size: 1rem;
		margin-top: 0em;
	}

	#logo img {
		vertical-align: center;
		width: 4.8rem;
		height: 4.8rem;
		margin: .65em;
		float: right;
	}

	#menu {
		width: 100%;
		background-color: #7E4301;
		/*background-color: black;*/
	}

	#menu nav ul {
		list-style: none;
		padding: 0em;
		margin: 0em;
		overflow: hidden;
		width: 100%;
	}

	#menu nav li {
		width: 100%;
	}

	#menu nav li a {
		display: block;
		color: white;
		font-family: "AmericanTypewriter", "Arial", sans-serif;
		font-size: 1.2em;
		text-align: center;
		padding: .4em;
		background-color: #7E4301;
		/*background-color: black;*/
	}

	#menu nav li a:hover {
		background-color: #A06018;
		/*background-color: white;
		color: black;*/
	}

 /* ===========================================
	Footer
	=========================================== */

	footer {
		background-image: url("../images/structural/wood_texture_medium.jpg");
		font-family: 'Segoe';
		font-size: 1rem;
	}

	footer section {
		width: 100%;
		float: left;
		text-align: center;
		margin: 1em 0em;
		padding-left: 1rem;
		padding-right: 1rem;
		box-sizing: border-box;
	}

	/*
	footer section:nth-child(2) {
		display: none;
	}
	*/

	footer a {
		text-decoration: underline;
	}

	footer section h2 {
		font-family: 'AmericanTypewriter', 'Arial', sans-serif;
		font-size: 1.5em;
		margin: 0em;
		margin-bottom: 0.5em;
		color: black;
	}

	footer #contact li {
		margin-bottom: .5rem;
	}

	footer #contact img {
		height: 1em;
	}

	footer ul {
		list-style: none;
		padding: 0em;
		margin: 0em;
		overflow: hidden;
	}

	footer #social ul {
		display: inline-block;
	}

	footer #social img {
		width: 3em;
		height: 3em;
	}

	footer #social li {
		float: left;
		width: 3em;
		height: 3em;
		margin: 0 0.8em;
	}

	footer #copy {
		width: 100%;
		color: white;
		text-align: center;
		display: inline-block;
		background-color: #7E4301;
	}

	footer #copy p {
		margin: 0.3em;
	}


 /* ===========================================
	Helpers
	=========================================== */
	
	#menu .selected {
		background-color: #A06018;
		/*background-color: white;
		color: black;*/
	}

	.structural {
		position: absolute;
		left: -9999px;
	}

	.clearfix:after {
		content: "";
		display: table;
		clear: both;	
	}

@media (min-width: 60em) {
	 /* ===========================================
	Header
	=========================================== */

	#logo h1 {
		font-size: 3.2rem;
	}

	#logo p {
		font-size: 1.2rem;
	}

	#logo img {
		width: 6.5rem;
		height: 6.5rem;
	}

	#menu nav li {
		float: left;
		width: 25%;
		/* width: 33.33%; */
	}

	 /* ===========================================
	Footer
	=========================================== */

	footer section {
		width: 33.33%;
	}

	footer #contact li {
		margin-bottom: 1rem;
	}

}