@charset "utf-8";
/* ======== GENERAL RULES ======== */

html {
height: 100%;
margin-bottom: 1px;}
  
body {
height: 100%;
background: #3e3e3e url('../images/backbar.jpg') repeat-x;
font: normal .90em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
color: #ffffff;
text-align: left;
padding: 0;
margin: 0;}

header, footer, nav, article, section, aside, hgroup {
display: block;}  
  
img {
border: none;}

hr {
background-color: #4b8c2a;
color: #4b8c2a;
height: 1px;
width: 100%;}

ul {
list-style-type: none;
margin: 10px 0 20px 10px;
padding: 0;}
 
ul li {
background: url('../images/bullet1.png') no-repeat 0 4px;
padding: 0 0 0 10px;}
 
ul li a {
color: #4b8c2a;
text-decoration: none;
font-weight: bold;
padding: 0;}
 
ul li a:hover {
color: #707070;
text-decoration: underline;}

.blockquote{ 
padding:5px 50px 5px 50px; 
line-height:24px; 
font-style: italic;
background: url('../images/quote.png') no-repeat top left; 
color:#c0c0c0;
border:dashed 1px #c0c0c0;}

fieldset {
border: 1px dashed #c0c0c0;
padding: 5px;
margin: 10px 0;}

legend {
color: #4b8c2a;
background-color: #252525;
font: bold 16px Arial, Helvetica, sans-serif;
letter-spacing: 2px;
padding: 2px 5px;
margin: 0 0 0 15px;}

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

.cellborder {
border: solid 1px #c0c0c0;	
padding: 5px;}

/* ======== TYPOGRAPHY ======== */

a {
color: #4b8c2a;
text-decoration: none;
font-weight: bold;
outline: none;}
  
a:hover {
color: #b0e894;
text-decoration: underline;
font-weight: bold;
outline: none;}

h1 {font: 40px 'Marcellus', Verdana, Helvetica, sans-serif; color: #4b8c2a; margin: .3em 0 .3em 0; letter-spacing: 1px;}
h2 {font: 28px 'Marcellus', Arial, Verdana, Helvetica, sans-serif; color: #b0e894; margin: .3em 0; letter-spacing: 1px; text-align: center; border-bottom : 1px solid;}
h3 {font: 24px 'Marcellus', Verdana, Helvetica, sans-serif; color: #4b8c2a; margin: .2em 0; padding: 0;}
h4 {font: 40px 'Marcellus', Verdana, Helvetica, sans-serif; color: #4b8c2a; margin: .3em 0 .3em 0; letter-spacing: 1px;}
h5 {font: normal 14px Verdana, Helvetica, sans-serif; color: #4b8c2a; margin: .3em 0;}
h6 {font: normal 14px Verdana, Helvetica, sans-serif; color: #b0e894; margin: .3em 0;}

.dropcap {
float: left; 
color: #4b8c2a; 
font: 60px/50px Georgia, Times, "Times New Roman", serif;
padding: 3px 4px 0 0;}

p.dropcap {
overflow: hidden;}

.button {
font-size: 0.90em;
color: #ffffff;
padding: 5px;
border-radius: 5px;
background-color: #4b8c2a;
text-decoration: none;
font-weight: normal;
box-shadow: 0 2px 3px #000;}

.button:hover {
color: #ffffff;
padding: 5px;
border-radius: 5px;
background-color: #505050;
text-decoration: none;
font-weight: normal;
box-shadow: 0 2px 3px #000;}

/* ======== LAYOUT RULES ======== */
#wrapper {
text-align: left;
width: 980px;
margin: 0 auto;
background-color: transparent;}

#wrappertextareas {
position: relative;
text-align: left;
width: 980px;
min-height: 100%; 
height: auto !important; 
height: 100%;
margin: 0 auto -335px;
padding-top: 10px;
background-color: #252525;
box-shadow: 0 0 10px #000;}

/* ======== HEADER AREA ======== */
header {
position: relative; 
width: 980px; 
height: 120px;
color: #ffffff;}

/* ======== LOGO/SITE NAME AREA ======== */
#nameplate {
position: absolute; 
top:0;
left:0;
width: 990px;
height: 65px;
text-align: left;
padding: 0;}

#nameplate h1 {
font: 40px 'Marcellus', Verdana, Helvetica, sans-serif; 
color: #ffffff; 
letter-spacing: 1px;
margin-top: 0;}

#nameplate p {
font-size: 18px;
font-family: 'Marcellus', cursive, Verdana, Helvetica, sans-serif; 
color: #ffffff; 
letter-spacing: 1px;
padding: 0;
margin: 0;}

/* ======== NEWS AREA, SLIDE SHOW AND MAIN PAGE AREA ======== */
#topsection {
position: relative;
width: 980px;
height: 315px;}

#topsectiontextarea {
position: absolute;
top: 0;
left: 0;
width: 320px;
height: 260px;
padding: 20px;
background: url('../images/slidetext.jpg') no-repeat;
color: #ffffff;
box-shadow: 0 0 10px #000;}

#sliderwrapper {
position: absolute;
top: 0;
left: 400px;
width: 580px;
height: 300px;
box-shadow: 0 0 10px #000;}
  
#slider {
position:relative;}

#slider img {
position:absolute;
top:0px;
left:0px;
display:none;}

#mainimagearea {
position: absolute;
top: 0;
left: 400px;
width: 580px;
height: 300px;
color: #000000;
box-shadow: 0 0 10px #000;}

/* ======== MAIN NAVIGATION AREA ======== */
#mainnav {
position: absolute;
top: 68px;
left: 15px;
color: #ffffff;
width: 960px;
height: 60px;
margin: 0;
font-size: 1.00em;
text-transform: uppercase;}

#nav {
margin: 0;
padding: 0;
list-style: none;}

/* make the LI display inline */
/* its position relative so that position absolute */
/* can be used in submenu */
#nav li {
float: left;
display: block;
background-color: #4b8c2a;
border-radius: 10px 10px 0 0;
position: relative;
z-index: 500;
margin: 0 4px;
padding: 0;}

/* this is the parent menu */
#nav li a {
display: block;
padding: 10px 12px;
text-decoration: none;
color: #ffffff;
background-color: #4b8c2a;
border-radius: 10px 10px 0 0;
box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.4);
text-align: left;
border: 1px #000000 solid;
border-bottom: none;
font-weight:normal;
letter-spacing: 1px;}

#nav li a:hover {
color: #ffffff;
background-color: #404040;}

/* submenu, it's hidden by default */
#nav ul {
position: absolute;
left: 2px;
display: none;
margin: 0;
padding: 0;
list-style: none;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);}

#nav ul li {
width: 180px;
float: left;
border-top: 1px solid #fff;
border-left: 0;
border-right: 0;
border-bottom: 0;
background-color: #404040;
border-radius: 0;
padding: 0;
margin: 0;
background-image: none;}

/* display block will make the link fill the whole area of LI */
#nav ul a {
display: block;
height: 15px;
padding: 4px 5px;
color: #ffffff;
border-radius: 0;
box-shadow: none;
border: none;
font-size: 0.90em;
text-transform: none;}

#nav ul a:hover {
color: #ffffff;
text-decoration: none;
background-color: #404040;}

/* ======== SIDEBAR AREAS ======== */
#sidebarLeft {
float: left;
width: 23%;
text-align: left;
font-size: 0.90em;
line-height: 1.4em;
margin: 0 1%;}
	
#sidebarRight {
float: right;
width: 23%;
text-align: left;
font-size: 0.90em;
line-height: 1.4em;
margin: 0 1%;}

/* ======== CONTENT AREA ======== */
#contentRight {
float: right;
width: 71%;
padding: 0 1%;
margin: 0 1%;
line-height: 1.5em;
overflow: hidden;}
	
#contentLeft {
float: left;
width: 71%;
padding: 0 1%;
margin: 0 1%;
line-height: 1.5em;
overflow: hidden;}
	
#contentMiddle {
float: left;
width: 46%;
padding: 0 1%;
margin: 0 1%;
line-height: 1.5em;
overflow: hidden;}
	
#contentFull {
width: 98%;
margin: 0 1%;
line-height: 1.5em;
overflow: hidden;}

/* ======== SECTION BLOCKS ======== */
.contentBox2 {
float: left;
width: 48%;
text-align: left;
line-height: 1.4em;
margin: 0 1%;}
	
.contentBox3 {
float: left;
width: 31.333%;
text-align: left;
line-height: 1.4em;
margin: 0 1%;}
	
.contentBox4 {
float: left;
width: 23%;
text-align: left;
line-height: 1.4em;
margin: 0 1%;}

.marginLeft {margin-left: 0 !important;}
.marginRight {margin-right: 0 !important; float: right !important;}

/* ======== FOOTER ======== */
.push {
height: 335px;
clear: both;}

#footer-outer {
position: relative;
left: 0;
bottom: 0;
height: 335px;
width: 100%;
text-align: center;
background: #131313 url('../images/footer.jpg') repeat-x;}

footer {
clear:both;
width: 980px;
color: #ffffff ;
text-align: center;
letter-spacing: 2px;
font-size: 75%;
line-height: 1.5em;
padding: 30px 0 0 0;
margin: 0 auto;}

footer p {
padding: 0;
margin: 0;}
  
footer a {
color: #4b8c2a;
padding: 0 5px;
text-decoration: none;
font-weight: bold;}
  
footer a:hover {
color: #b0e894;
text-decoration: underline;
font-weight: bold;}

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

footer li {
margin: 0;
padding: 0;}

footer li a {
color: #4b8c2a;
padding: 0 5px;
text-decoration: none;
font-weight: bold;}

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

/* ======== MISCELLANEOUS CLASSES ======== */
.center {
text-align: center;}  

.tiny {
font-size: 75%;
text-align: center;}

.right {
text-align: right;}

.left {
text-align: left;}

.clear {
clear: both;}

.clearsmall {
height: 1px;
line-height: 0;
margin: 0;
padding: 0;
clear: both;}

.calendar {
text-align:center;}

.highlight {
background-color: #FFFF00;
color: #000000;}

.home {
background: url('../icons/home.png') no-repeat 0 3px;
padding: 0 0 5px 25px;}

.call {
background: url('../icons/call.png') no-repeat 0 3px;
padding: 0 0 5px 25px;}

.email {
background: url('../icons/email.png') no-repeat 0 3px;
padding: 0 0 5px 25px;}

.hours {
background: url('../icons/hours.png') no-repeat 0 3px;
padding: 0 0 5px 25px;}

    
/* ======== IMAGE FORMATTING ======== */
img {
border: none;}
	
.imageleft {
margin: 0 10px 0 0;
float: left;}
	
.imageright {
margin: 0 0 0 10px;
float: right;}
	
.imageleft-border {
background-color: #ffffff;
margin: 0 10px 0 0;
padding: 3px;
float: left;
border: 1px #d0d0d0 solid;}
	
.imageright-border {
background-color: #ffffff;
margin: 0 0 0 10px;
padding: 3px;
float: right;
border: 1px #d0d0d0 solid;}
	
.image-catalog {
border: 1px #d0d0d0 solid;
padding: 5px;
margin: 5px 10px;
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.4);}

.image-gallery {
border: 1px #d0d0d0 solid;
padding: 5px;
margin: 5px 10px;}

/* ======== PRODUCT TAB FORMATTING ======== */
ul.tabs {
margin: 0;
padding: 0;
float: left;
list-style: none;
height: 32px;
border-bottom: 1px solid #4b8c2a;
border-left: 1px solid #4b8c2a;
border-radius: 15px 15px 0 0;
width: 100%;}

ul.tabs li {
float: left;
margin: 0;
cursor: pointer;
padding: 0px 21px ;
height: 31px;
line-height: 31px;
border: 1px solid #4b8c2a;
border-left: none;
font-weight: bold;
background: #404040;
overflow: hidden;
position: relative;
border-radius: 10px 10px 0 0;}

ul.tabs li:hover {
background: #202020;}
	
ul.tabs li.active{
background: #4b8c2a;
border-bottom: 1px solid #4b8c2a;
color: #ffffff;}
	
.tab_container {
border: 1px solid #4b8c2a;
border-top: none;
clear: both;
float: left; 
width: 100%;
background: #3a3a3a;}
		
.tab_content {
padding: 10px;
font-size: 1.0em;
display: none;}