body, html {			/* Sets red background by tiling a small image*/

	margin: 0px;
	
 	padding: 0px;
	
	background-image: url(../resources/global/body_bg.png); background-repeat: repeat;

}

#header {		/* Draws Miele header bar and top of white box */
			
	position: absolute;
	
	top: 0px; left: 0px;
							
	width: 100%;
	
	min-width: 1200px;
	
	height: 150px;
	
	background-image: url(../resources/global/logo_bar.png); background-position: center; background-repeat: no-repeat; background-color: white;
		
}

body {		/* Padding ensures body starts below the wide logo bar at top, min-width prevents floating columns from going wrong */

	padding: 150px 0px 0px 0px;
		
	min-width: 1200px;

}

#wrap {		/* Draws the centre-section of white box using wide, thin image; width and padding align it with logo bar */

	background-image: url(../resources/global/content_container.png); background-repeat: repeat; background-position: center;
    
    margin: 0px auto;
    
    max-width: 1060px;
    
    padding: 0px 20px 0px 20px;
        
}
     
#sidebar {
	
	float: left;

	width: 205px;
		
	margin: 0px 20px 0px 0px;
			
}


#main {		/* Border draws line down length of page to separate sidebar, padding bumps text inwards */
    
    float: left;
    
    width: 800px;
    
    border-left: solid black 1px;
    
	padding: 0px 0px 0px 30px;
	    
}


iframe {

	width: 100%;
		
	height: 100%;
	
	min-height: 650px;
	
}

    
#footer {		/* Clear sinks footer to bottom of page, background draws bottom of white box, margin aligns footer with sides of box */
    
	clear: both;
	
	margin: 0px -20px 0px -20px;
		
	height: 150px;
	
	background-image: url(../resources/global/footer.png); background-position: center; background-repeat: no-repeat;
	
}