/* @override 
	http://epicenterone.com/~rain/css/brochure.css
	http://rainbarrelprogram.org/css/brochure.css
*/

/*
 *  RainWater Solutions homepage styles
 *  Site by New Media Campaigns
 */

/* Eric Meyer's Reset styles */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin: 0;padding: 0;border: 0;outline: 0;font-size: 100%;vertical-align: baseline;background: transparent;}body{line-height:1;}ol,ul{list-style:none;}blockquote,q{quotes:none;}:active{outline:0;}ins{text-decoration:none;}del{text-decoration:line-through;}table{border-collapse:collapse;border-spacing:0;}


/* Begin text */

html {
	background: #e0eefa;
	}

body {
	font-size: 81.25%;   /* Reset base size to 13px */
	line-height: 1.53em;  /* Reset line height to 20px */
	color: #404040;
	}

body, h1, h4, h5 {
	font-family: 'Helvetica Neue', Helvetica, Arial, Geneva, sans-serif;
	}

h2, h3 {
	font-family: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, Geneva, sans-serif;
	font-weight: normal;
	}

p {
    padding-bottom: 1.53em;
	}
	
a:link, a:visited {
	padding: 1px 3px;
	margin: -1px -3px;
	color: #60a84d;
	background-color: #e0eefa;
	text-decoration: none;
	-webkit-transition: background-color 0.5s;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	}	
a:focus, a:hover, a:active {
	color: #ebf3fb;
  	background: #acd79b;
  	text-shadow: -1px -1px 0 rgba(0,0,0,0.05);
	}

h1 {
    font-size: 1.6em;
    font-weight: bold;
    text-shadow: 0 0 2px #89a9c2;
	}
	
h2 {
    font-size: 1.6em;
    line-height: 2em;
    color: #60a84d;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.1);
	}
	
h3 {
    font-size: 1.38em;
    color: #60a84d;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.1);
	}
	
h4 {
    font-size: 1em;
    font-weight: bold;
	}

img {
	-ms-interpolation-mode: bicubic;  /* Fixes IE6 scaling ugliness */
	}

/* End text */ 


/* Begin page styles */
	
#brochure {
	position: relative;
	width: 800px;
	margin: 0 auto;
	}
/* Clearfix */
#brochure:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
/* IE6 */
* html #brochure {height: 1%;}
/* IE7 */
*:first-child+html #brochure {min-height: 1px;}

/* End page */


/* Begin Slide styles */

.slide {
	position: relative;
	width: 800px;
	height: 580px;
	}

.replaced {
	text-indent: -9999px;
	}

.nav {
	float: right;
	margin: 25px 30px 0 0;
	font-size: 0.93em;
	}
.nav li {
	float: left;
	}
.nav li a {
	margin: 0 5px;
	color: #4c4e4c;
	}
.nav li.active a {
  font-weight: bold;
  }

.navLinks a:link, .navLinks a:visited {
	position: absolute;
	padding: 0;
	margin: 0;
	color: #a8d595;
	background: transparent;
	font-size: 16px;
	font-weight: bold;
	text-transform: uppercase;
    -webkit-transition: all 0.3s;
	}
.navLinks a:focus, .navLinks a:hover, .navLinks a:active {
	color: #507e3e;
	background: none;
    text-shadow: 0 0 6px #fffefa;
	}

.bottomLeft {
	position: absolute;
	}
.bottomLeft a {
	padding: 0;
	margin: 0;
	}
	
/* Welcome slide */

#welcome {
	background: url(../images/home/slide1.jpg) no-repeat 0 0;
	}

#welcome .navLinks a:link, #welcome .navLinks a:visited {
	font-size: 15px;
	color: #3e3e3f;
    text-shadow: 0 0 2px #89a9c2;
	}
#welcome .navLinks a:focus, #welcome .navLinks a:hover, #welcome .navLinks a:active {
	color: #507e3e;
    text-shadow: 0 0 6px #fffefa;
	}
	
#welcome .navLinks .specs {
	top: 252px;
	left: 663px;
	width: 95px;
	text-align: center;
	}
#welcome .navLinks .starting {
	top: 322px;
	left: 642px;
	width: 95px;
	text-align: center;
	}

#welcome .bottomLeft {
	left: 30px;
	top: 525px;
	}
#welcome .bottomLeft p {
	font-size: 0.93em;
	}

/* Specs slide */

#specs {
	background: url(../images/home/slide2.jpg) no-repeat 0 0;
	}

#specs .navLinks .starting {
	top: 185px;
	left: 575px;
	width: 120px;
	padding: 10px 40px 10px 20px;
	}

#specs .bottomLeft {
	left: 54px;
	top: 483px;
	width: 60px;
	text-align: center;
	}
#specs .bottomLeft a {
	font-size: 0.93em;
	font-weight: bold;
	color: #4c4e4c;
	background: none;
	-webkit-transition: color 0.5s;
	}
#specs .bottomLeft a:focus, #specs .bottomLeft a:hover, #specs .bottomLeft a:active {
	color: #5381a5;
	}

/* Starting slide */

#starting {
	background: url(../images/home/slide3.jpg) no-repeat 0 0;
	}

#starting .navLinks .help {
	top: 111px;
	left: 575px;
	width: 120px;
	padding: 10px 40px 10px 20px;
	text-transform: none;
	}

#starting .navLinks .specs {
	top: 184px;
	left: 575px;
	width: 120px;
	padding: 10px 10px 10px 50px;
	text-transform: none;
	}

#starting .intro {
	position: absolute;
	left: 40px;
	top: 270px;
	width: 700px;
	font-size: 1.07em;
	color: #507e3e;
	}

#starting .top-five {
	position: absolute;
	top: 320px;
	left: 240px;
	width: 540px;
	}
#starting .top-five ol {
	float: left;
	width: 270px;
	font-size: 0.9em;
	line-height: 1.5em;
	}
#starting .top-five ol li {
	padding: 7px 15px 0 30px;
	background-position: 0 0;
	background-repeat: no-repeat;
	}
#starting .top-five ol li.one { background-image: url(../images/home/num1.png); }
#starting .top-five ol li.two { background-image: url(../images/home/num2.png); }
#starting .top-five ol li.three { background-image: url(../images/home/num3.png); }
#starting .top-five ol li.four { background-image: url(../images/home/num4.png); }
#starting .top-five ol li.five { background-image: url(../images/home/num5.png); }

#starting .bottomLeft {
	left: 60px;
	top: 478px;
	text-align: center;
	}
#starting .bottomLeft a {
	display: block;
	width: 40px;
	padding: 5px;
	font-weight: bold;
	color: #4c4e4c;
	background: none;
	-webkit-transition: color 0.5s;
	}
#starting .bottomLeft a:focus, #starting .bottomLeft a:hover, #starting .bottomLeft a:active {
	color: #5381a5;
	}

/* Help slide */

#help {
	position: relative;
	background: url(../images/home/slide4.jpg) no-repeat 0 0;
	}

#help .navLinks .begin {
	top: 121px;
	left: 575px;
	width: 120px;
	padding: 10px 30px 10px 30px;
	text-transform: none;
	}

#help .navLinks .starting {
	top: 186px;
	left: 575px;
	width: 120px;
	padding: 10px 10px 10px 50px;
	}

#help .intro {
	position: absolute;
	left: 40px;
	top: 270px;
	width: 500px;
	font-size: 1.07em;
	color: #507e3e;
	}

#help .top-five {
	top: 349px;
	left: 240px;
	width: 530px;
	}
#help ul.tools, #help ul.support {
	position: absolute;
	float: left;
	width: 200px;
	list-style-type: disc;
	font-size: 0.9em;
	line-height: 1.5em;
	}
#help ul.tools {
	left: 52px;
	top: 400px;
	}
#help ul.support {
	left: 288px;
	top: 400px;
	width: 260px;
	}

#help .thumbs {
	position: absolute;
	left: 570px;
	top: 276px;
	width: 210px;
	height: 210px;
	}
#help .thumbs li {
  float: left;
  margin: 0 12px 10px 0;
  }
#help .thumbs li a {
	display: block;
	width: 91px;
	height: 91px;
	padding: 0;
	margin: 0;
	background: none;
	}

/* End Slide */




/*
    ColorBox Core Style
    The following rules are the styles that are consistant between themes.
    Avoid changing this area to maintain compatability with future versions of ColorBox.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative; overflow:visible;}
#cboxLoadedContent{overflow:auto;}
#cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}

/* 
    ColorBox example user style
    The following rules are ordered and tabbed in a way that represents the
    order/nesting of the generated HTML, so that the structure easier to understand.
*/
#cboxOverlay{background:#bbb;}

#colorbox{}
    #cboxTopLeft{width:14px; height:14px; background:url(../images/colorbox/controls.png) 0 0 no-repeat;}
    #cboxTopCenter{height:14px; background:url(../images/colorbox/border.png) top left repeat-x;}
    #cboxTopRight{width:14px; height:14px; background:url(../images/colorbox/controls.png) -36px 0 no-repeat;}
    #cboxBottomLeft{width:14px; height:43px; background:url(../images/colorbox/controls.png) 0 -32px no-repeat;}
    #cboxBottomCenter{height:43px; background:url(../images/colorbox/border.png) bottom left repeat-x;}
    #cboxBottomRight{width:14px; height:43px; background:url(../images/colorbox/controls.png) -36px -32px no-repeat;}
    #cboxMiddleLeft{width:14px; background:url(../images/colorbox/controls.png) -175px 0 repeat-y;}
    #cboxMiddleRight{width:14px; background:url(../images/colorbox/controls.png) -211px 0 repeat-y;}
    #cboxContent{background:#fff;}
        #cboxLoadedContent{margin-bottom:5px;}
        #cboxLoadingOverlay{background:url(../images/colorbox/loading_background.png) center center no-repeat;}
        #cboxLoadingGraphic{background:url(../images/colorbox/loading.gif) center center no-repeat;}
        #cboxTitle{position:absolute; bottom:-25px; left:0; text-align:center; width:100%; font-weight:bold; color:#7C7C7C;}
        #cboxCurrent{position:absolute; bottom:-25px; left:58px; font-weight:bold; color:#7C7C7C;}
        
        #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{position:absolute; bottom:-29px; background:url(../images/colorbox/controls.png) 0px 0px no-repeat; width:23px; height:23px; text-indent:-9999px;}
        #cboxPrevious{left:0px; background-position: -51px -25px;}
        #cboxPrevious.hover{background-position:-51px 0px;}
        #cboxNext{left:27px; background-position:-75px -25px;}
        #cboxNext.hover{background-position:-75px 0px;}
        #cboxClose{right:0; background-position:-100px -25px;}
        #cboxClose.hover{background-position:-100px 0px;}
        
        .cboxSlideshow_on #cboxSlideshow{background-position:-125px 0px; right:27px;}
        .cboxSlideshow_on #cboxSlideshow.hover{background-position:-150px 0px;}
        .cboxSlideshow_off #cboxSlideshow{background-position:-150px -25px; right:27px;}
        .cboxSlideshow_off #cboxSlideshow.hover{background-position:-125px 0px;}