/*
   New Perspectives on HTML5 and CSS3, 8th Edition
   Tutorial 3
   Tutorial Case
   
   Positioning Styles for the pc_info.html file
   Author: 
   Date:   
   
   Filename: pc_info.css

*/


/* Main Styles */

main {  
	overflow: auto;
	position: relative;  
	height: 450px;  
	width: 100%;  
} 


/* Infographic Styles */

div.infobox {  
	position: absolute;  
} 


/* First Infographic */

div#info1 {  
	display: block;  
	top: 20px;  
	left: 5%;  
} 

/* Second Infographic */

div#info2 {  
	display: block;  
	top: 185px;  
	left: 42%;  
} 

/* Third Infographic */

div#info3 {  
	display: block;  
	top: 135px;  
	left: 75%;  
} 

/* Fourth Infographic */

div#info4 {  
	display: block;  
	top: 510px;  
	left: 8%;  
} 

/* Fifth Infographic */

div#info5 {  
	display: block;  
	top: 800px;  
	left: 3%;  
} 

/* Sixth Infographic */

div#info6 {  
	display: block;  
	top: 600px;  
	left: 48%;  
} 

/* Seventh Infographic */

div#info7 {  
	display: block;  
	top: 1000px;  
	left: 68%;  
} 

/* Eighth Infographic */

div#info8 {  
	display: block;  
	top: 1100px;  
	left: 12%;  
}