/* --- CSS Reset --- */

html * {
	margin: 0px;
	padding: 0;
	border: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}

html {
	height: 100%;
}

body {
	height: 100%;
}

/* --- Typography --- */
html * {
	font-family: Arial, Helvetica, Sans-Serif;
	font-size: 1em;
}
h1 {
	font-size: 1.5em;
	font-weight: bold;
}
h2 {
	font-size: 1em;
	font-weight: bold;
}
h3 {
	font-size: 1em;
	font-weight: bold;
	color: #7A869E;
}

/* --- Grid --- */

#CompleteCampaigns {
	position: absolute;
	background: url(../images/complete_campaigns_logo.png) no-repeat top left;
	top: 40px;
	left: 40px;
	width: 145px;
	height: 58px;
	text-indent: -10000px;
}

.menunumbers {
	position: absolute;
	top: 120px;
	left: 40px;
}

/* --- page --- */
body#page {
	height: 100%;
}
p {
	padding-bottom: 1em;
}

/* --- menu --- */

#header {
	z-index: 100;
}

#navigation {
	position: absolute;
	width: 153px;
	height: 95px;
	top: 120px;
	left: 40px;
	z-index: 110;
	background: transparent url(../images/allnumbers.png) no-repeat 0px 10px; 	
}

#navigation ul li {
	height: 20px;
	list-style: none;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 12px;
	font-weight: bold;
	padding-bottom: 4px;
}

#navigation #journey{
	padding-left: 75px;
}
#navigation #who{
	padding-left: 85px;
}
#navigation #contact{	
	padding-left: 85px;
}
#navigation #resources{
	padding-left: 75px;
}


#navigation.ui-state-default {
    background-position: 0px 10px;
}
#page #navigation.ui-state-journey {
    background-position: -200px 10px;
}
#page #navigation.ui-state-who {
    background-position: -400px 10px;
}
#page #navigation.ui-state-contact {
    background-position: -600px 10px;
}
#page #navigation.ui-state-resources {
    background-position: -800px 10px;
}

.ui-state-journey #navigation {
    background-position: -200px 10px;
}
#navigation.ui-state-journey a#journey,
#page.ui-state-journey #navigation a#journey {
    color: #273C64;
}
.ui-state-who #navigation {
    background-position: -400px 10px;
}
#navigation.ui-state-who a#who,
#page.ui-state-who #navigation a#who {
    color: #88BB40;
}
.ui-state-contact #navigation {
    background-position: -600px 10px;
}
#navigation.ui-state-contact a#contact,
#page.ui-state-contact #navigation a#contact {
	color: #D69D32;
}
.ui-state-resources #navigation {
    background-position: -800px 10px;
}
#navigation.ui-state-resources a#resources,
#page.ui-state-resources #navigation a#resources {
	color: #97559F;
}


/* --- links --- */

a, a:link {
	color: #999;
	text-decoration: none;
	outline: 0;
}

/* --- content --- */
#container {
	position: relative;
	min-height: 100%
}

* html #nonFooter
	{
		height: 100%;
	}

#page.ui-state-journey #container {
	/*height: 500px;*/
}
#page.ui-state-who #container {
	/*height: 650px;*/
}
#page.ui-state-contact #container {
	/*height: 650px;*/
}
#page.ui-state-resources #container {
	/*height: 650px;*/
}
.content {
	position: absolute;
}
/* --- home content --- */
	#homeContent {
		position: absolute;
		top: 10px;
		left: 480px;
		width: 374px; 
		height: 339px;
		background: transparent url(../images/bubble_home.png) no-repeat;
	}
		#homeText {
			position: absolute;
			top: 75px;
			left: 50px;
			width: 250px; 
			height: 200px;
			color: #FA5A04;
			font-size: 1em;
			font-weight: bold;
			text-align: center;
		}
/* --- end home content --- */

/* --- journey content --- */
	#journeyContent {
		position: absolute;
		top: 20px;
		left: 550px;
		width: 452px;
		height: 420px;
		color: #273C64;
		text-align: center;
		background: transparent url(../images/bubbles_journey.png) no-repeat;
	}
		#journeyContent ul {
			list-style-type: none;
		}
			#journeyContent ul li.journey {
				position: absolute;
				font-size: 30px;
				width: 35px;
				height: 35px;
				float: left;
				/*background: transparent url(../images/journey_numbers.png) no-repeat;*/
				background-position: 0px 0px;
				text-indent: -10000px;
				overflow: hidden;
			}
			#journeyContent ul li#j1 {
				top: 59px;
				left: 16px;
				background-position: 0px 0px;
				/* 470 */
			}
			#journeyContent ul li#j2 {
				top: 104px;
				left: 4px;
				background-position: -150px 0px;
			}
			#journeyContent ul li#j3 {
				top: 151px;
				left: 0;
				background-position: -300px 0px;
			}
			#journeyContent ul li#j4 {
				top: 199px;
				left: 4px;
				background-position: -450px 0px;
			}
			#journeyContent ul li#j5 {
				top: 244px;
				left: 16px;
				background-position: -600px 0px;
			}
			#journeyContent ul li#j6 {
				top: 286px;
				left: 36px;
				background-position: -750px 0px;
			}
			#journeyContent ul li#j7 {
				top: 325px;
				left: 62px;
				background-position: -900px 0px;
			}
			#journeyContent ul li#j8 {
				top: 359px;
				left: 97px;
				background-position: -1050px 0px;
			}
			#journeyContent ul li#j9 {
				top: 384px;
				left: 132px;
				background-position: -1200px 0px;
			}

	#journeyContent .journey {
		position: absolute;
		top: 20px;
		left: 80px;
		float: left;
		width: 450px;
	/*	text-indent: -10000px;*/
	}
	#journeyText .journey {
		position: absolute;
		top: 50px;
		left: 170px;
		width: 220px;
		height: 260px;
	}
	#journeyContent.ui-state-j1 {
		background-position: 0px 0px;
	}
	#journeyContent.ui-state-j2 {
		background-position: -502px 0px;
	}
	#journeyContent.ui-state-j3 {
		background-position: -1004px 0px;
	}
	#journeyContent.ui-state-j4 {
		background-position: 0px -470px;
	}
	#journeyContent.ui-state-j5 {
		background-position: -502px -470px;
	}
	#journeyContent.ui-state-j6 {
		background-position: -1004px -470px;
	}
	#journeyContent.ui-state-j7 {
		background-position: 0px -940px;
	}
	#journeyContent.ui-state-j8 {
		background-position: -502px -940px;
	}
	#journeyContent.ui-state-j9 {
		background-position: -1004px -940px;
	}
/* --- end journey content --- */

/* --- who content --- */
	#whoContent {
		position: absolute;
		top: 20px;
		left: 160px;
		width: 750px;
		height: 466px;
		background: transparent url(../images/bubble_who_big.png) no-repeat -2000px 0px;
	}
	#whoContent.ui-state-geffri {
		background-position: 250px 0px;
	}
	#whoContent.ui-state-shane {
		background-position: 250px 0px;
	}
		#whoNavigation {
			position: absolute;
			top: 360px;
			left: 0px;
			width: 94px;
			height: 96px;
			color: #88BB40;
			text-align: center;
			z-index: 10100;
		}
			#whoNavigation #geffri {
				position: absolute;
				display: inline-block;
				padding: 25px 10px 0 10px;
				text-indent: -10000px;
				left: 0px;
				width: 74px;
				height: 96px;
				text-align: center;
				background: transparent url(../images/bubble_geffri.png) no-repeat;
			}
			#whoNavigation #shane {
				position: absolute;
				display: inline-block;
				padding: 25px 10px 0 10px;
				text-indent: -10000px;
				left: 250px;
				width: 74px;
				height: 96px;
				text-align: center;
				background: transparent url(../images/bubble_shane.png) no-repeat;
			}
			.ui-state-geffri #whoNavigation #shane {
				left: 0px;
			}
		#whoText {
			position: absolute;
			top: 50px;
			left: 160px;
			width: 290px;
			text-align: center;
		}
		#whoText p {
			font-size: 0.9em;
			color: #88BB40;
		}
			#whoText #scanlan {
				position: absolute;
				left: 175px;
				width: 290px;
				text-align: center;
			}
			#whoText #rasip {
				position: absolute;
				left: 175px;
				width: 290px;
				text-align: center;
			}
/* --- end who content --- */

/* --- contact content --- */
	#contactContent {
		position: absolute;
		top: 20px;
		left: 350px;
		width: 441px;
		height: 400px;
		background: transparent url(../images/bubble_contact.png) no-repeat;
	}
		#contactText {
			position: absolute;
			top: 70px;
			left: 120px;
			width: 250px;
			text-align: center;
		}
		#contactText div {
		}
		#contactText .address {
			color: #D69D32;
			font-size: 1.2em;
			font-weight: bold;
		}
			#contactText input,
			#contactText textarea {
				color: #D69D32;
				width: 250px;
				border: 1px solid #D69D32;
			}
			#contactText .field {
				padding-bottom: 3px;
			}
			#contactText #submit {
				position: absolute;
				left: 0px;
				padding: 0.2em 0.5em;
				border: 1px solid #D69D32;
				-moz-border-radius: 1em;
				-webkit-border-radius: 1em;
				color: #D69D32;
			}
			#contactText #response {
				padding: 1.7em 0 0 0;
				left: 0px;
				color: #D69D32;
				text-align: left;
			}
/* --- end contact content --- */

/* --- resources content --- */
	#resourcesContent {
		position: absolute;
		top: 20px;
		left: 350px;
		width: 441px;
		height: 400px;
		background: url(../images/bubble_resources.png) no-repeat;
	}
		#resourcesContent #resourcesText {
			position: absolute;
			top: 70px;
			left: 100px;
			width: 280px;
			height: 150px;
			text-align: center;
		}
		#resourcesContent #resourcesText h1 {
			color: #97559F;
			font-weight: bold;
		}
/* --- end resources content --- */


/* --- footer --- */

#page #footer{
	position: absolute;
	display: block;
	width: 100%;
	z-index: 10;
	bottom: 0px;
}
#page #footer-image {
	position: absolute;
	float: left;
	width: 1024px;
	height: 447px;
	bottom: 30px;
	left: 0px;
	background: transparent url(../images/construction.png) no-repeat left bottom;
	clear: both;
	z-index: 10000;
}
#page.ui-state-journey #footer-image {
	position: absolute;
	float: left;
	width: 342px;
	height: 220px;
	bottom: 150px;
	left: 80px;
	background: transparent url(../images/plane.png) no-repeat left bottom; 
}
#page.ui-state-who #footer-image {
	position: absolute;
	width: 419px;
	height: 255px;
	bottom: 35px;
	left: 50px;
	background: transparent url(../images/chairs.png) no-repeat -500px bottom; 
}
#page.ui-state-who #footer-image.ui-state-geffri {
	position: absolute;
	width: 419px;
	height: 255px;
	bottom: 35px;
	left: 50px;
	background: transparent url(../images/chairs.png) no-repeat left bottom; 
}
#page.ui-state-contact #footer-image {
	position: absolute;
	width: 192px;
	height: 350px;
	bottom: 30px;
	left: 120px;
	background: transparent url(../images/mail.png) no-repeat left bottom; 
}

#page.ui-state-resources #footer-image {
	position: absolute;
	width: 333px;
	height: 521px;
	bottom: 20px;
	left: 50px;
	background: transparent url(../images/wind_mill.png) no-repeat left bottom; 
}


.footertext {
	position: relative;
	clear: both;
	height: 20px;
	bottom: 0px;
	padding: 67px 0px 10px 40px;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 11px;
	background: transparent url(../images/construction_floor.png) repeat-x left top;
}
#page.ui-state-journey .footertext {
	padding: 120px 0px 10px 40px;
	background: transparent url(../images/clouds.png) repeat-x left top;
}
#page.ui-state-who .footertext {
	padding: 105px 0px 10px 40px;
	background: transparent url(../images/floor.png) repeat-x left top;
}
#page.ui-state-contact .footertext {
	padding: 105px 0px 10px 40px;
	background: transparent url(../images/grass.png) repeat-x left top;
}
#page.ui-state-resources .footertext {
	padding: 85px 0px 10px 40px;
	background: transparent url(../images/wind_dunes.png) repeat-x left top;
}