/* ------------------------------------------------------------------------------------------------ */
/* global styles 
/* ------------------------------------------------------------------------------------------------ */

body{
	margin: 0;
	padding: 0;
	background: #1C1A1A url(../img/bgBody.gif) 0 0 repeat-x;
	background: #1C1A1A;
	font:normal 12px/150%  Arial, Helvetica, sans-serif;
	color:#FFF;
	}

p{
	margin: 0 0 1.5em 0;
	}

a{
	color:#FF0000;
	outline: none;
	text-decoration: none
	}

a:hover{
	text-decoration: underline
	}

h2{
	margin: 0px 0px 0px 0px;	
	font-size:;
	}

h3{
	margin: 0px 0px 0px 0px;	
	font:normal normal 27px/100% Arial, Helvetica, sans-serif;
	color: #FFF;
	text-transform: uppercase
	}

h4{
	margin: 0px 0px 14px 0px;	
	font:normal normal 18px/100% Arial, Helvetica, sans-serif;
	}

h5{
	margin: 0px 0px 0px 0px;	
	font-size:;
	}

h6{
	margin: 0px 0px 0px 0px;	
	font-size:;
	}

/* ------------------------------------------------------------------------------------------------ */

#MainWrapper{
	width: 1100px;
	margin: auto;
	background: #020200 url(../img/bgContent.jpg) 0px 84px no-repeat;
	}
	
/* ------------------------------------------------------------------------------------------------ */
/* header 
/* ------------------------------------------------------------------------------------------------ */
	#Header{
		width:940px;
		height: 84px;
		position:relative;
		background: #000;
		margin: 0px auto 25px auto;
		}
	
	/* logo */
		h1#Logo{
			margin: 0;
			position:absolute;
			top:28px;
			left:0;
			}
		
		h1#Logo a{
			display: block;
			width:178px;
			height:38px;
			overflow:hidden;
			text-indent: -9999em;
			background: url(../img/shoe4africa.gif) 0px 0px no-repeat;
			}
	/* /logo */
	
	/* headline */
		h2#Headline{
			font:normal normal 16px/18px Arial, Helvetica, sans-serif;
			color: #FFF;
			position:absolute;
			top: 45px;
			right:0px;
			z-index:1;
		}
		
		h2#Headline em{
			font-style: normal;
			color: #FF0000;
		}
		
		h2#Headline strong{
			font-size: 18px;
		}
	/* /headline */
	
	/* social networking links */
		#Header #SNNav{
			position:absolute;
			top: 8px;
			right: -7px;
			z-index:1;
		}
		
		ul.snLinks{
			margin: 0px 0px 0px 0px;
			padding: 0px 0px 0px 0px;
			list-style-type: none;
			overflow: hidden;
			height: 25px;
			float: left;
		}
		
		ul.snLinks li{
			margin: 0px 7px 0px 0px;
			width: 25px;
			height: 25px;
			float: left;
		}
		
		ul.snLinks li a{
			display: block;
			width: 25px;
			height: 25px;
			text-indent: -9999px;
			overflow: hidden;
		}
		
		ul.snLinks li a.lnkFacebook{background: url(../img/icFacebook.gif) 0 0 no-repeat;}
		ul.snLinks li a.lnkTwitter{background: url(../img/icTwitter.gif) 0 0 no-repeat;}
	/* /social networking links */
/* ------------------------------------------------------------------------------------------------ */

/* ------------------------------------------------------------------------------------------------ */
/* content wrappers 
/* ------------------------------------------------------------------------------------------------ */
	#ContentHeaderWrapper{
		width: 940px;	
		margin: 0 auto 19px auto;
	}
	
	#ContentHeaderWrapper{
		overflow:hidden
	}
	
	#ContentHeaderWrapper .Col1{
		width: 671px;
		padding: 0px 0px 0px 0px;
		float: left;
		}
	#ContentHeaderWrapper .Col2{
		width:216px;
		padding: 0px 18px;
		float: right;
		}
	
	#ContentWrapper{
		width: 940px;
		padding: 0px 0px 18px 0px;
		margin: auto;
		height: 300px;
		}
	
	#ContentWrapper[id]{
		height: auto;
		min-height: 300px;
		overflow:hidden
		}


	/* main content */
		#MainContent{
			width: 671px;
			padding: 0px 0px 0px 0px;
			float: left;
			}
	/* /main content */

	/* side content */
		#SideContent{
			width:216px;
			padding: 18px 18px 0px 18px;
			margin: 0px 0px 0px 0px;
			float: right;
			background: #0D0D0D;
			}
	/* /side content */
/* ------------------------------------------------------------------------------------------------ */

/* ------------------------------------------------------------------------------------------------ */
/* footer 
/* ------------------------------------------------------------------------------------------------ */
	#Footer{
		height:110px;
		position:relative;
		background: #1C1A1A;
		font:normal 11px/13px Arial, Helvetica, sans-serif;
		color: #6D6B6B
		}
	
	#FooterNav{
		position:absolute;
		top: 23px;
		right: 0px;
		z-index:1;
	}
	
	#FooterNav ul{
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		list-style-type: none;
	}
	
	#FooterNav li{
		display: block;
		float:left;
		padding: 0px 8px 0px 7px;
		background: url(../img/sepFooterNav.gif) 100% 50% no-repeat;
	}
		
	#FooterNav li.last{
		padding: 0px 0px 0px 7px;
		background: none
	}
	
	#FooterNav li a{
		text-decoration:none;
		color: #6D6B6B
	}
	
	#FooterNav li a:hover{
		color: #FFF;
	}

	
	#Copyright{
		position:absolute;
		top: 23px;
		left: 0px;
		z-index:1;		
		}
		
	#Copyright strong{
		color: #FFF;
		}
/* ------------------------------------------------------------------------------------------------ */



/* ------------------------------------------------------------------------------------------------ */
/* common 
/* ------------------------------------------------------------------------------------------------ */

/* ------------------------------------------------------------------------------------------------ */



/* ------------------------------------------------------------------------------------------------ */
/* form styles 
/* ------------------------------------------------------------------------------------------------ */
	form{margin: 0}
	label{display: block}
	span.chkLabel{}
	fieldset{border: none;margin:0 0 1em 0; padding: 0.5em; border: 1px solid #666}
	input, select{vertical-align: middle}
	textarea{overflow: auto}
	
	.FormGroup{clear: both;overflow: hidden;margin: 0px 0px 10px 0px; height:1%}
	.FormGroupItem{float: left; margin: 0px 5px 0px 0px; overflow: hidden}
	.ChecboxFormGroup{clear: both;overflow: hidden;margin: 0px 0px 10px 0px}
	.ChecboxFormGroupItem{margin: 0px 5px 0px 0px; overflow: hidden; clear:both}
	
	input.txtInput, input.pwdInput, textarea{border: 1px solid #CCC}
	input.btnInput{}
	input.chkInput, input.radioInput{}
	input.fileInput{}
	tt.required{color: #F00; vertical-align:top}
	small.fieldHint{display: block}
/* ------------------------------------------------------------------------------------------------ */

h2.hJoinTheTeam{
	width: 834px;
	height: 65px;
	overflow: hidden;
	margin: 0px auto 34px auto;
	font:normal 82px/65px Arial, Helvetica, sans-serif;
	text-align:center;
	text-transform: uppercase
}

h2.hJoinTheTeam[class]{
	text-align:left;
	text-indent: -9999px;
	background: url(../img/hJoinTheTeam.png) 0 0 no-repeat;
}

.DonationBox{
	width:211px;
	height:293px;
	margin: 0px auto 0px auto;
}

/* ------------------------------------------------------------------------------------------------ */
/* pledge box
/* ------------------------------------------------------------------------------------------------ */
#PledgeBox{
	background: #0D0D0D;
	font:normal 14px/142% Arial, Helvetica, sans-serif;
	margin: 0px 0px 0px 0px;
}

#PledgeBox h2{
	font: normal normal 47px/108% Arial, Helvetica, sans-serif;
	color: #FF0000;
	padding: 16px 18px 17px 18px;
}

#PledgeBox h2 em{
	font-style: normal;
	color: #FFF;
}

#PledgeBox p{
	margin: 0px 0px 0px 0px;
	padding: 0px 18px 20px 18px;
}

#PledgeBox #PledgeFormWrapper{
}

#PledgeFormWrapper{
	background: #F00;
}

#PledgeFormWrapper .notice_error{
	color: #FFF;
	padding: 8px 0px 2px 60px;
}

#PledgeFormWrapper .notice_success{
	color: #FFF;
	padding: 8px 0px 9px 60px;
	overflow: hidden;
}

#PledgeFormWrapper .notice_success .message{
	float: left;
	padding: 2px 10px 0px 0px;
}

#PledgeFormWrapper .loading{
	background: url(../img/ajax-loader.gif) 50px 50% no-repeat;
	padding: 6px 7px 6px 70px;	
	color: #FFF;
	font-weight: bold
}

form.MakeAPledgeForm{
	margin: 0px 0px 0px 0px;
	overflow: hidden;
	padding: 8px 0px 9px 60px;
	height: 1%;
}

form.MakeAPledgeForm input.txtInput{
	margin: 0px 8px 0px 0px;
	border: 1px solid #000;
	float: left;
	padding: 6px 7px 6px 7px;
}

form.MakeAPledgeForm input.Name{width: 188px;}
form.MakeAPledgeForm input.Email{width: 208px;}
form.MakeAPledgeForm input.bgName{background: #FFF url(../img/bgNameBox.gif) 7px 50% no-repeat;}
form.MakeAPledgeForm input.bgEmail{background: #FFF url(../img/bgEmailBox.gif) 7px 50% no-repeat;}

form.MakeAPledgeForm input.txtInput{
	
}

a.btnMakeAPledge{
	display: block;
	width:104px;
	height: 29px;
	overflow: hidden;
	text-indent: -9999px;
	background: url(../img/btnPledgeNow.gif) 0 0 no-repeat;
	float: left
}

/* ------------------------------------------------------------------------------------------------ */

/* ------------------------------------------------------------------------------------------------ */
/* runners
/* ------------------------------------------------------------------------------------------------ */
.Runners{
	margin: 0px 0px 30px 0px;
}

.Runners h3{
	margin: 0px 0px 20px 0px;
}

.Runners .GraphicHeading{
	text-align: center;
	margin: 0px 0px 20px 0px;
}

.Runners ul{
	margin: 0px 0px 20px 0px;
	padding: 0px 0px 0px 0px;
	list-style-type: none;
	font-size:14px;
	line-height:120%;
}

.Runners ul li{
	padding: 0px 0px 3px 0px;
}

.Runners ul li a{
	color: #FFF;
}

.Runners a.btnLearnMore{
	margin: auto;
}


/* ------------------------------------------------------------------------------------------------ */

/* ------------------------------------------------------------------------------------------------ */
/* media content boxes
/* ------------------------------------------------------------------------------------------------ */
.MediaContentBox{
	overflow: hidden;
	background: #000;
	padding: 20px 20px;
	margin: 0px 0px 18px 0px;
	height: 1%;
	background: #0D0D0D;
}

.MediaContentBox h3{
	margin: 0px 0px 18px 0px;
}

.MediaContentBox .TextContent{
	float: left;
	width: 246px;
}

.MediaContentBox .GraphicContent{
	float: right;
	width: 291px;
	height: 178px;
	border: 5px solid #FFF;
}

.MediaContentBox2{
	overflow: hidden;
	background: #000;
	padding: 20px 20px;
	margin: 0px 0px 18px 0px;
	height: 1%;
	background: #0D0D0D;
}

.MediaContentBox2 h3{
	margin: 0px 0px 18px 0px;
}

.MediaContentBox2 .TextContent{
	float: left;
	width: 500px;
}

.MediaContentBox2 .GraphicContent{
	float: right;
	width: 104px;
}
/* ------------------------------------------------------------------------------------------------ */

/* ------------------------------------------------------------------------------------------------ */
/* twitter feeds
/* ------------------------------------------------------------------------------------------------ */
#TwitterFeeds{
	margin: 0px 0px 19px 20px;
}

#TwitterFeeds h3{
	margin: 0px 0px 10px 0px;
}

#TwitterFeeds ul{
	margin: 0px 0px 0px -8px;
	padding: 0px 0px 0px 0px;
	list-style-type: none;
}

#TwitterFeeds ul a{
	color: #FFF;
	font-weight: bold;
}

#TwitterFeeds ul li{
	height: 1%;
	overflow: hidden;
	padding: 11px 8px 11px 8px;
	margin: 0px 0px 8px 0px;
}

#TwitterFeeds ul li.odd{
	background: #1F1F1F;
}

#TwitterFeeds ul li.even{
	background: #2E2E2E;
}

#TwitterFeeds ul li .TFGraphicContent{
	width: 46px;
	height: 46px;
	border: 1px solid #474747;
	margin: 0px 6px 0px 0px;
	float: left;
	background: url(../img/icTwitterFeed.gif) 50% 50% no-repeat;
}

#TwitterFeeds ul li .TFTextContent{
	float: left;
	width:572px;
	line-height:142%;
}

#TwitterFeeds ul li .TFTextContent small{
	font-size: 11px;
	color: #757575
}
/* ------------------------------------------------------------------------------------------------ */

/* ------------------------------------------------------------------------------------------------ */
/* text content box
/* ------------------------------------------------------------------------------------------------ */
.TextContentBox{
	overflow: hidden;
	background: #0D0D0D;
	padding: 20px 20px;
	margin: 0px 0px 18px 0px;
}

.TextContentBox h3{
	margin: 0px 0px 18px 0px;
}
/* ------------------------------------------------------------------------------------------------ */

/* ------------------------------------------------------------------------------------------------ */
/* multiple col content
/* ------------------------------------------------------------------------------------------------ */
.MultipleColContent{
	overflow:hidden
}

.MultipleColContent .Col1{
	width: 325px;
	float:left;
}

.MultipleColContent .Col2{
	width: 325px; 
	float:right;
}


.TextContentBox .MultipleColContent{
	width: 100%
}

.TextContentBox .MultipleColContent .Col1{
	width: 290px;
	margin: 0px 50px 0px 0px;
}

.TextContentBox .MultipleColContent .Col2{
	width: 290px;
}

/* ------------------------------------------------------------------------------------------------ */

.VideoBox{
	width:216px;
	margin: 0px auto 20px auto;
	text-align: center;
}

.VideoBox embed, .VideoBox object{
	display: block;
	margin: 0px 0px 5px 0px;
}

a.btnLearnMore{
	display: block;
	width:104px;
	height: 29px;
	overflow: hidden;
	text-indent: -9999px;
	background: url(../img/btnLearnMore.gif) 0 0 no-repeat;
}

a.btnGoNow{
	display: block;
	width:104px;
	height: 29px;
	overflow: hidden;
	text-indent: -9999px;
	background: url(../img/btnGoNow.gif) 0 0 no-repeat;
}