/******************************************************************************************************************
Fairbridge Global Stylesheet

Developed by Robin Hodges for Electric Putty - March 2010
http://www.highpass.co.uk
******************************************************************************************************************/


/******************************************************************************************************************
AUTO EXPANDING FLOATS FOR COMPLIANT BROWSERS
******************************************************************************************************************/

#wrapper:after,
#navSite:after,
#searchsite:after,
#banner:after,
#mainNav:after,
#col-wrap:after,
#footer:after,
.clearfix:after
	{
	content: ".";
	height:0;
	display:block;
	clear:both;
	visibility:hidden;
}

/******************************************************************************************************************
GENERAL FORMATTING OF STANDARD ELEMENTS
******************************************************************************************************************/

a:link { text-decoration: none; color: #666666; }
a:visited { text-decoration: none; color: #666666; }
a:hover, a:active, a:focus { color: #F36810; text-decoration: underline; }

a img {	border: 0;}

h1 { font: bold 130%/1.5em "Century Gothic", "Lucida Grande", "Lucida Sans", Verdana, sans-serif; text-transform: uppercase; }
h2 { font: normal 120%/1.5em "Century Gothic", "Lucida Grande", "Lucida Sans", Verdana, sans-serif; text-transform: uppercase; }

body { background: #F9F8F8; color: #000; }

strong { font-weight: bold; }

em { font-style: italic; }

.err { border: 2px solid #cd1717 !important; background: #faf4f4 !important; }

#skipto { position: absolute; left: -999em; }

.flLeft { float:left; }
.flRight { float:right; }
.picright { clear:right; float:right; margin:0 0 20px 20px; }
.picleft { clear:left; float:left; margin:0 20px 20px 0; }
.picleftsnug { clear:left; float:left; margin:10px 10px 5px 0; }

/******************************************************************************************************************
OVERALL LAYOUT RULES 
******************************************************************************************************************/

#wrapper { background: #FFF; width: 958px; border: #EBEBEB solid; border-width: 0px 1px; margin: 0 auto; }

#col-wrap {  }

/* Margins */
#leftCol { margin: 0 8px 0 16px; } 
#mainCol { margin: 0 8px; }
#rightCol {	margin: 0 16px 0 8px; }
#main { margin-bottom: 20px; }

/* Widths */
#leftCol, #rightCol { width: 178px; }
#mainCol { width: 538px; }
#wideCol { width: 740px; }
#main, #leftCol, #mainCol, #wideCol, #rightCol { float: left; }

#clearspace {
	clear: both; height: 20px; background: #FFF;
}

/* Column Headings */
.sideH2 { text-align: center; margin: 20px 0 10px 0; }
#rightCol h2 { text-align: center; margin-bottom: 10px;}

/* Footer */
#footer { color: #FFF; height: 30px; padding: 40px 20px 0 20px; clear: both; background: #000 url('../images/footer-spacer.png') repeat-x; font-size: 85%; }
#footer p { float: left; }
#footer ul { float: right; }
#footer li { display: inline; }
#footer li a { color: #FFF; text-decoration: underline; padding: 0 5px; }
#footer li a:hover { color: #F36810; }

/******************************************************************************************************************
TOP LEVEL NAVIGATION 
******************************************************************************************************************/

#navSite { background: #F2F2F2; font-size: 90%; height: 49px; border-bottom: 1px #EBEBEB solid; }

#navSite ul { float: right; }

/* Top navigation list */

#navSite #navOptions li { float: left; margin: 16px 10px 0 10px;  }

#navSite #navOptions li a,
#navSite #navOptions li a:visited { padding: 0 0 0 4px; text-decoration: underline; color: #A9A9A9; }

#navSite #navOptions li a:hover { color: #000; }

/* Text Size */

#navSite #textSize { margin-right: 10px; }
#navSite #textSize li {	float: left; margin: 15px 0 0 4px; }

#navSite #textSize li a,
#navSite #textSize li a:visited { 
	display: block; 
	padding: 0 5px; 
	height: 18px;	
	text-decoration:none; 
	background: #FFF; 
	color: #000; 
	border: 1px solid #BEBEBE; 
	-webkit-border-radius: 2px; 
	-moz-border-radius: 2px; 
	border-radius: 2px; 
}
	
#navSite #textSize li.active a,
#navSite #textSize li.active a:visited { background: #E7E7E7; }

#navSite #textSize li a:hover {	background: #F36810; }

#navSite #textSize li span { display: none; }

#navSite #textSize #textSmall a,
#navSite #textSize #textSmall a:visited { font-size: 90%; line-height: 22px; }

#navSite #textSize #textMed a,
#navSite #textSize #textMed a:visited {	font-size: 125%; line-height: 19px; }

#navSite #textSize #textLarge a,
#navSite #textSize #textLarge a:visited { font-size: 150%; }

/* Site search */

#searchsite { float: right;	margin: 10px 20px 0 20px; }

#searchsite legend, #searchsite label, #searchsite span { display: none; }

#searchsite input {
	float: left;
	width: 170px;
	height: 20px;
	line-height: 23px;
	color: #333;
	padding: 3px 10px 0;
	border: 1px solid #BEBEBE;
	margin:0 10px 0 0;
	background: #FFF url('../images/input-bg.png') repeat-x 0% 0%;
	font: normal 100%/1.5em Arial,"Helvetica Neue",Helvetica,sans-serif;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

#searchsite button { height: 25px; width: 32px; border: none; background: transparent url('../images/search-go.png') no-repeat; cursor: pointer; }

/******************************************************************************************************************
BANNER
******************************************************************************************************************/

#banner { background: url('../images/about-us-banner2010.jpg') no-repeat; height:87px; border-bottom:1px solid #EBEBEB; padding:63px 16px 0px 16px; }

.top_support {
	background:#fff url(../images/support-us-banner2010.jpg) no-repeat !important;
	}
.top_involved {
	background:#fff url(../images/get-involved-banner2010.jpg) no-repeat !important;
	}
.top_media {
	background:#fff url(../images/media-centre-banner2010.jpg) no-repeat !important;
	}
.top_work {
	background:#fff url(../images/work-for-us-banner2010.jpg) no-repeat !important;
	}

/* Fairbridge Logo */
#banner img { float: left; }

/* Donate Button */
#banner #donateBanner { 
	background: url('../images/donate-now.png') no-repeat 0% 0%; 
	height: 48px; 
	width: 158px; 
	display: block; 
	text-indent: -9999px; 
	float: right;
	margin: 15px 14px 0 0; 
}

#banner #donateBanner:hover { background-position: 0% -49px; }

/******************************************************************************************************************
MAIN NAVIGATION
******************************************************************************************************************/

#mainNav { padding: 15px 0px 15px 16px; }

#mainNav li { float: left; margin: 0 9px 0 0; }

#mainNav li a {	display: block; font-size: 110%; height: 43px; color: #FFF; text-transform: uppercase; text-align: center; line-height: 43px; text-decoration: none; }

#primaryNavHome { background: url('../images/home-button.png') no-repeat 0% 0%; width: 118px; }
#primaryNavWhat { background: url('../images/what-button.png') no-repeat 0% 0%; width: 167px; }
#primaryNavInvolved { background: url('../images/involved-button.png') no-repeat 0% 0%; width: 179px; }
#primaryNavMedia { background: url('../images/media-button.png') no-repeat 0% 0%; width: 243px; }
#primaryNavWork { background: url('../images/work-button.png') no-repeat 0% 0%; width: 182px; }

#mainNav li:hover, #mainNav li.here { background-position: 0% -44px; }

/******************************************************************************************************************
SECONDARY NAVIGATION
******************************************************************************************************************/

#secondaryNav {	background: #F7F7F7; border: 1px solid #E0E0E0; padding: 5px; margin: 0 0 15px 0; }

/* First Level */
#secondaryNav ul li a { background: #000; display: block; color: #FFF; border-top: 1px solid #FFF; text-transform: uppercase; padding: 10px 15px 10px 10px; }
#secondaryNav ul li:first-child a { border-top: 0; }
#secondaryNav ul li a.here { background: #000 url('../images/internal-list-arrows.png') no-repeat 0% -120px; }

/* Second Level */
#secondaryNav ul li ul li a { padding: 15px 20px 10px; background: #666; border: solid #FFF; border-width: 0 0 1px 0; text-transform: none; color: #CCC; }

	/* Second level down arrow */
	#secondaryNav ul li ul li:first-child a { background: #666 url('../images/internal-list-arrows.png') no-repeat 0% 0%; }

#secondaryNav ul li ul li a.here { color: #FFF; background: #666 url('../images/internal-list-arrows.png') no-repeat 0% -120px; }

	/* Second level down arrow (First Item Selected */
	#secondaryNav ul li ul li:first-child .here { background: #666 url('../images/internal-list-arrows.png') no-repeat 0% -60px; }

/* Third Level */
#secondaryNav ul li ul li ul li a, 
#secondaryNav ul li ul li ul li:first-child a,
#secondaryNav ul li ul li:first-child ul li a { background: #E0E0E0; color: #666; }

#secondaryNav ul li ul li:first-child ul li .here,
#secondaryNav ul li ul li ul li .here { color: #666; font-weight: bold; background: #FFF url('../images/internal-list-arrows.png') no-repeat 0% -180px !important; }




/******************************************************************************************************************
INTERNAL PAGE FORMATTING
******************************************************************************************************************/

#internalContent { padding: 10px 10px; color: #666666; }
#internalContent a { color:#F36810; }
#internalContent p { margin: 0 0 12px 0; line-height: 1.5em;  }
#internalContent ul {  }
#internalContent ul li { padding: 0 0 0 20px; background: transparent url('../images/list-bullet.png') no-repeat 5px 5px; margin: 0 0 10px 0; }

#internalContent ul.anchorList { margin: 0 0 24px 0; }
#internalContent ul.anchorList li { margin: 0 0 8px 0; }

#internalContent h1 { font-size: 200%; font-weight: normal; margin: 0 0 12px 0; }
#internalContent h2 { font-size: 150%; text-transform: uppercase; margin: 0 0 10px 0; line-height: 1.2em; }
#internalContent h3 { font-size: 120%; font-weight:bold; margin: 0 0 6px 0; }
#internalContent h4 { font-size: 110%; font-weight: bold; margin: 0 0 6px 0; }
#internalContent h5 { font-size: 100%; font-weight: bold; margin: 0 0 0 0; }

#internalContent h1.flLeft { float:left; width: 450px; }
	
p.titleLink { float: right; width: 110px; text-align: right; }

#internalContent .england { 
	text-transform: uppercase; 
	color: #f36810; 
	font-family: "Century Gothic", Verdana,Arial, "Helvetica Neue", Helvetica, sans-serif; 
	font-size: 2.5em; 
	line-height: 1.5em;
	}

#internalContent .england ul li { 
	padding: 0 0 0 22px; 
	background: url("../images/bg_square.gif") 
	no-repeat 0 50%;  
	margin: 0 12px 0px 0; 
	float:left;
	}
	
#internalContent .england ul li.tw {
	width: 200px;
	}
#internalContent .england ul li.fpgc {
	width: 500px;
	}


/******************************************************************************************************************
MISCELLANEOUS STYLES
******************************************************************************************************************/

.mediabox { background: #E9E8E8; padding: 20px; margin: 0 0 20px 0; }
.large { padding: 0 !important; }
.mediabox:hover { background: #FFE6D5; }

.fb { background:#FDEADD; padding:10px 9px 10px 10px; font-size: 90%; } 
.fb a { color: #F36810; }


/******************************************************************************************************************
SUB HEADS
******************************************************************************************************************/
.subHead 
{
	border-top: 4px solid #DBDBDB;
	background: #EDEDED;
	margin:0 0 5px 0;
}

.subHead h3 
{
	float: left;
	font-family: Verdana,Arial,"Helvetica Neue",Helvetica,sans-serif;
	font-weight: bold;
	font-size: 100% !important;
	line-height: 1.1em;
	padding: 0;
	color: #141414;
	margin: 2px 0 0 10px !important;
}

.subHead .link 
{
	float: right;
	margin:0 !important;
}
	
.subHead .link a 
{
	display: block;
	margin: 1px 0;
	background: #dbdbdb url("../images/icon-more.gif") no-repeat right;
	padding: 0 25px 0 5px;
	color: #3b3b3b;
	font-size: 90%;
}



/******************************************************************************************************************
SECTION PANELS
******************************************************************************************************************/
.sectionPanel {
	width:250px;
	min-height: 140px;
	margin: 15px 0 0 0;
	padding: 0 0 20px 0;
	float:left;	
	line-height:normal;
	background: #fdeadd;
	}
	
.spOdd {
	margin: 15px 15px 0 0;
	}

.sectionPanel h2 {
	font-size: 1.6em;
	margin: 0 0 10px 0 !important;
	background: #fdeadd;
	border-top:4px solid #f36810;
	padding: 4px 10px;
	}
	
.sectionPanel p {
	margin: 0 10px 5px 10px !important;	
	}



/******************************************************************************************************************
COUNTRY LANDING PAGES
******************************************************************************************************************/
.halfCol {
	width: 350px;
	float: left;
	}

.hcLeft {
	margin: 0 15px 0 0;
	}

.halfCol h2 {
	margin: 5px 0 2px 0;
	padding: 2px 8px;
	border: 1px solid #e4e4e4;
	color: #f36810;
	}
	
.halfCol .contentBox {
	border: 1px solid #e4e4e4;
	padding: 4px 8px 0 8px;
	margin-bottom: 10px;
	color: #505050;
	}
	
.halfCol .contentBox p {
	margin: 0 0 8px 0;
	}

.simpleList {
	margin:2px 0 0 0;
	}
	
.simpleList li {
	margin: 0 0 0.7em;
	padding:0;
	background:none;
	}

.simpleList li h3,
.simpleList li p {
	margin:0 !important;
	padding: 0 !important;
	}

.simpleList li h3 {
	font-size: 100% !important;
	color:#000;	
	font-weight:bold;
	font-size:1.0em;
	font-family: Verdana,Arial,"Helvetica Neue",Helvetica,sans-serif;
	}



/******************************************************************************************************************
CMS Quote
******************************************************************************************************************/
.cmsQuote {
	background: url("../images/bg_quotesBottom.gif") repeat-x bottom left;
	margin: 0 0 16px 0;
	}

.cmsQuote blockquote {
	background: url("../images/bg_openQuotes.gif") no-repeat;
	padding: 0 0 0 30px;
	margin: 16px 0 0 0;
	}
	
.cmsQuote blockquote p {
	background: url("../images/bg_closeQuotes.gif") no-repeat bottom right;
	padding: 0px 25px 0 0;
	margin: 0 !important;
	font-size: 1.2em;
	color:#f36810 !important;
	}

.cmsQuote p.credit {
	margin: 10px 0 0 30px !important;
	padding-bottom: 16px;
	color: #3d3d3d;
	}



/******************************************************************************************************************
EVENTS
******************************************************************************************************************/
.Eeven,
.Eodd {
	padding: 4px 10px;
	}
	
.Eeven {
	background: #f3f3f3;
	}
	
.featuredEvent {
	padding: 4px 10px;
	border: 1px solid #fcd3ba;
	border-left: 6px solid #fcd3ba;
	border-right: 6px solid #fcd3ba;
	}
	
.vevent h4,
.vevent p {
	margin: 0 !important;
	padding: 0 !important;
	}
	

.vevent h2 {
	background: none;
	border: none;
	text-transform:none;
	font-size: 1.1em;
	font-weight: bold;
	color: #000;
	margin: 10px 0 0 0 !important;
	}

.vevent h3 {
	color: #303030;
	margin: 2px 0 6px 0 !important;
	font-family: Verdana,Arial,"Helvetica Neue",Helvetica,sans-serif;
	font-size: 1em;
	}
	
.vevent .moveBack {
	margin-top: 20px;
	}
	
.vevent h3 a {
	color: #303030 !important;
	}

.vevent h4 {
	font-size: 1.1em;
	}
	
.vevent p.details {
	clear: both;
	color: #f5843d;
	}
	
.vevent p.description {
	padding: 4px 0 !important;
	}
	
div.eContent p {
	margin-bottom: 12px !important;
	}
	
.vevent p.more {
	text-align: right;
	}

#bodyContent .vevent p.more a {
	font-weight: normal;
	}
	
div.vevent .venue {
	margin: 0 0 5px 0 !important;
	}
div.vevent .venue .org {
	font-weight: bold;
	}


.cTable {
	width: 590px;
	margin: 0 0 0 0;
	}

.cTable tr.over {
	background: #dadada;
	cursor: pointer;
	}

.cTable th {
	text-align: left;
	background: url("../images/icon-course.gif") no-repeat 10px 2px;
	padding: 0 0 10px 30px;
	}

.cTable th.cTitle {
	width: 60%;
	}

.cTable th.cDate {
	width: 75px;
	background-image: url("../images/icon-clock.gif");
	}
	
.cTable th.cLocation {
	background-image: url("../images/icon-location.gif");
	}

.cTable td {
	padding: 5px 10px;
	line-height: 1.1em;
	}
	
.cTable td.summary {
	font-weight: bold;
	}

.cTable td.venue .adr {
	line-height: 1.4em !important;
	padding: 5px 0;
	}

.cTable .adr {
	margin-bottom: 5px;
	padding-left: 1px;
	line-height: 1.4em !important;
	}



/******************************************************************************************************************
SITEMAP
******************************************************************************************************************/
ul#siteMap,
ul#siteMap ul {
	margin: 0 0 15px 5px;
	list-style: none;
	padding: 0;
	}

ul#siteMap ul {
	margin-bottom: 0;
	}

ul#siteMap li {
	margin: 6px 0 10px 0;
	padding: 0 0 5px 14px;
	background: url("../images/bullet.gif") no-repeat 2px 4px;
	border-bottom: 1px solid #d9d9d9;
	}

ul#siteMap li a {
	font-size: 1.2em;
	color: #f36810;
	font-weight: bold;
	}

ul#siteMap li li {
	margin: 6px 0;
	background: none;
	padding: 0 0 0 10px;
	border-bottom: none;
	}

ul#siteMap li li a {
	font-size: 1em;
	color: #808080;
	}

ul#siteMap li li li a {
	font-weight: normal;
	}



/******************************************************************************************************************
FUNCTIONS
******************************************************************************************************************/
p.toTop,
p.printButton {
	float:right;
	text-align:right;
	line-height:1.6em;
	padding: 0 0 0 20px;
	background:url(../images/icon-print.gif) left center no-repeat;
	margin: 20px 0 0 0 !important;
	}

p.toTop {
	padding:0 0 0 20px;
	float:left;
	text-align:left;
	background:url(../images/icon-totop.gif) 0 50% no-repeat;	
	}

p.toTop a,p.toTop a:visited,
p.printButton a,p.printButton a:visited {
	color:#333 !important;
	font-weight:normal;
	}

p.headingToTop { 
	line-height:1.6em;
	padding: 0 0 0 20px;
	background:url(../images/icon-totop.gif) left center no-repeat;
	margin: 24px 0 !important;
	}

p.headingToTop a {
	color: #666 !important;
	}

p.midPage {
	margin-bottom: 10px !important;
	}


/******************************************************************************************************************
VIDEO BOX
******************************************************************************************************************/

.videobox {
	background: url("../images/bg_videoClip.gif") no-repeat;
	height: 174px;
	}

.videobox p {
	padding: 5px 10px 0 0;
	}

.videobox a {
	width: 85px;
	display: block;
	float: right;
	padding: 0 0 0 20px;
	background: url("../images/icon-video.gif") no-repeat 0 50%;
	font-weight: normal;
	font-size: 90%;
	color: #616161;
	}


