/* ----------------------------------------------------------
    Surfrider Quad CSS
    Managed by: Blue State Digital

    TABLE OF CONTENT

    01 - HTML5 Boilerplate
    02 - COMMON STYLES
    03 - LAYOUT
    04 - HOMEPAGE 
    05 - SUBPAGES
    06 - SIDEBAR
    07 - FRAMEWORK
    08 - UTILITY
    09 - PRINT
	
    COLOR GUIDE (Main Site Colors and their Hex Codes)
	
---------------------------------------------------------- */

/* 01 =HTML5 Boilerplate
------------------------- */

html, 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;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
}                  
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { 
    display:block;
}
nav ul {list-style:none;}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after,
q:before, q:after { content:''; content:none; }
a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }
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; }
hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0; }
input, select {vertical-align:middle;}

/* end HTML5 Boilerplate reset */

/* HTML5 boilerplate base styles */

html { overflow-y: scroll; }
body { font:13px/1.231 sans-serif; *font-size:small; } 
select, input, textarea, button { font:99% sans-serif; }

pre, code, kbd, samp { font-family: monospace, sans-serif; }
ul, ol { list-style-type: none; }

small { font-size: 85%; }
b, strong, th { font-weight: bold; }
i, em { font-style: italic; }
td, td img { vertical-align: top; } 
sub { vertical-align: sub; font-size: smaller; }
sup { vertical-align: super; font-size: smaller; }
pre {  padding: 15px;  white-space: pre;  white-space: pre-wrap;  white-space: pre-line;  word-wrap: break-word; }
textarea { overflow: auto; } 
.ie6 legend, .ie7 legend { margin-left: -7px; } 
input[type="radio"] { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; }
.ie7 input[type="checkbox"] { vertical-align: baseline; }
.ie6 input { vertical-align: text-bottom; }
.ie7 img { -ms-interpolation-mode: bicubic; }
label, input[type=button], input[type=submit], button { cursor: pointer; }
button, input, select, textarea { margin: 0; }
button {  width: auto; overflow: visible; }

/* end HTML5 boilerplate base styles */

/* BSD base styles */
caption, th { text-align: left; }

/*
 * MyFonts Webfont Build ID 829013, 2011-06-01T17:41:01-0400
 * 
 * The fonts listed in this notice are subject to the End User License
 * Agreement(s) entered into by the website owner. All other parties are 
 * explicitly restricted from using the Licensed Webfonts(s).
 * 
 * You may obtain a valid license at the URLs below.
 * 
 * Webfont: Freight Micro Pro Black
 * URL: http://new.myfonts.com/fonts/garagefonts/freight-micro-pro/black/
 * Foundry: GarageFonts
 * Copyright: Copyright © 2004-2009, Joshua Darden & Phil's Fonts, Inc. All rights reserved. Published by Garagefonts USA 301-879-9222 www.garagefonts.com
 * License: http://www.myfonts.com/viewlicense?1056
 * Licensed pageviews: 10,000/month
 * CSS font-family: FreightMicroProBlack-Regular
 * CSS font-weight: normal
 * 
 * (c) 2011 Bitstream Inc
*/

@font-face {font-family: 'FreightMicroProBlack-Regular';src: url('/quad/files/d4766afe290f566da19b3e662b2420e1.eot');src: url('/quad/files/d4766afe290f566da19b3e662b2420e1.eot?#iefix') format('embedded-opentype'),url('/quad/files/d4766afe290f566da19b3e662b2420e1.woff') format('woff'),url('/quad/files/d4766afe290f566da19b3e662b2420e1.ttf') format('truetype'),url('/quad/files/d4766afe290f566da19b3e662b2420e1.svg#FreightMicroProBlack-Regular') format('svg'),url('/quad/files/d4766afe290f566da19b3e662b2420e1.svgz#FreightMicroProBlack-Regular') format('svg');}


/* 02 =COMMON STYLES
------------------------- */

body { font-family: "ff-din-web-1","ff-din-web-2",sans-serif; font-size: 12px; font-weight: 400; color: #000; }
select, input, textarea { color: #444; }

h1, h2, h3, h4, h5, h6 { font-weight: 600; }

.base h1 { font-size: 32px; text-transform: capitalize; margin: 0 0 20px; }
.base h2 { font-size: 22px; letter-spacing: 1px; margin: 20px 0; font-weight: 400; }
.base h3 { font-size: 18px; text-transform: uppercase; margin: 10px 0; }
.base h4 { font-size: 14px; }

.base p { font-size: 14px; line-height: 20px; margin: 5px 0; color: #333; }

a { text-decoration: none; }
a:link, a:visited { color: #00aeef; }
a:hover, a:active { outline: none; color: #ec008c; }
a:hover, a:focus { color: #ec008c; }
a:link { -webkit-tap-highlight-color: #ec008c; }

blockquote { background: #f6f6f6; padding: 20px 40px; margin: 10px 0; font-size: 14px; }

.base ul, .base ol { margin: 10px 40px; font-size: 14px; line-height: 20px; }
.base ul li { list-style: square outside; }
.base ol li { list-style: decimal outside; }
.base li ol { margin: 0 20px; }
.base li ul { margin: 0 20px; }

input, textarea { border: none; font-family: "ff-din-web-1","ff-din-web-2",sans-serif; padding: 5px 10px; }
input.text, textarea.text { color: #666; -moz-box-shadow: inset 2px 2px 5px #ddd; -webkit-box-shadow: inset 2px 2px 5px #ddd; box-shadow: inset 2px 2px 5px #ddd; border: 1px solid #eee; }
input.submit { background: #FFF200; padding: 10px 40px; color: #000; font-weight: 600; text-transform: uppercase; font-size: 16px; }
input.submit:hover, input.submit:active { background: #00aa4f; color: #fff; }

/* 03 =LAYOUT
------------------------- */

body { background: url(http://surf.bluestatedigital.com/page/-/quad/background_interior.png) center top no-repeat; }

#container { width: 970px; margin: 0 auto; }

header { margin: 0 auto; height: 157px; display: block; position: relative; font-weight: 600; }
header a#logo { width: 160px; height: 160px; display: block; text-indent: -9999em; overflow: hidden; position: absolute; top: 26px; left: 0; z-index: 999; background: url(http://surf.bluestatedigital.com/page/-/quad/quad_logo_interior.png) center -15px no-repeat; }
header h2 { color: #fff; height: 25px; line-height: 27px; float: left; width: 415px; }
form#qksignup { float: right; line-height: 23px; width: 420px; }
form#qksignup input.text { font-size: 11px; line-height: 13px; height: 13px; padding: 2px 5px; float: left; margin: 3px 5px 0 0; -moz-box-shadow: inset 2px 2px 5px #999; -webkit-box-shadow: inset 2px 2px 5px #999; box-shadow: inset 2px 2px 5px #999; border: none; }
form#qksignup input#qksignup-email { width: 135px; }
form#qksignup input#qksignup-zip { width: 100px; }
form#qksignup input.submit { background: #000; color: #fff200; line-height: 26px; height: 26px; padding: 0; width: 155px; text-align: center; letter-spacing: 1px; float: right; font-size: inherit; }
header nav { clear: both; }
header nav li { float: left; position: relative; display: inline; }
ul#header-nav-extra { float: right; padding: 10px 0; font-weight: 600; }
ul#header-nav-extra a:link, ul#header-nav-extra a:visited { color: #000; }
ul#header-nav-extra a:hover, ul#header-nav-extra a:active { color: #00aa4f; }
ul#header-nav-extra li { border-left: 1px solid #000; padding: 0 0 0 5px; }
ul#header-nav-extra li:first-child { border: none; padding: 0 5px 0 0; }
ul#header-nav-main { float: right; clear: both; font-size: 19px; text-transform: uppercase; letter-spacing: 1px; }
ul#header-nav-main a { color: #fff; display: block; padding: 8px 20px; background: #000; }
ul#header-nav-main a:hover, ul#header-nav-main a:active { color: #000; background: #00aa4f; }
a#header-nav-donate { float: right; clear: both; color: #fff; background: #00aeef; text-transform: uppercase; font-size: 16px; background: url(http://surf.bluestatedigital.com/page/-/quad/donate.png) center 0 no-repeat; height: 35px; line-height: 35px; width: 140px; text-align: center; }
a#header-nav-donate:hover, a#header-nav-donate:active { background-position: center -35px; }

section#main { width: 969px; border-left: 1px solid #ccc; background: #efefef; }
#content { width: 689px; padding: 20px; float: left; background: #fff; min-height: 650px; }
.interior #content { padding: 22px 20px 20px; }
.full-width section#main { width: 968px; border-right: 1px solid #ccc; }
.full-width #content { width: 928px; float: none; }

footer { color: #7d7d7d; }
footer h2 { font-size: 16px; color: #fff; text-transform: uppercase; margin: 0 17px 15px; }
footer h3 { font-size: 13px; color: #fff; margin: 10px 0 5px; }
footer p { font-weight: 600; }
footer figure { float: left; }
footer figure a.image { margin: 0 15px; }
footer figure figcaption { margin: 0 15px; }
footer a:link, footer a:visited { color: #fff; }
footer a:hover, footer a:active { color: #00aa4f; }
footer a.image { display: block; }
section#footer-content { background: #000; padding: 15px; border-top: 5px solid #fff200; margin: 0 0 15px; }
nav#footer-nav-socnet { width: 114px; height: 166px; float: left; background: url(http://surf.bluestatedigital.com/page/-/quad/quad_logo_footer.png) center no-repeat; }
nav#footer-nav-socnet ul { padding: 150px 31px 0; width: 52px; height: 16px; }
nav#footer-nav-socnet li { float: left; display: inline; position: relative; margin: 0 5px; }
nav#footer-nav-socnet a { width: 16px; height: 16px; text-indent: -9999em; overflow: hidden; background: url(http://surfrider.org/quad/images/main/facebook.png) center no-repeat; border: none; }
nav#footer-nav-socnet li.twitter a { background-image: url(http://surfrider.org/quad/images/main/twitter.png); }
section#footer-content-main { float: right; width: 510px; }
section#footer-content-main figure { width: 255px; }
section#footer-content-main figure a.image { width: 225px; height: 120px; overflow: hidden; }
section#footer-content-main figure img { width: 225px; display: block; }
section#footer-content-store { float: right; width: 300px; }
section#footer-content-store figure { width: 150px; }
section#footer-content-store figure a.image { width: 120px; height: 120px; overflow: hidden; }
section#footer-content-store figure img { width: 120px; display: block; }
footer section#footer-credits { color: #626262; font-size: 10px; line-height: 16px; background: url(http://surfrider.org/quad/images/main/surfrider_logo.png) 15px center no-repeat; padding: 0 0 0 90px; margin: 15px 0; a:link: #626262; , a:visited: #626262; }
footer section#footer-credits a:visited { color: #626262; }
footer section#footer-credits a:link { color: #626262; }


/* 04 =HOMEPAGE
------------------------- */

body#home header { margin: 0 auto 130px; }
body#home header a#logo { width: 188px; height: 188px; background: url(http://surf.bluestatedigital.com/page/-/quad/quad_logo_home.png) center -26px no-repeat; }
body#home a#header-nav-donate { display: block; visibility: visible; }
body#home section#main { border: 0; background: transparent; width: 970px; }
body#home #content { background: transparent; }

section#home-feature { position: relative; width: 645px; height: 145px; background: #000; border-top: 5px solid #fff200; color: #fff; font-size: 16px; margin: 0 0 30px; font-weight: 600; }
section#home-feature h1 { margin: 20px 50px 10px; text-transform: uppercase; font-size: 30px; font-weight: 900; }
section#home-feature p { margin: 10px 50px; line-height: 20px; }
section#home-feature p a:link { color: #00aeef; }
section#home-feature p a:hover, section#home-feature details a:active { color: #ec008c; }
section#home-feature nav { position: absolute; top: 120px; text-transform: uppercase; }
section#home-feature nav li { margin: 0 12px; float: left; display: inline; }
section#home-feature nav a { display: block; width: 190px; text-align: center; color: #000; background: #fff200; padding: 10px 0; font-weight: 600; }
section#home-feature nav a:hover, section#home-feature nav a:active { color: #fff; background: #00aa4f; }
#home-feature-number { position: absolute; top: -5px; left: 645px; width: 325px; height: 165px; text-align: center; }
#home-feature-number span.number { font-family: FreightMicroProBlack-Regular; display: block; font-size: 200px; line-height: 139px; text-shadow: 2px 2px 0px rgba(0,0,0,0.4); filter: dropshadow(color=#000000, offx=2, offy=2); width: 325px; text-align: center; }
#home-feature-number span.text { display: block; background: url(http://surfrider.org/quad/images/main/projects_number.png) 35px no-repeat; width: 325px; height: 34px; text-indent: -9999em; overflow: hidden; position: absolute; top: 131px; left: 0; }

/* jQuery UI Tabs 1.8.13  */
.ui-tabs { position: relative; zoom: 1; } /* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: text; }
.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
.ui-tabs .ui-tabs-panel { display: block; }
.ui-tabs .ui-tabs-hide { display: none !important; }

section#home-projects { background: #efefef url(http://surfrider.org/quad/images/main/gallery_background.png) 0 0 no-repeat; margin: 0 0 15px; }
section#home-projects section { float: left; }
nav#home-projects-nav { width: 160px; padding: 10px 0; float: left; }
nav#home-projects-nav h3 { font-size: 13px; text-transform: uppercase; padding: 10px; margin: 10px 0 0; vertical-align: baseline; }
nav#home-projects-nav a { display: block; color: #333; padding: 5px 10px; text-transform: capitalize; vertical-align: baseline; }
nav#home-projects-nav .ui-tabs-selected a, nav#home-projects-nav a:hover, section#home-projects-nav a:active { background: #4b4b4b; color: #fff; }
section.home-projects-tab { padding: 20px 0 0 20px; width: 790px; color: #3c3c3c; }
section.home-projects-tab h2 { font-size: 20px; margin: 0 0 10px; }
section.home-projects-tab figure { float: left; width: 375px; height: 140px; padding: 0 20px 0 0; }
section.home-projects-tab a:link, section.home-projects-tab a:visited { color: #00aeef; }
section.home-projects-tab a:hover, section.home-projects-tab a:active { color: #ec008c; }
section.home-projects-tab a.image { display: block; width: 145px; height: 115px; overflow: hidden; border: 2px solid #d5d5d5; float: left; }
section.home-projects-tab a.image:hover, section.home-projects-tab a.image:active { border: 2px solid #00aa4f; }
section.home-projects-tab img { display: block; width: 145px; }
section.home-projects-tab figcaption { display: block; float: left; padding: 0 0 0 20px; width: 206px; }
section.home-projects-tab h3 { font-size: 14px; margin: 0 0 5px; font-weight: 900; }
section.home-projects-tab p { font-weight: 600; }
section.home-projects-tab a.more { display: block; margin: 10px 0 0; }


/* 05 =SUBPAGES
------------------------- */

.index section.entry { margin: 0 0 20px; }
.index section.entry figure { width: 149px; float: left; }
.index section.entry figure a { display: block; width: 145px; height: 115px; overflow: hidden; border: 2px solid #d5d5d5; float: left; }
.index section.entry figure a:hover, .index #content figure a:active { border: 2px solid #00aa4f; }
.index section.entry figure img { display: block; width: 145px; }
.index section.entry section.summary { float: right; width: 520px; }
.index section.entry h2 { margin: 0; letter-spacing: normal; }
nav.pagination { font-size: 14px; font-weight: 600; }

#projects.entry #content { padding: 20px; }
#projects.entry section#content-image { margin: 0 auto; position: relative; width: 689px; height: 324px; }
#projects.entry div#content-image-cycle { width: 685px; height: 320px; overflow: hidden; border: 2px solid #d5d5d5; display: block; }
#projects.entry section#content-image figure { width: 685px; height: 320px; }
#projects.entry section#content-image img { display: block; width: 685px; }
#projects.entry section#content-image figcaption { display: block; position: absolute; left: 20px; bottom: 20px; width: 400px; }
#projects.entry section#content-image figcaption span { background: #000; line-height: 20px; font-size: 14px; color: #fff; text-transform: uppercase; margin: 0; font-weight: 600; padding: 2px 0; }
#projects.entry section#content-image #volunteer-number { position: absolute; bottom: -20px; right: 20px; width: 90px; height: 55px; padding: 35px 0 0; background: url(http://surf.bluestatedigital.com/page/-/quad/project_volunteers.png) center no-repeat; font-size: 38px; text-align: center; font-family: FreightMicroProBlack-Regular; color: #fff; z-index: 9999; }
#projects.entry nav#content-image-nav { position: absolute; top: 152px; left: 12px; width: 665px; height: 24px; z-index: 9999; }
#projects.entry nav#content-image-nav a { display: block; width: 24px; height: 24px; text-indent: -9999em; overflow: hidden; background: url(http://surfrider.org/quad/images/main/project_photo_arrowl.png) no-repeat; position: absolute; left: 0; top: 0; }
#projects.entry nav#content-image-nav a#content-image-next { background-image: url(http://surfrider.org/quad/images/main/project_photo_arrowr.png); left: auto; right: 0; }
#projects.entry section#content-main { padding: 20px 0 0; }
#projects.entry aside#content-side { width: 140px; float: left; }
#projects.entry aside#content-side section { margin: 0 0 20px; }
#projects.entry aside#content-side h3 { font-size: 14px; margin: 0 0 5px; }
#projects.entry aside#content-side p { font-size: 12px; line-height: 16px; margin: 5px 0 0; font-weight: 600; }
#projects.entry #project-signup { margin: 0 0 20px; }
#projects.entry a#project-signup-button { display: block; width: 140px; text-align: center; font-size: 16px; text-transform: uppercase; color: #000; background: #fff200; padding: 10px 0; }
#projects.entry #project-signup-form { position: absolute; z-index: 999; background: #fff200; padding: 20px 15px 20px 20px; width: 649px; }
#projects.entry #project-signup-form .info { float: left; color: #d9d9d9; background: #000; width: 160px; }
#projects.entry #project-signup-form .info h3 { padding: 10px; color: #fff; text-transform: uppercase; font-weight: 600; }
#projects.entry #project-signup-form .info p { margin: 0; padding: 0 10px 10px; font-size: 14px; line-height: 20px; color: #fff; }
#projects.entry #project-signup-form form { float: right; width: 474px; }
#projects.entry #project-signup-form form input.text,
#projects.entry #project-signup-form form textarea.text { -moz-box-shadow: inset 2px 2px 5px #999; -webkit-box-shadow: inset 2px 2px 5px #999; box-shadow: inset 2px 2px 5px #999; border: none; }
#projects.entry #project-signup-form form input.text { width: 205px; margin: 0 5px 10px; }
#projects.entry #project-signup-form form textarea.text { width: 444px; margin: 0 5px; min-height: 73px; }
#projects.entry #project-signup-form form input.submit { background: #000; color: #fff; float: right; margin: 5px 5px 0; padding: 5px 40px; text-transform: none; font-size: inherit; }
#projects.entry aside#content-side a#contact-leaders { font-weight: bold; display: block; margin: 0 0 20px; }
#projects.entry aside#content-side .fb_iframe_widget span { display: block; margin: 10px 0; }
#projects.entry section#content-text { width: 530px; float: right; }
#projects.entry section#content-text p.category { color: #4c4c4c; font-size: 12px; text-transform: uppercase; margin: 0 0 5px; }
#projects.entry section#content-text p.category a { font-weight: 600; text-transform: capitalize; font-size: 16px; color: #4c4c4c; }
#projects.entry section#content-text p.category a:hover, #projects.entry section#content-text p.category a:active { color: #999; }
#projects.entry section#content-text h3 { margin: 0 0 5px; }
#projects.entry section#content-text p { margin: 0 0 10px; }




/* 06 =SIDEBAR
------------------------- */

section#sidebar { width: 200px; padding: 20px; float: right; color: #545454; }
section#sidebar .block { margin: 0 0 20px; }
section#sidebar h4 { font-size: 18px; margin: 0 0 10px; color: #000; }
section#sidebar h5 { font-size: 14px; line-height: 18px; }
section#sidebar-about strong { font-weight: 600; color: #000; }
section#sidebar-about p { display: inline; line-height: 16px; margin: 0; }
nav#sidebar-actions li { margin: 10px 0; }
nav#sidebar-actions a, nav#sidebar-actions a:link, nav#sidebar-actions a:visited { display: block; text-align: center; width: 200px; padding: 10px 0; font-size: 16px; color: #000; background: #fff200; text-transform: uppercase; font-weight: 600; }
nav#sidebar-actions a:hover, nav#sidebar a:active { background: #00aa4f; color: #fff; }
nav#sidebar-actions .donate a { color: #fff; background: #00aeef; }
nav#sidebar-actions .donate a:hover, nav#sidebar .donate a:active { background: #ec008c; }
section#sidebar-blog p.time { font-size: 11px; text-transform: uppercase; margin: 10px 0 0; display: block; }
section#sidebar-browse li { margin: 5px 0 0; padding: 0; }
section#sidebar-browse a, section#sidebar-browse a:link, section#sidebar-browse a:visited { color: #333; text-transform: capitalize; display: block; margin: 0; }
section#sidebar-browse a:hover, section#sidebar-browse a:active { color: #999; }
section#sidebar-featured figure { margin: 20px 0 0; }
section#sidebar-featured a.image { display: block; width: 65px; border: 2px solid #d5d5d5; float: left; }
section#sidebar-featured a.image:hover, section#sidebar-featured a.image:active { border: 2px solid #00aa4f; }
section#sidebar-featured a.image img { display: block; width: 65px; }
section#sidebar-featured figcaption { float: right; width: 120px; }


/* 07 =FRAMEWORK
------------------------- */





/* 08 =UTILITY
------------------------- */

/* Internet Explorer Fixes */
.ie6 form#qksignup { width: 340px; }
.ie6 #projects.entry nav#content-image-nav a { background-image: url(http://surfrider.org/quad/images/main/project_photo_arrowl_ie.png); }
.ie6 #projects.entry nav#content-image-nav a#content-image-next { background-image: url(http://surfrider.org/quad/images/main/project_photo_arrowr_ie.png); }
.ie6 #projects.entry section#content-image #volunteer-number { background-image: url(http://surfrider.org/quad/images/main/project_volunteers_ie.png); }
.ie6 #projects.entry #project-signup-form form input.text { margin: 0 3px 10px; }
.ie6 #disqus_thread { display: none; visibility: hidden; }

.cufon-loading * { visibility: hidden !important; }

.floatl { float: left; margin: 0; padding: 0 10px 10px 0; }
.floatr { float: right; margin: 0; padding: 0 0 10px 10px; }
.required { color: red; }
.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
.hidden { display: none; visibility: hidden; } 
/* Hide only visually, but have it available for screenreaders www.webaim.org/techniques/css/invisiblecontent/  &  j.mp/visuallyhidden  */
.visuallyhidden { position: absolute !important; clip: rect(1px 1px 1px 1px);  clip: rect(1px, 1px, 1px, 1px); }
/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after { content: "."; display: block; height: 0; visibility: hidden; } 
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

input:valid, textarea:valid   {  }
input:invalid, textarea:invalid { border-radius: 1px;  -moz-box-shadow: 0px 0px 5px red; -webkit-box-shadow: 0px 0px 5px red;  box-shadow: 0px 0px 5px red; }
.no-boxshadow input:invalid, 
.no-boxshadow textarea:invalid { background-color: #f0dddd; }

::-moz-selection{ background: #1fb9e7; color:#fff; text-shadow: none; }
::selection { background:#1fb9e7; color:#fff; text-shadow: none; } 


/* 09 =PRINT
------------------------- */

@media print {
  * { background: transparent !important; color: #444 !important; text-shadow: none !important; }
  a, a:visited { color: #444 !important; text-decoration: underline; }
  a:after { content: " (" attr(href) ")"; } 
  abbr:after { content: " (" attr(title) ")"; }
  .ir a:after { content: ""; }  
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; }  
  tr, img { page-break-inside: avoid; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3{ page-break-after: avoid; }
  #sidebar, #editToggle, .editThis, #navigation, #addthis, #search, #nav, #footer-content, header nav, form#qksignup, #project.entry #project-video, #projects.entry #project-signup, #projects.entry #project-share { display: none; }
  /* hide disqus since it is extraneous content that just increases page size */
  #disqus_thread { display: none; }
  a.dsq-brlink { display: none; }
 
  /* float blog entry images to decrease page length */
  #main { overflow: hidden; }
  #main img { float: left; clear: both; /*keeps images from piling up next to each other*/ margin: 0 10px 10px 0; }
  header { height: 50px; }
  header a#logo { text-indent: inherit; font-size: 36px; width: auto; height: auto; }