/*
**   ****************************************************************************************
   	 Using the baseline grid
     ****************************************************************************************

     Everything you need to know about this can be found at:
     http://alistapart.com/articles/settingtypeontheweb
    
    "The first thing we have to do is set a line-height for our grid. I’ve chosen a pretty 
     standard base font size of 12 pixels, and set the line-height at 18 pixels, which gives
     us a nice open leading of about 150%. It’s important to think about your line-heights
     up front. You want a ratio of font size to line-height that’s a good balance for
     readability and that’s easily divisible into smaller units"
    
     For each element to fall correctly it must have a bottom margin that is equal
     to the default line height, in this case 18px.
    
    "The pattern is pretty simple. Any time you add vertical space with a margin or padding,
     you need to add it in units of 18 pixels to maintain the baseline grid. You don’t always
     have to add it in one place, but you need to add it in pairs that add up to 18 pixels. 
     For instance, you could set a top margin of 12 pixels and a bottom margin of 6 pixels."
    
     For information about further elements such as floats, images etc see the above URL.
    
    "Floats and sidebars are where a little discipline comes in. 
     Images and other elements floated within your text need to be sized vertically in 
     multiples of your grid increment: in this case, multiples of 18. If they’re sized 
     correctly, you can add margins around them that add up vertically to a multiple of 18,
     and the text will always break in the right place, directly under your image.
    
     The important thing to remember with callouts and sidebars is to keep the line-height the
     same even if you make the text smaller. You might be tempted to tighten it up, but even for
     11- or 10-pixel font sizes, 18 pixels is still a very readable line-height."

*/

body {
  font-family: Verdana, arial, sans-serif;
  font-size: 13px;
  line-height: 18px;
  text-align: left;
  color: #191919;
  background: #191919;
  margin: 0;
  padding: 0;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0 0 18px 0;
  font-weight: bold; 
}
h1 { 
  font-size: 24px; 
  line-height: 36px; 
  color: #ed1721;
}
h2 { 
  font-size: 18px; 
  line-height: 18px; 
}
h3 { 
  font-size: 13px; 
  line-height: 18px; 
}
h4 { 
  font-size: 13px; 
  line-height: 18px; 
}
h5 { 
  font-size: 13px; 
  line-height: 18px;
}
h6 { 
  font-size: 13px; 
  line-height: 18px; 
}
p { 
  margin: 0 0 18px 0;
}
a:link {
  color: #5c4141;
  text-decoration: none;
  font-weight: bold;
}
a:visited {
  color: #5c4141;
  text-decoration: none;
  font-weight: bold;
}
a:hover { 
  color: #ed1721;
  text-decoration: none;
  font-weight: bold;
}
a:active {
  color: #ed1721;
  text-decoration: none;
  font-weight: bold;
}
ul {
  margin: 0 0 18px 18px;
  padding: 0 0 18px 0;
	list-style-type: none;
}
li {
  margin: 0;
  padding: 0;
}
form { 
  margin: 0; padding: 0; 
}
strong { 
  font-weight: bold; 
}
img { 
  border: none; 
  display: block; 
  margin-bottom: 18px;
}
.clear { 
  clear: both; 
}
.clearleft { 
  clear: left; 
}
.clearright { 
  clear: right; 
}
.left { 
  float: left;
}
.right { 
  float: right;
}
.imgleft {
  float: left;
  padding: 0;
	margin-right: 18px;
}
.imgright {
  float: right;
  margin-left: 18px;
}
.push1 { 
  margin-bottom: 18px;
}
.push2 { 
  margin-bottom: 36px; 
}
.pull1 { 
  margin-top: 18px; 
}
.pull2 { 
  margin-top: 36px;
}
table, tr, th, td { 
	margin: 0;
  padding: 0; 
  border: none;
  font-size: 13px; 
  line-height: 18px; 
}
table { 
	margin: 0 0 18px 0;
  border: 1px solid #ccc; 
}
th { 
  font-size: 13px; 
  line-height: 18px; 
}
th, td { 
  padding: 18px; 
  border: 1px solid #ccc; 
  text-align: center; 
}