/* Header and footer.
		Define the background graphics etc.
		There are two headers so that if you need, you can have two graphics in the
		header. One in the top left, and one in the top right perhaps.
 */
	
#header1 {
	margin:0; padding:0;
	background-color: #1D92A7;
	background-image:url('img/header_tile.jpg');
	background-repeat: repeat-x;
	height: 132px;
}	
#header2 {
	margin:0; padding:0;
	background-repeat:no-repeat;
	background-position:top left;
	background-image:url('img/header_top_left.jpg');
	height: 132px;
}	
	
#footer {
	margin:0; padding:0;
	background-color: #1D92A7;
	background-image:url('img/footer_tile.jpg');
	background-repeat: repeat-x;
	height: 37px;
}	

/* Main1, and main 2
		NO padding or margin.
		stipulate the repeated graphic for the left and right column, 
		if one exists.
*/
#layout-container {
	margin:0; 
	padding:0;
	/*
	Cathcare needed this removed - 19th Sep 2011
	background-image:url('img/trustmark.jpg');
	background-repeat:no-repeat;
	background-position:bottom right;*/
	
	background-image:url('img/qic_logo_150.jpg');
	background-repeat:no-repeat;
	background-position:bottom right;
	
}
	
#tile-backing1 {
	margin:0;
	padding:0;
	background-image: url('img/tile_backing_tile.jpg');
	background-repeat: repeat-y;		
}
	
/* Left, Right, Middle
	Float left, Float right, and NO FLOAT (respectively)
	Middle seems to stay in the middle by
	putting a 150px margin on it's left and right. This compensates for the
	150px width that the left and right cols have.

*/

#left {
	float:left;
	width:142px;
	background-color:#E6E6E6;

	margin:0; 
	padding:0;
	
}
#right {
	float:right;
	width:165px;
	margin:0px 5px 130px 10px; 
	padding:5px 0px 0px 0px;	

}

#right-out{
	background-color:#E6E6E6;
	background-image:url('img/right_box_bg.jpg');
	background-repeat:no-repeat;
	background-position:top left;

}

#right-in{ /* nested inside #right */
	width:159px;
	margin:0;
	padding:5px 3px 5px 3px;
	background-image:url('img/right_bottom_bg.jpg');
	background-repeat:no-repeat;
	background-position:bottom left;

}

#right-out span{ /* this is the 'news' title */
	color:#FFFFFF;
	font-weight:bold;
	margin:0px 0px 0px 65px;
	padding: 0px 0px 0px 0px;
}

#frontflash{
	margin: 0px 0px 0px 100px ;
	width:533px;
	height:203px;
	z-index:-1;
}
#frontflash object{
	z-index:-1;

}

	/*     top, right, bottom, left */
#middle {
	margin: 0 190px 0 155px; 
}

/* 
The following three styles help place the login, sitemap, 
and insitec logo all on the one line.

*/
	
#footer_left{
	width: 142px;
	float: left;
	background-image: url('img/footer_bottom_left.jpg');
	background-repeat: repeat-y;
	background-position: top right;	
	height:37px;
	
}

#footer_right{
	width: 175px;   /* The width of the insitec logo */
	float: right;
	height:37px;
}

#footer_middle{
	margin: 0 190px 0 155px;
	text-align: center; 
	height:37px;
}

/* column-in
		Margin 0, padding is what you want for that column for 
		the text to be spaced from column border.

*/
.column-in {

}

/* cleaner
		This should stay unchanged. It sits down the bottom of main div box, 
		and makes sure that the three columns are all cleaned off.
		
		How? I don't know. Can you work it out?

*/		
.cleaner {
	clear:both;
	height:1px;
	font-size:1px;
	border:none;
	margin:0; padding:0;
	background: transparent;
	}
