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

	CSS on Sails
	Title: BrightGrid
	Author: XHTMLized (http://www.xhtmlized.com/)
	Date: June 2009

***********************************************************************************************

	1. BASE
			1.1 Reset
			1.2 Accessibility Navigation & Hide
			1.3 Clearfix
			1.4 Default Styles

	2. LAYOUT
			2.1 Structure
			2.2 Header
			2.3 Navigation
			2.4 Content
			2.5 Menubar, Sidebar
			2.6 Footer

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


/* 1. BASE
-----------------------------------------------------------------------------------------------
===============================================================================================*/


/* 1.1 Reset
-----------------------------------------------------------------------------------------------*/

html, body, div, span, object, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, samp, small, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
a, ins, del { text-decoration: none; }
table { border-collapse: collapse; border-spacing: 0; }
th, td { vertical-align: top; }
th { text-align: left; }

/* 1.2 Accessibility Navigation & Hide
-----------------------------------------------------------------------------------------------*/

ol#accessibility-nav, .hide { position: absolute; top: -999em; left: -999em; height: 1px; width: 1px; }

/* 1.3 Clearfix
-----------------------------------------------------------------------------------------------*/
#header:after,
#content-wrapper:after,
#content:after,
div.intro-dl:after,
#footer:after,
.wrap-inner:after,
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
	overflow: hidden;
}

/* 1.4 Default Styles
-----------------------------------------------------------------------------------------------*/
html {
	background: #fff;
}
body {
	color: #666;
	font-size: 14px;
	font-family: "Arial", "Helvetica", sans-serif;
}
hr { display: none; }
strong { font-weight: bold; }
em { font-style: italic; }
del { text-decoration: line-through; }
th { font-weight: normal; }
address, cite, dfn { font-style: normal; }
li { list-style: none; }
abbr, acronym { border-bottom: 1px dotted #999; cursor: help; }
input, textarea, select { font-family: "Arial", "Helvetica", sans-serif; }
a, a:visited { color: #0088d1; text-decoration: none; }
a:hover, a:active { color: #0088d1; text-decoration: underline; }

.textRight {
	text-align: right;
}

.floater {
	float: left;
}

.floatright {
	float: right;
}

.floatercontent {
	float: left;
	width:460px;
}

.small {
	font-size: 9px;
}

/* 2. LAYOUT
-----------------------------------------------------------------------------------------------
===============================================================================================*/

/* 2.1 Structure
-----------------------------------------------------------------------------------------------*/

.wrap-inner {
	margin: 0 auto;
	width: 902px;
}

/* 2.2 Header
-----------------------------------------------------------------------------------------------*/

#header {
	position: relative;
	z-index: 1;
	height: 160px;
	background: url(../../_ui/images/bg_mainmenu.png) repeat-x 0 100%;
}

#header .wrap-inner {
	position: relative;
	z-index: 1;
	height: 160px;
}

	#header h1 {
		position: absolute;
		top: 21px;
		left: 2px;
		width: 182px;
		height: 90px;
	}

		#header h1 a {
			display: block;
			width: 182px;
			height: 90px;
			overflow: hidden;
			font-size: 17px;
			color: #0088d1;
		}

			#header h1 a span {
				position: absolute;
				top: 0;
				left: 0;
				z-index: 10;
				width: 182px;
				height: 90px;
				background: #fff url(../../_ui/images/h1.png) no-repeat 0 0;
			}

	#header ul.top-menu {
		position: absolute;
		right: 0;
		top: 53px;
	}

			#header ul.top-menu li a {
				display: block;
				float: right;
				font-size: 15px;
				font-weight: bold;
				background: url(../../_ui/images/ico_contact.png) no-repeat 0 0;
				padding: 0 0 2px 24px;
			}

	#header ul.main-menu {
		position: absolute;
		left: 0;
		bottom: 2px;
		height: 42px;
		background: url(../../_ui/images/bg_mainmenu_a.png) no-repeat 100% 0;
		padding-right: 2px;
	}

		#header ul.main-menu li {
			position: relative;
			display: block;
			float: left;
			height: 42px;
		}

			#header ul.main-menu li a {
				display: block;
				height: 31px;
				float: left;
				padding: 11px 26px 0 31px;
				font-size: 15px;
				color: #000;
				background: url(../../_ui/images/bg_mainmenu_a.png) no-repeat -498px 0;
			}

			#header ul.main-menu li a:hover,
			#header ul.main-menu li:hover a,
			#header ul.main-menu li.hover a,
			#header ul.main-menu li.active a {
				text-decoration: none;
				color: #525252;
				background: url(../../_ui/images/bg_mainmenu_a.png) no-repeat 0 -42px;
			}

			#header ul.main-menu li.active a,
			#header ul.main-menu li.active a:hover {
				padding: 11px 18px 0 26px;
				color: #aaa;
			}

			#header ul.main-menu li ul {
				display: none;
				position: absolute;
				top: 42px;
				left: 2px;
				height: auto;
				background: url(../../_ui/images/bg_mainmenu_ul.png) no-repeat 100% 100%;
				padding: 0 1px 3px 0;
			}

			#header ul.main-menu li:hover ul,
			#header ul.main-menu li.hover ul {
				display: block;
			}

				#header ul.main-menu li ul li {
					position: static;
					display: block;
					float: none;
					height: auto;
				}

					#header ul.main-menu li ul li a,
					#header ul.main-menu li:hover ul li a,
					#header ul.main-menu li.hover ul li a {
						display: block;
						height: auto;
						float: none;
						padding: 10px 92px 9px 13px !important;
						color: #0088d1;
						background: #f7f7f7 url(../../_ui/images/bg_dot-h.png) repeat-x 0 0;
						white-space: pre;
					}

					#header ul.main-menu li ul li:first-child a {
						background: none;
					}

					#header ul.main-menu li ul li a:hover {
						color: #525252;
					}

	#header form {
		position: absolute;
		right: 0px;
		bottom: 8px;
	}

		#header form fieldset {
		}

			#header form fieldset input[type="text"] {
				display: block;
				float: left;
				width: 148px;
				height: 21px;
				padding: 4px 9px 0 9px;
				background: url(../../_ui/images/bg_form_text.png) no-repeat 0 0;
				border: 0 none;
				margin: 0 6px 0 0;
				color: #989797;
			}

			.opera #header form fieldset input[type="text"] {
				height: 25px;
				padding: 0 9px 0 9px;
			}

			#header form fieldset input[type="submit"] {
				display: block;
				float: left;
				width: 27px;
				height: 25px;
				background: url(../../_ui/images/button_submit.png) no-repeat 0 0;
				border: 0 none;
				cursor: pointer;
				text-indent: -8000px;
				overflow: hidden;
				line-height: 25px;
			}

/* 2.3 Navigation
-----------------------------------------------------------------------------------------------*/

/* 2.4 Content
-----------------------------------------------------------------------------------------------*/

#content-wrapper {
	position: relative;
	z-index: 0;
	background: #fff url(../../_ui/images/bg_content.png) repeat-x 0 0;
	margin: -2px 0 0 0;
}

#content-wrapper .wrap-inner {
	margin: 0 auto;
	width: 944px;
	padding-bottom: 4px;
}

div.intro {
	width: 901px;
	height: 340px;
	background: url(../../_media/images/pic_index.jpg) no-repeat 1px 43px;
	padding: 43px 0 0 1px;
	margin: 0 auto 6px auto;
}

	div.intro div {
		width: 415px;
		height: 340px;
		padding: 0 0 0 36px;
		float: right;
		background: url(../../_ui/images/bg_intro.png) no-repeat 0 0;
	}

		div.intro div h2 {
			font-size: 28px;
			color: #fff;
			padding: 86px 0 23px 0;
		}

		div.intro div p {
			font-size: 22px;
			color: #fffbdd;
			line-height: 103%;
			padding: 0 0 49px 1px;
		}

		div.intro div p.more {
			font-size: 16px;
			line-height: auto;
			padding: 0 0 0 1px;
		}

			div.intro div p.more a {
				display: block;
				width: 126px;
				height: 31px;
				padding: 11px 0 0 13px;
				background: url(../../_ui/images/button_intro.png) no-repeat 0 0;
			}

div.intro-dl {
	background: #fff;
	padding: 38px 21px 0 21px;
}

	div.intro-dl dl {
		position: relative;
		float: left;
		width: 34%;
		min-height: 174px;
		background: url(../../_ui/images/bg_dot-v.png) repeat-y 0 0;
	}

	div.intro-dl dl.one {
		background: none;
		width: 294px;
	}

	div.intro-dl dl.two {
		width: 314px;
	}

	div.intro-dl dl.three {
		width: 294px;
	}

		div.intro-dl dl dt {
			padding: 0 10px 16px 106px;
			font-weight: bold;
			font-size: 16px;
			margin: -3px 0 0 0;
		}

		div.intro-dl dl.one dt {
			padding-left: 88px;
		}

		div.intro-dl dl dd {
			padding: 0 10px 14px 106px;
			font-size: 15px;
			line-height: 120%;
		}

		div.intro-dl dl.one dd {
			padding-left: 89px;
		}

			div.intro-dl dl dd img {
				display: block;
				position: absolute;
				top: 0;
				left: 20px;
			}
			div.intro-dl dl dd a{
				color: #666;
			}
			div.intro-dl dl.one dd img {
				left: 0px;
			}

.subpage-image {
	display: block;
	margin: 0 auto 0 auto;
}

#content {
	width: 494px;
	width: 432px;
	padding: 0 21px 124px 41px;
	float: left;
	background: url(../../_ui/images/bg_dot-v.png) repeat-y 100% 0;
	margin: 40px 0 0 0;
}

	#content h2 {
		font-size: 26px;
		font-weight: bold;
		color: #333;
		padding: 0 0 18px 0;
	}

	#content h3 {
		font-size: 17px;
		font-weight: bold;
		color: #ED9400;
		padding: 22px 0 16px 0;
	}

	.bigorange {
		font-size: 17px;
		font-weight: bold;
		color: #ED9400;
		padding: 22px 0 16px 0;
	}
		
	#content h4 {
		font-size: 18px;
		font-weight: normal;
		line-height: 135%;
		color: #333;
		padding: 0 20px 32px 0;
		text-align: justify;
	}

		#content h4 .color2 {
			color: #666;
		}

	#content p {
		line-height: 130%;
		padding: 0 0 17px 0;
	}

	#content ul {
		line-height: 130%;
		margin: 0 0 17px 0;
	}

	#content ul li {
		list-style: url(../../_ui/images/disc_bullet.gif) disc outside;
		margin: 0 0 7px 17px;
	}
	
	#content ul.errorlist {
		line-height: 100%;
		margin-top: -10px;	
	}
	
	#content ul.errorlist li {
		font-size: 12px;
		list-style: disc outside;
		color: #ff0000;
	}

	#content ol li {
		list-style: decimal outside;
		margin: 0 0 7px 17px;
	}

	#content .emphasize {
		font-size: 14px;
		color: #333;
	}

	#content .highlight {
		color: #ED9400;
	}

	#content .box {
		border-bottom: 1px dotted #ccc;margin-bottom:20px;
	}

	#content .whybox {
		border-top: 1px dotted #ccc;
		padding-top:15px;
		margin-top:10px;
	}

	.solarbullets {
		float: left;
		background: url(../../_ui/images/switch_bullets.gif) no-repeat 0 30%;
	}

	.solarbullet {
		float: left;
		margin-left:40px;
		border-bottom:1px dotted #ccc;
		padding:20px 0 20px 0;
	}

	.solarbullet .info {
		float: left;
		width:435px;
		padding:10px 0 0 10px;
		font-size: 15px;
	}

	.arrow {
		background:url(../../_ui/images/arrow.gif) no-repeat 0 50%;
	}

	#content form.default {
		padding: 5px 0 0 0;
	}

		#content form.default fieldset {
		}

			#content form.default fieldset div.left {
				float: left;
				padding-right: 17px;
				width: 164px;
			}

			#content form.default fieldset div.right {
				float: left;
			}

			#content form.default fieldset span.input-text {
				display: block;
				float: left;
				font-size: 14px;
				padding: 4px 5px 0 0;

			}

			#content form.default fieldset label {
				clear: both;
				display: block;
				color: #ee9400;
				font-size: 14px;
				padding: 0 0 3px 0;
			}

			#content form.default fieldset input[type="text"] {
				display: block;
				width: 238px;
				height: 21px;
				padding: 4px 4px 0 4px;
				background: url(../../_ui/images/bg_form-default_text.png) no-repeat 0 0;
				border: 0 none;
				margin: 0 0 16px 0;
			}

			.opera #content form.default fieldset input[type="text"] {
				height: 25px;
				padding-top: 0;
			}

			#content form.default fieldset input[type="text"].small {
				width: 83px;
				background: url(../../_ui/images/bg_form-default_text2.png) no-repeat 0 0;
				font-size: 12px;
			}

			#content form.default fieldset input[type="text"].medium1 {
				width: 156px;
				background: url(../../_ui/images/bg_form-default_text3.png) no-repeat 0 0;
			}

			#content form.default fieldset input[type="text"].medium2 {
				width: 204px;
				background: url(../../_ui/images/bg_form-default_text4.png) no-repeat 0 0;
			}

			#content form.default fieldset select {
				display: block;
				width: 244px;
				margin: 0 0 16px 0;
			}

			#content form.default fieldset textarea {
				display: block;
				width: 428px;
				height: 67px;
				padding: 4px 0 4px 4px;
				background: url(../../_ui/images/bg_form-default_textarea.png) no-repeat 0 0;
				border: 0 none;
				font-size: 12px;
				overflow: auto;
				margin: 0 0 16px 0;
			}

			#content form.default fieldset input[type="submit"] {
				display: block;
				width: 87px;
				height: 30px;
				background: url(../../_ui/images/button_send.png) no-repeat 0 0;
				border: 0 none;
				text-indent: -8000px;
				overflow: hidden;
				line-height: 30px;
				cursor: pointer;
				margin: 0 0 16px 0;
			}
/* 2.5 Menubar, Sidebar
-----------------------------------------------------------------------------------------------*/

#menubar {
	float: left;
	width: 205px;
	padding: 47px 0 0 10px;
}

	#menubar ul {
		padding-top: 1px;
		background: url(../../_ui/images/bg_menubar_menu.png) no-repeat 11px 0;
	}

		#menubar ul li {
			padding: 0 0 0 11px;
		}

		#menubar ul li.active {
			background: url(../../_ui/images/bullet01.png) no-repeat 0 50%;
		}

			#menubar ul li a {
				display: block;
				padding: 10px 0 10px 1px;
				background: url(../../_ui/images/bg_dot-h.png) repeat-x 0 100%;
			}

			#menubar ul li a:hover,
			#menubar ul li.active a {
				color: #545454;
				text-decoration: none;

			}
			#menubar ul li a:hover{
				text-decoration: underline;
			}
#sidebar {
	float: right;
	width: 194px;
	padding: 43px 21px 0 20px;
}

	#sidebar dl {
		position: relative;
		background: url(../../_ui/images/bg_sidebar_dl.png) repeat-y 0 0;
		margin: 0 0 22px 0;
	}

		#sidebar dl dt {
			font-size: 16px;
			font-weight: bold;
			background: url(../../_ui/images/bg_sidebar_dl_dt.png) no-repeat 0 0;
			padding: 12px 50px 26px 13px;
		}

		#sidebar dl.big dt {
			padding: 90px 13px 22px 13px;
		}

		#sidebar dl dd {
			font-size: 15px;
			background: url(../../_ui/images/bg_sidebar_dl_dd.png) no-repeat 0 100%;
			padding: 0 10px 36px 14px;
			line-height: 120%;
		}

			#sidebar dl dd img {
				display: block;
				width: 37px;
				height: 37px;
				position: absolute;
				right: 2px;
				top: 1px;
			}

			#sidebar dl.big dd img {
				width: 192px;
				height: 78px;
				right: 1px;
			}

			#sidebar dl dd a{
				display: block;
				color: #545454;
			}
/* 2.6 Footer
-----------------------------------------------------------------------------------------------*/

#footer {
	background: url(../../_ui/images/bg_footer.png) repeat-x 0 0;
}

#footer .wrap-inner {
	width: 902px;
	height: 25px;
	padding: 13px 0 0 0;
}

	#footer .wrap-inner p.copy {
		font-size: 10px;
		color: #959595;
		float: right;
	}

	#footer .wrap-inner ul {
		padding: 1px 2px 0;
		float: left;
	}

		#footer .wrap-inner ul li {
			display: inline;
			font-size: 10px;
			color: #eaeaea;
			white-space: pre;
		}

			#footer .wrap-inner ul li a {
				color: #959595;
				font-size: 11px;
			}