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

*/

/* Main Styles */
main {  
    position: relative;  
    height: 450px;  
    width: 100%;
    overflow: auto;
} 



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