/* -------------------------------------------------------------- reset.css * Resets default browser CSS. -------------------------------------------------------------- */ html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, 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; } /* Tables still need 'cellspacing="0"' in the markup. */ table { border-collapse: separate; border-spacing: 0; } caption, th, td { text-align: left; font-weight: normal; } table, td, th { vertical-align: middle; } /* Remove possible quote marks (") from ,
. */ blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; } /* Remove annoying border on linked images. */ a img { border: none; } /* -------------------------------------------------------------- BLUEPRINT CSS * Filename: grid.css * Version: 0.7.1 (2008-02-25) YYYY-MM-DD * Website: http://code.google.com/p/blueprintcss/ Generated by: * Blueprint CSS Grid Generator (2008-02-26) [http://kematzy.com/blueprint-generator/] Based on work by: * Olav Bjorkoy [bjorkoy.com] * Nathan Borror [playgroundblues.com] * Jeff Croft [jeffcroft.com] * Christian Metts [mintchaos.com] * Khoi Vinh [subtraction.com] == STRUCTURE: ======================== * Page width: 950 px * Number of columns: 24 * Column width: 30 px * Margin width: 10 px ====================================== By default, the grid is 950px wide, with 24 columns spanning 30px, and a 10px margin between columns. If you need fewer or more columns, use this formula to calculate the new total width: Total width = (number_of_columns * column_width) - margin_width Read more about using a grid here: * subtraction.com/archives/2007/0318_oh_yeeaahh.php -------------------------------------------------------------- */ /* A container should group all your columns. */ .wrapper,.container { width: 900px; margin: 0 auto; } /* Use this class on any div.span / container to see the grid. */ .showgrid { background: url(src/grid.png); } /* Body margin for a sensile default look. */ body { margin:1.5em 0; } /* 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; } /* Clearing floats without extra markup Based on How To Clear Floats Without Structural Markup by PiE [http://www.positioniseverything.net/easyclearing.html] */ .clearfix:after, .container:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .clearfix, .container {display: inline-block;} * html .clearfix, * html .container {height: 1%;} .clearfix, .container {display: block;} /* Regular clearing apply to column that should drop below previous ones. */ .clear { clear:both; } /* -------------------------------------------------------------- forms.css * Sets up some default styling for forms * Gives you classes to enhance your forms Usage: * For text fields, use class .title or .text -------------------------------------------------------------- */ label { font-weight: bold; } fieldset { padding:1.4em; margin: 0 0 1.5em 0; border: 1px solid #ccc; } legend { font-weight: bold; font-size:1.2em; } /* Form fields -------------------------------------------------------------- */ input.text, input.title, textarea, select { margin:0.5em 0; border:1px solid #bbb; } input.text:focus, input.title:focus, textarea:focus, select:focus { border:1px solid #666; } input.text, input.title { width: 300px; padding:5px; } input.title { font-size:1.5em; } textarea { width: 390px; height: 250px; padding:5px; } /* Success, notice and error boxes -------------------------------------------------------------- */ .error, .notice, .success { padding: .8em; margin-bottom: 1em; border: 2px solid #ddd; } .error { background: #FBE3E4; color: #8a1f11; border-color: #FBC2C4; } .notice { background: #FFF6BF; color: #514721; border-color: #FFD324; } .success { background: #E6EFC2; color: #264409; border-color: #C6D880; } .error a { color: #8a1f11; } .notice a { color: #514721; } .success a { color: #264409; } /* -------------------------------------------------------------- typography.css * Sets up some sensible default typography. -------------------------------------------------------------- */ /* Default font settings. The font-size percentage is of 16px. (0.75 * 16px = 12px) */ body { font-size: 75%; color: #222; background: #fff; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; } /* Headings -------------------------------------------------------------- */ h1,h2,h3,h4,h5,h6 { font-weight: normal; } h1 { font-size: 3em; line-height: 1; margin-bottom: 0.5em; } h2 { font-size: 2em; margin-bottom: 0.75em; } h3 { font-size: 1.5em; line-height: 1; margin-bottom: .75em; } h4 { font-size: 1.2em; line-height: 1.25; margin-bottom: 1.25em; /* height: 1.25em !stupid; */} h5 { font-size: 1em; font-weight: bold; margin-bottom: 1.5em; } h6 { font-size: 1em; font-weight: bold; } h1 img, h2 img, h3 img, h4 img, h5 img, h6 img { margin: 0; } /* Text elements -------------------------------------------------------------- */ p { margin: 0 0 1.5em; } p img { float: left; margin: 1.5em 1.5em 1.5em 0; padding: 0; } p img.right { float: right; margin: 1.5em 0 1.5em 1.5em; } a:focus, a:hover { color: #000; } a { color: #009; text-decoration: underline; } blockquote { margin: 1.5em; color: #666; font-style: italic; } strong { font-weight: bold; } em,dfn { font-style: italic; } dfn { font-weight: bold; } sup, sub { line-height: 0; } abbr, acronym { border-bottom: 1px dotted #666; } address { margin: 0 0 1.5em; font-style: italic; } del { color:#666; } pre,code { margin: 1.5em 0; white-space: pre; } tt { display: block; margin: 1.5em 0; line-height: 1.5; } pre,code,tt { font: 1em 'andale mono', 'lucida console', monospace; line-height: 1.5; } /* Lists -------------------------------------------------------------- */ li ul, li ol { margin:0 1.5em; } ul, ol { margin: 0 1.5em 1.5em 1.5em; } ul { list-style-type: disc; } ol { list-style-type: decimal; } dl { margin: 0 0 1.5em 0; } dl dt { font-weight: bold; } dd { margin-left: 1.5em;} /* Tables -------------------------------------------------------------- */ table { margin-bottom: 1.4em; width:100%; } th { font-weight: bold; background: #C3D9FF; } th,td { padding: 4px 10px 4px 5px; } tr.even td { background: #E5ECF9; } tfoot { font-style: italic; } caption { background: #eee; } /* Misc classes -------------------------------------------------------------- */ small, .small { font-size: .8em; margin-bottom: 1.875em; line-height: 1.875em; } big, .large { font-size: 1.2em; line-height: 2.5em; margin-bottom: 1.25em; } .hide { display: none; } .quiet { color: #666; } .loud { color: #000; } .highlight { background:#ff0; } .added { background:#060; color: #fff; } .removed { background:#900; color: #fff; } .first { margin-left:0; padding-left:0; } .last { margin-right:0; padding-right:0; } .top { margin-top:0; padding-top:0; } .bottom { margin-bottom:0; padding-bottom:0; }