body {
		background: #5b3718;
	}
	a {
		color: #cdbeb2;
	}
	div.pattern {
		background: url(images/header-pattern.png) repeat-x top left;
		background-size: contain;
		height: 20px;
	}
	div.banner {
		background: linear-gradient(#9f6f46, #845528);
		margin: 0;
		padding: 0;
	}
	div.banner h1 {
		color: #f6e8da;
		text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.3);
		font-size: 3.5vw;
		margin: 0;
		padding: 0;
		margin-left: 1%;
		text-transform: capitalize;
		font-family: JuliusSansOne, Trebuchet, Arial, sans-serif;
	}
	div.banner h3 {
		color: #e7d7c6;
		text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
		float: right;
		text-align: right;
		font-size: 1.5vw;
		width: 50%;
		margin: 0;
		padding: 0;
		margin-right: 1%;
		padding-top: 2vw;
		text-transform: lowercase;
		font-family: JuliusSansOne, Trebuchet, Arial, sans-serif;
	}
	div.panel {
		float: left;
		width: 33.33%;
		background: #5b3718 url(images/shadow-box.png) top center no-repeat;
		background-size: cover;
		color: #cdbeb2;
		min-height: 500px;
		overflow: hidden;
	}
	div.topic {
		color: #cdbeb2;
		padding: 0 1% 1% 1%;
		font-family: Roboto, Trebuchet, Arial, sans-serif;
		font-size: 1.2vw;
	}
	div.topic h3 {
		font-size: 2.7vw;
		line-height: 2.7vw;
		padding: 0;
		margin: 0;
	}
	div.photo {
		float: left;
		width: 33.33%;
		background: #26170a url(images/shadow-box.png) top center no-repeat;
		background-size: cover;
		color: #cdbeb2;
		overflow: hidden;
	}
	div.photo p {
		margin: 0;
		padding: 0;
	}
	div.photo p img {
		border: 3px solid #26170a;
		width: 100%;
		height: auto;
	}
	div.content {
		padding: 8%;
		font-family: Roboto, Trebuchet, Arial, sans-serif;
	}
	div.content p, div.content ul {
		font-size: 1.2vw;
	}
	h2 {
		text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
		margin: 0;
		padding: 0;
		font-size: 3vw;
		line-height: 3vw;
		font-family: JuliusSansOne, Trebuchet, Arial, sans-serif;
		text-align: center;
	}
	p img.accent {
		width: 100%;
		height: auto;
	}
	div#river {
		background: #38220f url(images/contact-background.jpg) repeat-x left center;
		background-size: cover;
		width: 100%;
		clear: both;
	}
	div.contact {
		width: 33%;
		color: #cdbeb2;
		border-top: 1vw solid #291503;
		background-color:rgba(56, 29, 6, 0.8);
	}
	div.contact p {
		font-family: Roboto, Trebuchet, Arial, sans-serif;
		font-size: 1.5vw;
	}
	div.padder {
		padding-top: 12vw
	}
	div.banner h3.mobile {
		display: none;
	}
	
	div.footer {
		background: white;
		color: black;
		font-family: Roboto, Trebuchet, Arial, sans-serif;
		clear:both;
		border-top: 2px;
		border-top: 3px solid #543e2c;
	}
	div.footer p {
		margin: 0;
		font-size: 1.1vw;
		padding: 10px;
	}
	
	img.donate {
		padding-top: 7px;
		width: 60%;
		height: auto;
	}
	
	img.bannerdonate {
		padding-top: 0px;
		width: 20%;
		height: auto;
	}
	
	img.mobiledonate {
		padding-top: 6px;
		padding-bottom: 6px;
		width: 50%;
		height: auto;
	}
	
	@media screen and (max-width:900px) {
		div.topic h3 {
			font-size: 4.7vw;
			line-height: 4.7vw;
			padding: 0;
			margin: 0;
			padding-left: 3%;
			padding-right: 3%;
		}
		div.topic ol {
			font-size: 3.3vw;
			padding-left: 3%;
			padding-right: 3%;
			margin-left: 5vw;
		}
		div.content {
			padding: 6%;
		}
		div.banner h3.widescreen {
			display: none;
		}
		div.banner h3.mobile {
			display: block;
			float: none;
			width: 100%;
			text-align: center;
			font-size: 3.8vw;
			margin: 0;
			padding: 0;
			padding-bottom: 2vw;
			line-height: 4vw;
		}
		div.banner h1 {
			font-size: 9vw;
			text-align: center;
			margin-left: 0;
		}
		div.panel {
			min-height: 350px;
		}
		div.panel, div.photo, div.contact {
			float: none;
			width: 100%;
			height: auto;
		}
		div.photo p img {
			outline: 4px solid #26170a;
			width: 99.2%;
			height: auto;
		}
		div.padder {
			padding-top: 26vw
		}
		h2 {
			font-size: 11vw;
			margin-top: 10%;
		}
		p, ul, div.content p, div.content ul, div.contact p  {
			font-size: 5.2vw;
		}
		div.footer p {
			font-size: 2.5vw;
		}
	}