/*////////// GENERAL RULES //////////*/

html {
   height: 100%;
   margin-bottom: 1px;}

body {
   background: #a0a0a0 url('images/background.jpg') repeat-x;
   color: #000000;
   text-align: left;
   font: normal 80% Verdana, Verdana, Geneva, sans-serif;
   padding: 0;
   margin: 0 auto;}

hr {
   background-color: #5392cb;
   color: #5392cb;
   border: none;
   height: 1px;}

ul {
  list-style-image: url('images/bullet.jpg');}

table {
  padding: 0;
  border-collapse: collapse;
  font-size: 100%;
  width: 100%;}

#bgcorner {/* -- this sets the image in the upper left corner --*/
   background: transparent url('images/bgcorner.png') no-repeat scroll left top;
   width: 100%;
   height: 100%;
   margin: 0;
   padding: 0;}
   
#wrapper {/* -- The wrapper holds the header, content, sidebar, and footer areas --*/
	background-color: #ffffff;
   width: 960px;
   border-right: 1px #404040 solid;
   border-bottom: 1px #404040 solid;
   border-left: 1px #404040 solid;
   margin: 0 auto;
   text-align: left;}

/*////////// TYPOGRAPHY //////////*/

a {
   color: #335f86;
   text-decoration: underline;
   outline: none;
   font-weight: bold;}

a:hover {
   color: #606060;
   text-decoration: underline;
   font-weight: bold;}

h1 {
   color: #5392cb;
   font: normal 28px Georgia, Georgia, serif;
   letter-spacing: 2px;
   margin: 0 0 .8em 0;}

h2 {
   background: #ffffff url('images/endcap.png') no-repeat; 
   color: #5392cb;
   font: normal 22px Arial, Arial, sans-serif;
   letter-spacing: 2px;
   margin: .8em 0;
   padding-left: 30px;
   text-align: left;}

h3 {
   color: #5392cb;
   font: bold 16px Georgia, Georgia, serif;
   letter-spacing: 3px;
   line-height: 25px;
   margin: .8em 0;
   text-transform: uppercase;
   text-align: left;}

h4 {
   color: #5392cb;
   font: bold 14px Arial, Arial, sans-serif;
   letter-spacing: 1px;
   line-height: 25px;
   margin: .8em 0;
   text-transform: uppercase;
   text-align: left;}

h5 {
   color: #808080;
   font: bold 14px Georgia, Georgia, serif;
   margin: .8em 0;
   text-transform: uppercase;
   text-align: left;}

h6 {
   color: #5392cb;
   background: transparent url('images/endcap.png') no-repeat; 
   padding: 5px 30px;
   margin: .8em 0 0 0;
   font: bold 12px Arial, Helvetica, sans-serif;}

h7 {
   color: #5392cb;
   font: bold 12px Arial, Arial, sans-serif;
   letter-spacing: 1px;
   line-height: 25px;
   margin: .8em 0;
   text-transform: uppercase;
   text-align: left;}

/*////////// HEADER AREA //////////*/

#header {
   position: relative;
   width: 960px;
   height: 240px;}

/*////////// SLIDESHOW //////////*/

#slideshow {
   position: absolute;
   top: 15px;
   left: 35px;
   width: 330px;}

/*////////// MAIN NAVIGATION //////////*/

/* ---- Drop-Down Menu Formatting ----*/

#menu {
   position: absolute;
   top: 200px;
   left: 10px;
   z-index: 3;
   height: 1%;}

#menu dl { /*Begins the Definition List*/
   float: left;
   width: 158px; /*sets the width of each link group*/
   margin: 0;
   padding: 0;}

/* if you need more or fewer link groups, take the total width of 960 and divide by the
number of link groups you need. Just do the math and subtract an extra pixel or two for
cross-browser wiggle room */

#menu dt { /*Begins Properties for the Definition Topic*/
   line-height: 40px;
   color: #ffffff;
   text-align: center;
   font-weight: bold;
   margin: 0 0 0 0;
   padding: 0;}

#menu dt a {
   color: #ffffff;
   text-decoration: none;
   display: block;
   height: 100%;
   border: 0 none;
   margin: 0; padding: 0;}
   
#menu dt a:hover {
	color: #ffffff;}

#menu dt a:focus {
   background: none;}

#menu dd { /*Begins Settings for Definition Description*/
   background: #404040;
   margin: 0; 
   padding: 0;
   display: none;}

#menu dd li a {
   list-style-image: none;
   list-style-type: none;
   font-weight: normal;
   border-top: 2px #404040 solid;
   border-bottom: 2px #404040 solid;}

#menu dd li a:hover {
   background-color: #5392cb;}

#menu ul {
   list-style-image: none;
   list-style-type: none;
   margin: 0; 
   padding: 0;}
   
#menu li {
   list-style-type: none;
   text-align: center;
   margin: 0; 
   padding: 0;}

#menu li a {
   color: #fff;
   text-decoration: none;
   display: block;
   height: 100%;
   border: 0 none;
   margin: 0; padding: 0;}

#menu li a:focus  {
   background: none;}

#menu li a:hover  {
   background: none;}

/*////////// CONTENT AREA //////////*/

#content {
   float: left;
   width: 620px;
   margin: 10px;
   padding: 0;
   line-height: 1.6em;}

.blocktable {
  padding: 0;
  margin-top: 20px;
  border-collapse: collapse;
  font-size: 100%;
  width: 100%;}

.blockcontent {/* -- sets the table cell properties for the three-column table --*/
   padding: 0 10px;
   font-size: 90%;
   text-align: left;
   vertical-align: top;
   width: 33%;}

.blockcontent4 {/* -- sets the table cell properties for the three-column table --*/
   padding: 0 10px;
   font-size: 90%;
   text-align: left;
   vertical-align: top;
   width: 30%;}

.blockcontent5 {/* -- sets the table cell properties for the three-column table --*/
   padding: 0 10px;
   font-size: 90%;
   text-align: left;
   vertical-align: top;
   width: 30%;}

.blockcontent6 {/* -- sets the table cell properties for the three-column table --*/
   padding: 0 10px;
   font-size: 90%;
   text-align: left;
   vertical-align: top;
   width: 40%;}

.blockcontent h3, .blockcontent h4 {
   border: 1px #5392cb solid;
   margin-top: 0;
   text-align: center;}

.blockcontent4 h3, .blockcontent h4 {
   border: 1px #5392cb solid;
   margin-top: 0;
   text-align: center;}

.blockcontent5 h3, .blockcontent h4 {
   border: 1px #5392cb solid;
   margin-top: 0;
   text-align: center;}

.blockcontent6 h3, .blockcontent h4 {
   border: 1px #5392cb solid;
   margin-top: 0;
   text-align: center;}

.blockcontent2 {/* -- sets the table cell properties for the two-column table --*/
   padding: 0 10px;
   font-size: 90%;
   text-align: left;
   vertical-align: top;
   width: 50%;}

.blockcontent2 h3, .blockcontent2 h4 {
   border: 1px #5392cb solid;
   margin-top: 0;
   text-align: center;}

#contentwide {/* -- used on the one-column page layout --*/
   padding: 10px;
   width: 940px;}

/*////////// SIDEBAR AREA //////////*/

#sidebar {
   float: right;
   margin: 10px 5px;
   padding: 0;
   font-size: 85%;
   width: 308px;}

.textbox {/* -- used for the text box that sits inside of the sidebar area --*/
   background: #ffffff url('images/textboxbg.jpg') no-repeat;
   color: #000000;
   padding: 5px;
   margin: 10px 0;
   border: 1px #a0a0a0 solid;}
   
.textbox h4 {
   border-bottom: 1px #5392cb solid;
	padding-left: 3px;
   margin-top: 0;}

.textbox h7 {
   border-bottom: 1px #5392cb solid;
	padding-left: 3px;
   margin-top: 0;}

#sidebar ul {
  list-style: square;  
  list-style-image: none;}


/*////////// FOOTER //////////*/

#footer {
   background: #5392cb url('images/footer.jpg') no-repeat;
   clear: both;
   text-align: center;
   letter-spacing: 2px;
   color: #ffffff;
   height: 60px;
   font-size: 85%;
   border-top: 1px #404040 solid;
   padding: 20px 0 0 0;
   width: 960px;
   line-height: 1.9em;}

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

#footer li {
   display: inline;
   margin: 0;}

#footer li a {
   color: #ffffff;
   font-weight: normal;
   text-decoration: none;}

#footer li a:hover {
   color: #ffffff;
   font-weight: normal;
   text-decoration: underline;}

#footer p {
   margin: 0;
   padding: 0;}

/*////////// CONTACT FORM //////////*/

#contactform {
   padding: 5px;
   text-align: left;
   margin: 20px 10px 5px 10px;}

#contactform label {
   width: 150px;
   float: left;
   text-align: right;
   margin: 3px 5px 5px 5px;
   clear: both;}

#contactform input {
   margin: 3px 5px 5px 5px;
   background-color: #ffffff;
   color: #000000;
   border: 1px solid #c2c2c2;}

#contactform textarea {
   font: normal 12px Verdana, sans-serif;
   margin: 3px 5px 5px 5px;
   background-color: #ffffff;
   color: #000000;
   border: 1px solid #c2c2c2;}

#contactform .button {
   background-color: transparent;
   text-align: center;
   margin: 5px 0 0 170px;
   border: none;
   clear: both;}

/*////////// PRODUCT CATALOG //////////*/

.catalog {
   padding: 5px;
   line-height: 1em;
   text-align: center;
   vertical-align: top;
   width: 33%;}

/*////////// IMAGES //////////*/

img {
   border: none;}

.mainimage {
   margin: 0 10px 20px 0;
   padding: 5px;
   float: left;
   border: 3px #818181 double;}

.imageleft-noborder {
   margin: 0 10px 0 0;
   float: left;}

.imageright-noborder {
   margin: 0 0 0 10px;
   float: right;}

.imageleft-border {
   margin: 0 10px 0 0;
   padding: 5px;
   float: left;
   border: 3px #818181 double;}

.imageright-border {
   margin: 0 0 0 10px;
   padding: 5px;
   float: right;
   border: 3px #818181 double;}

/*////////// MISC. CLASSES //////////*/

.center {
   text-align: center;}

.clear {
   clear: both;
   font-size: 0;
   line-height: 0;
   height: 1px;}

.calendar {
   text-align: center;
   line-height: 1.2em;
   margin: 0 20px 20px 20px;}