* {
margin: 0;
padding: 0;
}

body {
font-size: 62.5%;
font-family: helvetica, arial, sans-serif;
background: url(images/bg.gif) repeat;
}

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

#header-navigation-wrap {
background: #282828 url(images/header-wrap-bg.gif) repeat-x;
}

#header {
position: relative;
margin: 0 auto;
width: 816px;
height: 145px;
}

#logo {
position: absolute;
top: 35px;
left: 25px;
display: block;
width: 358px;
height: 76px;
text-indent: -9999px;
background: url(images/logo.gif) no-repeat;
}

#header p {
position: absolute;
top: 35px;
right: 20px;
font-size: 1.2em;
text-align: right;
color: #CCC;
margin: 0;
}

#header p span {
display: block;
color: #FFF;
padding-top: 5px;
}


#navigation {
margin: 0 auto;
width: 820px;
padding: 12px 0;
list-style: none;
}

#navigation li {
float: left;
margin-right: 6px;
}

#navigation li a {
display: block;
padding: 7px 14px 6px 14px;
color: #FFF;
font-size: 1.3em;
text-decoration: none;
}

#navigation li a:link, #navigation li a:visited {
}

#navigation li a:hover, #navigation li a:active {
background: #000;
}

#content-wrap {
background: url(images/content-wrap-bg.gif) repeat-x;
}

#content {
margin: 0 auto;
width: 816px;
background: #FFF;
padding: 10px 0 50px 0;
}

#main-content {
float: left;
display: inline;
width: 560px;
margin: 0 0 0 10px;
}



span.inline-image-left {
	margin: -5px 0;

	overflow:  auto;
	float: left;
	color: #000;
	padding: 15px 10px 15px 0;
	text-align: center;
	font: bold 0.9em "Lucida Grande", Lucida, Verdana, sans-serif;
}
span.inline-image-left img, span.inline-image-right img {
	padding-bottom:  3px;
}
span.inline-image-right {
	margin: -5px 0;

	overflow:  auto;
	float: right;
	color: #000;
	padding: 15px 0 15px 10px;
	text-align: center;
	font: bold 0.9em "Lucida Grande", Lucida, Verdana, sans-serif;
}



/* =============== Elements Unique to Home =============== */



#home-header {
background: url(images/home-header-bg.jpg) no-repeat;
padding: 20px 20px 10px 20px;
margin-bottom: 20px;
}

#home-header h1 {
color: #FFF;
text-transform: uppercase;
margin-bottom: 20px;
font-size: 2em;
}

#home-header p {
color: #FFF;
text-transform: uppercase;
font-size: 1.5em;
}

#home-intro {
font-family: georgia, times, serif;
font-size: 1.8em;
color: #C24E05;
}

#side-content-home {
float: right;
display: inline;
width: 218px;
margin: -9px 10px 0 0;
}

#side-content {
	float: right;
	display: inline;
	width: 216px;
	margin:  -9px 10px 0 0;
}
#home-sub-nav {
list-style: none;
}

#home-sub-nav li {
margin-bottom: 12px;
}

#home-sub-nav li a {
display: block;
text-indent: -9999px;
}

#home-sub-nav li a.products-available {
width: 218px;
height: 118px;
background: url(images/products-available.jpg) no-repeat;
}

#home-sub-nav li a.capabilities {
width: 218px;
height: 95px;
background: url(images/capabilities.jpg) no-repeat;
}

#home-sub-nav li a.history {
width: 218px;
height: 107px;
background: url(images/history.jpg) no-repeat;
}



/* =============== Elements Unique to History =============== */

#content-history {
margin: 0 auto;
width: 816px;
background: #FFF url(images/content-history-bg.gif) 0 10px repeat-y;
padding: 10px 0 50px 0;
}

#history-header {
position: relative;
padding: 25px;
margin: 0 10px 25px 10px;
background: url(images/history-header-bg.gif) repeat-y;
}

#history-header h1 {
color: #465567;
font-family: georgia, times, serif;
margin-bottom: 20px;
font-size: 2.6em;
text-transform: lowercase;
font-weight: normal;
width: 515px;
}

#history-header p {
color: #FFF;
font-size: 1.4em;
width: 515px;
margin: 0;
font-family: georgia, times, serif;
}

#side-content-history {
float: right;
display: inline;
width: 210px;
margin: -9px 10px 0 0;
text-align: center;
font-size: 1.1em;
}

#side-content-history p {
margin: 30px;
color: #7187A1;
}

#wwallbank-portrait {
position: absolute;
top: 20px;
right: 30px;
}



/* =============== Elements Unique to Objectives =============== */

#content-objectives {
margin: 0 auto;
width: 816px;
background: #FFF url(images/content-objectives-bg.gif) 0 10px repeat-y;
padding: 10px 0 50px 0;
}

#objectives-header {
position: relative;
padding: 25px;
margin: 0 10px 25px 10px;
background: url(images/objectives-header-bg.gif) repeat-y;
}

#objectives-header h1 {
color: #6C3F21;
font-family: georgia, times, serif;
margin-bottom: 20px;
font-size: 2.6em;
text-transform: lowercase;
font-weight: normal;
width: 515px;
}

#objectives-header p {
color: #FFF;
font-size: 1.4em;
width: 515px;
margin: 0;
font-family: georgia, times, serif;
}



/* =============== Elements Unique to Services =============== */

#content-services {
margin: 0 auto;
width: 816px;
background: #FFF url(images/content-services-bg.gif) 0 10px repeat-y;
padding: 10px 0 50px 0;
}

#services-header {
position: relative;
padding: 25px;
margin: 0 10px 25px 10px;
background: url(images/services-header-bg.gif) repeat-y;
}

#services-header h1 {
color: #FFF;
font-family: georgia, times, serif;
margin-bottom: 20px;
font-size: 2.6em;
text-transform: lowercase;
font-weight: normal;
width: 515px;
}

#services-header p {
color: #FFF;
font-size: 1.4em;
width: 515px;
margin: 0;
font-family: georgia, times, serif;
}

#main-content-services {
float: left;
display: inline;
width: 380px;
margin: 0 0 0 12px;
}

#main-content-services h2, #side-content-services h2 {
color: #4E5E72;
}

#side-content-services {
float: right;
display: inline;
width: 380px;
margin: 0 30px 0 0;
padding: 20px 0;
border: 3px solid #CCC;
background: #FFF;
}

#side-content-services p {
font-size: 1.1em;
margin: 0 20px 6px 20px;
}

#side-content-services ul {
font-size: 1.1em;
color: #555;
margin: 0 20px 6px 45px;
line-height: 140%;
}



/* =============== Elements Unique to Products =============== */

#content-products {
margin: 0 auto;
width: 816px;
background: #FFF url(images/content-services-bg.gif) 0 10px repeat-y;
padding: 10px 0 50px 0;
}

#products-header {
position: relative;
padding: 25px;
margin: 0 10px 25px 10px;
background: url(images/products-header-bg.gif) repeat-y;
}

#products-header h1 {
color: #666;
font-family: georgia, times, serif;
margin-bottom: 20px;
font-size: 2.6em;
text-transform: lowercase;
font-weight: normal;
width: 515px;
}

#products-header p {
color: #FFF;
font-size: 1.4em;
width: 515px;
margin: 0;
font-family: georgia, times, serif;
}

.product {
border-top: 1px solid #CCC;
padding-top: 20px;
margin: 0 20px 20px 20px;
}

.product img {
float: left;
margin: 0 40px 20px 0;
}

.product p {
font-size: 1.1em;
margin: 0 0 5px 0;
}




/* =============== Typography =============== */

h2 {
font-family: georgia, times, serif;
font-weight: normal;
margin: 0 0 15px 20px;
font-size: 1.7em;
}

h3 {
margin: 0 0 15px 20px;
font-size: 1.5em;
}

h4 {
margin: 0 0 5px 0;
font-size: 1.3em;
}

h5 {
font-size: 1.2em;
margin: 0 20px 6px 20px;
border-top: 1px solid #CCC;
padding-top: 10px;
}

p {
color: #555;
font-size: 1.2em;
line-height: 140%;
margin: 0 20px 20px 20px;
}

#main-content ul, #main-content-services ul {
color: #555;
font-size: 1.2em;
line-height: 140%;
margin: 0 20px 20px 40px;
}

strong.intro {
color: #333;
font-size: 1.1em;
}

a:link, a:visited {
color: #333;
}

a:hover, a:active {
color: #333;
text-decoration: none;
}


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

#footer-wrap {
background: #999;
}

#footer {
margin: 0 auto;
padding: 35px 0;
width: 820px;
text-align: center;
}

#footer p {
line-height: 140%;
margin: 0;
}

.company-name {
font-family: georgia, times, serif;
font-size: 1.5em;
color: #444;
}

.company-services {
font-size: 1.3em;
font-weight: bold;
color: #333;
}

.company-description {
color: #444;
text-transform: uppercase;
font-size: 1.3em;
}

.machinery {
color: #444;
font-size: 1.3em;
}

#sub-footer {
margin: 0 auto;
padding: 20px 0 50px 0;
width: 820px;
text-align: center;
}

#sub-footer p {
color: #333;
font-size: 1em;
text-align: center;
margin: 0 0 5px 0;
}

#sub-footer p a:link, #sub-footer p a:visited, #sub-footer p a:hover, #sub-footer p a:active {
color: #333;
text-decoration: none;
}



/* =============== Contact Form =============== */

#contact {
padding: 10px 0 5px 0;
}

#contact p {
line-height: 100%;
margin: 15px 20px; 
font-size: 1.3em;
}

#contact p input {
float: right;
width: 400px;
background: #FFF;
padding: 5px;
border: 1px solid #809DB9;
}

#contact p label {
float: left;
width: 70px;
font-size: 0.9em;
color: #666;
}

#contact textarea {
float: right;
width: 402px;
padding: 4px;
border: 1px solid #809DB9;
} 

#contact p #send {
float: right;
width: 51px;
padding: 3px 5px;
}

#contact p em {
color: #99CC00;
font-size: 0.9em;
}

#contact p.error {
padding-left: 120px;
margin-top: -6px;
font-size: 1em;
color: red;
}

#contact input.error {
border: 1px solid red;
}




/* =============== Bits & Pieces =============== */

.left {
float: left;
margin: 0 20px 20px 0;
}

.right {
float: right;
margin: 0 0 20px 20px;
}

a {
outline: none;
}

img {
border: none;
}

/* =============== Clearing =============== */

.clearfix:after {
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden;
}

.clearfix {display:inline-block;}
/* Hide from IE Mac \*/
.clearfix {display:block;}
/* End hide from IE Mac */