/* colors used: * #ffffff - white * #008c5c - green (0, 140, 92) * #015c3c - medium green (1,92,60) * #003f29 - dark green (0,63,41) * #8cc63f - light green * #1a3281 - blue accent * #fcaf17 - orange accent * #555555 - gray text, gray accent * #f7ecd5 - tan/orange, background color * #b7b7b7, 87% - overlay color (183,183,183,.87) * #fdfbf7, #fff @ 80% - blockquote bg */ /* fonts: * 'Clear Sans' * 'blue_highway_regular' ---------- 'BlueHighwayW00-Regular' (formerly 'Blue Highway W00') * 'blue_highway_bold' ---------- 'Blue Highway W00 Bold' * 'blue_highway_condensed' ---------- 'BlueHighwayW00-Condense' * 'fontello' */ @font-face { font-family: 'blue_highway_regular'; src: url('../fonts/blue_highway/bluehigh-webfont.eot'); src: url('../fonts/blue_highway/bluehigh-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/blue_highway/bluehigh-webfont.woff2') format('woff2'), url('../fonts/blue_highway/bluehigh-webfont.woff') format('woff'), url('../fonts/blue_highway/Bluehigh.ttf') format('truetype'), url('../fonts/blue_highway/bluehigh-webfont.svg#blue_highwayregular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'blue_highway_bold'; src: url('../fonts/blue_highway/bluehigb-webfont.eot'); src: url('../fonts/blue_highway/bluehigb-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/blue_highway/bluehigb-webfont.woff2') format('woff2'), url('../fonts/blue_highway/bluehigb-webfont.woff') format('woff'), url('../fonts/blue_highway/Bluehigb.ttf') format('truetype'), url('../fonts/blue_highway/bluehigb-webfont.svg#blue_highway__bold') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'blue_highway_condensed'; src: url('../fonts/blue_highway/bluehigc-webfont.eot'); src: url('../fonts/blue_highway/bluehigc-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/blue_highway/bluehigc-webfont.woff2') format('woff2'), url('../fonts/blue_highway/bluehigc-webfont.woff') format('woff'), url('../fonts/blue_highway/Bluehigc.ttf') format('truetype'), url('../fonts/blue_highway/bluehigc-webfont.svg#blue_highway_condensedregular') format('svg'); font-weight: normal; } @font-face { font-family: 'fontello'; src: url('../fonts/fontello/fontello.eot?58599859'); src: url('../fonts/fontello/fontello.eot?58599859#iefix') format('embedded-opentype'), url('../fonts/fontello/fontello.woff?58599859') format('woff'), url('../fonts/fontello/fontello.ttf?58599859') format('truetype'), url('../fonts/fontello/fontello.svg?58599859#fontello') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'bfbl-quote'; src: url('../fonts/fontello/quote.eot?51416563'); src: url('../fonts/fontello/quote.eot?51416563#iefix') format('embedded-opentype'), url('../fonts/fontello/quote.woff?51416563') format('woff'), url('../fonts/fontello/quote.ttf?51416563') format('truetype'), url('../fonts/fontello/quote.svg?51416563#quote') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'bfbl-errors'; src: url('../fonts/fontello/bfbl-errors.eot?53376286'); src: url('../fonts/fontello/bfbl-errors.eot?53376286#iefix') format('embedded-opentype'), url('../fonts/fontello/bfbl-errors.woff?53376286') format('woff'), url('../fonts/fontello/bfbl-errors.ttf?53376286') format('truetype'), url('../fonts/fontello/bfbl-errors.svg?53376286#bfbl-errors') format('svg'); font-weight: normal; font-style: normal; } html { padding: 0; margin: 0; } html, body { font-family: 'Clear Sans', Helvetica, Arial, sans-serif; font-size: 100%; -webkit-text-size-adjust: 100%; /* Prevent font scaling in landscape */ line-height: 1.3; color: #000; } /* FONT ANTI-ALIASING */ body, .drawerNav, .site-header, .footer { text-rendering: optimizeLegibility; text-rendering: geometricPrecision; font-smooth: always; font-smoothing: antialiased; -moz-font-smoothing: antialiased; -webkit-font-smoothing: antialiased; -webkit-font-smoothing: subpixel-antialiased; -moz-osx-font-smoothing: grayscale; /* text-shadow: 0 0 0 #000; - turning this off, because it makes all the fonts darker */ } /* resets */ ul { list-style-type: none; list-style-position: inside; padding: 0; margin: 0; } p { margin: 0; } input, button { border: 0; background: transparent; outline: 0; border-radius: 0; font-family: inherit; font-weight: normal; border-radius: 0; } button { padding: 0; } .screen-reader-text, .visuallyhidden, .bfblSlider.initialClosed .bfblSlideWrap { position: absolute; clip: rect(1px, 0, 0, 1px); overflow: hidden; } .lower-case { text-transform: lowercase !important; } .site-wrapper { padding: 0; overflow: hidden; } .container-fluid.constrained { max-width: 1170px; margin-left: auto; margin-right: auto; } /* BUTTONLINK STYLES */ .bfblButtonLink, #wp-submit, .nav-previous a, .nav-next a { display: inline-block; background: #008c5c!important; border: 1px solid #ffffff!important; border-radius: 0; outline: 0; text-align: center; text-transform: uppercase; color: #ffffff!important; text-decoration: none !important; font-size: 16px; font-size: 1rem; line-height: 45px; line-height: 2.8125rem; height: 47px; height: 2.9375rem; min-width: 124px; min-width: 7.75rem; box-sizing: border-box; padding: 0 12px; padding: 0 .75rem; font-family: 'blue_highway_regular'; } .bfblButtonLink:hover, .bfblButtonLink:focus, #wp-submit:hover, #wp-submit:focus { background: #003f29!important; color: #ffffff!important; text-decoration: none; } .bfblButtonLink.btnBlue, .nav-previous a, .nav-next a { border-color: #1a3281!important; color: #1a3281!important; background: transparent!important; } .bfblButtonLink.btnBlue:hover, .bfblButtonLink.btnBlue:focus, .nav-previous a:hover, .nav-next a:hover, .nav-previous a:focus, .nav-next a:focus { background: #1a3281!important; color: #ffffff!important; } .bfblButtonLink.btnBlueSolid, .bfblButtonLink.btnBlueSolidWhiteHover { border-color: #1a3281!important; color: #ffffff!important; background: #1a3281!important; } .bfblButtonLink.btnBlueSolid:hover, .bfblButtonLink.btnBlueSolid:focus { color: #1a3281!important; background: transparent !important; } .bfblButtonLink.btnBlueSolidWhiteHover:hover, .bfblButtonLink.btnBlueSolidWhiteHover:focus { color: #1a3281!important; background: #fff !important; border-color: #fff; } .bfblButtonLink.btnOrange { border-color: #fcaf17!important; color: #fcaf17!important; background: transparent!important; } .bfblButtonLink.btnOrange:hover, .bfblButtonLink.btnOrange:focus { background: #fcaf17!important; color: #ffffff!important; } .bfblButtonLink.btnGray { border-color: #555555!important; color: #555555!important; background: transparent!important; } .bfblButtonLink.btnGray:hover, .bfblButtonLink.btnGray:focus { background: #555555!important; color: #ffffff!important; } /** BLC Challenge Social **/ .blc-social-content { padding-top: .5em !important; padding-bottom: .2em !important; } .blc-social-content p { max-width: 700px; margin-left: auto; margin-right: auto; } .blc-social { list-style-type: none; text-align: center; display: block; } .blc-social li { display: inline-block; font-size: 20px; margin: 1em; padding: 0; background: transparent; overflow: hidden; width: 40px; height: 40px; } .blc-social li::before { display: none !important; } .blc-social li a { position: relative; display: block; float: left; border-radius: 50%; text-decoration: none; background: transparent; width: 40px; height: 40px; } .blc-social li a span { display: none; } .blc-social li a::before { display: block; width: 40px; height: 40px; font-family: fontello; font-size: 20px; line-height: 40px; border-radius: 50%; text-align: center; color: #fff; background-color: #1a3281; } .blc-social li a:hover { background-color: transparent !important; } .blc-social li a:hover::before { background-color: #fff; color: #1a3281; } .blc-social .twitter a::before { content: '\e802'; } .blc-social .facebook a::before { content: '\e804'; } .blc-social .youtube a::before { content: '\e801'; } .blc-social .instagram a::before { content: '\e803'; } /* HEADER */ header.site-header { background: #008c5c; border-bottom: 1px solid #8cc63f; height: 76px; height: 4.75rem; padding-top: 14px; padding-top: 0.875rem; position: relative; } header.site-header h1 { margin: 0; } header.site-header .home-link a { display: block; width: 130px; width: 8.125rem; height: 50px; height: 3.125rem; background-image: url('../images/bfbl_logo.png'); background-repeat: no-repeat; background-position: center center; background-size: contain; text-indent: -999999px; overflow: hidden; margin-left: 10px; margin-left: 0.625rem; } #bfblMenuBtn { position: absolute; top: 12px; top: 0.75rem; right: 0; bottom: 0; width: 64px; width: 4rem; background: transparent; border: 0; outline: 0; color: #ffffff; font-family: 'blue_highway_condensed'; letter-spacing: 3px; letter-spacing: 0.1875rem; text-indent: 2px; text-indent: 0.125rem; text-transform: uppercase; font-size: 18px; font-size: 1.125rem; line-height: 1; padding-top: 10px; padding-top: 0.625rem; padding-bottom: 38px; padding-bottom: 2.375rem; } #bfblMenuBtn:hover, #bfblMenuBtn:focus { background: #003f29; } #bfblMenuBtn::before, #bfblMenuBtn::after { content: ''; display: block; position: absolute; height: 16px; /* cq, no rems */ right: 12px; right: 0.75rem; bottom: 12px; bottom: 0.75rem; left: 12px; left: 0.75rem; box-sizing: border-box; border-width: 0; border-style: solid; border-color: #ffffff; } #bfblMenuBtn::before { border-top-width: 1px; border-bottom-width: 1px; } #bfblMenuBtn::after { height: 0; border-bottom-width: 1px; margin-bottom: 7px; /* cq, no rems */ } /* MAIN MENU */ #bfblMenuOverlay { display: block; position: fixed; top: 0; right: 0; bottom: 100%; left: 0; background: #b7b7b7; z-index: 500; opacity: 0; transition: opacity .25s, bottom 0s linear .25s; } #bfblMenuOverlay.menuActive { bottom: 0; opacity: .84; transition: opacity .25s, bottom 0s; } #bfblDrawerWrap { position: absolute; top: 0; right: 0; width: 0; height: 0; z-index: 600; overflow: hidden; transition: width 0s linear .25s, height 0s linear .25s; } #bfblDrawerWrap.menuActive { width: 100%; height: 600px; height: 37.5rem; transition: width 0s , height 0s; } #bfblMenuDrawer { position: absolute; top: 0; right: -320px; width: 320px; width: 20rem; max-width: 87.5%; box-sizing: border-box; background: #008c5c; text-align: center; font-family: 'blue_highway_regular'; color: #ffffff; overflow: hidden; transition: right .25s, box-shadow .25s; } #bfblDrawerWrap.menuActive #bfblMenuDrawer { right: 0; box-shadow: 0 0 30px 1px rgba(17,17,18,.75); } .drawerTop { height: 88px; height: 5.5rem; padding-top: 20px; padding-top: 1.25rem; text-align: left; position: relative; } a.drawerHomeLink { display: block; width: 130px; width: 8.125rem; height: 50px; height: 3.125rem; background-image: url('../images/bfbl_logo.png'); background-repeat: no-repeat; background-position: center center; background-size: contain; text-indent: -999999px; overflow: hidden; margin-left: 10px; margin-left: 0.625rem; } #bfblMenuClose { position: absolute; top: 0; right: 0; bottom: 0; width: 50px; width: 3.125rem; text-indent: -9999999px; color: #015c3c; } #bfblMenuClose::before { font-family: 'fontello'; content: '\e800'; display: block; position: absolute; top: 50%; right: 50%; width: 36px; width: 2.25rem; height: 36px; height: 2.25rem; margin-top: -18px; margin-top: -1.125rem; margin-right: -18px; margin-right: -1.125rem; font-size: 36px; font-size: 2.25rem; line-height: 36px; line-height: 2.25rem; text-align: center; text-indent: 0; } #bfblMenuClose:hover, #bfblMenuClose:focus { color: #ffffff; } .drawerNav { background: #015c3c; padding-top: 28px; padding-top: 1.75rem; padding-bottom: 24px; padding-bottom: 1.5rem; } .drawerNav::after { content: ''; display: block; clear: both; } .drawerNav .menuColumn { float: right; width: 50%; } .drawerNav .menuColumn:first-child { float: left; } .drawerNav a { display: block; padding-top: 12px; padding-top: 0.75rem; padding-bottom: 12px; padding-bottom: 0.75rem; line-height: 1; font-size: 16px; font-size: 1rem; text-transform: uppercase; color: #008c5c; text-decoration: none; } .drawerNav a:hover { color: #ffffff; } .drawerNav a .shade { display: none; } .drawerLogin { padding-top: 32px; padding-top: 2rem; } .drawerNewsletter { padding-top: 38px; padding-top: 2.375rem; padding-bottom: 30px; padding-bottom: 1.875rem; } .drawerSearch { background: #015c3c; padding: 36px 10px; padding: 2rem 0.625rem; } .searchBtnWrap { display: none; /* hidden on mobile */ } .search-form { display: block; border: 1px solid #008c5c; border-top: 0; height: 30px; height: 1.875rem; position: relative; } .search-form .search-field { padding: 0 6px; padding: 0 0.375rem; position: absolute; top: 4px; top: 0.25rem; bottom: 4px; bottom: 0.25rem; left: 0; width: 88.5%; display: block; font-size: 14px; font-size: 0.875rem; font-family: 'Clear Sans'; color: #ffffff; } input.search-field::-webkit-input-placeholder { color: #008c5c !important; font-style: italic; } input.search-field:-moz-placeholder { /* Firefox 18- */ color: #008c5c !important; font-style: italic; } input.search-field::-moz-placeholder { /* Firefox 19+ */ color: #008c5c !important; font-style: italic; } input.search-field:-ms-input-placeholder { color: #008c5c !important; font-style: italic; } .search-form .search-submit { position: absolute; top: 0; right: 0; bottom: 0; width: 11.5%; background: transparent; text-indent: -99999px; /* NOTE: since we're using an iconfont, it must be added to the PARENT element, because b/c s can't have pseudo elements */ } .search-form::before { font-family: 'fontello'; content: '\e805'; display: block; position: absolute; top: 0; right: 0; bottom: 0; width: 11.5%; font-size: 18px; font-size: 1.125rem; line-height: 30px; line-height: 1.875rem; color: #008c5c; } .searchFormWrap.resultsPage { position: static!important; clip: auto!important; margin: 0 auto 32px; margin: 0 auto 2rem; width: 320px; width: 20rem; padding: 16px 18px; padding: 1rem 1.125rem; background: #015c3c; } /* LIGHTBOXES */ .bfblLightboxes { display: none; } .ui-widget-overlay { background: #b7b7b7; opacity: .84; transition: z-index .25s; } .ui-dialog { box-shadow: 0 0 30px 1px rgba(17,17,18,.75); outline: 0; background: #008c5c; color: #ffffff; } .ui-dialog::after { /* this is needed to prop open the lightbox width, if the interior content isn't already wide enough */ content: ''; display: block; width: 320px; } .ui-dialog-titlebar { background: transparent; border: 0; text-align: right; padding-right: 10px; padding-right: 0.625rem; height: 42px; height: 2.625rem; } .ui-dialog-titlebar-close { color: #015c3c; } .ui-dialog-titlebar-close:hover { color: #ffffff; } .ui-dialog-titlebar-close:before { font-family: 'fontello'; content: '\e808'; font-size: 26px; font-size: 1.625rem; } .ui-dialog-content { padding: 0; } .ui-dialog h3 { margin: 0; padding-bottom: 2rem; text-align: center; font-size: 16px; font-size: 1rem; text-transform: uppercase; letter-spacing: 3px; letter-spacing: 0.1875rem; color: #8cc63f; font-family: 'blue_highway_regular'; background: #008c5c; } #loginLB, #newsletterLB { background: #015c3c; } #loginLB p.login-username, #loginLB p.login-password, #newsletterLB div.nlEmail, #newsletterLB div.nlName { display: block; margin: 36px 12px; margin: 2rem 0.75rem; border: 1px solid #008c5c; border-top: 0; height: 30px; height: 1.875rem; position: relative; /* padding-left: 11.5%; */ } #newsletterLB div.nlSideBySide { overflow: hidden; } #newsletterLB div.nlName { overflow: hidden; margin-top: 0; margin-bottom: 9pm; margin-bottom: .5rem; } #newsletterLB div.mce-error-response, #newsletterLB div.mce-success-response { text-align: center; padding: 9px; font-weight: bold; font-style: italic; font-size: .9em; } #newsletterLB div.nlSideBySide .mc-field-group { width: 50%; float: left; } #newsletterLB div.mc-field-group div.mce_inline_error { margin-top: -1.75em; text-align: center; font-size: .9; } #loginLB p.login-password { margin-bottom: 28px; margin-bottom: 1.75rem; } #loginLB p.login-username::before, #loginLB p.login-password::before, #newsletterLB div.nlEmail::before, #newsletterLB div.nlName::before { font-family: 'fontello'; display: block; position: absolute; top: 50%; left: 1.5%; width: 8.8%; height: 26px; height: 1.625rem; margin-top: -15px; margin-top: -0.8125rem; font-size: 22px; font-size: 1.375rem; line-height: 26px; line-height: 1.625rem; text-align: center; color: #008c5c; } #loginLB p.login-username::before { content: '\e80a'; } #loginLB p.login-password::before { content: '\e807'; } #newsletterLB div.nlEmail::before { content: '\e810'; font-size: 20px; font-size: 1.25rem; margin-top: -16px; margin-top: -1rem; } #newsletterLB div.nlName::before { content: '\e80a'; font-size: 20px; font-size: 1.25rem; margin-top: -16px; margin-top: -1rem; margin-left: 3px; } #loginLB p.login-username label, #loginLB p.login-password label, #newsletterLB div.nlEmail label { position: absolute; overflow: hidden; text-indent: -999999px; top: 1px; left: 1.5%; width: 8.8%; height: 26px; height: 1.625rem; } #loginLB p.login-username input, #loginLB p.login-password input, #newsletterLB div.nlEmail input, #newsletterLB div.nlName input { padding: 0 6px; padding: 0 0.375rem; position: absolute; top: 4px; top: 0.25rem; bottom: 4px; bottom: 0.25rem; right: 1.5%; width: 86.5%; display: block; font-size: 14px; font-size: 0.875rem; font-family: 'Clear Sans'; color: #ffffff; } #newsletterLB div.nlName input { width: 80%; } #loginLB input::-webkit-input-placeholder { color: #008c5c !important; font-style: italic; } #loginLB input:-moz-placeholder { /* Firefox 18- */ color: #008c5c !important; font-style: italic; } #loginLB input::-moz-placeholder { /* Firefox 19+ */ color: #008c5c !important; font-style: italic; } #loginLB input:-ms-input-placeholder { color: #008c5c !important; font-style: italic; } #loginLB input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px rgba(0, 140, 92, .75) inset; } #newsletterLB input::-webkit-input-placeholder { color: #008c5c !important; font-style: italic; } #newsletterLB input:-moz-placeholder { /* Firefox 18- */ color: #008c5c !important; font-style: italic; } #newsletterLB input::-moz-placeholder { /* Firefox 19+ */ color: #008c5c !important; font-style: italic; } #newsletterLB input:-ms-input-placeholder { color: #008c5c !important; font-style: italic; } #newsletterLB input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px rgba(0, 140, 92, .75) inset; } #loginLB p.login-remember { margin-left: 20px; margin-left: 1.25rem; } #loginLB p.login-remember label { font-weight: normal } #loginLB p.login-remember input { display: none; } #loginLB p.login-remember label span { font-size: 14px; font-size: 0.875rem; color: #008c5c; font-style: italic; position: relative; display: inline-block; padding-left: 34px; /* cq, not rems */ } #loginLB p.login-remember label span::before { content: ''; display: block; position: absolute; top: 50%; left: 0; width: 20px; /* cq, not rems */ height: 20px; margin-top: -10px; background-image: url('../images/bfbl_sprite_checkbox.png'); background-repeat: no-repeat; background-size: 20px 95px; background-position: 0 -50px; } #loginLB p.login-remember label input[type=checkbox]:checked + span { color: #ffffff; font-style: normal; } #loginLB p.login-remember label input[type=checkbox]:checked + span::before { background-position: 0 -75px; } #loginLB p.login-submit, #newsletterLB div.nlSubmit { text-align: center; margin: 32px 12px; margin: 2rem 0.75rem; } /* FOOTER */ #bfblFooter { background: #015c3c; color: #ffffff; text-align: center; font-size: 14px; font-size: 0.875rem; } #bfblFooter a { color: #ffffff; text-decoration: none; } #bfblFooter a:hover { color: #8cc63f; } #bfblFooter .footerRowOne { font-family: 'blue_highway_regular'; } #bfblFooter h3 { font-size: 16px; font-size: 1rem; text-transform: uppercase; letter-spacing: 3px; letter-spacing: 0.1875rem; color: #8cc63f; margin: 40px 0 16px; margin: 2.5rem 0 1rem; } .footerAbout { padding-left: 10px; padding-left: 0.625rem; /* matches padding on .page-block */ padding-right: 10px; padding-right: 0.625rem; } .footerAbout p { text-align: left; max-width: 500px; max-width: 31.25rem; margin-left: auto; margin-right: auto; } .footerNav li { margin-top: 16px; margin-top: 1rem; } #bfblFooter .footerSocial h3 { margin-bottom: 26px; margin-bottom: 1.625rem; } .footerSocial ul { display: block; max-width: 400px; max-width: 25rem; margin: 0 auto 44px; margin: 0 auto 2.75rem; } .footerSocial li { display: inline-block; width: 25%; } .footerSocial a { display: block; } .footerSocial a::before { font-family: 'fontello'; display: inline-block; width: 22px; width: 1.375rem; height: 22px; height: 1.375rem; font-size: 22px; line-height: 22px; text-align: center; position: relative; top: -1px; } .footerSocial .twitter a::before { content: '\e802'; } .footerSocial .facebook a::before { content: '\e804'; } .footerSocial .youtube a::before { content: '\e801'; } .footerSocial .instagram a::before { content: '\e803'; } .footerSocial a span { display: inline-block; text-indent: -99999px; overflow: hidden; } .footerHomeLink { position: absolute; clip: rect(1px, 0, 0, 1px); overflow: hidden; } .footerAddress { text-transform: uppercase; margin-bottom: 12px; margin-bottom: 0.75rem; } .footerPhoneEmail { margin-bottom: 30px; margin-bottom: 1.875rem; } .footerPhoneEmail span { display: inline-block; padding: 0 10px; padding: 0 0.625rem; } .footerPhoneEmail span.footerPhone { border-right: 1px solid #8cc63f; margin-right: -1px; } .footerCredits { /* askaskask */ position: absolute; clip: rect(1px, 0, 0, 1px); overflow: hidden; text-align: right; color: #8cc63f; font-size: 13px; font-size: 0.8125rem; } .footerCredits .credit { text-transform: uppercase; } #bfblFooter .footerCredits .credit a { color: inherit; } #bfblFooter .footerCredits .credit a:hover { color: #ffffff; } /* PAGE HEADER */ header.page-header.has-image { margin: 0; padding: 0; height: 150px; height: 9.375rem; line-height: 150px; line-height: 9.375rem; /* used to center the contents vertically */ background-repeat: no-repeat; background-position: left center; background-size: cover; position: relative; text-align: center; } header.page-header.has-image::before { content: ''; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0;/* background: url('../images/header/animated_header_yellow.png'); background: rgba(252, 175, 23, 0.29);*/ } header.page-header.has-image .entry-title { margin: 0; display: inline-block; vertical-align: middle; font-family: 'blue_highway_bold'; font-size: 36px; font-size: 2.25rem; line-height: 30px; line-height: 1.875rem; color: #FFFFFF; text-align: center; text-transform: uppercase; position: relative; z-index: 10; text-shadow: 0 0 10px #000000; } header.page-header.has-image .entry-title .title { font-size: .95em; line-height: .9; margin: 0; padding: 0; text-align: center; } header.page-header.has-image .entry-title .subtitle { font-size: .85rem; line-height: 1.2; text-align: center; font-family: 'Clear Sans', Helvetica, Arial, sans-serif; margin: 0; padding: 0; } header.page-header.has-image img { /* hide this, because we're using background image */ position: absolute; clip: rect(0 1px 1px 0); overflow: hidden; } header.page-header.no-image { background: #fcaf17; background: rgba(252, 175, 23, 0.75); padding: 10px; padding: 0.625rem; /* matches padding on .page-block */ margin: 0; } header.page-header.no-image .entry-title { font-family: 'blue_highway_bold'; font-size: 44px; font-size: 2.75rem; color: #1a3281; text-align: left; text-transform: uppercase; margin: 0; } header.page-header.no-image .entry-title .title { font-size: 1em; color: #1a3281; margin: 0; padding: 0; } header.page-header.no-image .entry-title .subtitle { font-size: .9rem; line-height: 1.2; font-family: 'Clear Sans', Helvetica, Arial, sans-serif; margin: 0; padding: 0; } header.page-header.no-image .entry-title br { content: ' '; } header.page-header.no-image .entry-title br::after { content: ' '; } /* PAGE CONTENT */ .entry-content { margin: 0; padding: 10px; padding: 0.625rem; /* matches padding on .page-block */ position: relative; margin-top: -1px; text-align: left; background: #f7ecd5; } .entry-content::after { content: ''; display: block; clear: both; } .entry-content h1, .entry-content h2, .resources-container h2 { margin: 0; padding: 24px 0; padding: 1.5rem 0; font-family: 'blue_highway_bold'; font-size: 40px; font-size: 2.5rem; line-height: 1; color: #193282; text-transform: uppercase; } .resources-container h2 { text-align: center; } .entry-content h2.resourceSubhead { font-size: 30px; font-size: 1.875rem; color: #555555; clear: both; } .entry-content h3 { font-family: 'blue_highway_bold'; font-size: 24px; font-size: 1.5rem; line-height: 1; color: #193282; text-transform: uppercase; } .entry-content p, .news-events-list .content p, .archive-list .entry-summary p { font-size: 16px; font-size: 1rem; line-height: 24px; line-height: 1.5rem; color: #555555; margin-bottom: 32px; margin-bottom: 2rem; } .archive-link { margin: 0 0 1em; } .archive-link .bfblButtonLink { display: block; width: 75%; margin: 0 auto; } .not-found { color: #1a3281; font-style: italic; text-align: center; text-transform: uppercase; } #nav-below { overflow:hidden; clear: both; } .nav-previous { float: left; } .nav-next{ float: right; } .entry-content blockquote { clear: both; padding: 0 20px 0 40px; position: relative; overflow: hidden; border: 0; color: #008c5c; } .entry-content blockquote::before { display: block; position: absolute; font-family: "bfbl-quote"; content: '\e800'; font-size: 30px; width: 30px; height: 30px; color: #008c5c; top: 5px; left: 5px; } .entry-content blockquote p { margin: .5em 0; color: #008c5c; } .entry-content blockquote .alignleft, .entry-content blockquote .alignright { max-width: 125px !important; margin-bottom: .5em; margin-top: 0; display: none; } .entry-content ul, ul.green-bullets, .entry-content ol { padding-left: 46px; padding-left: 2.875rem; margin-bottom: 32px; margin-bottom: 2rem; } .entry-content ul, ul.green-bullets { list-style-type: none; } .entry-content ol { list-style-type: decimal; list-style-position: outside; } .entry-content li, ul.green-bullets li { color: #555555; margin-bottom: 8px; margin-bottom: 0.5rem; font-weight: normal; position: relative; padding-left: 13px; } .entry-content ul li::before, ul.green-bullets li::before { content: '\2022'; font-size: 25px; line-height: 18px; position: absolute; top: 3px; left: 0; width: 13px; height: 18px; display: block; color: #008c5c; } .entry-content .video { margin-left: auto; margin-right: auto; max-width: 550px; margin-bottom: 32px; margin-bottom: 2rem; } .entry-content .video .videoWrap { position: relative; padding-bottom: 56.25%; /* 16:9, for videos */ height: 0; } .entry-content .video .videoWrap iframe { position: absolute; top: 0; left: 0; width: 100%!important; /* override the inline height and width of the iframe */ height: 100%!important; } /* may be applied to images OR to wrapper divs around images */ .alignleft, .alignright, .aligncenter { display: block; margin-left: auto; margin-right: auto; max-width: 550px; width: auto !important; margin-bottom: 32px; margin-bottom: 2rem; } /* if there's an image *inside* any of the above: */ .alignleft img, .alignright img, .aligncenter img { max-width: 100%; height: auto; } /* if any of the above *are* an image */ img.alignleft, img.alignright, img.aligncenter { max-width: 100%; height: auto; } .aligncenter { text-align: center; } .aligncenter img, .aligncenter>a { display: inline-block; } .entry-content p.wp-caption-text { margin-bottom: 0; font-style: italic; font-size: 0.875rem; line-height: 1; } .entry-content .resourceImage { position: absolute; clip: rect(0,1px,1px,0); overflow: hidden; } .entry-content a, .page-block .content a { color: #1a3281; text-decoration: none; border-bottom: 1px solid #1a3281; } .entry-content a:hover, .page-block .content a:hover { color: #ffffff; background: #1a3281; } /* PAGE CONTENT - SPECIAL CASES */ body.page-template-page_why-buy-local .entry-content { padding: 0; } .entry-content.has-icon .entry-title::before { content: ''; display: inline-block; width: 40px; height: 40px; vertical-align: middle; margin-right: 16px; margin-right: 1rem; background-image: url('../images/bfbl_wbl_icons_sprite.png'); background-size: 40px; background-repeat: no-repeat; } .entry-content.has-icon.icon-leaf .entry-title::before { background-position: 0 0; } .entry-content.has-icon.icon-heart .entry-title::before { background-position: 0 -80px; } .entry-content.has-icon.icon-house .entry-title::before { background-position: 0 -160px; } .entry-content.has-icon.icon-hills .entry-title::before { background-position: 0 -240px; } .entry-content.has-icon.icon-pie .entry-title::before { background-position: 0 -320px; } body.page-template-page_about-parent .entry-content { text-align: center; background: #ffffff; padding-bottom: 180px; /* this value will change if the image ever changes! */ } body.page-template-page_about-parent .entry-content img { position: absolute; left: 50%; bottom: 40px; margin-left: -150px; /* this value will change if the image ever changes! */ width: 300px; height: auto; } .team-section { text-align: center; font-size: 16px; font-size: 1rem; line-height: 24px; line-height: 1.5rem; color: #555555; } .team-section .image {display: none;} .team-section .image img { width: 100%; height: auto; /* hidden on mobile */ position: absolute; clip: rect(0,1px,1px,0); overflow: hidden; } .team-section h2 { margin: 0; padding: 28px 0 0; padding: 1.75rem 0 0; font-family: 'blue_highway_bold'; font-size: 20px; font-size: 1.25rem; line-height: 1; color: #193282; text-transform: uppercase; } .team-section .project-leads, .team-section .advisory-board { padding: 10px; padding: 0.625rem; /* matches padding on .page-block */ } .team-section .project-leads { background: #ffffff; } .team-section .advisory-board { background: #f7ecd5; } .team-section ul { padding-bottom: 40px; padding-bottom: 2.5rem; } .team-section li { padding-top: 32px; padding-top: 2rem; } .team-section .name { font-weight: bold; } .team-section .position { font-style: italic; } .team-section .position, .team-section .organization { font-size: .9em; } /* PAGE BLOCKS */ .page-block { margin: 0; padding: 10px; padding: 0.625rem; position: relative; } .page-block .blockBG { display: none; /* normally hidden, shown only in special cases */ } .page-block .content { padding: 0 12px 14px; padding: 0 0.75rem 0.875rem; text-align: center; } .page-block .content { font-size: 16px; font-size: 1rem; line-height: 24px; line-height: 1.5rem; } body.home.page .page-block .content { font-size: 14px; font-size: 0.875rem; line-height: 18px; line-height: 1.125rem; } body.page-template-page_wbl-sub .page-block .content { text-align: left; } .main-content.archive-page .page-block .content { text-align: left; padding: 0 12px 14px; padding: 0 0.75rem 0.875rem; } .page-block.white { background: #ffffff; } .page-block.white .content { color: #555555; } .page-block.white .content h2 { color: #1a3281; } .page-block.tan-shadow { box-shadow: 0 0 80px rgba(230, 168, 101, .6) inset; background: #f7ecd5 url('../images/bg/bg_tan_noise.png') center center repeat; } .page-block.tan-shadow .content { color: #1a3281; } .page-block.tan-shadow .content p { color: #555555; } /* special case: */ body.page-template-page_why-buy-local .page-block.tan-shadow .content { color: #555555; } .page-block.green { background: #008c5c; } .page-block.green .content { border: 1px solid #8cc63f; color: #ffffff; } .page-block.green .content a { color: #fff; text-decoration: underline; border-bottom: none; } .page-block.green .content a:hover { color: #fff; background-color: transparent; } .main-content.archive-page .page-block .content a { text-decoration: none; border-bottom: 0; } .main-content.archive-page .page-block .content a::hover{ background-color: transparent; } .page-block.light-green { background-color:#8cc63f; } .page-block.light-green .content { color: #1a3281; } .page-block.light-green .content a { color: #1a3281; text-decoration: underline; border-bottom: none; } .page-block.light-green .content a:hover { color: #1a3281; background-color: transparent; } .page-block h2, .partner-profile .page-block h1, .partner-profile .page-block h2, .partner-profile .page-block h3 { text-transform: uppercase; font-size: 20px; font-size: 1.25rem; font-family: 'blue_highway_bold'; line-height: 1; text-align: center; margin: 0 0 20px; margin: 0 0 1.25rem; } .page-block.green h2 { height: 64px; height: 4rem; line-height: 64px; line-height: 4rem; margin-bottom: 20px; margin-bottom: 1.25rem; } .page-block.green h2::after { content: ''; display: block; border-top: 1px solid #8cc63f; width: 86%; margin: 0 auto; } .page-block.light-green h2 { color: #1a3281; font-size: 40px; font-size: 2.5rem; text-align: center; } .page-block p { margin-bottom: 20px; margin-bottom: 1.25rem; } .page-block.full-width-badge { } .page-block.full-width-badge .badge-icon a img{ /* hide this, because we're using background image */ position: absolute; clip: rect(0 1px 1px 0); overflow: hidden; } .page-block.image-split { } .page-block.image-split .content { padding-top: 164px; padding-top: 10.25rem; padding-bottom: 30px; padding-bottom: 1.875rem; } .page-block.image-split.tan-shadow .content { border: 1px solid #fcaf17; color: #fcaf17; } .page-block.image-split h2 { margin-bottom: 0; font-family: 'blue_highway_regular'; } .page-block.image-split .image { position: absolute; top: 30px; top: 1.875rem; left: 50%; width: 144px; width: 9rem; margin-left: -72px; margin-left: -4.5rem; height: 128px; height: 8rem; background-repeat: no-repeat; background-position: center center; background-size: contain; } .page-block.image-split .image img { display: none; } .page-block.image-left, .page-block.image-right, .page-block.video { } .page-block.image-left .image, .page-block.image-right .image, .page-block.video .video { text-align: center; padding-top: 4px; padding-top: 0.25rem; } .page-block.image-left .image a, .page-block.image-right .image a { display: inline-block; } .page-block.image-left .image img, .page-block.image-right .image img { max-width: 70%; height: auto; } .page-block.image-left h2, .page-block.image-right h2, .page-block.video h2 { margin-top: 16px; margin-top: 1rem; } .page-block.video .video { margin-left: auto; margin-right: auto; max-width: 550px; } .page-block.video .video .videoWrap { position: relative; padding-bottom: 56.25%; /* 16:9, for videos */ height: 0; } .page-block.video .video .videoWrap iframe { position: absolute; top: 0; left: 0; width: 100%!important; /* override the inline height and width of the iframe */ height: 100%!important; } .blockArrow { display: none; /* these are shown only on certain pages, and only on mobile */ } body.page-template-page_about-parent .blockArrow, body.page-template-page_why-buy-local .blockArrow { display: block; } /* hide the page-block elements on those pages */ body.page-template-page_about-parent .page-block, body.page-template-page_why-buy-local .page-block { position: absolute; clip: rect(0,1px,1px,0); overflow: hidden; } .blockArrow a { position: relative; display: block; padding: 0 10px; padding: 0 0.625rem; height: 75px; height: 4.6875rem; line-height: 75px; line-height: 4.6875rem; text-transform: uppercase; text-decoration: none; font-family: 'blue_highway_bold'; font-size: 20px; font-size: 1.25rem; color: #555555; background: #f7ecd5; } .blockArrow.odd a { color: #ffffff; background: #008c5c; } .blockArrow:hover a { color: #ffffff; background: #003f29; } .blockArrow a::after { font-family: 'fontello'; content: '\e80b'; font-size: 24px; font-size: 1.5rem; position: absolute; top: 0; bottom: 0; right: 10px; right: 0.625rem; } .blockArrow.has-icon a::before { content: ''; display: inline-block; width: 32px; height: 32px; vertical-align: middle; margin-left: 1.5625%; margin-right: 3.125%; background-image: url('../images/bfbl_wbl_icons_sprite.png'); background-size: 32px; background-repeat: no-repeat; } .blockArrow.has-icon.icon-leaf a::before { background-position: 0 0; } .blockArrow.has-icon.icon-leaf.odd a::before { background-position: 0 -32px; } .blockArrow.has-icon.icon-leaf:hover a::before { background-position: 0 -32px; } .blockArrow.has-icon.icon-heart a::before { background-position: 0 -64px; } .blockArrow.has-icon.icon-heart.odd a::before { background-position: 0 -96px; } .blockArrow.has-icon.icon-heart:hover a::before { background-position: 0 -96px; } .blockArrow.has-icon.icon-house a::before { background-position: 0 -128px; } .blockArrow.has-icon.icon-house.odd a::before { background-position: 0 -160px; } .blockArrow.has-icon.icon-house:hover a::before { background-position: 0 -160px; } .blockArrow.has-icon.icon-hills a::before { background-position: 0 -192px; } .blockArrow.has-icon.icon-hills.odd a::before { background-position: 0 -224px; } .blockArrow.has-icon.icon-hills:hover a::before { background-position: 0 -224px; } .blockArrow.has-icon.icon-pie a::before { background-position: 0 -156px; } .blockArrow.has-icon.icon-pie.odd a::before { background-position: 0 -288px; } .blockArrow.has-icon.icon-pie:hover a::before { background-position: 0 -288px; } .parentArrow, .greenHeader { position: relative; display: block; margin-top: -1px; margin-bottom: 0; padding: 0 10px; padding: 0 0.625rem; height: 75px; height: 4.6875rem; line-height: 75px; line-height: 4.6875rem; text-transform: uppercase; text-decoration: none!important; font-family: 'blue_highway_bold'; font-size: 20px; font-size: 1.25rem; color: #ffffff!important; background: #008c5c; } .greenHeader.centered { text-align: center; } .parentArrow::before, .bfblSlider .greenHeader::before, label.greenHeader::before, a.greenHeader::before { font-family: 'fontello'; content: ''; display: inline-block; vertical-align: middle; font-size: 40px; font-size: 2.5rem; width: 36px; width: 2.25rem; margin-right: 3.4%; text-align: center; } .parentArrow::before { content: '\e80d'; } .parentArrow::before { content: '\e80d'; } .bfblSlider.sliderOpen .greenHeader::before, .bfblSlider.sliderClosed .greenHeader::before, a.greenHeader::before { content: '\e80e'; transition: transform 0.1s ease-in-out; } .bfblSlider.sliderOpen .greenHeader::before { transform: rotate(90deg); } .parentArrow:hover, .bfblSlider .greenHeader:hover, label.greenHeader:hover { background: #003f29; cursor: pointer; } .greenHeader { margin-top: 0; } .bfblSlider { border-style: solid; border-color: #ffffff; border-width: 0; } .bfblSlider .bfblSlideWrap { -webkit-transition: max-height 0.25s ease-in-out; -moz-transition: max-height 0.25s ease-in-out; -o-transition: max-height 0.25s ease-in-out; transition: max-height 0.25s ease-in-out; } .bfblSlider.sliderClosed { border-bottom-width: 1px; } /* PAGE CHIPS */ .chips-block { } .chips-block ul { text-align: center; margin-left: -14px; margin-left: -0.875rem; margin-right: -14px; margin-right: -0.875rem; position: relative; } .chips-block ul::before, .chips-block ul::after { content: ''; display: block; position: absolute; top: 16px; top: 1rem; bottom: 0; width: 1px; background: #e69b2a; } .chips-block ul::before { left: 33.33%; } .chips-block ul::after { right: 33.33%; } .chip { display: block; padding: 0 14px; padding: 0 0.875rem; position: relative; text-align: center; } li.chip { display: inline-block; vertical-align: bottom; width: 33.33%; } .chip a.chipLink { display: block; text-decoration: none; } .chip .chipTitle { display: block; position: relative; font-family: 'blue_highway_bold'; font-size: 30px; font-size: 1.875rem; line-height: 1; color: #e69b2a; text-transform: uppercase; letter-spacing: .05em; padding-top: 12px; padding-top: 0.75rem; } .chip a.chipLink:hover .chipTitle { color: #1a3281; } .chip .chipTitle::after { content: ''; display: block; width: 80%; margin: 22px auto 0; margin: 1.375rem auto 0; height: 1px; background: #e69b2a; } .chip .chipDescr { display: block; font-size: 14px; font-size: 0.875rem; line-height: 1; color: #999999; padding-top: 16px; padding-top: 1rem; width: 80%; margin-left: auto; margin-right: auto; } .chip .chipImg { display: block; height: 150px; height: 9.375rem; background-position: center center; background-repeat: no-repeat; background-size: contain; } .chip .chipImg img { position: absolute; clip: rect(0,1px,1px,0); overflow: hidden; } .chip .chipBtnWrap { display: block; margin-top: 40px; margin-top: 2.5rem; } /* ANIMATED HEADER */ .animated-header { overflow: hidden; font-family: 'Clear Sans', Helvetica, Arial, sans-serif; font-size: 18px; font-size: 1.125rem; line-height: 20px; line-height: 1.25rem; font-weight: normal; } .animated-header .animated-blocks { display: block; width: auto; height: auto; padding: 0; margin: 0; overflow: hidden; text-align: center; } /* NOTE: most of the hover/active styles are added in the tablet media query */ .animated-header .animated-blocks li { display: none; /* hidden on mobile */ position: relative; height: 418px; height: 26.125rem; background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; /*transition: width 0.1s ease-in-out;*/ transition: width 0.25s ease-in-out; } .animated-header .animated-blocks li a { position: absolute; display: block; top: 0; bottom: 0; left: 0; right: 0; z-index: 5; color: #fff; text-transform: uppercase; text-decoration: none; transition: all 0.25s ease-in-out; } .animated-header .animated-blocks li a::before { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 1; content: ''; /*background: url('../images/header/animated_header_yellow.png'); background: rgba(252, 175, 23, 0.29); transition: background 0.1s ease-in-out; transition: background 0.25s ease-in-out;*/ } .animated-header .animated-blocks li a::after { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 2; content: ''; background-image: url('../images/header/animated_header_gradient.png'); background-position: 50% bottom; background-repeat: repeat-x; } .animated-header .animated-blocks li a .content, .animated-header .animated-blocks li a .map-content { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 3; } .animated-header .animated-blocks li a .content h3, .animated-header .animated-blocks li a .map-content .subtext { font-size: 18px; font-size: 1.125rem; line-height: 20px; line-height: 1.25rem; font-weight: normal; position: absolute; top: auto; bottom: 0; left: 0; right: 0; text-align: center; margin: 0; padding: 20px 0 53px; padding: 1.25rem 0 3.3125rem; font-family: 'Clear Sans', Helvetica, Arial, sans-serif; } .animated-header .animated-blocks li a .content h3::before, .animated-header .animated-blocks li a .map-content .subtext::before { display: block; width: 77px; height: 1px; margin: 0 auto; padding: 0; background-color: #ffffff; content: ''; position: absolute; top: 0; bottom: auto; left: 0; right: 0; background: url('../images/header/animated_header_line.png') 50% 50% no-repeat; } .animated-header .animated-blocks li a .content .subtext { position: absolute; top: auto; bottom: -100px; left: 0; right: 0; /* transition: bottom 0.15s ease-in-out, opacity 0.25s ease-in-out; */ transition: bottom 0.25s ease-in-out, opacity 0.125s ease-in-out; opacity: 0; } .animated-header .animated-blocks li a .content .subtext p { max-width: 200px; max-width: 12.5rem; margin: 0 auto; } .animated-header .animated-blocks li.map-link { display: block; font-family: 'blue_highway_bold'; } .animated-header .animated-blocks li.map-link .map-content .inner { width: 180px; text-align: left; margin: 70px auto 0; margin: 4.375 auto 0; } .csstransforms .animated-header .animated-blocks li.map-link .map-content .inner { margin: 0; position: absolute; bottom: 115px; left: 50%; transform: translateX(-50%); } .animated-header .animated-blocks li.map-link .map-content .inner .badge-icon { /* tomato */ margin: 0 0 5px 14px; margin: 0 0 0.3125rem 0.875rem; width: 80px; width: 5rem; height: auto; } .animated-header .animated-blocks li.map-link .map-content .inner .badge-icon img { width: 100%; height: auto; } .animated-header .animated-blocks li.map-link .map-content .inner h3 { font-family: 'blue_highway_bold'; color: #ffffff; font-size: 50px; font-size: 3.125rem; line-height: 40px; line-height: 2.5rem; margin: 0; text-shadow: 0 0 15px #000000; } .animated-header .animated-blocks li.map-link .map-content .inner h3 small { font-size: 18px; font-size: 1.125rem; line-height: 15px; line-height: 0.9375rem; display: block; color: #ffffff; } .animated-header .animated-blocks li a .map-content .subtext::after { font-family: 'fontello'; content: '\e805'; display: inline-block; padding-left: 12px; padding-left: 0.75rem; } /* SPONSOR BLOCK */ .sponsors-list { /* make sure this 'page block' never gets get hidden on mobile */ position: relative!important; clip: auto!important; } .sponsors-list * { outline: 0; } .sponsors-list.page-block h2 { color: #1a3281; border-bottom: 0; text-align: center; } .sponsors-list ul { max-width: 1170px; margin-left: auto; margin-right: auto; overflow: hidden; font-size: 0; text-align: center; } .sponsors-list .sponsor { display: inline-block; font-size: 0; width: 50%; height: 0; padding: 50% 0 0; position: relative; } .sponsors-list .sponsor .sponsor-image-wrapper { position: absolute; top: 15px; bottom: 15px; left: 15px; right: 15px; border: 1px solid #eee; } .sponsors-list .sponsor .sponsor-image { position: absolute; top: 15px; bottom: 15px; left: 15px; right: 15px; background-position: 50% 50%; background-repeat: no-repeat; background-size: contain; display: block; font-size: 1rem; } /* SPECIFIC PAGES */ .wbl-subtitle, .mission-statement { text-align: center; padding: 0; box-shadow: 0 0 80px rgba(230, 168, 101, .6) inset; background: #f7ecd5 url('../images/bg/bg_tan_noise.png') center center repeat; position: relative; margin-top: -1px; } .wbl-subtitle { height: 168px; height: 10.5rem; line-height: 168px; line-height: 10.5rem; box-shadow: none; } .mission-statement { height: 262px; height: 16.375rem; line-height: 262px; line-height: 16.375rem; } .wbl-subtitle::before, .mission-statement::before { content: ''; display: block; position: absolute; top: 10px; top: 0.625rem; right: 10px; right: 0.625rem; bottom: 10px; bottom: 0.625rem; left: 10px; left: 0.625rem; box-sizing: border-box; border: 1px solid #fcaf17; } .wbl-subtitle .content, .mission-statement .content { width: 80%; display: inline-block; vertical-align: middle; color: #1a3281; position: relative; } .wbl-subtitle .content { padding: 0 60px; padding: 0 3.75rem; max-width: 280px; max-width: 17.5rem; } .mission-statement .content { max-width: 280px; max-width: 17.5rem; } .wbl-subtitle .content::before, .wbl-subtitle .content::after, .mission-statement .content::before, .mission-statement .content::after { content: ''; display: block; position: absolute; top: 50%; background-repeat: no-repeat; } .wbl-subtitle .content::before, .wbl-subtitle .content::after { height: 40px; width: 36px; margin-top: -20px; margin-top: -1.25rem; background-image: url('../images/bfbl_honey.png'); background-size: 36px; } .mission-statement .content::before, .mission-statement .content::after { top: 0; height: 50px; height: 3.125rem; width: 60px; width: 3.75rem; background-image: url('../images/bfbl_peaches.png'); background-size: 60px; } .wbl-subtitle .content::before, .mission-statement .content::before { background-position: top left; } .wbl-subtitle .content::after, .mission-statement .content::after { background-position: bottom left; } .wbl-subtitle .content::before, .mission-statement .content::before { left: 0; } .wbl-subtitle .content::after, .mission-statement .content::after { right: 0; } .wbl-subtitle .content h2, .mission-statement .content h2 { margin: 0; font-family: 'blue_highway_bold'; font-size: 20px; font-size: 1.25rem; line-height: 1; text-transform: uppercase; color: inherit; } .mission-statement .content h2 { padding: 0 60px; padding: 0 3.75rem; line-height: 64px; line-height: 4rem; } .mission-statement .content p { padding: 0 20px; padding: 0 1.25rem; font-size: 16px; font-size: 1rem; line-height: 20px; line-height: 1.25rem; position: relative; z-index: 2; } /* NEWS AND EVENTS */ .news-events-list { margin: 0; padding: 10px; padding: 0.625rem; /* matches padding on .page-block */ background: #f7ecd5; position: relative; } .news-events-list .news-list, .news-events-list .events-list { padding: 0 10px; padding: 0 0.625rem; } .news-events-list .news-list::before, .news-events-list .events-list::before { content: ''; display: block; height: 72px; height: 4.5rem; line-height: 72px; line-height: 4.5rem; border: 1px solid #fcaf17; margin-bottom: 20px; margin-bottom: 1.25rem; text-align: center; color: #193282; font-family: 'blue_highway_bold'; font-size: 20px; font-size: 1.25rem; text-transform: uppercase; margin-right: -10px; margin-left: -10px; } .news-events-list .news-list::before { content: 'News'; } .news-events-list .events-list::before { content: 'Events'; } .news-events-list article { margin-bottom: 40px; margin-bottom: 2.5rem; } .news-events-list .entry-header h2, .archive-list h2.entry-title { display: block; margin: 0 0 6px; margin: 0 0 0.375rem; color: #555555; font-family: 'blue_highway_bold'; text-transform: uppercase; font-size: 20px; font-size: 1.25rem; line-height: 1; } .news-events-list .entry-header h2 a, .archive-list h2.entry-title a { color: inherit; text-decoration: none; } .news-events-list .entry-header h2 a:hover, .archive-list h2.entry-title a:hover { color: #1a3281; } .news-events-list .post-meta, .archive-list .entry-meta, .archive-list .entry-footer, body.single-news .entry-content .post-meta, body.single-events .entry-content .post-meta { font-size: 14px; font-size: 0.875rem; line-height: 1; color: #555555; text-transform: uppercase; font-weight: bold; margin-bottom: 2px; margin-bottom: .125rem; } .news-events-list .events-summary h2, .news-events-list .events-summary .post-meta { text-align: center; } .news-events-list .content p { margin-bottom: 0; } .news-events-list .excerpt p { margin-bottom: 18px; margin-bottom: 1.125rem; } .news-events-list a.read-more, .archive-list a.read-more { color: #555555; font-weight: bold; text-decoration: none; text-transform: uppercase; } .news-events-list a.read-more::after, .archive-list a.read-more::after { font-family: 'fontello'; content: '\e805'; display: inline-block; font-size: 18px; font-size: 1.125rem; padding-left: 8px; padding-left: .5rem; } .news-events-list a.read-more:hover, .archive-list a.read-more:hover { color: #1a3281; } .news-events-list .image { margin-bottom: 32px; margin-bottom: 2rem; margin-left: auto; margin-right: auto; } .news-events-list .image img { width: 100%; height: auto; } .news-events-list .news-summary .image { max-width: 400px; max-width: 25rem; } .news-events-list .events-summary .image { max-width: 160px; } body.single-news .entry-content h1.entry-title, body.single-events .entry-content h1.entry-title { padding-bottom: 0; } body.single-news .entry-content .post-meta, body.single-events .entry-content .post-meta { padding-top: 0; padding-bottom: 32px; padding-bottom: 2rem; } /* RESOURCES */ .resources-container { padding: 0 30px 30px; position: relative; } .resource-link, .resource-link:hover { text-decoration: none; } .resources-list .resource-link article { display: block; background-color: #f7ecd5; position: relative; padding: 10px; overflow: hidden; color: #1a3281; } .resources-list .resource-link:nth-of-type(odd) article { background-color: #008c5c; color: #fff; } .resources-list .resource-link article::after { content:'\e80b'; font-family:'fontello'; font-size: 1.5rem; position: absolute; top: 50%; right: 10px; transform: translateY(-50%); } .resource-link .image { margin: 0; padding: 0; display: block; width: 70px; float: left; } .resource-link .image img { display: block; width: 100%; height: auto; padding: 0; margin: 0; } .resource-link .details { margin: 0 30px 0 0; text-align: left; } .resource-link .image ~ .details { margin: 0 30px 0 80px; } .resource-link h3 { color: #1a3281; font-size: 18px; line-height: 1.3; text-decoration: none; margin: 0; display: inline-block; text-align: left; } .resource-link:hover h3 { text-decoration: none; border-bottom: 0; } .resource-link:nth-of-type(odd) h3 { color: #fff; } .resourceDownload { display: block; width: 100%; max-width: 400px; line-height: 1; text-align: left; vertical-align: middle; margin-bottom: 32px; margin-bottom: 2rem; height: auto; padding: 16px 12px 16px 82px; padding: 1rem 0.75rem 1rem 5.125rem; position: relative; } .resourceDownload.btnBlue { background: #ffffff!important; } .resourceDownload::before { font-family: 'fontello'; content: '\e80f'; display: block; position: absolute; top: 0; bottom: 0; left: 0; width: 70px; width: 4.375rem; line-height: 70px; line-height: 4.375rem; text-align: center; font-size: 50px; font-size: 3.125rem; color: #ffffff; background: #1a3281; border-right: 1px solid #ffffff; } .resourceDownload .filename { font-size: 20px; font-size: 1.25rem; display: block; text-transform: none; } .resourceDownload .filesize { font-size: 16px; font-size: 1rem; display: block; } /* OTHER ARCHIVE-TYPE PAGES */ /* other archive-type page styles are with news/events */ .archive-header { text-align: center; padding: 10px; padding: 0.625rem; background: #f7ecd5; position: relative; margin-top: -1px; } .archive-header::before { content: ''; display: block; position: absolute; top: 10px; top: 0.625rem; right: 10px; right: 0.625rem; bottom: 10px; bottom: 0.625rem; left: 10px; left: 0.625rem; box-sizing: border-box; border: 1px solid #fcaf17; } .archive-header h1 { margin: 0; color: #193282; font-family: 'blue_highway_bold'; font-size: 20px; font-size: 1.25rem; text-transform: uppercase; padding: 26px 16px; padding: 1.625rem 1rem; } .archive-header h1 small { color: inherit; font-family: 'Clear Sans'; font-size: 16px; font-size: 1rem; text-transform: none; display: block; margin-bottom: 8px; margin-bottom: 0.5rem; } .archive-list { margin: 0; padding: 10px; padding: 0.625rem; padding-top: 60px; padding-top: 3.75rem; background: #f7ecd5; } .archive-list article { margin-bottom: 60px; margin-bottom: 3.75rem; } .archive-list .entry-meta a { color: inherit; text-decoration: none; } .archive-list .entry-meta a:hover { color: #1a3281; } .archive-list .entry-summary p { margin-bottom: 1rem; } /* PARTNERS */ .partner-profile .page-block { background: #f7ecd5; } .partner-profile .entry-content { padding: 0!important; } .acf-map-wrap { background: #f7ecd5; padding: 0; } .acf-map { width: auto; /* height: 486px; height: 30.375rem; */ height: 240px; height: 15rem; } .acf-map img { max-width: inherit !important; } .partner-profile .parentArrow { margin-top: 0; border-bottom: 1px solid #ffffff; } .partner-profile .product-categories-list { background: #ffffff; } .product-categories-list li { padding-top: 12px; padding-top: 0.75rem; padding-left: 10px; display: inline-block; } .product-categories-list li:first-child { padding-top: 0; } .product-categories-list li span { display: inline-block; font-size: 14px; font-size: 0.875rem; line-height: 1; padding: 10px 12px; padding: 0.625rem 0.75rem; background: #008c5c; color: #ffffff; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .partner-profile .page-block h1, .partner-profile .page-block h2, .partner-profile .page-block h3 { color: #555555; } .partner-profile .page-block h1, .partner-profile .page-block h3.owner-name, .partner-profile .page-block h3.partner-name { padding-top: 16px; padding-top: 1rem; font-size: 26px; font-size: 1.625rem; } .partner-profile .page-block h4, .map-subhead { font-family: 'blue_highway_bold'; text-transform: uppercase; color: #008c5c; margin: 0; padding-bottom: 6px; padding-bottom: 0.375rem; font-weight: normal; } .partner-profile .page-block h4.farmTypeString { margin-top: 3em; } .partner-profile .page-block h5 { color: #555555; font-weight: bold; font-size: 16px; font-size: 1rem; margin: 0; padding-bottom: 6px; padding-bottom: 0.375rem; } .partner-detail { color: #72706b; text-align: center; font-size: 14px; font-size: 0.875rem; line-height: 20px; line-height: 1.25rem; margin-bottom: 28px; margin-bottom: 1.75rem; font-weight: bold; } .market-vendor-list { text-align: center; font-size: 14px; font-size: 0.875rem; line-height: 20px; line-height: 1.25rem; margin-bottom: 28px; margin-bottom: 1.75rem; color: #72706b; } .partner-detail p { margin-bottom: .5em; } .partner-detail .hours-list li { margin-bottom: .5em; font-weight: normal; } .partner-contact { margin-top: 40px; margin-top: 2.5rem; } .partner-contact li { text-align: center; padding-bottom: 36px; padding-bottom: 2.25rem; } .partner-contact li a { display: block; color: #72706b; font-weight: bold; font-size: 14px; font-size: 0.875rem; line-height: 1; text-decoration: none; padding-top: 50px; padding-top: 3.125rem; position: relative; } .partner-contact li a:hover { color: #1a3281; } .partner-contact li a::before, .partner-contact li a::after { content: ''; display: block; width: 36px; width: 2.25rem; height: 36px; height: 2.25rem; line-height: 36px; line-height: 2.25rem; position: absolute; top: 0; left: 50%; margin-left: -18px; margin-left: -1.125rem; } .partner-contact li a::before { background: #72706b; -webkit-border-radius: 20px; -webkit-border-radius: 1.25rem; -moz-border-radius: 20px; -moz-border-radius: 1.25rem; border-radius: 20px; border-radius: 1.25rem; } .partner-contact li a:hover::before { background: #1a3281; } .partner-contact li a::after { font-family: 'fontello'; font-weight: normal; color: #f7ecd5; font-size:24px; font-size: 1.5rem; } .partner-contact li.partner-phone a::after { content: '\e813'; margin-top: 1px; } .partner-contact li.partner-email a::after { content: '\e810'; font-size: 18px; font-size: 1.125rem; } .partner-contact li.partner-website a::after { content: '\e815'; } .owner-image, .business-image, .agritourism-photo { width: 84%; max-width: 360px; max-width: 22.5rem; margin: 0 auto; margin-bottom: 10px; margin-top: 0.625rem; } .business-image { margin-top: 10px; margin-top: 0.625rem; } .owner-image img, .business-image img, .agritourism-photo img { border: 3px solid #ffffff; } .products-detail { margin-top: 48px; margin-top: 3rem; } .product-group { display: block; margin: 0 0 1em; } .product-group h4, .product-group p { display: inline; margin: 0; padding: 0; line-height: 20px; } .product-group h4::after { content: ': '; } .product-group p { font-size: 14px; } .partner-social { text-align: center; overflow: hidden; margin: 0 auto; } .partner-social ul { display: inline-block; text-align: left; overflow: hidden; } .partner-social li { display: block; /* display:block inside display:inline-block makes the parent shrink its width to match that of the widest 'grand-child' (the , in this case) */ float: left; margin: 0 10px 0 0; } .partner-social li a { font-family: 'fontello'; display: block; width: 42px; height: 42px; font-size: 22px; line-height: 42px; text-align: center; vertical-align: middle; background-color: #008c5c; color: #fff; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; border:1px solid #008c5c; box-sizing: border-box; text-decoration: none; } .partner-social li a span { text-indent: -9999em; height: 0; width: 0; overflow: hidden; display: block; visibility: hidden; } .partner-social li a:hover { background-color: transparent; color: #008c5c; } .partner-social li.twitter a::before { content: '\e802'; } .partner-social li.facebook a::before { content: '\e804'; } .partner-social li.instagram a::before { content: '\e803'; } /*.partner-social li a::after { content: ''; display: block; position: absolute; top: 0; right: -9999999px; bottom: 0; left: -9999999px; background: #008c5c; z-index: 1; }*/ /*.partner-social li a:hover::after { background: #003f29; }*/ .product-info-contents .entry-product-categories, .product-info-contents .entry-product-wheretobuy, .product-info-contents .entry-product-hours { margin-bottom: 40px; margin-bottom: 2.5rem; } .farming-practices-list, .vendor-list { display: block; overflow: hidden; color: #72706b; font-size: 14px; line-height: 20px; } .vendor-list { margin-bottom: 1em; } .practices-wrap, .agritourism-event { margin-bottom: 1em; text-align: center; color: #72706b; font-size: 14px; line-height: 20px; } .row > .practices-wrap:nth-of-type(3n+1) { clear: left; } .row > .agritourism-event.col-sm-4:nth-of-type(3n+1) { clear: left; } .row > .agritourism-event.col-sm-6:nth-of-type(2n+1) { clear: left; } .practices-wrap p, .practices-wrap h5, .practices-wrap h4 { margin: 0; padding-bottom: 6px; padding-bottom: 0.375rem; } .agritourism-event p, .agritourism-event h4, .agritourism-event h5, .agritourism-event ul { margin: 0; padding-bottom: 0; } .agritourism-event p, .agritourism-event ul { font-size: 14px; font-size: 0.875rem; line-height: 20px; color: #72706b; } .agritourism-event .description { font-style: italic; } /* FIND LOCAL FOOD - MAP PAGE */ .map-subhead { /* picks up some styles from the partner pages */ font-size: 16px!important; font-size: 1rem!important; line-height: 18px; line-height: 1.125rem; margin: 0; padding: 0; display: block; } .map-checkboxes label { display: block; font-weight: normal; max-width: 360px; margin: 0 auto; cursor: pointer; } .map-checkboxes label input { display: none; } .map-checkboxes label span { display: block; color: #555555; font-size: 14px; font-size: 0.875rem; line-height: 1; padding-left: 34px; padding-top: 14px; padding-top: 0.875rem; padding-bottom: 14px; padding-bottom: 0.875rem; position: relative; } .map-checkboxes label span::before { content: ''; display: block; position: absolute; top: 50%; left: 0; width: 20px; /* cq, not rems */ height: 20px; margin-top: -11px; background-image: url('../images/bfbl_sprite_checkbox.png'); background-repeat: no-repeat; background-size: 20px 95px; background-position: 0 0; } .map-checkboxes label input[type=checkbox]:checked + span::before { background-position: 0 -25px; } .map-county-zip { } .map-county-zip .county-select-wrap, .map-county-zip>span, .map-county-zip .zip-input-group { display: block; width: 170px; width: 10.625rem; margin-left: auto; margin-right: auto; } .map-county-zip>span { margin-top: 6px; margin-top: 0.375rem; margin-bottom: 6px; margin-bottom: 0.375rem; line-height: 34px; line-height: 2.125rem; font-size: 14px; font-size: 0.875rem; text-align: center; color: #999999; text-transform: uppercase; } .zip-input-group { position: relative; border: 1px solid #999999; padding: 6px 50px 6px 12px; padding: 0.375rem 3.125rem 0.375rem 0.75rem; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; margin-bottom: 12px; margin-bottom: 0.75rem; } .zip-input-group .zip-input { font-size: 14px; font-size: 0.875rem; color: #555555; padding: 0; width: 106px; width: 6.625rem; } .zip-input-group .zip-input::-webkit-input-placeholder { color: #999999 !important; } .zip-input-group .zip-input:-moz-placeholder { /* Firefox 18- */ color: #999999 !important; } .zip-input-group .zip-input::-moz-placeholder { /* Firefox 19+ */ color: #999999 !important; } .zip-input-group .zip-input:-ms-input-placeholder { color: #999999 !important; } .zip-input-group .zip-btn { position: absolute; top: 0; right: 0; bottom: 0; width: 38px; width: 2.375rem; border-left: 1px solid #999999; } .zip-input-group .zip-btn::after { font-family: 'fontello'; content: '\e806'; color: #999999; display: block; position: absolute; top: 50%; right: 0; left: 0; text-align: center; margin-top: -11px; margin-top: -0.6875rem; height: 22px; height: 1.375rem; font-size: 18px; font-size: 1.125rem; line-height: 22px; line-height: 1.375rem; } .county-select-wrap { margin-top: 12px; margin-top: 0.75rem; } .county-select-wrap .chosen-container { width: 100%!important; font-size: 14px; font-size: 0.875rem; } .county-select-wrap .chosen-container-single .chosen-single { border: 0; background: #008c5c; box-shadow: none; border-radius: 3px; height: 34px; height: 2.125rem; line-height: 34px; line-height: 2.125rem; color: #ffffff; padding-left: 14px; padding-left: 0.875rem; } .county-select-wrap .chosen-container-single .chosen-default { color: #ffffff; } .county-select-wrap .chosen-container-active .chosen-single { color: #ffffff; } .county-select-wrap .chosen-container-active.chosen-with-drop .chosen-single { color: #ffffff; } /* for the drop-down arrow */ .county-select-wrap .chosen-single div { bottom: 0; width: 30px; width: 1.875rem; border-left: 1px solid #007c51!important; } .county-select-wrap .chosen-single div::before { content: ''; display: block; position: absolute; top: 50%; right: 50%; margin-top: -2px; margin-top: -0.125rem; margin-right: -4px; margin-right: -0.25rem; /* triangle base: border-left-width + border-right-width */ /* triangle height: border-top-width */ border-top-width: 4px; border-top-width: 0.25rem; border-top-style: solid; border-top-color: #ffffff; border-right-width: 4px; border-right-width: 0.25rem; border-right-style: solid; border-right-color: transparent; border-left-width: 4px; border-left-width: 0.25rem; border-left-style: solid; border-left-color: transparent; border-bottom-width: 0; border-bottom-style: solid; border-bottom-color: #ffffff; } .county-select-wrap .chosen-single abbr { background: none; top: 11px; right: 34px; width: 13px; height: 10px; color: #fff; } .county-select-wrap .chosen-single abbr::before { content: 'x'; position: absolute; top: 0; bottom: 0; left: 0; right: 0; font-size: 13px; line-height: 10px; font-weight: normal; display: block; font-family: Verdana; text-align: center; } .county-select-wrap .chosen-single abbr:hover { color: #ddd; } /* active state */ .county-select-wrap .chosen-container-active.chosen-with-drop .chosen-single div::before { border-bottom-width: 4px; border-bottom-width: 0.25rem; border-top-width: 0; margin-top: -3px; margin-top: -0.1875rem; } .county-select-wrap .chosen-container-single .chosen-single div b { display: none; } .county-select-wrap .chosen-container .chosen-drop { border: 1px solid #999999; border-top-color: #ffffff; border-radius: 0; } .county-select-wrap .chosen-container .chosen-results { margin:0; padding: 0; } .county-select-wrap .chosen-container .chosen-results li { padding: 12px 14px; padding: 0.75rem 0.875rem; border-top: 1px solid #e5e5e5; } .county-select-wrap .chosen-container .chosen-results li:first-child { border-top: 0; } .county-select-wrap .chosen-container .chosen-results li.active-result { color: #555555; } .county-select-wrap .chosen-container-multi .chosen-drop .result-selected { color: #999999; } .county-select-wrap .chosen-container .chosen-results li.highlighted { color: #ffffff; background: #008b5c; } .map-specific-prods .map-subhead { margin-bottom: 16px; margin-bottom: 1rem; } .map-specific-prods label { /* this is a *parent* element for the whole .chosen dropdown */ display: block; font-weight: normal; max-width: 540px; max-width: 33.75rem; } .map-specific-prods .chosen-container { width: 100%!important; font-size: 14px; font-size: 0.875rem; } .map-specific-prods .chosen-container-multi .chosen-choices { border: 1px solid #999999; box-shadow: none; background: #ffffff; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; padding: 8px 18px; padding: 0.5rem 1.125rem; } .map-specific-prods .chosen-container-multi .chosen-choices li.search-field { margin: 6px 0; margin: 0.375rem 0; padding: 4px 0; } .map-specific-prods .chosen-container-multi .chosen-choices li.search-field input[type="text"] { color: #999999; /* PLACEHOLDER COLOR */ font-family: 'Clear Sans'; font-size: 14px; font-size: 0.875rem; margin: 0; height: 26px; height: 1.625rem; } .map-specific-prods .chosen-container-active .chosen-choices li.search-field input[type="text"] { color: #555555!important; /* INPUT COLOR */ } .map-specific-prods .chosen-container .chosen-drop { width: 94%; border: 1px solid #999999; } .map-specific-prods .chosen-container.chosen-with-drop .chosen-drop { left: 3%; margin-top: -1px; } .map-specific-prods .chosen-container .chosen-results li { padding: 12px 14px; padding: 0.75rem 0.875rem; border-top: 1px solid #e5e5e5; } .map-specific-prods .chosen-container .chosen-results li:first-child { border-top: 0; } .map-specific-prods .chosen-container .chosen-results li.active-result { color: #555555; } .map-specific-prods .chosen-container-multi .chosen-drop .result-selected { color: #999999; } .map-specific-prods .chosen-container .chosen-results li.highlighted { color: #ffffff; background: #008b5c; } .map-specific-prods .chosen-container-multi .chosen-choices li.search-choice { font-size: 14px; font-size: 0.875rem; line-height: 1; margin: 6px 12px 6px 0; margin: 0.375rem 0.75rem 0.375rem 0; padding: 10px 38px 10px 12px; padding: 0.625rem 2.375rem 0.625rem 0.75rem; background: #008c5c; color: #ffffff; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border: 0; box-shadow: none; } .map-specific-prods .chosen-container-multi .chosen-choices li.search-choice .search-choice-close { top: 1px; right: 0; bottom: 1px; width: 26px; width: 1.625rem; height: auto; border-left: 1px solid #007c51; background: transparent; color: #016c47; text-shadow: none; } .map-specific-prods .chosen-container-multi .chosen-choices li.search-choice .search-choice-close:hover { color: #ffffff; } .map-specific-prods .chosen-container-multi .chosen-choices li.search-choice .search-choice-close::before { font-family: 'fontello'; content: '\e809'; position: absolute; top: 0; right: 0; bottom: 0; left: 0; line-height: 30px; line-height: 1.875rem; text-align: center; font-size: 14px; font-size: 0.875rem; } .wholesale-section label, .wholesale-section a { /* also has .greenHeader styles, including position:relative */ margin-bottom: 0; cursor: pointer; font-weight: 500; } .wholesale-section label .warning { font-size: 14px; } .wholesale-section label span::after { content: ''; position: absolute; top: 50%; left: 3px; left: 0.1875rem; /* margin-right: 10px; margin-right: 0.625rem; */ width: 50px; /* cq, px only */ height: 50px; margin-top: -25px; background-image: url('../images/bfbl_sprite_giant_checkbox.png'); background-repeat: no-repeat; background-size: 50px; background-position: top left; } .wholesale-section label input[type=checkbox]:checked + span::after { background-position: bottom left; } .wholesale-section label input[type=checkbox] { display: none; } .finder-search-results .map-subhead { padding-top: 24px; padding-top: 1.5rem; margin-bottom: 12px; margin-bottom: 0.75rem; text-align: left; } .finder-search-results .results-total { color: #999999; font-size: 14px; font-size: 0.875rem; margin-bottom: 28px; margin-bottom: 1.75rem; } .finder-search-results .results-total .count { display: inline; background: #008c5c; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; padding: 2px 6px; padding: 0.125rem 0.375rem; color: #ffffff; margin-left: 8px; margin-left: 0.5rem; } .finder-search-results .results-list { margin-left: -10px; margin-left: -0.625rem; margin-right: -10px; margin-right: -0.625rem; } .finder-search-results .results-list li { display: block; border-style: solid; border-color: #e5e5e5; border-width: 0; border-bottom-width: 1px; } .finder-search-results .results-list li:first-child { border-top-width: 1px; } .finder-search-results .results-list li a { display: block; font-size: 14px; font-size: 0.875rem; text-decoration: none; padding: 10px; padding: 0.625rem; color: #555555; position: relative; } .finder-search-results .results-list li a:hover { background: #008b5c; color: #ffffff; } .finder-search-results .results-list li a::after { font-family: 'fontello'; content: '\e80b'; display: block; position: absolute; top: 50%; right: 10px; right: 0.625rem; width: 16px; width: 1rem; height: 20px; height: 1.25rem; line-height: 20px; height: 1.25rem; font-size: 20px; font-size: 1.25rem; margin-top: -10px; margin-top: -0.625rem; text-align: right; color: #a1a1a1; } .finder-search-results .results-list li a:hover::after { color: #ffffff; } /* 404 PAGE */ body.error404 .main-content { position: relative; height: 294px; height: 18.375rem; background-color: #f7ecd5; background-image: url('../images/bfbl_cow_650px.jpg'); background-position: center center; background-repeat: no-repeat; background-size: cover; } body.error404 .main-content article { position: absolute; top: 86px; top: 5.375rem; right: 10px; right: 0.625rem; bottom: 0; width: 60%; max-width: 630px; max-width: 39.375rem; color: #ffffff; } body.error404 .main-content h1, body.error404 .main-content h2 { font-family: 'blue_highway_bold'; text-align: center; text-transform: uppercase; margin: 0; } body.error404 .main-content h1 { font-size: 34px; font-size: 2.125rem; } body.error404 .main-content h2 { font-size: 16px; font-size: 1rem; margin-bottom: 20px; margin-bottom: 1.25rem; } body.error404 .main-content p { font-size: 14px; font-size: 0.875rem; line-height: 18px; line-height: 1.125rem; max-width: 200px; max-width: 12.5rem; margin: 0 auto; } body.error404 .main-content p.not-found-btn { padding-top: 16px; padding-top: 1rem; text-align: center; } p.not-found-btn .bfblButtonLink.btnBlue { background: #ffffff!important; } p.not-found-btn .bfblButtonLink.btnBlue:hover { background: #1a3281!important; } /**GALLERY **/ .photo-gallery-wrapper { margin: 30px auto; clear: both; } .photo-gallery-wrapper .gallery-title { font-size: 20px; font-weight: bold; margin: 0 0 10px; text-transform: uppercase; } .photo-gallery-wrapper .gallery-caption { font-size: 14px; font-style: italic; margin: 10px 0 0; } .photo-gallery-wrapper .gallery-caption:empty { display: none; } .photo-gallery-wrapper .cycle-caption { background-color: #eee; font-size: 14px; margin: 0; padding: 10px; } .photo-gallery-wrapper .cycle-caption:empty { display: none !important; } .photo-gallery-wrapper .photo-gallery { display: block; overflow: hidden; position: relative; z-index: 2; margin: 0; } .photo-gallery-wrapper .photo-gallery .cycle-prev, .photo-gallery-wrapper .photo-gallery .cycle-next { display: block; position: absolute; top: 0; bottom: 0; z-index: 1000; cursor: pointer; text-indent: -9999em; outline: 0; background: transparent; } .photo-gallery-wrapper .photo-gallery .cycle-prev:hover, .photo-gallery-wrapper .photo-gallery .cycle-next:hover { background-color: transparent; } .photo-gallery-wrapper .photo-gallery .cycle-prev span, .photo-gallery-wrapper .photo-gallery .cycle-next span { display: block; width: 82px; height: 90px; background-color: rgba(255, 255, 255, 0.85); background-repeat: no-repeat; background-position: 50% 50%; position: absolute; top: 105px; opacity: .25; transition: opacity 0.1s ease-in-out; -webkit-transition: opacity 0.1s ease-in-out; -moz-transition: opacity 0.1s ease-in-out; } .photo-gallery-wrapper .photo-gallery .cycle-prev:hover span, .photo-gallery-wrapper .photo-gallery .cycle-next:hover span { opacity: 1; } .photo-gallery-wrapper .photo-gallery .cycle-prev { left: 0; right: 50%; } .photo-gallery-wrapper .photo-gallery .cycle-prev span{ background-image: url(../images/gallery/gallery_prev_lg.png); left: 0; } .photo-gallery-wrapper .photo-gallery .cycle-next { right: 0; left: 50%; } .photo-gallery-wrapper .photo-gallery .cycle-next span{ background-image: url(../images/gallery/gallery_next_lg.png); right: 0; } .photo-gallery-wrapper .photo-gallery .cycle-slideshow { background-color: #333; } .photo-gallery-wrapper .photo-gallery img { width: 100%; height: auto; } /* mobile exceptions - for exceptions to general rules that apply only to certain pages, only on mobile */ @media (max-width: 767px) { body.page-template-page_about-parent .entry-content h2 { font-size: 20px; font-size: 1.25rem; } .page-block.image-split.tan-shadow.news-events-top { display: none; } .news-events-list { margin-top: -1px; } .chips-block, .map-chip { position: absolute; clip: rect(0,1px,1px,0); overflow: hidden; } .map-page-middle-bg { display: none; } .resources-container { padding: 0; } .resource-link .image { display: none; } .resource-link .image ~ .details { margin: 0 30px 0 0; } .pickup-heading { text-align: center; } .page-block.light-green h2 { margin-top: 2rem; } } /* large mobile media query */ @media (min-width: 600px) { /* SPONSOR BLOCK - TABLET */ .sponsors-list .sponsor { width: 33%; padding: 33% 0 0; } } /* tablet media query */ @media (min-width: 768px) { /* HEADER - TABLET */ header.site-header { height: 82px; height: 5.125rem; } header.site-header .home-link a { width: 160px; width: 10rem; height: 60px; height: 3.75rem; margin-left: 42px; margin-left: 2.625rem; } #bfblMenuBtn { right: 42px; right: 2.625rem; padding-top: 20px; padding-top: 1.25rem; } #bfblDrawerWrap { position: fixed; } .ui-dialog { position: fixed!important; } /* FOOTER - TABLET */ #bfblFooter { text-align: left; padding-left: 0; /* override bootstrap left and right gutters */ padding-right: 0; } #bfblFooter .row { /* override bootstrap left and right gutters */ margin-left: 20px; margin-left: 1.25rem; margin-right: 20px; margin-right: 1.25rem; } #bfblFooter .row section:first-child { padding-left: 22px; padding-left: 1.375rem; } #bfblFooter .row section:last-child { padding-right: 22px; padding-right: 1.375rem; } #bfblFooter h3 { margin: 50px 0 20px; margin: 3.125rem 0 1.25rem; } .footerNav-1 { padding-left: 44px; padding-left: 2.75rem; } .footerAbout p, .footerNav li { margin-top: 0; margin-bottom: 30px; margin-bottom: 1.875rem; } .footerAbout p { padding-right: 16px; padding-right: 1rem; } .footerSocial ul { padding-left: 30px; padding-left: 1.875rem; } .footerSocial li { width: auto; display: block; margin-bottom: 12px; } .footerSocial li a { display: inline-block; } .footerRowTwo { padding-bottom: 50px; padding-bottom: 3.125rem; } .footerRowTwo::before { content: ''; display: block; border-top: 1px solid #8cc63f; height: 50px; height: 3.125rem; width: 80%; max-width: 800px; max-width: 50rem; margin: 0 auto; } .footerAddress { margin-bottom: 8px; margin-bottom: 0.5rem; } .footerPhoneEmail span { padding: 0 13px; padding: 0 0.8125rem; } .footerPhoneEmail span.footerPhone { padding-left: 0; } .footerCredits { position: static; clip: auto; } /* PAGE HEADER - TABLET */ header.page-header.has-image { height: 280px; height: 17.5rem; line-height: 280px; line-height: 17.5rem; text-align: right; } header.page-header.has-image .entry-title { font-size: 60px; font-size: 3.75rem; line-height: 1; text-align: left; min-width: 33.33%; padding-right: 42px; padding-right: 2.625rem; } header.page-header.has-image .entry-title .title { font-size: .95em; } header.page-header.has-image .entry-title .subtitle { font-size: 1.1rem; font-weight: 300; } header.page-header.no-image { padding: 32px 42px; padding: 2rem 2.625rem; /* matches padding on .page-block */ } header.page-header.no-image ~ .entry-content > *:first-child { margin-top: 0; padding-top: 0; } header.page-header.no-image ~ .entry-content > .video:first-child ~ * { margin-top: 0; padding-top: 0; } /* PAGE CONTENT - TABLET */ .entry-content { padding: 44px 42px; padding: 2.75rem 2.625rem; /* matches padding on .page-block */ } .entry-content blockquote { margin-left: 40px; margin-right: 40px; } .entry-content blockquote .alignleft { float: left !important; display: block; } .entry-content blockquote .alignright { float: right !important; display: block; } .entry-content .video, .entry-content .photo-gallery-wrapper.upper-gallery { float: right; width: 50%; margin-left: 32px; margin-left: 2rem; margin-right: 0; max-width: none; } .entry-content .video.agritourism-video { float: none; clear: both; width: 50%; margin: 0 auto; } .alignleft { float: left; margin-left: 0; margin-right: 32px; margin-right: 2rem; } .alignright { float: right; margin-left: 32px; margin-left: 2rem; margin-right: 0; } .alignleft, .alignright { max-width: 56%!important; } .aligncenter { max-width: 100%!important; } .entry-content .resourceImage { position: static; clip: auto; float: right; margin-left: 32px; margin-left: 2rem; margin-bottom: 32px; margin-bottom: 2rem; margin-right: 0; max-width: 30%; } .entry-content .resourceImage img { max-width: 100%; height: auto; } /* PAGE CONTENT - SPECIAL CASES - TABLET */ /* ABOUT page */ body.page-template-page_about-parent .entry-content { text-align: left; padding-bottom: 44px; padding-bottom: 2.75rem; } body.page-template-page_about-parent .entry-content p { padding-right: 362px; /* this value will change if the image ever changes! */ } body.page-template-page_about-parent .entry-content img { margin-left: 0; top: 162px; top: 10.125rem; left: auto; right: 42px; bottom: auto; } .team-section { font-size: 18px; font-size: 1.125rem; } .team-section .image { display: block; } .team-section .image img { position: static; clip: auto; } .team-section .project-leads, .team-section .advisory-board { padding: 44px 42px; padding: 2.75rem 2.625rem; /* matches padding on .page-block */ } .team-section h2 { font-size: 40px; font-size: 2.5rem; padding-top: 12px; padding-top: 0.75rem; } .team-section .project-leads li { display: inline-block; text-align: left; padding-left: 22px; padding-left: 1.375rem; padding-right: 22px; padding-right: 1.375rem; } .team-section .project-leads li:nth-child(even) { text-align: right; } .team-section .advisory-board ul { -webkit-column-count: 3; /* Chrome, Safari, Opera */ -moz-column-count: 3; /* Firefox */ column-count: 3; -webkit-column-width: 240px; /* Chrome, Safari, Opera */ -webkit-column-width: 15rem; -moz-column-width: 240px; /* Firefox */ -moz-column-width: 15rem; column-width: 240px; column-width: 15rem; -webkit-column-gap: 24px; /* Chrome, Safari, Opera */ -webkit-column-gap: 1.5rem; -moz-column-gap: 24px; /* Firefox */ -moz-column-gap: 1.5rem; column-gap: 24px; column-gap: 1.5rem; } .team-section .advisory-board ul li { text-align: center; -webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */ page-break-inside: avoid; /* Firefox */ break-inside: avoid; /* IE 10+ */ } /* PAGE BLOCKS - TABLET */ .blockArrow { display: none!important; /* these are hidden on *all* pages on tablet and larger */ } .parentArrow, .greenHeader { padding: 0 42px; padding: 0 2.625rem; } .page-block { padding: 44px 42px; padding: 2.75rem 2.625rem; /* show any .page-block elements that were hidden on certain pages */ position: relative!important; clip: auto!important; overflow: visible!important; } .page-block .content { padding: 0 60px 28px; padding: 0 3.75rem 1.75rem; } .main-content.archive-page .page-block .content { padding-top: 0; } .page-block h2, .partner-profile .page-block h1, .partner-profile .page-block h2, .partner-profile .page-block h3 { font-size: 40px; font-size: 2.5rem; } /* special case */ body.page-template-page_why-buy-local .page-block h2 { font-size: 30px; font-size: 1.875rem; color: #1a3281; } .page-block.has-icon h2::before { content: ''; display: inline-block; width: 40px; height: 40px; vertical-align: middle; margin-right: 16px; margin-right: 1rem; background-image: url('../images/bfbl_wbl_icons_sprite.png'); background-size: 40px; background-repeat: no-repeat; } .page-block.has-icon.icon-leaf h2::before { background-position: 0 0; } .page-block.has-icon.icon-heart h2::before { background-position: 0 -80px; } .page-block.has-icon.icon-house h2::before { background-position: 0 -160px; } .page-block.has-icon.icon-hills h2::before { background-position: 0 -240px; } .page-block.has-icon.icon-pie h2::before { background-position: 0 -320px; } .page-block.green h2 { display: inline-block; height: 90px; height: 5.625rem; line-height: 90px; line-height: 5.625rem; } .page-block.green h2::after { width: auto; margin-left: -16px; margin-left: -1rem; margin-right: -16px; margin-right: -1rem; } .page-block.full-width .content p, .page-block.full-width-badge .content p{ margin-left: auto; margin-right: auto; width: 86%; } .page-block.full-width-badge .badge-icon { position: absolute; top: 44px; top: 2.75rem; height: 140px; height: 8.75rem; margin-top: -76px; margin-top: -4.75rem; left: 50%; width: 140px; width: 8.75rem; margin-left: -70px; margin-left: -4.375rem; background-repeat: no-repeat; background-position: center center; background-size: contain; } .page-block.full-width-badge .badge-icon a { display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; } .page-block.full-width-badge .content { padding-top: 54px; padding-top: 3.375rem; } .page-block.full-width-badge h2 { margin: 0; height: 60px; height: 3.75rem; line-height: 60px; line-height: 3.75rem; } .page-block.full-width-badge h2::after { display: none; } .page-block.image-split .content { padding: 36px 0; padding: 2.25rem 0; } .page-block.image-split h2 { font-size: 30px; font-size: 1.875rem; overflow: hidden; /* for clearing floats */ } .page-block.image-split h2 span { display: block; width: 50%; float: left; padding-left: 3.19%; padding-right: 18.08%; } .page-block.image-split h2 span.right-text { float: right; padding-left: 18.08%; padding-right: 3.19%; } .page-block.image-split .image { top: 0; bottom: 0; height: auto; width: 26.85%; margin-left: -13.425%; } /* image split - news events page header */ .page-block.image-split.news-events-top { margin-top: -1px; box-shadow: none; background-image: none; } .page-block.image-split.news-events-top .image { background-image: url('../images/bfbl_big_logo.jpg'); } .page-block.image-split.news-events-top .content { padding: 0; } .page-block.image-split.news-events-top h2 { font-family: 'blue_highway_bold'; font-size: 50px; font-size: 3.125rem; color: #1a3281; height: 160px; height: 10rem; line-height: 160px; line-height: 10rem; max-width: none!important; } .page-block.image-left, .page-block.image-right, .page-block.video { padding: 0; } .page-block.image-left::after, .page-block.image-right::after, .page-block.video::after { content: ''; display: block; clear: both; } .page-block.image-left .image, .page-block.image-right .image { padding-top: 0; } .page-block.image-left .image a, .page-block.image-right .image a { display: inline; } .page-block.image-left .content, .page-block.image-right .content, .page-block.video .content { padding-top: 72px; padding-top: 4.5rem; text-align: left; } .main-content.archive-page .page-block.image-left .content, .main-content.archive-page .page-block.image-right .content, .main-content.archive-page .page-block.video .content { padding-top: 0; } .page-block.image-left h2, .page-block.image-right h2, .page-block.video h2 { margin-top: 0; text-align: inherit; } .page-block.image-left .content p, .page-block.image-right .content p, .page-block.video .content p { font-size: 16px; font-size: 1rem; line-height: 24px; line-height: 1.5rem; } body.home.page .page-block.image-left .content p, body.home.page .page-block.image-right .content p { font-size: 20px; font-size: 1.25rem; line-height: 26px; line-height: 1.625rem; } .page-block.image-left .bfblButtonLink, .page-block.image-right .bfblButtonLink, .page-block.video .bfblButtonLink { margin-bottom: 16px; margin-bottom: 1rem; } .page-block.image-left .image img, .page-block.image-right .image img { max-width: 90%; } .page-block.image-normal .image { /* have the top padding match that of .content */ padding-top: 4rem; padding-bottom: 4rem; } .page-block.image-overhang .image { margin-top: -24px; margin-top: -1.5rem; margin-bottom: -24px; margin-bottom: -1.5rem; position: relative; z-index: 10; } /* for image-fill-side, forget the actual image. use the backup element with a background. */ .page-block.image-fill-side .image a img { opacity: 0; /* hide using opacity, instead of display:none, because we might need the image to prop open the block if there's not much page content */ max-width: 100%; } .page-block.image-fill-side .blockBG { display: block; position: absolute; top: 0; bottom: 0; width: 35%; background-repeat: no-repeat; background-size: cover; } .page-block.image-left .image { float: left; width: 35%; text-align: right; } .page-block.image-left .content { float: right; width: 65%; padding-left: 4%; padding-right: 42px; padding-right: 2.625rem; } .page-block.image-right .image, .page-block.video .video { float: right; width: 35%; text-align: left; } .page-block.image-right .content, .page-block.video .content { float: left; width: 65%; padding-right: 4%; padding-left: 42px; padding-left: 2.625rem; } .page-block.image-left.image-fill-side .blockBG { left: 0; background-position: right center; } .page-block.image-right.image-fill-side .blockBG { right: 0; background-position: left center; } .page-block.video .content { width: 44%; } .page-block.video .video { width: 56%; max-width: none; /* have the top padding match that of .content */ padding-top: 72px; padding-top: 4.5rem; padding-bottom: 56rem; padding-bottom: 3.5rem; padding-right: 42px; padding-right: 2.625rem; } /* ANIMATED HEADER - TABLET */ .animated-header .animated-blocks li { display: block; height: 556px; height: 34.75rem; width: 19%; float: left; } .animated-header .animated-blocks li a .content h3, .animated-header .animated-blocks li a .map-content .subtext, .animated-header .animated-blocks li a .content .subtext { font-size: 15px; font-size: 0.9375rem; line-height: 20px; line-height: 1.25rem; } .animated-header .animated-blocks li a .content h3, .animated-header .animated-blocks li a .content .subtext { text-shadow: 0 0 3px rgba(15,30,44,1); } .animated-header .animated-blocks li:first-child { background-position: 0 50%; } .animated-header .animated-blocks li:nth-child(4) { background-position: 100% 50%; } /* turn the yellow overlay off */ .animated-header .animated-blocks li.animated-link a:hover::before { background: transparent; } /* move the subtext block into postion */ .animated-header .animated-blocks li.animated-link a:hover .content .subtext { opacity: 1; bottom: 115px; bottom: 7.1875rem; transition: bottom 0.375s ease-in-out, opacity 0.5s ease-in-out 0.125s; } .animated-header .animated-blocks li.map-link { width: 24%; } .animated-header .animated-blocks li.map-link .map-content h3 { text-shadow: 0 0 15px #000000; } .animated-header .animated-blocks li.map-link .map-content .subtext { text-shadow: 0 0 3px rgba(15,30,44,1); } .animated-header .animated-blocks li.map-link .map-content .inner .badge-icon { width: 113px; width: 7.0625rem; } .animated-header .animated-blocks.has-active li { width: 17%; } .animated-header .animated-blocks.has-active li.active { width: 25%; } .animated-header .animated-blocks.has-active li.active:before { background: transparent; } .animated-header .animated-blocks.has-active li.map-link { width: 24%; } .animated-header .animated-blocks.has-active li.map-link.active { width: 24%; } /* SPONSOR BLOCK - TABLET */ .sponsors-list.page-block h2 { margin-bottom: 26px; margin-bottom: 1.625rem; } .sponsors-list .sponsor { width: 25%; padding: 25% 0 0; } /* SPECIFIC PAGES - TABLET */ .wbl-subtitle { height: 300px; height: 18.75rem; line-height: 300px; line-height: 18.75rem; } .mission-statement { height: 306px; height: 19.125rem; line-height: 306px; line-height: 19.125rem; } .wbl-subtitle::before, .mission-statement::before { top: 44px; top: 2.75rem; right: 42px; right: 2.625rem; bottom: 44px; bottom: 2.75rem; left: 42px; left: 2.625rem; } .wbl-subtitle .content { padding: 0 114px; padding: 0 7.125rem; max-width: 620px; max-width: 38.75rem; } .mission-statement .content { max-width: 832px; max-width: 52rem; } .wbl-subtitle .content::before, .wbl-subtitle .content::after { height: 100px; width: 90px; margin-top: -50px; background-size: 90px; } .mission-statement .content::before, .mission-statement .content::after { width: 120px; height: 100px; background-size: 120px; } .wbl-subtitle .content h2 { font-size: 50px; font-size: 3.125rem; } .mission-statement .content h2 { font-size: 40px; font-size: 2.25rem; } .mission-statement .content p { font-size: 20px; font-size: 1.25rem; line-height: 28px; line-height: 1.75rem; padding-left: 140px; padding-left: 8.75rem; padding-right: 140px; padding-right: 8.75rem; } /* NEWS AND EVENTS - TABLET */ .news-events-list { padding: 20px 0 30px; padding: 1.25rem 0 1.875rem; } .news-events-list .news-list::before, .news-events-list .events-list::before { display: none; } .news-events-list .news-list { padding-left: 42px; padding-left: 2.625rem; padding-right: 16px; padding-right: 1rem; position: static; /* so that .news-list::after is absolutely positioned relative to .news-events-list */ } .news-events-list .events-list { padding-left: 16px; padding-left: 1rem; padding-right: 42px; padding-right: 2.625rem; } .news-events-list .news-list::after { content: ''; display: block; position: absolute; /* relative to .news-events-list */ top: 20px; top: 1.25rem; left: 58.33333333%; bottom: 30px; bottom: 1.875rem; width: 1px; margin-left: -1px; background: #fcaf17; } .news-events-list .news-summary .image { max-width: 270px; max-width: 16.875rem; margin-left: 0; margin-right: 0; } .news-events-list .entry-header h2, .archive-list h2.entry-title { font-size: 30px; font-size: 1.875rem; } /* RESOURCES - TABLET */ .resources-list.alt .resource-link article { background-color: #008c5c; color: #fff; } .resources-list.alt .resource-link h3 { color: #fff; } .resources-list.alt .resource-link:nth-of-type(odd) article { background-color: #f7ecd5; color: #1a3281; } .resources-list.alt .resource-link:nth-of-type(odd) h3 { color: #1a3281; } .resource-link .details { line-height: 70px; height: 70px; } .resource-link .details h3 { display: inline; line-height: 1.3; } /* OTHER ARCHIVE-TYPE PAGES - TABLET*/ .archive-header { padding: 44px 42px; padding: 2.75rem 2.625rem; } .archive-header::before { top: 44px; top: 2.75rem; right: 42px; right: 2.625rem; bottom: 44px; bottom: 2.75rem; left: 42px; left: 2.625rem; } .archive-header h1 { font-size: 40px; font-size: 2.25rem; padding-top: 40px; padding-top: 2.25rem; padding-bottom: 40px; padding-bottom: 2.25rem; } .archive-header h1 small { font-size: 20px; font-size: 1.25rem; } .archive-list { padding: 44px 42px; padding: 2.75rem 2.625rem; } .archive-list article { margin-bottom: 80px; margin-bottom: 5rem; } /* PARTNERS - TABLET */ .partner-profile .page-block::after { content: ''; display: block; clear: both; } .page-block.acf-map-wrap { padding: 0; } .acf-map { height: 320px; height: 20rem; } .product-categories-list { margin-bottom: -26px; margin-bottom: -1.625rem; } .product-categories-list li { display: inline-block; padding: 0 26px 26px 0; padding: 0 1.625rem 1.625rem 0; } .partner-info-right, .product-info-right { float: right; width: 60%; text-align: left; } .partner-info-left, .product-info-left { float: left; width: 30%; } .partner-info-right h1.entry-title { text-align: left; padding-top: 0; margin-bottom: 32px; margin-bottom: 2rem; } .partner-description { margin-bottom: 48px; margin-bottom: 3rem; } .market-vendor-list { text-align: left; } .partner-info-block .partner-detail { text-align: left; padding-left: 110px; position: relative; } .partner-info-block .partner-detail h4 { position: absolute; top: 2px; top: 0.125rem; /* accounts for the line height on the .partner-detail text, so they look aligned */ left: 0; } .partner-contact ul { text-align: center; } .partner-contact li { display: inline-block; width: 33.33%; min-width: 160px; min-width: 10rem; padding-left: 4px; padding-left: 0.25rem; padding-right: 4px; padding-right: 0.25rem; } .owner-image, .business-image, .agritourism-photo { width: 100%; max-width: 270px; max-width: 16.875rem; margin-left: 0; margin-top: 6px; margin-top: 0.375rem; margin-bottom: 16px; margin-bottom: 1rem; } .partner-profile .page-block h3.owner-name, .partner-profile .page-block h3.partner-name { padding-top: 32px; padding-top: 2rem; font-size: 40px; font-size: 2.5rem; text-align: left; } .partner-social { margin: 0; border: 0; text-align: left; } /* .partner-social li a { color: #008c5c; padding: 16px; padding: 1rem; padding-left: 0; } .partner-social li a:hover { color: #1a3281; } .partner-social li a::before { margin-right: 12px; margin-right: 0.75rem; } .partner-social li a::after { display: none; }*/ .products-detail { margin-top: 0; } .product-info-contents.page-block h3, .product-info-contents .entry-product-categories, .product-info-contents .entry-product-wheretobuy, .product-info-contents .entry-product-hours { text-align: left; } .product-info-contents .entry-product-categories { margin-bottom: 64px; margin-bottom: 4rem; } .product-info-contents .entry-product-hours { margin-bottom: 0; } .farming-practices-list, .vendor-list { color: #003f29; } .farming-practices-list li, .vendor-list li { display: block; padding-left: 15px; color: #72706b; } .farming-practices-list li::before, .vendor-list li::before { content: '\2022'; font-size: 25px; line-height: 1; margin-left: -15px; margin-top: -3px; float: left; display: inline-block; color: #008c5c; } .farming-practices-list li:nth-child(3n+1), .vendor-list li:nth-child(3n+1) { clear: left; } .farming-practices-list li em, .vendor-list li em { color: #72706b; font-style: italic; } .practices-wrap, .agritourism-event { text-align: left; } /* FIND LOCAL FOOD - MAP PAGE - TABLET */ .map-subhead { font-size: 20px!important; font-size: 1.25rem!important; } .map-checkboxes label { display: inline-block; width: 200px; width: 12.5rem; margin-right: 16px; margin-right: 1rem; margin-bottom: 8px; margin-bottom: 0.5rem; } .map-county-zip .county-select-wrap, .map-county-zip>span, .map-county-zip .zip-input-group { display: inline-block; margin-top: 0; margin-bottom: 0; } .map-county-zip>span { width: 128rem; width: 8rem; } .page-block.map-specific-prods { padding-top: 0; } .map-specific-prods .map-subhead br { display: none; } .wholesale-section label span::after { left: 36px; left: 2.25rem; } .map-page-middle{ position: relative; } .map-page-middle::after { content: ''; display: block; clear: both; } .finder-search-results { /*float: left;*/ /*width: 66%;*/ padding-right: 12px; padding-right: 0.75rem; padding-left: 12px; padding-left: 0.75rem; } .finder-search-results .results-list { margin-left: 0; margin-right: 0; } .finder-search-results .results-list li { border-left-width: 1px; border-right-width: 1px; } .map-chip { float: right; width: 33%; padding-right: 12px; padding-right: 0.75rem; padding-left: 12px; padding-left: 0.75rem; background: transparent!important; box-shadow: none!important; } .map-page-middle-bg { /* this serves as the background of the .map-chip, * because the chip needs to be able to expand vertically to match * the height of the search results -- and the floated .map-chip can't do that. * (.map-chip itself needs to be floated to prop open the .map-page-middle, * in case there's only one search result) */ position: absolute!important; top: 0; right: 0; bottom: 0; width: 33%; z-index: -1; } /* 404 PAGE - TABLET */ body.error404 .main-content { height: 960px; height: 60rem; background-image: url('../images/bfbl_cow_900px.jpg'); } body.error404 .main-content article { top: 392px; top: 24.5rem; right: 42px; right: 2.625rem; } body.error404 .main-content h1 { font-size: 82px; font-size: 5.125rem; } body.error404 .main-content h2 { font-size: 36px; font-size: 2.25rem; } body.error404 .main-content p { font-size: 20px; font-size: 1.25rem; line-height: 26px; line-height: 1.625rem; max-width: 440px; max-width: 27.5rem; } body.error404 .main-content p.not-found-btn { padding-top: 32px; padding-top: 2rem; } .photo-gallery-wrapper { width: 60%; } } /* desktop media query */ @media (min-width: 992px) { /* HEADER - DESKTOP */ header.site-header .home-link a { margin-left: 46px; margin-left: 2.875rem; } #bfblMenuBtn { display: none; } /* MENU - DESKTOP */ #bfblMenuOverlay { display: none!important; } #bfblDrawerWrap { position: absolute; right: 46px; right: 2.875rem; width: 100%!important; height: auto!important; overflow: visible; /* #bfblMenuDrawer actually hangs out the bottom */ transition: width 0s, height 0s; } #bfblMenuDrawer { right: 0!important; box-shadow: none!important; width: auto; background: transparent; overflow: visible; font-family: 'blue_highway_condensed'; transition: right 0s, box-shadow 0s; /* padding-right: 64px; padding-right: 4rem; /* accomodates the login button, which is absolutely positioned */ padding-right: 56px; padding-right: 3.5rem; /* accomodates the login button, which is absolutely positioned */ } #bfblMenuDrawer>* { display: inline-block; vertical-align: top; } #bfblMenuDrawer .drawerTop { display: none; } .drawerNav { padding: 0; background: transparent; } .drawerNav .menuColumn { float: none!important; width: auto; display: inline-block; } .drawerNav li { display: inline-block; padding-top: 12px; padding-top: 0.75rem; } .drawerNav a { display: inline-block; color: #ffffff; height: 69px; height: 4.3125rem; line-height: 69px; line-height: 4.3125rem; font-size: 16px; font-size: 1rem; letter-spacing: 1px; /* padding: 0 18px; padding: 0 1.125rem; */ padding: 0 8px; padding: 0 0.5rem; background: transparent; position: relative; } .drawerNav a .shade { display: none; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; background: #003f29; } .drawerNav a:hover .shade, .drawerNav li.currentPage a .shade { display: block; } .drawerNewsletter { /* padding: 22px 26px 0; padding: 1.375rem 1.625rem 0; */ padding: 23px 8px 0; padding: 1.4375rem 0.5rem 0; } .drawerNewsletter .buttonNewsletter { min-width: 0; font-family: 'blue_highway_condensed'; letter-spacing: 1px; padding-left: 12px; padding-left: .75rem; padding-right: 12px; padding-right: .75rem; } .drawerLogin, .drawerSearch { padding: 12px 0 0; padding: 0.75rem 0 0; background: transparent; } .drawerLogin .buttonLogInOut, .drawerSearch .buttonSearch { /* width: 64px; width: 4rem; */ width: 56px; width: 3.5rem; min-width: 0; height: 69px; height: 4.3125rem; border: 0!important; text-align: center; font-family: 'blue_highway_condensed'; letter-spacing: 1px; text-transform: uppercase; font-size: 16px; font-size: 1rem; line-height: 21px; line-height: 1.3125; padding-top: 10px; padding-top: 0.625rem; padding-right: 0; padding-bottom: 38px; padding-bottom: 2.375rem; padding-left: 0; position: relative; } .drawerLogin .buttonLogInOut::after, .drawerSearch .buttonSearch::after { font-family: 'fontello'; display: block; position: absolute; left: 50%; bottom: 16px; bottom: 1rem; width: 22px; width: 1.375rem; height: 22px; height: 1.375rem; margin-left: -11px; background: transparent; font-size: 18px; font-size: 1.125rem; line-height: 22px; line-height: 1.375rem; text-align: center; } .drawerLogin .buttonLogInOut::after { content: '\e80a'; } .drawerSearch .buttonSearch::after { content: '\e806'; } .drawerLogin .buttonLogInOut:focus, .drawerSearch .buttonSearch:focus { background: inherit; } .drawerLogin .buttonLogInOut:hover, /* .drawerLogin .buttonLogInOut:focus, */ .drawerLogin .buttonLogInOut.btnActive, .drawerSearch .buttonSearch:hover, /* .drawerSearch .buttonSearch:focus, */ .drawerSearch .buttonSearch.btnActive { background: #003f29; } .drawerLogin { position: absolute; top: 0; right: 0; } .drawerSearch { position: relative; } .searchBtnWrap { display: block; } .searchFormWrap { background: #015c3c; position: absolute; top: 100%; right: -16px; right: -1rem; width: 320px; width: 20rem; padding: 16px 18px; padding: 1rem 1.125rem; clip: rect(0, 320px, 0, 0); clip: rect(0, 20rem, 0, 0); transition: clip 0.5s; } .searchFormWrap.searchActive { clip: rect(0, 320px, 62px, 0); clip: rect(0, 20rem, 3.875rem, 0); } /* FOOTER - DESKTOP */ #bfblFooter .row { margin-left: 24px; margin-left: 1.5rem; margin-right: 24px; margin-right: 1.5rem; } .footerContact { position: relative; padding-left: 19%; } .footerHomeLink { display: block; clip: auto; top: 0; left: 15px; /* cq, matches bootstrap left padding */ width: 32.92%; height: 0; padding-bottom: 21.05%; /* so the height scales with width */ background-image: url('../images/bfbl_logo.png'); background-repeat: no-repeat; background-position: center center; background-size: contain; text-indent: -999999px; } .footerCredits .hideBreak { display: none; } /* PAGE HEADER - DESKTOP */ header.page-header.has-image .entry-title { font-size: 70px; font-size: 4.375rem; line-height: 60px; line-height: 3.75rem; padding-right: 46px; padding-right: 2.875rem; } header.page-header.no-image { padding: 32px 46px; padding: 2rem 2.875rem; } /* PAGE CONTENT - DESKTOP */ .entry-content, body.page-template-page_about-parent .entry-content { padding: 44px 46px; padding: 2.75rem 2.875rem; /* matches padding on .page-block */ } .entry-content .video { width: 50%; } .entry-content blockquote { margin-left: 80px; margin-right: 80px; } .alignleft, .alignright { max-width: 50%!important; } /* PAGE CONTENT - SPECIAL CASES - DESKTOP */ body.page-template-page_about-parent .entry-content p { padding-right: 366px; /* this value will change if the image ever changes! */ } body.page-template-page_about-parent .entry-content img { right: 46px; } .team-section .project-leads, .team-section .advisory-board { padding: 44px 46px; padding: 2.75rem 2.875rem; /* matches padding on .page-block */ } /* PAGE BLOCKS - DESKTOP */ .page-block { padding: 44px 46px; padding: 2.75rem 2.875rem; } .parentArrow, .greenHeader { padding: 0 46px; padding: 0 2.875rem; } .page-block.image-split .content { padding: 46px 0; padding: 2.875rem 0; } .page-block.image-split h2 { margin: 0 auto; max-width: 910px; max-width: 56.875rem; } .page-block.image-split .image { width: 230px; width: 14.375rem; margin-left: -115px; margin-left: -7.1875rem; } .page-block.image-left .content { padding-left: 8%; padding-right: 46px; padding-right: 2.875rem; } .page-block.image-right .content, .page-block.video .content { padding-right: 8%; padding-left: 46px; padding-left: 2.875rem; } .page-block.image-left .content p, .page-block.image-right .content p { margin-bottom: 28px; margin-bottom: 1.75rem; } .page-block.video .content { width: 36%; padding-right: 4%; } .page-block.video .video { width: 64%; padding-right: 46px; padding-right: 2.875rem; } /* ANIMATED HEADER - DESKTOP */ .animated-header .animated-blocks li { width: 16.5625%; } .animated-header .animated-blocks li a .content h3, .animated-header .animated-blocks li a .map-content .subtext, .animated-header .animated-blocks li a .content .subtext { font-size: 18px; font-size: 1.125rem; line-height: 20px; line-height: 1.25rem; } .animated-header .animated-blocks li.map-link { width: 33.75%; } .animated-header .animated-blocks.has-active li { width: 15%; } .animated-header .animated-blocks.has-active li.active { width: 21.25%; } .animated-header .animated-blocks.has-active li.map-link { width: 33.75%; } .animated-header .animated-blocks.has-active li.map-link.active { width: 33.75%; } /* SPONSOR BLOCK - TABLET */ .sponsors-list.page-block h2 { margin-bottom: 26px; margin-bottom: 1.625rem; } .sponsors-list .sponsor { width: 20%; padding: 20% 0 0; } /* SPECIFIC PAGES - DESKTOP */ .wbl-subtitle::before, .mission-statement::before { top: 44px; top: 2.75rem; right: 46px; right: 2.875rem; bottom: 44px; bottom: 2.75rem; left: 46px; left: 2.875rem; } .mission-statement .content::before, .mission-statement .content::after { width: 160px; width: 10rem; height: 134px; height: 8.375rem; background-size: 160px; } .mission-statement .content h2 { font-size: 50px; font-size: 3.125rem; line-height: 80px; line-height: 5rem; } .mission-statement .content p { padding-left: 224px; padding-left: 14rem; padding-right: 224px; padding-right: 14rem; } /* NEWS AND EVENTS - DESKTOP */ .news-events-list .news-list { padding-left: 46px; padding-left: 2.875rem; } .news-events-list .events-list { padding-right: 46px; padding-right: 2.875rem; } .news-events-list article { position: relative; margin-bottom: 100px; margin-bottom: 6.25rem; } .news-events-list .image { position: absolute; top: 8px; top: 0.5rem; left: 0; } .news-events-list .news-summary .image { width: 40.74%; max-width: none; } .news-events-list .news-summary .entry-header, .news-events-list .news-summary .content { padding-left: 44.4444%; } .news-events-list .events-summary .image { width: 42.1%; max-width: none; } .news-events-list .events-summary .entry-header, .news-events-list .events-summary .content { padding-left: 49.47%; } .news-events-list .events-summary .entry-header h2, .news-events-list .events-summary .post-meta { text-align: left; } /* RESOURCES - DESKTOP */ .resourcesContainer { padding: 44px 46px; padding: 2.75rem 2.875rem; } .resourceLink a { font-size: 30px; font-size: 1.875rem; } /* OTHER ARCHIVE-TYPE PAGES - TABLET*/ .archive-header { padding: 44px 46px; padding: 2.75rem 2.875rem; } .archive-header::before { right: 46px; right: 2.875rem; left: 46px; left: 2.875rem; } .archive-header h1 { font-size: 50px; font-size: 3.125rem; padding-top: 40px; padding-bottom: 40px; } .archive-list { padding: 44px 46px; padding: 2.75rem 2.875rem; } /* FIND LOCAL FOOD - MAP PAGE - DESKTOP */ .wholesale-section label span::after { left: 36px; left: 2.25rem; } /* 404 PAGE - DESKTOP */ body.error404 .main-content { background-image: url('../images/bfbl_cow_1350px.jpg'); } body.error404 .main-content article { right: 46px; right: 2.875rem; } body.error404 .main-content h1 { font-size: 100px; font-size: 6.25rem; } body.error404 .main-content h2 { font-size: 46px; font-size: 2.875rem; } body.error404 .main-content p { font-size: 30px; font-size: 1.875rem; line-height: 40px; line-height: 2.5rem; max-width: 560px; max-width: 35rem; } body.error404 .main-content p.not-found-btn { padding-top: 56px; padding-top: 3.5rem; } .photo-gallery-wrapper { width: 50%; max-width: 500px; } } /* large desktop media query */ @media (min-width: 1200px) { /* MENU - LARGE DESKTOP */ #bfblDrawerWrap { right: 4.5%; } #bfblMenuDrawer { padding-right: 64px; padding-right: 4rem; /* accomodates the login button, which is absolutely positioned */ } .drawerNav a { padding: 0 16px; padding: 0 1rem; } .drawerNewsletter { /* padding: 22px 26px 0; padding: 1.375rem 1.625rem 0; */ padding: 23px 16px 0; padding: 1.4375rem 1rem 0; } .drawerNewsletter .buttonNewsletter { min-width: 124px; min-width: 7.75rem; } .drawerLogin .buttonLogInOut, .drawerSearch .buttonSearch { width: 64px; width: 4rem; } /* FOOTER - LARGE DESKTOP */ .footerContact { padding-left: 186px; } .footerHomeLink { width: 160px; width: 10rem; padding-bottom: 60px; padding-bottom: 3.75rem; } .footerSocial ul { padding-left: 0; } .footerSocial li { margin-right: -32px; margin-right: -2rem; } .footerSocial a span { text-indent: .5rem; vertical-align: top; } /* PAGE BLOCKS - LARGE DESKTOP */ .page-block.image-split .content { padding: 60px 0; padding: 3.75rem 0; } .page-block.image-split.news-events-top h2 { font-size: 70px; font-size: 4.375rem; height: 214px; height: 13.375rem; line-height: 214px; line-height: 13.375rem; } .page-block.image-split h2 { max-width: 1156px; max-width: 72.25rem; } .page-block.image-split h2 span { padding-left: 8.5%; padding-right: 18.8%; } .page-block.image-split h2 span.right-text { padding-left: 18.8%; padding-right: 8.5%; } .page-block.image-split .image { width: 280px; width: 17.5rem; margin-left: -140px; margin-left: -8.75rem; } /* ANIMATED HEADER - LARGE DESKTOP */ .animated-header .animated-blocks li { width: 16.5625%; } .animated-header .animated-blocks li.map-link { width: 33.75%; } .animated-header .animated-blocks.has-active li { width: 15%; } .animated-header .animated-blocks.has-active li.active { width: 21.25%; } .animated-header .animated-blocks.has-active li.map-link { width: 33.75%; } .animated-header .animated-blocks.has-active li.map-link.active { width: 33.75%; } /* SPECIFIC PAGES - LARGE DESKTOP */ .news-events-list .news-summary .image { width: 40.3%; } .news-events-list .news-summary .entry-header, .news-events-list .news-summary .content { padding-left: 44.77%; } .news-events-list .events-summary .image { width: 34.8%; } .news-events-list .events-summary .entry-header, .news-events-list .events-summary .content { padding-left: 41.3%; } .news-events-list .entry-header h2, .archive-list h2.entry-title { font-size: 40px; font-size: 2.5rem; } } /** XHR Alerts */ .xhrAlert, .xhrError { display: inline-block; white-space: nowrap; background-color: #eee; position: fixed; border: 1px solid #ddd; border-radius: 3px; font-size: 15px; line-height: 17px; top: -100px; left: 50%; transform: translateX(-50%); padding: 10px; box-sizing: border-box; text-align: right; font-weight: bold; z-index: 1000; opacity: 0; transition: all 0.25s ease-in-out; } .xhrAlert { border-top: 3px solid #fcaf17; } .xhrError { border-top: 3px solid red; } .xhrAlert::before, .xhrError::before { display: block; width: 17px; height: 17px; font-size: 15px; line-height: 17px; float: left; margin-right: 10px; font-family: 'bfbl-errors'; } .xhrAlert::before { content: '\e831'; } .xhrError::before { content: '\e800'; } .xhrError.active, .xhrAlert.active { top: 75px; opacity: 1; } /*Columned List*/ .columned-list { column-count: 2; padding-left: 3rem; padding-right: 3rem; margin-left: 0; margin-right: 0; } .columned-list ul, .columned-list ol { display: none; } .columned-list a { text-decoration: none; border-bottom: 0; } .columned-list li { -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid; } /*Partners Blocks (Agritourism/CSA page) */ .partners-blocks { overflow: hidden; } .partners-blocks li { margin-top: 15px; margin-bottom: 15px; } .partners-blocks li a { position: relative; display: block; padding: 0 0 100%; width: 100%; height: 0; box-sizing: content-box; border: 1px solid #8cc63f; cursor: pointer; } .partners-blocks .image, .partners-blocks .pseudo-image { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 1; } .partners-blocks .image { background-position: 50% 50%; background-repeat: no-repeat; } .partners-blocks .image.cover { background-size: cover; } .partners-blocks .image.contain { background-size: contain; } .partners-blocks .image span { visibility: hidden; } .partners-blocks .pseudo-image span, .partners-blocks .overlay span { font-size: 1.25rem; text-transform: uppercase; font-weight: 300; text-align: center; display: block; position: absolute; top: 50%; left: 15px; right: 15px; text-decoration: none; transform: translateY(-50%); opacity: 1; transition: opacity 0.1s ease-in-out; z-index: 1; } .partners-blocks .pseudo-image span em, .partners-blocks .overlay span em { font-size: 0.9rem; font-style: italic; } .partners-blocks .pseudo-image span { color: #015c3c; } .partners-blocks .overlay span { color: #fff; } .partners-blocks .overlay { display: block; opacity: 0; position: absolute; z-index: 2; top: 0; bottom: 0; left: 0; right: 0; background-color: rgba(1,92,60,0.65); transition: opacity 0.1s ease-in-out; } .partners-blocks li a:hover .pseudo-image span { opacity: 0; } .partners-blocks li a:hover .overlay { opacity: 1; } /*Agritourism Blocks (Agritourism/CSA page) */ .agritourism-blocks { overflow: hidden; } .agritourism-blocks li { margin-top: 15px; margin-bottom: 15px; } .agritourism-blocks li a { position: relative; display: block; padding: 0 0 100%; width: 100%; height: 0; box-sizing: content-box; border: 1px solid #8cc63f; cursor: pointer; } .agritourism-blocks .image { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 1; } .agritourism-blocks .image { background-position: 50% 50%; background-repeat: no-repeat; } .agritourism-blocks .image.cover { background-size: cover; } .agritourism-blocks .image.contain { background-size: contain; } .agritourism-blocks .image span { visibility: hidden; } .agritourism-blocks .overlay { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-color: rgba(1,92,60,0.65); transition: all 0.1s ease-in-out; z-index: 2; } .agritourism-blocks .overlay span { font-size: 1.15rem; text-transform: uppercase; font-weight: bold; text-align: center; display: block; position: absolute; top: 50%; left: 15px; right: 15px; text-decoration: none; transform: translateY(-50%); z-index: 1; color: #fff; text-shadow: 0 0 25px #000; } .agritourism-blocks .overlay em { display: block; font-size: 0.9rem; font-style: normal; font-weight: 700; color: #8cc63f; } .agritourism-blocks li a:hover .overlay { background-color: rgba(222, 118, 28, 0.76) } .agritourims-downloads-blodk h2 { font-size: 40px; font-size: 2.5rem; } .agritourism-downloads { display: flex; flex-wrap: wrap; justify-content: center; } .agritourism-download { max-width: 240px; min-width: 100px; display: block; margin: 1rem; width: auto; color: #1a3281; } .agritourism-download .image { display: block; max-width: 270px; width: auto; margin: 0 auto .5rem; } .agritourism-download .image img { width: 100%; height: auto; display: block; margin: 0; } .agritourism-download .filename { display: block; text-align: center; font-weight: bold; text-transform: uppercase; } .agritourism-download:hover { text-decoration: #015c3c; } .partners-section { overflow: hidden; } .flex-break { flex-basis: 100%; height: 0; margin: 0; padding: 0; overflow: hidden; }