/* Global Fonts */
body { font-family: Arial, Helvetica, sans-serif; }
#navmain,
h1, h2, h3, h4, h5 { font-family: "Arial Black", Arial, Helvetica, sans-serif; font-weight: normal !important; letter-spacing: 0.5px; }

/* Text Shadows */
#navsection h4, #content #picbox h3 { text-shadow: #333377 -2px 1px 5px; }
#siteinfo h2 { text-shadow: #222222 -2px 1px 8px; }

/* Global Styles */
body { background: #656f7d url(../images/site/bg-body.png) repeat-x left top; }
#container { position: relative; width: 1124px;  background: transparent url(../images/site/bg-container.jpg) no-repeat left top; }

#branding { height: 184px; margin-bottom: 13px; }
#branding a { position: absolute; left: 76px; top: 20px; width: 240px; height: 100px; text-indent: -9999px; }

#siteinfo { width: 953px; padding: 20px 0 10px 95px; background: #4a515a; font-size: 1em; color: #fff;  }
#siteinfo p { margin-top: 10px; }
#siteinfo p .yellow { text-transform: lowercase; font-variant: small-caps; color: #f3f045; }
#siteinfo p .spacer { margin: 0 10px; }

#content { overflow: hidden; min-height: 580px; }
#content-main { float: left; width: 468px; min-height: 500px;  margin: 0 0 30px 319px; padding: 20px 16px 6px; background: #fff; }
#content-supp { float: left; margin-left: 20px; width: 220px; }

/* Navigation: Main */

#navmain { position: absolute; top: 31px; right: 76px; }
#navmain li { float: left; margin-left: 2px; border-bottom: 4px solid #000; }
#navmain li.active,
#navmain li:hover { border-bottom-color: #f3f045; }
#navmain li a { display: block; width: 84px; height: 11px; margin-bottom: 2px; padding: 11px 7px 7px; background: #4f5b5f; 
				color: #fff; font-size: 11px; line-height: 1.0; }
#navmain li a:hover { text-decoration: none; }
#navmain li.active a:after { color: #f3f045; content: "\00a0\00bb"; } /* Use escaped unicode to get it to work correctly, currently &nbsp;&raquo; */

/* Navsupp */

#navsupp { position: absolute;  left: 93px; top: 197px;  width: 210px;  }

#navsection { background: #3f444b; margin-bottom: 16px; }
#navsection h4 { height: 29px; padding: 11px 62px 5px 19px;
				 background: transparent url(../images/site/bg-navsupp-title.png) no-repeat left top;
				 font-size: 1.8em; color: #fff; line-height: 29px;  }
#navsection ul { padding: 14px 9px 4px; border-top: 4px solid #0094c3; background: transparent url(../images/site/bg-navsupp-ul.png) no-repeat 18px top; }
#navsection li a { position: relative; display: block; margin-bottom: 5px; padding: 3px 8px; background: #4f5b5f; 
				   line-height: 18px; font-size: 12px; color: #ffffff; }
#navsection li.active a,
#navsection li a:hover { background: #f3f045; color: #3f444b; text-decoration: none; }
#navsection li.active a:before { position: absolute; left: -25px; top: 3px; width: 9px; height: 18px; content: url(../images/site/bg-navsupp-active.png); }
#navsection li.active a:after { content: "\00a0\00bb"; } /* Use escaped unicode to get it to work correctly, currently &nbsp;&raquo; */

/* Global side content */
#global a#buttonlink { display: block; width: 170px; padding: 20px; margin-bottom: 16px;
						background: #686f7c; color: #fff; font-size: 1.4em; line-height: 1.1em;	 }
#global a#buttonlink:hover { text-decoration: none; }

#global #imagelink { padding: 9px; background: #2f3a40; }
#global #imagelink img { border: 8px solid #686f7c; margin-bottom: 9px; }
#global #imagelink p { color: #fff; font-size: 1.1em; line-height: 1.2; font-weight: normal; }
#global #imagelink p:before { content: "//\00a0\00a0"; color: #0094c3; } /* Use escaped unicode to get it to work correctly, currently //&nbsp;&nbsp; */
						
#content #picbox { position: absolute; top: 197px; right: 76px; width: 193px;  margin-bottom: 30px; padding: 10px; background: #3691c1;  }					
#content #picbox img { border: 8px solid #686F7C; margin-bottom: 10px; }
#content #picbox h3 { margin: 0.5em 0; color: #fff; font-size: 2.2em; color: #fff; line-height: 1.1; }
#content #picbox p { color: #fff; }
#content #picbox #picbox-caption { margin-bottom: 10px; padding-bottom: 5px; border-bottom: 2px dotted #fff; }

/* General Typography */

a { color: #f3f045; }

#content h1,
#content h2,
#content h3,
#content h4,
#content h5 { margin-bottom: 0.5em; line-height: 1.3; }

#content h1 { font-size: 2.1em; color: #0094c3; }
#content h2 { font-size: 1.8em; color: #0094c3; }
#content h3 { font-size: 1.6em; color: #0094c3; }
#content h4 { font-size: 1.4em; color: #3f444a; }
#content h5 { font-size: 1.2em; color: #3f444a; }

#content p,
#content ul,
#content ol { font-family: Arial, Helvetica, sans-serif; font-size: 1.3em; line-height: 1.3; margin-bottom: 1em; color: #3f444a; }

#content ul ul,
#content ul ol,
#content ol ul,
#content ol ol { font-size: 1em; }

#content ul li { line-height: 1.8em; }

#content ul,
#content ol,
#content blockquote { margin-left: 20px; }

#content ul,
#content ol { list-style: disc; }

#content a { text-decoration: none; font-weight: bold; color: #3f444a; }
#content a:hover { text-decoration: underline; }

/* Generic Form Styles */

#content-main form fieldset { margin-bottom: 1em; padding: 20px; background: #cfd2d7; }

#content-main form label { float: left; width: 150px; font-size: 1.2em; line-height: 1.3; margin-top: 3px; }
#content-main form .select label { margin-top: 4px; }

#content-main form .text,
#content-main form .select,
#content-main form .multitext,
#content-main form .datetime,
#content-main form .checkbox { overflow: hidden; margin-bottom: 1em; }

#content-main form .button { overflow: hidden; margin-bottom: 1em; padding: 20px; background: #ccc; }

#content-main form .text input,
#content-main form .select select,
#content-main form .multitext textarea { float: left; width: 300px; border: 1px solid #000; padding: 2px 4px; }

#content-main form .select select { width: 310px; padding: 2px 2px; }
#content-main form .button input { float: right; border: 3px solid #000; background: #fff; font-size: 1.5em; color: #000; font-weight: bold; }
#content-main form .checkbox input { float: left; margin: 3px 0 0; }

#content-main form .datetime .day,
#content-main form .datetime .month,
#content-main form .datetime .year,
#content-main form .datetime .hour,
#content-main form .datetime .minute,
#content-main form .datetime .ampm { float: left; margin-right: 4px; border: 1px solid #000; padding: 2px 4px; }

#content-main form .datetime .day { width: 44px; }
#content-main form .datetime .month { width: 91px;  }
#content-main form .datetime .year { width: 60px; }
#content-main form .datetime .hour { width: 44px; }
#content-main form .datetime .minute { width: 45px; margin-right: 0; }
#content-main form .datetime .ampm { margin-left: 3px; margin-right: 0; }

#content-main form .datetime select.day,
#content-main form .datetime select.month,
#content-main form .datetime select.year,
#content-main form .datetime select.hour,
#content-main form .datetime select.minute,
#content-main form .datetime select.ampm { padding: 2px 2px; }
#content-main form .datetime input.year { padding: 3px 4px; }
#content-main form .datetime select.year { width: 70px; }

#content-main form .radiogroup span { float: left; width: 225px; line-height: 1.3; }
#content-main form .radiogroup input { float: left; }

#content-main form .text input,
#content-main form .select select,
#content-main form .multitext textarea,
#content-main form .datetime .day,
#content-main form .datetime .month,
#content-main form .datetime .year,
#content-main form .datetime .hour,
#content-main form .datetime .minute,
#content-main form .datetime .ampm,
#content-main form .button input { width: 268px; font-size: 1.2em; line-height: 1.3; 
									font-family: "Lucida Grande", Arial, Helvetica, sans-serif; }
#content-main form .text input,
#content-main form .multitext textarea { border-color: #0094c3; }
#content-main form .button input { width: 150px; height: 30px; border: none; background: #0094C3; color: #fff; }

/* Page Specific - Gallery */
#products #content-main { width: 697px; }
#gallery-list { overflow: hidden; border-top: 2px dotted #3691c1; padding-top: 16px; }
.gallery-item { position: relative; float: left; width: 221px; height: 167px; margin-right: 16px; margin-bottom: 16px; }
.gallery-item.last { margin-right: 0; }
.gallery-item a { display: block; }
.gallery-item img { border: 1px solid #686f7C; }
.gallery-item span { position: absolute; left: 1px; bottom: 1px; width: 199px; padding: 10px; 
					 background: rgba(0, 0, 0, 0.5); color: #ffffff; text-shadow: 2px 2px 2px #000000; font-size: 1.2em; line-height: 1.2; }

