New Washington Post stylesheet

style.css

/**
 * Theme Name: WaPo Blogs 
 * Theme URI: http://www.washingtonpost.com
 * Author: The Washington Post 
 * Description: WaPo Blog Theme
 * Version: 0.1
 * License: GNU General Public License
 * License URI: license.txt
**/

/******************************************
 * TABLE OF CONTENTS 
 ******************************************
 *
 * RESET
 * MAIN
 * STRUCTURE
 * LINKS
 * TYPE
 *
 * Backgrounds
 * Borders
 * Colors
 * Floats and clears
 * Forms
 * Images
 * Margins and padding
 * Positioning and alignment
 * 
 * Misc
 * Overrides
 *
 ******************************************/

/******************************************
 * RESET CSS
 * by Eric Meyer
 * http://meyerweb.com/eric/tools/css/reset/
 ******************************************/
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, 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,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video {    margin: 0;	padding: 0;	border: 0;	font-size: 100%;	font: inherit;	vertical-align: baseline;}/* HTML5 display-role reset for older browsers */article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block;}body { line-height: 1;}ol, ul {list-style: none;}blockquote, q {	quotes: none;}blockquote:before, blockquote:after,q:before, q:after {	content: '';	content: none;}table {	border-collapse: collapse;	border-spacing: 0;}

/******************************************
 * MAIN 
 ******************************************/

/******************************************
 * STRUCTURE 
 ******************************************/
.col140 { width: 140px; }
.col220 { width: 220px; }
.col300 { width: 300px; }
.col380 { width: 380px; }
.col460 { width: 460px; }
.col620 { width: 620px; }
.col992 { width: 992px; } /* Bastard size for huge ads */

/******************************************
 * LINKS 
 ******************************************/
a { color: #2c2c2c; text-decoration: none; }
a:focus, a:active, a:hover { color: #005B88; text-decoration: none; }

/******************************************
 * TYPE 
 ******************************************/
h1, h2, h4, h5, p, .serif { font-family: Georgia, serif; }
h6 { font-family: Helvetica, sans-serif; }

h1     { font-size: 26px; }
h3,
p      { font-size: 16px; }
h4,
.fs14  { font-size: 14px; } 
h5, 
h6     { font-size: 12px; }

h1, h2, h3, h4, h5, h6 { font-weight: 400; }
strong { font-weight: 700; }

.uppercase { text-transform: uppercase; }

article p { line-height: 26px; padding-bottom: 26px; }

/******************************************/

/******************************************
 * BACKGROUNDS 
 ******************************************
 * 
 * Black:      #111
 * White:      #fff
 * Light grey: #f3f3f3
 *
 ******************************************/
.bg-white       { background: #fff; }
.bg-black       { background: #000; }
.bg-light-grey  { background: #f3f3f3 }

/******************************************
 * COLORS 
 ******************************************
 * 
 * Black:      #2c2c2c
 * Grey:       #6a6a6a
 * Light grey: #999
 * Blue:       #005B88
 * White:      #fff
 * Orange:     #dd8d48
 * 
 ******************************************/
.black      { color: #2c2c2c; }
.white      { color: #fff; }
.grey       { color: #6a6a6a; }
.light-grey { color: #999; }
.blue       { color: #005B88; }
.orange     { color: #dd8d48; }

/******************************************
 * BORDERS
 ******************************************/
.borB1S { border-bottom: 1px solid #d4d4d4; }
.borB4D { border-bottom: 4px double #d4d4d4; }
.borL1S { border-left: 1px solid #d4d4d4; }
.borR1S { border-right: 1px solid #d4d4d4; }
.borT1S { border-top: 1px solid #d4d4d4; }

/******************************************
 * FLOATS AND CLEARS
 ******************************************/
.left     { float: left; }
.right    { float: right; }
.clear    { clear: both; }
.cf:before,
.cf:after { content: ""; display: table; }
.cf:after { clear: both; }
.cf       { *zoom: 1; }

/******************************************
 * FORMS
 ******************************************/
 
/******************************************
 * IMAGES
 ******************************************/

/******************************************
 * MARGINS AND PADDING
 ******************************************/
.marB5   { margin-bottom: 5px; }
.marB10  { margin-bottom: 10px; }
.marB15  { margin-bottom: 15px; }
.marL5   { margin-left: 5px; }
.marLR5  { margin: 0 5px; }
.marR5   { margin-right: 5px; }
.marR10  { margin-right: 10px; }
.marR20  { margin-right: 20px; }
.marT3   { margin-top: 3px; }
.pad10   { padding: 10px; }
.padB10  { padding-bottom: 10px; }
.padB15  { padding-bottom: 15px; }
.padBT5  { padding: 5px 0; }
.padL5   { padding-left: 5px; }
.padLR5  { padding: 0 5px; }
.padLR10 { padding: 0 10px; }
.padR5   { padding-right: 5px; }
.padR15  { padding-right: 15px; }

/******************************************
 * POSITIONING AND ALIGNMENT
 ******************************************/
.absolute     { position: absolute; }
.relative     { position: relative; }
.centered     { margin: 0 auto; }
.align-center { text-align: center; }
.align-left   { text-align: left; }
.align-right  { text-align: right; }
.aligncenter  { clear: both; display: block; margin-left: auto; margin-right: auto; }
.alignleft    { display: inline; float: left; margin-right: 15px !important; }
.alignright   { display: inline; float: right; margin-left: 15px !important; }

/******************************************
 * MISC
 ******************************************/

/* Dropdowns */
.dropdown a:active,
.dropdown a:hover,
.dropdown a:focus { background: #f3f3f3; border: 1px solid #d4d4d4; margin: -1px 0 -1px -1px; }
.dropdown ul a:active,
.dropdown ul a:hover,
.dropdown ul a:focus { background: none; border: 0; margin: 0; }
.dropdown ul { border: 1px solid #d4d4d4; left: -9999px; top: 28px; }
.dropdown:hover ul { left: -1px; }

/******************************************
 * OVERRIDES
 ******************************************/
.block { display: block; }
.none  { display: none; }