/*
* HTML5 Boilerplate
*
* What follows is the result of much research on cross-browser styling.
* Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
* Kroc Camen, and the H5BP dev community and team.
*/
.g-recaptcha { margin-top: 0.67em; display: none; }
/* ==========================================================================
Base styles: opinionated defaults
========================================================================== */
html,
button,
input,
select,
textarea {
color: #004567;
font-family: 'Gotham', 'Helvetica Neue', Helvetica, Arial, 'sans-serif';
}
a:link, a:visited, a:active { color: #f37535; text-decoration: none; }
a:hover { text-decoration: underline; }
a.credit-trigger { cursor: pointer; }
body {
font-size: 1em;
line-height: 1.3em;
}
/*
* Remove text-shadow in selection highlight: h5bp.com/i
* These selection rule sets have to be separate.
* Customize the background color to match your design.
*/
::-moz-selection {
background: #b3d4fc;
text-shadow: none;
}
::selection {
background: #b3d4fc;
text-shadow: none;
}
/*
* A better looking default horizontal rule
*/
hr {
display: block;
height: 1px;
border: 0;
border-top: 1px solid #ccc;
margin: 1em 0;
padding: 0;
}
/*
* Remove the gap between images and the bottom of their containers: h5bp.com/i/440
*/
img {
vertical-align: middle;
/* width: 100%; max-width: 968px; height: auto; */
}
nav img { max-width: 54px; }
/*
* Remove default fieldset styles.
*/
fieldset {
border: 0;
margin: 0;
padding: 0;
}
/*
* Allow only vertical resizing of textareas.
*/
textarea {
resize: vertical;
}
input:focus, button:focus {
outline:none;
}
footer ::-webkit-input-placeholder { /* WebKit browsers */
color: #FFF;
}
footer :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #FFF;
}
footer ::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #FFF;
}
footer :-ms-input-placeholder { /* Internet Explorer 10+ */
color: #FFF;
}
.clearfix:after {content:"\0020";display:block;height:0;visibility:hidden}
.clearfix:after, .row:after { clear:both; }
.clearfix { zoom:1; }
b, strong { font-weight: 600; }
/* ==========================================================================
Chrome Frame prompt
========================================================================== */
.chromeframe {
margin: 0.2em 0;
background: #ccc;
color: #000;
padding: 0.2em 0;
}
/* ==========================================================================
Author's custom styles
========================================================================== */
html { background-color: #FFF; } /* was 00a6cd */
h1 { letter-spacing: -0.03em; color: #f37535; margin: 0.5em 0 0.2em; text-transform: uppercase; font: 2.8em 'Tungsten A', 'Tungsten B', sans-serif; font-weight: 400; text-align: center; line-height: 0.88em;}
h2 { font: 1.9em 'Tungsten A', 'Tungsten B', sans-serif; font-weight: 400; color:#004a89; margin: 0.8em 0 0.6em; }
h2.small { font: 1.3em 'Tungsten A', 'Tungsten B', sans-serif; font-weight: 400; color:#004a89; }
h3 { font: 1.5em 'Tungsten A', 'Tungsten B', sans-serif; font-weight: 400; color:#004a89; }
.rounded-corners {
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px;
}
.lt-ie9.rounded-corners {
behavior: url(/assets/css/border-radius.htc);
border-radius: 5px;
}
#skip { display: block; height: 0; }
#wrapper { width: 100%; background-color: #FFF; }
header { background-color: #ebebeb;
margin-bottom: 5px;
height: auto; }
header #logo img { padding: 30px 0 20px; float: left; width:100%; max-width: 300px; height: auto; }
.header-container { width: 90%; max-width: 968px; margin: 0 auto;}
nav { clear: both; float: none; font-family: 'Tungsten A', 'Tungsten B', 'Teko', sans-serif; font-weight: 500; font-size: 1.8em; width: 100%; line-height:1em; height: 40px; max-height: 40px; }
nav.stickyHeader { margin: 0; position: fixed; top: 0; z-index: 100; clear: both; }
div.nav-padding { float: left; width: 100%; }
ul#menu { margin: 0 auto; padding: 0 1px; width: 100%; max-width: 978px; min-width: 600px; text-align: center; background: #FFF; }
ul#menu li { cursor: pointer; display: inline-block; list-style: none; margin: 0 1px; *display: inline; zoom: 1; vertical-align: top; }
ul#menu li:first-child { border-left: none; }
ul#menu li a { width: 100%; color: #FFF; text-decoration: none; background: #004567; display: block; padding: 6px 0px; border-radius: 5px;}
ul#menu li a.active { background-color: #f37535; }
ul#menu li a:hover, ul#menu li:hover a { color: #fff; background: #00a6cd; }
ul#menu li a:hover, ul#menu li:hover a { color: #fff; background: #00a6cd; }
ul#menu li.parents { width: 22%; -webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease; }
ul#menu li.resource { width: 27%; -webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease; }
ul#menu li.connect { width: 24.5%; -webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease; }
ul#menu li.partners { width: 24%; -webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease; }
ul#menu li.resource img { vertical-align: middle; }
div.subnav { width: 100%; display: none; position: absolute; z-index: 99; left: 0; background: #00a6cd; padding: 0.5em 0 0.2em; }
ul.submenu { margin: 0 auto; width: 100%; max-width: 968px; padding-left: 0; }
ul#menu li:hover .subnav { display: block; }
ul#menu li.parents:hover>a { padding-bottom: 10px; }
ul.submenu li.get-help { width: 15%; }
ul.submenu li.get-help img { display: block; margin: 0 auto;}
ul.submenu li.upcoming { width: 22%; }
ul.submenu li.get-info { width: 20%; }
ul.submenu li.upcoming div {background:url(/assets/images/submenu-calendar.png) no-repeat center 0.18em; padding: 0.6em 0 0 0; height: auto;}
ul.submenu li.help-by-age {width: 40%; text-align: center; }
ul.submenu li { padding: 0.2em 1%; vertical-align: top; color: #FFF; font: 0.7em 'Tungsten A', 'Tungsten B', sans-serif; font-weight: 400; background: none; }
ul#menu li ul.submenu li a { padding: 0; color: #FFF; }
ul#menu li ul.submenu li a:hover { padding: 0; color: #ffd13a; }
ul.submenu li div.subnavCategories { background: #FFF; padding: 0.1em 0.6em; display: inline-block; *display: inline; zoom: 1; background: rgba(255,255,255,0.8);margin: 0.2em 0.3em 0; height: 1.4em; }
ul#menu li ul.submenu li div.subnavCategories a { color: #004d81; background: none; }
ul#menu li ul.submenu li div.subnavCategories a:hover { color: #FFF;}
ul.submenu.partners li a { font-size: 1.0em; text-transform: uppercase; }
/* new menu */
ul#menu li { position: relative; }
ul#menu li.events { width: 20%; }
ul#menu li.parents { width: 18%; }
ul#menu li.resource { width: 24%; }
ul#menu li.connect { width: 16.5%; }
ul#menu li.partners { width: 18.5%; }
div.subnav { width: auto; white-space: nowrap; padding: 0;}
ul#menu li ul.submenu a { background: transparent; }
ul#menu li ul.submenu li { display: block; padding: 0.4em 0.9em; text-align: left; position: relative; border-top: 1px solid #FFF; font-family: 'Ideal Sans A', 'Ideal Sans B', sans-serif; }
ul#menu li ul.submenu>li:hover { background: #49ceed; }
ul#menu li ul.submenu>li:hover>a { color: #FFF; }
ul#menu li ul.submenu li ul { display: none; position: absolute; left:99%; top: -0.83em; padding: 0em; background: #ffd13a; }
ul#menu li ul.submenu li:hover>ul { display: block; z-index: 999; }
ul#menu li ul.submenu li ul li { background: #ffd13a; font-size: 0.98em; padding: 0.4em 0.9em; }
ul#menu li ul.submenu li ul li:hover { background: #ffe88c;}
ul#menu li ul.submenu li ul li a { color: #004567; }
ul#menu li ul.submenu li ul li:hover>a { color: #004567; }
/* end new menu */
#utility { float: right; }
ul#utility-nav { margin: 1em 0 0; padding: 0; list-style: none; }
ul#utility-nav li { display: inline-block; *display: inline; zoom: 1; }
ul#utility-nav li a { font-family: 'Tungsten A', 'Tungsten B', 'Teko', sans-serif; font-size: 1.5em; color: #004567; font-weight: 500; margin-left: 1em; }
ul#utility-nav li.donate a { color: #ffd13a; }
#lang-switch { float: right; clear: right; margin: 4% 0 0 0; }
ul#subnav { margin: 1em auto 1em; padding: 0; width: 100%; text-align: center; max-width: 968px; }
ul#subnav li { display: inline-block; list-style: none; margin: 0; padding: 0 0.3em; *display: inline; zoom: 1; }
ul#subnav li a { width: auto; font-family: 'Tungsten A', 'Tungsten B', sans-serif; font-size: 1.5em; color: #00a6cd; text-transform: uppercase; font-weight: 500; }
ul#subnav li a:hover { color: #004567; }
ul#subnav li a.active { color: #004567; }
ul#subnav.parents li { background: #bad430; padding: 2.3em 3em 0.9em; margin: 2em 0.4em 0; }
ul#subnav.parents a { color: #FFF; font-size: 4em; line-height: 0.1em; }
ul#subnav.parents a span.category-description { font: 0.25em 'Ideal Sans A', 'Ideal Sans B', sans-serif; font-weight: 300; }
ul#subnav.parents a:hover { text-decoration: none; }
#footer-tools { height: 33px; width: 100%; background:#ebebeb; }
.footer-tools-container{ width: 90%; max-width: 968px; margin: 0 auto; height: 63px; }
footer #search { width: 64%; float: left; margin-top: -25px;
-webkit-transition: width 0.3s;
-moz-transition: width 0.3s;
transition: width 0.3s;
-webkit-backface-visibility: hidden;
}
footer ul { list-style: none; margin: 0; padding: 0; }
footer ul.search-form { position: relative; float: left; width: 100%; }
footer ul.search-form label { display:block; width:48px; height:48px; font-size:0; position:absolute; padding:0; top:0; left:0; cursor:pointer; }
footer ul.search-form input.search-field {
width:48px;
height:48px;
padding:0;
padding-left:48px; /* account for 4px border to get perfect circle */
border:none;
background: #f37535;
font-weight:300;
font-size:18px;
color:#FFF;
-webkit-border-radius:24px;
-moz-border-radius:24px;
border-radius:24px;
-webkit-transition:width 0.5s ease-in-out;
-moz-transition:width 0.5s ease-in-out;
transition:width 0.5s ease-in-out;
}
footer ul.search-form input.search-field:focus,
footer ul.search-form input.search-field:active {
width:90%; border: none;
}
.footer-social-container { width: 32%; float: right; text-align: right; margin-top: -30px; }
div.social-icon { float: left; display: block; width: 27%; text-align: center; padding-top: 2%; }
div.social-icon.facebook { text-align: left; width: 23%; }
div.social-icon.flickr { text-align: right; width: 21%; }
div.social-icon-spacer { width: 10%; float: left; display: block; margin: 0; }
div.social-icon img { width: 48px; height: auto; }
.footer-container { background: #004567; width: 100%; }
.footer-content { width: 90%; max-width: 968px; margin: 0 auto; padding: 23px 0; color: #FFF; font-size: 12px; }
.footer-content h3 { margin: 3px 0 4px; color: #FFF; font-size: 2em; font-family: 'Tungsten A', 'Tungsten B', sans-serif; }
.footer-content a { color: #FFF; }
footer .contact-us { float: left; width: 14%; margin-right: 1%; -ms-word-break: break-all;
word-break: break-all;
/* Non standard for webkit */
word-break: break-word;
-webkit-hyphens: auto;
-moz-hyphens: auto;
hyphens: auto;}
footer .get-help { float: left; width: 13.75%; margin-right:0.75%; }
footer .about-rcsn { float: left; width: 11%; margin-right: 1%; min-width: 95px; }
footer .parent-centers { float: left; width: 14%; }
footer .website {float: left; }
footer .newsletter {float: right; width: 31.5%; -webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease; }
footer .newsletter form { width: 100%; margin:8px 0 0; padding: 0; }
footer .newsletter form input { width: 33%; padding: 2%; background: #f37535; color: #004567; border: none;border-right: 1px solid #004567; }
footer .newsletter input[type=submit] {float: right; background: #FFF; border: none; padding: 8px; color: #004567; margin: 18px 1% 0 8px; }
footer .newsletter h2 { color: #FFF; margin: 0 0 0.2em; font-family: 'Tungsten A', 'Tungsten B', sans-serif; font-size: 1.8em; font-weight: 500; }
footer .newsletter #email { border-right: none; }
footer .footer-copyright-container { width: 100%; background: #ebebeb; }
footer .copyright { width: 90%; max-width: 968px; padding: 7px 0; color: #004567; margin: 0 auto; font-size: 0.7em; font-weight: 300;}
.contact-form label { display: none; }
footer .newsletter label span, .search-form label span { position: absolute; font-size: 0; text-indent: -99999px; }
#content { width: 100%; margin: 0 auto; padding-bottom: 1em; }
.home-hero { margin: 33px 0; }
.donate-hero { margin: 33px 0 2em; }
.home-hero>img, .donate-hero>img { width: 100%; }
.flexslider { background: url(/assets/images/green-bg.jpg) no-repeat #acc62f; background-size: contain; }
.content-left { width: 32%; float: left; text-align: left; }
.content-middle { width: 32%; margin: 0 2%; float: left; text-align: left; }
.content-right { width: 32%; float: left; text-align: left; }
.content-left-and-middle { width: 66%; margin-right: 2%; float: left; text-align: left; }
.content-half-width-left { float: left; margin-right: 4%; width: 48%; text-align: left; -webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease; }
.content-half-width-right { float: left; width: 48%; text-align: left;
-webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease; }
.home .content-left img, .home .content-middle img { width: 100%; }
.content-right>iframe { max-width: 100%; border-bottom: 1px solid #aaa;}
.content-half-left { width: 50%; margin-right: 2%; float: left; }
.content-half-right { width: 48%; float: left; }
.content-quarter-left { width: 30%; margin-right: 2%; float: left; }
.content-quarter-right { width: 15%; float: left; }
.fullwidth { padding: 1em 0 2em; text-align: center; }
.content-full-width { width: 90%; margin: 0 auto; max-width: 968px;
-webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease; }
.content-almost-full-width { min-height: 300px; width: 70%; margin: 0 auto 2em; max-width: 668px; -webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease; }
.content-almost-full-width img { max-width: 100%; height: auto; }
/* STAFF */
.staff { margin: 1.8em auto 2.8em; width: 100%; clear:both; }
.staff-photo { float: left; width: 32%;}
.staff-photo>img { width: 100%; }
.staff-info { float: left; width: 65%; margin-left: 3%; }
.staff-info h2 { margin: 0; text-transform: uppercase; font-family: 'Tungsten A', 'Tungsten B', sans-serif; font-size: 1.4em; line-height: 0.8em; font-weight: 500; color: #004567; }
.staff-info h3 { margin: 0.7em 0 0.8em; text-transform: uppercase; font-family: 'Ideal Sans A', 'Ideal Sans B', sans-serif; font-size: 0.7em; font-weight: 400; }
.staff-info p, .staff-info a { font: 0.9em/1.2em 'Ideal Sans A', 'Ideal Sans B', sans-serif; }
.resource-line-full { width: 50%; margin: 0 auto; }
.resource-line-full img { width: 100%; height: auto; }
.resource-line-left {width: 32%; margin-left: 2%; float: left; text-align: right;}
.resource-line-left>img {width: 100%; max-width: 200px; min-width: 120px;}
.resource-line-middle {width: 28%; margin: 0 2%; float: left; text-align: center; }
.resource-line-middle>img { width: 99%; max-width: 170px; margin: 0 auto; }
.resource-line-right {width: 32%; margin-right: 2%; float: left; text-align: left; }
.resource-line-right>img {width: 100%; max-width: 200px; min-width: 120px; }
.resource-line-copy { margin: 1em auto 5em; text-align: center; }
.resource-line-ul { text-align: left; }
/* workshops */
.programs-icon { margin-left: 40%; height: 53px; width: 50px; }
.workshop { float: left; width: 23.5%; margin: 0 2% 3% 0; text-align: left; -webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease; }
.workshop:nth-child(4n+4) { float: left; margin-right: 0%;}
.workshop:nth-child(4n+5) { clear: left; }
.workshop-title { min-height:125px; font: 1.35em 'Tungsten A', 'Tungsten B', sans-serif; font-weight: 400; text-transform: uppercase; color: #FFF;
-webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease; }
.workshop-title.parenting, .workshop-title.criando-a-los-ninos { background: #fcb857; padding: 0.6em;}
.workshop-title.advocacy { background: #f37535; padding: 0.6em;}
.workshop-title.education, .workshop-title.educacion { background: #004567; padding: 0.6em;}
.workshop-title.transition { background: #e1e100; padding: 0.6em;}
.workshop-title.services-and-systems, .workshop-title.servicios-y-sistemas { background: #00a6cd; padding: 0.6em;}
.workshop-title.parenting a, .workshop-title.advocacy a, .workshop-title.education a, .workshop-title.transition a, .workshop-title.services-and-systems a,
.workshop-title.criando-a-los-ninos a, .workshop-title.servicios-y-sistemas a, .workshop-title.educacion a { color: #FFF; }
.workshop>h3 { color: #ccc; }
.workshop>h3 { margin: 0; text-transform: uppercase; }
.workshop>h3 span.advocacy { color: #f37535; }
.workshop>h3 span.education, .workshop>h3 span.educacion { color: #004567; }
.workshop>h3 span.parenting, .workshop>h3 span.criando-a-los-ninos { color: #fcb857; }
.workshop>h3 span.transition { color: #e1e100; }
.workshop>h3 span.services-and-systems, .workshop>h3 span.servicios-y-sistemas { color: #00a6cd; }
.workshop-event {margin: 0.3em 0; line-height: 1.1em; }
.workshop-detail a { font-size: 0.9em; }
.workshop-event>a { color: #000; font-size: 1em; line-height: 1.0em; }
.workshop-event-burrough { font: 1.4em/0.8em 'Tungsten A', 'Tungsten B', sans-serif; font-weight: 400; float: right; padding: 0.4em 0.25em 0.3em 0.3em; text-transform: capitalize; color: #FFF; margin-top: 4px; letter-spacing: 0.05em; }
.workshop-event-burrough.bk { background: #b4b4b4; }
.workshop-event-burrough.m { background: #c2c2c2; }
.workshop-event-burrough.bx { background: #cfcfcf; }
.workshop-event-burrough.q { background: #adadad; }
.workshop-event-burrough.si { background: #cfcfcf; text-transform: uppercase; }
.upcoming-events { margin: 0 auto 1.8em; clear: both; background: url(/assets/images/icon-cal.png) no-repeat #f37535 0.8em 0.3em; padding: 0.4em 0.4em 0.4em 2.6em;}
a.upcoming-events { color: #fff; }
.workshop-event-presenter-photo { margin: 0.2em 0 0.3em; max-width: 86px; }
.workshop-event-presenter-name { font-size: 0.9em; }
.workshop-detail { margin-bottom: 2em; }
.workshop-detail>h2 { font-size: 1.5em; text-transform: uppercase; color: #00a6cd; margin: 0; }
.workshop-detail-category, .video-detail-category { float: left; margin-right: 4%; margin-top: 0.5em;}
.workshop-detail .fluid-width-video-wrapper iframe { padding: 0 1em 0 0; margin-top: 1em; }
.workshop-detail .category-title, .video-detail-category .category-title { font-size: 1em; color: #00a7cd; font-weight: 400; font-family: 'Gotham', 'Helvetica Neue', Helvetica, Arial, 'sans-serif'}
.workshop-detail .tip-sheets { clear: left; }
.workshop-detail-register { background: #f37535; clear: left; margin: 1em 0; padding: 0.3em 0.6em 0.1em; white-space: nowrap; width: auto; min-width: 140px; text-align: center; display: inline-block;}
.workshop-detail-register a { color: #FFF; font: 1.6em/0.8em 'Tungsten A', 'Tungsten B', sans-serif; font-weight: 400; }
.workshop img, img.workshop-detail-presenter-photo { width: 100%; height: auto; margin-bottom: 0.7em; }
a.video-title { font-weight: 600; font-size: 0.9em; text-decoration: none; line-height: 1.3em; }
.video-length { color: #696969; font-size: 0.8em; }
.content-quarter-right.workshop-detail img { width: 100%; height: auto; }
/* new resources */
.upcoming-events { margin: 2em auto 1.8em; }
button.filter-button { border: none; background: transparent; text-transform: uppercase; font: 1.367em/0.8em 'Tungsten A', 'Tungsten B', sans-serif; padding: 0!important; margin: 0.27em 0.8em 0 0!important;line-height: 1.3em;}
button.filter-button.is-checked { text-decoration: underline; }
#resources { margin-top: 2em; }
.resource-category-description { text-align: center; margin: 1em auto 2em; }
div#resources-listing.content-full-width { width: 100% }
#resources-listing .resource { padding: 0.4em; float: left; width: 23%; margin: 0 1% 3% 1%; text-align: left; min-height: 76px;
/*-webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease; */ }
/* #resources-listing .resource:nth-child(4n+4) { float: left; margin-right: 1%;} */
#resources-listing .resource:nth-child(4n+5) { clear: left; }
#resources-listing .resource>.resource-icon { display: inline-block; vertical-align: middle; width: 30%; padding: 0.6em;}
#resources-listing .resource>.resource-icon img { width: 100%; height: auto; margin-bottom: 0; }
#resources-listing .resource>.resource-title { font-size: 0.9em; float: none; margin: 0;
line-height: 1.2em;width: 70%; display: inline-block; font-weight: 400; color: #FFF; vertical-align: middle;
/* -webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease; */ }
#resources-listing .resource a { color: #FFF; }
#resources-listing .resource.video { background: #098d44; }
#resources-listing .resource.on-site-help { background: #00a6cd; }
#resources-listing .resource.webinar,
#resources-listing .resource.includenyc-live { background: #c03a27; }
#resources-listing .resource.workshop { background: #894b9d; }
#resources-listing .resource.tip-sheet { background: #ed6823; }
#resources-listing .resource.contact-sheet { background: #004567; }
#resources-listing .resource.presentation { background: #52524f; }
#resources-listing .resource.special-event { background: #f1584d; }
#resources-listing .resource.useful-links { background: #00a6cd; }
#resources-listing .filters-button-group { width: 98%; margin: 0 1%; }
button.filter-button.all { color: #999; }
button.filter-button.special-event, .cal-cat-filter-special-event { color: #f1584d; cursor: pointer; }
button.filter-button.video, .cal-cat-filter-video { color: #098d44; cursor: pointer; }
button.filter-button.on-site-help, .cal-cat-filter-on-site-help { color: #00a6cd; cursor: pointer; }
button.filter-button.useful-links, .cal-cat-filter-useful-links { color: #00a6cd; cursor: pointer; }
button.filter-button.webinar, .cal-cat-filter-webinar,
button.filter-button.includenyc-live, .cal-cat-filter-includenyc-live { color: #c03a27; cursor: pointer; }
button.filter-button.workshop, .cal-cat-filter-workshop { color: #894b9d; width: auto; float: none; cursor: pointer; }
button.filter-button.tip-sheet { color: #ed6823; }
button.filter-button.contact-sheet { color: #004567; }
button.filter-button.presentation { color: #52524f; }
button.filter-button.useful-links { color: #00a6cd; }
a.calendarEventEntry.cat-workshop { border-left: 5px solid #894b9d; padding-left: 8px; margin-left: -8px; }
a.calendarEventEntry.cat-special-event { border-left: 5px solid #e56161; padding-left: 8px; margin-left: -8px; }
a.calendarEventEntry.cat-on-site-help { border-left: 5px solid #00a6cd; padding-left: 8px; margin-left: -8px; }
a.calendarEventEntry.cat-webinar,
a.calendarEventEntry.cat-includenyc-live { border-left: 5px solid #c03a27; padding-left: 8px; margin-left: -8px; }
a.calendarEventEntry.cat-useful-links { border-left: 5px solid #00a6cd; padding-left: 8px; margin-left: -8px; }
#content.tipsheet-content .content-full-width img { height: auto!important; width: 100%!important; }
p.tip-sheets { text-align: left; line-height: 1.2em; margin: 0 0 0.6em 0.0em; text-indent: -0.0em; font-size: 0.9em;}
p.tip-sheets a:link, p.tip-sheets a:visited { color: #004567; }
h3.tip-sheets {margin: 0em 2em 1em 0em;color: #f37535; text-align: center; }
.content-full-width.tip-sheets {
-moz-column-count: 3;
-moz-column-gap: 20px;
-webkit-column-count: 3;
-webkit-column-gap: 20px;
column-count:3;
}
.tip-sheets-columns {
-webkit-column-break-inside:avoid;
-moz-column-break-inside:avoid;
-o-column-break-inside:avoid;
-ms-column-break-inside:avoid;
column-break-inside:avoid;
margin-bottom: 2em;
}
/* new resources */
#resources {
-moz-column-count: 3;
-moz-column-gap: 20px;
-webkit-column-count: 3;
-webkit-column-gap: 20px;
column-count:3;
}
#resources ul.resources_columns>li {
-webkit-column-break-inside: avoid;
-moz-column-break-inside: avoid;
-o-column-break-inside: avoid;
-ms-column-break-inside: avoid;
column-break-inside: avoid;
margin-bottom: 2em;
vertical-align: top;
display: inline-block;
}
#resources ul.resources_columns { list-style: none; margin:0; }
#resources ul.resources_columns>li>a { font: 1.5em 'Tungsten A', 'Tungsten B', sans-serif;
font-weight: 400; text-transform: uppercase; }
#resources ul.resources_columns>li ul { list-style: none; margin: 0; padding: 0.4em 0 0;}
#resources ul.resources_columns>li ul li a { color: #666; font-size:14px;}
/* end new resources */
.submit { margin: 0; padding: 0.2em 0.8em; background:#fff; color: #fff; border: none; font-size: 1.9em; font-family: 'Tungsten A', 'Tungsten B', sans-serif; font-weight: 400; }
div.contact-form { margin-top: 1.5em; }
.contact-form-textfield { float: left; width: 23%; margin: 2% 1% 2%; border: 2px solid #ccedf7; padding: 0.3em 0.5em; }
.contact-form-textarea { height: 4.5em; width: 72.75%; border: 2px solid #ccedf7; padding; 1%; float: left; margin: 2% 1.25%; }
.contact-form-submit { font-size: 0.7em; line-height: 1.3em; text-align: left; float: left; width: 22%; margin: 2% 0 0 1.5%; }
input.contact-form-signup { clear: both; width: 1.4em; margin-bottom: 2em; float: left;}
.contact-form select { background: transparent; -webkit-appearance: none; }
.contact-form select.contact-form-select { width: 22%; margin: 2% 0 2% 1.35%; float: left; background: url(/assets/images/contact-select-arrow.png) no-repeat right #FFF; border: 2px solid #ccedf7; padding: 0.3em 1%; overflow: hidden; }
.contact-form select.topic { width: 97%;margin: 5% 26% 2% 1.0%; } /*width: 73%; */
.contact-form-signup-box { margin-top: 0.9em; }
.contact-form-textfield.suggested-dates { width: 48%; }
/* donate */
ul.donate-now { list-style: none; margin: 0; padding: 0; }
ul.donate-now li { display: inline-block; *display: inline; zoom: 1; margin: 0.2em 1em 0 0; }
ul.donate-now li input.donate-now-form-radio { float: left; margin: 0.35em 0.8em 0 0; }
ul.donate-now li.other input.donate-now-form-radio { margin-top: 0.55em; } /* the last radio button (with "other" amount text field) needs different alignment */
ul.donate-now li h2 { float: left; margin: 0 }
input.donate-now-form-input { border: 2px solid #ccedf7; padding: 0.3em 0.5em; width: 7em; float:left; }
.donate-now-submit { margin: 1.8em auto; text-align: center; }
.donate-now-form-in-honor-of { margin: 0.45em 1em 0 -14em; display: inline-block; *display: inline; zoom: 1; }
iframe.clickandpledge { border: 0; }
/* connect page */
.blog-header-title {float: left; width: 24%; text-align: center; text-transform: none; }
.blog-header-images {float: left; width: 38%; margin-top: 1.4em;}
.blog-header-images.right, .blog-header-images.left { text-align: center; }
.blog-featured-image-holder { width: 30.125%; margin-right: 2.875%; float:left; }
.blog-featured-image { width: 100%; height: auto; margin:0em 0 0.3em; }
.blog-excerpt, .blog-listing-excerpt { margin-left: 0%; width: 96%; }
.blog-excerpt-with-thumb { margin-left: 33%; width: 66%; }
.blog-listing-excerpt-with-thumb { margin-left: 25%; width: 75%; }
h2.blog-excerpt-title { margin: 0; padding: 0; line-height: 1.1em; }
.blog-byline { font-size: 0.7em; color: #666; text-transform: uppercase; line-height: 1.1em;white-space: nowrap; }
a.newsletter-archive-title { line-height: 1.0em; font-size: 0.9em; font-weight: 600; }
div.newsletter-current { float: left; width: 45%;padding-left: 10%; margin: 0 0% 0 0%; }
.content-newsletter-archive div.newsletter-current { padding-left: 150px; width: 100%; }
div.newsletter-previous { float: left; width: 20%; margin-left: 8%; position: relative; }
div.newsletter-photo { margin: -0.3em 0 0 -150px; width: 143px; clear:both; position: absolute; }
img.newsletter-photo { float: left; margin: 0.6em 1em 1em 0; width: 135px; padding: 4px; border: 4px solid #bad430; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; }
div.navigator-current { float: left; width: 23%; margin-right: 4%; }
div.navigator-current img { margin: 0.3em 0 1em 2em; }
.pagination a { cursor: pointer; }
.process_indicator {
background-image: url(/assets/images/ajax-loader.gif);
background-repeat: no-repeat;
background-position: bottom left;
height: 3em;
width: 100%;
text-align: left;
display: none;
}
img.connect-social-icon { text-align: center; margin: 0 auto 4%; width: 7%;}
.blog-featured-thumbnail-holder { width: 20%; margin-right: 3%; float:left;}
.blog-post-listing { margin: 1em 0 2em; clear: both; }
.blog-post-author-avatar { margin-bottom:12px; }
.blog-post-author { font-size: 0.9em; margin: 0 0 1em; }
.blog-post-wide-img { margin: 0 0 1em; width: 100%; height: auto; }
iframe.facebook { background: #FFF; }
.content-newsletter-archive {
float: left;
width: 66%;
margin: 0 4% 2em 0;
max-width: 668px;
-webkit-transition: all 200ms ease;
-moz-transition: all 200ms ease;
-ms-transition: all 200ms ease;
-o-transition: all 200ms ease;
transition: all 200ms ease;
}
.content-navigator-archive {
float:left;
width: 30%;
margin: 0;
}
/* new mandy styles */
.ReadMsgBody {width: 100%; background-color: #ffffff;}
.ExternalClass {width: 100%; background-color: #ffffff;}
h6 { font: 2.5em 'Tungsten A', 'Tungsten B', sans-serif; font-weight: 700; color:#004567; margin:0 auto; text-align:center; letter-spacing:1px; }
h5 { font: 2em 'Tungsten A', 'Tungsten B', sans-serif; font-weight: 600; color:#004567; margin:0 auto; line-height:1; text-align:center; letter-spacing:1px;}
h7 { font: 2em 'Tungsten A', 'Tungsten B', sans-serif; font-weight: 600; color:#004567; margin:0 auto; line-height:1; text-align:center; letter-spacing:1px;}
@media only screen and (max-width: 640px) {
img.deviceWidth { max-width: 90% }
body[yahoo] .deviceWidth {width:440px!important; padding:0;}
body[yahoo] .center {text-align: center!important;}
.chunk {width: 100% !important;}
td[class="pattern"] table { width: 100%; }
td[class="pattern"] .hero_image img {
width: 100%;
height: auto !important;
}
}
@media only screen and (max-width: 479px) {
body[yahoo] .deviceWidth {width:320px!important; padding:0;}
body[yahoo] .center {text-align: center!important;}
.chunk {width: 100% !important;}
td[class="pattern"] .spacer { display: none; }
td[class="pattern"] .col{
width: 100%;
display: block;
}
td[class="pattern"] .col:first-child { margin-bottom: 0px; }
td[class="pattern"] .hero_image img { width: 80%; }
}
.apple {
text-align:center;
float:left;
width:300px;
margin:10px;
}
.pear {
text-align:center;
float:right;
width:300px;
margin:10px;
}
.two-col-centered-max-900 {
align-content:center;width: 90%; max-width: 900px; margin: 0 auto; display: block;}
.two-col {
text-align:center;
float:left;
width:44%;
margin:3%;
}
@media screen and (max-width: 600px) {
.two-col {text-align:center;float:none;width:94%;}
}
/* end new mandy styles */
/* ==========================================================================
Helper classes
========================================================================== */
.alt { display: none;}
.mobile-only { display: none; }
.centered { text-align: center; }
.right { text-align: right; }
.left { text-align: left; }
.orange { color: #f37535; }
.bkgdLightBlue { background: #f0faff; }
.uppercase { text-transform: uppercase; }
.large { font-size: 1.3em; line-height: 1.4em;}
.medium { font-size: 1.1em; line-height: 1.4em; }
.small { font-size: 0.9em; line-height: 1.2em; }
.verySmall { font-size: 0.8em; line-height: 1.1em; }
.lightblue, a.lightblue { color: #00a6cd; }
.nowrap { white-space: nowrap; }
img.semi-transparent {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
filter: alpha(opacity=60);
-moz-opacity: 0.6;
-khtml-opacity: 0.6;
opacity: 0.6;
}
h1.tight, h2.tight, h3.tight { margin: 0.2em 0; }
.smallSpacer { height: 1em!important; min-height: 1em; }
.mediumSpacer { height: 3em!important; min-height: 2.5em; }
.largeSpacer { height: 6em!important; min-height: 5em; }
/* fitVid */
.fluid-width-video-wrapper iframe { margin: 0 auto; padding: 1em; }
/*
* Image replacement
*/
.ir {
background-color: transparent;
border: 0;
overflow: hidden;
/* IE 6/7 fallback */
*text-indent: -9999px;
}
.ir:before {
content: "";
display: block;
width: 0;
height: 150%;
}
/*
* Hide from both screenreaders and browsers: h5bp.com/u
*/
.hidden {
display: none !important;
visibility: hidden;
}
/*
* Hide only visually, but have it available for screenreaders: h5bp.com/v
*/
.visuallyhidden {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
/*
* Extends the .visuallyhidden class to allow the element to be focusable
* when navigated to via the keyboard: h5bp.com/p
*/
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
clip: auto;
height: auto;
margin: 0;
overflow: visible;
position: static;
width: auto;
}
/*
* Hide visually and from screenreaders, but maintain layout
*/
.invisible {
visibility: hidden;
}
/*
* Clearfix: contain floats
*
* For modern browsers
* 1. The space content is one way to avoid an Opera bug when the
* `contenteditable` attribute is included anywhere else in the document.
* Otherwise it causes space to appear at the top and bottom of elements
* that receive the `clearfix` class.
* 2. The use of `table` rather than `block` is only necessary if using
* `:before` to contain the top-margins of child elements.
*/
.clearfix:before,
.clearfix:after {
content: " "; /* 1 */
display: table; /* 2 */
}
.clearfix:after {
clear: both;
}
/*
* For IE 6/7 only
* Include this rule to trigger hasLayout and contain floats.
*/
.clearfix {
*zoom: 1;
}
/* ==========================================================================
EXAMPLE Media Queries for Responsive Design.
These examples override the primary ('mobile first') styles.
Modify as content requires.
========================================================================== */
@media screen and (max-width: 1050px) {
.footer-content { font-size: 11px; }
}
@media screen and (max-width: 978px) {
}
@media screen and (max-width: 60em ) { /** 16px * 60 = 960px **/
#content.home .content-left {width: 40%; float: left; text-align: left; margin: 0 10% 0 0; }
#content.home .content-middle {width: 40%; float: left; text-align: left; margin: 0 0 0 10%; }
#content.home .content-right {width: 100%; clear:both; float: none; text-align: left; margin: 0; }
#content.home .content-right>iframe { width: 100%; margin: 4% 0 0; height: 265px; }
.workshop>h3 { font-size: 1.2em; line-height: 1.3em; }
.workshop-title { min-height: 107px; }
footer .newsletter { float: none; clear: both; width: 100%;margin-bottom: 2em; }
footer .newsletter form input { width: 24.5%; padding: 6px 1%;}
footer .newsletter form input[type=submit] { width: 22.5%; margin-top:0; padding: 6px; float: right; }
footer #submit-button-container {float: right; width: 20.5%; margin: 0 1%; }
footer .contact-us { width: 22.5%; }
footer .get-help { float: left; width: 16%; margin-right:1%; }
footer .about-rcsn { float: left; width: 18%; margin-right: 1%; min-width: 95px; }
footer .parent-centers { float: left; width: 23%; margin-right: 1%; }
footer .website {float: left; width: 16%; }
.footer-social-container { width: 36%; }
}
@media screen and (max-width: 800px) {
.blog-header-title { width: 30%; }
.blog-header-images { width: 35%; }
.blog-header-images.left .blog-header-image-first, .blog-header-images.right .blog-header-image-last { display: none; }
.blog-header-images.left, .blog-header-images.right { text-align: center; }
ul#menu li { margin: 0 0px; }
header #logo img { max-width: 250px; }
.resource-line-full { width: 80%; margin: 0 auto; }
}
@media screen and (max-width: 47.9em ) { /** 16px * 48 = 768px (but targeting < 768px) **/
.desktop-only { display: none; }
.mobile-only { display: inline; }
.largeSpacer { height: 4em!important; min-height: 3em;}
.mediumSpacer { height: 1.5em!important; min-height: 1.5em; }
/*.content-full-width { width: 100%; }*/
.fullwidth .content-full-width { width: 90%; }
.content-half-left { width: 90%; float: none; }
.content-quarter-left { width: 70%; }
.content-quarter-right { width: 28%; }
footer .newsletter { float: none; clear: both; width: 100%;margin-bottom: 2em; }
footer .newsletter form input { width: 24.5%; padding: 6px 1%;}
footer .newsletter form input[type=submit] { width: 22.5%; margin-top:0; padding: 6px; float: right; }
footer #submit-button-container {float: right; width: 20.5%; margin: 0 1%; }
footer .contact-us { width: 25%; }
footer .get-help { float: left; width: 16%; margin-right:1%; }
footer .about-rcsn { float: left; width: 18%; margin-right: 1%; min-width: 95px; }
footer .parent-centers { float: left; width: 17%; margin-right: 1%; }
footer .website {float: left; }
.footer-social-container { width: 36%; }
.contact-form-textfield, .contact-form-textarea, .contact-form-submit { width: 100%; margin: 1% 0; clear: left; float: none; }
input.contact-form-signup { clear: left; float: none; }
.submit { margin: 1em 0 0.6em; }
.contact-form-submit { text-align: center; }
.contact-form select.topic { width: 100%;margin: 5% 0% 2% 0%; }
.contact-form-textfield.suggested-dates { width: 100%; }
.donate-now-form-in-honor-of { margin: 0.45em 1em 0 0em; display: block; }
.blog-byline { white-space: normal; }
/*ul#menu li.parents { width: 22%; }
ul#menu li.resource { width: 32%; }
ul#menu li.connect { width: 22.5%; }
ul#menu li.partners { width: 21%; } */
ul.submenu li div.subnavCategories { padding: 0.2em; }
.workshop { width: 32%; }
.workshop:nth-child(4n+4) { /* float: left; margin-right: 2%; */ }
.workshop:nth-child(4n+5) { clear: none;float: left; }
.workshop:nth-child(3n+3) { float: left; /* margin-right: 0%; */}
.workshop:nth-child(3n+4) { clear: left; }
.workshop-title {min-height: 91px; padding: 0.2em; font: 1.1em 'Tungsten A', 'Tungsten B', sans-serif; font-weight: 400; }
.workshop>h3 { font-size: 1em; line-height: 1.1em; }
/* new */
ul#menu li a { font-size: 0.88em; }
#resources-listing .resource { width: 31%; }
#resources-listing .resource:nth-child(4n+4) { float: left; /* margin-right: 1%;*/ }
#resources-listing .resource:nth-child(4n+5) { clear: none;float: left; }
#resources-listing .resource:nth-child(3n+3) { float: left; /* margin-right: 0%; */}
#resources-listing .resource:nth-child(3n+4) { clear: left; }
#resources-listing .resource-title { padding: 0.2em; font-weight: 400; }
#resources-listing .resource>h3 { font-size: 1em; line-height: 1.1em; }
}
@media screen and (max-width: 720px) {
div.navigator-current img, .newsletter-access-logo { display: none; }
div.newsletter-current, div.newsletter-previous, div.navigator-current { float: none; margin:0 0 1em 0; width: 100%; padding: 0; }
.content-navigator-archive, .content-newsletter-archive { float: none; margin: 0 0 1em; width: 100%; }
.resource-line-full { width: 100%; margin: 0 auto; }
}
@media screen and (max-width: 660px) { /** 16px * 37.5 = 600px **/
#lang-switch {float: none; clear:both; text-align: center; }
.largeSpacer { height: 2em!important; min-height: 1em; }
h1 { margin-top: 0.7em; }
header #logo img { padding: 1em 0 0.7em; float: none; }
header #logo { text-align: center; }
header { background-position: center bottom; background-color: #fff; }
#utility { float: none; padding-top: 0em; text-align: center; margin-bottom: 0.4em; }
ul#utility-nav { margin: 0.4em 0 0; }
#lang-switch { margin: 0.4em 0 0.5em 0; }
.home-hero { margin: 0; }
#content { margin-top: 10px; width: 100%; }
#content.home .content-full-width { width: 100%; }
#content.home .content-left { width: 49%; margin-right: 1%; }
#content.home .content-middle { width: 49%; margin-left: 1%; }
.content-almost-full-width { width: 90%; }
.content-half-width-left { float: none; margin: 2em 0 0; width: 100%; text-align: left; }
.content-half-width-right { clear:both; float: none; width: 100%; margin: 2em 0 0 ; text-align: left; }
.content-left, .content-middle, .content-right { float: none; width: 100%; margin: 0 0%; text-align: center; }
.content-left img, .content-middle img { width: 100%; height: auto; }
.content-right>iframe { display: none; }
.content-left-and-middle { width: 92%; margin: 0 4%; float: left; text-align: center; }
ul#utility-nav li a { margin: 0 1.5%; }
div.subnav { position: relative; }
ul#menu { min-width: 100%; }
ul#menu li.parents,ul#menu li.resource, ul#menu li.connect, ul#menu li.partners { width: 100%; margin: 0.75% 0 0%; }
ul#menu li ul.submenu li.get-help a { display: inline; }
ul.submenu li, div.submenu{ padding: 0.1em 0.3em; }
ul.submenu { padding: 0; }
ul#menu li:hover a { padding-bottom: 3px; }
ul#menu li.parents ul.submenu li { width: 100%; margin: 0 0% 5%; }
ul#menu li.parents ul.submenu li.get-info { margin-bottom: 0; }
ul.submenu li div.subnavCategories { padding: 0.2em 0.2em; margin: 0.2em 0.1em 0; }
footer { padding-top: 95px; }
footer #search { float: none; }
footer ul.search-form { position: absolute; float: none;width: 90%; margin-top: -80px; }
footer .contact-us { width: 92%; float: none; margin: 0 4% 2%; }
footer .get-help, footer .about-rcsn, footer .parent-centers, footer .website { width: 42%; margin: 4%; }
footer .newsletter { width: 92%; margin: 2% 4% 6%; }
nav.stickyHeader { position: relative; }
.footer-content { padding-top: 0; width: 100%; }
.footer-social-container { width: 92%; margin: -30px 4%; }
footer .newsletter form input[type=submit] { float: none; margin: 3% auto;; }
footer .newsletter form input { width: 33%; }
footer .newsletter { text-align: center; width: 100%; padding: 4% 4% 0%; background: #004567; margin: 0 0 0%; }
footer .contact-left { width: 50%; margin-right: 4%; float: left; }
footer .contact-right { width: 46%; float: left; }
ul#menu li.resource img { margin-left: -48px; }
.resource-line-middle { min-width: 10%; }
.resource-line-middle>img { display: none; }
.donate-now-form-in-honor-of { margin: 0.45em 1em 0 1em; display: block; }
.blog-header-images { display: none; }
.blog-header-title { float: none; width: 100%;text-align: center; margin: 1em auto 0;}
.programs-icon { margin-left: 0%; height: 43px; width: 40px!important; }
.workshop-title { min-height: 71px; }
.workshop { width: 49%; margin-right: 2%;}
.workshop:nth-child(4n+4) { float: left; }
.workshop:nth-child(4n+5) { clear: none;float: left; }
.workshop:nth-child(3n+3) { float: none; margin-right: 2%;}
.workshop:nth-child(3n+4) { clear: none; }
.workshop:nth-child(2n+2) { float: left; margin-right: 0%;}
.workshop:nth-child(2n+3) { clear: none; float: none; }
.workshop {float: none!important; clear: both; }
a.upcoming-events { margin-top: 1.2em; display: block; }
iframe.facebook, iframe#twitter-widget-0 { width: 100%; }
/* new */
nav { position: relative; height: 210px; max-height: inherit; }
ul#menu li.parents ul.submenu li { width: 100%; margin: 0; }
ul#menu li ul.submenu li:hover>ul { position: relative; left:0; top:0;}
ul#menu li.events { width: 100%; margin: 0.75% 0 0%;}
#resources-listing .resource { width: 48%; margin-right: 1%;}
#resources-listing .resource:nth-child(4n+4) { float: left; }
#resources-listing .resource:nth-child(4n+5) { clear: none;float: left; }
#resources-listing .resource:nth-child(3n+3) { float: left; margin-right: 1%;}
#resources-listing .resource:nth-child(3n+4) { clear: none; }
#resources-listing .resource:nth-child(2n+2) { float: left; margin-right: 1%;}
#resources-listing .resource:nth-child(2n+3) { clear: none; float: left; }
#resources {
-moz-column-count: 1;
-moz-column-gap: 0px;
-webkit-column-count: 1;
-webkit-column-gap: 0px;
column-count:1;
}
#resources ul.resource_columns { padding: 0 20px }
#resources ul.resources_columns>li {
-webkit-column-break-inside: avoid;
-moz-column-break-inside: avoid;
-o-column-break-inside: avoid;
-ms-column-break-inside: avoid;
column-break-inside: avoid;
margin-bottom: 2em;
vertical-align: top;
display: block;
}
}
@media screen and (max-width: 29.9em) { /** 16px * 30 = 480px **/
#content.home .content-left, #content.home .content-middle, #content.home .content-right { float: none; width: 100%; margin: 0 0%; text-align: center; }
.workshop { width: 100%; clear: both; float:none; margin: 0; }
/* new */
#resources-listing .resource { width: 100%; clear: both; float:none; margin: 0.33em 0 0; }
div.newsletter-previous, div.newsletter-current { margin-top: 2em; }
img.newsletter-photo { display: none; }
.content-newsletter-archive div.newsletter-current { padding-left: 0; }
.content-quarter-left, .content-quarter-right { width: 90%; float: none; }
}
@media print,
(-o-min-device-pixel-ratio: 5/4),
(-webkit-min-device-pixel-ratio: 1.25),
(min-resolution: 120dpi) {
/* Style adjustments for high resolution devices */
}
/* ==========================================================================
Print styles.
Inlined to avoid required HTTP connection: h5bp.com/r
========================================================================== */
@media print {
* {
background: transparent !important;
color: #000 !important; /* Black prints faster: h5bp.com/s */
box-shadow: none !important;
text-shadow: none !important;
}
a,
a:visited {
text-decoration: underline;
}
a[href]:after {
/* content: " (" attr(href) ")"; */
}
abbr[title]:after {
/* content: " (" attr(title) ")"; */
}
/*
* Don't show links for images, or javascript/internal links
*/
.ir a:after,
a[href^="javascript:"]:after,
a[href^="#"]:after {
content: "";
}
pre,
blockquote {
border: 1px solid #999;
page-break-inside: avoid;
}
thead {
display: table-header-group; /* h5bp.com/t */
}
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;
}
nav, #utility, #footer-tools, .footer-container, .download-link, .calendar-cat-filters, .workshop-detail-register { display: none; }
header #logo img { padding: 0; margin: 0 auto; }
header #logo { float:none; text-align: center; }
}
.lt-ie9 footer ul.search-form input.search-field {
width:408px; background: #FFF; color: #333; height:28px; border: 1px solid #999; margin-left: 48px; margin-top: 28px;
}
.le-ie9 footer ul.search-form label { top: 18px; }
/* calendar */
div.calendar-cat-filters { text-align: center; width: 100%; max-width: 968px; margin: 0 0 0.4em; }
div.calendar-cat-filter { display: inline-block; *display: inline; zoom: 1; margin: 0 2% 0; font: 1.1em 'Tungsten A', 'Tungsten B', sans-serif; font-weight: 400; text-transform: uppercase; }
.cal-cat-filter-services-and-systems, .cal-cat-filter-servicios-y-sistemas { color: #00a6cd; }
.cal-cat-filter-parenting, .cal-cat-filter-criando-a-los-ninos { color: #fcb857;}
.cal-cat-filter-advocacy { color: #f37535; }
.cal-cat-filter-education , .cal-cat-filter-educacion{ color: #004567; }
.cal-cat-filter-transition { color: #e1e100; }
.calendarBG {
width: 100%; margin: 0 0 5em;
}
.calendarBlank {
background-color: #f4f4f4;
vertical-align: top;
padding: 0; color: #FFF;
font-size: 0.8em;
border: 1px solid #fecf4b; /* #bad430; */
}
.calendarHeader {
font: 1.5em/2.5em 'Tungsten A', 'Tungsten B', sans-serif; font-weight: 400;
color: #004567;
background-color: #FFF;
text-align: center;
}
.calendarHead { font-weight: 400; margin-bottom: 1em;}
.calendarMonthLinks {
font-family: 'Gotham', 'Helvetica Neue', Helvetica, Arial, 'sans-serif'
font-size: 11px;
font-weight: bold;
letter-spacing: .1em;
text-decoration: none;
color: #333;
background-color: transparent;
float: left;
}
.calendarMonthLinks a {
color: #333;
text-decoration: none;
background-color: transparent;
}
.calendarMonthLinks a:visited {
color: #333;
text-decoration: none;
background-color: transparent;
}
.calendarMonthLinks a:hover {
color: #ccc;
text-decoration: underline;
background-color: transparent;
}
.calendarDayHeading {
font-weight: normal;
font-size: 12px;
color: #fff;
background-color: #FFF;
color: #fecf4b; /* #e1e100; */
text-align: center;
vertical-align: middle;
text-transform: uppercase;
padding-top: 1em;
}
.calendarToday {
font-family:'Gotham', 'Helvetica Neue', Helvetica, Arial, 'sans-serif';
font-size: 12px;
line-height: 1.2em;
text-decoration: none;
text-align: left;
vertical-align: top;
color: #000;
border: 1px solid #fecf4b; /* #bad430; */
background: #fcffed;
}
.calendarCell {
font-family: 'Gotham', 'Helvetica Neue', Helvetica, Arial, 'sans-serif';
font-size: 12px;
font-weight: normal;
text-decoration: none;
text-align: left;
vertical-align: top;
color: #666;
background-color: #fff;
width: 14%;
border: 1px solid #fecf4b; /* #bad430;*/
height: 7em;
}
.calendarCell div.calendarEntry,
.calendarToday div.calendarEntry {
margin: 0.6em; margin-left: 1.2em;
padding-bottom: 0.8em; }
.calendarToday a, .calendarCell a, .calendarCell a:link {
color: #323232;
text-decoration: underline;
background-color: transparent;
line-height: 1.2em;
display: block;
text-decoration:none;
clear: both;
}
.calendarCell a:visited {
color: #000;
text-decoration: underline;
background-color: transparent;
}
.calendarCell a:hover {
color: #000;
text-decoration: underline;
background-color: transparent;
}
.day-number { background: #FFF; text-align: center; width: 2em; float: right; border-left: 1px solid #cfcfcf; border-bottom: 1px solid #cfcfcf; margin-bottom: 0.2em; }
.calendarDate { float: left; }
a.calendarEventEntry.services-and-systems, a.calendarEventEntry.servicios-y-sistemas { border-left: 5px solid #00a6cd; padding-left: 8px; margin-left: -8px; }
a.calendarEventEntry.parenting, a.calendarEventEntry.criando-a-los-ninos { border-left: 5px solid #fcb857; padding-left: 8px; margin-left: -8px; }
a.calendarEventEntry.advocacy { border-left: 5px solid #f37535; padding-left: 8px; margin-left: -8px; }
a.calendarEventEntry.education, a.calendarEventEntry.educacion { border-left: 5px solid #004567; padding-left: 8px; margin-left: -8px; }
a.calendarEventEntry.transition { border-left: 5px solid #e1e100; padding-left: 8px; margin-left: -8px; }
/* end calendar */