body,
html {
font-family: Helvetica, Arial, sans-serif;
font-size: 0.9em;
margin: 0;
padding: 0;
color: #000;
background-color: #ccc;
}
#main {
color: #444;
padding: 10px;
margin: 0 auto;
}
#feature-large {
height: 250px;
width: 100%;
background: #fff url(/images/index/feature_large_bg.jpg);
}
#feature-large-inner {
padding: 15px 0 0 20px;
}
#feature-large-inner h2 {
color: #f8981d;
}
#feature-large-inner p {
font-weight: bold;
width: 510px;
font-size: 0.9em;
}
#feature-large-inner a {
color: #444;
}
#feature-large-inner a:hover {
text-decoration: underline;
}
#feature-large-inner img {
width: 280px;
height: 230px;
margin: -6px 9px 0 0;
float: right;
}
#feature-small-outer {
padding: 10px 0 5px 0;
}
#feature-small-inner {
height: 150px;
background-color: #fff;
}
#feature-small-inner h2 {
padding: 0;
margin: 12px 0 0 15px;
font-size: 1.1em;
}
#feature-small-inner .product-box {
float: left;
background: #fff url(/images/index/feature_small_bg.jpg);
height: 100%;
width: 198px;
}
#feature-small-inner .product-box-right {
margin-left: 11px;
}
#feature-small-inner .product-box a {
display: block;
width: 188px;
height: 110px;
margin: 7px 0 0 5px;
text-indent: -9999px;
}
#feature-small-inner a.pumps {
background: #fff url(/images/index/pumps.jpg);
}
#feature-small-inner a.bigfoot {
background: #fff url(/images/index/bigfoot.jpg);
}
#feature-small-inner a.igniters {
background: #fff url(/images/index/igniters.jpg);
}
#feature-small-inner a.controls {
background: #fff url(/images/index/controls.jpg);
}
#feature-small-inner a:hover {
background-position: -188px 0;
}
a {
color: #444;
text-decoration: none;
}
p {
padding-bottom: 10px;
margin: 0;
font-size: 1.1em;
line-height: 1.5em;
}
h2 {
padding-bottom: 10px;
margin: 0;
}
img.large {
float: right;
width: 200px;
height: 175px;
margin: 0 15px;
padding: 5px;
text-align: center;
}
img.small {
float: left;
width: 65px;
height: 65px;
margin: 0 10px 0 0;
padding: 1px;
text-align: center;
border: 1px solid #eee;
}
.title {
padding-top: 10px;
margin-left: 20px;
text-transform: capitalize;
}
.orange {
color: #f8981d;
}
.arrow-down {
float: right;
width: 7px;
height: 7px;
margin-top: 3px;
margin-right: 20px;
background-image: url(/images/arrow_down.gif);
}
.bold {
font-weight: bold;
}
#wrap {
background-color: #fff;
width: 845px;
margin: 0 auto;
}
#header {
top: 0;
height: 100px;
background: url(/images/common/header.jpg) no-repeat center left;
background-color: #fff;
}
#logo a {
position: absolute;
display: block;
width: 48px;
height: 70px;
margin: 15px 0 0 15px;
text-indent: -9999px;
}
#nav, #nav ul, #nav li, #nav li ul {
margin: 0;
padding: 0;
}
#nav {
height: 26px;
width: 100%;
background: url(/images/common/gradient_dark.jpg) repeat-x;
border-top: 1px solid #898989;
border-bottom: 1px solid #898989;
}
#nav ul {
list-style: none;
}
#nav li {
float: left;
border-right: 1px solid #898989;
}
#nav a {
color: #fff;
display: block;
padding: 5px 15px;
font-weight: normal;
font-size: 1.1em;
text-transform: capitalize;
}
#nav a:hover {
color: #f8981d;
}
#nav li ul {
display: none;
}
#nav li:hover ul {
display: block;
position: absolute;
}
#nav li:hover li {
float: none;
border-top: 1px solid #898989;
}
#nav li:hover li.last {
border-bottom: 1px solid #898989;
}
#nav li:hover ul a {
background: #444;
}
#nav li:hover ul a:hover {
color: #f8981d;
}
#menu, #menu ul, #menu li, #menu li ul {
margin: 0;
padding: 0;
}
#menu {
float: left;
width: 155px;
padding-top: 5px;
}
#menu ul {
list-style: none;
}
#menu li.last {
margin: 0;
padding: 10px 0;
}
#menu a {
font-size: 1em;
font-weight: bold;
display: block;
background-color: #fff;
color: #444;
padding: 5px 0 5px 15px;
width: 140px;
}
#menu li ul a {
font-size: 0.9em;
padding-left: 25px;
border-top: none;
width: 130px;
}
#menu a.header {
color: #444;
background-color: #f8981d;
border-bottom: 1px solid #fff;
}
#menu a:hover {
text-indent: 5px;
color: #f8981d;
}
#content {
margin-left: 156px;
background-color: #fff;
min-height: 500px;
_height: 500px;
}
#content-inner {
padding: 10px 20px;
color: #333;
}
#content-inner .item-box-outer {
padding: 5px 0;
min-height: 75px;
_height: 75px;
}
#content-inner .item-box {
margin-left: 80px;
min-height: 75px;
width: 550px;
padding-bottom: 10px;
}
#content-inner .item-box a {
color: #444;
font-size: 1.1em;
font-weight: bold;
}
#content-inner .item-box a:hover {
text-decoration: underline;
}
#downloads ul {
list-style: none;
margin: 0;
padding: 0 0 10px;
}
#downloads li {
margin: 5px 0;
padding: 0;
}
#downloads li.header {
margin: 8px 0;
font-weight: bold;
}
#contact form {
padding-bottom: 15px;
}
#contact label {
display: block;
margin-bottom: 10px;
padding: 0;
}
#contact label input, #contact label textarea {
border: 1px solid #ccc;
}
#contact label span {
display: block;
float: left;
width: 100px;
text-align: left;
font-weight: bold;
}
#footer {
clear: both;
background: url(/images/common/gradient_dark.jpg) repeat-x;
height: 26px;
}
#footer p {
color: #fff;
padding: 0 10px;
margin: 0;
line-height: 26px;
}
* html #footer {
height: 1px;
}