/*
Theme Name: San Francisco Foundation
Theme URI: http://wordpress.org/themes/sff
Author: the WordPress team
Author URI: http://wordpress.org/
Description: In 2014, our default theme lets you create a responsive magazine website with a sleek, modern design. Feature your favorite homepage content in either a grid or a slider. Use the three widget areas to customize your website, and change your content's layout with a full-width page template and a contributor page to show off your authors. Creating a magazine website with WordPress has never been easier.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: black, green, white, light, dark, two-columns, three-columns, left-sidebar, right-sidebar, fixed-layout, responsive-layout, custom-background, custom-header, custom-menu, editor-style, featured-images, flexible-header, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready, accessibility-ready
Text Domain: sff 

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/**
 * Table of Contents:
 *
 * 1.0 - Reset
 * 2.0 - Repeatable Patterns
 * 3.0 - Basic Structure
 * 4.0 - Typography
 * 5.0 - Header
 * 6.0 - Footer
 * 7.0 - Main Content
 * -----------------------------------------------------------------------------
 */


/**
 * 1.0 Reset
 *
 * Resetting and rebuilding styles have been helped along thanks to the fine
 * work of Eric Meyer http://meyerweb.com/eric/tools/css/reset/index.html
 * along with Nicolas Gallagher and Jonathan Neal
 * http://necolas.github.com/normalize.css/ and Blueprint
 * http://www.blueprintcss.org/
 *
 * -----------------------------------------------------------------------------
 */

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, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section {
	display: block;
}

audio,
canvas,
video {
	display: inline-block;
	max-width: 100%;
}

html {
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust:     100%;
}

body,
button,
input,
select,
textarea {
	color: #fff;
	font-family: Lato, sans-serif;
	font-size: 19px;
	font-weight: 400;
	font-family: proxima_novalight, Helvetica, sans-serif;
	line-height: 1.2;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
body .light-panel,
.light-panel button,
.light-panel input,
.light-panel select,
.light-panel textarea {
	color: #2b2b2b;
}

body {
	background: #f5f5f5;
}

a {
	color: #fff;
	text-decoration: none;
}
.light-panel a {
	color: #2b2b2b;
}

a:focus {
	outline: thin dotted;
}

a:hover,
a:active {
	outline: 0;
}

a:active,
a:hover {
	color: #da291c;
}

address {
	font-style: italic;
	margin-bottom: 24px;
}

abbr[title] {
	border-bottom: 1px dotted #2b2b2b;
	cursor: help;
}

b,
strong {
	font-weight: 700;
}

cite,
dfn,
em,
i {
	font-style: italic;
}

mark,
ins {
	background: #fff9c0;
	text-decoration: none;
}

p, .p-margin {
	margin-bottom: 24px;
}
.no-margin {
	margin-bottom: 0;
}

code,
kbd,
tt,
var,
samp,
pre {
	font-family: monospace, serif;
	font-size: 15px;
	-webkit-hyphens: none;
	-moz-hyphens:    none;
	-ms-hyphens:     none;
	hyphens:         none;
	line-height: 1.6;
}

pre {
	border: 1px solid rgba(0, 0, 0, 0.1);
	-webkit-box-sizing: border-box;
	-moz-box-sizing:    border-box;
	box-sizing:         border-box;
	margin-bottom: 24px;
	max-width: 100%;
	overflow: auto;
	padding: 12px;
	white-space: pre;
	white-space: pre-wrap;
	word-wrap: break-word;
}

blockquote,
q {
	-webkit-hyphens: none;
	-moz-hyphens:    none;
	-ms-hyphens:     none;
	hyphens:         none;
	quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
	content: "";
	content: none;
}

blockquote {
	color: #767676;
	font-size: 19px;
	font-style: italic;
	font-weight: 300;
	line-height: 1.2631578947;
	margin-bottom: 24px;
}

blockquote cite,
blockquote small {
	color: #2b2b2b;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
}

blockquote em,
blockquote i,
blockquote cite {
	font-style: normal;
}

blockquote strong,
blockquote b {
	font-weight: 400;
}

small {
	font-size: smaller;
}

big {
	font-size: 125%;
}

sup,
sub {
	font-size: 75%;
	height: 0;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	bottom: 1ex;
}

sub {
	top: .5ex;
}

dl {
	margin-bottom: 24px;
}

dt {
	font-weight: bold;
}

dd {
	margin-bottom: 24px;
}

ul,
ol {
	list-style: none;
	margin: 0 0 24px 20px;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

li > ul,
li > ol {
	margin: 0 0 0 20px;
}

img {
	-ms-interpolation-mode: bicubic;
	border: 0;
	vertical-align: middle;
}

figure {
	margin: 0;
}

fieldset {
	border: 1px solid rgba(0, 0, 0, 0.1);
	margin: 0 0 24px;
	padding: 11px 12px 0;
}

legend {
	white-space: normal;
}

button,
input,
select,
textarea {
	-webkit-box-sizing: border-box;
	-moz-box-sizing:    border-box;
	box-sizing:         border-box;
	font-size: 100%;
	margin: 0;
	max-width: 100%;
	vertical-align: baseline;
}

button,
input {
	line-height: normal;
}

input,
textarea {
	background-image: -webkit-linear-gradient(hsla(0,0%,100%,0), hsla(0,0%,100%,0)); /* Removing the inner shadow, rounded corners on iOS inputs */
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
	-webkit-appearance: button;
	cursor: pointer;
}

button[disabled],
input[disabled] {
	cursor: default;
}

input[type="checkbox"],
input[type="radio"] {
	padding: 0;
}

input[type="search"] {
	-webkit-appearance: textfield;
}

input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

textarea {
	overflow: auto;
	vertical-align: top;
}

table,
th,
td {
	border: 1px solid rgba(0, 0, 0, 0.1);
}

table {
	border-collapse: separate;
	border-spacing: 0;
	border-width: 1px 0 0 1px;
	margin-bottom: 24px;
	width: 100%;
}

caption,
th,
td {
	font-weight: normal;
	text-align: left;
}

th {
	border-width: 0 1px 1px 0;
	font-weight: bold;
}

td {
	border-width: 0 1px 1px 0;
}

del {
	color: #767676;
}

hr {
	background-color: rgba(0, 0, 0, 0.1);
	border: 0;
	height: 1px;
	margin-bottom: 23px;
}

/* Support a widely-adopted but non-standard selector for text selection styles
 * to achieve a better experience. See http://core.trac.wordpress.org/ticket/25898.
 */
::selection {
	background: #000;
	color: #fff;
	text-shadow: none;
}

::-moz-selection {
	background: #000;
	color: #fff;
	text-shadow: none;
}
.cf:before,
.cf:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.cf:after {
    clear: both;
}

/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.cf {
    *zoom: 1;
}


/**
 * 2.0 Repeatable Patterns
 * -----------------------------------------------------------------------------
 */

/* Input fields */

input,
textarea {
	background-color: #da291c;
	border: 1px solid #fff;
	color: #fff;
	padding: 5px 6px 0px;
}

textarea {
	width: 100%;
}

input:focus,
textarea:focus {
	outline: 0;
}

/* Buttons */

button,
.contributor-posts-link,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	background-color: #da291c;
	border: 1px solid #fff;
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	padding: 6px 9px 2px;
	vertical-align: bottom;
}

button:hover,
button:focus,
.contributor-posts-link:hover,
input[type="button"]:hover,
input[type="button"]:focus,
input[type="reset"]:hover,
input[type="reset"]:focus,
input[type="submit"]:hover,
input[type="submit"]:focus {
	background-color: #fff;
	color: #da291c;
}

button:active,
.contributor-posts-link:active,
input[type="button"]:active,
input[type="reset"]:active,
input[type="submit"]:active {
	background-color: #fff;
	color: #da291c;
}

.search-field {
	width: 100%;
}

.search-submit {
	display: none;
}

/* Placeholder text color -- selectors need to be separate to work. */

::-webkit-input-placeholder {
	color: #fff;
	font-style: italic;
	font-weight: 700;
}

:-moz-placeholder {
	color: #fff;
	font-style: italic;
	font-weight: 700;
}

::-moz-placeholder {
	color: #fff;
	font-style: italic;
	font-weight: 700;
	opacity: 1; /* Since FF19 lowers the opacity of the placeholder by default */
}

:-ms-input-placeholder {
	color: #fff;
	font-style: italic;
	font-weight: 700;
}

/* Responsive images. Fluid images for posts, comments, and widgets */

.comment-content img,
.entry-content img,
.entry-summary img,
#site-header img,
.widget img,
.wp-caption {
	max-width: 100%;
}

/**
 * Make sure images with WordPress-added height and width attributes are
 * scaled correctly.
 */

.comment-content img[height],
.entry-content img,
.entry-summary img,
img[class*="align"],
img[class*="wp-image-"],
img[class*="attachment-"],
#site-header img {
	height: auto;
}

img.size-full,
img.size-large,
.wp-post-image,
.post-thumbnail img {
	height: auto;
	max-width: 100%;
}

/* Make sure embeds and iframes fit their containers */

embed,
iframe,
object,
video {
	margin-bottom: 24px;
	max-width: 100%;
}

p > embed,
p > iframe,
p > object,
span > embed,
span > iframe,
span > object {
	margin-bottom: 0;
}

/* Alignment */

.alignleft {
	float: left;
}

.alignright {
	float: right;
}

.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

blockquote.alignleft,
img.alignleft {
	margin: 7px 24px 7px 0;
}

.wp-caption.alignleft {
	margin: 7px 14px 7px 0;
}

blockquote.alignright,
img.alignright {
	margin: 7px 0 7px 24px;
}

.wp-caption.alignright {
	margin: 7px 0 7px 14px;
}

blockquote.aligncenter,
.wp-caption.aligncenter {
	margin-top: 7px;
	margin-bottom: 7px;
}

.site-content blockquote.alignleft,
.site-content blockquote.alignright {
	border-top: 1px solid rgba(0, 0, 0, 0.1);
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	padding-top: 17px;
	width: 50%;
}

.site-content blockquote.alignleft p,
.site-content blockquote.alignright p {
	margin-bottom: 17px;
}

.wp-caption {
	margin-bottom: 24px;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin: 0;
}

.wp-caption {
	color: #767676;
}

.wp-caption-text {
	-webkit-box-sizing: border-box;
	-moz-box-sizing:    border-box;
	box-sizing:         border-box;
	font-size: 12px;
	font-style: italic;
	line-height: 1.5;
	margin: 9px 0;
	padding-right: 10px;
}

.wp-smiley {
	border: 0;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Assistive text */

.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-weight: bold;
	height: auto;
	line-height: normal;
	padding: 15px 23px 14px;
	position: absolute;
	left: 5px;
	top: 5px;
	text-decoration: none;
	text-transform: none;
	width: auto;
	z-index: 100000; /* Above WP toolbar */
}

.hide {
	display: none;
}

/* Clearing floats */

.footer-sidebar:before,
.footer-sidebar:after,
.hentry:before,
.hentry:after,
.slider-direction-nav:before,
.slider-direction-nav:after,
.contributor-info:before,
.contributor-info:after,
.search-box:before,
.search-box:after,
[class*="content"]:before,
[class*="content"]:after,
[class*="site"]:before,
[class*="site"]:after {
	content: "";
	display: table;
}

.footer-sidebar:after,
.hentry:after,
.slider-direction-nav:after,
.contributor-info:after,
.search-box:after,
[class*="content"]:after,
[class*="site"]:after {
	clear: both;
}

/* Genericons */

.bypostauthor > article .fn:before,
.comment-edit-link:before,
.comment-reply-link:before,
.comment-reply-login:before,
.comment-reply-title small a:before,
.contributor-posts-link:before,
.menu-toggle:before,
.search-toggle:before,
.slider-direction-nav a:before,
.widget_sff_ephemera .widget-title:before {
	-webkit-font-smoothing: antialiased;
	display: inline-block;
	font: normal 16px/1 Genericons;
	text-decoration: inherit;
	vertical-align: text-bottom;
}

/* Separators */

.site-content span + .entry-date:before,
.full-size-link:before,
.parent-post-link:before,
span + .byline:before,
span + .comments-link:before,
span + .edit-link:before,
.widget_sff_ephemera .entry-title:after {
	content: "\0020\007c\0020";
}


/**
 * 3.0 Basic Structure
 * -----------------------------------------------------------------------------
 */
 .fw {
 	width: 100%;
  	-webkit-backface-visibility:hidden;
 }
 .fh {
 	height: 100%;
 }
 .fw-contain {
 	width: 1184px;
 	margin: 0 auto;
 	position: relative;
 	height: 100%;
  	-webkit-backface-visibility:hidden;
 }
 .fw-contain2 {
 	width: 948px;
 	margin: 0 auto;
 	height: 100%;
 	position: relative;
 	-webkit-backface-visibility:hidden;
 }
 .fw-contain2 > .inner {
 	padding-left: 32px;
 	padding-right: 32px;
 	height: 100%;
 }
 .fw-contain > .inner {
 	padding: 0 78px;
 	height: 100%;
 	-webkit-backface-visibility:hidden;
 }
 .hide {
 	display: none;
 }
 #main-content {
 	 -webkit-backface-visibility:hidden;
 	position:relative;
 	z-index: 1;
	padding-top: 5px;
	padding-bottom: 44px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
 .valign-wrap {
 	display: table;
 	height: 100%;
 	margin: 0 auto;
 }
 .valign {
 	display: table-cell;
 	vertical-align: middle;
 }
 .left {
 	float: left;
 }
 .right {
 	float: right;
 }
 .slide-nav {
 	position: absolute;
 	top: 40%;
 	font-size: 100px;
 }
 .nav-prev {
 	left: 20px;
 }
 .nav-next {
 	right: 20px;
 }
 .rule-top, .rule-bottom {
 	background-image: url(images/rule_horizontal.png);
 	background-repeat: repeat-x;
 	background-size: auto 3px;
 }
 .rule-bottom-dark {
 	background-image: url(images/rule_horizontal_dark.png);
 }
 .rule-top {
 	background-position: left top;
 	padding-top: 18px;
 }
 .rule-bottom {
 	background-position: left bottom;
 	padding-bottom: 10px;
 }
 .inline-stat.rule-bottom {
 	padding-bottom: 20px;
 	margin-bottom: 20px;
 }
 .list-no-style {
 	list-style-type: none;
 	margin: 0;
 	font-size: 18px;
	font-family: veneer, Helvetica, sans-serif;
 }


/**
 * 4.0 Typography
 * -----------------------------------------------------------------------------
 */
 @font-face {
    font-family: 'arialbold';
    src: url('fonts/arial_bold-webfont.eot');
    src: url('fonts/arial_bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/arial_bold-webfont.woff') format('woff'),
         url('fonts/arial_bold-webfont.ttf') format('truetype'),
         url('fonts/arial_bold-webfont.svg#arialbold') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'arialregular';
    src: url('fonts/arial-webfont.eot');
    src: url('fonts/arial-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/arial-webfont.woff') format('woff'),
         url('fonts/arial-webfont.ttf') format('truetype'),
         url('fonts/arial-webfont.svg#arialregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'proxima_novaregular_italic';
    src: url('fonts/proxima_nova_reg_it-webfont.eot');
    src: url('fonts/proxima_nova_reg_it-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/proxima_nova_reg_it-webfont.woff') format('woff'),
         url('fonts/proxima_nova_reg_it-webfont.ttf') format('truetype'),
         url('fonts/proxima_nova_reg_it-webfont.svg#proxima_novaregular_italic') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'proxima_nova_rgbold';
    src: url('fonts/proximanova-bold-webfont.eot');
    src: url('fonts/proximanova-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/proximanova-bold-webfont.woff') format('woff'),
         url('fonts/proximanova-bold-webfont.ttf') format('truetype'),
         url('fonts/proximanova-bold-webfont.svg#proxima_nova_rgbold') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'proxima_novalight';
    src: url('fonts/proximanova-light-webfont.eot');
    src: url('fonts/proximanova-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/proximanova-light-webfont.woff') format('woff'),
         url('fonts/proximanova-light-webfont.ttf') format('truetype'),
         url('fonts/proximanova-light-webfont.svg#proxima_novalight') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'proxima_nova_rgregular';
    src: url('fonts/proximanova-reg_ot-webfont.eot');
    src: url('fonts/proximanova-reg_ot-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/proximanova-reg_ot-webfont.woff') format('woff'),
         url('fonts/proximanova-reg_ot-webfont.ttf') format('truetype'),
         url('fonts/proximanova-reg_ot-webfont.svg#proxima_nova_rgregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'proxima_nova_cn_rgregular';
    src: url('fonts/proximanovacond-reg-webfont.eot');
    src: url('fonts/proximanovacond-reg-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/proximanovacond-reg-webfont.woff') format('woff'),
         url('fonts/proximanovacond-reg-webfont.ttf') format('truetype'),
         url('fonts/proximanovacond-reg-webfont.svg#proxima_nova_cn_rgregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'proxima_nova_cn_ltsemibold';
    src: url('fonts/proximanovacond-sbold-webfont.eot');
    src: url('fonts/proximanovacond-sbold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/proximanovacond-sbold-webfont.woff') format('woff'),
         url('fonts/proximanovacond-sbold-webfont.ttf') format('truetype'),
         url('fonts/proximanovacond-sbold-webfont.svg#proxima_nova_cn_ltsemibold') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'veneer';
    src: url('fonts/veneer-webfont.eot');
    src: url('fonts/veneer-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/veneer-webfont.woff') format('woff'),
         url('fonts/veneer-webfont.ttf') format('truetype'),
         url('fonts/veneer-webfont.svg#veneer') format('svg');
    font-weight: normal;
    font-style: normal;

}
h1,
h2,
h3,
h4,
h5,
h6,
.standout, .standout-sm, .inline-stat p {
	clear: both;
	font-family: veneer, Helvetica, sans-serif;
}

h1, .standout {
	font-size: 60px;
	line-height: 1;
}

.h1sml {
	font-size: 50px;
}

h2, .standout-sm {
	font-size: 40px;
	line-height: 1;
}

h3 {
	font-size: 28px;
	line-height: 1.0909090909;
}

h4 {
	font-size: 22px;
	line-height: 1.1;
}

h5 {
	font-size: 18px;
	line-height: 1.1;
}

h6 {
	font-size: 16px;
	line-height: 1.5;
}
.smallertxt {
	font-size: 14px;
	font-family: proxima_nova_rgregular, Helvetica, sans-serif;
	margin-bottom: 9px;
	line-height: 18px;
}
.tooltip .smallertxt {
	margin-bottom: 12px;
}
.smalltxt {
	font-size: 16px;
}
.largetxt {
	font-size: 23px;
}
.inline-stat p {
	font-size: 24px;
}
.inline-stat.inline-stat-sm p, .grid-overlay-box h3, .map-stat {
	font-size: 20px;
}
.map-stat {
	font-family: veneer, Helvetica, sans-serif;
}
.grid-overlay-box h3 {
	font-family: proxima_novalight, Helvetica, sans-serif;
	line-height: 1.1;
}
.cc1 {
	color: #fff;
}
.cc2 {
	color: #da291c;
}
.story-title {
	margin-bottom: 8px;
}
.form-title {
	font-size: 13px;
	line-height: 1;
}
.grid-overlay-box h2 {
	color: #fff;
	font-size: 24px;
	font-family: veneer, Helvetica, sans-serif;
	line-height: 1.2;
	margin-bottom: 3px;
}
.pdf-attach a {
	font-family: proxima_novaregular_italic, Helvetica, sans-serif;
	font-size: 13px;
	background-image: url(images/pdf-icon.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	padding: 40px 0 0 7px;
	bottom: 10%;
	position: absolute;
	display: block;
}


/**
 * 5.0 Header
 * -----------------------------------------------------------------------------
 */
 #masthead {
 	position: fixed;
 	top: 5px;
 	z-index: 100;
 }
 .site-title a {
 	background-image: url(images/logo_main.png);
 	background-repeat: no-repeat;
 	width: 86px;
 	height: 79px;
 	text-indent: -9999px;
 	display: block;
 }
 .menu-main {
 	list-style: none;
 }
 .menu-main > li {
 	margin-left: 30px;
 	float: left;
 } 
 .menu-main li a {
 	font-size: 18px;
	font-family: proxima_nova_cn_rgregular, Helvetica, sans-serif;
	color:#ffffff;
    -webkit-transition: color 300ms ease-out;
    -moz-transition: color 300ms ease-out;
    -o-transition: color 300ms ease-out;
    transition: color 300ms ease-out;
}
body.light-theme .menu-main li a {
	color:#2b2b2b;
}
.menu-main li a:hover, body.light-theme .menu-main li a:hover, body .menu-main li.sff-current-menu-item a {
	color:#da291c;
}
#progress-bar{
	position: fixed;
	height:5px;
	width:100%;
	background-color: #000000;
	z-index: 100;
}
#progress-bar .progress {
	display: block;
	height: 100%;
	width:45%;
	background-color: #da291c;
    -webkit-transition: width 300ms ease-out;
    -moz-transition: width 300ms ease-out;
    -o-transition: width 300ms ease-out;
    transition: width 300ms ease-out;
}
/**
 * 6.0 Footer
 * -----------------------------------------------------------------------------
 */
#colophon {
	background-color: #da291c;
	padding: 9px 0 6px;
	position: fixed;
	bottom: 0;
	z-index: 1000;
}
/*To fight the FOUC*/
.js #mc_embed_signup {
	display: none;
}
.newsletter-signup, #mce-success-response {
	width: 549px;
}
.form-title {
	margin-right: 20px;
	margin-top: 7px;
}
.form-field {
	margin: 0 10px 0 0;
	font-size: 12px;
	line-height: 1;
}
.form-field input {
	padding: 6px 6px 2px;
	width: 176px;
}
#mce-responses .response {
	background-color: #da291c;
	padding: 18px;
	bottom: 34px;
	position: absolute;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.btn-close {
	background-image: url(images/closex.png);
	background-repeat: no-repeat;
	width: 11px;
	height: 11px;
	text-indent: -9999px;
	top: 7px;
	right: 8px;
	position: absolute;
	display: block;
}
.response h4 {
	margin-bottom: 10px;
}
.response p {
	font-size: 15px;
	margin-bottom: 0;
}
.sm {
	margin-right: 15px;
	position: relative;
	display: block;
}
.sm:last-child {
	margin-right: 0;
}
.sm a:hover {
	background-color: #fff;
}
.sm i {
	width: 26px;
	padding: 4px 0 3px;
	text-align: center;
}
.fa-border {
	padding: .25em .35em .20em;
	border: 1px solid #fff;
	border-radius: 0;
}
.count {
	background-color: #fff;
	border-radius: 95px;
	font-size: 10px;
	font-family: proxima_nova_rgbold, Helvetica, sans-serif;
	line-height: 22px;
	position: absolute;
	top: -6px;
	right: -13px;
	width: 22px;
	height: 22px;
	text-align: center;
	overflow: hidden;

}


/**
 * 7.0 Main Content
 * -----------------------------------------------------------------------------
 */
 article#post-11 {
 	background-color: #E4E2CF;
 }
 .ajax-content, .slide-wrap, .slides, #slideshow-wrap, #main-content, #main, #page, body, html {
 	height: 100%;

 }
  .ajax-content, .slide-wrap, .slides, #slideshow-wrap, #main-content, #main, {

 	-webkit-backface-visibility:hidden;
 }
 .ajax-content {
 	position: relative;
 	overflow-y: auto;
 	overflow-x: hidden; 
 }
 .type-page {
 	background-size: cover;
 	background-position: center;
 }
 .post-11.type-page {
 	background-size: 100% 100%;
 }
 .textbox {
 	background: #fff;
 	background: rgba(255,255,255,0.8);
 	padding-top: 35px;
 	padding-bottom: 30px;
 	display: table-cell;
 }
 .valign-left, .valign-left.text-col, .text-col.numbers-intro.left {
 	width: 367px;
 	padding-right: 55px;
 }
 .text-col.numbers-intro.right {
 	width: auto;
 }
 .map-intro-wrap {
 	margin: 0 0 0 88px;
 }
 .map-intro {
 	width: 318px;
 }
 .mapintrocopy {
 	height: 214px;
 }
 .text-col {
 	padding: 0 18px;
 }
 .text-col.left {
 	width: 580px;
 }
 .text-col.right {
 	width: 232px;
 }
 .inline-stat span {
 	width: 390px;
 }
 .inline-stat span {
 	width: 80px;
 	margin-right: 10px;
 	vertical-align: middle;
 	display: inline-block;
 }
 .inline-stat.inline-stat-sm span {
 	width: 160px;
 	line-height: 0.9
 }
 .inline-stat p {
 	margin-bottom: 0;
 	vertical-align: middle;
 	display: inline-block;
 }
 .inline-stat.inline-stat-sm span, .inline-stat.inline-stat-sm p {
 	vertical-align: bottom;
 }
 .numbers-vcenter {
 	position: relative;
	top: 50%;
	margin-top: -295px;
 }
 .tab-sec {
 	height: 500px;
 	position: relative;
 	display: none;
 }
 #tab-sec-0 .text-col {
 	position: relative;
 	top: 50%;
	margin-top: -57px;
 }
 .tab-sec.active {
 	display: block;
 }
 .flexslider div.tab-sec img {
 	width: auto;
 }
 #tab-sec-1 img {
	width: 396px;
 }
 #tab-sec-2 img {
	width: 765px;
 }
 #tab-sec-3 img {
	width: 882px;
	position: relative;
	bottom: 25px;
 }
 .bar-percent {
 	bottom: 116px;
 	width: 29px;
 	position: absolute;
 	background-image: url(images/trans_px.png);
 }
 .bar-percent span {
 	color: #da291c;
	font-size: 14px;
	font-family: proxima_nova_cn_ltsemibold, Helvetica, sans-serif;
	font-weight: bold;
	letter-spacing: -1px;
	top: -15px;
 	position: absolute;
 	display: none;
 }
 .bar-percent:hover span {
 	display: block;
 }
 #tab-sec-1 img, #tab-sec-2 img {
 	position: relative;
	right: 16px;
 }
 .tab-sec-caption {
 	position: absolute;
 	bottom: 25px;
 }
 .tab-sec-caption .left {
 	text-align: right;
 	padding-left: 10px;
	padding-right: 40px;
 	width: 45.5%;
 	background-image: url(images/rule_vertical.png);
 	background-size: 3px auto;
 	background-repeat: repeat-y;
 	background-position: right top;
 }
 .tab-sec-caption .right {
 	width: 45%;
 }
 .tab-sec-caption p {
 	margin-bottom: 0;
 }
 .menu-tabs-wrap {
 }
 .menu-tabs {
 	list-style-type: none;
 	margin:	0;
 	background-image: url(images/bg_tab-menu.png);
 	background-repeat: no-repeat;
 	padding: 17px 0;
 	width: 852px;
}
 .menu-tabs li {
 	float: left;
 	width: 32.5%;
 	text-align: center;
 	margin-top: 1px;
 }
 .menu-tabs li#tab-sec-link-1 {
 	width: 33.9%;
 }
 .menu-tabs li#tab-sec-link-3 {
 	width: 33.6%;
 }
 .menu-tabs li a {
 	font-size: 15px;
	font-family: proxima_nova_cn_rgregular, Helvetica, sans-serif;
 	padding: 9px 0 5px;
 	display: block;
 }
 .menu-tabs li a:hover, .menu-tabs li.active a {
 	color: #fff;
 	background-color: #da291c;
}
.grid-overlay {
	position: absolute;
	left: 0;
	top: 50%;
	margin-top: -404px;
	width: 100%;
 }
.grid-overlay-wrap {
	height: 269px;
	width: 20%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}
.board-text {
	width: 329px;
	position: absolute;
	top: 50%;
	margin-top: -64px;
}
#board1 {
	background-image: url(images/board1.jpg);
}
#board2 {
	background-image: url(images/board2.jpg);
}
#board3 {
	background-image: url(images/board3.jpg);
}
#board4 {
	background-image: url(images/board4.jpg);
}
#board5 {
	background-image: url(images/board5.jpg);
}
#board6 {
	background-image: url(images/board6.jpg);
	margin-left: 40%;
}
#board7 {
	background-image: url(images/board7.jpg);
}
#board8 {
	background-image: url(images/board8.jpg);
}
#board9 {
	background-image: url(images/board9.jpg);
}
#board10 {
	background-image: url(images/board10.jpg);
}
#board11 {
	background-image: url(images/board11.jpg);
}
#board12 {
	background-image: url(images/board12.jpg);
}
#board13 {
	background-image: url(images/board13.jpg);
}
.grid-overlay-box {
	background-color: #da291c;
	position: relative;
	display: none;
}
.grid-overlay-wrap:hover .grid-overlay-box {
	display: block;
}
.grid-overlay-box .inner {
	position: absolute;
	bottom: 15px;
	left: 20px;
}
.map-menu {
	list-style: none;
	margin: 0 0 25px 0;
	padding-bottom: 22px;
}
.map-menu li.active a {
	color: #da291c;
}
.map-wrap {
	background-image: url(images/map_sprite.png);
	background-repeat: no-repeat;
	background-position: 0 center;
	background-size: 600%;
	width: 649px;
	height: 655px;
	position: absolute;
	right: 0;
	top: 50%;
	margin-top: -328px;
}
.map area {
	background-image: url('images/map_marker.png');
}
.map-wrap.marin, .active-qtip-marin {
	background-position: -649px center;
}
.map-wrap.sanfrancisco, .active-qtip-sanfrancisco {
	background-position: -1298px center;
}
.map-wrap.sanmateo, .active-qtip-sanmateo {
	background-position: -1947px center;
}
.map-wrap.contracosta, .active-qtip-contracosta {
	background-position: -2596px center;
}
.map-wrap.alameda, .active-qtip-alameda {
	background-position: -3245px center;
}
.qtip-custom {
	background: #da291c;
	border: 5px solid #fff;
	color: #2b2b2b;
	font-size: 12px;
	font-family: proxima_nova_rgregular, Helvetica, sans-serif;
	padding: 10px 5px;
	width: 330px;
	max-width: none;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.qtip-custom .qtip-tip {
	background-color: #fff !important;
}
.qtip-custom.qtip-betterbay {
	width: 425px;
	padding: 0;
}
.qtip-betterbay .qtip-content {
	padding: 0;
}
.qtip-col {
	width: 50%;
}
.qtip-content-col {
	padding: 20px 15px 10px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.qtip-col img {
	max-width: 100%;
	display: block;
}
h3.map-stat {
	margin-bottom: 5px;
}
.qtip-content-col p {
	margin-bottom: 0;
}
.tooltip :last-child {
	margin-bottom: 0;
}
.map-marker {
	background-image: url(images/map_marker.png);
	background-repeat: no-repeat;
	width: 43px;
	height: 44px;
	position: absolute;
	top: 142px;
	left: 150px;
	cursor: pointer;
	opacity: 1;
   	-webkit-transition: opacity 0.2s ease-in-out;
   	-moz-transition: opacity 0.2s ease-in-out;
   	-o-transition: opacity 0.2s ease-in-out;
   	-ms-transition: opacity 0.2s ease-in-out;
   	transition: opacity 0.2s ease-in-out;
}
.map-marker#marker-sanfrancisco {
	top: 266px;
	left: 213px;
}
.map-marker#marker-sanmateo {
	top: 411px;
	left: 258px;
}
.map-marker#marker-contracosta {
	top: 184px;
	left: 401px;
}
.map-marker#marker-alameda {
	top: 311px;
	left: 378px;
}
.map-marker.hidden-marker {
	opacity: 0;
	visibility: hidden;
}

/* panel-specific styles */
article#post-22 {
	background-color: transparent;
}


/* video */
.full-vidwrap{
	position: fixed;
	width:100%;
	top:0;
	bottom:0;
	z-index: 0;
	background-color: #333333;
	-webkit-backface-visibility:hidden;
}
video.fillWidth {
	position:absolute;
	bottom: 0px;
	right: 0px;
	margin-bottom: 0;
	min-width: 100%;
	min-height: 100%;
	max-height: 4000%;
	max-width: 1000%;
	width: auto;
	height: auto;
	overflow: hidden;
    -webkit-transition: opacity 300ms ease-out;
    -moz-transition: opacity 300ms ease-out;
    -o-transition: opacity 300ms ease-out;
    transition: opacity 300ms ease-out;
    opacity: 0;
}

video.vid-active {
	opacity: .25;
}


/*
 * jQuery FlexSlider v2.2.0
 * http://www.woothemes.com/flexslider/
 *
 * Copyright 2012 WooThemes
 * Free to use under the GPLv2 license.
 * http://www.gnu.org/licenses/gpl-2.0.html
 *
 * Contributing author: Tyler Smith (@mbmufffin)
 */


/* Browser Resets
*********************************/
.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus  {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;}

/* Icon Fonts
*********************************/
/* Font-face Icons */
@font-face {
	font-family: 'flexslider-icon';
	src:url('fonts/flexslider-icon.eot');
	src:url('fonts/flexslider-icon.eot?#iefix') format('embedded-opentype'),
		url('fonts/flexslider-icon.woff') format('woff'),
		url('fonts/flexslider-icon.ttf') format('truetype'),
		url('fonts/flexslider-icon.svg#flexslider-icon') format('svg');
	font-weight: normal;
	font-style: normal;
}

/* FlexSlider Necessary Styles
*********************************/
.flexslider {margin: 0; padding: 0;}
.flexslider .slides > article {display: none; -webkit-backface-visibility: hidden; overflow: hidden; } /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {width: 100%; display: block;}
.flex-pauseplay span {text-transform: capitalize;}

/* Clearfix for the .slides element */
.slides:after {content: "\0020"; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
html[xmlns] .slides {display: block;}
* html .slides {height: 1%;}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {display: block;}

/* FlexSlider Default Theme
*********************************/
.flexslider { position: relative;  zoom: 1; }
.flex-viewport { height:100%;max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; }
.loading .flex-viewport { max-height: 300px; }
.flexslider .slides { zoom: 1; }
.carousel li { margin-right: 5px; }

/* Direction Nav */
.flex-direction-nav {*height: 0;}
.flex-direction-nav a { background-image: url(images/arw-left.png); background-repeat: no-repeat; background-position: center; color: #fff; background-color: #da291c; text-transform: uppercase; font-size: 21px; font-family: veneer, Helvetica, sans-serif; text-indent: -9999px; text-decoration:none; display: block; width: 40px; height: 40px; margin: -20px 0 0; position: absolute; top: 48%; z-index: 10; overflow: hidden; opacity: 1; cursor: pointer; color: rgba(0,0,0,0.8); text-shadow: 1px 1px 0 rgba(255,255,255,0.3); -webkit-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.3); -moz-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.3); -o-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.3); box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.3);  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease; }
.flex-direction-nav .flex-prev { left: 25px; }
.flex-direction-nav .flex-next { background-image: url(images/arw-right.png); right: 25px; }
.flex-direction-nav a.flex-next-home { width: 93px; background-position: 86% center; padding: 8px 12px 0px; text-indent: 0; }
.flexslider:hover .flex-prev { opacity: 1; left: 25px; }
.flexslider:hover .flex-next { opacity: 1; right: 25px; }
.flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover { opacity: 1; }
.flex-direction-nav .flex-disabled { opacity: 0!important; filter:alpha(opacity=0); cursor: default; }
/*.flex-direction-nav a:before  { font-family: "flexslider-icon"; font-size: 40px; display: inline-block; content: '\f001'; }
.flex-direction-nav a.flex-next:before  { content: '\f002'; }
*/
/* Pause/Play */
.flex-pauseplay a { display: block; width: 20px; height: 20px; position: absolute; bottom: 5px; left: 10px; opacity: 0.8; z-index: 10; overflow: hidden; cursor: pointer; color: #000; }
.flex-pauseplay a:before  { font-family: "flexslider-icon"; font-size: 20px; display: inline-block; content: '\f004'; }
.flex-pauseplay a:hover  { opacity: 1; }
.flex-pauseplay a.flex-play:before { content: '\f003'; }

/* Control Nav */
.flex-control-nav {width: 100%; position: absolute; bottom: -40px; text-align: center;}
.flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-paging li a {width: 11px; height: 11px; display: block; background: #666; background: rgba(0,0,0,0.5); cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; -webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); -moz-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); -o-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); box-shadow: inset 0 0 3px rgba(0,0,0,0.3); }
.flex-control-paging li a:hover { background: #333; background: rgba(0,0,0,0.7); }
.flex-control-paging li a.flex-active { background: #000; background: rgba(0,0,0,0.9); cursor: default; }

.flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;}
.flex-control-thumbs li {width: 25%; float: left; margin: 0;}
.flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer;}
.flex-control-thumbs img:hover {opacity: 1;}
.flex-control-thumbs .flex-active {opacity: 1; cursor: default;}

@media screen and (max-width: 860px) {
  .flex-direction-nav .flex-prev { opacity: 1; left: 10px;}
  .flex-direction-nav .flex-next { opacity: 1; right: 10px;}
}





/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
	.map-wrap {
		right: 75px;
		margin-top: -310px;
	}
	 #tab-sec-3 img {
		bottom: 0px;
	 }
}


@media only screen 
and (max-height : 965px) {
	.board-text {
		top: 410px;
		margin-top: 0;
	}
	.grid-overlay {
		top: 79px;
		margin-top: 0;
	}
}

@media only screen 
and (max-height : 800px) {
	.numbers-vcenter {
		top: 90px;
		margin-top: 0px;
	}
	.map-wrap {
		top: 70px;
		margin-top: 0px;
	}
}

@media only screen 
and (max-height : 650px) {
	.map-intro {
		position: absolute;
		top: 150px;
	}
}




/* Retina-specific styles. */
@media print,
	(-o-min-device-pixel-ratio: 5/4),
	(-webkit-min-device-pixel-ratio: 1.25),
	(min-resolution: 120dpi) {

	 .menu-tabs {
	 	background-image: url(images/bg_tab-menu@2x.png);
	 	background-size: 852px auto;
	 }
	.pdf-attach a {
		background-image: url(images/pdf-icon@2x.png);
		background-size: 31px auto;
	}
	.btn-close {
		background-image: url(images/closex@2x.png);
		background-size: 11px auto;
	}
	#board1 {
		background-image: url(images/board1@2x.jpg);
	}
	#board2 {
		background-image: url(images/board2@2x.jpg);
	}
	#board3 {
		background-image: url(images/board3@2x.jpg);
	}
	#board4 {
		background-image: url(images/board4@2x.jpg);
	}
	#board5 {
		background-image: url(images/board5@2x.jpg);
	}
	#board6 {
		background-image: url(images/board6@2x.jpg);
	}
	#board7 {
		background-image: url(images/board7@2x.jpg);
	}
	#board8 {
		background-image: url(images/board8@2x.jpg);
	}
	#board9 {
		background-image: url(images/board9@2x.jpg);
	}
	#board10 {
		background-image: url(images/board10@2x.jpg);
	}
	#board11 {
		background-image: url(images/board11@2x.jpg);
	}
	#board12 {
		background-image: url(images/board12@2x.jpg);
	}
	#board13 {
		background-image: url(images/board13@2x.jpg);
	}
	.flex-direction-nav a {
		background-image: url(images/arw-left@2x.png);
		background-size: 15px auto;
	}
	.flex-direction-nav .flex-next {
		background-image: url(images/arw-right@2x.png);
	}

}