/*
	      div#header
	           b	          
	      Logo | Header
	<----a---->+<---------------c-------------->+<---e---->
	      Menu |<d>Content					 <d>|<d>News<d>
	 div#menu  |							div#main		
	           |     div#content				|  div#sidebar
	           |								|
	           |								|
	           |								|
NB: The logo image consists of the logo itself and the header bar
	Also the size of the header bar is not reflected in any other element, ie it can end before or after the news

a: width of the menu/logo (defined by the logo width / the menu image width)
b: height of the header/logo (defined by the logo image height)
c: the width of the content
d: the padding of both the content and the news bar at both sides
e: the width of the news bar
*******************************************************************************/

/* Global */
html {
	margin: 0;
	padding: 0;
}

body {
	margin: 0;
	padding: 101px 0 0 212px;	/* b 0 0 a */ 
}

div#main {
	z-index: 0;
}
/******************************************************************************/

/* Header */
div#header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 101px;				/* b */
	z-index: 99;
	
	margin: 0;
	padding: 0;

	background: transparent url("header.png") no-repeat fixed left top;	/* defines b */
	background-color: #fafaff;
}

div#headertext {
	position: fixed;
	top: 98px;					/* b - some pixels */
	width: 100%;
	z-index: 100;
	
	margin: -1.1em 0 0 0em;
	padding: 0;
}

div#headertext h1 {
	margin: 0;
	padding: 0;
	padding-left: 0.1em;
}
/******************************************************************************/

/* Menu */ 
div#menu {
	position: fixed;
	top: 101px;					/* b */
	left: 0;
	width: 212px;				/* a */
	height: 100%;
	z-index: 97;
	
	margin: 0;
	padding: 0;

	background: transparent url("menu.png") no-repeat fixed left top;	/* defines a */
	background-color: #fafaff;
}

div#menu p {
	margin: 1em 0 1em 0;
	padding: 0 0.5em 0.2em 0;
}

div#menu p a {
	margin: 0;
	padding: 0;
}
/******************************************************************************/

/* Content */
div#content {
	width: 586px;				/* c */

	margin: 0;
	padding: 4px 7px 4px 7px;	/* ? d ? d */
}
/******************************************************************************/

/* Sidebar */
div#sidebar {
	position: absolute;
	top: 101px;					/* b */
	left: 812px;				/* a+c + 2*d */
	width: 200px;				/* e */
	
	margin: 0;
	padding: 4px 7px 4px 7px;	/* ? d ? d */
}

div#sidebar div.news {
	margin: 0.5em 0 0.5em 0;
}

div#sidebar div.news h3 {
	margin: 0;
	padding: 0.15em 0.2em 0.1em 0.2em;
}

div#sidebar div.news p {
	padding: 0;
	margin: 0.2em;
}

div#sidebar div.news h6 {
	margin: 0;
	padding: 0 0.4em 0 0.4em;
}

div#sidebar h2 {
	margin-bottom: 0.5em;
	margin-top: 0.5em;
}
/******************************************************************************/

