html {
height: 101%;
margin-bottom: 1px;
text-align:center;}
	
body {
font: normal 0.85em Verdana, Verdana, Geneva, sans-serif !important;
background: #000000 url('backbar.jpg') repeat-x !important;
color: #000000;
text-align: center;
margin: 0;
padding: 0;}
	
img {
border: none;}

/*This sets the code for the link colors in the body */
	
a {
color: #880807;
text-decoration: none;
font-weight: bold;
outline: none;}
	
a:hover {
color: #880807;
text-decoration: underline;
font-weight: bold;
outline: none;}

/*This sets the code for the heading tags, horizontal rule, and the unordered lists */
	
h1 {
color: #880807;
font: normal 24px "Trebuchet MS", Georgia, serif;
margin: 0 0 20px 0;}
	
h2 {
color: #880807;
font: normal 20px Verdana, Arial, sans-serif;
margin: 5px 0;}
	
h3 {
color: #808080;
font: normal 20px Verdana, Arial, sans-serif;
margin: 5px 0;}
	
h4 {
color: #700000;
font: normal 18px "Comic Sans MS", "Trebuchet MS", sans-serif;
margin: 5px 0;}
	
h5 {
color: #808080;
font: normal 16px "Comic Sans MS", "Trebuchet MS", sans-serif;
margin: 5px 0;}
	
h6 {
color: #700000;
font: bold 12px Verdana, "Trebuchet MS", sans-serif;
letter-spacing: 1px;
margin: 5px 0;}
	
hr {
background-color: #880807;
color: #880807;
height: 1px;
width: 100%;}
	
ul {
padding: 0;
margin: 0 0 20px 20px;
list-style: square;}

#glare {
background: transparent url('glare.png') no-repeat scroll top;
width: 100%;
height: 100%;
margin: 0;
padding: 0;}

/*This sets the code for the wrapper and header */
	
#wrapper {
background-image: url('wrapper.jpg');
text-align: left;
width: 960px;
margin: 0 auto;}
	
#wrapperwide {
background-image: url('wrapper.jpg');
text-align: left;
width: 960px;
margin: 0 auto;}

#header {
position: relative;
background-image: url('header.jpg');
height: 138px;}

/*This sets the code for the global navigation */
	
#global {
position: absolute;
left: 15px;
width: 930px;
top: 97px;
z-index: 1;
color: #ffffff;
text-align: center;
font-size: 95% !important;
height: 36px;
padding: 0 10px;}

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

#global li {
display: inline;}
   
#global li a {
display: block;
text-align: center;
color: #ffffff;
text-decoration: none;
font-weight: bold;
margin: 0;
line-height: 36px;
width: 135px;
float: left;}

#global li a:hover {
color: #ffffff;
font-weight: bold;
text-decoration: none;}

/*This sets the code for the storefront featured category area and some of the content area */

#logoarea {
position: absolute;
top: 0px;
left: 0px;
z-index: 2;
text-align: center;
color: #ffffff;
font-weight: bold;
font-size: 1.0em !important;
width: 960px;
height: 85px; }

#righttopheaderarea {
position: absolute;
top: 5px;
right: 5px;
z-index: 3;
text-align: right;
color: #ffffff;
font-weight: bold;
font-size: .80em !important;
width: 250px;
height: 40px; }

#righttopheaderarea a {
color: #ffffff;
text-decoration: none;
font-weight: bold;
font-size: .80em !important;}
	
#righttopheaderarea a:hover {
color: #ffffff;
text-decoration: underline;
font-weight: bold;
font-size: .80em !important;}

/*This sets the code for the slide show */

#sliderwrapper {
position: absolute;
top: 11px;
left: 275px;
z-index: 6;
width: 410px;
height: 235px;}
  
#slider {
position:relative;
background:url("loading.gif") no-repeat 50% 50%;}

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

/*This sets the code for the movie area and the top box images from right to left */

#moviearea {
position: relative;
height: 275px;
width: 960px;
background-image: url('moviearea.jpg');}

#box1 {
/*top left box image*/
position: absolute;
z-index: 7;
top: 45px;
left: 74px;
width: 90px;
height: 90px;}

#box2 {
/*top right box image*/
position: absolute;
z-index: 8;
top: 45px;
left: 793px;
width: 90px;
height: 90px;}

#box3 {
/*bottom right box image*/
position: absolute;
z-index: 9;
top: 155px;
left: 793px;
width: 90px;
height: 90px;}

#box4 {
/*bottom left box image*/
position: absolute;
z-index: 10;
top: 155px;
left: 74px;
width: 90px;
height: 90px;}

/*This sets the code for the content areas */

#maincontent {
width: 635px;
float: right;
line-height: 1.6em;
margin: 10px;}

#maincontentwide {
width: 930px;
margin: 10px;
text-align: left;
line-height: 1.6em;}

/*This sets the code for the left sidebar */
	
#sidebar {
width: 275px;
float: left;
line-height: 20px;
font-size: .85em !important;
margin: 10px;}

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

#sidebar li {
display: block;
margin: 0;}

#sidebar li a {
color: #880807;
font-weight: bold;
font-variant: small-caps;
text-decoration: none;}

#sidebar li a:hover {
color: #700000;
font-weight: bold;
font-variant: small-caps;
font-size: .85em !important;
text-decoration: underline;}

#sidebar a {
color: #880807;
padding: 0 5px;
text-decoration: none;
font-size: .85em !important;
font-weight: bold;}

#sidebar a:hover {
color: #404040;
text-decoration: underline;
font-size: .85em !important;
font-weight: bold;}

#sidebar h5 {
color: #880807;
font: normal 16px "Comic Sans MS", "Trebuchet MS", sans-serif;
margin: 5px 0;}

.categories {
margin: 10px 0 0 10px;}
 
.categories a {
display: block;
padding: 5px 0;}
 		
/*This sets the code for the footer */
	
#footer {
clear: both;
height: 90px;
color: #ffffff;
background: #ffffff url('footer.jpg') no-repeat;	
text-align: center;
letter-spacing: 2px;
font-size: 75%;
line-height: 1.8em;
padding: 20px 20px 0 20px;}
	
#footer p {
padding: 0;
margin: 0;}
	
#footer a {
color: #ffffff;
padding: 0 5px;
text-decoration: none;
font-weight: bold;}
	
#footer a:hover {
color: #ffffff;
text-decoration: underline;
font-weight: bold;}

/*This sets the code for the fieldset and legend */

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

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

/*Miscellaneous coding */

.tiny {
text-align: center;
font-size: 8px;}

.small {
text-align: center;
font-size: 80%;}

.imageleft {
margin: 0 10px 0 0;
float: left;
border: 3px double #700000;}
	
.imageright {
margin: 0 0 0 10px;
float: right;
border: 3px double #700000;}
	
.imageleft-noborder {
margin: 0 10px 0 0;
float: left;}
	
.imageright-noborder {
margin: 0 0 0 10px;
float: right;}

/* CATALOG DISPLAY TABLE */
table {
padding: 0px;
border-collapse: collapse;
border: none !important;
font-size: 100%;
width: 100%;}

.featured {
padding: 0;
border-collapse: collapse;
margin: 0;
font-size: 100%;
width: 100%;}

.featured img {
padding: 2px;
border: 1px #808080 solid;}
	
.catalogfive {
/*five columns*/
padding: 5px;
text-align: center;
vertical-align: top;
width: 20%;}

/* This sets the add to cart buttons */

.addToCartBtn {
color: #ffffff !important;
font-size: 12px !important;
font-weight: bold;
width:110px;
background-color: #880807 !important;
padding: 0;
border: 3px #808080 double;}

.addedToCart {
background-color:#f0f0f0 !important;
border:2px solid #880807 !important;
margin-bottom:15px;
color:#333333;}

/* This sets the added to cart background color to version v9.3.1*/

.added_to_cart {
background-color:#f0f0f0 !important;
border:1px solid #880807 !important;}
	
/* BUTTONS
----------------------------------------------- */
/******* ACTION BUTTON *******/
 
/* Both browsers apply these styles to the action button */
.actn_button_color {
 border:3px double #700000 !important; /*recolor to match template light color*/
 background-color: #880807 !important;
 cursor:pointer;
 white-space:nowrap;
 padding:2px 3px 2px 3px;
 font-family:Arial, Helvetica, sans-serif;
 color:#202020;
 font-size:12px;
 font-weight:bold;
 text-align:center
}
/* IE uses the filter for the blend */
.actn_button_color {
 * filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr='#ffffff',EndColorStr='#880807';)
 }
/* FireFox uses a background color and white gradient image for the blend */
html>body .actn_button_color {
 background: #880807 url("<ss:value source="$system.styleImage['white_gradient.png']"/>") repeat-x top;
}
/******* BEGIN FIREFOX HOVER FOR ACTION BUTTON *******/
.actn_button_color.actn_button:hover {
 border:3px double #880807; /*recolor to match template dark color*/
 color:#202020;
 background: #880807 url("<ss:value source="$system.styleImage['white_gradient.png']"/>") repeat-x top;
} 
/******* END FIREFOX HOVER FOR ACTION BUTTON *******/
 
/******* REGULAR BUTTON *******/
/* Both browsers apply these styles to the regular button */
.button_color {
 border:3px double #700000; /*recolor to match template light color*/
 cursor:pointer;
 background-color:#880807 !important;
 white-space:nowrap;
 padding:2px 3px 2px 3px;
 font-family:Arial, Helvetica, sans-serif;
 color:#202020;
 font-size:12px;
 font-weight:bold;
 text-align:center
}
/* IE uses the filter for the blend */
.button_color {
 * filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr='#ffffff',EndColorStr='#880807';)
}
/* FireFox uses the background-color and white gradient image for the blend */
html>body .button_color {
 background: #880807 url("<ss:value source="$system.styleImage['white_gradient.png']"/>") repeat-x top;
}
/******* BEGIN FIREFOX HOVER FOR REGULAR BUTTON *******/
.button_color.button:hover {
 border:3px double #880807; /*recolor to match template dark color*/
 color:#202020;
 background: #c9c9c9 url("<ss:value source="$system.styleImage['white_gradient.png']"/>") repeat-x top;
}
/******* END FIREFOX HOVER FOR ACTION BUTTON *******/

.tab_on {
color:#ffffff !important;
font-weight: bold !important;
background-color: #880807 !important;}

.tab_off {
background-color: #700000 !important;
color:#404040 !important;}	

.detaildesc {
border-top:4px solid #e5e5e5;
border-left:1px solid #CCCCCC;
border-right:1px solid #CCCCCC;	
border-bottom:2px solid #e5e5e5;
padding:5px;
margin-bottom:10px;
line-height: 1.6em;
width:99%;
text-align:left;}

/******* Pricing color and size on product pages *******/

.large_price {
color: #404040 !important;
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
font-weight: bold;}

.small_price {
color: #404040 !important;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-weight: bold;}
		
.clear {
clear: both;}
	
.center {
text-align: center;}