/* @override http://springrains.org/new/includes/css/basic.css */

/* 
==============================
SpringRains.org Basic Style Sheet
==============================
This CSS cucumber was pickled by:
>> Kyle Dutka at See Design
>> www.seedesign.ca | kyle [at] seedesign.ca
------------------------------
CSSed in Canada inside an igloo with 
dial-up internet powered by beaver
fur and pemmican that was purchased
with coloured money from the Queen.
------------------------------

==============================
Notes
==============================
- Play Dodgeball with Nice Browsers (PDwNB) 
  refers to using [id], [class], etc. to hide that 
  element from IE6 in order to apply the AlphaImageLoader
  or another "hack" in ie6.css and force proper display in IE6
- Make IE Sit in the Corner (MIEsitC) refers to using the
  * hack to display only to IE6 and IE7.
- We do indeed actually play Dodgeball with the
  Nice Browsers (Firefox, Safari, etc.)
- IE 7 may be considered a Nice Browser due to it's 
  native transparent PNG support, but then again it's 
  Microsoft - so we're still deciding.
------------------------------

==============================
Table of Contents
==============================
1.1 General Styles
2.1 Structure
3.1 Header
4.1 Navigation: Main
5.1 Content: Titles
5.2 Content: Home
------------------------------

==============================
Colour Palette
==============================
#000000 - Black
#FFFFFF - White
#66CC33 - Spring Rains Green
#FFD100 - Orangey Yellow

------------------------------

==============================
Layers (z-index)
==============================
100 - CMS Editing Bar

------------------------------
*/


/* 
==============================
1.1 General Styles
============================== 
*/

body {
	margin: 0;
	padding: 0;
	color: #000101;
	font-size: 12px;
	line-height: 1.3em;
	font-family: Helvetica, Arial, sans-serif;
	/*background: url(../../images/page_bkg.jpg) #9A600E top left repeat-x;*/
	}

.clear_both {
	clear: both;
	}

/* --- Header and Paragraph --- */

h1 {
	font-size: 16px;
	}

h2 {
	font-size: 14px;
	}

h3 {
	font-size: 12px;
	}

h4 {
	font-size: 12px;
	font-weight: normal;
	}

p {
	margin: 5px 0 0 0;
	}

/* --- Links --- */

a {
	position: relative;
	color: #40200e;
	padding-bottom: 2px;
	text-decoration: underline;
	cursor: pointer;
	}

a:hover {
	color: #110803;
	text-decoration: underline;
	}
	
a.link_go {
	padding-right: 20px;
	background: url(../../images/link_go.gif) top right no-repeat;
	}

a.link_go:hover {
	background-position: right -15px;
	}

a.link_return {
	padding-left: 20px;
	background: url(../../images/link_return.gif) top left no-repeat;
	}

a.link_return:hover {
	background-position: left -15px;
	}

a img {
	border-bottom: none;
	}

a.link_external {
	padding-right: 12px;
	background: url(../../images/link_external.gif) top right no-repeat;
	}

a.link_external:hover {
	background-position: right -16px;
	}

a.link_download {
	padding-right: 20px;
	background: url(../../images/link_download.gif) top right no-repeat;
	}

a.link_download:hover {
	background-position: right -15px;
	}

	

/* --- Images --- */

img {
	}

/* --- Forms --- */

#contact_form {
	}

#contact_form input {
	width: 150px;
	padding: 3px;
	color: #40200e;
	font-size: 14px;
	font-family: Arial, Helvetica, sans-serif;
	border: 0;
	border-bottom: 1px solid #40200e;
	background: transparent;
	}

#contact_form input.submit {
	width: 50px;
	padding: 5px;
	color: #40200e;
	font-size: 14px;
	font-family: Arial, Helvetica, sans-serif;
	border: 1px solid #40200e;
	background: transparent;
	cursor: pointer;
	}

#contact_form input.submit:hover {
	color: #FFFFFF;
	border: 0px solid #40200e;
	background: #66CC33;
	}

#contact_form input.captcha {
	width: 50px;
	}

#contact_form textarea {
	width: 150px;
	height: 175px;
	padding: 3px;
	color: #40200e;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	border: 1px solid #40200e;
	background: transparent;
	}



/* --- Hide --- */

.hide {
	overflow:hidden;
	visibility:hidden;
	height:0;	
	}



/* --- Text Replacement --- */

h1.hide, h2.hide {
	text-indent: -7777777px;	
	}


/* 
==============================
2.1 Site Structure
==============================
*/

#container {
	position: relative;
	width: 895px;
	margin: 0 auto;
	}

#error {
	background: #FF0000;
	}

#mlist {
	position: absolute;
	top: 10px;
	right: -90px;
	z-index: 100;
	}

#header {
	position: relative;
	height: 185px;
	margin: 0;
	padding: 0;
	z-index: 11;
	width:875px;
	left:10px;
	}

/* PDwNB*/
#header[id] {
	background: url(../../images/header.png) top center no-repeat;
	}

#header_leaves {
	position: absolute;
	top: 10px;
	left: 0px;
	height: 225px;
	width: 200px;
	z-index: 15;
	}

#header_leaves[id] {
	background: url(../../images/header_leaves.png) top left no-repeat;
	}

#nav {
	margin: 0 10px 0 10px;
	padding: 0;
	list-style: none;
	z-index: 10;
	}

#nav[id] {
	position: relative;
	height: 40px;
	background: url(../../images/nav_bkg.png) top left repeat-x;
	}

#main {
	
	}

#main[id] {
	position: relative;
/*	background: url(../../images/main_bkg.png) top left repeat-y;
*/	}

#main_content {
	color: #40200e;
	margin: -10px 10px 0 10px;
	padding: 0 0 0 350px;
	/*background: url(../../images/main_bkg_1.jpg) top left no-repeat;*/
	}

#pageid_home #main_content {
	padding: 0 0 0 425px;
	}

#pageid_projects #main_content, #pageid_home2 #main_content{
	padding: 0 0 0 0px;
	}

/* --- Main BKGs --- */

#pageid_home #main_content {
	background: url(../../images/main_bkg_4.jpg) top left no-repeat;
	}

#pageid_about #main_content {
	background: url(../../images/main_bkg_3.jpg) top left no-repeat;
	}

#pageid_donate #main_content {
	background: url(../../images/main_bkg_2_new.jpg) top left no-repeat;
	}

#pageid_personnel #main_content {
	background: url(../../images/main_bkg_1_new.jpg) top left no-repeat;
	}

#pageid_resources #main_content {
	background: url(../../images/main_bkg_3_new.jpg) top left no-repeat;
	}
#pageid_contact #main_content {
	background: url(../../images/main_bkg_4_new.jpg) top left no-repeat;
	}

/* --- End BKGs --- */

#pageid_home #column1 {
	overflow: auto; 
	width: 415px;
	}

#pageid_home #column2 {
	overflow: auto; 
	width: 165px;
	}

#pageid_projects #column1{
	overflow: auto; 
	width: 220px;
	background:#fdfeda;
	border-bottom:1px solid #805b30;
	border-right:1px solid #805b30;
	border-left:1px solid #805b30;
	margin:0 8px 0 0;
	}
#column1_box{
	position:relative;
	top:-4px;
	background:#fdfeda;
	border-bottom:1px solid #805b30;
	border-right:1px solid #805b30;
	border-left:1px solid #805b30;
	margin:0px 8px 0 0;
	padding:15px 5px 5px 5px;
}

#pageid_projects #column2 {
	overflow: auto; 
	width: 612px;
	}
	
#pageid_home2 #column1 {
	overflow: auto; 
	width: 330px;
	padding:0;
	margin:0px 0px 0 0;
	}

#pageid_home2 #column2 {
	overflow: auto; 
	width: 532px;
	}	
	#pageid_projects #column2[id], #pageid_home2 #column2[id] {
	background:#FFFFFF;
	/*background: url(../../images/column_bkg_620.png) top left no-repeat;
*/
	}

#column1 {
	position: relative; 
	float: left;
	min-height: 430px;
	width: 490px;
	overflow: auto; 
	padding: 10px 10px 0 10px;
	}

#column2 {
	position: relative;
	float: left;
	min-height: 440px;
	overflow: auto; 
	width: 200px;
	margin: 0 0 0 5px;
	padding: 0 0 0 5px;
	}

#column1[id], #column2[id] {
	background:#FFFFFF;
	/*background: url(../../images/column_bkg_510.png) top left no-repeat;
	*/
	}

.content {
	position: relative;
	margin: 10px;
	padding-bottom: 10px;
	}

#footer {
	position: relative;
	display: block;
	height: 50px;
	width: 895px;
	margin: -10px 0 0 0;
	padding: 13px 10px 0 10px;
	text-align: center;
	}

#footer[id] {
	background: url(../../images/footer.png) top left no-repeat;
	}

/*
==============================
3.1 Header
==============================
*/

/* --- Logo --- */

#logo {
	position: relative;
	height: 225px;
	width: 260px;
	text-indent: -7777777px;
	z-index: 7;
	}

/* PDwNB */
#logo[id] {
	margin: 0 0 -43px 48px;
	background: url(../../images/logo.png) top left no-repeat;
	}

/* 
==============================
4.1 Navigation: Main
============================== 
*/

#nav ul {
	display: block;
	list-style: none;
	z-index: 8;
	}

#nav_primary {
	margin: 0 0 0 305px;
	padding: 0;
	}

#nav_secondary {
	float: right;
	margin: 0;
	padding: 0;
	}

#nav a {
	color: #000101;
	text-decoration: none;
	font-weight: bold;
	font-size: 1.1em;
	}

#nav a:hover {
	text-decoration: none;
	}

 /* DROP DOWN */

#nav li ul {
	position: absolute;
	top: 100%;
	left: 0px;
	width: 130px;
	padding: 10px 0 0 2px;
	margin: 0;	
	font-weight: normal;
	border: none;
	cursor: pointer;
	z-index: 100;
	}

	/* PDwNB */
	#nav[id] li ul {
		background: url(../../images/nav_sub_bkg.png) top left no-repeat;
		}

#nav li li a {
	display: block;
	width: 130px;
	height: 35px;
	padding: 2px 0 0 15px;
	color: #FFFFFF;
	font-weight: normal;
	text-indent: 0;
	text-align: left;
	vertical-align: middle;
	cursor: pointer;
	z-index: 100;
	background: url(../../images/nav_sub_link_bkg.gif) top left no-repeat;
	}

#nav li li a:hover {
	cursor: pointer;
	color: #f4cd00;
	background: url(../../images/nav_sub_link_bkg.gif) top left no-repeat;
	background-position: 0 -35px;
	}

#nav li li {
	display: block;
	background-color: transparent;
	border: 0;
	text-align: center;
	vertical-align: middle;
	cursor: pointer;
	z-index: 100;
	}

/* MIEsitC  */
#nav li li {
	*float: left;
	}

/* PDwNB */
#nav[id] li li {
	float: none;
	clear: left;
	}

/* ----- */

#nav li {
	display: block;
	float: left;
	position: relative;
	padding: 0;
	text-align: left;
	cursor: default;
	border-width: 0;
	}

/* ---  Dividers --- */

.divider {
	color: #666666;
	}

#nav_primary li.divider, #nav_secondary li.divider {
	width: 3px;
	height: 30px;
	margin: 0;
	padding: 0;
	text-indent: -7777777px;
	background: url(../../images/nav_divider.png) top left no-repeat;
	}

#nav_primary li.divider {
	filter: alpha(opacity=50);
	opacity: .50;
	}

#nav_secondary li.divider {
	filter: alpha(opacity=30);
	opacity: .30;
	}

/* --- Drop Down Set-up --- 

#nav li ul {
	display: none;
	width: 140px;
	position: absolute;
	top: 100%;
	left: 0;
	margin: auto;	
	font-weight: normal;
	}

/* PDwNB 
#nav[id] li ul {
	padding: 10px 0 0 0;
	}

#nav li>ul {
	top: auto;
	left: auto;
	}

#nav li li {
	display: block;
	background-color: transparent;
	border: 0;
	text-align: center;
	}

/* MIEsitC 
#nav li li {
	*float: left;
	}

/* PDwNB 
#nav[id] li li {
	float: none;
	clear: left;
	margin-left: 20px;
	}

#nav li:hover ul, #nav li.over ul {
	display: block;
	left: -40px;
	}
*/
/* --- Image Replacement --- */

#nav a {
	position: relative;
	float: left;
	margin: 0;
	padding: 0;
	text-indent: -7777777px;
	height: 30px !important; 
	}

#nav a:hover {
	background-position: 0 -30px;
	}

#nav_about a:hover {
	background-position: 0 0;
	}

/* Nav: Page Selected */
#pageid_about #nav_about a, #pageid_projects #nav_projects a, #pageid_donate #nav_donate a,
#pageid_personnel #nav_personnel a, #pageid_resources #nav_resources a, #pageid_contact #nav_contact a, #pageid_home #nav_home a {
	background-position: 0 -30px;
	cursor: default;
	}

#nav_about a {
	width: 65px;
	background: url(../../images/nav_about.png) top left no-repeat;
	cursor: pointer;
	}

#nav_projects a {
	width: 80px;
	background: url(../../images/nav_projects.png) top left no-repeat;
	}

#nav_donate a {
	width: 75px;
	background: url(../../images/nav_donate.png) top left no-repeat;
	}

#nav_personnel a {
	width: 75px;
	background: url(../../images/nav_personnel.png) top left no-repeat;
	}

#nav_resources a {
	width: 75px;
	background: url(../../images/nav_resources.png) top left no-repeat;
	}

#nav_contact a {
	width: 60px;
	background: url(../../images/nav_contact.png) top left no-repeat;
	}

#nav_home a {
	width: 55px;
	background: url(../../images/nav_home.png) top left no-repeat;
	}


/* --- Drop Down BKG --- */

.nav_drop_down_top {
	height: 49px;
	}

/* PDwNB */
.nav_drop_down_top[class] {
	background: url(../../images/nav_drop_down_bkg_top.png) top left no-repeat;
	}

/* MIEsitC */
.nav_drop_down_mid {
	*height: 100%;
	}

/* PDwNB */
.nav_drop_down_mid[class] {
	background: url(../../images/nav_drop_down_bkg_mid.png) top left no-repeat;
	}

.nav_drop_down_bottom {
	height: 26px;
	width: 140px;
	}

/* PDwNB */
.nav_drop_down_bottom[class] {
	background: url(../../images/nav_drop_down_bkg_bottom.png) top left no-repeat;
	}


/* 
==============================
5.1 Content: Titles
==============================
*/

/* --- Set-up --- */

h1.title {
	height: 25px;
	margin: 0 0 5px 0;
	padding: 0;
	text-indent: -7777777px;
	}	

/* --- Titles --- */

#title_news, #title_latest_project, #title_projects_current, #title_projects_completed {
	width: 140px;
	}

 #title_donate, #title_resources, #title_contact, #title_about, #title_personnel {
	width: 250px;
	} 

#title_news[id] {
	/*background:  url(../../images/title_news.png) top left no-repeat;*/
		background:  url(../../images/title_latest_project.png) top left no-repeat;

	}

#title_latest_project[id] {
	background:  url(../../images/title_latest_project.png) top left no-repeat;
	}

#title_donate[id] {
	background:  url(../../images/title_donate.png) top left no-repeat;
	}

#title_personnel[id] {
	background:  url(../../images/title_personnel.png) top left no-repeat;
	}

#title_resources[id] {
	background:  url(../../images/title_resources.png) top left no-repeat;
	}

#title_contact[id] {
	background:  url(../../images/title_contact.png) top left no-repeat;
	}

#title_about[id] {
	background:  url(../../images/title_about.png) top left no-repeat;
	}

#title_projects_current[id] {
	background:  url(../../images/title_projects_current.png) top left no-repeat;
	}

#title_projects_completed[id] {
	background:  url(../../images/title_projects_completed.png) top left no-repeat;
	}


/* 
==============================
5.2 Content: Home
==============================
*/


/* 
==============================
5.2 Content: Footer
==============================
*/

#footer p {
	margin: 0;	
	padding: 0;
	color: #006600;
	font-size: 11px;
	}

#footer a {
	padding-bottom: 1px;
	color: #006600;
	text-decoration: none;
	border-bottom: 1px dotted #009900;
	}

#footer a:hover {
	padding-bottom: 1px;
	color: #FFFFFF;
	border-bottom: 1px solid #FFFFFF;
	}

#footer .divider {
	color: #009900;
	}


/*
------------------------------------------------------------------------------------------
Your {CREATIVITY} is RESTRICTED [when you think] your creativity is BOUND by your {ABILITY}.
------------------------------------------------------------------------------------------
*/