/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}
body {
  line-height: 1;
}
ol, ul {
  list-style: none;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}


/* remember to highlight inserts somehow! */
ins {
  text-decoration: none;
}
del {
  text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/***************************************************
 * Layout constructed to support a grid consisting of
 * 12 columns with a width of 72px
 * 8px gutters
 * Grid Width: 864px
 *
 * Generated using the Typography System Plugin by Mark Daggett
 * http://www.locusfoc.us
 * Tweaked for The Auteurs by Gabe
 * http://github.com/dasil003/typography-system
 ***************************************************/
#wrap {
 width: 864px;
 margin: 0 auto;
}

.use1, .use2, .use3, .use4, .use5, .use6, .use7, .use8, .use9, .use10, .use11, .use12 {
  overflow: hidden;
  float: left;
  margin-left: 4px;
  margin-right: 4px;
}

.use1 { width: 64px; }
.use2 { width: 136px; }
.use3 { width: 208px; }
.use4 { width: 280px; }
.use5 { width: 352px; }
.use6 { width: 424px; }
.use7 { width: 496px; }
.use8 { width: 568px; }
.use9 { width: 640px; }
.use10 { width: 712px; }
.use11 { width: 784px; }
.use12 { width: 856px; }

/* use this class when nesting columns */
.il { margin-left: 0; }
.ir { margin-right: 0; }


/*
Colors
======
323232 - Standard text color
5a5a5a - Site background
666666 - MED GRAY
787878 - GRAY link hover
8c8c8c - MED LIGHT GRAY some text
aaaaaa - LIGHT GRAY Content - eg. newsfeed times
e6e6e6 - LIGHT GRAY Content background
f2f2f2 - LIGHTEST GRAY Halfway between white and content background
f6f6f6 - OFFWHITE
299ecc - BLUE Mostly Links
0faf2d - GREEN Flash Notices / Headings
f7d837 - YELLOW background
ef4135 - RED for headings (eg. cinemas)
ffe8b5 - Yellow for autocomplete highlight

Margins
=======
1px - Between heading and its block, between nav blocks
2px - Between related elements in a block of multiple content elements
4px - ?
8px - Gutters
16px - Padding of boxes, line-height of vertical rhythm
*/


/****************************
 BASE HTML ELEMENT STYLES
****************************/
body {
  font-family: Helvetica, Arial, Verdana, "Lucida Grande", Georgia, sans-serif;
  font-size: 12px;
  line-height: 16px;
  background-color: #5a5a5a;
  color: #323232;
}

p, ol, ul, dl {
  margin-bottom: 16px;
}

/**** LINKS ****/
a {
  color: #299ecc;
  text-decoration: none;
}
a:hover { color: #787878; }

/**** HEADERS ****/
h1 {
  font-size: 16px;
  text-transform: uppercase;
}
h1.big {
  font-size: 24px;
  line-height: 32px;
}
h2 {
  text-transform: uppercase;
}
h2.big { font-size: 18px; }
h3 {
  font-weight: normal;
}
h4 {
  color: #0faf2d;
  background-color: #fff;
  font-size: 14px;
  text-transform: uppercase;
  padding: 4px 16px 3px;
  margin-bottom: 1px;
  float: left;
  height: 16px;
}
.content h4 { /* Within white areas it should be a more generic style */
  padding: 0;
  margin: 0;
  float: none;
  height: auto;
}
h5 {
  color: #666666;
  background-color: #fff;
  font-size: 12px;
  text-transform: uppercase;
  padding: 7px 16px 4px;
  margin-top: 4px;
  margin-bottom: 1px;
}
.content h4, .content h5, #lightbox h4, #lightbox h5 { /* Within white areas it should be a more generic style */
  padding: 0; margin: 0; float: none; height: auto;
}

h6 {
  
}