/**
 * Defaults and Resets
 */
html, body {margin: 0; padding: 0; background: #97a0aa url(../images/bg-top.gif) repeat-x;}

body {font-family: Arial, Verdana, Sans-Serif; font-size: 12px; line-height: 18px; color: #43433c;}

form {margin: 0; padding: 0;}

img {border: 0;}

td {vertical-align: top;}

p {margin: 0 0 20px 0;}

a {color: #0083d5;}
a:hover {color: #e76200;}

h1.pageTitle {margin: 0; padding: 6px 0 22px 234px; font-size: 28px; font-weight: normal; line-height: normal; color: #00416a;}
h2 {margin: 0 0 20px 0; font-size: 14px; font-weight: normal; line-height: 20px; text-transform: uppercase; color: #00416a;}
h3 {margin: 0 0 20px 0; font-size: 16px; font-weight: normal; line-height: normal; color: #43433c;}
h4 {margin: 0 0 10px 0; font-size: 14px; font-weight: normal; line-height: 20px; color: #00416a;}
h5 {margin: 0 0 0 0; font-size: 16px; font-weight: normal; line-height: normal; color: #43433c;}
h6 {margin: 0 0 0 0; font-size: 15px; font-weight: normal; line-height: normal; color: #00416a;}
:focus {outline: 0;}

/**
 * General
 */
.clearBoth, .clear {clear: both; height: 0px; font-size: 1px; line-height: 0px; display: block;}

a.arrow {font-size: 14px; background: url(../images/arrow.gif) no-repeat 0 2px; padding-left: 12px;}

/**
 * Lists
 */
ul.inline {margin: 0; padding: 0; list-style-type: none;}
ul.inline li {display: inline;}

ul.list {margin: 0; padding: 0; list-style-type: none;}


ul.subnav {margin: 0 0 30px 0; padding: 0; list-style-type: none; font: 13px/18px Arial; border-top: solid 1px #b8b7af;}
ul.subnav li a {display: block; padding: 5px 15px 6px 15px; color: #43433c; text-decoration: none; border-bottom: solid 1px #b8b7af; background: #eae9e1;}
ul.subnav li a:hover {background: #b3b2ab;}
ul.subnav li.on a {color: #fbfbfb; background: #64645d;}

/**
 * Layout
 */
#header > div,
#nav > div,
#page > div,
#footer > div {width: 952px; margin: auto;}

#header > div {position: relative; height: 141px; overflow: hidden; border-top: solid 7px #43433c; background: url(../images/bg-header.jpg) no-repeat right top;}
#header .seal {position: absolute; top: 5px; left: 19px;}
#header .logo {position: absolute; top: 46px; left: 158px;}
#header .tagline {position: absolute; top: 80px; left: 158px;}
#header .nav {position: absolute; top: 0; right: 0; margin-right: 10px; background: url(../images/bg-header-nav.gif) no-repeat left bottom; font-size: 11px; line-height: normal; color: #fff; text-transform: uppercase;}
#header .nav > div {margin: 0 -10px 0 10px; padding: 5px 5px 10px 0; float: left; position: relative; background: url(../images/bg-header-nav.gif) no-repeat right bottom;}
#header .nav ul {margin: 0; padding: 0; list-style-type: none;}
#header .nav ul li {display: inline;}
#header .nav ul li a {color: #fff; text-decoration: none; padding: 0 9px;}
#header .nav ul li a:hover {color: #0083d5;}

#nav {font: 14px/28px Arial;}
#nav ul {margin: 0; padding: 0 0 0 15px; list-style-type: none;}
#nav ul li {float: left; display: block;}
#nav ul li a {float: left; display: block; text-align: center; color: #fff; text-decoration: none; border-right: solid 1px #7c9cac; border-bottom: solid 1px #0083d5;}
#nav ul li a:hover {color: #fff; background: #296f9c;}
#nav ul li.on a,
#nav ul li.on a:hover {color: #015990; background: #faf9f3; border-color: #faf9f3;}

#nav .item1 a {width: 55px; border-left: solid 1px #7c9cac;}
#nav .item2 a {width: 159px;}
#nav .item3 a {width: 143px;}
#nav .item4 a {width: 149px;}
#nav .item5 a {width: 85px;}
#nav .item6 a {width: 128px;}
#nav .item7 a {width: 66px;}
#nav .item8 a {width: 118px;}

#page {border-bottom: solid 2px #0083d5; background: #e1e8ea;}
#page > div {width: 922px; padding: 15px 17px 15px 15px; background: #faf9f3;}

#pagePhoto .photo img {display: block;}
#pagePhoto .caption {font-size: 11px; line-height: normal; text-align: right; padding: 5px 10px 20px 0;}
.caption2 {font-size: 11px; line-height: normal; text-align: right; width: 450px; padding: 5px 10px 10px 0;}
.caption3 {font-size: 11px; line-height: normal; text-align: right; width: 300px; padding: 5px 10px 10px 0;}

#sidebar {float: left; width: 218px; padding-right: 16px;}

#body {float: left; width: 686px;}
#body1column {float: left; width: 640px;}

body.threeColumnLayout #content {float: left; width: 450px;}
body.threeColumnLayout #rightSidebar {float: right; width: 218px;}
body.threeColumnLayout #leftSidebar {float: left; width: 218px;}
body.threeColumnLayout #contentPhoto {float: left; width: 350px;}
body.threeColumnLayout #rightPhoto {float: right; width: 300px;}

#footer {border-top: solid 6px #00416a;}
#footer > div {width: 932px; padding: 0 17px 30px 5px;}
#footer .content {float: left; width: 690px;}
#footer .content .title {font-size: 14px; padding: 15px 0 0 10px; margin: 0 0 15px 0; color: #000;}
#footer .content ul {margin: 0; padding: 0; list-style-type: none; font: 13px/22px Arial; color: #fff;}
#footer .content ul li {display: inline;}
#footer .content ul li a {color: #fff; text-decoration: none; padding: 0 10px;}
#footer .content ul li a:hover {color: #0083d5;}
#footer .subscribe {float: right; width: 218px; margin-right: 10px; background: url(../images/bg-footer-email.gif) no-repeat left bottom; font: 12px/14px Arial; color: #e7e7e7;}
#footer .subscribe > div {width: 198px; margin: 0 -10px 0 10px; position: relative; padding: 5px 15px 10px 5px; background: url(../images/bg-footer-email.gif) no-repeat right bottom;}
#footer .subscribe form {padding: 10px 0 0 0;}
#footer .subscribe input[type="text"] {float: left; margin: 1px 4px 0 0; width: 130px; font-family: Verdana, Arial, Sans-Serif; font-size: 10px; color: #6f6f6f;}
#footer .subscribe input[type="image"] {float: left;}
#footer .subscribe .message {font-size: 10px; padding: 4px 0 4px 0;}
#footer .legal {font: 10px/14px Arial; color: #43433c; text-align: right; padding-top: 20px;}
#footer .legal a {color: #43433c; text-decoration: none;}
#footer .legal a:hover {color: #000;}

/**
 * Home Page
 */
#home #feature {float: right;}

#slideshow {float: left; width: 686px; height: 389px; position: relative;}
#slideshow .nav {position: absolute; top: 0; left: 0; width: 84px; height: 369px; overflow: hidden; background: url(../images/slide-shadow.png) no-repeat right top;}
#slideshow .nav div {width: 77px; height: 73px; border: solid 1px #fff; border-width: 0 1px 1px 0;}
#slideshow .nav div img {display: block;}
#slideshow .slides {position: absolute; top: 0; right: 0; width: 608px; height: 369px}
#slideshow .slides div {position: absolute; top: 0; left: 0;}
#slideshow .arrow {position: absolute; top: 17px; left: 78px; width: 25px; height: 37px;}
#slideshow .credits {}
#slideshow .credits div {position: absolute; bottom: 0; right: 0; font-size: 11px; line-height: normal; text-align: right; padding-right: 10px;}

#home .footer {padding: 10px 0 0 0;}
#home .footer .feature {float: left; margin-right: 16px;}
#home .footer .more {float: left; margin-right: 0;}

body.home h1 {margin: 0 0 10px 0; font-size: 13px; font-weight: normal; color: #00416a; text-transform: uppercase;}

/**
 * Feature Boxes
 */
.feature {width: 188px; min-height: 330px; padding: 10px 15px 10px 15px; border-top: solid 4px #e76200; background: url(../images/bg-fade.gif) repeat-x;}
.feature h4 {margin: 0 0 10px 0; font-size: 13px; font-weight: normal; color: #00416a; text-transform: uppercase;}

.featureShort {min-height: 340px; background-image: url(../images/bg-fade-short.gif);}
.featureMedium {min-height: 500px; background-image: url(../images/bg-fade-medium.gif);}
.featureShortest {min-height: 300px; background-image: url(../images/bg-fade-short.gif);}

.featureTall {min-height: 675px; background-image: url(../images/bg-fade-tall.gif);}

.featureOrange {border-color: #e76200;}
.featureBlue {border-color: #0083d5;}
.featureTeal {border-color: #019f8b;}

.feature .photo {margin: -10px -15px 15px -15px;}
.feature .photo img {display: block;}

.feature p {margin-bottom: 10px;}


/**
 * Other
 */
div.products > div {padding-bottom: 20px;}
div.products .photo {float: left; width: 190px;}
div.products .photo img {display: block;}
div.products .description {float: right; width: 440px;}
div.products .description .price {margin-top: 15px; font-weight: bold;}

div.seals > div {padding-top: 20px; padding-bottom: 10px;}
div.seals .photo {float: left; width: 120px;}
div.seals .photo img {display: block;}
div.seals .description {float: right; width: 550px;}

