body {
	font-family: "lucida sans unicode", "lucida grande", sans-serif;
	font-size: 15px;
	background-color: #fff;
	margin: 0px;
}

img {
	border: 0px;
}

h1 { 
	color: #4a670d;
	font-size: 25px;
	border-bottom: 1px solid #D3D3D3;
}



h2 { 
	color: #4a670d;
	font-size: 20px;
	margin-bottom: 0px;
}

h3 {
	color: #4a670d;
	font-size: 15px;
	margin-bottom: 5px;
}

h4	{
	color: #ff0000;
	font-size: 12px;
}

header {
	width: 100%;
	height: 75px;
	background-color: #333;
	position: fixed;
	z-index: 2;
}

header ul {
	line-height: 25px;
	margin: auto;
	width: 980px;
	color: #808080;
	white-space: nowrap;
	text-align: right;
}
	
header li {
	display: inline;
	padding: 5px;
}

header ul li a {
	text-decoration: none;
	color: #808080;
	font-weight: bold;
}

header ul li img {
	vertical-align: middle;
}

nav {
	width: 1000px;
	height: 100px;
	background-image: url('/images/banner.jpg');
	position: fixed;
	text-align: center;
	left: 50%;
	margin-left: -500px;
}

nav a {
	color: #d6ba76;
	text-decoration: none;
	font-weight: bold;
	padding: 20px;
	margin: auto;
	font-size: 15px;
	line-height: 100px;
	position: relative;
	left: 125px;
	text-shadow: 0 -1px 1px #000;
}

nav a:hover {
  color: #fff;
  border-bottom: 4px solid #638914;
}

 main {
	height: 100%;
	width: 100%;
	margin: auto;
	text-align: center;
	color: #333;
}

main figure {
	background-image: url('/images/main.jpg');
	background-repeat: no-repeat;
	background-position: center; 
	margin: 0px auto auto auto;
	width: 100%;
	height: 600px;
}

#caption{
	width: 1200px;
	height: 300px;
	color: #fff;
	font-size: 35px;
	font-weight: bold;
	margin: -300px auto auto auto;
	position: relative;
}

#content {
	width: 1100px;
	height: 450px;
	margin: 25px auto auto auto;
	position: relative;
	clear: both;
	text-align: left;
}

.headerbox {
	width: 250px;
	height: 400px;
	float: left;
	border: 4px solid #D3D3D3;
}

#content .contentbox {
	width: 250px;
	height: 400px;
	border-radius: 5px;
	float: left;
	margin: auto auto auto 15px;
}


.textbox {
	padding: 15px;
	font-size: 14px;
}

.textbox a {
	color: #4a670d;
	font-weight: bold;
}
	
#story {
	width: 100%;
	height: 250px;
	background-color: #333;
	margin: auto;
	color: #fff;
	text-align: left;
}

#story .textbox {
	width: 1000px;
	margin: auto;
}

#services {
	width: 1000px;
	height: 600px;
	margin: 20px auto auto auto;
	text-align: left;
	display: grid;
	grid-template-columns: auto auto auto;
}

#services .contentbox {
	width: 300px;
	height: 165px;
}

.contentbox:hover .overlay {
  opacity: 1;
}



.overlay {
	width: 290px;
	height: 165px;
	position: relative;
	opacity: 0;
	transition: .5s ease;
}

.text {
	width: 270px;
	height: 147px;
	padding: 10px;
	margin: -175px auto auto auto;
	border: 1px solid #d3d3d3;
	background-color: #fff;
}

#contact {
	width: 1000px;
	height: 600px;
	margin: auto;
	clear: both;
}

.map {
	width: 500px;
	height: 500px;
	float: left;
}

.form {
	width: 325px;
	height: 300px;
	float: left;
	text-align: left;
	padding-left: 100px;
}

input[type=text] {
	width: 325px;
	border: 1px solid #ccc;
	display: inline-block;
	border-radius: 4px;
	box-sizing: border-box;
	padding: 10px;
}

button {
  width: 100px;
  background-color: #333;
  color: white;
  padding: 14px 20px;
  margin: 8px 0;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

button:disabled {
	opacity: 0.25;
}


#footer {
	width: 100%;
	height: 250px;
	background-color: #333;
	color: #808080;
}

#footer .container {
	width: 1000px;
	height: 250px;
	margin: auto;
}

#footer .textbox{
	float: left;
	width: 250px;
}

#footer ul {
	line-height: 12px;
	margin: auto;
	white-space: nowrap;
	list-style: none;
	text-align: left;
}
	
#footer li {
	padding: 5px;
	text-decoration: none;
}

#footer ul li a {
	text-decoration: none;
	font-weight: bold;
}

#footer ul li img {
	vertical-align: middle;
}