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; }  :focus { outline: 0; }  ins { text-decoration: none; } del { text-decoration: line-through; }  table { border-collapse: collapse; border-spacing: 0; }:focus { outline: 1px dotted #999; } a { border-bottom: 1px solid #000; color: #000; text-decoration: none; } a:focus, a:hover { border-bottom-color: #999; color: #999; } a abbr { border-bottom-style: none; } abbr { border-bottom: 1px dotted #000; cursor: help; } blockquote { margin: 20px 0; padding: 10px; } blockquote, tr:nth-child(even) td { background: -moz-linear-gradient(top, #fff, #eee); background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#eee)); border-bottom: 1px solid #ccc; text-shadow: 0 1px 0 #fff; } body { background-color: #fff; color: #000; -webkit-font-smoothing: antialiased; } body, input, textarea { font: 13px/1 verdana, "bitstream vera sans", sans-serif; } dd, dt, h3, h4, li, p { line-height: 20px; } dt, h1, h2, h3, h4, th { font-family: "gill sans", verdana, "bitstream vera sans", sans-serif; font-weight: normal; letter-spacing: 1px; text-transform: uppercase; } em { font-style: italic; } h1 { font-size: 29px; line-height: 35px; margin-bottom: 5px; } h2 { font-size: 21px; line-height: 25px; margin-bottom: 15px; } h3 { font-size: 19px; line-height: 21px; margin: 20px 0 19px 0; } input[type=email], input[type=search], input[type=text], input[type=url], input:not([type]), textarea { background-color: #fff; border: 1px inset #ccc; color: #000; cursor: text; padding: 5px; } input[type=submit] { cursor: pointer; } kbd, pre { font: 13px/1 consolas, "lucida console", monaco, monospace; } label { clear: both; float: left; margin-top: 5px; width: 175px; } li ol { list-style-type: lower-alpha; } li ol, li ul { margin-bottom: 0; margin-top: 0; } ol { list-style-type: decimal; } ol, ul { margin: 20px 0 20px 30px; } p + p { margin-top: 20px; } table { margin: 20px 0; } td { line-height: 15px; } td, th { padding: 10px; vertical-align: top; } th { text-align: left; } thead { background-color: #000; color: #fff; } tr { border-color: #eee; border-style: solid; border-width: 1px 0; } tr:nth-child(even) { border-bottom-color: #ccc; } ul { list-style-type: square; } .no-cssgradients blockquote, .no-cssgradients tr:nth-child(even) td { background-color: #eee; }  #acknowledgements, #search, #sidebar { float: left; width: 300px; } #container, #jump-links, #notification-container { margin: 0 auto; max-width: 99%; width: 960px; } #content { margin: 20px 0; max-width: 100%; } #content:after, #footer:after, #header:after, #logo:after, #main:after, #notification:after, #notification-container:after { clear: both; content: ""; display: block; height: 0; overflow: hidden; visibility: hidden; } #content, #links, #logo { float: left; margin-right: 60px; width: 600px; } #content.full-width { float: none; margin-right: 0; width: 100%; } #footer { clear: both; font-size: 11px; margin-bottom: 10px; padding-top: 18px; } #footer, #header p { color: #999; } #footer h2, #jump-links a, #sidebar h2 { left: -9999px; overflow: hidden; position: absolute; width: 1px; } #footer h3 { color: #000; font-size: 13px; line-height: 15px; margin: 0; } #footer p { margin: 0; } #footer #copyright { margin-top: 20px; } #footer a[rel*=external] { background-position: 100% -61px; } #header { border-bottom: 1px solid #eee; padding-bottom: 10px; } #header a { border-bottom-style: none; } #header a:focus, #header a:hover { border-bottom-style: solid; } #header h1 { line-height: 29px; } #header img { float: left; margin-right: 10px; } #header p { font-size: 11px; line-height: 1; } #jump-links { height: 20px; } #jump-links a:focus { background-color: #ffffca; border-style: none; display: block; height: 17px; padding: 0 10px; position: static; text-decoration: underline; width: auto; } #links ul { list-style-type: none; margin: 0; } #main { border-color: #000; border-style: solid; border-width: 1px 0; } #notification { background: -moz-linear-gradient(top, #ebeff9, #a6bffb); background: -webkit-gradient(linear, left top, left bottom, from(#ebeff9), to(#a6bffb)); border-bottom: 1px solid #6b90da; padding: 10px 0; } #search { margin-top: 5px; } #search label { left: -9999px; overflow: hidden; position: absolute; width: 1px; } #search-query { background: #fff url(http://cdn1.chrispederick.net/infrastructure/images/search-external.png) no-repeat 5px 6px; margin-right: 5px; padding-left: 25px; width: 175px; } #sidebar { margin: 20px 0; } #sidebar h2 + h3 { margin-top: 0; } #sidebar h3 { border-bottom: 1px solid #000; margin: 40px 0 17px 0; padding-bottom: 1px; } .no-cssgradients #notification { background-color: #ebeff9; }  #navigation h2 { left: -9999px; overflow: hidden; position: absolute; width: 1px; } #navigation h3 { font-size: 13px; margin: -5px 0 0 0; } #navigation h3 a { font-weight: normal; } #navigation h3, #navigation p { margin-left: 40px; } #navigation li { float: left; padding: 10px; text-shadow: 0 1px 0 #fff; } #navigation li:hover, #navigation .selected { background: -moz-linear-gradient(top, #fff, #eee); background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#eee)); cursor: pointer; } #navigation li:hover h3 a { border-bottom-color: #999; color: #999; } #navigation p { font-size: 11px; line-height: 13px; } #navigation p a { color: #999; } #navigation p a, #navigation span a { border-bottom-style: none; text-decoration: none; } #navigation span { background-image: url(http://cdn1.chrispederick.net/images/3.1/navigation.png); background-repeat: no-repeat; float: left; } #navigation span, #navigation span a { display: block; height: 32px; width: 32px; } #navigation ul { list-style-type: none; margin: 0; } #navigation ul:after { clear: both; content: ""; display: block; height: 0; overflow: hidden; visibility: hidden; } .no-cssgradients #navigation li:hover, .no-cssgradients #navigation .selected { background-color: #eee; }  #page-navigation { margin-bottom: 20px; text-align: center; } #page-navigation a { background-image: url(http://cdn1.chrispederick.net/infrastructure/images/navigation.png); background-repeat: no-repeat; border-bottom-style: none; text-decoration: underline; } #page-navigation h2 { left: -9999px; overflow: hidden; position: absolute; width: 1px; } #page-navigation p { display: inline; } .newer a { background-position: 100% -31px; margin-left: 10px; padding-right: 20px; } .older a { background-position: 0 1px; margin-right: 10px; padding-left: 20px; }  .sponsors { margin-bottom: 20px; text-align: center; } .sponsors a { border-bottom-style: none; }  form .placeholder { color: #ccc; }  a:focus .framed, a:hover .framed { border: 1px solid #ccc; } .framed { background-color: #fff; border: 1px solid #eee; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.5); padding: 5px; }  .error-module, .help-module, .information-module, .notification-module, .success-module, .warning-module { border-style: solid; border-width: 1px; margin: 20px 0; padding: 10px; text-shadow: 0 1px 0 #fff; } .error-module:after, .help-module:after, .information-module:after,.notification-module:after, .success-module:after, .warning-module:after { clear: both; content: ""; display: block; height: 0; overflow: hidden; visibility: hidden; } .error-module, .warning-module { background: -moz-linear-gradient(top, #ffffca, #ffec96); background: -webkit-gradient(linear, left top, left bottom, from(#ffffca), to(#ffec96)); border-color: #ffdb63; } .error-module ol, .error-module ul, .help-module ol, .help-module ul, .information-module ol, .information-module ul, .success-module ol, .success-module ul, .warning-module ol, .warning-module ul { margin-left: 105px; } .error-module p, .help-module p, .information-module p, .notification-module p, .success-module p, .warning-module p { text-align: left; } .error-module p, .help-module p, .information-module p, .success-module p, .warning-module p { margin-left: 75px; } .error-module span { background-position: 0 -256px; } .error-module span, .help-module span, .information-module span, .success-module span, .warning-module span { background-image: url(http://cdn1.chrispederick.net/infrastructure/images/modules.png); background-repeat: no-repeat; display: block; float: left; height: 64px; width: 64px; } .full-width .split-module { width: 450px; } .help-module, .information-module, .notification-module { background: -moz-linear-gradient(top, #ebeff9, #a6bffb); background: -webkit-gradient(linear, left top, left bottom, from(#ebeff9), to(#a6bffb)); border-color: #6b90da; } .help-module span { background-position: 0 -128px; } .information-module span { background-position: 0 -64px; } .loading-module { background: url(http://cdn1.chrispederick.net/infrastructure/images/loading/large.gif) no-repeat 50% 0; text-align: center; } .loading-module p { color: #999; font-size: 25px; line-height: 30px; padding-top: 74px; } .notification-module p { margin-left: 20px; } .notification-module span { background: url(http://cdn1.chrispederick.net/infrastructure/images/notification.png) no-repeat 0 0; display: block; float: left; height: 16px; position: relative; top: 2px; width: 16px; } .split-module { float: left; margin-right: 30px; width: 270px; } .success-module { background: -moz-linear-gradient(top, #9c3, #693); background: -webkit-gradient(linear, left top, left bottom, from(#99cc33), to(#669933)); border-color: #003300; color: #fff; text-shadow: 0 -1px 0 #000; } .success-module a { border-bottom-color: #fff; color: #fff; } .success-module a:focus, .success-module a:hover { border-bottom-color: #006600; color: #006600; text-shadow: none; } .success-module span { background-position: 0 0; } .warning-module span { background-position: 0 -192px; } .no-cssgradients .error-module, .no-cssgradients .warning-module { background-color: #ffffca; } .no-cssgradients .help-module, .no-cssgradients .information-module { background-color: #ebeff9; } .no-cssgradients .success-module { background-color: #693; }  a[rel*=external] { background: url(http://cdn1.chrispederick.net/infrastructure/images/search-external.png) no-repeat 100% -61px; padding-right: 15px; text-decoration: underline; } a[rel*=external], a.no-decoration { border-bottom-style: none; } blockquote .indent { text-indent: -.4em; } p + p.details { margin-top: 0; } #content .hide { display: none; } .clear { clear: both; } .centered { display: block; margin: 0 auto; } .collapse { left: -9999px; overflow: hidden; position: absolute; width: 1px; } .deprecated { text-decoration: line-through; } .details, .source { color: #999; font-size: 11px; } .error { background: url(http://cdn1.chrispederick.net/infrastructure/images/error.png) no-repeat right top; min-height: 300px; padding-right: 300px; } .pull { float: right; margin: 0 0 20px 20px; } .push { float: left; margin: 0 20px 20px 0; } .required { color: #f00; font-size: 11px; } .source { margin-bottom: 20px; text-align: right; }  @media screen and (max-width: 980px) { #acknowledgements { margin-top: 20px; } #acknowledgements, #container, #content, #links, #logo { float: none; width: auto; } #acknowledgements, #search { clear: both; } #content, #links, #logo { margin-right: 0; } #navigation p { display: none; } #search { margin-left: 74px; } #sidebar { display: none; } .split-module { margin-right: 5%; width: 45%; } }  @media handheld, only screen and (max-device-width: 480px) {  body { padding: 0 5px; } a[rel*=external] { background-image: none; padding-right: 0; } img, object { height: auto; max-width: 100%; }  #acknowledgements, #acknowledgements #copyright { margin-top: 0; } #acknowledgements h3, #acknowledgements p, #links, #notification, #sidebar { display: none; } #acknowledgements #copyright { display: block; } #container { max-width: none; } #container, #logo, #search, #sub-navigation { margin: 0; } #content { margin: 10px 0; } #content, #logo { float: none; } #footer { padding-top: 5px; } #footer, #navigation { border-width: 1px; } #header { margin: 0 -5px; } #header h1 { font-size: 19px; line-height: 19px; } #jump-links { height: auto; } #logo { background: -moz-linear-gradient(top, #fff, #eee); background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#eee)); padding: 5px; } #search { border-top: 1px solid #ccc; padding-top: 10px; text-align: center; width: 100%; }  #navigation { display: none; }  #page-navigation { text-align:left; }  .split-module { float: none; margin-right: 0; width: auto; }  .framed { max-width: 95%; } .pull { float: none; margin-left: 0; } }#notification p { margin-left: 20px; } #notification span { background-image: url(http://cdn1.chrispederick.net/images/3.1/notification.png); background-repeat: no-repeat; display: block; float: left; height: 16px; margin-top: 4px; width: 16px; } #notification .no-decoration { background-image: none; padding-right: 0; } #notification .split-module { width: 460px; } #random-yes-useful-no-notification { margin-right: 40px; } #stuff-im-reading-notification { margin-right: 0; } #stuff-im-reading-notification span { background-position: 0 -16px; }  #navigation a { background-image: none; padding-right: 0; } #navigation li { width: 125px; } #navigation span { background-image: url(http://cdn1.chrispederick.net/images/3.1/navigation.png); background-repeat: no-repeat; } #navigation .blog span { background-position: 0 -32px; } #navigation .forums { width: 150px; } #navigation .forums span { background-position: 0 -128px; } #navigation .photos, #navigation .videos { width: 140px; } #navigation .photos span { background-position: 0 -64px; } #navigation .twitter { width: 160px; } #navigation .twitter span { background-position: 0 -160px; } #navigation .videos span { background-position: 0 -96px; } #navigation .work span { background-position: 0 0; }  .image-module { margin-bottom: 20px; } .image-module:after { clear: both; content: ""; display: block; height: 0; overflow: hidden; visibility: hidden; } .image-module img { float: left; } .image-module h3 { margin-bottom: 5px; margin-top: 0; } .image-module h3, .image-module p { margin-left: 105px; }  .buttons a { display: inline-block; margin: 0 10px; } .buttons p { margin: 5px 15px 0 0; text-align: right; } .buttons p a { background-image: none; border-bottom: 1px solid #999; color: #999; display: inline; margin: 0; padding-right: 0; text-decoration: none; }  @media screen and (max-width: 980px) { #navigation li { padding: 10px 1%; width: 14%; } #navigation .forums, #navigation .photos, #navigation .twitter, #navigation .videos { width: 15%; } #notification .split-module { margin-right: 0; width: 100%; } #random-yes-useful-no-notification { margin-bottom: 5px; } }