/* Customised styles specific to Slade Group */

#sg_outer{
	height:100%;
	display:table !important;
	display:block;
	position:static !important;
	position:relative;
	}

#sg_middle {
	position:static !important;
	position:absolute;
	top:auto !important;
	top:50%;
	display:table-cell !important;
	display:static;
	vertical-align:middle;
	}

#sg_inner {
	position:static !important;
	position:relative;
	top:auto !important;
	top:-50%;
	}

.sg_leftBorder {
	background:#fff url(images/left_bg.gif) repeat-y top left;
	height:1%;
	}

.sg_rightBorder {
	background:url(images/right_bg.gif) repeat-y top right;
	height:1%;
	margin-right:-1px !important;
	margin-left:1px;
	padding-bottom:10px;
	}

.sg_2ColLayout .fs_col1 {
	float:left;
	margin:0 !important;
	width:65% !important;
	display: block !important;
	display: inline; /* IE hack */
	}

.sg_2ColLayout .fs_col2 {
	float:left;
	margin:0 !important;
	clear:none !important;
	width:34% !important;
	}

.sg_2ColLayout .fs_col2{
	text-align:center;
	}

.transparent[class] {
	}

#sg_nav .sg_rootLeft {
	display:block;
	position:absolute;
	left:0;
	top:0;
	width:7px;
	height:32px;
	background:url(images/nav/root_left.gif) no-repeat top left;
	}

#sg_nav .sg_rootRight {
	display:block;
	position:absolute;
	right:0 !important;
	right:-2px;
	top:0;
	width:7px !important;
	width:8px;
	height:32px;
	background:url(images/nav/root_right.gif) no-repeat top left;
	}

/* Header graphics and styles */

#fs_header #sg_headerLeft {
	position:absolute;
	display:block;
	left:0;
	bottom:0;
	width:13px;
	height:76px;
	}

#fs_header #sg_headerRight {
	position:absolute;
	display:block;
	right:-1px !important; /* Fix a 1 pixel gap that kept appearing */
	right:-1px;
	bottom:0;
	width:16px;
	background-color:#E5E5E5;
	height:76px;
	}
	
/* HC1 - Grey */

#fs_header.sg_hc1 {
	background:url(images/header/grey_middle.gif) repeat-x bottom left;
	}

#fs_header.sg_hc1 #sg_headerLeft {
	background:url(images/header/grey_left.gif) no-repeat bottom left;
	}

#fs_header.sg_hc1 #sg_headerRight {
	background:url(images/header/grey_right.gif) no-repeat bottom right;
	}

/* HC2 - Orange */
.sg_hc2 {
	background:url(images/header/orange_middle.gif) repeat-x bottom left !important;
	}

#fs_header.sg_hc2 #sg_headerLeft {
	background:url(images/header/orange_left.gif) no-repeat bottom left;
	}

#fs_header.sg_hc2 #sg_headerRight {
	background:url(images/header/orange_right.gif) no-repeat bottom right;
	}

/* HC3 - Red */
.sg_hc3 {
	background:url(images/header/red_middle.gif) repeat-x bottom left !important;
	}

#fs_header.sg_hc3 #sg_headerLeft {
	background:url(images/header/red_left.gif) no-repeat bottom left;
	}

#fs_header.sg_hc3 #sg_headerRight {
	background:url(images/header/red_right.gif) no-repeat bottom right;
	}

/* HC4 - Blue */
.sg_hc4 {
	background:url(images/header/blue_middle.gif) repeat-x bottom left !important;
	}

#fs_header.sg_hc4 #sg_headerLeft {
	background:url(images/header/blue_left.gif) no-repeat bottom left;
	}

#fs_header.sg_hc4 #sg_headerRight {
	background:url(images/header/blue_right.gif) no-repeat bottom right;
	}

/* HC5 - Green */
.sg_hc5 {
	background:url(images/header/green_middle.gif) repeat-x bottom left !important;
	}

#fs_header.sg_hc5 #sg_headerLeft {
	background:url(images/header/green_left.gif) no-repeat bottom left;
	}

#fs_header.sg_hc5 #sg_headerRight {
	background:url(images/header/green_right.gif) no-repeat bottom right;
	}
	
/* HC6 - Brown */
.sg_hc6 {
	background:url(images/header/brown_middle.gif) repeat-x bottom left !important;
	}

#fs_header.sg_hc6 #sg_headerLeft {
	background:url(images/header/brown_left.gif) no-repeat bottom left;
	}

#fs_header.sg_hc6 #sg_headerRight {
	background:url(images/header/brown_right.gif) no-repeat bottom right;
	}

/* HC7 - Pink */
.sg_hc7 {
	background:url(images/header/pink_middle.gif) repeat-x bottom left !important;
	}

#fs_header.sg_hc7 #sg_headerLeft {
	background:url(images/header/pink_left.gif) no-repeat bottom left;
	}

#fs_header.sg_hc7 #sg_headerRight {
	background:url(images/header/pink_right.gif) no-repeat bottom right;
	}


/* Footer graphics and styles */

#fs_footer {
	background:url(images/bottom_middle_bg.gif) repeat-x top left;
	height:200px;
	}

#sg_footerLeft {
	position:absolute;
	z-index:0;
	height:12px;
	width:13px;
	background:url(images/bottom_left_bg.gif) no-repeat top left;
	left:0;
	top:0;
	}

#sg_footerRight {
	position:absolute;
	z-index:0;
	background:url(images/bottom_right_bg.gif) no-repeat top left;
	right:-1px !important;
	right:-4px;
	top:0px;
	height:12px;
	width:13px !important;
	width:16px;
	}


/* FLUID Suckerfish dropdowns WITH OPACITY */

/*
	These are heavily modified suckerfish dropdowns. They are fluid in width,
	with drop-downs also being similarly fluid. In addition to this, a png
	hack is used to give the drop downs a bit of opacity in ALL modern browsers
	EVEN IE 6! Heck even IE 5.5 Windows works?!
*/


/* This wrapper is used to hold the floated list items and avoids float wraps */
#sg_nav_wrapper {
	position:absolute;
	left:1.4%;
	margin:0 auto;
	height:35px;
	top:95px;
	width:100%;
	text-align:center;
	}

#sg_nav ul {
	list-style:none;
    position:absolute;
    display:block;
    height:35px;
    width:100%;
    top:0px; /* Let mozilla know where to position vertically - sigh */
    margin:0;
    padding:0;
    left:0;
    font-weight:bold;
    color:darkorange;
    text-align:center;
	}

#sg_nav ul li {
 	float:left;
 	position:relative;
	width:23.5%;
	height:35px;
	line-height:35px;
	text-align:left;
	margin:0 1% 0 0;
	padding:0;
	background:url(images/nav/root_middle.gif) repeat-x top left;
	}
	
#sg_nav ul li h6 {
	position:relative;
	width:auto;
	height:auto;
	}

#sg_nav ul li a {
	display:block !important;
	height:35px;
	line-height:35px;
	padding-left:11px;
	position:relative;
	font-size:.916em;
	font-weight:bold;
	text-decoration:none;
	color:#000;
	width:auto;
	}

#sg_nav ul li a:hover {
	color:darkorange;
	}

/* I guess Mozilla doesnt like the idea of setting the size of list items inside
   these lists to percentages. For some reason, the hidden UL is still present on
   the screen, EVEN though we have moved them off to the left-hand side... This
   will affect accessibility in non-IE browsers - 
*/

#sg_nav li ul {
	visibility:hidden;
	display:block;
	position:absolute;
	width:auto;
	left:-999em;
	text-align:left;
	}

/* General List styles for both browsers */
/* Note the transparent gif that has been used here... This is for IE's benefit.
   It stops a weird bug involving the drop-down and the content behind. If a
   background colour is not specified (as is the case with our Opacity trick)
   content behind the drop-down starts to take presedence - EVEN though the drop-
   down is absolutely positioned ABOVE the content. This has nothing to do with
   z-ordering or source order... Try removing the background attribute to see...
*/

#sg_nav li ul li {
	margin:0;
	padding:0;
	display:block;
	position:relative;
	background:url(images/transparent.png) repeat top left !important;
 	background:url(images/transparent.gif) repeat top left;
	text-align:left;
	}

/* For both browsers */
#sg_nav li:hover ul, #sg_nav li.sfhover ul {
 	margin:0;
	padding:0;
	top:35px;
	left:auto;
	text-align:left;
	position:absolute;
	z-index:9999;
	visibility:visible; /* This is very important for Mozilla */
	display:block !important;
	width:100%;
	}

/* For list items once the hover has occured */
#sg_nav li:hover ul li, #sg_nav li.sfhover ul li {
 	width:100% !important;
 	display:block !important;
 	height:auto !important;
 	height:1%;
	}

#sg_nav li ul li a {
	height:auto !important;
	line-height:1.666em !important;
	color:#fff;
	margin:auto !important;
	z-index:9999;
	}

#sg_nav li ul li a:hover {
	color:#BFBFBF;
	}

#sg_nav li ul li ul {
	display:block;
	position:relative;
	}

#sg_logo {
	position:absolute;
	top:22px;
	left:0;
	}

#sg_title {
	position:absolute;
	top:32px;
	right:1.6%;
	overflow:hidden;
	height:60px;
	}
	
.sg_level2 {
	padding:0;
	padding-left:20px;
	margin:0;
	}

.sg_level2 br {
	margin:0;
	padding:0;
	}

.sg_applyOnline {
	margin-top:10px;
	cursor:pointer;
	cursor:hand;
	}

#sg_featureBanner {
	margin-left:1.6%;
	}

.sg_printPage {
	margin-left:10px;
	}

/* Blog and Blog_comment template specific styles */
.sg_addComment {
	margin-top:10px;
	background-color:#E5E5E5;
	padding:5px;
	border-bottom:1px solid white;
	}