/*xmas top section*/
#top {

position:relative;

 margin:10px auto;
text-align:center;
background-color:white;
padding:10px;
background-image:url(graphic/tile.jpg);
background-repeat:repeat-x;

  min-width: 820px;/*to avoid pic sliding down*/
}

	body{background-image:url(images/tile.jpg);}
	
	.paratop p {
	text-align:left;
	margin:0;}
	
.shout {
color:red;
font-weight:bold;}


#xmastop .shopheader {font-size:2em;
color:#560EAD;
text-align:center;
background-color:;}

#xmastop
{text-align:center;

}
#logobox {padding-top:20px;
padding-left:30px;}

#logobox h1 {position:absolute;
	top:40px; left:15px;
	z-index:-10;
	}
	
#xmastop #topmenu {font-weight:;}
#xmastop #topmenu a:hover {font-color:green;}


#main_nav ul{
float:left;
margin:0 0 0 30px;
padding:;
}


#topmenu {margin-top:10px;}
#logobox  #topmenu li
{display:inline;
padding:10px 10px 10px 0;

}



#main_nav ul {list-style-type:none;

float:left;
padding:0;
width:100%;
margin-bottom:1em;
margin-top:1em;
}

#main_nav li {float:left;
min-width:8em;

text-align:center;
position:relative;
margin-right:8px;
border:red groove 3px;
border-radius:20px;
-moz-border-radius:20px;
-webkit-border-radius:20px;
}

#main_nav li a {display:block;
background-color:#560EAD;
color:yellow;
padding:8px;
font-weight:bold;
text-decoration:none;
font-size:1.3em;

border-radius:20px;
-moz-border-radius:20px;
-webkit-border-radius:20px;
}

#main_nav li a:visited {

background-color:#560EAD;
color:yellow;
}

#main_nav li a:hover {background-color:green;
color:yellow;}




#main_nav ul ul {display:none;}

#main_nav ul ul li {float:left;
position:relative;
top:-3px;}




#main_nav ul li:hover ul, #main_nav ul li a:hover ul {display:block;
position:absolute;
z-index:10;
left:10px;
text-align:left;
float:left;
}

#main_nav ul li:hover ul ul, #main_nav  ul li a:hover ul ul {display:none;} /*hide subsubmenus when subs floated*/

#main_nav ul ul li:hover ul , #main_nav  ul ul li a:hover ul {display:block;
left:99%;
top:0;

}/*shown when menu item hovered*/

#main_nav ul {border:none;}


#main_nav ul ul li {float:left;
}

#main_nav ul ul ul {


}

#main_nav ul ul li a {width:8em;}



#main_nav li#donate {

border-radius:20px;
-moz-border-radius:20px;
-webkit-border-radius:20px;
background-color:red;
}

#main_nav li#donate a {background-color:red;
color:white;
border-radius:20px;
-moz-border-radius:20px;
-webkit-border-radius:20px;
}

#main_nav li#donate a:visited {
background-color:red;
color:white;
}
#main_nav li#donate a:hover {background-color:green;
color:yellow;
}





		/*img.pics {float:left;

		border:0px;

		margin:0;}



#top_pics {

position:relative;   



float:left;

margin-right:20px;

}




#top_pics img {

float:left;

margin:0;

border:0;

}



	#logo {

		float:right;

		position:relative;

		right:20px;

		top:20px;

    background-image:url(graphic/top/slice.jpg);

		}

		

		#logo img {background-color:blue;

			width:250px;

			height:150px;}	



		#topmenu ul {

	position:relative;

	width:270px;}

	

	#topmenu ul li {

	display:inline;

	margin-right:5px;}	



	#topmenu  {

	clear:right;

	float:right;

		position:relative;

		right:15px;

		top:30px;

	}*/

/*end xmas  top section might keep nav*/


/*ADDING A DIV WITH ID to each page as I do the include pasting - after section id & before container

home/index - #

#pgabout
		#pghundred
		#pgorigins

		#pgaims

		#pgpeople

		#pgcontact
		#pgfaq
		

		

#pgregion
		#pgcosts
		
		#pged

		#pgrainforest

		#pghiv

		#pgbatwa

		#pggorillas







#pgactivities

		#pgsscf

		#pgstudents

		#pghospital

		#pg

		

#pghelp
		#pgsearch
		#pgshoponline

		#pgebay
		#pgfundraise
		#pgclearout
		#pgspread

		#pgdonate



					#pgggiftaid1

					#pgggiftaid2

					#pgggiftaid3
		
	#pgnews
				#pgsupporters

#pgoops

#pgppthank

#pgppcancel

#pgthankyou


#pgsitemap (a bit superfluous as it is in its own 'section')



#footnote

.wideside

.slimside
.imgbox
*/



 /* structure

 container

	top

		topmenu

		

	mainwrapper

		nav

		content

	footer	

	each page has an id div depending on section, unique ones for other pages

*/	

		/*defaults, zero out margins etc*/



    html, body, div, ul, li {margin:0; padding:0; border:0px;}



    body {font-family: verdana, ariel, helvetica, sans-serif;

	text-align:center;} 



    h1, h2, h3, h4, h6 {margin:0; padding:0; border:0; font-family:verdana, ariel, helvetica, sans-serif;}



 th, td, li, dd, dt, dl, ul, ol, blockquote, q, acronym, abbr, a, input, select, textarea {
 	text-indent:0; margin:0; padding:0; border:0; font-family:verdana, ariel, helvetica, sans-serif;}



    img {border:none;}

    table {margin:0; padding:0; border:none;}

    form {margin:0; padding:0;}

    label {cursor:pointer;}

#content div {position:relative;
overflow:auto;
}

   p {margin-top:0;
line-height:1.3;
   margin-bottom:10px;}

.clear {clear:left;

clear:right;

}

#innercontent ul , #innercontent ol{
padding:5px 0 5px 20px;

}

#innercontent ul li ul {
padding-bottom:0px;}

a {
text-decoration:none;
font-weight:bold;
color:blue;
}

a:hover , h3 a:hover {
text-decoration:underline; 
color:green;
}

a:visited {
color:blue;
font-weight:normal;}

    /**/   /**/

	  body {

	  position:relative;

	  background-image:url(graphic/tile.jpg);

        text-align:center;

		font-family:verdana, ariel, helvetica, sans-serif;

		font-size:12px;

	}

	

		

h1 {clear:both;

font-size:1.5em;

font-weight:bold;

padding:5px;

text-align:center;

color:#560EAD;}




h2 {

font-size:1.3em;

color:#666699;

padding:5px;


}

h3 {
font-size:1.1em;

color:;

padding:5px;
}


strong.colour {color:#E60066;}

.blockright h2 {font-size:1.1em;
text-align:center;}


.floatleft {

float:left;

margin-right:10px;

margin-bottom:10px;}



.floatright {

float:right;

margin-left:10px;

margin-bottom:10px;}



.centred {
width:90%;
text-align:center;

margin-left:auto;

margin-right:auto;

}

.centred  form {margin:10px auto;}


.centred img {margin-left:auto;

margin-right:auto;}

#container  {width:790px;}/*for silly browsers*/		

#container {

position:relative;

overflow:hidden;

  width: 90%;

  max-width: 1000px;

  min-width: 790px;

  margin: 0 auto 10px auto;

  padding: 0;

  text-align:left;

background-color:white;

position:relative;

    background-image:url(graphic/top/slice.jpg);

	    background-repeat:repeat-x;

		box-shadow:10px 10px 5px grey;
}




	

		


	#mainwrapper {clear:both;

	width:100%;

	background-color:white;

	overflow:hidden;}

	

	#content {  float: right; /* switch this to left and below to right to change the column locations */

		  position:relative;

		  overflow:hidden;



margin-left:0px;

padding-left:210px;


	}


	.sidebar {

  width:200px;

margin-left:-200px;

 position:relative;

left:200px;

  float: left; /* switch this to right and above to left to change the column locations */


} 

	
	.sidebar div {

	position:relative;

}

	

	/*content*/

	

	#breadcrumb {position:relative;

	background-color:silver;

	padding:5px 10px;

	}

	

#content #breadcrumb ul {
height:1.5em;

text-align:left;

text-decoration:none;

}


#breadcrumb li {
display:inline;
font-size:0.8em;

margin:auto 2px;

}	



#breadcrumb li a {
margin:auto;}



#breadcrumb a.current {font-weight:bold;

text-decoration:none;

font-size:110%;}



#innercontent {

	padding:10px 20px;

position:relative;

overflow:hidden;

	}

	


	

	#nav a {text-decoration:none;

font-size:1.05em;

font-family:verdana, ariel, helvetica, sans-serif;

background-color:white;

display:block;

position:relative;

width:100%;

padding:5px;

border:black solid 1px;

color:purple;

}





#container #mainwrapper #nav a:hover {background-color:purple;

color:white;

}



#nav ul ul a {

font-size:0.9em;

}




#nav ul {width:100%;


font-weight:bold;

list-style-type:none;

position:relative;

}



#nav li {position:relative;

float:left;

width:100%;}


#nav ul ul {display:none;}


/*display sub-submenus as pop-out when submenu hovered ....*/

#nav ul li:hover ul {

display:block;

position:absolute;

top:0px;

left:175px;

z-index:10;}


/* ...but not in current section, already visible*/

#aboutus #aboutlinks li:hover ul, #region #regionlinks li:hover ul, #whatwedo #whatlinks li:hover ul, #howtohelp #howlinks li:hover ul, #newsresources #newslinks li:hover ul , #sitemap #sitelinks li:hover ul, #aboutus #navabout  li:hover ul ul, #whatwedo #navwhat  li:hover ul ul, 
#region #navregion li:hover ul ul, #howtohelp #navhow  li:hover ul ul, #newsresources #navnews li:hover ul ul {
position:relative;

display:block;

left:0px;
}



#nav li:hover ul ul {display:none;}



#nav li:hover ul li:hover ul {display:block;

z-index:20;}



.arrows {font-weight:bold;

    float:right;

    margin:0 6px;

}

	
/*style current section depending on div id #aboutus etc applied to mainsection*/

	

#aboutus #subabout, #region #subregion, #whatwedo #subwhat, #howtohelp #subhow, #newsresources #subnews 
{position:relative;

display:block;

}


#aboutus #navabout a.topnav .arrows,  #region #navregion a.topnav .arrows, #whatwedo #navwhat a.topnav .arrows, #howtohelp #navhow a.topnav .arrows, #newsresources #navnews a.topnav .arrows {display:none;}



/*sub-submenus in current section*/

#aboutus #subabout ul, #region #subregion ul, #whatwedo #subwhat ul, #howtohelp #subhow ul, #newsresources #subnews ul {position:relative;

display:block;

padding:0px;


}


/*sub-submenu when hovered*/


#aboutus #nav li:hover #subabout, #region #nav li:hover #subregion,  #whatwedo #nav li:hover #subwhat, #howtohelp #nav li:hover #subhow, #newsresources #nav li:hover #subnews {position:relative;

left:0px;

display:block;}



/*links in current section*/



#aboutus #aboutlinks a, #region #regionlinks a, #whatwedo #whatlinks a, #howtohelp #howlinks a, #newsresources #newslinks a , #sitemap #sitelinks a{

text-indent:0px;

border-bottom:none; border-top:none;

border:black solid 1px;

background-color:silver;

}		




#aboutus #subabout ul a, #region #subregion a, #whatwedo #subwhat a, #howtohelp #subhow ul a, #newsresources #subnews a {/*style sub-sub menu links (when hovered, invisible otherwise see below)*/

border:black solid 1px;}





/*footer*/

#footer {

clear:both;


width:100%;

background-color:lavender;

margin:0 auto;

border-top:dashed 1px #E60066;

}



#footer ul {margin:0 auto;

text-align:center;

padding:10px;

}


#footer ul li {display:inline;

margin:5px;

}

	

/*footer thing as hc*/


#container {

min-height:100%;

position:relative;

}



#mainwrapper {

padding-bottom:4em; /*height of footer*/

}



#footer{

position:absolute;

bottom:0;

height:4em /*same as padding bottom on mainwrapper*/

}
	

	a:hover {color:red;}

	#breadcrumb a.current {color:purple;

	font-weight:bold;}

	a.blocklink {display:block;}

	

	strong.ch-object, strong.colour {color:#E60066;}

	

	#objects ul  {list-style-type:none;}

	

	#objects ul li {margin-bottom:1em;}

	
	

	.address p {margin:0 0 0 26px;}

	.address {padding:20px;}

	

	#contactform input, #contactform textarea {

	padding:5px;

	border:1px black solid;

	margin:10px;}

	

	#webdesign, #validate {clear:left;

	float:left;}

	

	#aboutus #aboutlinks .arrows {display:none;}

	

	/**donate page**/

	#giftaid {

	width:90%;

	border:red solid 3px;

	padding:1em;

	}

	

	/*home page*/

	div #footnote {font-size:0.8em;

float:left;

margin:10px;

}



#intro a.noline {text-decoration:none;

color:black;

font-size:0.8em;}



#intro a:hover.noline {text-decoration:none;

color:red;}

		

/*see styling for newsbox*/

div.feedburnerFeedBlock  .feedtitle{ 
background-color:white;
padding:10px;
border:red solid 1px;
}

div.feedBurnerFeedBlock p.feedTitle a{ 

font-weight:bold;

color:purple;

font-size:1.1em;

}



#innercontent div.feedburnerFeedBlock ul li span.headline { 

font-weight:bold; 

display:block; 

margin:12px 0 5 0;

color:black;

font-size:0.9em;

}





div.feedburnerFeedBlock ul { 

margin-left:0; 

padding-left:0; 

list-style-type: none 

}



#intro a {font-weight:bold;

color:purple;}



#intro a:hover {font-weight:bold;

color:#e60066;}



#newsbox {width:200px;

height:auto;

overflow:auto;

float:right;

border:purple solid 2px;

background-color:#ddd; 

padding:2px 5px;

margin:0 0 5 5;}



.box {clear:both;

width:95%;

padding:10px;

margin:10px auto;

border:solid red 2px;}



#homepage h1 {

border:dotted #e60066 2px;

margin-bottom:1em;

color:purple;

background-color:lavender;

}



/*took this donatebutt stuff out of php file*/

.sidebar #donatebutt {

position:relative;

margin:0.2em auto;

font-family: Verdana, Arial, Helvetica, sans-serif; 

font-size:1.2em; 

text-align:center;

font-weight:bold;



}



.sidebar #donatebutt a {



text-decoration:none;

border:6px purple outset;

width:110px;

height:60px;

margin:auto;

padding:10px;

background-color:#C0C0FF;

}





#donatebutt a:hover {

color:red;

font-weight:bold;

}


#donatebutt a:focus {border:6px purple inset;}

/*end silly butt*/


.buyat  img{

display:block;

}



.centred img {display:block;}



.piggy a {color:purple;}


.buyat a {color:red}

div .buyat {border:outset 4px red;

width:60%;

padding:5px;

margin:1em auto;}



.sidebar a:hover {color:green;}



td {padding:5px;}

input.formbutton {padding:5px;

font-size:0.9em;

border:outset black 3px;

}

.red {color:red;}


#sitemap #content ul div {

height:22em;

width:35%;

float:left;

margin:0.5em;

padding:1em 2em;

border:dotted purple 2px;

}
#sitemap #content #navabout_map, #sitemap #content #navwhat_map {
height:15em;
}

#sitemap #content #navregion_map, #sitemap #content #navhow_map {
height:22em;
}

#sitemap #content #navnews_map, #sitemap #content #other_map {
height:7em;
}

#sitemap #content .topnav {font-size:110%;

font-weight:bold;

}


#sitemap ul.subsubmenu {margin-left:15px;}

#sitemap #content  li  ul {margin-bottom:2px;}


.boxwrap1 {

position:relative;

overflow:hidden;

margin: 20px auto; 

position: relative; 

clear: both;

border: 1px dashed blue; 

}



.boxwrap1 h3 {

text-align:center;

padding:20px;

}


.boxes1 {

padding: 15px; 

width: 45%; 

float: left;


}



form input, form select, form textarea {border:solid black 1px;

padding:5px;



}

#newsform {width:90%;
margin:10px auto;}

.sidebar div {
margin:20px auto;
text-align:center;
}
.sidebar div li a, .sidebar div p{text-align:left;}

.sidebar div#nav, .sidebar #nav div, #nav, #nav div{margin-top:0px;}


 .blockright {width:35%; 
 float:right;
 padding:5px;
 margin-left:20px;
 margin-bottom:20px;
 font-size:90%;
 background-color:silver;
 border:outset 5px silver;}
 
  .blockright li {
  margin-bottom:5px;
  
  }
  
  
 .statsbox
{
	 float:right;
 padding:5px;
 margin-left:30px;
 font-size:90%;
 background-color:silver;
 border:outset 5px silver;
	
} 
  .statsbox td {
  width:5em;
  padding:3px;	
	
  }
   .statsbox td.heading {
  width:100px;

	
  }
 .divbox {
 display:block;
overflow:auto;

 }
 
 .pgboxrow {
 	 float:left;
 	position:relative;
 	display:block;
	overflow:auto;
	width:100%;
		
 }
 
 .pgboxwrap {
 	float:left;
position:relative;

margin-bottom:1em;
overflow:auto;
		height:100%;
width:97%;
	border-radius:1em;
-moz-border-radius:1em;
-webkit-border-radius:1em;
 border:purple 4px groove;
 
	}
	
 .pgbox {
 	
	padding:5px;
	height:100%;

	
 }
 
 .pgbox h2 {
 	float:left;

	text-align:center;
border-top-right-radius:0.5em;
border-top-left-radius:0.5em;
-moz-border-radius-topright:0.5em;
-moz-border-radius-topleft:0.5em;
-webkit-border-top-right-radius:0.5em;
-webkit-border-top-left-radius:0.5em;

margin-bottom:2px;
background-color:#E6E6FA;

border-bottom-right-radius:0.5em;
border-bottom-left-radius:0.5em;
-moz-border-radius-bottomright:0.5em;
-moz-border-radius-bottomleft:0.5em;
-webkit-border-bottom-right-radius:0.5em;
-webkit-border-top-left-radius:0.5em;
	border:green solid 2px;

 }
 
 
  .pgbox h2 {
  		width:25%;
			height:100%;
  }
  
    .pgbox h2 img {margin-top:5px;}
  
 .pgboxcontents {
 	margin-left:30%;

 }
 
 .pgbox h2 a:visited {font-weight:bold;}
 
 #pgfaq dt {
font-weight:bold;
margin-top:1em;
 	}

.wideside {
	float:left;
	width:60%;
	
		}

.slimside{
margin-left:65%;	
}

.slimside img {
	background-color:yellow;
}
.slimside p{
color:indigo;	
}

#innercontent p#footnote {
text-align:right;
}

.imgbox {width:270px;
font-size:95%;
font-family:'times new roman', times, serif;
padding:5px;
border:black solid 1px;
}

.imgbox img, .imgbox p {
display:block;
margin:10px auto;

}

.bigger {font-size:110%;}

#innercontent  li {margin-bottom:1em;}

.quote {
font-family:'times new roman', times, serif;
font-size:1.2em;}
.qauthor {text-align:right;
font-size:0.9em;}
.quote p {margin-bottom:2px;}