/*
Version: 0.4 post launch inline-list styles fix. Trevor Barton. Fellowship of Reconciliation. Please also see inline styles in the homepage file, and inline styles in the body.shtml include for the menu on older browsers.
*/

/* global styles */

body {
	margin: 0;
	padding: 0;
	background: /*#BCBDAC; #CACBBE*/  url('/images/website-header3.jpg') no-repeat;
	font-weight: normal; 
	font-size: 100%;
	font-family: "Microsoft Sans Serif", "Lucida Grande", Arial, Helvetica, sans-serif; color: black;}

html {margin: 0;}
	
/*note that Segoe UI is the system font for Windows XP and higher. In Vista it is set to automatically kern. Corbel and Constantia are a font installed for anyone with Vista, or anyone (Mac or PC) with PowerPoint >2007. Meanwhile Lucida Grande is the system font for Mac OSX, which doesn't have Segue UI. The outcome looks neat in Mac, PC, and Linux. */	

/* All font sizes  ...................................... */
h2 {font-size: 1.188em;}
h3 {font-size: 1em;}
#left h4 {font-size: 0.81em;}
#right h4 {font-size: 0.81em; letter-spacing: normal;}
/* font size for right hand column headers */
#right h2 {font-size: 0.81em;} 
blockquote, p, .blogdiv p, ul, ol, td, th, #mc-embedded-subscribe-form fieldset {font-size: 0.875em;}
ul ul li {font-size: 1.1em;}
ul li {font-size: 1em;}
ol ol li {font-size: 1.1em;}
ol li {font-size: 1em;}
.homeboxes p, #right p, #footer p, #twitter_update_list  {font-size: 0.85em;}
.floatleft p, .floatright p {font-size: 0.75em;}
caption {font-size: 0.875em;}
#inline li {font-size: 1em;}
#inline li ul li {font-size: 1em;}
#inline a:link, #inline a:active, #inline a:visited, #inline a:hover {font-size: 1em;}
#twitterdiv h3 {font-size: 0.81em;}
.blogdiv h2 {font-size: 0.95em;}
#maintab {font-size: 0.875em;}
#submenustyle {font-size: 0.81em;}

.newspurple, .newsorange, .homebox1 h2, .homebox2 h2, .homebox3 h2, .homebox4 h2, .homebox5 h2, .homebox6 h2, .homebox7 h2, .homebox8 h2, .homebox9 h2 {font-size: 0.81em;}
.newspurple {}
.homebox8 p {font-size: 0.81em;}
.small, .viewoptions {font-size: 0.625em; padding-left: 10px;}
.homebox8 h2, .homebox6 h2 {font-size: 1.5em;}
.homebox6 .blogdiv h2 {font-size: 1.188em;}

/* end of fonts...................................... */

/* All colours............................................
Light grey BCBDAC
Yellow CFBE27
Orange F27435
Pink F02475
Dark grey 3B2D38
*/

/* yellow */
#right h2.eventheader, #right h2.eventheader a {color: #CFBE27 !important;}
.homebox6 h2 a, .homebox8 h2 a, .homebox4 h2 a, .homebox5 h2 a {color: #CFBE27;}

/*
h2.yellowbrown a, h2.orange a {color: #DCE9BE !important;}
*/
/*.homepage {color: #3B2E38;}
#left .homebox6 .blogdiv h2 {color: #3B2E38 !important;}*/

/* Pink */
.viewoptions a,  #inline a, #left p a, #center p a, #center ul a, #left ul a, #right ul a, ul li a, ol li a, td a {color: #F02475;}
.homebox4 a, .homebox5 a, .homebox6 a, .homebox7 a, .homebox8 a {color: #F02475;}
h2, h3, h2.discover, h3.discover, h2.who, h3.who, h2.act, h3.act, h2.peacehouse, h3.peacehouse, h2.tool, h3.tool  {color: #F02475;}
/* Orange*/
h2.yp, h3.yp {color: /*F27435*/#FF3300;}

/*Dark grey */
#right h2, #right h3, #right h4 {color:#3b2e38;}
.homebox4 h3, .homebox5 h3, .homebox6 h3, .homebox8 h3, .homebox4 h4, .homebox5 h4, .homebox6 h4, .homebox8 h4, .homebox4 p, .homebox5 p, .homebox6 p, .homebox7 p, .homebox8 p, .small, h1, h4, #twitter-link, p, ol, ul {color: #3B2E38;}


#right p, #right ul, p.viewoptions, {color: #3B2E38 !important;}
#right a, #twitter_update_list li a, p.viewoptions a {color: #F02475;}

ul, ol, th, td, .anothercell td, blockquote, .discover, .who, .act, .connect, .peacehouse, .tool, #maintab li a, #maintab li a:visited, #submenustyle li a:link, #submenustyle li a:visited {color:  #3B2E38;}

/* light gray */
#right h3 {color: #BCBDAC;}
.lightondarkheaders, .pink {background-color: #3B2E38; color: #BCBDAC; padding-top: 3px !important; padding-left: 0px !important; padding-bottom: 3px !important; margin-top: 1px; margin-bottom: 1px; margin-left: 0px; line-height: 90%;}

.select, #footer p, #footer a, caption {color: #BCBDAC; }
.select a {color: #BCBDAC !important;}
h2.pink a {color: #BCBDAC; }

/* other */
.floatright p, .floatleft p {color: #D6D8DB;}
.floatright p a:link, .floatleft p a:link {text-decoration: none !important; }
div.floatright p a:link, div.floatleft p a:link {color: #D6D8DB !important; }
div.floatright p a:visited, div.floatleft p a:visited {color: #D6D8DB !important; }

.mainselected, #maintab li a:hover, #maintab li a:active, #submenustyle li a:hover, #submenustyle li a:active, #submenustyle li.selected {color: #72686F; 
}



#title h1, #title h2 {
		color: black; }

.floatleft p, .floatleftnoclear p {color: white; }





/* Borders and background colours........................ */
div.eventbox {border: 0px solid #F68F5B;}

.green {border-width: 1px 0 1px 1px; border-style: solid; border-color: #F02475;}

.orange, .yellowbrown, .blue, #right h2.blue, .grey, .brown,  {border: 1px solid #F02475;}

.brownbrown  {border-bottom: 1px solid #3B2E38; background-color: /*#61091A*/#3B2E38; }

#right h2, #right h3 {background-color: #3B2D38;}

.floatleft {border-left: 1px solid #2E2633;}
.floatleftnoclear {border-left: 2px solid gray;}
.floatleft p {border: 1px solid #2E2633; background-color: #2E2633;}
.floatleftnoclear p {border: 1px solid #3B2D38; background-color: #3B2D38;}

.floatright {border-right: 1px solid #2E2633; }
.floatright p {border: 1px solid #2E2633; background-color: #2E2633;}



caption {background-color: #3B2D38; }
th {background-color: #CFBE27; }
td {border: 1px solid #F02475;}
.anothercell td {border: 1px solid #F15406;}



	

#right {border: 1px solid #F02475;}



/*#right img {background-color: #05163F;}*/

.h3store {border: 1px solid #F02475; }
.select {background-color: #F02475;}

.mainselected {border-bottom: 2px solid #F02475;
}



#maintab li a:hover, #maintab li a:active, #submenustyle li a:hover, #submenustyle li a:active { border-bottom: 2px solid #F02475;
}



#submenustyle li a.selected {border-bottom: 2px solid #F02475;}



#footer {background-color: #3B2D38; border-top: 3px double #F02475;}



/*home page only..................................... */

/* homepage event box in the right column */
.eventbox img, .eventbox h3 {display: none; }
#show-event-image {display: inline !important;}
#show-event-image {padding-top: 0px; margin-top:0px;}



/* Wordpress NewsPeaces Campaign feed appears only on homepage */
.blogdiv img {display: none; visibility: collapse;}
.blogdiv p {margin-top: -8px;}
.blogdiv p {margin-bottom: 10px;}

/* homeboxes just for the homepage*/

.homeboxes {width: auto; height: auto;}
.homeboxwrapped {height: auto;}
.clearhomebox {clear: both; height: 7px; margin: 0; padding:0; }
.clearhomeboxthinkpeace p {clear: both; height: 15px; margin: 0; padding:0; }
.clearhomeboxhometop p {clear: both; height: 1px; margin: 0; padding:0; margin-top: 1px;}
.homebox4, .homebox5, .homebox6, .homebox7, .homebox8, .homebox9 {float: left;}



.homebox4 ul, .homebox5 ul, .homebox6 ul, .homebox7 ul, .homebox8 ul, .homebox9 ul {list-style: none; padding: 0; }

/* the boxes appear on screen in the following order */
.homebox6 {width: 60%;}
.homebox8 {width: 40%;}

.homebox4 {width: 40%;}
.homebox5 {width: 60%;}

.homebox7 {width: 100%}

.homebox4 h2, .homebox5 h2, .homebox6 h2, .homebox7 h2, .homebox8 h2 {text-transform: none; padding-bottom: 5px; padding-left: 10px; padding-top: 4px; }

.floatrighthomebox {float: right;}
.floatlefthomebox {float: left; padding-right: 10px; padding-bottom: 5px;}

.homebox4 h3, .homebox5 h3, .homebox6 h3, .homebox8 h3 {padding-left: 10px; margin: 0; padding-bottom: 0px;}
.homebox4 h4, .homebox5 h4, .homebox6 h4, .homebox8 h4 {padding-left: 0px;}
.homebox4 p, .homebox4 ul, .homebox5 p, .homebox5 ul, .homebox6 p, .homebox6 ul,  .homebox7 p, .homebox7 ul, .homebox8 p, .homebox8 ul, #twitter_update_list {padding-left: 10px; margin-top: 4px; }
.homebox6 h2 a, .homebox8 h2 a, .homebox4 h2 a, .homebox5 h2 a, .homebox7 h2 a {text-decoration: none !important;}
.homebox4 img, .homebox5 img, .homebox6 img {padding-left: 10px;}

#right #twitter_update_list li a {text-decoration: underline;}
#twitter_update_list > li > {margin: 0; clear: both;}
#twitter-link ul li a {text-decoration: none !important;}

/* end homepage only ===============================
=========================
==================
=============
====== */



/* end of news */

h1, h2, h3, h4 {
	margin: 0;
	padding: 0;}

#right h2 {padding: 3px; padding-left: 10px; margin: 0;}

#center h3 {padding-top: 4px; padding-bottom: 4px;}

#left h4 {margin-left: 10px; margin-top: 0px;}

#right h4 {text-transform: uppercase; padding-left: 0px; margin: 1em 5px 1em 10px; }
p, ol, ul {padding-top: 4px;}

#right p, #right a, #right ul, #twitter_update_list li a {margin: 1em 5px 1em 10px;}



/* style guide styles */

abbr, acronym, .help {
  border-bottom: 1px dotted #333;
  cursor: help;
  }

blockquote {padding-left: 20px;}

.clear {clear: both; }
.clearleft {clear: left; }
.clearright {clear: right;}

/* image styles*/
.floatleft {float: left; margin: 15px 30px 10px 0px; padding-left: 2px; clear: both; }
.floatleftnoclear {float: left; margin: 15px 30px 10px 0px; padding-left: 2px; }
.floatleft p {padding: 4px; margin: 10px 0px 0px -3px; }
.floatleftnoclear p {padding: 4px; margin: 10px 0px 0px -3px; width: auto; }



.floatright {float: right; margin: 15px 0px 10px 15px; padding-right: 2px; clear: both; }
.floatright p {padding: 4px; margin: 10px -3px 0px 0px; }

.floatleft a:link img, .floatright a:link img {border: none;}

/* end image styles*/

/* end style guide ==========================
======================
===============
=====
*/





/* link styles */
a, small, a:hover  {text-decoration: none;}



.viewoptions a {font-weight: bold;}
/* January 2011 deleted the following #left p a, #center p a, #center ul a, #left ul a, #right ul a {font-weight: bold;} */





/* list styles */
ul {list-style-type: square; list-style-position: outside; list-style-image: url('/images/ul.gif'); display: block; }
li ul {list-style-image: url('/images/ulul.gif');}
li ul li ul {list-style-image: url('/images/ululul.gif');}

ol {list-style-position: outside; }
ol ol {list-style-type: lower-roman;}
ol ol ol {list-style-type: lower-alpha;}

#right ul a {/*text-decoration: none;*/ font-weight: normal;}





/* table styles */
caption {margin: 0px 10px; text-align: left; padding: 3px; font-weight: bold; margin-top: 15px;}
th {padding: 4px 4px 14px 4px; text-align: left; margin: 4px 15px;}
td {padding: 3px 5px 3px 5px; text-align: left; vertical-align: top;}
table {padding: 10px;}
td a {text-transform: none; font-weight: normal;}

/* iframes */
div#iframe { padding: 0px 0px 4px 4px;}

/* form styles */
.response {padding: 15px 0px 15px 0px;}
.mc-sub-badge10 {float: right;}
#mc_embed_close {display: none;}
fieldset {padding-top: 1em;}
#mc-embedded-subscribe-form {padding-top: 1em;}

/* positioning styles */

/* title block controls the h1 and h2 in the title bar. Removed these next three lines at point of golive. I think they are old and disused cos the h1 and h2 are hidden in the title bar 

#title h1, #title h2 {
	font-weight: normal;
	padding-left: -20px;}*/

#title h1,  #title h2 {display: none; visibility: collapse; clear: both;}
#title h1 a, #title h2 a {text-decoration: none;}



/* Content wrapper for all layouts in the content area. Deleted a broken instruction for margin-bottom 40px, which was written margin colon bottom colon 40px at point of golive. Swapped backtogreen.jpg for website-header2.jpg on trial */
/* 2 June 2011 changed content height from 100% to auto to fix a bug on one of Amy's pages. Seemed to be OK everywhere else*/
#content {float: left; max-width: 1160px; 
z-index: 30; margin-top: -8px; height: auto; margin-left: -8px; /* removed the following July 2011 as there was a bug possibly caused by changing menu links into active links after selection which stopped the header showing in Google Chrome so I moved this instruction to the body background:url('/images/website-header2.jpg') no-repeat;} */ }

.viewoptions {float: right; margin-top: -20px; margin-right: -60px;}



/* center wrapper inside the content div for one column layouts.  */
#center {float: left; z-index: 30; margin: 183px 25px 50px 25px; height: 100%; padding: 10px; width: 90%; max-width: 1028px;}

#center a {text-decoration: underline;}

#center p {margin-right: 0px !important; padding-right: 0px !important;}
/* Left and styles for the left hand pane */
#left {float: left;
	width: 75%; max-width: 850px;
	padding: 10px; height: auto; margin: 183px 5px /* removed 50px replaced with 0, July 2011 */ 0px 25px; }

#left a {text-decoration: underline;}



/* inline tabs  */
#inline {border-bottom: 1px solid #3B2E38; width: 800px; display: block; margin-top: -20px; margin-left: -40px; padding-bottom: 3px; }
#inline li {margin: 0px; padding: 0px;}
#inline li:hover, #inline li a:hover, #inline a:link, #inline a:visited {text-decoration: none; font-weight: normal;}
#inline {background-color: transparent; }
#inline ul {list-style-type: none; margin: 0px; padding: 0px;}
#inline li, #inline li a {display: inline;}
#inline li, #inline li a {padding: 3px;}
#inline li a:link, #inline li a:visited {color: #3B2E38;}



#inline .active, #inline li a:hover {background-color: #3B2E38; }
#inline li a:hover, #inline li a:active, #inline li a.active {color: #CFBE27 !important;}

/* Right */
/* These styles are overridden in the phdiary_stylesheets include, for the what's on page. Ensure to copy over any changes to there as well */

#right {float: left; 
	width: 15%; max-width: 360px;
	padding: 5px;
    
/* March 2011 changed margin top value from 194px to 240px */
	margin: 240px 0 10px 13px;
height: auto; }



#right img {/*float: right;*/ margin: 15px 3px 3px 0px; /*padding: 4px;*/ } 

#rightbutton {float: left; padding: 0; margin: 0; border: 0px;}

#right ul {list-style: none; margin: 0; padding: 0 0 4px 10px;}

#right a {text-decoration: underline; margin: 0;}

#right h2 a {text-decoration: none;}

/* book store */

.jacket {float: left; clear: both; margin-right: 10px; border: 1px solid #3B2E38;}
.h3store {padding: 5px; margin-bottom: 5px;}
.h4store {}
.select {padding: 5px; width: 80px; margin-left: 150px;}

	
/* base of every page content */
.addthis_button {clear: both; margin-left: 10px;}

/* menu and search. DON'T FORGET THAT IF YOU CHANGE ANYTHING HERE, YOU MIGHT ALSO NEED TO CHANGE THE INLINE CSS IN THE BODY.SHTML INCLUDE WHICH CONTROLS THE MENU SEARCH CONTAINER JUST FOR INTERNET EXPLORER LESS THAN 8. */



#menusearchcontainer {position: absolute; margin-top: 0px; margin-left: 0px; height: 120px; padding: 0; width: auto; z-index: 40;}



/* search */
#cse-search-box {padding: 0; margin: 0px;}
/* have now tried float left, and nothing */
#searchbox {float: right; margin-top: 0px; height: auto; margin-right: 50px;}

/* Menu */
#menucontainer {margin-left: 22px; padding-top: 100px; width: auto; height: auto;}

/* Two level menu styles */

#maintab {
padding: 3px;
margin-left: 0;
list-style-type: none;
display: block;
font-weight: bold;
margin-bottom: 0px;
text-align: left;
/* March 2011 changed width from 800px to 900px because of adding the 'jobs' directory. This also moved the search box further to the right, which was not tested on all browsers at the time. Also changed this in body.shtml */
width: 900px;
}

#maintab li
{display: inline;
text-decoration: none;}

#maintab li {
margin: 0px 5px 8px 0px;
padding: 0px 5px 3px 5px; 
}


/* submenu style................. */
#submenustyle {
display: block;
margin-top: 0px;
font-weight: bold;
list-style-type: none;
text-align: left;
width: 700px;
margin-left: -20px;}

#submenustyle li {
display: inline;
text-decoration: none;
margin: 0px;
}
#submenustyle li.selected {padding: 0px 5px 0px 5px; }

#submenustyle li a:link, #submenustyle li a:visited, #submenustyle li a:hover, #submenustyle li a:active {text-decoration: none; padding: 0px 5px 0px 5px; 
}

/* End of menu */



/* Footer */

#footer {clear: both;
	height: auto;
	padding: 0px 0px 27px 0;
	margin: 0px 0px 7px 0px;}

#footer p {padding-top: 10px; margin: 0; padding-bottom: 0px;
	text-align: center; font-weight: bold;}



/* Deleted feedicons in structions at point of golive. Again, think they are old */
/*.feedicons {float: left; border: none !important; margin: none;}*/



/* related to other style sheet */
.antiscreen_show, .screenhide {display: none; visibility: collapse;}
#antiscreen_show {display: none; visibility: collapse;}
.printshow, #printshow {display: none; visibility: collapse;}

/* hides a special version of menusearchcontainer which is called in just for versions of IE less than or equal to 7 */

#exploder {display: none;}



/* TRASH............................................ */
/* the h2 just on the homepage */
/*.homepage {margin-top: -40px;}*/

/* Trial Code November 2010 */

#right h2 {margin-bottom: -15px; margin-top: 1px; font-size: 0.65em; text-transform: uppercase;}
#twitter_update_list li, #right ul {margin-top: 15px;}
#right p, #twitter_update_list {font-size: 0.75em;}
.eventbox p {padding: 10px 0px 0px 0px;}

/* Trial code March 2011 */
.downloadnow {width: 160px; border: 1px solid black; height: auto; float: right;}
.downloadnow img {float: right;}
.downloadnow p {padding: 4px; margin-top: 0px;}

.floatright-hack {float: right; padding-left: 4px; }



/* End */