/* compiled by scssphp v0.6.3 on Fri, 14 Apr 2017 15:23:10 -0500 (0.2509s) */ textarea: active; /***** STYLE GUIDE *****/ .sg-color { border: none; } .sg-color--a { background-color: #6cb33f; } .sg-color--b { background-color: #808080; } .sg-color--c { background-color: #f2f2f2; } .sg-h1, .sg-h2, .sg-h3 { font-family: "myriad-pro", sans-serif !important; } .sg-section { padding: 1em; } .sg-section .background_image { background-image: url(https://secure3.convio.net/charv/bb/images/carrots-placeholder.jpg); background-repeat: no-repeat; background-size: 100% auto; padding: 3em; min-height: 400px; max-width: 800px; } /* generic guide visuals */ .sg-header.sg-container { background-color: #6cb33f; position: fixed; width: 100%; } .sg-logo { color: #fff; float: left; } #js-sg-nav { float: right; padding: 1em; } .sg-btn--top { font-size: 0.8em; } .sg-h1 { font-size: 2.25em; font-weight: bold; padding-bottom: 0.2em; margin-bottom: 0; color: #777; } .sg-h2 { border-bottom: 1px solid #ddd; font-size: 1.75em; margin-bottom: 0.5em; text-transform: capitalize; padding-bottom: 0.4em; } .sg-h3 { font-size: 0.65em; text-transform: uppercase; font-weight: 900; color: #80715f; } .sg-section fieldset div { margin-bottom: 2em; } .js .sg-btn--source { display: block; font-size: 0.6em; background: #a29b95; color: #f2f2f2; padding: 0.25em 0.75em; border-radius: 2px; font-family: Monaco, Monospace; margin-bottom: 1em; } .sg-pattern-styles { padding: 1em; } .sg-anchor { display: block; padding: 0.5em; background: #f2f2f2; margin-top: 3em; } span.i-code { display: none; } .the-icons { font-size: 1.7em; line-height: 1.7; } .the-icons i:before { color: #6cb33f; min-width: 80px; } /***************** INITS ***********************************************/ * { box-sizing: border-box; } body { font-family: "myriad-pro", sans-serif !important; width: 100%; color: #111; font-size: 18px; background: white; max-width: 1280px; margin: 0 auto; } /***************** CONTAINER AND COMMON DIVS ***********************************************/ #container { width: 100%; min-height: 600px; } .clearfix { clear: both; } .onepage { clear: both; position: relative; padding-top: 1em; } .centering_box, .notfound404, .search-results .pageinfo { width: 100%; max-width: 960px; margin-left: auto; margin-right: auto; } .copy .centering_box, .text .block .type-text, .pagetype-basic .copy .pageinfo .centering_box, .pagetype-basic .copy .subtitle .centering_box, .type-programs.copy .pageinfo .centering_box, .type-programs.copy .subtitle .centering_box, .type-campaign.copy .pageinfo .centering_box, .type-campaign.copy .subtitle .centering_box, .type-resource.copy .pageinfo .centering_box, .type-resource.copy .subtitle .centering_box, .type-volunteer.copy .pageinfo .centering_box, .type-volunteer.copy .subtitle .centering_box, .type-partnerships.copy .pageinfo .centering_box, .type-partnerships.copy .subtitle .centering_box, .single-post .copy .pageinfo .centering_box, .page-template-default .pagetype- .copy .pageinfo .centering_box, .type-page.copy .pageinfo .centering_box, .type-page.copy .subtitle .centering_box { max-width: 960px; } .copy .pageinfo .centering_box, .copy .subtitle .centering_box { max-width: 960px; } .mobile_only { display: none; } .desktop_only { display: block; } /***************** COMMON DIV DECORATION ***********************************************/ .shadow_module { box-shadow: 1px 1px 4px 2px #ccc; } .round_module, .btn, .button button { border-radius: 2px; letter-spacing: 0.03em; } .round_module:hover, .btn:hover, button:hover, .button:hover { box-shadow: 0 1px 5px rgba(0, 0, 0, .23), 0 0px 8px rgba(0, 0, 0, .05); -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .round_module:active, .btn:active, button:active, .button:active { box-shadow: inset 0 4px 7px rgba(0, 0, 0, .23), inset 0 8px 25px rgba(0, 0, 0, .05); opacity: 0.8; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .btn:hover, button:hover, .button:hover, input[type="submit"]:hover { cursor: pointer; } /***************** COMMON MARKUP ***********************************************/ img { max-width: 100%; height: auto; } a { text-decoration: none; color: #6cb33f; } a:hover { text-decoration: none; color: #111; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } ul, ol { padding-left: 0; margin: 0; } ol li { padding-left: 0; list-style-type: decimal; margin-left: 1em; } ul li { list-style: disc; margin-left: 1em; } ul li ul li { list-style: circle; } ul li ul li ul li { list-style: square; } blockquote { font-style: italic; padding: 0 1em; } blockquote.left { float: left; margin-left: 0; margin-right: 1.2em; text-align: right; width: 33%; } blockquote.right { float: right; margin-left: 1.2em; margin-right: 0; text-align: left; width: 33%; } h1, h2, h3, h4, h5 { margin-top: 0; margin-bottom: 0.6em; font-weight: 100; line-height: 1; } h1 { font-size: 3.2em; color: #6cb33f; } h2 { font-size: 1.7em; color: #6cb33f; font-weight: 900; } .subtitle h2 { font-size: 1em; color: #808080; font-weight: 100; font-size: 1.7em; } h3 { font-size: 1.7em; margin-bottom: 1em; } h4 { font-size: 0.85em; text-transform: uppercase; color: #737373; margin-bottom: 1em; } h5 { margin-bottom: 1em; font-size: 0.85em; color: #808080; } .copy h1 + h5 { margin-top: -2.5em; margin-bottom: 2em; } .copy h3 + h4 { margin-top: -0.6em; margin-bottom: 2em; } p { font-size: 1em; margin-bottom: 1.25em; margin-top: 0; line-height: 1.25em; margin-top: 0; } input { padding: 0.5em; border-bottom: 1px solid #bfbfbf; font-family: "myriad-pro", sans-serif !important; border: none; border-bottom: 1px solid #bfbfbf; } input:active, input:focus { border-bottom: 3px solid #bfbfbf; } textarea { border: 1px solid #bfbfbf; width: 100%; max-width: 960px; padding: 0.5em; } textarea:focus { border: 3px solid #bfbfbf; outline: 0; } input:active, input:focus { outline: none; } input:required { border-bottom: 1px solid #404040; } input.short { max-width: 50px; } input.medium { max-width: 100px; } input[type="search"] { border: none; background: #6cb33f; color: #fff; } ::-webkit-input-placeholder { /* WebKit, Blink, Edge */ color: #fff; } :-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #fff; opacity: 1; } ::-moz-placeholder { /* Mozilla Firefox 19+ */ color: #fff; opacity: 1; } :-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #fff; } :placeholder-shown { /* Standard (https://drafts.csswg.org/selectors-4/#placeholder) */ color: #fff; } label { display: block; font-size: 0.8em; color: #808080; } label.required { color: #6cb33f; } address { padding-left: 1em; border-left: 1px solid #6cb33f; margin-bottom: 1.5em; font-size: 0.9em; } mark { background: #ebf3e6; padding: 0 0.25em; } /* patterns and interaction */ .alert-success { background: #dceed0; color: #6cb33f; border-color: #a3d484; } .alert-warning { background: #e6e6e6; color: #808080; border-color: #b3b3b3; } .alert-error { background: #eeafaf; color: #ad2424; border-color: #dd5a5a; } .alert-info { background: #aad0e2; color: #31708f; border-color: #5ea5c8; } /* navigation */ .topmenu .sink_dropdown > li.current_page_item a, .topmenu .sink_dropdown > li.current_page_parent a, .topmenu .sink_dropdown > li.current-cat a, .topmenu .sink_dropdown > li.current-page-ancestor a, .topmenu .sink_dropdown > li.current-menu-ancestor a, .topmenu .sink_dropdown > li.current-menu-parent a, .topmenu .sink_dropdown > li.current-page-parent a { color: #6cb33f; } .topmenu .sink_dropdown li li a { padding-bottom: 0; } @media screen and (max-width: 800px) { .topmenu .sink_dropdown_container { background: transparent !important; } } /***************** LAYOUT ***********************************************/ .flexible { display: -webkit-flex; display: -ms-flexbox; display: -webkit-box; display: flex; -webkit-justify-content: space-around; -ms-flex-pack: distribute; justify-content: space-around; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .footer_inner { background: #6cb33f; margin: auto; } @media (max-width: 1440px) { .fp_jumbo, .fp_jumbo.video_container, #header .slideshow_area, #header .slideshow_area .slide { height: calc(100vw/2); } .home #header { height: calc(100vw/1.59); /* needed for safari as fallback */ height: calc(132px + (100vw / 2)); height: calc(132px + calc(100vw/2)); } } @media (min-width: 1280px) { .fp_jumbo, .fp_jumbo.video_container, .home #header, #header .slideshow_area, #header .slideshow_area .slide { height: 603px; } .home #header { height: 735px; } }