/*==============================
														GLOBALS
														Sets the default document font size, family
														and color
														===============================*/
body {
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#3f4a4e;
	text-align: center;
	background:url(../images/bk1.jpg)
} 

p {
	font-family:Arial, Helvetica, sans-serif;
	line-height:20px;
	margin-top:10px;
	margin-bottom:10px;
}

p a {
	color:#3f4a4e;
	font-style:italic;
	text-decoration:none;
}

p a:hover {
	color:#3f4a4e;
	font-style:italic;
	text-decoration:underline;
}

li {
	line-height:20px;
}

a {
	color:white;
}

ul {
	margin-left:5px;
}

.product-detail ul{
	
	margin-left:30px;
	}

.clear {
	margin-top:10px;
	margin-bottom:10px;
	clear:both;
}

h1, h2, h3, h4 {
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	text-align:center;
}

h1 {
	font-size:30px;
}

h2 {
	font-size:14px;
	text-align:center;
	margin-bottom:10px;
}

h3 {
	font-size:12px;
	
}
img {
	margin:5px;
}
.img-cen {
	display: block;
	margin-left: auto;
	margin-right: auto;

}

.key-points img{
	display: block;
	margin-left: auto;
	margin-right: auto;
	padding-left:0px;
	padding-right:0px;
	border:1px #333 solid;
	}

.product-detail img{
	border:1px #333 solid;
}

.product-detail img.no-border{
	border:0px #333 solid;
	}
.product-detail h2 {
	font-size:18px;
}

#site-wrapper #body-wrapper .content-area.inner .product-detail a{
	
		color:#3f4a4e;
		
	}
#site-wrapper #body-wrapper .content-area.inner .product-detail a{
	
		color:#3f4a4e;
		
	}
#site-wrapper #body-wrapper .content-area.inner .product-detail .news img{
	
		float:left;
		
	}
#site-wrapper #body-wrapper .content-area.inner .product-detail .news p{
	
		clear:both;		
	}

	
#site-wrapper #body-wrapper .content-area.inner .product-detail .news{
	line-height:20px;
	margin-top:10px;
	margin-bottom:10px;
		font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#3f4a4e;	
	}	
	
	
	
.key-points h2 {
	font-size:16px;
}

.top-bot-mar {
	margin-top:15px;
	margin-bottom:15px;
}

blockquote.style1 {
	padding: 8px;
	background-color: #faebbc;
	border-top: 1px solid #e1cc89;
	border-bottom: 1px solid #e1cc89;
	margin: 5px;
	background-image: url(images/open-quote.gif);
	background-position: top left;
	background-repeat: no-repeat;
	text-indent: 23px;
}

blockquote.style1 span {
	display: block;
	background-image: url(images/close-quote.gif);
	background-repeat: no-repeat;
	background-position: bottom right;
}

blockquote.style1 span a {
	text-decoration:underline;
	color:#3f4a4e;
}

blockquote.style1 span a:hover {
	font-weight:bold;
}

/*==============================
																SITE WRAPPER
														===============================*/


#site-wrapper {
	margin: 0 auto;
	width:960px;
	min-height:600px;
	text-align: left;
	background:url(../images/content-background.jpg) repeat-y;
}

#wrapper-bottom {
	margin: 0;
	text-align: left;
	background-image: url(../images/footer-divider.gif);
	background-repeat: repeat-x;
	background-position: center top;
	padding: 5px;
	clear: both;
	height: 350px;
}

/*==============================
																HEADER WRAPPER
														===============================*/
#header-wrapper {
	width:950px;
	
	margin-top:0px;
	padding:5px;
}

/*==============================
																HEADER CONTENT
														===============================*/
#logo {
	display:inline;
	width:300px;
	float:left;
}

#header-wrapper h1 {
	text-align:left;
	color:#FFF;
	margin-left:20px;
}
#header-wrapper h1 a{
	text-decoration:none;
	}
#header-wrapper h1 span {
	color:#ffcb00;
}

#header-wrapper h3 {
	color:#ffcb00;
	text-align:left;
	margin-left:20px;
	font-style:italic;
}

#languages {
	float:right;
}

/*==============================
																		MAIN MENU
		 													===============================*/
		
#outer {
	margin-left:10px;
	width:52em;
	display:inline;
	float:left;
	text-align:left;
	position:relative;
}

ul#nav {
	margin:0;
	padding:0;
	list-style:none;
	width:100%;
	height:1.3em;
}

ul#nav li {
	height:1.3em;
	width:120px;
	float:left;
	margin:0;
	padding:0;
	text-align:center;
	color:#fff;
}

ul#nav li a {
	height:1.3em;
	display:block;
	text-decoration:none;
	color:#fff;
	font-size:18px;
}

ul#nav li a:hover {
	color:orange;
}

/* drop down styling */

ul#nav ul {
	position:absolute;
	top:auto;
	width:550px;
	margin:0;
	padding:0;
	list-style:none;
	overflow:visible;
	left:-999em;
	height:34px;
	line-height:2em;
	z-index:2;
}

ul#nav li.current {
	text-decoration:underline;
}

ul#nav li.current a {
}

ul#nav li.current a:hover {
}

ul#nav li.current ul {
	left:0;
	z-index:1;
	top:auto;
	padding-top:5px;
}/* display the submenu for the current page in case js is disabled*/

ul#nav ul li {
	position:relative;
	display:inline;
	width:auto;
	text-align:left;
}

#outer ul#nav ul li a {
	font-size:14px;
	;
	color:#fff;
	width:auto;
	height:auto;
	display:inline;
	padding:0 5px;
	border-right:1px solid #000;
}

/* mac hide \*/
* html ul#nav ul li, #outer ul#nav ul li a {
	height:1%
}/* for ie5*/

/* end hide*/

#outer ul#nav ul li a.final {
	border-right:0px solid #000;
}/*remove border from last sublist */

#outer ul#nav ul li a:hover {
	color:red;
}/*subnav list text change on hover*/

ul#nav li:hover ul, ul#nav li.over ul {
	left:0;
	background:#17191d;
	width:600px;
	border-bottom:thin #FFF solid;
	margin-top:-5px;
	padding-top:10px;
	white-space: nowrap;
} /* The magic */

/*ul#nav li:hover ul, ul#nav li.over ul products { left:0;background:#17191d; margin-left:-200px; width:800px; border-bottom:thin #FFF solid; padding-top:5px;} /* The magic */

/* this subnav just sets the background onto which the subnav is placed */
#subnavbg {
	margin:0px;
	width:100%;
	height:34px;
}

/* mac styles \*//*/
ul#nav ul {
	left:0;
	display:none;
}
ul#nav li.current ul{display:block;z-index:1;}
ul#nav li:hover ul, ul#nav li.over ul { display:block;background:silver; } 


/* end mac styles */

hr {
	color:#FFCC00;
	}
#wrap {
min-height:100%; 
width:910px; 
margin:-1px auto 0;
border-bottom:0;
}
* html #wrap { 
height:100%; 
}
/* ---------- Mega Drop Down --------- */
#mega {
list-style:none;
font-weight:bold;
height:2em;
margin:10px -1px 0 0;
}
#mega li {
background:#FFCC00;
border:1px solid #000;
margin-left:-1px;
float:left;
width:180px;
text-align:center;
position:relative;
}
#mega li:hover {
background:#eee;
border-bottom:0; /* border-bottom:0; and padding-bottom:1px; keeps <li> and <div> connected */
padding:7px 0 1px 0;
margin-top:-7px;
z-index:1; /* shadow above adjacent li */
color:#000;
}
#mega a {
color:#000;
outline:0;
text-decoration:none;
display:block;
line-height:2em;
}


/* ----------- Hide/Show Div ---------- */
#mega div {
position:absolute;
left:-999em;
margin-top:1px;
width:580px;
padding:0 10px 10px;
border:1px solid #000;
border-top:0;
font-weight:normal;
text-align:left;
background:#eee;
}
#mega li:hover div {
left:-1px;top:auto;
}
#mega li.dif:hover div {
left:-451px;
}
/* --------- Within Div Styles --------- */
#mega div .menu-cat {
background:#FFCB00;
font-size:1em;
padding:0 10px;
margin:10px 0 5px 0;
clear:both;
float:left;
width:560px;
position:relative; /* makes above drop shadow */
}
#mega div p {
float:left;
width:130px;
padding-left:10px;
position:relative; /* makes above drop shadow */
text-align:center;
}
#mega div p a {
text-decoration:underline;
float:left;
clear:left;
width:100%; /* For IE6/7 */
line-height:1.4;
}
#mega div a:hover, #mega div a:focus, #mega div a:active {
text-decoration:none;
}
/* ---------- Drop Shadow ---------- */
#mega div .s1, #mega div .s2, #mega div .s3 {
position:absolute;
width:100%;height:100%;
}
#mega div .s1 {
background:url(../images/rightcorner.png) 100% 0 no-repeat;
top:1px;right:-9px;
} 
#mega div .s2 {
background:url(../images/leftcorner.png) 0 100% no-repeat;
bottom:-9px;left:1px;
} 
#mega div .s3 {
background:url(../images/shadow.png) 100% 100%;
top:9px;right:-9px;
}
#mega li:hover .s4 {
background:url(images/li-shadow.png) 100% 0 repeat-y;
position:absolute;
top:0;right:-9px;
height:100%;
padding:0 8px 0 0;
}
* html #mega li:hover .s4 {
background:none;
}
#mega li:hover .dif-s4 {
padding-bottom:9px
}
</style> 


																/*==============================
																		BODY WRAPPER
																===============================*/
#body-wrapper {
	margin-top:20px;
	padding-bottom:10px;
	width:960px;
	vertical-align:top;
}

.content-area {
	padding-top:10px;
	width:950px;
}

.content-area.inner {
	margin-left:10px;
	padding-left:10px;
	padding-right:10px;
	border-left:#15181D 10px solid;
	border-right:#15181D 10px solid;
	padding-bottom:10px;
	background-color:#212428;
	width:900px;
}

.content-area.inner.home {
	margin-top:20px;
	margin-left:10px;
	padding-left:10px;
	padding-right:10px;
	border-left:#15181D 10px solid;
	border-right:#15181D 10px solid;
	padding-bottom:10px;
	background-color:#212428;
	width:900px;
}

.content-area.inner {
	margin-top:20px;
	margin-left:10px;
	padding-left:10px;
	padding-right:10px;
	border-left:#15181D 10px solid;
	border-right:#15181D 10px solid;
	padding-bottom:10px;
	width:900px;
}

.content-area.inner.cart .product-detail {
	padding:10px;
	background-color:#fff;
	width:880px;
	font-family: inherit;

}

.content-area.inner.home .product-detail {
	padding:10px;
	background-color:#F2F9DB;
	width:880px;
	font-family: inherit;
	color:#333;
	
}

.product-detail {
	padding:10px;
	float:left;
	background-color:#FFF;
	width:640px;
	font-family: inherit;
	
}

.key-points {
	padding:10px;
	margin-left:30px;
	float:left;
	background-color:#f1a424;
	width:190px;
	}

.left {
	float:left;
}

.right {
	float:right;
}

.text-left {
	text-align:left;
}

.text-right {
	text-align:right;
}
.text-cen {
	text-align: center;
	
}
#footer {
	margin: 0 auto;
	width:940px;
	margin-top:15px;
	padding-left:10px;
	padding-right:10px;
	text-align: left;
	color:#FFF;
}

/*==============================
																		ROUNDED CORNERS
																===============================*/


.rounded {
	color: #FFF; /* set the text color */
	background: url(../images/orange-box-middle.gif) repeat-y; /* use center of image, and repeat vertically */
	width: 300px; /* same as image width */
	float:left;
	margin-left:15px;
	
}

.rounded h2 {
	margin-top: 0;
	background: url(../images/orange-box-top.gif) no-repeat top center; /* use left portion of image for top bar */
	padding: 10px 10px 0px 10px; /* move text into real content area */
}

.rounded p {
	padding: 0 10px 40px 10px; /* move text into content area */
	background: url(../images/orange-box-bottom.gif) no-repeat bottom center; /* use right portion of image for bottom bar */
	margin-bottom: 0;
	text-align:justify;
}

.rounded hr {
	color:#666;
	background-color:#CCC;
	height: 2px;
	margin-left:10px;
	width:280px;
}

.blue {
	background: url(../images/blue-box-middle.gif) repeat-y; /* use center of image, and repeat vertically */
}

.blue h2 {
	background: url(../images/blue-box-top.gif) no-repeat top center; /* use left portion of image for top bar */
}

.blue p {
	background: url(../images/blue-box-bottom.gif) no-repeat bottom center; /* use right portion of image for bottom bar */
}

#contact-area {
		
		margin-top: 25px;
}

#contact-area input, #contact-area textarea {
		padding: 5px;
		width: 400px;
		font-family: Helvetica, sans-serif;
		font-size: 1.4em;
		margin-left: 15px;
		border: 2px solid #ccc;
}

#contact-area textarea { height: 90px; }

#contact-area textarea:focus, #contact-area input:focus { border: 2px solid #900; }

#contact-area input.submit-button {
		width: 100px;
		margin-top:20px;
		margin-left:175px;
}

td.left {
		width: 100px;
		text-align: left;
		font-size: 1.4em;
}

/*******************************

FOOTER CONTENT

//////////////////////*/

#footer {
	height:150px;
}

#footer-inside {
	height:200px;
	position:relative;
	width:960px;
}

#footer h4 {
	
	color:#F8A64E;
	font-family:Georgia, Serif;
	font-size:22px;	
	font-style:italic;
	font-weight:normal;
	margin:0 0 10px;
	text-align:center;
}

#footer p {
	color:#FEFFED;
	font-size:14px;
}

#footer ul {
	margin:0 0 0 15px;
}

#footer li {
	color:#FEFFED;
	font-size:14px;
	margin:0 0 3px;
}

#footer a {
	border-bottom:1px dotted #666666;
	text-decoration:none;
	color:#FEFFED;
}

#footer a:hover {
	border-bottom:1px solid white;
	color:white;
}

#about {
	float:left;
	width:230px;
}

#news {
	float:left;
	width:210px;
}

#contact {
	float:left;
	width:220px;
}

#products {
	float:left;
	width:260px;
	margin-left:20px;
}


table.shoppingcart{
	width:100%;
	}


.productitem{
	list-style:none;
	}
.productitem:hover{
	background-color:#C2BDD2;

	}
	
	.red-banner{
		 background:url(/images/red-background.jpg) no-repeat;
		 width:170px; 
		 height:340px; 
		 padding:10px;
		 color:#FFF;
		 font-size:14px;
		 text-align:center
		}