/*
   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%; 
}