* {
  /* This is the universal selector: It allows us to style every element
      on a page. In this case, we remove the default browser padding 
      and margin on every element */
  margin: 0;
  padding: 0;
  }
 
body {
  /* Styles applying to the entire page */
  font: 11px/1.5 Verdana, Sans;
  color: #f8f8f8;
  background: #292929;
  text-align: center;
  }
 
#header {
  /* To the header we apply a background image which tiles horizontally */
  height: 168px;
  text-align: left;
  background: url('banner.jpg') repeat-x top left;
  }
 
#wrapper {
  /* The wrapper contains the content area, navigation and footer.
    It's positioned in the center of the page using auto margins */
  width: 780px;
  margin: 0 auto;
  text-align: left;
  }
 
#content, #subContent {
  /* Both the content area and navigation share the same background color */
  background: #3c4040;
  }  
 
#content h2, #subContent h2 {
  /* Section headers share the same tiled background image and font */
  background: #0290fc url('header.jpg') repeat-x top left;  
  font: bold 14px/28px Sans;
  text-indent: 1em;
  }  
 
#content {
  /* The content area is positioned to the right using a right float */
  float: right;
  width: 560px;
  }
 
#subContent {
  /* The navigation is positioned to the left using a left float */
  float: left;
  width: 210px;
  }
 
  /* The following styles apply to lists and links within the navigation */ 
#subContent ul {
  list-style: none;
  margin: 1em;
  }
 
#subContent a {
  color: #ccc;
  font: bold 1.1em Sans-Serif;
  text-decoration: none;
  }
 
#subContent a:hover {
  color: #f0f0f0;
  text-decoration: underline;
  }
 
  /* The following styles apply to the footer and it's contents */
#footer {
  clear: both;
  text-align: center;
  padding: 10px;
  font: 0.8em Sans-Serif;
  }  
 
#footer a {
  color: #27aefe;
  }
 
#footer a:hover {
  color: #FFF;
  }    
 
  /* General styles */  
img {
  border: none;
  }
 
img.left {
  float: left;
  margin: 1em 1em 1em 0;
  }
 
img.right {
  float: right;  
  margin: 1em 0 1em 1em;
  }  
 
p, h3, h4 {
  margin: 11px;
  }