/* Global Styles */

body {
	background-color: #e7e7e7;
	color: #555;
	text-align: center;
	padding: 0;
	margin: 0;
}

table { /* For IE 5.5 (Windows) */
	font-size: 100%;
}


/* Specific Styles */

#wrap {
	position: relative;
	width: 760px;
	background-color: #fff;
	text-align: left;
	margin: 0px auto;
	padding:20px;
	}

	#banner {
		cursor: pointer;
	}

		#banner .bannerTitle {
			color: #fff;
			font-size: 260%;
			font-weight: bold;
			line-height: 80%;
			text-align: left;
			padding: 53px 0 0 50px;
			margin: 0 0 7px 0;
		}

		#banner .bannerTagline {
			color: #b3c7d7;
			font-size: 90%;
			font-weight: bold;
			text-transform: lowercase;
			text-decoration: none;
			padding: 0 0 0 50px;
			margin: 0;
		}
	
	#logo {
		position: relative;
		top:0px;
		left:0px;
		width: 160px;
		height:60px;
		padding:0;
		margin:0;
		clear: none;
	}

	#navigation {
		height: 38px; 
		background: transparent url(../images/menubg.gif) no-repeat left top;
		margin: 7px 0 20px 0; 
	}

	#navigation.absolute /* used for layout #2 */
		{
		position: absolute;
		float: right;
		background: transparent url(../images/menubg_small.gif) no-repeat left top;
		clear: none;
		top:0px;
		right:0px;
		width: 580px;
		text-align: center;
		margin: 5px;
		padding-top:10px;
		margin-top:15px;
		}

		#navigation ul {
			float: right;
			clear: both; 
			list-style: none;
			text-transform: uppercase;
			padding: 0 15px 0 0;
			margin: 10px 0;
		}
		
		#navigation.absolute ul {
			margin: 0;
		}

		#navigation li {
			padding: 0;
			margin: 0 2px;
		}

		#navigation li.current {
			color: #7A0D84;
		}

		#navigation li.horizontal {
			display: inline;
			padding: 10px 0;
		}

		#navigation li.vertical {
			margin: 2px 0;
		}

		#navigation a, #navigation a:link, #navigation a:active, #navigation a:visited {
			color: #fff;
			text-decoration: none;
			font-weight: normal;
			font-size: 90%;
			padding: 11px 10px 11px 10px;
		}
		

		#navigation li.current a, #navigation li.current a:link, #navigation li.current a:active, #navigation li.current a:visited {
			color: #7A0D84;
		}

		#navigation a:hover {
			color: #7A0D84;
			text-decoration: none;
		}

		#navigation.absolute a:hover {
			color: #7d7c71;
			text-decoration: none;
		}

	#content {
		clear: both;
		padding: 0 5px 30px 12px;
		margin: 0;
	}

		#content a, #content a:link, #content a:active, #content a:visited{
			color: #678eaf;
		}

		#content a:hover {
			color: #7d7c71;
		}

		#content h1.pTitle {
			color: #7A0D84;
			font-size: 180%;
			margin: 0 0 15px 0;
		}

		#content h2 {
			color: #BDCE00;
			font-size: 130%;
			margin: 20px 0 5px 0;
		}

		#content h2.sTitle {
			margin-top: 0;
		}

		#content p {
			line-height: 125%;
			margin: 0 0 15px 0;
		}

		#content ul {
			list-style-type: disc;
			padding: 0;
			margin: 0 0 15px 30px;
		}

		#content ol {
			padding: 0;
			margin: 0 0 0 30px;
		}

		#content li {
			padding: 1px 0;
			margin: 0;
		}

		#content .pluginBox {
			font-size: 90%;
			margin: 20px 0 0 0;
		}

			#content .pluginBox h2.sTitle {
				background: transparent url(../images/deco.gif) no-repeat left center;
				font-size: 130%;
				font-weight: bold;
				letter-spacing: 0.03em;
				padding: 1px 0 0 18px;
				margin: 0;
			}

			#content .pluginBox ul {
				margin: 0 0 5px 33px;
			}
	
	#contentSide {
		width: 160px;
		clear: right;
		float: right;
		padding-right: 12px;
	}

		#contentSide .pluginBox h2.sTitle {
			background-color: transparent;
			font-size: 120%;
			font-weight: bold;
			letter-spacing: 0.03em;
			margin: 0 0 3px 0;
			padding: 0;
			color:#BDCE00;
			}

		#contentSide .pluginBox p {
			margin: 5px 0;
		}

		#contentSide .pluginBox ul {
			font-size: 90%;
			padding: 0;
			margin: 0 0 25px 0;
		}
		#contentSide .pluginBox ul li {
			padding: 2px 0;
			margin: 0 0 0 20px;
		}

		#contentSide a, #contentSide a:link, #contentSide a:active, #contentSide a:visited {
			color: #678eaf;
		}

		#contentSide a:hover {
			color: #7d7c71;
		}
		
	#bottomNavigation {
		clear: both;
		height: 38px;
		background: transparent url(../images/menubg.gif) no-repeat left top;
		font-size: 90%;
		text-align: center;
	}

		#bottomNavigation ul {
			padding: 11px 0;
			margin: 0;
		}
		
		#bottomNavigation li {
			display: inline;
			padding: 0 10px;
		}

		#bottomNavigation a, #bottomNavigation a:link, #bottomNavigation a:active, #bottomNavigation a:visited {
			color: #fff;
			text-decoration: none;
		}

		#bottomNavigation a:hover {
			color: #7A0D84;
			text-decoration: none;
		}

	#footerWrap
		{
		}
		#footer
			{
			color: #678eaf;
			font-size: 0.9em;
			padding: 0;
			margin: 15px 20px;
			}
		#plug
			{
			text-align: right;
			padding: 0 10px 5px 10px;
			}
			#plug a
				{
				padding-left: 10px;
				color: #678eaf;
				}

	div.withNavigation {
		width: 600px;
	}

	div.withSide  {
		clear: left;
		float: left;
		width: 535px;
	}

	table#navigationTable {
		clear: both;
		margin: 20px 0 20px 0;
	}
		
		table#navigationTable td#navigationCell {
			background: transparent none;
			border-right: 1px solid #dbd8c6;
		}

		table#navigationTable td#navigationCell #navigation {
			height: auto;
			width: 128px;
			background-image: none;
			text-align: left;
			margin: 0;
		}

		table#navigationTable td#navigationCell #navigation ul {
			padding: 0;
			margin: 0;
			width: 100%;
		}

		table#navigationTable td#navigationCell #navigation li.current {
			background-color: transparent;
		}

		table#navigationTable td#navigationCell #navigation a, table#navigationTable td#navigationCell #navigation a:link, table#navigationTable td#navigationCell #navigation a:active, table#navigationTable td#navigationCell #navigation a:visited {
			display: block;
			width: 100%;
			color: #bab8a9;
			text-decoration: none;
			font-weight: normal;
			font-size: 90%;
			padding: 3px 6px 3px 6px;
		}

		table#navigationTable td#navigationCell #navigation li.current a, table#navigationTable td#navigationCell #navigation li.current a:link, table#navigationTable td#navigationCell #navigation li.current a:active, table#navigationTable td#navigationCell #navigation li.current a:visited {
			background-color: transparent;
			color: #678eaf;
			font-weight: bold;
		}

		table#navigationTable td#navigationCell #navigation a:hover {
			color: #7d7c71;
		}

		table#navigationTable #content {
			padding: 0 15px;
		}

		table#navigationTable div.withNavigation {
			width: 580px;
			padding: 0 0 0 20px;
		}

		table#navigationTable div.withSide  {
			clear: left;
			float: left;
			width: 395px;
		}


h1, h2, h3, h4 {color:#BDCE00;}

/* UTILITIES */
	
/* Messages to users */
.alertOK /* confirmation message */
	{
	color:#0C659E;
	}
	
.alertError
	{
	color:#f00;
	}

div.rsNavigate {
	margin: 20px 0 0 0;
	padding: 5px;
	text-align: center;
	clear: both;
	}

	#content div.rsNavigate ul {
		margin-bottom: 0;
	}

	div.rsNavigate li {
		display: inline;
		font-weight: bold;
	}

	#content div.rsNavigate li a, #content div.rsNavigate li a:link, #content div.rsNavigate li a:active, #content div.rsNavigate li a:visited {
		background: #b4c7d6 none;
		color: #fff;
		font-size: 80%;
		text-transform: uppercase;
		padding: 3px 7px;
		border: 0;
		margin: 0 5px;
	}

	#content div.rsNavigate li a:hover {
		background-color: #678eaf;
	}

	#content div.rsNavigate li.current {
		background: #678eaf none;
		color: #fff;
		font-size: 80%;
		text-transform: uppercase;
		padding: 3px 7px;
		border: 0;
		margin: 0 5px;
	}


/* USER COMMENTS */

#content div.userComment {
	background-color: #f6f6ed;
	padding: 10px;
	border: 1px solid #e9e7d8;
	margin-top: 10px;
}

#content div.userComment p {
	margin: 8px 0 0 0;
}

#content div.userComment p.author {
	color: #678eaf;
	margin-top: 0;
}

#content div.userComment p.author small {
	color: #555;
	padding-left: 10px;
}


/* FORMS */

form.fStandard {
	padding: 10px;
	border: 1px solid #e9e7d8;
	margin: 25px 0;
}

form.fLong /* Long form, used by e.g. for checkout by the online shop */
	{
	padding: 5px 5px 0px 15px;
	margin: 20px 0;
	width: 80%;
	}

form.fInline {
	background-color: #f6f6ed;
	text-align: center;
	padding: 10px;
	border: 1px solid #e9e7d8;
	margin: 30px 0 15px 0;
}

form.fPlugin {
	font-size: 90%;
}
	
	#content p.fTitle {
		color: #678eaf;
		font-size: 130%;
		font-weight: bold;
		margin: 0 0 10px 0;
	}

	#content p.fLegend {
		font-size: 1.0em;
		margin: 0 0 10px 0;
	}

	div.fInputArea {
		margin: 0 0 10px 0;
	}

	div.fInputAreaInline { /* used for e.g. the product search form */
		text-align: center;
		margin: 10px 0;
	}

	div.fSubmitArea {
		text-align: center;
		margin: 15px 0 0 0;
	}


/* FORM LABELS */

label.fLabelInline {
	margin: 0 5px;
}
label.fLabelFixed
	{
	width:150px;
	float: left;
	text-align: right;
	margin: 3px 5px;
	padding: 0 5px 0 0;
	font-weight: bold;
	}


/* FORM ERROR HANDLING */

label.fError {
	color: #f00;
}


/* FORM FIELDS */

input.fInput, textarea.fInput, select.fInput {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 90%;
	font-weight: normal;
	border: 1px solid #ccc;
	padding: 2px;
}

input.fInput {
	padding: 2px 4px;
	margin: 2px 0 0 0;
}

#contentSide .pluginBox input.fInput {
	width: 145px !important;
}

form.fStandard textarea.fInput {
	margin-top: 10px;
}

form.fPlugin input.fInput {
	font-size: 100%;
}

input.fInputInline, select.fInputInline {
	color: #666;
}

input.fSubmit {
	background-color: #b4c7d6;
	color: #fff;
	font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
	font-size: 80%;
	font-weight: bold;
	text-transform: uppercase;
	border: none;
	padding: 1px 5px;
	margin-left: 10px;
}

div.fInputAreaInline input.fSubmit {
	background-color: #fff;
	color: #666;
	border: 1px solid #ccc;
}

div.pluginBox input.fSubmit {
	font-size: 90%;
}

input.fSubmit:hover {
	background-color: #678eaf;
}

div.fInputAreaInline input.fSubmit:hover {
	background-color: #bab8a9;
	color: #fff;
}
