/* 
	Layout CSS
	Version : 1.2
	Filename : _layout.css
	Type: DEVOLVED - External
	Date created : 31/10/2006
	Validates : CSS2, CSS2.1, CSS3
								
	Known issues:
	- IE5 sets width on columns such that wrapping occurs (Fixed?)
	- Safari hack for positioning of secondary content (circa lines 114-115)
	- z-index set to 5000 on line 23 for adverts							
*/

/* Default layout for content pages */
#main { position: relative; margin-left: 88px; margin-top: 9em; z-index: 1000; padding-top: 1em; } /* need position relative to enable z-index */

#content { margin-left: 184px; padding: 0 20px 0 20px; word-wrap: break-word; position:relative; }
#content { margin-top: 1px; } /* Fixes float problem in safari*/ 
/* Italic Bug (http://positioniseverything.net/explorer/italicbug-ie.html) */
/* Also fixes pixel jog bug */
/* \*/ * html #content { overflow: hidden; o\verflow: visible; width: 98%; w\idth: auto; he\ight: 1%; } /* */

/* Adverts (third column), default is hidden, see .page-content-threecolumn */
#adverts { display: none; position: absolute; top: 12.5em; right: 0; width: 170px; z-index: 5000; }

/* footer */
#footer	{ font-size: 0.85em; position: relative; clear: both; margin: 3em 0 0 88px ; padding: 0.5em 0 0 0; width: auto; }
.nav-footer-sponsors { margin-top: 3em; padding: 0.6em 0em 0.6em 0em; width: 100%; border-top: 1px solid #cccccc; clear: both;  }	
.nav-footer-sponsors .logo, 
.nav-footer-sponsors .description { float: left; text-align: top; margin: 0; padding: 0 0 0 0.5em; }
.nav-footer { border-top: 1px solid #cccccc; border-bottom: 1px solid #cccccc; margin: 0; padding: 0.6em 0.5em 0.6em 0.5em; }

.feedback { background-color: inherit; color: #999999; display: block; text-align: right; padding: 0.2em 0.5em 0.4em 0.5em; }
.feedback p { margin: 0; padding: 0.2em 0 0 0; }

/* Column layouts, used for home pages */
.content-column1,
.content-column2,
.content-column3,
.content-column4,
.content-column25percent,
.content-column30percent,
.content-column33percent,
.content-column40percent,
.content-column50percent,
.content-column60percent,
.content-column70percent { float: left; margin-right: 0.5%; height: 15em; overflow: hidden; }
.content-column1,
.content-column2,
.content-column3,
.content-column4,
.content-column25percent { width: 24%; }
.content-column30percent { width: 28%; }
.content-column33percent { width: 31%; }
.content-column40percent { width: 38%; }
.content-column50percent { width: 48%; }
.content-column60percent { width: 58%; }
.content-column70percent { width: 68%; }

/* Home page style 1 */
.page-home #content { border-bottom: 5px solid #cccccc; margin-left: 0; margin-bottom: 1em; padding: 0; width: 99%; clear: both; height: 150px; overflow: hidden; }
.page-home #content-primary { clear: both; }
.page-home #content-secondary { clear: both; }
.page-home .boxpromo { margin-top: 0; }
.page-home-twocolumn5050 .content-column1
.page-home-twocolumn5050 .content-column2 { width: 48%; }
.page-home-twocolumn6040 .content-column1
.page-home-twocolumn4060 .content-column2 { width: 58%; }
.page-home-twocolumn4060 .content-column1
.page-home-twocolumn6040 .content-column2 { width: 38%; }
.page-home-twocolumn7030 .content-column1
.page-home-twocolumn3070 .content-column2 { width: 68%; }
.page-home-twocolumn3070 .content-column1
.page-home-twocolumn7030 .content-column2 { width: 28%; }
.page-home-twocolumn5050 .content-column3,
.page-home-twocolumn5050 .content-column4,
.page-home-twocolumn6040 .content-column3,
.page-home-twocolumn6040 .content-column4,
.page-home-twocolumn4060 .content-column3,
.page-home-twocolumn4060 .content-column4,
.page-home-twocolumn7030 .content-column3,
.page-home-twocolumn7030 .content-column4,
.page-home-twocolumn3070 .content-column3,
.page-home-twocolumn3070 .content-column4 { display: none; }
.page-home-threecolumn .content-column1, 
.page-home-threecolumn .content-column2,
.page-home-threecolumn .content-column3 { width: 31%; }
.page-home-threecolumn .content-column4 { display: none; }
.page-home-fourcolumn .content-column1,
.page-home-fourcolumn .content-column2,
.page-home-fourcolumn .content-column3,
.page-home-fourcolumn .content-column4 { width: 23%; }

/* Home page style 2 */
.page-home-style2 #content { margin: 0; padding: 0; float: left;  }
.page-home-style2 #content-primary { margin: 0; padding: 0; width: 330px; float: left; clear: both;}
.page-home-style2 #content-secondary { margin: 0; padding: 0; width: auto; margin-left: 340px; }
.page-home-style2 .boxpromo .footer { clear: none; }
.page-home-style2 .boxsplashleader .footer { margin: 3em 0.5em 0.5em 0.5em; /* Start IE6 hack */ _margin: 0.5em 0.5em 0.5em 0.5em; /* End IE6 hack */padding: 0 0 5px 0; font-family: Verdana, Arial, Helvetica, Sans-Serif; font-size: 1em; color: #ffffff; }
.page-home-style2 #content-primary .boxpromo,
.page-home-style2 #content-secondary .boxpromo { margin: 0; margin-bottom: 1em; width: auto; }
.page-home-style2 #content-secondary .boxpromo img { position: relative; }

/* Two column content page */
.page-content-default #content,
.page-content-twocolumn #content { margin-right: 0; } 
.page-content-default #adverts,
.page-content-twocolumn #adverts { display: none; }

/* Three column content page */
.page-content-threecolumn #content { margin-right: 170px; }
.page-content-threecolumn #adverts { display: block; }

/* Leader page style 1 - fixed width splash image and primary content with right side secondary content*/		
.page-leader-style1 #content { margin: 0; padding: 0; float: left; width: 482px; }
.page-leader-style1 #content-primary { margin: 0; padding: 0; width: 275px; margin-left: 204px; }
.page-leader-style1 #content-secondary { margin: 0; padding: 0; width: auto; margin-left: 502px;}
.page-leader-style1 .boxpromo .footer { clear: none; }
.page-leader-style1 #content-primary .boxpromo,
.page-leader-style1 #content-secondary .boxpromo { margin: 0; margin-bottom: 1em; width: auto; }
.page-leader-style1 #content-secondary .boxpromo img { position: relative; }

/* Leader page style 2 - splash image above primary and secondary content */
.page-leader-style2 #content { padding-right: 0;}
.page-leader-style2 #content-primary { float: bottom; width: 49%; }
.page-leader-style2 #content-secondary { float: bottom; width:49%; }
/* START HACK:*/ 
/* safari will ignore the code below and by default the other browsers will use the code below */
.page-leader-style2 #content-primary { float: left; width: 49%;# }
.page-leader-style2 #content-secondary { float: right; width: 49%;# }
/* END HACK */

/* box model issue with IE5, need width hack 
.page-leader-style2 .boxpromo { margin: 0px; margin-bottom: 1em; }
.page-leader-style2 .body { position: relative; } */

/* IE5 only hacks for: */
/*	1. double margin bug */
/*	2. four-column redraw and positioning problems */
/* 	3. column widths for promo boxes */
*html.nav-secondary-breadcrumb li{ margin: 0 0 0 0; padding:0; }
*html.nav-secondary-breadcrumb a { padding: 0.4em 0 0em 1.6em; margin:0 0 -8px 0; }
*html.nav-secondary-sectionmenu li{ margin: 0 0.5em -8px 0.5em; padding: 0.4em 0 0px 1.6em; }
*html.nav-secondary-relatedlinksheader { margin: 1.5em 0 0 0; } 
*html.content-column25percent { width: 21%; }