
/* GENERAL CSS RESET STYLES */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0; 	padding: 0; border: 0; 	outline: 0; }
/* remember to define focus styles! */
/* fix for ff3 outline */
a { outline: none }
/* end fix for ff3 outline */
:focus { outline: 0; }
body { line-height: 12px; color: black; background-color: white; font-size: 12px; font-family: Arial, Helvetica, sans-serif; }
ol, ul { 	list-style: none; }
b{
color:#990000;
font-family:georgia;
}

/* tables still need 'cellspacing="0"' in the markup */
table { border-collapse: collapse; }
caption, th, td { text-align: left; font-weight: normal; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }
/* LINK CSS */
 a {}
 a:link { color: #FFFFFF; text-decoration: none; }  
 a:visited { color: #FFFFFF; text-decoration: none; }  
 a:hover { color: #FFFFFF; text-decoration: underline;  }  
 a:active { color: #FFFFFF; text-decoration: underline; }
/* H1 -> H2 Tags */
 h1 { font-size: 30px; font-weight: normal; }  
 h2 { font-size: 24px; font-weight: normal; }  
 h3 { font-size: 18px; font-weight: normal; }  
 h4 { font-size: 12px;  font-weight: normal; }  
 h5 { font-size: 11px; font-weight: normal; }  
/* end of header styles */
/* INPUT ITEMS TEXT, IE7 HAS Border: 2px all around and PADDING 1px ALL AROUND. FIREFOX DOES NOT HAVE THE LEFT ADN RIGHT PADDING */
input { padding: 0px; margin: 0px; border: 0px; }
textarea { padding: 0px; margin: 0px; border: 0px; }
/* IMAGES MUST HAVE DISPLAY BLOCK TO PREVENT IE6 FROM DISPLAYING A 2-3 PX BUG */
img { display: block; }
/* end of other weird bugs discovered category */
/* END OF RESET STYLES CSS */

/* USEFULL GENERAL CSS CLASSES ALWAYS USED */
.floatLeft { float: left; }
.floatRight { float: right; }
.clear, #pageWrap .clear { clear: both; overflow: hidden; height: 0px; margin: 0px; padding: 0px; }
.noMargins { margin: 0px 0px 0px 0px; }
.noPadding { padding: 0px 0px 0px 0px; }
.noMarginsOrPadding { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; }
/* CLASSES EDITED AT EACH PAGE CREATION  == ACTUAL CSS FILE HERE */

/* smallest size at the top, largest at the bottom */
.size1 {}
.size2 {}
.size3 {}
.size4 {}
.size5 {}
.size6 {}
.size7 {}
.size8 {}
.size9 {}
/* end custom size classes*/

/* Border Style  -> ALL PAGES UNDER THIS 
t
t b
t b l
t b l r
t b l r bl
t b l r bl br
t b l r bl br tl
t b l r bl br tl tr
t b l r bl br tl tr background: none afterwards else lots of troubles and headaches, mofo
*/	

/* ========================= PAGE CSS ========================= */

body { font-size: 12px; line-height: 14px; font-family: Century Gothic, "Arial Narrow" ; background-color: black; color: #999999;}
#pageWrap { width: 900px; margin: 0px auto; padding-top: 0px; background-color: #0a0a0a; margin-bottom: 10px;}
.flashSwf { height: 276px; padding: 0px 15px; margin-bottom: 0px;}
.header { height: 30px; margin: 0px 15px; background-color: #161616; padding-left: 10px; margin-bottom: 20px;}
.header ul li { float: left; margin-left: 31px; padding-left: 9px; background-image: url("./../images/redDot.png"); background-repeat: no-repeat; background-position: center left; padding-top: 7px; padding-bottom: 7px;}
.header ul li.first { margin: 0px;}
.header ul li a { display: block; height: 16px; line-height: 16px;}
.header ul li a.home { background-image: url("./../images/homeOn.png"); background-repeat: no-repeat; background-position: center; width: 38px;}
.header ul li a.home:hover, .header ul li a.home:focus { background-image: url("./../images/homeOff.png"); background-repeat: no-repeat; background-position: center;}
.header ul li a.aboutUs { background-image: url("./../images/aboutUsOn.png"); background-repeat: no-repeat; background-position: center; width: 65px;}
.header ul li a.aboutUs:hover, .header ul li a.aboutUs:focus { background-image: url("./../images/aboutUsOff.png"); background-repeat: no-repeat; background-position: center;}
.header ul li a.causes { background-image: url("./../images/causesOn.png"); background-repeat: no-repeat; background-position: center; width: 51px;}
.header ul li a.causes:hover, .header ul li a.causes:focus { background-image: url("./../images/causesOff.png"); background-repeat: no-repeat; background-position: center;}
.header ul li a.events { background-image: url("./../images/eventsOn.png"); background-repeat: no-repeat; background-position: center; width: 132px;}
.header ul li a.events:hover, .header ul li a.events:focus { background-image: url("./../images/eventsOff.png"); background-repeat: no-repeat; background-position: center;}
.header ul li a.sponsors { background-image: url("./../images/sponsorsOn.png"); background-repeat: no-repeat; background-position: center; width: 70px;}
.header ul li a.sponsors:hover, .header ul li a.sponsors:focus { background-image: url("./../images/sponsorsOff.png"); background-repeat: no-repeat; background-position: center;}
.header ul li a.dspa { background-image: url("./../images/dspaOn.png"); background-repeat: no-repeat; background-position: center; width: 106px;}
.header ul li a.dspa:hover, .header ul li a.dspa:focus { background-image: url("./../images/dspaOff.png"); background-repeat: no-repeat; background-position: center;}
.header ul li a.resourceCenter { background-image: url("./../images/resourceCenterOn.png"); background-repeat: no-repeat; background-position: center; width: 123px;}
.header ul li a.resourceCenter:hover, .header ul li a.resourceCenter:focus { background-image: url("./../images/resourceCenterOff.png"); background-repeat: no-repeat; background-position: center;}



.content { padding: 0px 15px; padding-bottom: 15px; }

.content .events { width: 360px; background-color: #161616; margin-right: 10px; display: inline; margin-bottom: 25px;}
.content .events h1 { margin-bottom: 12px;}
.content .events h1 img { border-bottom: 2px solid black; border-right: 2px solid black;}
.content .events .row { padding: 0px 10px 12px;}	
.content .events .row .floatLeft { margin-right: 6px; display: inline;}
.content .events .row .floatRight { width: 214px;}
.content .events .row .floatRight h2 { color: #FF3300; font-size: 11px;}
.content .events .row .floatRight p { color: #999999; font-size: 11px; line-height: 13px;}
.content .events .row .floatRight a { position: absolute; margin-left: 140px; margin-top: -13px; color: #FF3300; font-size: 10px; text-decoration: none; width: 62px; text-align: right; ;background-image: url("./../images/redDot.pn"); background-repeat: no-repeat; background-position: left 65%; }
.content .events .row .floatRight a:link, .content .events .row .floatRight a:focus, .content .events .row .floatRight a:visited, .content .events .row .floatRight a:active, .content .events .row .floatRight a:hover { color: #FF3300; text-decoration: none;}

.content .doSumthing { background-color: #161616; width: 360px; margin-right: 10px; display: inline; margin-bottom: 25px;} 
.content .doSumthing h1 { margin-bottom: 12px;}
.content .doSumthing h1 img { border-bottom: 2px solid black; border-right: 2px solid black;}
.content .doSumthing div { padding: 0px 10px 22px;}
.content .doSumthing div h2 { color: #FF3300; font-size: 11px; }
.content .doSumthing div p { color: #999999; text-align: ; font-size: 11px; line-height: 13px;}
.content .doSumthing div a { position: absolute; margin-left: 250px; margin-top: -13px; color: #FF3300; font-size: 10px; text-decoration: none; width: 62px; text-align: right; background-image: url("./../images/redDot.pn"); background-repeat: no-repeat; background-position: left 65%;}
.content .doSumthing div a:link, .content .doSumthing div a:visited, .content .doSumthing div a:active { color: #FF3300; text-decoration: none;}
.content .doSumthing div a:hover, .content .doSumthing div a:focus { color: #FF3300; text-decoration: underline;}
.content .doSumthing .row { padding: 0px 10px 15px;}
.content .doSumthing .row .floatRight { width: 214px; padding: 0px;}
.content .doSumthing .row h2 { color: #FF3300; font-size: 11px;}
.content .doSumthing .row  p { color: #999999; font-size: 11px; line-height: 13px;}
.content .doSumthing .row  a { position: absolute; margin-left: 125px; margin-top: -13px; color: #FF3300; font-size: 10px; text-decoration: none; width: 62px; text-align: right; background-image: url("./../images/redDot.pn"); background-repeat: no-repeat; background-position: left 65%; }
.doSumthing h3 {  font-size: 11px; color: #990000;}

.content .events .row .floatRight a:link,  .content .events .row .floatRight a:visited, .content .events .row .floatRight a:active { color: #FF3300; text-decoration: none;}
.content .events .row .floatRight a:focus, .content .events .row .floatRight a:hover { text-decoration: underline; color: #FF3300;}
.events h3 {  font-size: 11px; color: #990000;}


.content .sponsors { margin-bottom: 25px;}
.sponsors a { display: block; margin-top: 21px;}
.sponsors a.first { margin-top: 0px;}
.sponsors .forum, .sponsors .forum:hover, .sponsors .forum:focus, .sponsors .fixit, .sponsors .fixit:hover, .sponsors .fixit:focus, .sponsors .radio, .sponsors .radio:focus, .sponsors .radio:hover  { background-repeat: no-repeat; background-position: center; width: 129px; height: 63px;}
.sponsors .forum { background-image: url("./../images/joinTheForumOn.jpg");}
.sponsors .forum:hover , .sponsors .forum:focus { background-image: url("./../images/joinTheForumOff.jpg");}
.sponsors .fixit { background-image: url("./../images/fixItOn.jpg"); }
.sponsors .fixit:hover, .sponsors .fixit:focus { background-image: url("./../images/fixItOff.jpg");}
.sponsors .radio { background-image: url("./../images/radioOn.jpg");}
.sponsors .radio:hover, .sponsors .radio:focus { background-image: url("./../images/radioOff.jpg");}

.sponsors2 { margin-right: 8px; display: inline; margin-bottom: 5px;}
.sponsors3 { width: 340px; margin-right: 14px; display: inline; margin-bottom: 5px; background-color: #161616;}
.sponsors3 h1 { margin-bottom: 12px;}
.sponsors3 p { padding-right:9px; padding-left:10px; font-size: 12px; color: #999999; margin-bottom: 20px;}
.sponsors3 h3 { padding-right:9px; padding-left:10px; font-size: 11px; color: #990000;}
.sponsors3 a.abs{ color: #FF3300; font-size: 11px; display: block; position: absolute; text-decoration: none; margin-left: 220px; width: 110px; background-position: left 65%; background-repeat: no-repeat; background-image: url("./../images/redDot.pn"); text-align: right; margin-top: -30px;}
.sponsors3 a.abs:link, .sponsors3 a.abs:active, .sponsors3 a.abs:visited { text-decoration: none; color: #FF3300;}
.sponsors3 a.abs:hover, .sponsors3 a.abs:focus { text-decoration: underline; color:#FF3300;}
.sponsors3 ul li { padding-left: 15px; background-image: url("./../images/grayDot.jp"); background-repeat: no-repeat; background-position: left 65%;} 
.sponsors3 ul li a { display: block; font-size: 12px; line-height: 16px; color: #FF3300; text-decoration: none;}
.sponsors3 ul li a:link, .sponsors3 ul li a:visited, .sponsors3 ul li a:active { text-decoration: none; color: #FF3300;}
.sponsors3 ul li a:focus, .sponsors3 ul li a:hover { text-decoration: underline; color: #FF3300;}
.sponsors3 a.floatRight { color: #FF3300; font-size: 11px; display: block; text-decoration: none; margin-right: 10px; width: 82px; cursor: pointer; background-image: url("./../images/redDot.pn"); background-position: left 65%; background-repeat: no-repeat; text-align: right;}
.sponsors3 a.floatRight:link, .sponsors3 a.floatRight:visited, .sponsors3 a.floatRight:active { color: #FF3300; text-decoration: none;}
.sponsors3 a.floatRight:hover, .sponsors3 a.floatRight:focus { text-decoration: underline; color: #FF3300;}

.supporters { width: 340px; margin-bottom: 5px; background-color: #161616;}
.supporters h1 { margin-bottom: 12px;}
.supporters p {  padding-right:9px; padding-left:10px; color: #999999; margin-bottom: 27px;}
.supporters a.floatRight { padding-right:9px; padding-left:10px; color: #FF3300;background-image: url("./../images/redDot.pn"); background-repeat: no-repeat; background-position: left 60%; font-size: 11px; text-align: right;}
.supporters a.floatRight:link, .supporters a.floatRight:visited, .supporters a.floatRight:active { color: #FF3300; text-decoration: none;}
.supporters a.floatRight:hover, .supporters a.floatRight:focus { color: #FF3300; text-decoration: underline;}
.supporters a.one { width: 121px; margin-bottom: 18px; }
.supporters a.two { width: 95px;}
.supporters h3 { padding-right:9px; padding-left:10px; color:#990000; font-size:11px; }
.supporters ul li { padding-left: 15px; background-image: url("./../images/grayDot.jp"); background-repeat: no-repeat; background-position: left 65%;}
.supporters ul li a { display: block; line-height:16px; color: #FF3300; text-decoration: none;}
.supporters ul li a:link, .supporters ul li a:visited, .supporters ul li a:active { text-decoration: none; color: #FF3300;}
.supporters ul li a:hover, .supporters ul li a:focus { color: #FF3300; text-decoration: underline;}

.dspaNigeria, .dspaGhana { margin-right: 15px; display: inline; margin-bottom: 20px;}
.dspaNigeria a { background-image: url("./../images/dspaNigeria.png"); background-repeat: no-repeat; background-position: right center; width: 288px; height: 200px; display: block;}
.dspaNigeria a:hover { background-image: url("./../images/dspaNigeriaOff.png"); background-repeat: no-repeat; background-position: right center; }
.dspaGhana a { background-image: url("./../images/dspaGhana.png"); background-repeat: no-repeat; background-position: right center; width: 288px; height: 200px; display: block;}
.dspaGhana a:hover { background-image: url("./../images/dspaGhanaOff.png"); background-repeat: no-repeat; background-position: right center; display: block;}

.moreLinks { background-color: #161616; width: 260px; padding-left: 4px; margin-bottom: 15px; padding-bottom: 5px;}
.moreLinks h1 { margin-bottom: 12px;}
.moreLinks ul li { padding-left: 15px; background-image: url("./../images/grayDot.jp"); background-position: left 65%; background-repeat: no-repeat;}
.moreLinks ul li a { line-height: 15px; font-size: 12px; color: #FF3300; text-decoration: none;}
.moreLinks ul li a:link, .moreLinks ul li a:visited, .moreLinks ul li a:active { color: #FF3300; text-decoration: none;}
.moreLinks ul li a:focus, .moreLinks ul li a:hover { color: #FF3300; text-decoration: underline;}

.values {  width: 870px; background-color: #161616;}
.values h1 { color:#FF3300; font-size:11px; font-weight: bold; margin-bottom: 20px;}
.values div div { float: left; display: inline; margin-bottom: 10px; margin-right: 6px; margin-left:10px;}
.values div div a{ display: block:}
.values div div p { font-size: 11px;}
.values h3 {  font-size: 11px; color: #990000;}
.footer { }
.footer p { text-align: center; font-size: 11px;} 
.footer p.bottom { padding-bottom: 20px;}
.footer p a { color: #FF3300; text-decoration: none;}
.footer p a:link, .footer p a:visited, .footer p a:active { color: #FF3300; text-decoration: none;}
.footer p a:hover, .footer p a:focus { text-decoration: underline; color: #FF3300;}

/* ==================== Subpage CSS ================== */

.subPage .content h1 { font-size: 28px; line-height: 34px; font-weight: bold; color: #FF3300;}
.subPage .content h2 { font-size: 24px; line-height: 30px; font-weight: bold; color: #FF3300;}
.subPage .content h3 { font-size: 20px; line-height: 26px; font-weight: bold; color: #FF3300;}
.subPage .content h4 { font-size: 16px; line-height: 22px; font-weight: bold; color: #FF3300;}
.subPage .content p { font-size: 12px; line-height: 16px; font-weight: normal; color: #999999; margin-bottom: 15px;}
.subPage .content a { font-size: 12px; line-height: 16px; font-weight: normal; color: #FF3300;}
.subPage .content a:link, .subPage .content a:active, .subPage .content a:visited { color: #FF3300; text-decoration: none;}
.subPage .content a:hover, .subPage .content a:focus { text-decoration: underline; color: #FF3300;}
.subPage .content ul { list-style-type: disc; list-style-position: inside; margin-bottom: 10px;}
.subPage .content ol { list-style-type: decimal; list-style-position: inside; margin-bottom: 10px}
.subPage .content ul li { padding-left: 20px; font-size: 12px; line-height: 16px;}
.subPage .content ol li { padding-left: 20px; font-size: 12px; line-height: 16px;}
.subPage .content table { border-collapse: separate;}
.subPage .content table tr td { border: 1px dotted #222222; padding: 10px;}

