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

*/


/* Main Styles */

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


/* Infographic Styles */

div.infobox {
	position: absolute;
}
div#info1 {
	display: block;
	top: 20px;
	left: 5%;
}
div#info2 {
	display: block;
	top: 185px;
	left: 42%;
}
div#info3 {
	display: block;
	top: 135px;
	left: 75%;
}
div#info4 {
	display: block;
	top: 510px;
	left: 8%;
}
div#info5 {
	display: block;
	top: 800px;
	left: 3%;
}
div#info6 {
	display: block;
	top: 600px;
	left: 48%;
}
div#info7 {
	display: block;
	top: 1000px;
	left:68%;
}
div#info8 {
	display: block;
	top: 1100px;
	left:12%;
}

/* First Infographic */



/* Second Infographic */



/* Third Infographic */



/* Fourth Infographic */



/* Fifth Infographic */



/* Sixth Infographic */



/* Seventh Infographic */



/* Eighth Infographic */