/* Theme Name: Boilerplate Theme URI: http://aarontgrogg.com/boilerplate/ Description: Boilerplate starting theme, overhauled in total by Alex Hall for James Gulliver Hancock. Author: Aaron T. Grogg, based on the work of Paul Irish, Divya Manian, and Elliot Jay Stocks Author URI: http://aarontgrogg.com/ Version: 3.0 Tags: custom-menu, editor-style, theme-options, threaded-comments, sticky-post, microformats, rtl-language-support, translation-ready License: GNU General Public License v2.0 License URI: http://www.gnu.org/licenses/gpl-2.0.html This CSS file is a concatenation of style.css from HTML5 Boilerplate and style.css from Starkers. Comment blocks indicate where each begins and ends, like this, for example... */ /** * html5doctor.com Reset Stylesheet (Eric Meyer's Reset Reloaded + HTML5 baseline) * v1.6.1 2010-09-17 | Authors: Eric Meyer & Richard Clark * html5doctor.com/html-5-reset-stylesheet/ */ html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ""; content: none; } ins { background-color: #ff9; color: #000; text-decoration: none; } mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; } del { text-decoration: line-through; } abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; } table { border-collapse: collapse; border-spacing: 0; } body { font:13px/1.231 sans-serif; *font-size:small; } /* Hack retained to preserve specificity */ pre, code, kbd, samp { font-family: monospace, sans-serif; } html { overflow-y: scroll; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; } /* j.mp/webkit-tap-highlight-color */ a:link { -webkit-tap-highlight-color: #eeeeee; } a:hover, a:active { outline: none; } ul, ol { margin-left: 2em; } ol { list-style-type: decimal; } nav ul, nav li { margin: 0; list-style:none; list-style-image: none; } small { font-size: 85%; } b, strong, th { font-weight: bold; } td { vertical-align: top; } /* Set sub, sup without affecting line-height: gist.github.com/413930 */ sub, sup { font-size: 75%; line-height: 0; position: relative; } sup { top: -0.5em; } sub { bottom: -0.25em; } pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; padding: 15px; } .ie6 legend, .ie7 legend { margin-left: -7px; } /* 1) Make inputs and buttons play nice in IE: www.viget.com/inspire/styling-the-button-element-in-internet-explorer/ 2) WebKit browsers add a 2px margin outside the chrome of form elements. Firefox adds a 1px margin above and below textareas 3) Set font-size to match 's, and font-family to sans-serif 4) Align to baseline */ button, input, select, textarea { width: auto; overflow: visible; margin: 0; font-size: 100%; vertical-align: baseline; } /* 1) Remove default scrollbar in IE: www.sitepoint.com/blogs/2010/08/20/ie-remove-textarea-scrollbars/ 2) Align to text-top */ textarea { overflow: auto; vertical-align:text-top; } /* Hand cursor on clickable input elements */ label, input[type="button"], input[type="submit"], input[type="image"], button { cursor: pointer; } /* Remove extra padding and inner border in Firefox */ input::-moz-focus-inner, button::-moz-focus-inner { border: 0; padding: 0; } /* Colors for form validity */ input:valid, textarea:valid { } input:invalid, textarea:invalid {border-radius: 0; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; } .no-boxshadow input:invalid, .no-boxshadow textarea:invalid { background-color: #f0dddd; } input.placeholder {color: #444;} /* Bicubic resizing for non-native sized IMG: code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/ */ .ie7 img { -ms-interpolation-mode: bicubic; } body, input, select { color: #444; /* font-family: 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif; */ } /* For image replacement */ .ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; } .ir br { display: none; } .hidden { display: none; visibility: hidden; } .visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; } .invisible { visibility: hidden; } /* The Magnificent Clearfix: Updated to prevent margin-collapsing on child elements in most situations. nicolasgallagher.com/micro-clearfix-hack/ */ .clearfix:before, .clearfix:after { content: ""; display: table; } .clearfix:after { clear: both; } .clearfix { zoom: 1; } @media only screen and (min-width: 480px) { /* Style adjustments for viewports 480px and over go here */ }/*/mediaquery*/ @media only screen and (min-width: 768px) { /* Style adjustments for viewports 768px and over go here */ }/*/mediaquery*/ /** * Print styles. * * Inlined to avoid required HTTP connection: www.phpied.com/delay-loading-your-print-css/ */ @media print { * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: sanbeiji.com/archives/953 */ a, a:visited { color: #444 !important; text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } abbr[title]:after { content: " (" attr(title) ")"; } .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */ pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */ tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3{ page-break-after: avoid; } } .alert { background:red; color:white } /* LAYOUT */ /* ----------------------------------------- */ .textcenter {text-align: center; } .italic {font-style: italic; } .aligncenter { display:block; margin:0 auto } .alignleft { float:left } .alignright { float:right } .wp-caption { border:1px solid #666; text-align:center; background:#ccc; padding:10px; margin:10px } .clear { clear:both; display:block; } #container { width: 1100px; margin: 0 auto; } header { height: 150px; background-repeat: no-repeat; background-position: left top; } section#content { float: left; width: 880px; position: relative; } #sidebar { float: left; width: 200px; padding-right: 15px; } .post-left { width: 700px; margin-bottom: 30px; float: left; position: relative; } .post-right { width: 155px; height: 500px; float: left; padding-left: 20px; position: relative; color: #A9A9A9; } .post-onecolumn { width: 700px; } footer { line-height: 50px; color: #A9A9A9; font-size: 11px; } nav#nav-below { position: absolute; bottom: -20px; width: 700px; } /* RULES */ /* ----------------------------------------- */ hr { display: block; height: 1px; margin: 20px 0; padding: 0; background: #A9A9A9; border: 0; } hr.sep { } hr.first { margin:0 0 20px 0; } /* note: kinda duct tape-y, clean this up... */ body.home section#content hr.first { margin: 0; } .post-right hr { margin: 10px 0; } /* TYPOGRAPHY */ /* ----------------------------------------- */ /* FOUT control - hide web fonts...?? */ .wf-loading #sidebar, .wf-loading .post-right { visibility: hidden; } h1, h2, h3, h4, h5, h6 { font-weight: normal; line-height: 1.2em; margin-bottom: 5px; } h1 { text-transform: uppercase; font-size: 16px; } p { margin-bottom: 16px; } a {text-decoration: none; color: #444; } a:hover {color: #A9A9A9; } a:active {color: #eee; } /* project detail text */ .meta-content { display: block; font-size: 12px; margin: 5px 0; } .post-right p { font-size: 12px; } .post-right a { color: #A9A9A9; } .post-right a:hover { color: #ddd; } #thumbnail-container .meta-content { font-style: italic; } /* MENUS */ /* ----------------------------------------- */ .menu ul { margin-left: 0; list-style-type: none; } .menu ul a { text-transform: uppercase; display: block; line-height: 1.4em; padding-left: 2px; } .menu ul a:hover { color: #444; background: #F7F7F7; } .menu ul a:active, .menu ul li.current-cat a, .menu ul li.current_page_item a { background: #ddd; } section#content .menu { overflow: auto; margin: 20px 0; } section#content .menu li { float: left; margin-right: 5px; } section#content .menu a { padding-right: 35px; } /* FORMS - search form + newsletter form */ /* ----------------------------------------- */ .sidebar-form { margin: 20px 0; } form#searchform { width: 145px; height: 25px; } form#searchform input#s, form#tt_quick_subscribe_form input#QS_user_email_theme { font-size: 11px; width: 190px; border: 1px solid #A9A9A9; padding: 2px 0 2px 4px; text-transform: uppercase; } form#searchform input#s:focus, form#tt_quick_subscribe_form input#QS_user_email_theme:focus { text-transform: none; outline: none; } #qsInlineContainer { position: relative; height: 45px; } #tt_quick_subscribe_messages { position: absolute; bottom: 0; text-transform: uppercase; font-size: 11px; color: #A9A9A9; text-indent: 0.5em; } /* CATEGORY THUMBNAILS */ /* ----------------------------------------- */ #thumb-loader { height: 12px; background:url(images/inf-loading.gif) no-repeat top left; } #thumbnail-container { display: none; clear:both; width: 880px; } body.category article, body.page-id-105 article, body.search article { width: 160px; margin-right: 16px; padding-bottom: 12px; float: left; background: #fff; } /* POSTS - FULL DISPLAY */ /* ----------------------------------------- */ .post-right::selection { background: transparent; } .post-right p { margin-bottom: 0; } body.home article { margin-top: 20px; } /* apply CSS for slideshow formatting only to home page display */ body.home .slide { height: 500px; width: 700px; background: #f9f9f9; position: absolute; top: 0; left: 0; display: none; } /* apply CSS for slideshow formatting only to home page display */ body.home .slide:first { display: block; } body.single .slide, body.search .slide { margin-bottom: 25px; width: 700px; height: auto; text-align: center; } .slide-inner { display: table-cell; width: 700px; height: 500px; text-align: center; vertical-align: middle; } img.projects-img { border: 1px solid #f8f8f8; } #infscr-loading { position: absolute; bottom: -20px; } .post-right-bottom { position: absolute; bottom: 0; } input.paypal { background: #eee; display: block; width: 90px; height: 30px; text-align: center; margin-top: 20px; border: none; } .slide-nav { line-height: 25px; width: 125px; overflow: auto; } .slide-nav .btn { float: left; width: 40px; height: 25px; cursor: pointer; } .prev { background: url(images/slide_sprite.png) no-repeat top left; width: 15px; height: 25px; } .prev:hover { background: url(images/slide_sprite.png) no-repeat left -25px; } .next { background: url(images/slide_sprite.png) no-repeat right -50px; width: 15px; height: 25px; } .next:hover { background: url(images/slide_sprite.png) no-repeat right -75px; }