/* fonts */
@font-face{font-family: 'z'; src: url('../fonts/z.eot'); src: url('../fonts/z.eot?#iefix') format('embedded-opentype'), url('../fonts/z.woff') format('woff'), url('../fonts/z.ttf') format('truetype'), url('../fonts/z.svg#candara') format('svg'); font-weight: normal; font-style: normal;}
@font-face{font-family: 'DroidSerif'; src: url('../fonts/droidserif-regular.eot'); src: url('../fonts/droidserif-regular.eot?#iefix') format('embedded-opentype'),	url('../fonts/droidserif-regular.woff') format('woff'),	url('../fonts/droidserif-regular.ttf') format('truetype'), url('../fonts/droidserif-regular.svg#droidserif-regular') format('svg'); font-weight: normal; font-style: normal;}
@font-face{font-family: 'DroidSerif'; src: url('../fonts/droidserif-italic.eot'); src: url('../fonts/droidserif-italic.eot?#iefix') format('embedded-opentype'), url('../fonts/droidserif-italic.woff') format('woff'), url('../fonts/droidserif-italic.ttf') format('truetype'), url('../fonts/droidserif-italic.svg#droidserif-italic') format('svg'); font-weight: normal; font-style: italic;}

/* hide text and toggle block: */
#Panels .current span, #Footer .current span, .signature, .Illustration{display: block; font-size: 0px; text-indent: -9999px;}

/* font-size reset */
html{font-size: 100%; height: 100%;}
body{background: #edeef5; color: #555; font-size: 62.5%; line-height: 1.4; height: 100%; overflow-y: scroll;}

/* containers */
.holder{overflow: hidden;}
	.wrap{width: 900px; margin: 0 auto;}
	.clear{clear: both;}
	
/* typography */
#Content a{color: #2887DE;}
	#Content a:hover, #Content a.current{color: #82B525;}
#Content p{margin-bottom: 1.5em;}
#Content ul{list-style: disc inside; margin: 0 0 1.5em 1.5em}
	#Content li{}
#Content strong, #Content b{font-weight: bold;}
#Content i{font-style: italic;}
#Content u{text-decoration: underline;}
#Content h3{font-size: 1.2em; border-left: 5px solid #8CC819; padding-left: 1em; margin-bottom: 1em;}
#Content h4{border-bottom: 1px solid #E0E0E0; font-size: 1.4em; font-family: 'z', Arial, sans-serif;}

/* form */
form{margin-bottom: 2em;}
	.field{margin-bottom: 1em;}
		label.left{color: #7682a0;}
		.middleColumn{}
			.middleColumn input, .middleColumn textarea{background: #fff; border: none; width: 100%; padding: 9px; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; -o-border-radius: 3px; -ms-border-radius: 3px; box-shadow: 0 0 8px #DDDDDD; -moz-box-shadow: 0 0 8px #DDDDDD; -webkit-box-shadow: 0 0 8px #DDDDDD; -o-box-shadow: 0 0 8px #DDDDDD; -ms-box-shadow: 0 0 8px #DDDDDD; -khtml-box-shadow: 0 0 8px #DDDDDD;}
			.middleColumn input{font-family: 'z', Arial, sans-serif; font-size: 1.15em; width: 200px;}
			.middleColumn textarea{display: block; font-family: 'z', Arial, sans-serif; font-size: 1.15em; width: 95%;}
			.middleColumn input:hover, .middleColumn textarea:hover{box-shadow: 0 0 8px #CBCBCB; -moz-box-shadow: 0 0 8px #CBCBCB; -webkit-box-shadow: 0 0 8px #CBCBCB; -o-box-shadow: 0 0 8px #CBCBCB; -ms-box-shadow: 0 0 8px #CBCBCB; -khtml-box-shadow: 0 0 8px #CBCBCB;}
			.middleColumn input:focus, .middleColumn textarea:focus{box-shadow: 0 0 8px #B5B5B5; -moz-box-shadow: 0 0 8px #B5B5B5; -webkit-box-shadow: 0 0 8px #B5B5B5; -o-box-shadow: 0 0 8px #B5B5B5; -ms-box-shadow: 0 0 8px #B5B5B5; -khtml-box-shadow: 0 0 8px #B5B5B5;}
		.Actions{}
			.Actions .action{background-color: #81BF11; border: none; color: #fff; font-size: 1.1em; text-shadow: 1px 1px 0px #707070; -moz-text-shadow: 1px 1px 0px #7A7A7A; -webkit-text-shadow: 1px 1px 0px #7A7A7A; -o-text-shadow: 1px 1px 0px #7A7A7A; -ms-text-shadow: 1px 1px 0px #7A7A7A; -khtml-text-shadow: 1px 1px 0px #7A7A7A; padding: 8px 10px;}
				.Actions .action:hover{background-color: #87C41A;}
		label.error{display: block; background: #ae3882; color: #fff; text-indent: 0.5em;}
		.text label.error, .email label.error{width: 218px;}
		.textarea label.error{width: 99.5%;}
			
/* buttons */
.action{display: block; background: #adadad url(../images/action.png) repeat-x; width: 94px; line-height: 39px; text-align: center; text-decoration: none; cursor: pointer; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; -o-border-radius: 2px; -ms-border-radius: 2px; -khtml-border-radius: 2px;}
	.action span{font-size: 1.1em; font-family: Arial, sans-serif; color: #fff; font-weight: bold;}
.action:hover{background-color: #b8b8b8}
.action.current, .action.current:hover{background-color: #8cc819; cursor: default;}
	.action.current span{background: url(../images/action_down.png) 50% 52% no-repeat;}
#Footer .action{background-color: #81BF11;}
	#Footer .action span{font-size: 1.2em; text-shadow: 1px 1px 0px #707070; -moz-text-shadow: 1px 1px 0px #7A7A7A; -webkit-text-shadow: 1px 1px 0px #7A7A7A; -o-text-shadow: 1px 1px 0px #7A7A7A; -ms-text-shadow: 1px 1px 0px #7A7A7A; -khtml-text-shadow: 1px 1px 0px #7A7A7A;}
#Footer .action:hover{background-color: #87C41A;}
	#Footer .action.current:hover{background-color: #81BF11;}
		#Footer .action.current span{background-image: url(../images/action_up.png); background-position: 50% 48%;}

/* docked */
.DockedLogo, .DockedItem{filter: alpha(opacity=0); -khtml-opacity: 0; -moz-opacity: 0; opacity: 0;}
#Docked{position: fixed; top: 0; width: 100%; height: 0; z-index: 3; overflow: visible;}
	#Docked .top{visibility: hidden; background-position: 50% 100%; height: auto; padding: 18px 0;}
		#Docked .Nav .DockedLogo{position: absolute; top: -8px; left: 0; margin: 0;}
	#Docked .panels{visibility: hidden; padding: 15px 0;}
		#Docked .panel{padding: 0; width: 300px;}
		#Docked .even{border-width: 0 1px; border-color: #eee; border-style: solid; width: 298px;}
			#Docked .panels a{color: #444; text-decoration: none; text-align: center;}
			#Docked .panels a.current{color: #8cc819;}
				#Docked .panels a h3{margin-bottom: 0; padding: 0.3em 0;}

/* LAYOUT */
#Loading{display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: #fff url(../images/loading.gif) 50% 50% no-repeat; width: 100%; height: 100%; z-index: 10; opacity: 0; -moz-opacity: 0; -webkit-opacity: 0; -o-opacity: 0; -ms-opacity: 0; -khtml-opacity: 0;}
#Wrapper{position: relative; text-align: left; min-width: 1000px; min-height: 100%;}

	.top{position: relative; background: #7373a9 url(../images/Top.jpg) 50% 0 no-repeat; text-align: center; height: 325px; z-index: 2;}
		#Logo{}
			#Logo img{display: block; margin: 60px auto 40px;}
		.Nav{position: relative;}
			.Nav li{display: inline; margin: 0 9px;}
				.Nav li a{font-family: 'z', Arial, sans-serif; font-size: 1.4em; color: #fff; text-decoration: none; text-transform: lowercase;}
					.Nav li a.current, .Nav li a:hover{text-decoration: underline;}

	.panels{background: #f9f9f9; border-top: 1px solid #fff; border-bottom: 1px solid #E1E1E1; padding: 50px 0 40px;}
		#Panels{color: #444;}
			.panel{float: left; width: 255px; padding-right: 45px;}
				.panel h3{font-size: 1.75em; line-height: 1.2; font-family: 'z', Arial, sans-serif; margin-bottom: 0.7em;}
					.panel h3 span{display: block; font-size: 1.3em; font-family: 'DroidSerif', Georgia, serif; font-weight: bold; font-style: italic;}
				.panel p{font-size: 1.2em; line-height: 1.7; font-family: 'DroidSerif', Georgia, serif; margin-bottom: 1.5em;}


	.content{padding: 25px 0 197px;}
		#Content{font-family: 'DroidSerif', Georgia, serif; font-size: 1.32em; line-height: 1.8; color: #555;}
			#Heading{position: relative; margin-bottom: 30px;}
				#Heading h2{position: absolute; bottom: -0.2em; left: 0; font-size: 2.05em; font-family: 'z', Arial, sans-serif; color: #8cc819; line-height: 1.05; width: 410px;}
					#Heading h2 .Illustration{position: relative; left: -118px; border-bottom: 1px solid #d3d4da; width: 250px; margin-bottom: 32px;}
						#Heading h2 .Illustration img{display: block; margin: 0 auto -1px;}
					#Heading h2 span{display: block; font-size: 1.3em; font-family: 'DroidSerif', Georgia, serif; font-weight: bold; font-style: italic;}
				#Image{float: right; background: #fff; padding: 11px; box-shadow: 0px 0px 18px #CFCFCF; -webkit-box-shadow: 0px 0px 18px #CFCFCF; -moz-box-shadow: 0px 0px 18px #CFCFCF; -o-box-shadow: 0px 0px 18px #CFCFCF; -ms-box-shadow: 0px 0px 18px #CFCFCF; -khtml-box-shadow: 0px 0px 18px #CFCFCF; }
					#Image img{display: block;}
			#Column1{float: left; width: 410px;}
			#Column2{margin-left: 488px;}
				.marker{display: inline-block; position: relative; top: 1px; left: 0; background: #8cc819; width: 0.7em; height: 0.75em; margin-left: 0.3em;}
			#Testimonial{clear: both; background: url(../images/Testimonial.png) 50% 0 no-repeat; color: #6e6e6e; text-align: center; margin-top: 6em; padding: 23px 0 17px;}
				#Testimonial blockquote{font-size: 1.03em; color: #898989; font-style: italic; padding-bottom: 0.9em;}
				#Testimonial span{font-family: 'z', Arial, sans-serif; line-height: 0.6;}
					#Testimonial span strong{display: block; font-size: 1.1em; font-weight: normal; color: #0c0c0c;}
					#Testimonial span a{display: block;}

	.footer{position: absolute; bottom: 0; left: 0; right: 0; background: #3e4a68 url(../images/Footer.jpg) 50% 0 no-repeat; width: 100%; min-width: 1000px; height: 197px;}
		#Footer{color: #fff; padding-top: 35px;}
			#Footer.wrap{position: relative; overflow: hidden;}
			#FooterNav{float: left; width: 215px; padding-right: 0px;}
				#FooterNav li{}
					#FooterNav li a{background: url(../images/icon.png) 2px 0.4em no-repeat; font-size: 1.2em; font-family: 'z', Arial, sans-serif; color: #edeef5; text-decoration: none; padding-left: 13px;}
						#FooterNav li a.current, #FooterNav li a:hover{color: #8cc819; text-shadow: 1px 1px 0px #393939; -moz-text-shadow: 1px 1px 0px #393939; -webkit-text-shadow: 1px 1px 0px #393939; -o-text-shadow: 1px 1px 0px #393939; -ms-text-shadow: 1px 1px 0px #393939; -khtml-text-shadow: 1px 1px 0px #393939;}
				#FooterNav li.hidden{display: none;}
			#About{position: relative; float: left; width: 225px; padding-right: 50px;}
				#About .placeholder{display: none; position: absolute; top: 0; left: 0; background: #fff; width: 80px; height: 100%; opacity: 0.2;}
				#About p{font-size: 1.2em; font-family: 'DroidSerif', Georgia, serif; line-height: 1.65; margin-bottom: 1em;}
			#Contact{position: relative; float: left; width: 243px;}
				#Contact blockquote{font-size: 1.15em; font-family: 'DroidSerif', Georgia, serif; line-height: 1.7; font-style: italic; margin-bottom: 1em;}
				#Contact .signature{position: absolute; bottom: 2px; right: 24px; background: url(../images/signature.png) no-repeat; width: 95px; height: 36px;}

	#bluetwist {position: absolute; bottom:0; right:0; padding-left:40px;}
			#bluetwist a{background: url(../images/icon.png) 2px 0.4em no-repeat; font-size: 1.2em; font-family: 'z', Arial, sans-serif; color: #edeef5; text-decoration: none; padding-left: 13px;}
				#bluetwist a.bluetwist{background-image: url(../images/bluetwist.png); background-position: 0 0.28em;}
					#bluetwist a.current, #bluetwist a:hover{color: #8cc819; text-shadow: 1px 1px 0px #393939; -moz-text-shadow: 1px 1px 0px #393939; -webkit-text-shadow: 1px 1px 0px #393939; -o-text-shadow: 1px 1px 0px #393939; -ms-text-shadow: 1px 1px 0px #393939; -khtml-text-shadow: 1px 1px 0px #393939;}
				
#Buffer{position: absolute; top: 0; left: -9999px;} /* hidden place to append elements to measure dimensions */
				
/* Blog */
.BlogHolder{}
	.BlogHolderPost{margin-bottom: 2em;}
		.BlogHolderPost h3{color: #ccc; font-family: 'z', Arial, sans-serif; font-weight: bold; margin-bottom: 0.3em;}
			.BlogHolderPost h3 a{margin-left: 0.5em;}
.BlogPost .action{background-color: #81BF11; border: none; color: #fff!important; font-size: 1.05em; width: 100%; text-shadow: 1px 1px 0px #707070; -moz-text-shadow: 1px 1px 0px #7A7A7A; -webkit-text-shadow: 1px 1px 0px #7A7A7A; -o-text-shadow: 1px 1px 0px #7A7A7A; -ms-text-shadow: 1px 1px 0px #7A7A7A; -khtml-text-shadow: 1px 1px 0px #7A7A7A; padding: 6px 0; margin-bottom: 1em;}
	.BlogPost .action:hover{background-color: #87C41A;}
.BlogPosts{list-style: none!important; margin: 0.5em 0 0!important;}
	.BlogPosts span{color: #ccc; font-weight: bold;}
	.BlogPosts a{margin-left: 0.5em;}
	
/* Testimonials */
#Testimonials{}
	.Testimonial{position: relative; margin-bottom: 5em; width: 100%; overflow: hidden;}
		.Testimonial blockquote{width: 410px;}
			.Testimonial.odd blockquote{}
			.Testimonial.even blockquote{float: right;}
		.Testimonial .Author{position: absolute; top: 2em; width: 392px;}
			.odd .Author{right: 0;}
			.even .Author{left: 0;}
				.Author strong{display: block;}