/*************************************************************************
	Skills Third Sector
	MODULE: 	home.css
	PURPOSE:	special rules just for homepage
*************************************************************************/

/* Extra clear fixes */

#fourpanelfour li:after {
	content: ".";
	height:0;
	display:block;
	clear:both;
	visibility:hidden;
}

/* Layout (sizes / floats / positions of main elements)
*************************************************************************/
.sechome #main {
	float:none;
	width:962px;
	border:none;
	background:none;
	margin:0;
	padding:0;
}
.sechome #midwrap {
	background:none;
}
.sechome #content {
	margin:0;
}
/* Primary Navigation
*************************************************************************/	
#nav div {
	display:none;
}


/* Intro Area
*************************************************************************/	
#siteintro {
	position:relative;
	width:392px;
	margin:10px 0;
	min-height:300px;
	padding:0 530px 0 40px;
	color:#FFF;
	background:#592049 url(../site_images/bg-home-intro.png) left top no-repeat;
}
#siteintro .pictop {
	position:absolute;
	right:0;
	top:0;
	width:486px;
	height:300px;
	font-size:0;
	margin:0 0 0 40px;
	padding:0;
	overflow:hidden;
}
#siteintro .pictop img {
	display:block;
	margin:0;
	padding:0;
	max-height:300px;
}
#siteintro .pictop div {
	display:block;
	position:absolute;
	width:44px;
	height:300px;
	margin:0;
	padding:0;
	font-size:0;	
	background:url(../site_images/bg-cutoutperson.png) -50px 0 no-repeat;
}
#siteintro h1 {
	color:#F78F1E;
	font-weight:normal;
	font-size:3.3em;
	padding-top:50px;
}
#siteintro a,
#siteintro a:visited {
	color:#F78F1E;
	background:#592049;
	font-weight:bold;
	display:inline-block;
	padding:4px;
	margin:0 0 0 -4px;
}
#siteintro a:hover,
#siteintro a:visited:hover {
	color:#FFF;
	background:#F78F1E
}

/* Panel (Wide)
*************************************************************************/	
.panelwide {
	width:962px;
	background:#FFF url(../site_images/bg-midwraptile-962.png) repeat-y;
}
.panelwide h2 {
	color:#592049;
	font-size:1.6em;
	font-weight:normal;
	padding:10px 20px 20px;
	margin:0;
}
#main .panelwide .shimtop,
#main .panelwide .shimbot {
	width:962px;
	clear:both;
}
#main .panelwide .shimtop {
	background-position:0 -140px;
}
#main .panelwide .shimbot {
	background-position:0 -150px;
}

/***** Colour Panels *****/

.panelwide #infohomeone,
.panelwide #infohometwo,
.panelwide #infohomethree {
	-khtml-border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	padding:10px 15px 0;
	min-height:170px;
	width:264px;
	float:left;
	color:#333;
}
.panelwide #infohomeone {
	background:#B4C01E;
	margin-left:19px;
}
.panelwide #infohometwo {
	background:#F78F1E;
	margin:0 10px 15px;
	width:284px;
}
.panelwide #infohomethree {
	background:#7ECADB;
	margin-right:19px;	
}
.panelwide #infohomeone .buttonmore {
	background-position:-124px;
}
.panelwide #infohometwo .buttonmore {
	background-position:-248px;
}
.panelwide #infohomethree .buttonmore {
	background-position:-372px;
}
.panelwide div h3 {
	color:#FFF;
	font-size:1.25em;
	font-weight:normal;
	line-height:1em;
	width:140px;
	margin-bottom:10px;
}
.panelwide div p {
	font-size:0.9em;
	font-weight:normal;
	line-height:normal;
	margin-bottom:8px;
}
.panelwide div img {
	display:block;
	float:right;
	margin:0 -15px 0 0;
	position:relative;
}
.panelwide div .buttonmore {
	font-size:0.95em;
	line-height:1.7em;
}
.panelwide #infohomeone img {
	margin-top:-51px;
}
.panelwide #infohometwo img {
	margin-top:-37px;
}
.panelwide #infohomethree img {
	margin-top:-49px;
}

/* Panel (Half width)
*************************************************************************/	
.doublepanel {
	width:962px;
	margin-top:10px;
	background:#FFF url(../site_images/bg-home-doublepanel.png) left bottom no-repeat;	
}
.panel {
	width:428px;
	padding:0 24px;
	float:left;
}
#fourpanelone, 
#fourpanelthree {
	margin-right:10px;
}
.panel h2 {
	color:#592049;
	font-size:1.3em;
	font-weight:normal;
	line-height:1em;
	background:#FFF url(../site_images/bg-home-halfpanel.png) left top no-repeat;
	margin:0 -24px 10px;
	padding:20px 24px 0;
}

/*** Panel 1 ***/

#fourpanelone .splitright {
	float:right;
	width:151px;
	margin:40px 0 20px 20px;
}
#fourpanelone .splitright small {
	display:block;
	text-align:center;
}

/*** Panel 2 ***/

#fourpaneltwo img {
	float:right;
	margin:15px 0 0 20px;
}

/*** Panel 3 ***/

#fourpanelthree {
	padding-bottom: 20px;
}

#fourpanelthree dl {
	line-height:1.2em;
	margin:20px 0 10px 0;
	padding:0;
}
#fourpanelthree dt {
	clear:left;
	float:left;
	width:90px;
	padding:0;	
	margin:0 0 20px 0;
	color:#9B7992;	
}
#fourpanelthree dd {
	float:left;
	width:330px;
	padding:0;	
	margin:0 0 20px 0;	
}
#fourpanelthree dd a,
#fourpanelthree dd a:visited {
	display:inline-block;
	color:#666;
	font-weight:bold;
}
#fourpanelthree dd a:hover,
#fourpanelthree dd a:visited:hover {
	color:#FFF;
}

/*** Panel 4 ***/

#fourpanelfour ul {
	margin:20px 0 0 0;
	padding:0;
	list-style:none;
}
#fourpanelfour li {
	clear:both;
	margin:0 0 10px 0;
	padding:0;
	list-style:none;
}
#fourpanelfour li div {
	clear:left;
	float:left;
	position:relative;
	z-index:10;
	width:55px;
	height:38px;
	background:url(../site_images/bg-forumquote-left.png) right 0 no-repeat;
}
#fourpanelfour img {
	display:block;
	border:1px solid #CCC;
	width:34px;
	height:34px;
}
#fourpanelfour blockquote {
	float:left;
	position:relative;
	z-index:5;	
	width:350px;
	margin:0 0 0 -1px;
	padding:5px 10px 0;
	border:1px solid #DED2DB;
	border-bottom:none;
	background:#EEE8EC;
	line-height:1.2em;
}
#fourpanelfour blockquote cite {
	display:block;
	width:350px;
	padding:4px 11px 15px;
	margin:5px -11px 0;
	border-top:1px solid #DED2DB;
	color:#999;
	background:#FFF;
	font-size:0.85em;
	line-height:1.2em;
	font-style:normal;
}
#fourpanelfour blockquote p {
	margin:0;
}

#fourpanelfour blockquote p a,
#fourpanelfour blockquote p a:visited {
	display:inline-block;
	color:#666;
	font-weight:bold;
}
#fourpanelfour blockquote p a:hover,
#fourpanelfour blockquote p a:visited:hover {
	color:#FFF;
}