/*////////// 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: #4d66b6;
   color: #4d66b6;
   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: #233172;
   text-decoration: underline;
   outline: none;
   font-weight: bold;}

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

h1 {
   color: #4d66b6;
   font: bold 28px Monotype Corsiva, Georgia, serif;
   letter-spacing: 2px;
   margin: 0 0 .8em 0;}

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

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

h4 {
   color: #4d66b6;
   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: #4d66b6;
   background: transparent url('images/endcap.png') no-repeat; 
   padding: 5px 30px;
   margin: .8em 0 0 0;
   font: bold 12px Arial, Helvetica, sans-serif;}

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

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

/*////////// 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: #4d66b6;}

#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%;}

.blockcontent h3, .blockcontent h4 {
   border: 1px #4d66b6 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 #4d66b6 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 #4d66b6 solid;
	padding-left: 3px;
   margin-top: 0;}

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


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

#footer {
   background: #4d66b6 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;}