/*
 * Media query commands for responsive web design
 * see https://www.sitepoint.com/responsive-web-design-tips-and-notes/
 *
 */
 
 /*
 	* Large Screen Rule
 	*
	* "By setting the series of CSS rules above, devices whose screens
  * have a maximum width of 980 pixels, the box content will occupy 60%
  * of the width (with a 3% top and bottom padding and a 4% lateral one),
  * while the sidebar will occupy 30% of the total width of the screen."
  *
  */
 @media screen and (max-width: 980px)
 {
    #pagewrap
    {
       width: 95%;
    }
 
    #content
    {
       width: 60%;
       padding: 3% 4%;
    }
 
    #sidebar
    {
       width: 30%;
    }
 }

 /*
 	* Smaller Screen Rule
 	*  *
  */
 @media screen and (max-width: 480px)
 {
    #pagewrap
    {
       width: 95%;
    }
 
    #content
    {
       width: 60%;
       padding: 3% 4%;
    }
 
    #sidebar
    {
       width: 30%;
    }
 }