html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p,
blockquote, pre, a, abbr, acronym, address, code, del, dfn, img,
q, fieldset, form, label, legend, table,
caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline;
}
body {
line-height: 1.5;
background: #fff;
margin:0.5em 0;
}
p {
margin-bottom: 1em;
}
code {
font-family: monospace;
}
pre {
margin: 1em 0;
padding: 0.8em 1em;
background: #f9f9f9;
border: 1px solid #ddd;
font-family: monospace;
font-size: 1.1em;
line-height: 1.5em;
color: #110000;
overflow: auto;
}
/* --------------------------------------------------------------
== STRUCTURE: ========================
* Page width: 952 px
* Number of columns: 13
* Column width: 64 px
* Margin width: 10 px
======================================
-------------------------------------------------------------- */
/* A container should group all your columns. */
.container {
width: 952px;
margin: 0 auto;
}
/* Use this class on any div.span / container to see the grid. */
.showgrid {
background: url(grid.png);
}
/* Body margin for a sensile default look. */
body {
margin:1.5em 0;
}
/* Columns
-------------------------------------------------------------- */
/* Sets up basic grid floating and margin. */
div.span-1, div.span-2, div.span-3, div.span-4, div.span-5, div.span-6, div.span-7, div.span-8, div.span-9, div.span-10, div.span-11, div.span-12, div.span-13 {float:left;margin-right: 10px;}
/* The last column in a row needs this class. */
div.last { margin-right: 0; }
/* Use these classes to set the width of a column. */
.span-1 { width: 64px;}
.span-2 { width: 138px;}
.span-3 { width: 212px;}
.span-4 { width: 286px;}
.span-5 { width: 360px;}
.span-6 { width: 434px;}
.span-7 { width: 508px;}
.span-8 { width: 582px;}
.span-9 { width: 656px;}
.span-10 { width: 730px;}
.span-11 { width: 804px;}
.span-12 { width: 878px;}
.span-13, div.span-13 { width: 952px; margin: 0; }
/* Add these to a column to append empty cols. */
.append-1 { padding-right: 74px;}
.append-2 { padding-right: 148px;}
.append-3 { padding-right: 222px;}
.append-4 { padding-right: 296px;}
.append-5 { padding-right: 370px;}
.append-6 { padding-right: 444px;}
.append-7 { padding-right: 518px;}
.append-8 { padding-right: 592px;}
.append-9 { padding-right: 666px;}
.append-10 { padding-right: 740px;}
.append-11 { padding-right: 814px;}
.append-12 { padding-right: 888px;}
/* Add these to a column to prepend empty cols. */
.prepend-1 { padding-left: 74px;}
.prepend-2 { padding-left: 148px;}
.prepend-3 { padding-left: 222px;}
.prepend-4 { padding-left: 296px;}
.prepend-5 { padding-left: 370px;}
.prepend-6 { padding-left: 444px;}
.prepend-7 { padding-left: 518px;}
.prepend-8 { padding-left: 592px;}
.prepend-9 { padding-left: 666px;}
.prepend-10 { padding-left: 740px;}
.prepend-11 { padding-left: 814px;}
.prepend-12 { padding-left: 888px;}
/* Border on right hand side of a column. */
div.border {
padding-right:4px;
margin-right:5px;
border-right: 1px solid #eee;
}
/* Border with more whitespace, spans one column. */
div.colborder {
padding-right:62px;
margin-right:59px;
border-right: 1px solid #eee;
}
/* Use these classes on an element to push it into the
next column, or to pull it into the previous column. */
.pull-1 { margin-left: -74px;}
.pull-2 { margin-left: -148px;}
.pull-3 { margin-left: -222px;}
.pull-4 { margin-left: -296px;}
.pull-5 { margin-left: -370px;}
.pull-6 { margin-left: -444px;}
.pull-7 { margin-left: -518px;}
.pull-8 { margin-left: -592px;}
.pull-9 { margin-left: -666px;}
.pull-10 { margin-left: -740px;}
.pull-11 { margin-left: -814px;}
.pull-12 { margin-left: -888px;}
.pull-13 { margin-left: -962px;}
.pull-1, .pull-2, .pull-3, .pull-4, .pull-5, .pull-6, .pull-7, .pull-8, .pull-9, .pull-10, .pull-11, .pull-12, .pull-13 {float:left;position:relative;}
.push-1 { margin: 0 -74px 1.5em 74px;}
.push-2 { margin: 0 -148px 1.5em 148px;}
.push-3 { margin: 0 -222px 1.5em 222px;}
.push-4 { margin: 0 -296px 1.5em 296px;}
.push-5 { margin: 0 -370px 1.5em 370px;}
.push-6 { margin: 0 -444px 1.5em 444px;}
.push-7 { margin: 0 -518px 1.5em 518px;}
.push-8 { margin: 0 -592px 1.5em 592px;}
.push-9 { margin: 0 -666px 1.5em 666px;}
.push-10 { margin: 0 -740px 1.5em 740px;}
.push-11 { margin: 0 -814px 1.5em 814px;}
.push-12 { margin: 0 -888px 1.5em 888px;}
.push-13 { margin: 0 -962px 1.5em 962px;}
.push-1, .push-2, .push-3, .push-4, .push-5, .push-6, .push-7, .push-8, .push-9, .push-10, .push-11, .push-12, .push-13 {float:right;position:relative;}
/* Misc classes and elements
-------------------------------------------------------------- */
/* Use a .box to create a padded box inside a column. */
.box {
padding: 1.5em;
margin-bottom: 1.5em;
}
/* Use this to create a horizontal ruler across a column. */
hr {
background: #ddd;
color: #ddd;
clear: both;
float: none;
width: 100%;
height: .1em;
margin: 0 0 1.45em;
border: none;
}
hr.space {
background: #fff;
color: #fff;
}
body {
font-size: 80%;
color: #222;
font-family: Arial, sans-serif;
}
h1, h2, h3, h4, h5, h6, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a,
h1 a:visited, h2 a:visited, h3 a:visited, h4 a:visited, h5 a:visited, h6 a:visited {
color: #369;
font-family: Arial, sans-serif;
font-weight: bold;
}
a {
color: #369;
}
a:visited {
color: #369;
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
text-decoration: none;
}
h1 { font-size: 2em; line-height: 1; margin-top: 1em; margin-bottom: 1em; }
h2 { font-size: 1.5em; margin-top: 0.75em; margin-bottom: 0.75em; }
h3 { font-size: 1.3em; line-height: 1; margin-top: 1.7em; margin-bottom: 1em; }
h4 { font-size: 1.2em; line-height: 1.25; margin-top: 1.25em; margin-bottom: 1.25em; }
h5 { font-size: 1em; font-weight: bold; margin-bottom: 1.5em; }
h6 { font-size: 1em; font-weight: bold; }
blockquote {
border-top: 3px double #69c;
border-bottom: 3px double #69c;
padding: 5px;
font-style: oblique;
margin-left: 5%;
margin-right: 5%;
}