/*
	Filename:		style.css
	Purpose:		screen presentation for aberdeen cyrenians website
	Created by:		www.eastcoastinteractive.co.uk
	Created:		20/12/2007 by Mark McAulay
	Last Modified:	25/03/2008 by Mark McAulay
*/

body
{
	margin:0 auto;
	padding:0;
	font:62.5% Verdana,Tahoma,Arial,sans-serif;
	background:#f4f4f4 url(../images/headerGrad.jpg) top left repeat-x;
	color:#303030;
	text-align:center;
}

/*	
integrating a min-width of 800px
users with higher resolutions will be able to utilise more screen space but am setting 
a minimum for site legibility and better useability throughout.
*/
/* good browsers that understand min-width first */
.holdem
{
	width:88%;
	min-width:800px;
	margin:0 auto;
}
/* now lets bodge the browsers that just dont get it...hello ie */
* html .minwidth
{
	border-left:800px solid #fff;
	position:relative;
	float:left;
	z-index:1;
}

* html .container
{
	margin-left:-800px;
	position:relative;
	float:left;
	z-index:2;
	text-align:left;
}

#wrap, #wrapPage{text-align:left;}

#wrap{background:#fff url(../images/wrapBack.jpg) top left repeat-x;}
#wrapPage{background:#fff url(../images/wrapBackPage.jpg) top left repeat-x;}

#header
{
	clear:both;
	position:relative;
	margin:0;
	padding:0;
	height:116px;
}

#header h1
{
	width:500px;
	line-height:116px;
	margin:0;
	background:url(../images/logoHeader.jpg) top left no-repeat;
	text-indent:-9999px;
}

#page-tools
{
	position:absolute;
	top:2px;
	right:0px;
	width:300px;
	text-align:right;
	color:#ccc;
	margin:0 10px 0 0;
	font-size:1em;
	line-height:1.4em;
}
#page-tools ul{list-style-type:none;}
#page-tools a{color:#fff;}

a.Tdef{font-size:1em;}
a.Tlarge{font-size:1.4em;}
a.Tlargest{font-size:1.8em;}

#donate-head
{
	position:absolute;
	top:65px;
	right:0px;
	width:370px;
	height:45px;
	/*background:transparent url('../images/donateHeadBgM.png') top left no-repeat;*/
	/*when donate online goes live...switch these... */
	background:transparent url('../images/donateHeadBgM_tmp.png') top left no-repeat;
	font-size:1.0em;
	color:#fff;
}

#donate-head p
{
	margin:0;
	padding:9px 120px 3px 22px;
	line-height:1.3em;
	letter-spacing:-1px;
}

a.donateButton
{
	display:block;
	position:absolute;
	top:10px;
	right:0px;
	width:100px;
	line-height:25px;
	padding:0 0 0 16px;
	background:url('../images/donateBtnBg.png') top left no-repeat;
}

a.donateButton:hover{background:url('../images/donateBtnBgOv.png') top left no-repeat;}

/* site navigation systems */
/* top navigation bar */
#topNav
{
	margin:0 0 6px 0; /* in ie6 this needs to be margin:0; */
	padding:0;
	height:20px;
}

#topNav ul
{
	border:0;
	margin:0;
	padding:0;
	list-style-type:none;
	text-align:center;
}

#topNav ul li
{
	display:block;
	float:left;
	text-align:center;
	padding:0;
	margin:0;
}

#topNav ul li a
{
	background:#333;
	width:90px;
	height:26px; 
	border:1px solid #666;
	border-width:0 1px 0 0;
	padding:0;
	margin:0;
	color:#fff;
	text-decoration:none;
	display:block;
	text-align:center;
	font:normal 1.1em/25px verdana, arial, sans-serif;
}
#topNav ul li a.med{width:118px;}
#topNav ul li a.long{width:134px;}

#topNav ul li a:hover
{
	color:#ccc;
	background:#23528a top left repeat-x;
}

/* side menu */
#sideMenu{position:relative; z-index:250;}
#sideMenu ul
{
	list-style:none;
	width:150px;
	padding:0;
	margin:0;
}

#sideMenu a
{
	font-weight:normal;
	height:20px;
	text-decoration:none;
	color:#fff;
	display:block;
	padding:5px 0 0 10px;
	background:#333;
	border-bottom:1px solid #666;
	font-size:1.1em;
}
/*not implimented yet*/
#sideMenu a.hasKid{background: url(rightarrow2.gif) center right no-repeat;}

#sideMenu li.here a{color:#3f729f;}

#sideMenu div.subdiv a{color:#505050;}

#sideMenu div.subdiv li.here a{color:#3f729f;}
    
#sideMenu a:hover, #sideMenu div.subdiv a:hover, #sideMenu li.here a:hover
{
	background:#23528a;
	color:#eee;
}

/*L1*/
#sideMenu ul li
{
	float:left;
	padding:0;
	width:150px;
	background:#666;
	border-color:#333;
}
/*L2*/
#sideMenu ul li ul
{
	position:absolute;
	left:-999em;
	width:150px;
	font-weight:normal;
	margin:0;
}

#sideMenu ul li ul li, #sideMenu ul li ul li ul li{width:150px;}

#sideMenu ul li ul{margin:-26px 0 0 0;}
#sideMenu ul li ul li ul{margin:-26px 0 0 150px;}

#sideMenu li:hover ul ul, #sideMenu li:hover ul ul ul, #sideMenu li.sfhover ul ul, #sideMenu li.sfhover ul ul ul{left:-999em;}

/*move them both firstly to the right*/
#sideMenu li:hover ul, #sideMenu li ul li:hover ul, #sideMenu li ul li ul li:hover ul, #sideMenu li.sfhover ul, #sideMenu li ul li.sfhover ul, #sideMenu li ul li ul li.sfhover ul{left:150px;}

/*then move the 3rd one back 150px left*/
#sideMenu ul li ul li:hover ul, #sideMenu ul li ul li.sfhover ul{left:-1px;}

#sideMenu li:hover, #sideMenu li.sfhover
{
	background:#23528a;
	color:#eee;
}

/* pop em out */
/* laying in the second level of navigation for dropdown/popout on top+left...whatever really */
#sideMenu ul li ul li a{background:#555; border-color:#333;}
#sideMenu ul li ul li a:hover{}

/* and the third level which is as deep as we want to get really */
#sideMenu ul li ul li ul li a{background:#777; border-color:#333;}
#sideMenu ul li ul li ul li a:hover{}

#unStick{margin-left:16em;}

/* big promo image on the homepage */
#frontphoto
{
	margin:0 0 -2px 0;
	border:0;
}

.announce
{
	margin:10px 0 10px 0;
	padding:10px;
	width:130px;
	color:#505050;
	background-color:#f4f4f4;
	line-height:1.3em;
}

/* the left hand bar */
#avmenu
{
	clear:left;
	float:left;
	width:160px;
	margin:0 0 10px 0;
	padding:0;
	font-size:1em;
}

/* the right hand bar */
#extras
{
	float:right;
	width:220px;
	margin:0 0 10px 0;
	padding:10px 0;
	/*font-size:1em;
	line-height:1.5em;*/
	background:#fff;
	text-align:left;
}

/*#extras a{overflow:hidden;}*/

.IceBerg{margin-top:10px;width:148px; height:148px;clear:both;}

.eventAdvert{background:#fff; padding:5px;}
.eventAdvert a img{}

/* the main content area */
#content
{
	margin:0 220px 20px 160px;
	border-left:0px dotted #ccc;
	border-right:1px dotted #ccc;
	padding:10px 10px 0 10px;
	line-height:1.6em;
	text-align:left;
	text-align:justify;
	background:#fff;
	font-size:1.2em;
}

#content p{}

#content h2
{
	font-size:1.5em;
	margin:.5em 0 0.5em 0;
}

#content img
{
	padding:2px;
	margin:0 10px 5px 0;
	float:left;
	display:inline;
	background:transparent;
	color:#303030;
	border:2px solid #23528a;
}

h3
{
	font-size:1.2em;
	margin:0 0 10px 0;
}

h4{font-size:1em;}

.sepT
{
	display:block;
	padding:14px 0 0 0;
	margin:4px 0 -4px 0;
	border-top:1px dotted #ccc;
}

.sepB
{
	display:block;
	padding:6px 0 0 0;
	margin:4px 0 8px 0;
	border-bottom:1px dotted #ccc;
}

a
{
	text-decoration:none;
	color:#286ea0;
}

a:hover
{
	text-decoration:underline;
	color:#286ea0;
}

a img{border:0;}

#footer
{
	clear:both;
	margin:0 auto;
	padding:0 0 30px 16px;
	border-top:6px solid #f0f0f0;
	width:100%;
	text-align:left;
	color:#808080;
	font-size:1em;
}

#footer a
{
	color:#808080;
	text-decoration:none;
}

a.eci{background:transparent url('../images/eciTag.png') center left no-repeat; padding:0 0 0 40px;}

#footer a:hover{text-decoration:underline;}

.left
{
	margin:10px 10px 5px 0;
	float:left;
}

.right
{
	margin:10px 33px 5px 0;
	float:right;
}

.textright{text-align:right;}

.center{text-align:center;}

.small{font-size:0.8em;}

.bold{font-weight:bold;}

.hide{display:none;}

.block
{
	display:block;
	padding:4px 0 0 0;
	margin:28px 0 0 0;
	border-top:1px dotted #ccc;
	width:96%;
}

/* formatting of the news item display contents */
.nm_row_even{background:#eee;}

.nm_row_odd{background:#fff;}

.nm_title
{
	border:1px dotted #ccc;
	border-width:1px 0;
	padding:0 7px;
}

.nm_title h3{margin:0 0 -10px 0;}

.nm_title p{line-height:1.2em;}

/* a new button holding class to hold all forms in one div */
.nm_buttons
{
	display:block;
	height:20px;
}

.nm_buttons form
{
	float:left;
	margin:4px 0 0 0;
}

.nm_buttons form input
{
	background:#333;
	width:97px;
	height:26px;
	border:1px solid #666;
	border-width:0 1px 0 0;
	padding:0;
	margin:0;
	color:#fff;
	text-align:center;
	font:normal 11px verdana, arial, sans-serif;
	cursor:hand;
}

.nm_buttons form input:hover
{
	color:#ccc;
	background:#23528a top left repeat-x;
	cursor:hand;
}

/*
custom size news widget, mostly built for homepage side panel 
but could go in a number of places really
*/
#newsWidget
{
	border:1px dotted #ccc;
	border-width:0px;
	position:relative;
	width:198px;
	padding:0;
	margin:0 10px;
	text-align:left;
}

#newsWidget h3{margin-top:10px;}

/* form styling */
.forms
{
	width:367px;
	margin:10px 0 0 0;
	padding:10px 10px 0 10px;
}

.forms fieldset
{
	padding:20px 0 20px 0 !important /*Non-IE6*/;
	padding:0 /*IE6*/;
	margin:0 0 20px 0;
	border:1px solid #eee;
}

.forms fieldset legend
{
	margin:0 0 0 5px !important /*Non-IE*/;
	margin:0 0 20px 5px /*IE6*/;
	padding:0 2px 0 2px;
	color:#666;
	font-weight:bold;
	font-size:100%;
}

.forms label.left
{
	float:left;
	width:100px;
	margin:0 0 0 1px;
	padding:2px 14px 2px 2px;
	font-size:90%;
	text-align:right;
}

.forms select.combo
{
	width:205px;
	padding:2px;
	border:solid 1px #736951;
	font-family:verdana,arial,sans-serif;
	font-size:80%;
}

.forms input.field
{
	width:205px;
	padding:2px;
	border:solid 1px #736951;
	font-family:verdana,arial,sans-serif;
	font-size:80%;
}

.forms textarea
{
	width:205px;
	padding:2px;
	border:solid 1px #736951;
	font-family:verdana,arial,sans-serif;
	font-size:80%;
}

.forms input.button
{
	float:right;
	width:9.0em;
	margin:0 48px 20px 0;
	padding:1px !important /*Non-IE6*/;
	padding:0 /*IE6*/;
	/*background:url('../images/active.jpg');
	border:solid 1px #736951;
	text-align:center;
	font-family:verdana,arial,sans-serif;
	color:#000;*/
	font-size:100%;
}

.forms input.button:hover
{
	cursor:pointer;
	/*border:solid 1px #736951;
	background:url('../images/over.jpg');
	color:#fff;*/
}

/* format the message when written back to the browser */
.formOutput{border:1px solid red;}
.formOutput ul{list-style:none;}

/* dealing specifically with the fieldset on the ajax forms */
#ajaxSearch_form fieldset{border:1px solid #eee;}

/*formatting the hr element sitewide */
hr{border:1px dotted #ccc; border-width:1px 0 0 0; background:#fff;}

/* google maps specific */
#map
{
	width:390px;
	height:330px;
}

#map a, #map a img, #map img{background:transparent;}

#side_bar
{
	background:#eee;
	position:relative;
	width:390px;
	margin-top:10px;
}

#side_bar ul
{
	border:1px solid #eee;
	border-width:0 1px 1px 1px;
	list-style:none;
	margin:0;
	padding:0;
}

#side_bar ul li
{
	text-align:left;
	background:#fff;
	margin:1px 0 0 0;
}

#side_bar a
{
	line-height:1.3em;
	display:block;
	padding:2px;
}

#side_bar a:hover
{
	background:#23528a;
	color:#fff;
	text-decoration:none;
}

/* search results */
.AS_ajax_resultLink{font-size:130%; font-weight:bold;}
.AS_ajax_extract{padding:0 20px; border-bottom:1px dotted #ccc;}

/* emphasised links sitewide [boxes] */
a.emphLink, .job_desc_link a, .news_desc_link a
{
	border:1px solid #ccc;
	background:#008cba;
	color:#fff;
	padding:3px 7px 4px;
	text-decoration:none !important;
}

a.emphLink:hover, .job_desc_link a:hover{background:#fff; color:#000;}

/* formatting of job pages */
.pdfLink
{
	padding:0 0 0 22px;
	background:url('../images/pdf_icon.jpg') center left no-repeat;
}

/* formatting of job listing */
.job_list_item
{
	border-top:1px dotted #ccc;
	padding-top:12px;
	margin-bottom:16px;
}

.job_list_introText{font-weight:bold;}

.job_documentInfo{font-size:80%;}

.job_desc_link{margin-top:10px;}

/* formatting of news listing */
.news_list_item
{
	border-top:1px dotted #ccc;
	padding-top:12px;
	margin-bottom:16px;
}

.news_list_introText{font-weight:bold;}

.news_documentInfo{font-size:80%;}

.news_desc_link{margin-top:10px;}

/* formatting of news listings in right panel */
.news_list_fp_item
{
	border-top:1px dotted #ccc;
	padding-top:12px;
	margin-bottom:16px;
	padding-left:5px;
}

.news_list_fp_introText{font-weight:bold;}

.news_fp_documentInfo{font-size:90%;}

.news_desc_fp_link{margin-top:10px;}

/* pagination */
.paginateDet{font-size:80%;}
#ditto_pages .ditto_currentpage
{
	border:1px solid black;
	padding:1px 5px 2px;
	margin-right:1px;
	background-color:#008CBA;
	color:#fff;
}

#ditto_pages .ditto_off
{
	border:1px solid #ccc;
	padding:1px 5px 2px;
	margin-right:1px;
	color:#ccc;
}

#ditto_pages a, #ditto_pages a:link, #ditto_pages a:visited
{
	border:1px solid #008CBA;
	padding:1px 5px 2px;
	margin-right:1px;
	text-decoration:none !important;
	color:black;
}

#ditto_pages a:hover
{
	background-color:#fff;
	color:#000;
}	

/* formatting of links page items */
.extLinkHolder{width:98%;}
.extLinkItem
{
	border:1px dotted #ccc;
	width:180px;
	height:134px;
	float:left;
	margin:0 6px 6px 0;
	overflow:hidden;
	background:#eee;
}
#content .extLinkItem img{padding:0;border:0px dotted #ccc; border-width:0 0 1px 0}
#content .extLinkItem{text-align:center;}

.clear{clear:both; display:block; margin-top:1px;border:0px solid #fff;}
.clearLeft{clear:left;}

/* Accordion */
.accordion_toggle
{
	display:block;
	height:30px;
	width:380px;
	background:#333;
	padding:0 10px 0 10px;
	line-height:30px;
	color:#fff;
	font-weight:normal;
	text-decoration:none;
	outline:none;
	font-size:12px;
	border-bottom:1px solid #666;
	cursor:pointer;
	margin:0 0 0 0;
}
		
.accordion_toggle_active
{
	background:rgb(35,82,138);
	color:#fff;
	border-bottom:1px solid rgb(35,82,138);
}
		
.accordion_content
{
	background-color:#fff;
	overflow:hidden;
}
			
.accordion_content h2
{
	margin:15px 0 5px 10px;
	color:#333;
}
			
.accordion_content p
{
	line-height:150%;
	padding:5px 10px 15px 10px;
}

/* Accordion Container styling*/
#horizontal_container
{
	margin: 20px auto 20px auto;
	width: 380px;
	height: 20px;
}

/* donation specific */
#content h3.donateSuccess
{
	display:block;
	background-color:#cc6;
	border:1px solid #000;
	color:#000;
	padding:3px 5px 2px 5px;
}

#content h3.donateError
{
	display:block;
	background-color:#f99;
	border:1px solid #000;
	color:#000;
	padding:3px 5px 2px 5px;
}

label.error
{
	display:block;
	width:205px;
	padding:2px;
	margin-left:117px;
	border:1px solid #f00;
	background:#f99;
	font-family:verdana,arial,sans-serif;
	font-size:80%;
}

/* temp div for developer notes */
.devNotes
{
	border:4px solid #666;
	background:#bbb url('../images/devNotes.png') top left no-repeat;
	color:#333;
	padding:10px;
	font-size:.8em;
	line-height:1.2em;
}
.facebook
{
	margin:0 0 0 0;
	border-style:none;
	padding:0 0 0 0;
}
.twitter
{
	margin-top:-2px;
}