/* =General
---------------------- 
	General Styles applied to 'normalize' things
	Notes:
		EM styling generally following (http://www.clagnut.com/blog/348/) from this point 10px=1em, 11px=1.1em, etc
---------------------- */
html {
	padding: 0;
	margin: 0;
	font-size: 100%; /* ensures font consistency across browsers */
	height: 100%;
}
body {
	padding: 0;
	margin: 0;
	font-size: 62.5%; /* correct value for IE6 */
	line-height: 1.5;
	background:url('../images/secondary_bkg.gif') repeat-x #AAB4D7;
	color: #5B6073;
	text-align: center;/* fix IE5 bug that doesn't honor margin auto */
	font-family: Georgia, Times, serif;
	height: 100%;
}
html > body {
	font-size: 10px; /* correct value for non-IE6 browsers */
}
body.home {
	background:url('../images/home_bkg.gif') repeat-x #404F84;
	color: #A1A9C5;
}
p {
	padding: 0;
	margin: 0 0 .8em 0;
	line-height: 1.8em;
	font-size:1.1em;
}

INPUT, SELECT, TH, TD {font-size: 1em}
H1 {font-size: 2.4em}  /* displayed at 24px */
H2 {font-size: 1.1em;  /* displayed at 11px */
	font-family:Arial, Helvetica, sans-serif;
	font-weight:normal;
	padding:0;
	margin:0 0 4px 0;
	color:#8A92AF;
	border-top:0px solid red;
	display:none;
	}
H3 {
	font-size: 1em;
	margin: 20px 0 10px 0;
	padding:0;
	text-indent: -5000px;
	overflow: hidden;
	height:22px;
	width:479px;
}
H4 {
	font-size: 1.2em;
	margin: 1em 0 .6em 0;
	text-transform:uppercase;
}
H5 {
	font-size: 1em;
	margin: 0;
	color:#559CBE;
	margin: 0 0 0.5em 0;
}

img, a img {
	border: none;
}
ol, ul {
	font-size:inherit;
	margin:0;
	padding:0;
}
/* =Master
---------------------- 
	Master Container
	Notes:
		margin: 0px auto; centers the container horizontally except in IE5, which is fixed in the body tag
---------------------- */
#container {
	position: relative;
	margin: 0px auto;
	padding: 0px;
	width: 740px;
	text-align: left; /* unfix all other browsers from the IE fix in the body tag above */
	height: auto !important;  /*for footer-stick */
	height: 100%;  /*for footer-stick */
	min-height: 100%;  /*for footer-stick */
	background:url('../images/secondary_flower.gif') bottom left no-repeat;
}
#container.home {
	background:url('../images/home_flower.gif') bottom left no-repeat;
}
	/* Skip link(s) */
	#skiplink a {
		position : absolute;
		top : -1000px;
		left : -2000px;
	}
	
	#skiplink a:focus, #skiplink a:active {
		position : absolute;
		margin : 0;
		top : 0;
		left: 0;
		display : block;
		padding : 0;
		background: #000;
		color : #fff;
		font-weight: bold;
	}
	
	#skiplink a:hover { 
	}
		
/* =Branding
----------------------*/
#branding {
	clear: both;
	width: 100%;
	height: 152px;
	position:relative;
	margin-top:5px;
}
	#branding-logo {
		cursor: pointer;
		width:261px;
		height:152px;
		margin: 0;
		padding: 0;
		border-top:0px solid red;
		float:left;
		background: url("../images/cianscause_logo.gif") 0 0 no-repeat;
	}
		#branding-logo h1 {
			margin: 0;
			text-indent: -5000px;
			overflow: hidden;
			width: 261px;
			height: 100%;
			position:relative;
			float:left;
			padding: 0; /* Neutralize h1's default behavior */
			clear:none;
		}
			#branding-logo h1 a {
				display: block;
				width: 100%;
				height: 100%;
			}
	
	#branding-tagline {
		display: block;
		position:relative;
		width: 240px;
		height: 16px;
		margin: 0 0 0 70px;
		padding: 0;
	}
		#branding-tagline h2 {
			text-indent: -5000px;
			overflow: hidden;
			background: url("../images/branding/tagline_whitebg.jpg") left top no-repeat;
			width: 100%;
			height: 100%;
			margin: 0;
			padding:0;
		}
	#branding-header { /* UNUSED */
		width:479px;
		width:100%;
		height:152px;
		margin: 0;
		padding: 0;
		float:right;
		border-top:0px solid red;
	}
	#branding.home {
		background: url("../images/headers/header_home.jpg") top right no-repeat;
	}
	.ciansstory {
		background: url("../images/headers/header_ciansstory.jpg") top right no-repeat;
	}
	.aboutneuroblastoma {
		background: url("../images/headers/header_aboutneuroblastoma.jpg") top right no-repeat;
	}
	.newsandevents {
		background: url("../images/headers/header_newsandevents.jpg") top right no-repeat;
	}
	.resources {
		background: url("../images/headers/header_resources.jpg") top right no-repeat;
	}
	.angelsandwarriors {
		background: url("../images/headers/header_angelsandwarriors.jpg") top right no-repeat;
	}
	.contactus {
		background: url("../images/headers/header_contactus.jpg") top right no-repeat;
	}
/* =Content
----------------------
	Main Content styles
	Notes:
		font-size: 1em makes the text inherit size from #container, and expandable in IE
		Remember: The font is inherited, so some math will be necessary to size children up or down correctly
---------------------- */
#topbar{
	width:100%;
	height:69px;
	margin-bottom:0px;
	position:relative;
	border:0px solid red;
	background:url('../images/topbar_flower.gif') 355px 0 no-repeat;
}
.topbarright {
	width:422px;
	padding:0px;
	position:absolute;
	bottom:0;
	right:0;
	border:1px solid red;
}
#main-navigation{
	height:24px;
	margin:45px 0 0 0;
	bottom:0;
	right:0;
	position:absolute;
}
#main-navigation a {
	height:24px;
	display:block;
	float:left;
	text-indent: -5000px;
	overflow: hidden;
	background-position:0 0px;
}
#main-navigation .ciansstory {
	background:url("../images/navigation/main_ciansstory.gif") no-repeat;
	width:81px;
}
#main-navigation .aboutneuroblastoma {
	background:url("../images/navigation/main_aboutneuroblastoma.gif") no-repeat;
	width:139px;
}
#main-navigation .newsandevents {
	background:url("../images/navigation/main_newsandevents.gif") no-repeat;
	width:95px;
}
#main-navigation .resources {
	background:url("../images/navigation/main_resources.gif") no-repeat;
	width:73px;
}
#main-navigation .angelsandwarriors {
	background:url("../images/navigation/main_angelsandwarriors.gif") no-repeat;
	width:110px;
}
#main-navigation .contactus {
	background:url("../images/navigation/main_contactus.gif") no-repeat;
	width:78px;
}
#main-navigation a:hover {
	background-position:0 -24px;
}
#main-navigation a.on {
	background-position:0 -48px;
}
#maincontent{
	clear: both;
	width: 100%;
	position:relative;
	margin-top:5px;
	padding:15px 0;
}
/* =Multicol
----------------------
	Multi-Column Content styles
	Notes:
		This is ONLY for content text. Navigation that goes on the left as a "column" is part of #nav-section
		If you need "pixel-perfect", you'll have to stop using percentages and use actual pixels
---------------------- */
#maincontent #twoColumnLeft {
	margin: 15px 0 0 0;
	float: left;
	clear: none;
	display: inline;/* Fix IE double-margin bug, Fx ignores it */
	width: 186px;
	padding: 0 40px 0 35px;
	border-top:0px solid yellow;
	border-bottom:0px solid yellow;
}
#maincontent #twoColumnRight {
	float: right;
	clear: right;
	display: inline;
	width: 479px;
	padding:0px;
	margin: 0;
	border-top:0px solid blue;
	border-bottom:0px solid blue;
	min-height:288px;
}
#maincontent #twoColumnLeft ul, li {
	margin: 0;
	padding: 0;
	list-style-type:none;
}
#maincontent #twoColumnLeft ul{
	display:block;
	clear:both;
	margin-bottom:1em;
}
#maincontent #twoColumnLeft li {
	display: block;
	width:100%;
	text-align:center;
	float: left;
	clear: left;
	line-height:1.5em;
	padding:.5em 0;
	background:url('../images/subnav_divider.gif') bottom left repeat-x;
}
#maincontent #twoColumnLeft li.last {
	background-image:none;
}
#maincontent #twoColumnLeft li a, #maincontent #twoColumnLeft li a:active, #maincontent #twoColumnLeft li a:visited {
	font-size:1.1em;
	color:#5B6073;
	text-decoration:none;
}
#maincontent #twoColumnLeft li a:hover {
	text-decoration:underline;
}
#maincontent #twoColumnRight ul, li {
	margin: 0;
	padding: 0;
	list-style-type:none;
}
#maincontent #twoColumnRight ul{
	display:block;
	clear:both;
	margin-bottom:1em;
}
#maincontent #twoColumnRight li{
	font-size:1.1em;
	line-height:1.8em;
	padding:0 0 0 12px;
	background:url('../images/bullet.gif') 2px 7px no-repeat;
}


/*-------------------
#content table tr {
	margin:0;
	padding:0;
}
#content table td {
	padding-bottom:1em;
}
#content table td.date {
	padding-right:15px;
}
#content table td.headline a, #content table td.headline a:visited {
	text-decoration:none;
	color:#E4E4E4;
}
#content table td.headline a:hover, #content table td.headline a:active {
	text-decoration:underline;
	color:#FFFFFF;
}*/
/* =Footer
----------------------
	Credit/footer styles: Usually the copyright/company info
	Notes:
---------------------- */
#footer {
	clear: both;
	position: relative; /* for footer-stick */
	margin: 20px 0 0 0; /* negative margin makes footer-stick work */
	background:url('../images/subnav_divider.gif') 0 0 repeat-x;
	color:#8A92AF;
	padding:20px 0 0 0;
}
#siteinfo {
	margin: 0 auto; /* negative margin makes footer-stick work */
	font-size: 1.1em;
	color: #6a6a6a;
}
	#siteinfo-legal {
		float: left;
		display: inline;
		padding: 0.5em 5px 0 20px;
		font-size: 0.8em;
		color: #FFFFFF;
	}
	#siteinfo-links {
		float: right;
		display: inline;
		padding: 0.5em 20px 0 5px;
		font-size: 0.8em;
		color: #45494D;
	}
	#siteinfo-links a {
		color: #45494D;
	}
	#siteinfo-links a:hover {
		text-decoration:underline;
	}
	/*
	#siteinfo-terms {
		float: right;
		clear: both;
		display: inline;
		padding: 7px 20px 0 5px;
		width: 50%;
		text-align: right;
	}
	*/

/* =Uni
----------------------
	Universal styles: Styles that apply to elements found throughout the site
	Notes:
		The best example of this is the "clear" div
---------------------- */
a {
	color:#5B6073;
}
a:hover {
	color:#FFFFFF;
	}
a.arrowed {
	color:#5B6073;
	background: url("../images/linkarrow.gif") 00 no-repeat;
	padding-left: 9px;
}
a.arrowed.home { color:#A1A9C5; }
a.arrowed:hover {
	color:#FFFFFF;
	}
.footnote {
	color:#999999;
	line-height:1.4em;
	border-top:1px dotted #999999;
	padding-top:1em;
}
.clear {
	clear: both;
	/* Try adding any/all of these if clear divs aren't working right:
	height: 1%;
	width: 100%;
	font-size: 1%;
	line-height: 1;
	*/
}
.title {
		xcolor: #303F56;
		font-weight:bold;
}
.quote {
	color:#FFFFFF;
	text-align:center;
	margin:20px 0 0 0;
}
.speaker {
	xcolor:#C9D0EA;
}
.bold {
	font-weight: bold;
}
.em {
	font-style: italic;
}
.divided {
	background:url('../images/subnav_divider.gif') 0 0 repeat-x;
	padding:.8em 0 0 0;
}