@import url(side-submenu.css);
@import url(main-menu.css);
@import url(header-submenu.css);

div .skip {display:none;}

body {
	margin: 0px;
	background-color: #FCF4E4;
	text-align: center;
	background:url("http://www.afrikids.org/images/content-area-background.png") repeat-y 50% #FCF4E4;
}

.itemBorder { border: 1px}

div#container {
	margin:auto; 
	text-align:left;
	width:995px;
	padding: 0px 0px 0px 0px; 
	font-size: 0.8em;
	line-height: 1em;
}
	
div#header {
	background-color:#EEDBBE; 
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	height: 160px;
	
}

div#contentarea { 
	float:left; 
	margin:0px 30px 0px 30px; 
	padding: 0px 0px 0px 0px;
	width:580px; 
}

div#content { 
	float:left; 
	width:585px; 
}

div#breadcrumbs{ 
	padding-top:25px; 
	padding-bottom: 20px; 
}

div#rightPanel {
	float:left;  
	width:150px;
}
	
div#rightPanelBox { 
	padding: 25px 0px 0px 10px;  
	text-align:center;
}

div .rightPanelBoxEntry { 
	padding: 0px 0px 10px 0px;
}


div#leftPanel {
	float:left; 
	width:190px; 
	padding: 0px 10px 0px 0px;
}

div#leftPanelBox { 
	margin-top: 0px; 
	padding: 25px 0px 0px 10px;  
	text-align:center;
}

div .leftPanelBoxEntry { 
	padding: 0px 0px 10px 0px;
}

div#searchBox {
	display: block;
    float:left;
	padding:10px 10px 10px 10px;
	margin:-35px 0px 10px 5px;
	_margin:-35px 0px 30px 2px;
	border: 1px solid #C3AE93; 
	text-align:left;
	background-color: #FAECCF;
	font-family: verdana; 
	font-size: 0.9em;
	line-height: 1.4em;
	height: 100%;
	width: 150px;
}

/* hack for firefox - seems to need bigger margin when side menu is displayed... */
div#searchBox-with-menu {
	display: block;
    float:left;
	padding:10px 10px 10px 10px;
	margin:25px 0px 10px 5px;
	_margin:-35px 0px 30px 2px;
	border: 1px solid #C3AE93; 
	text-align:left;
	background-color: #FAECCF;
	font-family: verdana; 
	font-size: 0.9em;
	line-height: 1.4em;
	height: 100%;
	width: 150px;
}

div#eventsBox {
	display: block;
    float:left;
	padding:10px 10px 20px 10px;
	margin:0px 0px 10px 5px;
	_margin:0px 0px 10px 2px;
	border: 1px solid #C3AE93; 
	text-align:left;
	background-color: #FAECCF;
	font-family: verdana; 
	font-size: 0.9em;
	line-height: 1.4em;
	height: 100%;
	width: 150px;
}

.articleBody { 
	color: black; 
	font-family: verdana; 
	font-size: 1em;
	line-height: 1.4em;
	padding-bottom: 20px;
}
		
.introductionBody { 
	color: black; 
	font-family: verdana; 
	font-size: 1em;
	line-height: 1.4em;
	padding-bottom: 5px;
	border-bottom: 1px solid #5B2B06; 
}

.caption { 
	color: black; 
	font-family: verdana; 
	font-size: 0.85em;
	line-height: 1.2em;
	font-style: italic;
	color: #000066;
	text-align: left;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
}




h1 {    
	font-family: verdana; 
	color: #000066; 
	font-size: 1.2em;
	font-weight: bold; 
	font-style: normal; 
	font-variant: small-caps;
   	border-bottom: 1px solid #5B2B06; 
	padding-bottom: 5px;
	margin-bottom: 20px;
}

h2 {    
	font-family: verdana; 
	color: #000066; 
	font-size: 1.05em;
	font-weight: bold; 
	font-style: normal; 
	border-bottom: 1px solid #5B2B06; 
	padding-bottom: 5px;
	margin-bottom: 10px;
}		
	
h3 {    
	font-family: verdana; 
	color: #000066; 
	font-size: 1em;
	font-weight: bold; 
	font-style: normal; 
	padding-bottom: 1px;
	margin-bottom: 0px;
	text-decoration: underline;
}		

p {
	padding-top: 0px;
	padding-bottom: 0px;
	margin-top: 0px;
	text-align: left;
}

a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-style: normal;
	font-weight: normal;
	border: thin none;
	color: #000066;
	text-decoration: underline;
}

a:visited {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-style: normal;
	font-weight: normal;
	border: thin none;
	color: #000066;
	text-decoration: underline;
}

a:hover {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-style: normal;
	font-weight: normal;
	border: thin none;
	color: #000066;
	text-decoration: none;
}

img {
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
  
  border: none;
}

ul {
	list-style-type: disc;
	list-style-position:outside;
}

ul li {
	padding-bottom: 5px;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}

legend {
	color: black;
}

.articlePhotosPanelLeft {
  	float: left;
	padding-top: 10px;
	padding-bottom: 0px;
	padding-left: 5px;
	padding-right: 5px;
	margin-bottom:20px;
	border: 1px solid #C3AE93; 
	margin-left: 0px;
	margin-right: 20px;
	width: 220px;
	text-align:center;
	background-color: #FCF5E5;
}

.articlePhotosPanelRight {
  	float: right;
	padding-top: 10px;
	padding-bottom: 0px;
	padding-left: 5px;
	padding-right: 5px;
	margin-bottom:20px;
	border: 1px solid #C3AE93; 
	margin-left: 20px;
	width: 220px;
	text-align:center;
	background-color: #FCF5E5;
}

.updatesBox {
	display: block;
    float:left;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	padding-right: 20px;
	margin-top:5px;
	margin-bottom:30px;
	background-color: #FCF5E5;
	font-family: verdana; 
	font-size: 1em;
	border: 1px solid #C3AE93; 
}	

.update {
	text-align:left;
	border-bottom: 1px solid #C3AE93; 
	padding-top: 10px;
	padding-bottom: 10px;
}

.philosophyBox {
	display: block;
    float:left;
	padding-top: 10px;
	padding-bottom: 10px;
	text-align:left;
	background-color: #010066;
	color: white; 
	font-family: verdana; 
	font-size: 1em;
	line-height: 1.4em;
	width: 100%;
}

.philosophyBoxHeader {
	display: block;
    text-align:left;
	padding-top: 5px;
	padding-bottom: 5px;
	background:url("http://www.afrikids.org/images/box-header.png") repeat-y 50% #FCF4E4;
	color: #5B2B06; 
	font-family: verdana; 
	font-size: 1em;
	line-height: 1.4em;
	width: 100%;
}

.homepagePanelBox {
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	padding-right: 20px;
	margin-top:10px;
	margin-bottom:10px;
	border: 1px solid #C3AE93; 
	text-align:left;
	background-color: #FCF5E5;
	font-family: verdana; 
	font-size: 1em;
	line-height: 1.4em;
	height: 100%;
}

.formBox {
	display: block;
    float:left;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	padding-right: 10px;
	margin-top:10px;
	margin-bottom:20px;
	border: 1px solid #C3AE93; 
	text-align:left;
	background-color: #FCF5E5;
	font-family: verdana; 
	font-size: 1em;
	line-height: 1.4em;
	height: 100%;
}

.formBox .inputCell {
    text-align:right;
}

.formBox .messageCell {
    text-align:left;
    color:#990000;
}

.adminBox {
	padding-top: 1px;
	padding-bottom: 1px;
	padding-left: 10px;
	padding-right: 10px;
	margin-top:5px;
	margin-bottom:5px;
	border: 1px solid #C3AE93; 
	width: 40%;
	text-align:left;
	background-color: #FCF5E5;
}

.adminBoxRight {
	padding-top: 1px;
	padding-bottom: 1px;
	padding-left: 10px;
	padding-right: 10px;
	margin-top:5px;
	margin-bottom:5px;
	border: 1px solid #C3AE93; 
	width: 40%;
	text-align:left;
	float:right;
	background-color: #FCF5E5;
}

.adminBoxPhotos {
	padding-top: 1px;
	padding-bottom: 1px;
	padding-left: 10px;
	padding-right: 10px;
	margin-top:5px;
	margin-bottom:5px;
	border: 1px solid #C3AE93; 
	width: 90%;
	text-align:left;
	background-color: #FCF5E5;
}
	
.quoteBox {
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	padding-right: 10px;
	margin-top:20px;
	margin-bottom:20px;
	border: 1px solid #C3AE93; 
	margin-left: 10%;
	width: 75%;
	text-align:center;
	background-color: #FCF5E5;
}	

.homepageQuoteBox {
    padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	padding-right: 20px;
	margin-left: 5px;
	margin-bottom:10px;
	border: 1px solid #C3AE93; 
	width: 93%;
	text-align:center;
	background-color: #FCF5E5;
}

blockquote{ color: #000066; 
	font-family: verdana; 
	font-style: italic;
	font-weight: normal;
	line-height: 1.4em;
	font-size: 1em;
}

.quoteFrom{ color: #000066; 
	font-family: verdana; 
	font-weight: bold;
	font-size: 0.9em;
	padding-top: 10px;
}


.profilePhotoFloatRight {
  	float: right;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 5px;
	padding-right: 0px;
	margin-bottom:20px;
	margin-left: 20px;
	width: 150px;
	text-align:right;
}

.photoFloatRight {
  	float: right;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 5px;
	padding-right: 0px;
	margin-bottom:20px;
	margin-left: 20px;
	width: 250px;
	text-align:right;
}

.photoFloatLeft {
  	float: left;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	padding-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
	margin-right: 20px;
}

.pageSection {
  	float: left;
    padding-top: 10px;
	padding-bottom: 10px;
	padding-right: 0px;
	width: 100%;
}

.staffMember {
	float: left;
  	padding-top: 10px;
	padding-bottom: 10px;
	padding-right: 0px;
	border-top: 1px solid #5B2B06; 
	width: 100%;
	font-family: verdana; 
	line-height: 1.4em;
	font-size: 1em;
}

.staffMemberHeader {
	padding-bottom: 2px;
	padding-left: 10px;
	margin-bottom:10px;
	border: 1px solid #C3AE93; 
	background-color: #FCF5E5;
	width:395px;
}

.newsletters {
	padding-top: 30px;
	padding-bottom: 10px;
	padding-right: 0px;
	width: 100%;
	font-family: verdana; 
	line-height: 1.4em;
	font-size: 1em;
}

.newsletterImage {
  	float: right;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 5px;
	padding-right: 0px;
	margin-bottom:20px;
	margin-left: 20px;
	width: 300px;
	text-align:center;
}


.newsletter {
	padding-top: 10px;
	padding-bottom: 10px;
	padding-right: 0px;
	font-family: verdana; 
	border-bottom: 1px solid #5B2B06; 
	line-height: 1.4em;
	font-size: 1em;
}

.newsletterHeader {
 	    padding-bottom: 2px;
		padding-left: 10px;
		margin-bottom:10px;
		border: 1px solid #C3AE93; 
		background-color: #FCF5E5;
		width:200px;
}

.galleryItem {
	  	padding-top: 0px;
		padding-bottom: 10px;
		padding-right: 0px;
		width: 100%;
		font-family: verdana; 
		line-height: 1.4em;
		font-size: 1em;
		text-align:center;
}


.galleryItemInfoBox {
		padding-bottom: 2px;
		padding-left: 10px;
		margin-bottom:10px;
		margin-top: 0px;
		border: none; 
		background-color: #FCF5E5;
		text-align: left;
	    font-size:11px;
		border: 1px solid #C3AE93; 
		min-height: 140px;
}

.galleryItemsTable {
		border:1px; 
        padding: 5px;
		width: 100%;
		border: 1px solid #C3AE93; 
		background-color: #FCF5E5;
}

.galleryItemsTable td {
		padding: 10px;
		border:1px; 
        border-color: #C3AE93;
        border-style: solid;
		vertical-align: top;
		text-align: center;
		background-color: white;
}

.galleryItemsTable td table td {
		border:none;
		text-align: center; 
}

.pageNumbers {
        padding-bottom: 20px;
		padding-top: 20px; 
		font-family: verdana; 
		font-size: 9pt;
}


.publicityItem {
	  	float: left;
  		padding-top: 10px;
		padding-bottom: 10px;
		padding-right: 0px;
		border-bottom: 1px solid #5B2B06; 
		width: 100%;
		font-family: verdana; 
		line-height: 1.4em;
		font-size: 1em;
}

.publicityItemInfoBox {
   		float: right;
	  	padding-bottom: 2px;
		padding-left: 10px;
		margin-left:10px;
		border: 1px solid #C3AE93; 
		background-color: #FCF5E5;
		width:150px;
}

.videoBox {
   		float: left;
	  	padding-bottom: 2px;
		padding-top: 5px;
		padding-left: 10px;
		padding-right: 10px;
		margin-left:0px;
		margin-right:10px;
		border: 1px solid #C3AE93; 
		background-color: #FCF5E5;
		width:200px;
}

.newsItem {
	  	float: left;
  		padding-top: 30px;
		padding-bottom: 10px;
		padding-right: 0px;
		border-bottom: 1px solid #5B2B06; 
		width: 100%;
		font-family: verdana; 
		line-height: 1.4em;
		font-size: 1em;
}

.newsItemImageBox {
   		float: right;
	  	padding-bottom: 2px;
		padding-left:20px;
		margin-bottom: 30px;
		border: 0px; 
		width:100px;
}

.positionCenter {
   text-align: center;
}

.positionCenterBlack {
   text-align: center;
   background-color: black;
}

.spacer{
   padding-bottom: 10px;
}


.adminHeader{
   padding: 10px;
   border: 1px solid #C3AE93; 
   margin-bottom: 20px;
   background-color: #FCF5E5;
   font-family: verdana; 
   line-height: 1.4em;
   font-size: 1em;
}

hr {
	height:1px; 
    border:0px; 
    color: #5B2B06; 
	background-color: #000066; 
	padding-top: 0px;
	padding-bottom: 0px;
	margin-top: 2px;
	margin-bottom: 2px;
}
	 
.whiteTableCell {
	background-color: white;
	border:1px; 
	border-color: #C3AE93; 
  	border-style: solid;
}	 
 

.captionText { color: black; 
		font-family: verdana; 
		font-size: 8pt;
		font-style: italic;
		color: #000066;
		}

.bodyText { color: black; 
		font-family: verdana; 
		font-size: 9pt;
		line-height: 14pt
}
		
.beigeTextBold { color: #A87736; 
		font-family: verdana; 
		font-weight: bold; 
		font-size: 0.9em;
}
		
.beigeTextBigBold { color: #A87736; 
		font-family: verdana; 
		font-weight: bold; 
		font-size: 1.1em;
		}
		
	
.bodyTextBold { color: black; 
		font-family: verdana; 
		font-weight: bold; 
		font-size: 1em}
		
.bodyTextItalic { color: black; 
		font-family: verdana; 
		font-style: italic;
		font-size: 1em;
		}

.whiteTextBold { color: white; 
		font-family: verdana; 
		font-weight: bold; 
		font-size: 9pt}
		
.whiteText { color: white; 
		font-family: verdana; 
		font-weight: normal; 
		font-size: 9pt}
		
.blueItalic{ color: #000066; 
		font-family: times; 
		font-style: italic;
		font-weight: normal;
		font-size: 11pt;
		}
		
.blueBold{ color: #000066; 
		font-family: verdana; 
		font-weight: bold;
		font-size: 9pt;
		}
		
.blueText{ color: #000066; 
		font-family: verdana; 
		font-weight: bold;
		font-size: 9pt;
		}
		
.errorMessage{ color: #990000; 
		font-family: verdana; 
		font-weight: bold;
		font-size: 1em;
		}
		
.redTextNotBold{ color: #990000; 
		font-family: verdana; 
		font-size: 9pt;
		}

.blueTextNotBold{ color: #000066; 
		font-family: verdana; 
		font-size: 9pt;
		}		

.message{ 
	font-family: verdana; 
	color: #000066; 
	font-family: verdana;  
	font-size: 9pt; 
	font-weight: bold; 
	font-style: normal; 
}



//tooltips
acronym{
    color: black; 
	font-family: verdana; 
	font-size: 0.8em;
	line-height: 1.4em;
    border-bottom:2px dotted #000066;
	cursor:pointer; 
	  }
	 
.tooltip{
    color: black; 
	font-family: verdana; 
	font-size: 1em;
	line-height: 1.4em;
    border-bottom:2px dotted #000066;
	cursor:pointer;
}	  
	  
.eventsTable {
  background: #FAECCF;
  border-width: 1px;
  border-style: solid;
  border-color: #ccc #888 #555 #bbb;
}