@charset "utf-8";
body {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	background: #fff;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000000;
}

a:link {  
	color: #ed2226;
	}
a:visited { 
	text-decoration: none; 
	color: #777779;
	}
a:hover, a:active { 
	text-decoration: underline; 
	color: #9685BA;
	}
	
.kidlinks #container {
	width: 1024px;  
	background: url(images/kidlinks_bkg.jpg) no-repeat center top;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
}

.kidlinks #mainContent {
	padding: 0px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	margin: 0;
}

#main
{
	float: right;
	width: 703px;
	background-image: url(images/kidlinks_corner2.gif);
	background-position:bottom right;
	background-repeat:no-repeat;
	padding: 0px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
}
#navblock
{
	width: 703px;
	height: 35px;
	padding: 441px 0 0 0px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
}
#nav
{
	background: url(images/Temp_navholder.gif) bottom center no-repeat;
	width: 703px;
	height: 35px;
}
/* Top Navigation */

				ul#topnav { 
					width:703px; 
					list-style:none; 
					margin: 0; 	padding: 0; 
				}

				ul#topnav li { 
					display: inline;
				}

				ul#topnav li a { 
					float:left;
					text-indent:-1333px; 
				}

				ul#topnav li#topnav-1 a { 
					height:35px;
					width: 97px;
					background:url(images/nav_home.gif) no-repeat 0 0; /* X and Y position at 0 */
				} 
					 
				ul#topnav li#topnav-1 a:hover { 
					background:url(images/nav_home.gif) no-repeat;
					background-position: 0 -35px;
				} 

				ul#topnav li#topnav-2 a { 
					height:35px; 
					width: 103px;
					background:url(images/nav_about.gif) no-repeat 0 0; 
				} 
					 
				ul#topnav li#topnav-2 a:hover { 
					background:url(images/nav_about.gif) no-repeat; 
					background-position: 0 -35px;
				} 
				
				ul#topnav li#topnav-3 a { 
					height:35px; 
					width: 139px;
					background:url(images/nav_beneficiaries.gif) no-repeat 0 0; 
				} 
					 
				ul#topnav li#topnav-3 a:hover { 
					background:url(images/nav_beneficiaries.gif) no-repeat; 
					background-position: 0 -35px;
				} 
				
				ul#topnav li#topnav-4 a { 
					height:35px; 
					width: 191px;
					background:url(images/nav_trustees.gif) no-repeat 0 0; 
				} 
					 
				ul#topnav li#topnav-4 a:hover { 
					background:url(images/nav_trustees.gif) no-repeat; 
					background-position: 0 -35px;
	}
				ul#topnav li#topnav-5 a { 
					height:35px; 
					width: 83px;
					background:url(images/nav_events.gif) no-repeat 0 0; 
				} 
					 
				ul#topnav li#topnav-5 a:hover { 
					background:url(images/nav_events.gif) no-repeat; 
					background-position: 0 -35px;
	}
				ul#topnav li#topnav-6 a { 
					height:35px; 
					width: 90px;
					background:url(images/nav_news.gif) no-repeat 0 0; 
				} 
					 
				ul#topnav li#topnav-6 a:hover { 
					background:url(images/nav_news.gif) no-repeat; 
					background-position: 0 -35px;
	}
/* END Top Navigation */
	

/*MAIN COPY SECTION*/
#contact
{
	float: right;
	width: 149px;
	font: bold italic 13px Helvetica, Arial, sans-serif;
	color: #0c408c;
	padding: 0px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	margin: 8px 0 0 0px
}

#contact a
{
	color: #0c408c;
	text-decoration:underline;
}
#contact a:hover
{
	color: #4c6b99;
}

#maincopy {
	width: 650px;
	padding: 19px 0px 100px 40px;
	margin: 0px;
}

#maincopy p {
	font: normal 13px Helvetica, Arial, sans-serif;
	line-height: 2.1;
	color: #000000;
}

#maincopy p span {
	font: bold 14px Arial, sans-serif;
	color: #ed2226;
}


#maincopy h2 {
	font: bold italic 19px Helvetica, Arial, sans-serif;
	line-height: 2.1;
	color: #28632d;
	margin-bottom: -2px;
}


#maincopy h4 {
	font: normal 12px Helvetica, Arial, sans-serif;
	margin: 0px 0px 0px 0px;
	padding: 0;
	color: #0c408c;
}

#maincopy ul li {
	font: normal 13px Helvetica, Arial, sans-serif;
	line-height: 2;
	color: #000000;
	margin-left: -26px;
}

/*LEFT SIDE BAR*/
#side
{
	float: left;
	width: 310px;
	padding: 0px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
}
#logo
{
	width: 236px;
	height: 94px;
	margin: 50px 0 0 30px;
	padding: 0px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	background-image: url(images/kidlinks_logo.gif);
	background-repeat: no-repeat;
}

#logo a 
{
	display: block; 
	width: 236px;
	height: 95px;
	text-decoration:none;
}
#logo a span
{
	visibility: hidden; 
}

.kidlinks #picture
{
	float: right;
	width: 266px;
	height: 275px;
	margin: 122px 4px 0px 0px;
	padding: 0px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	background: url(images/Kidlinks_side_image1.jpg) top center;
}

#sidebar
{
	float: right;
	width: 240px;
	margin: 0px;
	padding: 0px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	border-bottom:1px solid #3e9c46;
}
#sidebar h1
{
	font: italic bold 19px Arial, Helvetica, sans-serif ;
	color: #eb2026;
	margin-top: -1px;
}

#sidebar p
{
	font: normal 13px Arial, Helvetica, sans-serif ;
	line-height: 1.6;
	color: #000000;
	margin-top: -13px;
}

#sidebar p span
{
	font: bold 15px Arial, Helvetica, sans-serif ;
	line-height: 1.6;
	color: #28632d;
}



.kidlinks #footer {
	clear:both;
	padding: 0px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	background-image: url(images/kidLinks_footer3.gif);
	background-position:top;
	background-repeat:no-repeat;
	width:1024px;
	height: 140px;
}
.kidlinks #footer p {
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 120px 0px 0px 30px; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
	font: normal 11px helvetica, Arial, Helvetica, sans-serif ;
	color:#666666;
}

#sidebar ul {
		list-style:none;
		margin:0;
		padding:0;
		}

	#sidebar li {
		margin:0 0 10px 0;
		padding:0;
	}

	#sidebar li a:link, #sidebar li a:visited {
		font-family:Arial,sans-serif;
		font-weight: bold;
		font-size: 13px;
		display:block;
		color: #0c408c;
		text-decoration:none;
		background:url(images/sidebar-rollover.gif) no-repeat left top;
		
		line-height:27px; /* i made the rollover image 81px tall, this will show only top */
		padding:0 15px 0 15px; /* this indents the text over to clear the margin on the rollover image */
		border:none;
	}

	#sidebar li a:hover, #sidebar li a:active {
		color: #EFEFEF;
		text-decoration:underline;
		background-position:left center; /* this will show the middle of the rollover image*/
		}

	#sidebar li.current a {
		color: #EFEFEF;
		text-decoration:none;
		background-position:left bottom; /* this will show the bottom of the rollover image*/
		cursor: default;
		}
	
	#sidebar #sub li {
		margin:0 0 4px 0;
	}
	
	#sidebar #sub li a:link, #sidebar li ul li a:visited {
		font-weight:normal;
		color: #1c8626;
		text-decoration:none;
		line-height:23px;
		padding-left:20px;
		background:url(images/sidebar-rollover-sub.gif) no-repeat left top;
	}
	
	#sidebar #sub li a:hover, #sidebar li ul li a:active {
		text-decoration:underline;
		color:#ed2226; 
		background:url(images/sidebar-rollover-sub.gif) no-repeat left bottom;
	}
	
	h2#about-h2 {
	margin: 0px 0px 10px 0px;
	height: 70px;
	background: url(images/h2-about.gif) no-repeat left top;
}
	h2#about-h2 span {
	visibility:hidden;
}

h2#contact-h2 {
	margin: 0px 0px 10px 0px;
	height: 70px;
	background: url(images/h2-contact.gif) no-repeat left top;
}
	h2#contact-h2 span {
	visibility:hidden;
}

h2#events-h2 {
	margin: 0px 0px 10px 0px;
	height: 70px;
	background: url(images/h2-events.gif) no-repeat left top;
}
	h2#events-h2 span {
	visibility:hidden;
}

h2#beneficiary-h2 {
	margin: 0px 0px 10px 0px;
	height: 70px;
	background: url(images/h2-beneficiaries.gif) no-repeat left top;
}
	h2#beneficiary-h2 span {
	visibility:hidden;
}

#contentlist ul {
	width: 600px;
	font: normal 10pt Arial, sans-serif;
  	list-style: none;
  	display: inline;
}
 
#contentlist li {
  float: left;
  width: 250px;
  margin: 0;
  padding: 0px;
  border-bottom:1px solid #3e9c46;
  background-image: url(images/bullet.gif);
  background-position: 0 12px;
  background-repeat: no-repeat;
  padding: 10px 20px 10px 25px; /* left padding moves the text away from the bullet */
display: inline;
} 
