/* Support After Suicide CSS */

/* @group Defaults */

html{
	padding:0;
	margin:0;
	height:100%;
	overflow-y: scroll;
	background: #E2F2FC url(../images/background.jpg) repeat-x top left;
	}
	body{
		background: url(../images/background_grass.jpg) repeat-x bottom;
		padding:0;
		margin:0;
		min-height:100%;
		}
		#wrapper{
			min-height: 100%;
			overflow: auto;
			}
			#main{
				width: 920px;
				margin: auto auto 0;
				}

.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

/* @end */


/* @group Header */

#header{
	padding:0px 0px 0px 15px;
	float: left;
	width: 905px;
	}
	#header #logo{
		margin: 25px 0px 20px 0px;
		float: left;
		}
		#header #logo a{
			display: block;
		}
	#header #login {
		list-style: none;
		float: right;
		width: 100%;
		margin: 20px 10px 0 0;
		padding: 20px 10px 0px 15px;
		width: 235px;
		height: 30px;
		
		font-family:"Century Gothic", "Trebuchet MS";
		font-weight: bold;
		font-size: 10px;
		color: #fff;
		}
		#header #login span{
			float: left;
			padding: 0px 10px;
			}

#homepage #header #login {
	background: #e2f4ff;
	-moz-border-radius:5px 5px 0px 0px;
	-webkit-border-radius:5px 5px 0px 0px;
	border-radius:5px 5px 0px 0px;
	}


/* @end */


/* @group Content */

	#content-wrapper{
		background:#FFF;
		width:680px;
		padding: 0px 10px 30px 30px;
		margin-left: 10px;
		float:left;
		clear:none;
		-moz-border-radius:5px 5px 5px 5px;
		-webkit-border-radius:5px 5px 5px 5px;
		border-radius:5px 5px 5px 5px;
		}
		#content{
			float: left;
			width: 390px;
			margin: 0;
			padding: 30px 0px 0px 0px;
			}
			#content ul, 
			#content dl{
				padding:0;
				margin:0 20px 20px 10px;
				}
				#content ul li, 
				#content dl dt{
					background: url(../images/bullet.gif) no-repeat 0 6px;
					list-style:none;
					padding:0 0 0 15px;
					margin-bottom:5px;
					}
					#content dl dd{
						padding:0;
						margin:0;
						}
		
				#content #mp3player{
					margin-top: 10px;
					}
				
				#content .divider{
					width: 390px;
					margin: 10px 0px 20px 0px;
					overflow: auto;
					}
					
					#content .divider.to-top{
						background: #f8f8f8;
						padding: 10px;
						text-align: right;
						-moz-border-radius:5px 5px 5px 5px;
						-webkit-border-radius:5px 5px 5px 5px;
						border-radius:5px 5px 5px 5px;
						}
					
					#content .divider .links{
						float: right;
						width: auto;
						}
						#content .divider .links a{
							background-image: url(../images/ui-icons_links.gif) ;
							width: 24px;
							height: 25px;
							float: left;
							text-indent: -3000px;
							margin-left: 5px;
							}
							#content .divider .links a.email  { background-position: 0 0; }
							#content .divider .links a.pdf    { background-position: -24px 0; }
							#content .divider .links a.help   { background-position: -48px 0; }
								#content .divider .links a.email:hover  { background-position: 0 -24px; }
								#content .divider .links a.pdf:hover    { background-position: -24px -24px; }
								#content .divider .links a.help:hover   { background-position: -48px -24px; }
	
				
				/* Anchor Links */
				#content #anchor-links{
					width: 390px;
					display: block;
					margin: 30px 0px;
					}
					#content #anchor-links ul{
						border-top: #f27b16 1px solid;
						border-bottom: #f27b16 1px solid;
						padding: 15px 0px 13px 0px;
						margin: 0px;
						}
						#content #anchor-links ul li{
							background-image: url(../images/ui-bullet_down-orange.gif);
							background-position: 0 8px;
							}
						
						
/* @end */



/* @group Homepage */

#homepage .link-cols{
	float: left;
	width: 390px;
	margin-top: 20px;
	}
	#homepage .link-cols ul{
		list-style: none;
		margin: 0px;
		padding: 0px;
		float: left;
		width: 100%;
		}
		#homepage .link-cols ul li{
			float: left;
			width: 33%;
			background: none;
			padding: 0px;
			margin-bottom: 2px;
			}

	/* Immediate Help */
	#homepage #immediate-help.link-cols ul{
		color: #f27b16;
		background: #feecdc;
		-moz-border-radius:5px 5px 5px 5px;
		-webkit-border-radius:5px 5px 5px 5px;
		border-radius:5px 5px 5px 5px;
		padding: 10px 0px;
		margin-bottom: 20px;
		}
		#homepage #immediate-help.link-cols ul li.col1{
			padding-left: 18px;
			width: 102px;
			}
		#homepage #immediate-help.link-cols ul li.col2{
			padding-left: 5px;
			width: 130px;
			}	
		#homepage #immediate-help.link-cols ul li.col3{
			width: 120px;
			}

/* Stories Carousel */


#homepage #stories{
	width: 100%;
	float: left;
	clear: both;
	margin-top: 40px;
	position: relative;
	}
	
	.ie7 #homepage #stories{
		margin-top: 80px;
		}
		
	#homepage #stories h4{
		position: absolute;
		top: 0px;
		}
	#homepage #carousel{
		width: 660px;
		position: relative;
		background: url(../images/bg-carousel.gif) no-repeat 0 36px;
		}
		#homepage #carousel ul{
			margin: 0;
			padding: 0;
			list-style: none;
			display: block;
			height: 220px;
			
			}
			#homepage #carousel ul li{
				float: left;
				position: relative;
				margin: 0px;
				padding: 0px;
				}
				#homepage #carousel ul li .inner{
					display: block;
					padding: 20px 220px 20px 20px;
					width: 418px;
					height: 140px;
					margin-top: 40px;
					}
					#homepage #carousel ul li .inner blockquote{
						color: #666;
						font-size: 18px;
						line-height: 22px;
						font-style: italic;
						padding-left: 3px;
						}
					#homepage #carousel ul li .inner p{
						color: #666;
						padding: 10px 0px 10px 0px;
						}
					#homepage #carousel ul li .inner a{
						display: block;
						color: #666;
						font-size: 10px;
						line-height: 12px;
						font-weight: bold;
						padding: 5px 0 3px 3px;
						}
						#homepage #carousel ul li .inner a:hover{
							color: #999;
							}
					
					#homepage #carousel ul li .inner img{
						position: absolute;
						right: 0px;
						bottom: 0px;
						}
			#homepage #carousel #pagination{
				text-align: center;
				margin-top: 10px;
				}	
				#homepage #carousel #pagination a{
					color: #e1e1e1;
					font-size: 25px;
					padding: 0px;
					cursor: pointer;
					}
					#homepage #carousel #pagination a.selected{
						color: #a7a5a6;
						}
					#homepage #carousel #pagination a:hover{
						color: #666;
						}
			
			#homepage #carousel #prev,
			#homepage #carousel #next{
				float: left;
				position: absolute;
				width: 20px;
				height: 40px;
				text-indent: -3000px;
				top: 105px;
				background: #f4f4f4 url(../images/ui-carousel-arrows.png) no-repeat;
				}	
				#homepage #carousel #prev{
					left: -19px;
					-moz-border-radius: 5px 0px 0px 5px;
					-webkit-border-radius: 5px 0px 0px 5px;
					border-radius: 5px 0px 0px 5px;
					background-position: 0 0;		
					}
				#homepage #carousel #next{
					right: -19px;
					-moz-border-radius: 0px 5px 5px 0px;
					-webkit-border-radius: 0px 5px 5px 0px;
					border-radius: 0px 5px 5px 0px;	
					background-position: -20px 0 !important;		
					}
					#homepage #carousel #prev:hover,
					#homepage #carousel #next:hover{
						background: #e2e2e2 url(../images/ui-carousel-arrows.png) no-repeat;
						cursor: pointer;
					}	
		

/* @end */



/* @group Footer */
#footer{
	float: right;
	width: 720px;
	margin: 10px 0px 20px 0px;
	}
	#footer .bar{
		background: #FFF;
		width: 690px;
		float: left;
		padding: 12px 15px;
		-moz-border-radius:5px 5px 5px 5px;
		-webkit-border-radius:5px 5px 5px 5px;
		border-radius:5px 5px 5px 5px;
		
		font-family: Tahoma, Geneva, Verdana;
		font-size: 10px;
		line-height: 16px;
		color: #949494;
		}
		#footer .bar .inner{
			float: left;
			}
		#footer .bar a{
			color: #949494;
			text-decoration: underline;
			}
			#footer .bar a:hover{
				text-decoration: none;
				}
			#footer .bar a.facebook{
				float: right;
				padding-left: 23px;
				background: url(../images/ui-icon_facebook.gif) no-repeat 0 center;
				text-decoration: none;
				}
				#footer .bar a.facebook:hover{
					color: #a4a6a6;
					}

	#footer #logo-involved{
		float: right;
		margin: 10px 10px 0px 0px;
		}

/* @end */



/* @group Fonts */

html, body{
	font-family: "Century Gothic", "Trebuchet MS";
	font-size: 12px;
	line-height: 16px;
	color: #002f67;
	}
	
	h1{
		font-size: 20px;
		color: #3399cc;
		font-weight: normal;
		padding-bottom: 15px;
		}
		
		
		
	h2{
		color: #49B7F1;
	    font-size: 15px;
	    font-weight: normal;
	    line-height: 22px;
	    padding-bottom: 10px;
		}
		
		
	h3{
		font-size: 16px;
		line-height: 18px;
		font-weight: normal;
		color: #666;
		padding-bottom: 10px;
		}
	
	h4{
		font-size: 20px;
		line-height: 22px;
		font-weight: normal;
		padding-bottom: 10px;
		}
		
		
	p,
	#content li{ 
		font-family: Tahoma, Verdana, Geneva;
	    font-size: 12px;
	    line-height: 18px;
		padding-bottom: 15px;
		}
		p.intro{
			font-family: "Century Gothic", "Trebuchet MS";
			font-size: 16px;
			line-height: 23px;
			color: #3399cc;
			}
			

/* Header */
#homepage #header #login {
	color: #3399cc;
	}

/* Divider */
.divider h3{
	line-height: 25px;
	padding-bottom: 0px;
	}


/* Anchor Links */
#content #anchor-links h3 { color: #f27b16; }


/* Content */

#content h3{
	margin-top: 10px;
	color: #003366;
    font-size: 13px;
	font-weight: bold;
	padding-bottom: 5px;
	}
	#content .divider h3{  
		margin: 0px;
		}
			
	/* Related Organisations */
	#content.contacts h2 {  }
	#content.contacts h3{
		font-family:"Century Gothic", "Trebuchet MS";
		color: #F27B16; 
		font-size:14px; 
		}
	#content.contacts h4{ 
		font-family:"Century Gothic", "Trebuchet MS"; 
		color: #003366; 
		font-size:12px; 
		line-height: 16px; 
		font-weight: bold;
		padding-bottom: 10px;
		}
	
	#content.contacts dt,
	#content.contacts dd, 
	#content.contacts li, 
	#content.contacts .grey li { 
		color: #666;
		}
		#content.contacts dt{
			background: 0px;
			margin: 0px;
			padding: 0px 0px 3px 0px;
			font-weight: bold;
			}
		#content.contacts dd{
			padding: 0px 0px 15px 0px;
			}

/* Homepage */
#homepage #stories h4{ color: #6a6a6a; }
#homepage #immediate-help h4{ color: #f27b16; }
#homepage #more-info h4 { color: #3399cc; }

#homepage .link-cols ul li strong,
#homepage .link-cols ul li span{
	font-family:"Century Gothic", "Trebuchet MS";
	float: left;
	clear: both;
	width: 100%;
	}
	#homepage .link-cols ul li strong{
		font-weight: bold;
		font-size: 12px;
		}
	#homepage .link-cols ul li span{
		font-size: 16px;
		}

/* @end */



/* @group Links */

/* Header */
#header #login a{
	float: left;
	text-decoration: underline;
	color: #fff;
	}
	#header #login a:hover{
		text-decoration: none;
	}
		#homepage #header #login a{
			color: #3399cc;
			}

a.more {
	font-family:"Century Gothic", "Trebuchet MS";
    font-size: 10px;
    font-weight: bold;
    }

/* Content */
#content a{
	color: #003366;
	}
	#content a:hover { 
		color: #12579d;
		}

	/* Intro */
	#content p.intro a{
		color: #3399cc;	
		}
		#content p.intro a:hover{
			color: #4fbbf1;
			}

	/* Anchor Links */
	#content #anchor-links li a{ 
		color: #f27b16;
		text-decoration: none;
		}
		#content #anchor-links li a:hover{ color: #002f67; }

	/* Divider */
	#content .divider.to-top a{
		color: #b1b2b2;
		font-weight: bold;
		text-decoration: none;
		}
		#content .divider.to-top a:hover{
			text-decoration: underline;
			}


/* Homepage */
#homepage .link-cols ul li a{
	font-family: Tahoma, Geneva, Verdana;
	font-size: 12px;
	line-height: 16px;
	color: #666;
	text-decoration: underline;
	}
	#homepage .link-cols ul li a:hover{
		color: #999;
		}

/* Related Organisations */
#content.contacts dt a,
#content.contacts dd a, 
#content.contacts li, 
#content.contacts .grey li a{ color: #666; }
	#content.contacts dt a:hover,
	#content.contacts dd a:hover,
	#content.contacts .grey li a:hover { color: #999; }


/* @end */