
body, html
	{
    margin:0;
    padding:0;
    }

body
	{
	text-align:center;
	color: #000;
	background-color:#fff;
}
	
/* LAYOUT */
#wrap
	{
	position: relative;
	font-size: 1.0em;
	margin:1em auto;
    min-width:780px;
	width: 780px;
	text-align: left;
	padding:5px;
	background-color:#fff;
	}
	#bannerWrap
		{
		padding: 0;
		}
		#banner
			{
			text-align: left;
			cursor: pointer;
			background-repeat: no-repeat;
			}
			#banner .bannerTitle
				{
				padding: 20px 40px 0 30px;
				color: #fff;
				font-size: 20px;
				font-weight: bold;
				}
			#banner .bannerTagline
				{
				clear: both;
				padding: 0 40px 0 30px;
				/* color: #F4982F; */
				color: #fff;
				font-size: 12px;
				font-weight: bold;		
				}
	#logo
		{
		position: relative;
		top:0px;
		left:0px;
		width: 170px;
		height:57px;
		padding:0;
		margin:0;
		}
	#navigation
		{
		text-align:center;
		background-color:#fff;
		padding: 0 0 5px 0;
		}
	#navigationCell /* table cell containing the vertical navigation */
		{
			background-color:#fff;
		}
	#navigation.absolute /* used for layout #2 */
		{
		position: absolute;
		top:0px;
		right:0px;
		width: 620px;
		height: 35px;
		text-align: right;
		margin: 5px;
		padding-top:20px;
		}
		#navigation a
			{
			color: #000AA;
			text-decoration: none;
			font-size: 0.85em;
			
			padding-bottom: 3px;
			text-transform: uppercase;
			}
		#navigation a:hover
			{
			color: #FF6600;
			text-decoration: bold;
			border-bottom: 0px solid #f29a30;
			}
		#navigation ul
			{
			margin: 0;
			padding: 0px;
			clear: both;
			}
			#navigation ul.absolute /* used for layout #2 */
				{
				margin: 20px 0;
				padding: 0 20px 0 0;
				clear: both;
				}
			#navigation ul
				{
				padding-top:8px;
				}
			#navigation li
				{
				padding: 4px;
				margin: 20px 4px;
				}
			#navigation li.horizontal  /* specific attributes for the horizontal navigation bar */
				{
				display: inline;
				}
			#navigation li.vertical  /* specific attributes for the vertical navigation bar */
				{
				list-style: none;
				text-align: left;
				}

			#navigation li:hover
				{
				/* background: yellow; */
				}
			#navigation li.current a
				{
				color: #f29a30;
				border-bottom: 0px solid #f29a30;
				}
	#content
		{
			clear: left;
			padding:20px 15px 0 10px;
		}
	div.withNavigation /*class appended to content div when next to horizontal nav bar */
		{
			padding:0;
		}
	div.withSide  /* class appended to content div when next to side content */
		{
		clear: left;
		float: left;
		width: 68%;
		/* border-right: 1px dashed #333; */
		margin-right: 0px;
		}
		#content .pluginBox
			{
			margin: 20px 0 10px 5px;
			}
			#content .pluginBox h2
				{
				border-bottom: 1px solid #009dc8;
				margin: 0 40px 0 0;
				padding: 0 0 0 2px;
				}
	#contentSide
		{
		margin-top:30px;
		margin-right: 15px;
		width: 25%;
		clear: right;
		float: right;

		}
		#contentSide .pluginBox
			{
			margin: 0 0 10px 0;
			padding: 0 0 10px 0;
			border: 0px solid #ccc;
			background-color:#fff;
			}
			#contentSide .pluginBox h2
			{
			background-color:#fff;
			font-weight:bold;
			font-size:1.0em;
			padding: 5px 1px 5px 5px;
			color:#013682;
			margin:0;
			text-transform: uppercase;
			}
	#bottomNavigation
		{
		clear: both;
		text-align: center;
		padding: 10px 0 10px 0;
		}
		#bottomNavigation li
			{
			display: inline;
			padding: 0 10px;
			}
			
		#bottomNavigation a
			{
			color: #999999;
			text-decoration: none;
			text-align: middle;
			text-transform: uppercase;
			font-size: 0.8em;
			}
		#bottomNavigation a:hover
			{
			color: #999999;
			}
			
	#footerWrap
		{
		width:778px;
		padding: 0;
		margin: 0;
		}
		#footer
			{
			background: transparent url(../images/footer_background.gif);
			margin: 0;
			padding: 1px 1px;
			text-align: center;
			text-transform: uppercase;
			font-size: 9px;
			font-family: Arial;
			color: #fff;
			}
		
		#plug
			{
			clear: both;
			margin: 10px 0;
			text-align:right;
			}
			#plug a {margin-left:10px;}

/* ELEMENTS */
table
	{
	font-size: 1.0em;
	}
h1, h1.pTitle  /* page title */
	{
	font-size:1.4em;
	margin: 5px 0 0 0;
	color: #003399;
	}
	
h2, h2 a
	{
	font-size:1.2em;
	color: #FF3300;
	}
	
h2.sTitle /*sub title used for news and product lists titles as well*/
	{
	font-size:1.2em;
	font-weight: normal;
	margin: 5px 0 0 0;
	}
	
	
h3
	{
	font-size: 1.1em;
	padding:0;
	margin:15px 0 5px 0;
	color: #003399;
	}
	
h4 {color:#FF3300;}

p
	{
	font-size: 1.0em;
	margin: 8px 0 0 0;
	line-height:1.25;
	}
ul
	{
	margin:0 0 0 25px;
	padding:2px;
	list-style : square;
	}
ol
	{
	margin:0 0 0 25px;
	padding:2px;
	}
li
	{
	margin:4px 0 0 0;
	padding:0;
	line-height:1.3em;
	}
a
	{
	color:#0C659E;
	}

/* UTILITIES */

/* Messages to visitors (when e.g. posting comments) */
.alertOK
	{
	color:#0C659E;
	}
.alertError
	{
	color:#f00;
	}	
/* Navigation between result sets (used on the news and products listing pages) */
div.rsNavigate  /*rs stands for resulet set */
	{
	margin: 20px;
	padding: 5px;
	border-top: 1px dashed gray;
	border-bottom: 1px dashed gray;
	text-align: center;
	clear: both;
	}
	div.rsNavigate li
		{
		display: inline;
		border: 1px solid black;
		margin: 20px;
		padding: 2px 10px;
		background: #FFC;
		font-weight: bold;
		}
	div.rsNavigate li.current
		{
		background: #FCC;
		}

/* user comments (used mostly on the news detail page for now ) */
div.userComment
	{
	width: 80%;
	background: #eee;
	border-top: 1px solid #999;
	border-bottom: 1px solid #999;
	margin: 20px;
	}

div.userComment p
	{
	margin: 3px 20px;
	}

div.userComment p.author
	{
	margin: 3px 5px;
	}

/* FORMS */
form.fStandard /*form displayed in the content div */
	{
	background: #eee;
	border: 1px solid #000;
	padding: 5px 5px 0px 15px;
	margin: 20px 0;
	width: 80%;
	}

form.fInline /*used by the prodicy search form */
	{
	border: 1px solid #000;
	padding: 2px;
	margin: 20px 10% 20px 10%;
	text-align: center;
	}
form.fPlugin /* form usually displayed in the sideContent div */
	{
	padding: 5px 5px 0px 15px;
	}
	
/* FORM ELEMENTS */
p.fTitle /* the title of the form */
	{
	font-size: 1.2em;
	font-weight: bold;
	margin: 5px 0 5px 0;
	}
p.fLegend /* the legend of the form */
	{
	font-size: 1.0em;
	margin: 2px 0;
	}
div.fInputArea
	{
	margin: 10px 0 0 0;
	}
div.fInputAreaInline  /* used for e.g. the product search form */
	{
	margin: 10px 0;
	text-align: center;
	}
div.fSubmitArea
	{
	margin: 0;
	padding: 10px 0;
	}

/* FORM LABELS */
label.fLabel
	{
	font-weight: bold;
	}
label.fLabelInline
	{
	margin: 0 5px;
	}
	
/* FORM ERROR HANDLING */
label.fError  /* Class added to label with a validation error. */
	{
	color:#f00;
	}
	
/* FORM FIELDS */
input.fInput
	{
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 1.0em;
	padding: 2px;
	}
input.fInputInline, select.fInputInline /* used by the product search form */
	{
	font-weight: bold;
	}
textarea.fInput
	{
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 1.0em;
	padding: 2px;
	}

input.fSubmit {
	font-size: 1.0em;
	font-weight:bold;
	padding: 1px 5px;
	}
input.fInput:focus, textarea:focus ,fInput:focus, select.fInput:focus
	{
	background:#fffff6;
	}