/* Theme Name: Akron Community Foundation Custom Theme Author: Evolve Creative Group Author URI: https://www.evolvecreativegroup.com/ Description: A custom WordPress theme for Akron Community Foundation. Version: 1.3 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html */ /* Normalize - https://necolas.github.io/normalize.css/ --------- */ progress,sub,sup{vertical-align:baseline}button,hr,input{overflow:visible}[type=checkbox],[type=radio],legend{box-sizing:border-box;padding:0}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}svg:not(:root){overflow:hidden}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}button,input,select,textarea{font:inherit;margin:0}optgroup{font-weight:700}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:ButtonText dotted 1px}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{color:inherit;display:table;max-width:100%;white-space:normal}textarea{overflow:auto}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit} /* GLOBAL ------------------------------------------------------- */ html { -webkit-box-sizing: border-box; box-sizing: border-box; font-size: 100%; } *, *::before, *::after { -webkit-box-sizing: inherit; box-sizing: inherit; } body { background-color: #000; font-size: 16px; } #page { overflow: hidden; width: 100%; max-width: 100%; margin: 0 auto; background-color: #fff; } /* SKIP LINK ---------------------------------------------------- */ a.skip-main { left: -999px; position: absolute; top: auto; width: 1px; height: 1px; overflow: hidden; z-index: -999; } a.skip-main:focus, a.skip-main:active { color: #fff; background-color: #000; left: auto; top: auto; width: 30%; height: auto; overflow: auto; margin: 10px 35%; padding: 5px; border-radius: 15px; border: 4px solid yellow; text-align: center; font-size: 1.2em; z-index: 999; } #wpadminbar .screen-reader-shortcut:focus { color: #fff; background-color: #000; } /* BACK TO TOP LINK --------------------------------------------- */ .back-to-top { display: flex; justify-content: center; align-items: center; box-sizing: border-box; position: fixed; z-index: 10; right: 15px; bottom: 40px; font-size: 0.75rem; font-weight: 900; width: 45px; height: 45px; line-height: 1.2; text-align: center; text-transform: uppercase; background-color: #0a6e76; border-radius: 50%; color: #f2f5f7; } .back-to-top a { text-decoration: none; } .back-to-top a:before { content: 'p'; display: block; color: #f2f5f7; font-family: 'akron-community-foundation'; font-size: 2em; text-transform: none; } .back-to-top span { display: block; } /* CORE CLASSES ------------------------------------------------- */ h1, h2, h1.blog-post, h3, h4, h5, h6 { margin: 1em 0 0.75em; color: #003d59; font-weight: 400; font-style: italic; line-height: 1em; } h1 { font-size: 3.25em; } h2, h1.blog-post { font-size: 2.375em; } h3 { color: #053b57; font-size: 1.75em; font-style: normal; font-weight: 900; } h4 { color: #053b57; font-size: 1.625em; } h5 { font-size: 1.25em; } p { font-size: 1em; } ul { } ul li { } ol { } ol li { } a { color: #125359; text-decoration: underline; } a:hover { text-decoration: none; } img { max-width: 100%; height: auto;} /* CUSTOM CLASSES ----------------------------------------------- */ .left { text-align: left; } .center { text-align: center; } .right { text-align: right; } .btn, .btn-wrap a, input[type="submit"], #content .content-wrap .btn { display: inline-block; height: 3.33em; width: auto; border: none; border-radius: 2em; padding: 0 1.65em; margin: 0.625em 0; background-color: #0a7d8a; color: #fff; font-size: 0.75em; font-weight: 700; line-height: 3.33em; text-decoration: none; text-transform: uppercase; -webkit-transition: background-color 200ms ease-in-out; -o-transition: background-color 200ms ease-in-out; -moz-transition: background-color 200ms ease-in-out; transition: background-color 200ms ease-in-out; } .btn:hover, .btn-wrap a:hover, input[type="submit"]:hover, #content .content-wrap .btn:hover { background-color: #053b57; -webkit-transition: background-color 300ms ease-in-out; -o-transition: background-color 300ms ease-in-out; -moz-transition: background-color 300ms ease-in-out; transition: background-color 300ms ease-in-out; } .btn.large, .btn-wrap.large a, input[type="submit"].large, #content .content-wrap .btn.large { font-size: 1em; } .btn.dark-blue, .btn-wrap.dark-blue a, input[type="submit"].dark-blue, #content .content-wrap input[type="submit"].dark-blue, #content .content-wrap .btn.dark-blue { background-color: rgba(0,61,89,1); } .btn.dark-blue:hover, .btn-wrap.dark-blue a:hover, input[type="submit"]:hover.dark-blue, #content .content-wrap input[type="submit"]:hover.dark-blue, #content .content-content-wrap .btn.dark-blue:hover { background-color: rgba(0,61,89,0.8); } /* h2 underline */ h2.underline { padding: 0 0 25px; line-height: 1em; } h2.underline::after { content: ''; display: block; height: 1em; margin: 1em 0 0; font-size: 12px; background: transparent url(img/hash-orange-900.png) left top no-repeat; background-size: auto 100%; } h2.underline.centered { margin: 0 auto; text-align: center; } h2.underline.centered::after { background-position: center top; } /* ACCORDIONS --------------------------------------------------- */ .accordion-container, .accordion-container * { box-sizing: border-box; } .accordion-container { } .accordion-container .accordion-section { border: 1px solid #0a7d8a; border-bottom: none; } .accordion-container .accordion-section:last-child { border-bottom: 1px solid #0a7d8a; } .accordion-container .accordion-section .accordion-section-title { } .accordion-container .accordion-section .accordion-section-title a { display: block !important; position: relative; padding: 20px 85px 20px 30px; border: none !important; background-color: #edf1f3; color: #053b57; font-size: 1.125em; font-weight: 700; line-height: 1; text-decoration: none; -webkit-transition: background-color 200ms ease-in-out, color 200ms ease-in-out; -o-transition: background-color 200ms ease-in-out, color 200ms ease-in-out; -moz-transition: background-color 200ms ease-in-out, color 200ms ease-in-out; transition: background-color 200ms ease-in-out, color 200ms ease-in-out; } .accordion-container .accordion-section .accordion-section-title a::after { content: 'c'; display: block; position: absolute; z-index: 1; top: 50%; right: 35px; height: 100%; margin-top: -0.5em; font-family: 'akron-community-foundation'; text-align: center; text-transform: none; } .accordion-container .accordion-section .accordion-section-content-wrap { overflow: hidden; height: auto; max-height: 0; -webkit-transition: max-height 200ms ease-in-out; -o-transition: max-height 200ms ease-in-out; -moz-transition: max-height 200ms ease-in-out; transition: max-height 200ms ease-in-out; } .accordion-container .accordion-section .accordion-section-title a:hover, .accordion-container .accordion-section.open .accordion-section-title a { background-color: #003d59; color: #fff !important; -webkit-transition: background-color 300ms ease-in-out, color 300ms ease-in-out; -o-transition: background-color 300ms ease-in-out, color 300ms ease-in-out; -moz-transition: background-color 300ms ease-in-out, color 300ms ease-in-out; transition: background-color 300ms ease-in-out, color 300ms ease-in-out; } .accordion-container .accordion-section.open .accordion-section-title a::after { content: 'a'; } .accordion-container .accordion-section.open .accordion-section-content-wrap { max-height: 11000px; font-weight: 300; -webkit-transition: max-height 300ms ease-in-out; -o-transition: max-height 300ms ease-in-out; -moz-transition: max-height 300ms ease-in-out; transition: max-height 300ms ease-in-out; } /* accordions in gutenberg editor */ .accordion-wrap { box-sizing: border-box; width: 100%; max-width: 1220px; padding: 0 100px; margin: 0 auto; } .accordion-wrap .accordion-container { padding: 0; margin: 0; } .accordion-wrap .accordion-container .accordion-section .accordion-section-content-wrap .accordion-section-content { padding: 20px 30px; } .gutenberg-wrap > .accordion-wrap { padding: 0; } /* HEADER ------------------------------------------------------- */ #header, #header * { box-sizing: border-box; } #header { position: relative; z-index: 99; height: 110px; } #header .logo { display: block; position: absolute; z-index: 100; bottom: 14px; left: 100px; width: 10.5em; height: 3.8em; background: transparent url('img/akron-community-foundation-logo.v2.png') 0 0 no-repeat; background-size: 100% 100%; text-indent: -9999em; font-size: 20px; } #header a.give-now { display: none; position: absolute; z-index: 1; top: 0; left: 0; height: 100%; width: 70px; background-color: #053b57; color: #fff; font-size: 0.75em; font-weight: 700; line-height: 1em; text-align: center; text-decoration: none; text-transform: uppercase; } #header a.give-now::before { content: 'f'; display: block; padding: 0.75em 0 0.65em; font-family: 'akron-community-foundation'; font-size: 1.5em; font-weight: 400; text-transform: none; } #header a.give-now span { display: block; width: 55px; margin: 0 auto; line-height: 1.2;} /* TOP NAVIGATION ----------------------------------------------- */ #top-navigation { overflow: hidden; position: absolute; z-index: 1; top: 13px; right: 36px; } #top-navigation .top-nav-container { float: right; } #top-navigation .top-nav-container > ul.menu { list-style-type: none; padding: 0; margin: 0 58px 0 0; } #top-navigation .top-nav-container > ul.menu > li { float: left; } #top-navigation .top-nav-container > ul.menu > li > a { display: block; position: relative; height: 3.1818em; padding: 0 2em; color: #053b57; font-size: 0.6875em; line-height: 3.1818em; font-weight: 700; text-decoration: none; text-transform: uppercase; } #top-navigation .top-nav-container > ul.menu > li.current-menu-item > a, #top-navigation .top-nav-container > ul.menu > li.current-menu-ancestor > a { color: #0a7d8a; } #top-navigation .top-nav-container > ul.menu > li > a:hover { text-decoration: underline; } #top-navigation .top-nav-container > ul.menu > li > a::after { content: ''; display: block; position: absolute; z-index: 1; top: 50%; right: 0; width: 1px; height: 1.0909em; margin-top: -0.5454em; background-color: #053b57; } #top-navigation .top-nav-container > ul.menu > li:last-child > a::after { display: none; } #top-navigation .top-nav-container > ul.menu > li ul { display: none; } #header-search { float: right; } #header-search #searchform { } #header-search #searchform > div { position: relative; width: 265px; height: 35px; } #header-search #searchform > div label { display: none; } #header-search #searchform > div input#s { position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 2.9166em; padding: 0 4.166em 0 1.25em; border: none; color: #000; font-size: 0.75em; line-height: 2.9166em; background-color: #e8edf1; } #header-search #searchform > div input#searchsubmit { position: absolute; z-index: 2; top: 0; right: 0; width: 38px; height: 2.9166em; margin: 0; border: none; border-radius: 0; font-size: 0.75em; text-indent: -9999em; background: rgba(10,125,138,1) url('img/icon-magnifying-glass.png') center center no-repeat; background-size: 1.5833em 1.5833em; -webkit-transition: background-color 200ms ease-out; -o-transition: background-color 200ms ease-out; -moz-transition: background-color 200ms ease-out; transition: background-color 200ms ease-out; } #header-search #searchform > div input#searchsubmit:hover { background-color: rgba(10,125,138,0.8); -webkit-transition: background-color 300ms ease-out; -o-transition: background-color 300ms ease-out; -moz-transition: background-color 300ms ease-out; transition: background-color 300ms ease-out; } /* BANNER ------------------------------------------------------- */ #banner, #banner * { box-sizing: border-box; } #banner { overflow: hidden; position: relative; z-index: 3; padding: 1em 135px; background: #0a7d8a url('img/spacer.gif') center center no-repeat; background-size: cover; font-size: 3.25em; box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25) inset; } #banner .content { } #banner .banner-text { text-align: center; } #banner .banner-title { margin: 0; color: #fff; font-size: 1em; font-style: italic; font-weight: 300; line-height: 1.13em; } #banner .banner-subtitle { padding-top: 1em; color: #fff; font-size: 0.30769em; font-weight: 300; line-height: 1.625em; } /* image banner */ #banner[class*='image-banner-'] { display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; min-height: 390px; padding: 60px 135px; } #banner[class*='image-banner-']::before, #banner[class*='image-banner-']::after { content: ''; display: block; position: absolute; z-index: 1; height: 21px; background: transparent url('img/hash-orange-1920.png') right top no-repeat; background-size: auto 100%; } #banner[class*='image-banner-']::before { right: 100%; top: 110px; width: 100px; margin-right: -65px; } #banner[class*='image-banner-']::after { left: 100%; bottom: 60px; width: 200px; margin-left: -170px; background-position: left top; } #banner[class*='image-banner-'] .content { } #banner[class*='image-banner-'] .banner-text { max-width: 400px; padding: 25px 35px; background-color: rgba(255,255,255,0.9); text-align: left; } .page-template-template-affiliate-fund-landing-page #banner[class*='image-banner-'] .banner-text { max-width: 500px; } #banner[class*='image-banner-'] .banner-title { color: #0a7d8a; } #banner[class*='image-banner-'] .banner-subtitle { color: #111; } /* CONTENT ------------------------------------------------------ */ #main { box-sizing: border-box; clear: both; position: relative; z-index: 1; } #main-wrap { box-sizing: border-box; } .content-container { display: flex; justify-content: center; max-width: 900px; margin: 0 auto; padding: 1.875rem;} /* SINGLE COLUMN ------------------------------------------------ */ #content { box-sizing: border-box; padding: 0; } #content .content-wrap p, #content .content-wrap ul, #content .content-wrap ol { font-weight: 300; } #content .content-wrap p { line-height: 1.625em; } #content .content-wrap ul, #content .content-wrap ol { line-height: 1.6875em; } #content .content-wrap ul li { margin: 0 0 0.5em; } #content .content-wrap ul.checkmarks { list-style-type: none; padding: 0; margin: 0; font-size: 1em; -webkit-column-count: 2; -o-column-count: 2; -moz-column-count: 2; column-count: 2; -webkit-column-span: none; -o-column-span: none; -moz-column-span: none; column-span: none; } #content .content-wrap ul.checkmarks li { display: block; position: relative; padding: 0 0 1.8em 2.5em; font-size: 1em; } #content .content-wrap ul.checkmarks li::before { content: 'j'; display: block; position: absolute; z-index: 1; left: 0; top: 0; font-family: 'akron-community-foundation'; color: #fb9334; font-size: 1.5em; } /* content wrap for special pages (e.g. search results, 404, etc.) */ #content .special-content-wrap { max-width: 1220px; padding: 50px 100px; margin: 0 auto; } /* home single column */ .home #content { padding: 0 !important; } /* DUAL-COLUMN -------------------------------------------------- */ body.sidebar #main-wrap { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row nowrap; -webkit-flex-flow: row nowrap; flex-flow: row nowrap; } body.sidebar #content { width: calc(100% - 300px); padding: 0 30px 0 0; } body.sidebar #sidebar { width: 300px; } /* BREADCRUMBS -------------------------------------------------- */ #breadcrumbs, #breadcrumbs * { box-sizing: border-box; } #breadcrumbs { } #breadcrumbs > span { display: block; max-width: 1220px; padding: 25px 100px; margin: 0 auto;} #breadcrumbs > span > span { } #breadcrumbs > span > span a { border-bottom: none; color: #000; font-weight: 300; text-decoration: underline; } #breadcrumbs > span > span a:hover { text-decoration: none; } #breadcrumbs > span > span span { font-weight: 300; } /* SIDEBAR: CATEGORY LISTING ------------------------------------ */ #sidebar .widget_categories { } #sidebar .widget_categories .widget-title { margin: 0 0 1em; font-weight: 700; } #sidebar .widget_categories ul { list-style-type: none; padding: 0; } #sidebar .widget_categories ul li { } #sidebar .widget_categories ul li a { } /* GRAVITY FORMS ------------------------------------------------ */ #content .gform_wrapper { box-sizing: border-box; max-width: 1220px; padding: 0 100px; margin: 0 auto; } body .gform_wrapper .gform_body .gform_fields .gfield .gfield_checkbox li input[type=checkbox], body .gform_wrapper .gform_body .gform_fields .gfield .gfield_radio li input[type=radio] { margin-top: -3px; } body .gform_wrapper .chosen-container-single .chosen-single { color: #313131; font-size: 0.875rem; font-weight: normal; } body .gform_wrapper .chosen-container .chosen-results, body .gform_wrapper .chosen-container .chosen-results li { color: #313131; font-size: 0.875rem; font-weight: normal; } body .gform_wrapper .gform_body .gform_fields .gfield .gfield_label { margin-top: 1.875em; } body .gform_wrapper.pretty-form_wrapper { margin: 0 auto 2rem; } body .gform_wrapper.pretty-form_wrapper .pretty-form { background-color: #edf1f3; padding: 1rem 2rem; border: 1px solid #0a7d8a; margin: 0 auto 60px; } body .gform_wrapper.pretty-form_wrapper .gform_body .gform_fields .gfield .gfield_label { color: #07435e; } body .gform_wrapper.pretty-form_wrapper .gform_body .gform_fields .gfield .ginput_container input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]) { padding-top: 8px; padding-left: 16px; padding-bottom: 8px; padding-right: 16px; border: 1px solid #0a7d8a; border-radius: 30px; } body .gform_wrapper.pretty-form_wrapper textarea { padding-left: 16px; padding-right: 16px; border: 1px solid #0a7d8a; border-radius: 30px; } /* STAY CONNECTED ----------------------------------------------- */ #stay-connected, #stay-connected * { box-sizing: border-box; } #stay-connected { overflow: hidden; background-color: #fff; } #stay-connected h3 { margin: 0; color: #0a7d8a; font-size: 3.25em; font-style: italic; font-weight: 400; } #stay-connected .content { position: relative; width: 100%; max-width: 1366px; padding: 0 500px 0 125px; margin: 0 auto; background: transparent url('img/stay-connected-bg.jpg') right 200px bottom no-repeat; background-size: 350px; } #stay-connected .content::after { content: ''; display: block; position: absolute; z-index: 1; left: 100%; bottom: 60px; height: 13px; width: 1920px; margin-left: -100px; background: transparent url('img/hash-orange-1920.png') left top no-repeat; background-size: auto 100%; } #stay-connected .form-container .cc-form-wrapper { width: 100%; margin: 0; } #stay-connected .form-container .cc-form-wrapper .cc-form { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row wrap; -webkit-flex-flow: row wrap; flex-flow: row wrap; justify-content: space-between; width: 100%; max-width: 650px; padding: 50px 0 100px; margin: 0; } #stay-connected .form-container .cc-form-wrapper .cc-form .cc-form-header { width: 100%; margin-bottom: 18px; } #stay-connected .form-container .cc-form-wrapper .cc-form .cc-form-body { width: 100%; } #stay-connected .form-container .cc-form-wrapper .cc-form .cc-form-body label { display: none; } #stay-connected .form-container .cc-form-wrapper .cc-form .cc-form-body input.cc-form-email { display: none; width: 100%; padding: 0.6em 1.25em 0.7em; margin: 0; min-height: 0; background-color: #fffefb; border: 1px solid #0a7d8a; border-radius: 2em; color: #111; font-size: 0.875em; font-weight: 300; line-height: 1em; } #stay-connected .form-container .cc-form-wrapper .cc-form .cc-form-body .cc-form-message { margin: 0 0 1em; color: #053B57; font-size: 1.25em; font-weight: 700; } #stay-connected .form-container .cc-form-wrapper .cc-form .cc-form-body .cc-form-message span { white-space: nowrap; } #stay-connected .form-container .cc-form-wrapper .cc-form .cc-form-footer { width: 100%; text-align: left; } #stay-connected .form-container .cc-form-wrapper .cc-form .cc-form-footer input.cc-form-submit { height: 3.333em; width: auto; border: none; border-radius: 2em; padding: 0 1.65em; margin: 0; background-color: #0a7d8a; color: #fff; font-size: 0.75em; font-weight: 700; line-height: 40px; text-transform: uppercase; cursor: pointer; -webkit-transition: background-color 300ms ease-in-out; -o-transition: background-color 300ms ease-in-out; -moz-transition: background-color 300ms ease-in-out; transition: background-color 300ms ease-in-out; } #stay-connected .form-container .cc-form-wrapper .cc-form .cc-form-footer input.cc-form-submit:hover { background-color: #053b57; -webkit-transition: background-color 300ms ease-in-out; -o-transition: background-color 300ms ease-in-out; -moz-transition: background-color 300ms ease-in-out; transition: background-color 300ms ease-in-out; } /* affiliate fund landing page tweaks */ body[class*='template-affiliate-fund'] #stay-connected .content, body.page-id-379 #stay-connected .content { padding: 0 125px; background-image: none; } body[class*='template-affiliate-fund'] #stay-connected .content::after, body.page-id-379 #stay-connected .content::after { display: none; } body[class*='template-affiliate-fund'] #stay-connected .form-container .cc-form-wrapper .cc-form, body.page-id-379 #stay-connected .form-container .cc-form-wrapper .cc-form { max-width: 100%; padding: 50px 0; } body[class*='template-affiliate-fund'] #stay-connected .form-container .cc-form-wrapper .cc-form .cc-form-header, body[class*='template-affiliate-fund'] #stay-connected .form-container .cc-form-wrapper .cc-form .cc-form-body, body[class*='template-affiliate-fund'] #stay-connected .form-container .cc-form-wrapper .cc-form .cc-form-footer, body.page-id-379 #stay-connected .form-container .cc-form-wrapper .cc-form .cc-form-header, body.page-id-379 #stay-connected .form-container .cc-form-wrapper .cc-form .cc-form-body, body.page-id-379 #stay-connected .form-container .cc-form-wrapper .cc-form .cc-form-footer { text-align: center; } body[class*='template-affiliate-fund'] #stay-connected .form-container .cc-form-wrapper .cc-form .cc-form-body .signal-title, body.page-id-379 #stay-connected .form-container .cc-form-wrapper .cc-form .cc-form-body .signal-title { display: none; } /* FOOTER ------------------------------------------------------- */ #footer, #footer * { box-sizing: border-box; } #footer { clear: both; position: relative; z-index: 1; background-color: #053b57; } #footer h3 { margin: 0 0 0.5em; color: #fff; font-size: 1.5em; font-style: italic; font-weight: 300; line-height: 1em; } #footer a { color: #fff; font-size: 0.975em; font-weight: 300; text-decoration: none; } #footer .top { padding: 50px 100px; color: #fff; font-size: 0.875em; font-weight: 300; } #footer .top .content { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row nowrap; -webkit-flex-flow: row nowrap; flex-flow: row nowrap; justify-content: space-between; width: 100%; } #footer .top [class*='col-'] { } #footer .top .vcard { line-height: 1.2em; } #footer .top .vcard .org, #footer .top .vcard .adr, #footer .top .vcard .street-address, #footer .top .vcard .tel, #footer .top .vcard .fax { display: block; margin: 0 0 0.75em; } #footer .top .vcard .adr { margin: 0 0 2.5em; } #footer .top .vcard .locality::after { content: ','; display: inline-block; margin: 0 0.25em 0 0; } #footer .top .vcard .tel::before, #footer .top .vcard .fax::before { content: 'Phone:'; display: inline-block; margin: 0 0.5em 0 0; } #footer .top .vcard .fax::before { content: 'Fax:'; } #footer .top nav { } #footer .top nav ul { list-style-type: none; padding: 0; margin: 0; } #footer .top nav ul ul { display: none; } #footer .top nav ul li { } #footer .top nav ul li a { display: block; margin: 0 0 0.75em; line-height: 1.2em; text-decoration: none; } #footer .top nav ul li a:hover { text-decoration: underline; } #footer .top nav ul li:last-child a { margin: 0; } #footer .top .col-1 { } #footer .top .col-1 a.logo { display: block; width: 205px; height: 75px; text-indent: -9999em; background: transparent url('img/akron-community-foundation-logo-white.v2.png') 0 0 no-repeat; background-size: 100% 100%; } #footer .top .col-2 { } #footer .top .col-3 { } #footer .top .col-4 { } #footer .top .col-5 { display: flex; flex-direction: column; } #footer .top .col-5 .seal { display: flex; gap: 15px; } #footer .top .col-5 .seal-item { height: 108px; width: 108px; } #footer .social-media { list-style-type: none; padding-top: 0; padding-right: 0; padding-bottom: 1rem; padding-left: 0; margin: 0; } #footer .social-media li { display: inline-block; } #footer .social-media li a { display: block; width: 1.5em; color: #fff; color: #fff; font-size: 2.25em; text-align: center; } #footer .social-media li a span.text { display: block; text-align: left; text-indent: -9999em; } #footer .bottom { padding: 1em 100px; background-color: #002c48; color: #fff; font-size: 0.875em; font-weight: 300; } #footer .bottom .content { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row nowrap; -webkit-flex-flow: row nowrap; flex-flow: row nowrap; justify-content: space-between; width: 100%; } #footer .bottom .links a { display: inline-block; padding: 0 2em; text-decoration: none; } #footer .bottom .links a:hover { text-decoration: underline; } /* ----------------------------------------------------------------- HOMEPAGE CONTENT ----------------------------------------------------------------- */ /* HOMEPAGE: BANNER --------------------------------------------- */ #hp-banner, #hp-banner * { box-sizing: border-box; } #hp-banner { overflow: hidden; position: relative; z-index: 3; padding: 30px 100px 50px; } #hp-banner::before, #hp-banner::after { content: ''; display: block; position: absolute; z-index: 1; height: 21px; width: 1920px; background: transparent url('img/hash-orange-1920.png') right top no-repeat; background-size: auto 100%; } #hp-banner::before { top: 70px; right: 100%; margin-right: -70px; } #hp-banner::after { bottom: 100px; left: 100%; margin-left: -80px; background-position: left top; } #hp-banner .content { position: relative; width: 100%; padding: 0; margin: 0 auto; } #hp-banner .row-top { position: relative; z-index: 1; min-height: 240px; margin-bottom: 10px; } #hp-banner .row-top .col-left { width: 40%; } #hp-banner .row-top .col-left .col-left-content { padding-right: 20px; } #hp-banner .row-top .col-left .col-left-content h1 { padding: 0.4em 0 0; margin: 0; color: #0a7d8a; font-size: 3.25em; line-height: 1em; } #hp-banner .row-top .col-left .col-left-content p { color: #111; font-size: 1em; font-weight: 300; } #hp-banner .row-top .col-right { position: absolute; z-index: 1; top: 0; right: 0; width: 28%; height: 100%; } #hp-banner .row-top .col-right .bg-image { position: absolute; z-index: 1; top: 0; right: 0; bottom: 0; left: 10px; border-radius: 10px; background: transparent url('img/spacer.gif') center center no-repeat; background-size: cover; } #hp-banner .row-top .hp-banner-feature { display: none; } /* duplicated in /js/global.js */ #hp-banner .row-bottom { position: relative; z-index: 1; height: 240px; } #hp-banner .row-bottom .col-left { position: absolute; z-index: 1; top: 0; left: 0; height: 100%; width: 40%; } #hp-banner .row-bottom .col-left .bg-image { position: absolute; z-index: 1; top: 0; right: 10px; bottom: 0; left: 0; border-radius: 10px; background: transparent url('img/spacer.gif') center center no-repeat; background-size: cover; } #hp-banner .row-bottom .col-right { position: absolute; z-index: 1; top: 0; right: 0; height: 100%; width: 28%; } #hp-banner .row-bottom .col-right .bg-image { position: absolute; z-index: 1; top: 0; right: 0; bottom: 0; left: 10px; border-radius: 10px; background: transparent url('img/spacer.gif') center center no-repeat; background-size: cover; } #hp-banner .hp-banner-feature { overflow: hidden; position: absolute; z-index: 2; top: 0; bottom: 0; left: 40%; width: 32%; border-radius: 10px; } #hp-banner .hp-banner-feature .hpbf-wrap { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row nowrap; -webkit-flex-flow: row nowrap; flex-flow: row nowrap; align-items: flex-end; position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; background: transparent url('img/spacer.gif') center center no-repeat; background-size: cover; color: #fff; text-decoration: none; } #hp-banner .hp-banner-feature .hpbf-wrap .hpbf-cta { display: block; width: 100%; padding: 1.5em 1em; font-size: 1em; text-align: center; /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0+0,1+69 */ background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 80%, rgba(0,0,0,1) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 80%,rgba(0,0,0,1) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 80%,rgba(0,0,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=0 ); /* IE6-9 */ } #hp-banner .hp-banner-feature .hpbf-wrap .hpbf-cta .hpbf-title { display: block; color: #fff; font-size: 1.25em; font-weight: 900; text-transform: uppercase;} #hp-banner .hp-banner-feature .hpbf-wrap .hpbf-cta .hpbf-caption { display: block; margin: 0.1em 0 0; color: #fff; font-size: 0.75em; font-weight: 500; } #hp-banner .hp-banner-feature .hpbf-wrap .hpbf-cta .btn { margin-top: 1.25em; } #hp-banner .row-top .hp-banner-feature { display: none; } /* HOMEPAGE: TEXT AREAS ----------------------------------------- */ .hp-text, .hp-text * { box-sizing: border-box; } .hp-text { text-align: center; } .hp-text .content { width: 100%; max-width: 1000px; padding: 50px 100px 40px; margin: 0 auto; } .hp-text h2 { position: relative; padding: 0; margin: 0; font-size: 2.375em; line-height: 1em; } .hp-text h2::after { content: ''; display: block; height: 1em; margin: 1.5em 0 2em; font-size: 12px; background: transparent url('img/hash-orange-900.png') center top no-repeat; background-size: auto 100%; } .hp-text p { font-size: 1em; font-weight: 300; line-height: 1.5em; } .hp-text p a { display: inline-block; border-bottom: 1px solid; color: #125359; font-weight: 500; text-decoration: none; } .hp-text p a:hover { border-bottom: 1px solid rgba(26,134,146,0) } /* HOMEPAGE: START YOUR JOURNEY --------------------------------- */ /* CTA BUTTON SECTION ------------------------------------------- */ .cta-button-section, .cta-button-section * { box-sizing: border-box; } .cta-button-section { overflow: hidden; padding: 0 0 40px; border-bottom: 15px solid #fb9334; background-color: #f2f5f6; } .cta-button-section .content { padding: 0 80px; } .cta-button-section h2 { position: relative; padding: 2em 0; margin: 0; color: #003d59; font-size: 1.625em; font-style: italic; text-align: center; } .cta-button-section h2::before, .cta-button-section h2::after { content: ''; display: block; opacity: 0.8; position: absolute; z-index: 1; top: 50%; height: 12px; width: 100%; margin-top: -6px; background: transparent url('img/hash-orange-1920.png') center top no-repeat; background-size: auto 100%; } .cta-button-section h2::before { right: 50%; margin-right: 13em; background-position: right top; } .cta-button-section h2::after { left: 50%; margin-left: 13em; background-position: left top; } .cta-button-section ul, #content .content-wrap .cta-button-section ul { list-style-type: none; padding: 0; margin: 0; text-align: center; } .cta-button-section ul li, #content .content-wrap .cta-button-section ul li { display: inline-block; padding: 0 20px; margin: 0 0 20px; } #content .content-wrap .cta-button-section ul li::before { display: none; } .cta-button-section ul li a, #content .content-wrap .cta-button-section ul li a { display: block; padding: 1em 2em; border-radius: 2em; color: #fff; font-size: 1em; font-weight: 700; text-decoration: none; background-color: #053b57; -webkit-transition: background-color 200ms ease-in-out; -o-transition: background-color 200ms ease-in-out; -moz-transition: background-color 200ms ease-in-out; transition: background-color 200ms ease-in-out; } .cta-button-section ul li a:hover, #content .content-wrap .cta-button-section ul li a:hover { background-color: #0a7d8a; -webkit-transition: background-color 300ms ease-in-out; -o-transition: background-color 300ms ease-in-out; -moz-transition: background-color 300ms ease-in-out; transition: background-color 300ms ease-in-out; } /* CTA ICON SECTION --------------------------------------------- */ .cta-icon-section, .cta-icon-section * { box-sizing: border-box; } .cta-icon-section { width: 100%; max-width: 1220px; padding: 25px 100px 20px; margin: 0 auto; } .cta-icon-section .content { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row wrap; -webkit-flex-flow: row wrap; flex-flow: row wrap; justify-content: center; } .cta-icon-section .content .cta-icon { display: block !important; width: 25%; padding: 0 10px; border: none !important; margin: 0 0 30px; text-align: center; text-decoration: none; } .cta-icon-section .content .cta-icon:first-child { padding-left: 0; } .cta-icon-section .content .cta-icon:last-child { padding-right: 0; } .cta-icon-section .content .cta-icon .cta-image { display: block; height: 70px; margin: 0 0 10px; } .cta-icon-section .content .cta-icon .cta-image::before { content: ''; display: block; font-family: 'akron-community-foundation'; color: #fe6625; font-size: 48px; text-transform: none; -webkit-transition: color 200ms ease-in-out; -o-transition: color 200ms ease-in-out; -moz-transition: color 200ms ease-in-out; transition: color 200ms ease-in-out; } .cta-icon-section .content .cta-icon:hover .cta-image::before { color: #8d380d; -webkit-transition: color 300ms ease-in-out; -o-transition: color 300ms ease-in-out; -moz-transition: color 300ms ease-in-out; transition: color 300ms ease-in-out; } .cta-icon-section .content .cta-icon .cta-image.dollar-sign::before { content: 'l'; } .cta-icon-section .content .cta-icon .cta-image.application::before { content: 'k'; } .cta-icon-section .content .cta-icon .cta-image.gift-box::before { content: 'f'; } .cta-icon-section .content .cta-icon .cta-title { display: block; max-width: 250px; margin: 0 auto; color: #053b57; font-size: 1.125em; font-weight: 700; line-height: 1.33em; text-transform: uppercase; } /* ----------------------------------------------------------------- PERSONNEL CONTENT ----------------------------------------------------------------- */ /* PERSONNEL: INDIVIDUAL ITEMS ---------------------------------- */ .personnel-member, .personnel-member * { box-sizing: border-box; } .personnel-member { color: #104963; font-size: 1em; text-decoration: none; } .personnel-member .personnel-photo { display: block; overflow: hidden; position: relative; width: 100%; height: 0; padding-bottom: 100%; } .personnel-member .personnel-photo img { display: block; position: absolute; z-index: 1; top: 0; left: 0; width: 100%; } .personnel-member .personnel-info { position: relative; display: block; padding: 1em 1.25em 2em; min-height: 6.5em; font-size: 1em;} a.personnel-member .personnel-info::before { content: ''; display: block; position: absolute; z-index: 1; bottom: 0.75em; right: 1.25em; height: 11px; width: 31px; background: transparent url('img/arrow-orange.png') right bottom no-repeat; background-size: 100% 100%; font-size: 1em; -webkit-transition: right 300ms ease-in-out; -o-transition: right 300ms ease-in-out; -moz-transition: right 300ms ease-in-out; transition: right 300ms ease-in-out; } a.personnel-member:hover .personnel-info::before { right: 0.75em; -webkit-transition: right 200ms ease-in-out; -o-transition: right 200ms ease-in-out; -moz-transition: right 200ms ease-in-out; transition: right 200ms ease-in-out; } .personnel-member .personnel-info .personnel-name { display: block; position: relative; font-size: 1em; font-weight: 700; } .personnel-member .personnel-info .personnel-name > span { display: inline-block; position: relative; z-index: 2; padding-right: 0.1em; font-size: 1em; line-height: 1em; } .personnel-member .personnel-info .personnel-title { display: block; font-size: 0.75em; font-weight: 300; } .personnel-member .personnel-info, .personnel-member .personnel-info .personnel-name > span { background-color: #f2f5f7; -webkit-transition: background-color 300ms ease-in-out; -o-transition: background-color 300ms ease-in-out; -moz-transition: background-color 300ms ease-in-out; transition: background-color 300ms ease-in-out; } a.personnel-member:hover .personnel-info, a.personnel-member:hover .personnel-info .personnel-name > span { background-color: #d9e2e7; -webkit-transition: background-color 300ms ease-in-out; -o-transition: background-color 300ms ease-in-out; -moz-transition: background-color 300ms ease-in-out; transition: background-color 300ms ease-in-out; } /* PERSONNEL: CAROUSELS ----------------------------------------- */ #personnel-carousels { } #personnel-carousels.acf-custom-block { padding-top: 0; } #personnel-carousels .personnel-carousels-wrap { width: 100%; max-width: 1366px; padding: 0; margin: 0 auto; } #personnel-carousels .personnel-carousel-container { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row nowrap; -webkit-flex-flow: row nowrap; flex-flow: row nowrap; margin: 0 0 30px; } #personnel-carousels .personnel-carousel-header { width: 235px; padding-top: 20px; } #personnel-carousels .personnel-carousel-header .content { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: column wrap; -webkit-flex-flow: column wrap; flex-flow: column wrap; align-items: flex-start; justify-content: center; height: 225px; padding: 0 0 0 40px; background-color: #f2f5f7; } #personnel-carousels .personnel-carousel-header h3 { margin: 0 0 0.5em; color: #003d59; font-size: 1.875em; font-style: italic; font-weight: 400; } #personnel-carousels .personnel-carousel-header a.btn { } #personnel-carousels .personnel-carousel { box-sizing: border-box; width: calc(100% - 235px); padding: 0 100px; } #personnel-carousels.advisory-board .custom-personnel-copy { max-width: 1020px; margin: 0 auto 30px; } #personnel-carousels.advisory-board .custom-personnel-copy.narrow-width { max-width: 700px; } #personnel-carousels.advisory-board .custom-personnel-copy *:first-child { margin-top: 0; } #personnel-carousels.advisory-board .custom-personnel-copy *:last-child { margin-bottom: 0; } #personnel-carousels.advisory-board .personnel-carousel { width: 100% !important; } #personnel-carousels .personnel-carousel .content, #personnel-carousels .personnel-carousel .slick-slider { } #personnel-carousels .personnel-carousel .slick-slider .slick-prev, #personnel-carousels .personnel-carousel .slick-slider .slick-next { top: 130px; width: 40px; height: 40px; } #personnel-carousels .personnel-carousel .slick-slider .slick-prev { left: -65px; } #personnel-carousels .personnel-carousel .slick-slider .slick-next { right: -65px; } #personnel-carousels .personnel-carousel .slick-slider .slick-prev::before, #personnel-carousels .personnel-carousel .slick-slider .slick-next::before { color: #003d59; font-family: 'akron-community-foundation'; font-size: 40px; opacity: 1; } #personnel-carousels .personnel-carousel .slick-slider .slick-prev:hover::before, #personnel-carousels .personnel-carousel .slick-slider .slick-next:hover::before { color: #0a7d8a; } #personnel-carousels .personnel-carousel .slick-slider .slick-prev::before { content: 'b'; } #personnel-carousels .personnel-carousel .slick-slider .slick-next::before { content: 'c'; } #personnel-carousels .personnel-carousel .slick-slider .slick-list { } #personnel-carousels .personnel-carousel .slick-slider .slick-list .slick-track { } #personnel-carousels .personnel-carousel .personnel-member-container, #personnel-carousels .personnel-carousel .personnel-member-container * { box-sizing: border-box; } #personnel-carousels .personnel-carousel .personnel-member-container { padding: 0 8px; } #personnel-carousels .personnel-carousel .personnel-member-container .personnel-member { display: block; border: none; } /* PERSONNEL: LANDING PAGES ------------------------------------- */ .personnel-section, .personnel-section * { box-sizing: border-box; } .personnel-section { padding: 50px 0 15px; background-color: #fff; } .personnel-section .content { width: 100%; max-width: 1200px; padding: 0 80px; margin: 0 auto; } .personnel-section h2 { position: relative; padding: 0 20px; margin: 0; color: #053b57; font-size: 2.375em; line-height: 1em; } .personnel-section h2::after { content: ''; display: block; height: 1em; margin: 1em 0 2.25em; font-size: 12px; background: transparent url('img/hash-orange-900.png') left top no-repeat; background-size: auto 100%; } .personnel-section .personnel-list { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row wrap; -webkit-flex-flow: row wrap; flex-flow: row wrap; position: relative; width: 100%; } .personnel-section .personnel-list .personnel-member-container { width: 260px; padding: 0 20px 35px; } .personnel-section .personnel-list .personnel-member { } .page-template-page-personnel-listing #content .personnel-section:nth-child(even) { background-color: #edf1f3; } .page-template-page-personnel-listing #content .personnel-section:nth-child(even) .personnel-list .personnel-member .personnel-info { background-color: #e1e8eb; } .page-template-page-personnel-listing #content .personnel-section:nth-child(even) .personnel-list .personnel-member .personnel-info .personnel-name > span { background-color: #e1e8eb; } .personnel-content { box-sizing: border-box; width: 100%; max-width: 1200px; padding: 0 100px; margin: 0 auto; } .personnel-content > *:first-child { margin-top: 0; } .page-id-68 .accordion-wrap { max-width: 1200px; } /* PERSONNEL: INDIVIDUAL BIO PAGES ------------------------------ */ .personnel-wrap, .personnel-wrap * { box-sizing: border-box; } .personnel-wrap { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row nowrap; -webkit-flex-flow: row nowrap; flex-flow: row nowrap; width: 100%; max-width: 1200px; padding: 100px; margin: 0 auto; } .personnel-wrap .personnel-image { width: 500px; padding-right: 100px; } .personnel-wrap .personnel-image img { display: block; width: 100%; } .personnel-wrap .personnel-info { width: calc(100% - 500px); } .personnel-wrap .personnel-info.no-photo { width: 100%; } .personnel-wrap .personnel-info .personnel-header { margin-bottom: 2em; } .personnel-wrap .personnel-info h1 { margin: 0; color: #053b57; font-size: 2.375em; font-style: italic; } .personnel-wrap .personnel-info .personnel-title { margin: 0 0 0.5em; color: #000; font-size: 1.25em; font-weight: 700; text-transform: uppercase; } .personnel-wrap .personnel-info .personnel-phone a, .personnel-wrap .personnel-info .personnel-email a { color: #000; font-size: 1em; font-weight: 700; text-decoration: underline; } .personnel-wrap .personnel-info .personnel-phone { } .personnel-wrap .personnel-info .personnel-phone a { text-decoration: none; } .personnel-wrap .personnel-info .personnel-email { } .personnel-wrap .personnel-info .personnel-email a { } .personnel-wrap .personnel-info h2 { margin: 0; color: #053b57; font-size: 1.625em; } .personnel-wrap .personnel-info p { margin: 0 0 2em; font-size: 1em; font-weight: 300; line-height: 1.65em; } #content .personnel-wrap .personnel-email-btn{ cursor: pointer; display: flex; gap: 10px; align-items: center;} #content .personnel-wrap .personnel-email-btn:after{content: 'p'; transform: rotate(180deg); transition: all 0.3s ease; display: inline-flex;color: #f2f5f7;font-family: 'akron-community-foundation';font-size: 15px;text-transform: none;} #content .personnel-wrap .personnel-email-btn.active:after{content: 'p'; transform: rotate(0deg);} #content .personnel-wrap .personnel-email-form{position: relative;} #content .personnel-wrap .personnel-email-form .gform_wrapper { margin: 0; padding: 0; display: none; z-index: 2; position: relative; } #content .personnel-wrap .personnel-email-form .gform_wrapper .gfield_label{ margin: 0 0 0.5em; font-size: 1em; font-weight: 700; } #content .personnel-wrap .personnel-email-form .gform_required_legend { display: none; } /* ----------------------------------------------------------------- PUBLICATIONS CONTENT ----------------------------------------------------------------- */ /* PUBLICATIONS PAGE -------------------------------------------- */ .pubs-current, .pubs-current *, .pubs-archive, .pubs-archive * { box-sizing: border-box; } .pubs-current, .pubs-archive { width: 100%; max-width: 770px; margin: 0 auto; } .pubs-current.pubs-current__block { max-width: 875px; } .pubs-current { padding: 0 5px; text-align: center; } .pubs-current .pub-content { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row nowrap; -webkit-flex-flow: row nowrap; flex-flow: row nowrap; } .pubs-current .item { text-decoration: none; } .pubs-current .item .thumbnail { display: block; height: 0; border: none; background: #fff url('img/spacer.gif') center top no-repeat; background-size: cover; text-align: left; text-indent: -9999em; } .pubs-current .item .caption { display: block; padding: 1.5em 0; color: rgba(10,125,138,1); font-size: 0.75em; font-weight: 700; text-transform: uppercase; } .pubs-current .item.empty .thumbnail { border: 1px solid rgba(10,125,138,0.4); background: #fff url('img/tree-logo-white.png') center center no-repeat; background-size: 48% auto; } .pubs-current .item.empty .caption { color: rgba(10,125,138,0.6); } .pubs-current .pub-year { padding: 60px 0 0; } .pubs-current .pub-year::after { content: ''; display: block; height: 15px; width: 90%; margin: 60px auto 0; background: transparent url('img/hash-orange-900.png') center top no-repeat; background-size: 100% auto; } .pubs-current .pub-year .pub-mags { margin-bottom: 40px; } .pubs-current .pub-year .pub-mags h2 { } .pubs-current .pub-year .pub-mags .pub-content { } .pubs-current .pub-year .pub-mags .pub-mag { width: 50%; padding: 0 35px; } .pubs-current .pub-year .pub-mags .pub-mag .item { } .pubs-current .pub-year .pub-mags .pub-mag .item .thumbnail { padding-bottom: 115%; } .pubs-current .pub-year .pub-mags .pub-mag .item .caption { } .pubs-current .pub-year .pub-enews { padding: 0 20px; } /* 20px is to make the 15px item padding equal the 35px of .pub-mag */ .pubs-current .pub-year .pub-enews h2 { } .pubs-current .pub-year .pub-enews .pub-content { } .pubs-current .pub-year .pub-enews .pub-enew { width: 25%; padding: 0 15px; } .pubs-current .pub-year .pub-enews .pub-enew .item { } .pubs-current .pub-year .pub-enews .pub-enew .item .thumbnail { padding-bottom: 135%; } .pubs-current .pub-year .pub-enews .pub-enew .item .caption { } .pubs-archive-intro, .pubs-archive-intro * { box-sizing: border-box; } .pubs-archive-intro { width: 100%; max-width: 770px; padding: 80px 40px 70px; margin: 0 auto; text-align: center; } .pubs-archive-intro h2 { margin: 0; } .pubs-archive-intro p { } .accordion-container.pubs-archive { padding: 0 40px 60px } .accordion-container .accordion-section .accordion-section-content-wrap .accordion-section-content ul.pub-archive { list-style-type: none; padding: 15px 0; margin: 0; } .accordion-container .accordion-section .accordion-section-content-wrap .accordion-section-content ul.pub-archive li { padding: 0 60px; } .accordion-container .accordion-section .accordion-section-content-wrap .accordion-section-content ul.pub-archive li a { display: block; padding: 0.75em 0; color: #053b57; text-decoration: underline; } /* ----------------------------------------------------------------- POST PAGES ----------------------------------------------------------------- */ /* POST LISTS --------------------------------------------------- */ .post-list, .post-list * { box-sizing: border-box; } .post-list { max-width: 1220px; padding: 50px 100px; margin: 0 auto; } .post-list article.post-item { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row nowrap; -webkit-flex-flow: row nowrap; flex-flow: row nowrap; padding-bottom: 2em; border-bottom: 1px solid #ccc; margin-bottom: 2em; } .post-list article.post-item:last-child { padding-bottom: 0; border-bottom: none; margin-bottom: 0; } .post-list article.post-item .post-content { width: 100%; } .post-list article.post-item.has-post-thumbnail { } .post-list article.post-item.has-post-thumbnail .post-thumbnail { width: 200px; } .post-list article.post-item.has-post-thumbnail .post-thumbnail a { border: none !important; } .post-list article.post-item.has-post-thumbnail .post-thumbnail a img { display: block; max-width: 100%; } .post-list article.post-item.has-post-thumbnail .post-content { width: calc(100% - 200px); padding-left: 30px; } .post-list article.post-item .post-content .post-title { margin: 0 0 0.5em; } #content .post-list article.post-item .post-content .post-title h2 { font-family: 'Noto Sans HK', sans-serif; font-size: 1.375em; font-style: normal; line-height: 1.5; margin-top: 0; } #content .post-list article.post-item .post-content .post-title a { display: block; border-bottom: none; margin: 0 0 0.8em; text-decoration: underline; } #content .post-list article.post-item .post-content .post-title a:hover { text-decoration: none; } .post-list article.post-item .post-content .post-date { margin: 0 0 0.5em; } .post-list article.post-item .post-content .post-category { margin: 0 0 1em; } .post-list article.post-item .post-content .post-category a { display: inline-block; padding-right: 0.5em; border-right: 1px solid #000; margin-right: 0.5em; line-height: 1em; } .post-list article.post-item .post-content .post-category a:last-child { padding-right: 0; border-right: none; margin-right: 0; } .post-list article.post-item .post-content .post-category a:last-child { } .post-list article.post-item .post-content .post-excerpt { margin: 0 0 1.5em; font-weight: 300; } .post-list article.post-item .post-content .post-more { } .post-list article.post-item .post-content .post-more .btn { } /* PAGINATION --------------------------------------------------- */ .post-list-pagination { padding: 0 100px 50px; } .post-list-pagination .navigation { } .post-list-pagination .navigation h2 { display: none; } .post-list-pagination .nav-links { text-align: center; } .post-list-pagination .page-numbers { display: inline-block; padding: 0 0.2em; margin: 0 0.1em; font-size: 1.375em; } .post-list-pagination .page-numbers.current { font-weight: 700; } .post-list-pagination .page-numbers.next { } .post-list-pagination .page-numbers.prev { } /* POST PAGES --------------------------------------------------- */ .post-body { box-sizing: border-box; max-width: 1220px; padding: 50px 100px; margin: 0 auto; } .post-body .post-title { margin-top: 0; } .post-body .post-date { font-weight: 500;} .post-body .post-categories { margin-top: 0.75em; } .post-body .post-categories .post-categories-title { display: inline-block; font-weight: 700; } .post-body .post-categories .post-category { margin-left: 0.3em; } .post-body .post-categories a { } .post-body .post-date + p, .post-body .post-categories + p { margin-top: 3em; } .post-body p { } .content-wrap .post-body .gutenberg-wrap { max-width: 100%; padding: 0; margin: 0; } /* EVENTS LISTING ----------------------------------------------- */ .events-listing, .events-listing * { box-sizing: border-box; } .events-listing { } .events-listing .event-item { width: 100%; max-width: 700px; margin: 0 auto; } .events-listing .event-item .event-title { text-align: center; } .events-listing .event-item .event-title::after { content: ''; display: block; height: 1em; margin: 1em 0 0; font-size: 12px; background: transparent url(img/hash-orange-1420.png) center top no-repeat; background-size: auto 98%; } .events-listing .event-item .event-details { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row nowrap; -webkit-flex-flow: row nowrap; flex-flow: row nowrap; padding: 0 40px; } .events-listing .event-item .event-details .event-details-left { width: calc(100% - 250px); font-size: 1em; } .events-listing .event-item .event-details.no-thumbnail .event-details-left { width: 100%; } .events-listing .event-item .event-details .event-details-left .event-start-date { font-weight: 700; } .events-listing .event-item .event-details .event-details-left .event-start-time { } .events-listing .event-item .event-details .event-details-left .event-location { } .events-listing .event-item .event-details .event-details-left .event-fund-affiliation { } .events-listing .event-item .event-details .event-details-left .event-website { padding: 30px 0 0; } .events-listing .event-item .event-details .event-details-left .event-website a { } .events-listing .event-item .event-details .event-details-right { width: 250px; } .events-listing .event-item .event-details .event-details-right .event-thumbnail { width: 100%; padding: 0 10px; } .events-listing .event-item .event-details .event-details-right .event-thumbnail img { display: block; width: 100%; } .events-listing .event-item .event-description { clear: both; padding: 25px 40px; } .events-listing .event-item .event-description .gutenberg-wrap { max-width: 100% !important; padding: 0 !important; margin: 0 !important; } .events-listing .event-item .event-description .gutenberg-wrap:first-child *:first-child { margin-top: 0; } /* ----------------------------------------------------------------- REUSABLE GLOBAL SECTIONS ----------------------------------------------------------------- */ /* GLOBAL STYLES ------------------------------------------------ */ .acf-custom-block { padding: 50px 100px; } .acf-custom-block.acb-first { padding-top: 50px; } .acf-custom-block.acb-last { padding-bottom: 50px; } /* ACCORDION ---------------------------------------------------- */ .acf-custom-block.accordion-wrap { padding-top: 0; padding-bottom: 30px; } /* ACF BY THE NUMBERS ------------------------------------------- */ #acf-by-the-numbers, #acf-by-the-numbers * { box-sizing: border-box; } #acf-by-the-numbers { overflow: hidden; position: relative; background: #000 url('img/blue-spots-bg.jpg') center center no-repeat; background-size: cover; padding: 0 0 2.6315em; font-size: 38px; } #acf-by-the-numbers.acf-custom-block { padding: 0 0 2.6315em; } #acf-by-the-numbers::after { content: ''; display: block; opacity: 0.8; position: absolute; z-index: 1; left: 0; bottom: 0.921em; height: 0.421em; width: 100%; background: transparent url('img/hash-green-bg.png') center top repeat-x; background-size: auto 100%; } #acf-by-the-numbers h2::before { right: 50%; margin-right: 5.25em; background-position: right top; } #acf-by-the-numbers h2::after { left: 50%; margin-left: 5.25em; background-position: left top; } #acf-by-the-numbers .content { } #acf-by-the-numbers h2 { position: relative; padding: 1em 20px; margin: 0; color: #fff; font-size: 38px; font-style: italic; text-align: center; } #acf-by-the-numbers h2::before, #acf-by-the-numbers h2::after { content: ''; display: block; opacity: 0.8; position: absolute; z-index: 1; top: 50%; height: 0.421em; width: 100%; margin-top: -0.13157em; background: transparent url('img/hash-green-1920.png') center top no-repeat; background-size: auto 100%; } #acf-by-the-numbers h2::before { right: 50%; margin-right: 5.25em; background-position: right top; } #acf-by-the-numbers h2::after { left: 50%; margin-left: 5.25em; background-position: left top; } #acf-by-the-numbers .sections { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row wrap; -webkit-flex-flow: row wrap; flex-flow: row wrap; justify-content: center; width: 100%; max-width: 1150px; margin: 0 auto; } #acf-by-the-numbers .sections [class*='section-'] { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: column nowrap; -webkit-flex-flow: column nowrap; flex-flow: column nowrap; width: 20%; color: #fff; text-align: center; } #acf-by-the-numbers .sections [class*='section-'] .top { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row nowrap; -webkit-flex-flow: row nowrap; flex-flow: row nowrap; align-items: flex-start; justify-content: center; height: 13em; padding-bottom: 0.5em; font-size: 10px; text-align: center; text-transform: uppercase; } #acf-by-the-numbers .sections [class*='section-'] .bottom { font-size: 16px; font-style: italic; line-height: 1.1em; } #acf-by-the-numbers .sections [class*='section-'] .bottom .msg { display: block; width: 100%; max-width: 170px; padding: 0 10px; margin: 0 auto; } #acf-by-the-numbers .sections .section-1 { } #acf-by-the-numbers .sections .section-1 .top { } #acf-by-the-numbers .sections .section-1 .top .first { font-size: 2em; font-weight: 100; } #acf-by-the-numbers .sections .section-1 .top .qty { font-size: 5em; font-weight: 700; line-height: 1em; } #acf-by-the-numbers .sections .section-1 .top .qty strong { font-weight: 700; } #acf-by-the-numbers .sections .section-1 .top .final { font-size: 2.5em; font-weight: 700; } #acf-by-the-numbers .sections .section-2 { } #acf-by-the-numbers .sections .section-2 .top .first { font-size: 2em; font-weight: 100; } #acf-by-the-numbers .sections .section-2 .top .qty { font-size: 5.8em; font-weight: 100; line-height: 1.2; } #acf-by-the-numbers .sections .section-2 .top .qty strong { font-size: 1.1379em; font-weight: 900; } #acf-by-the-numbers .sections .section-2 .top .final { font-size: 2.5em; font-weight: 700; } #acf-by-the-numbers .sections .section-3 .top { } #acf-by-the-numbers .sections .section-3 .top .first { font-size: 2em; font-weight: 100; } #acf-by-the-numbers .sections .section-3 .top .qty { font-size: 5em; font-weight: 100; line-height: 1em; } #acf-by-the-numbers .sections .section-3 .top .qty strong { font-weight: 700; } #acf-by-the-numbers .sections .section-3 .top .final { font-size: 2.5em; font-weight: 700; } #acf-by-the-numbers .sections .section-4 { } #acf-by-the-numbers .sections .section-4 .top .first { font-size: 4em; font-weight: 100; line-height: 1; } #acf-by-the-numbers .sections .section-4 .top .qty { font-size: 4.6em; font-weight: 900; line-height: 1.6em; } #acf-by-the-numbers .sections .section-4 .top .qty strong { font-weight: 700; } #acf-by-the-numbers .sections .section-4 .top .final { font-size: 2.5em; font-weight: 700; } #acf-by-the-numbers .sections .section-5 { } #acf-by-the-numbers .sections .section-5 .top .qty { font-size: 5.8em; font-weight: 100; letter-spacing: -2px; } #acf-by-the-numbers .sections .section-5 .top .qty strong { font-size: 1.1379em; font-weight: 900; } #acf-by-the-numbers .sections .section-5 .top .final { font-size: 2.5em; font-weight: 700; } /* affiliate funds templates */ #acf-by-the-numbers.aflp-btn { padding-bottom: 4.25em; font-size: 1em; } #acf-by-the-numbers.aflp-btn::after { height: 1em; bottom: 2.1875em; } #acf-by-the-numbers.aflp-btn .sections { } #acf-by-the-numbers.aflp-btn .sections [class*='section-'] { width: 18em; margin: 0 0 2em; font-size: 1em; } #acf-by-the-numbers.aflp-btn .sections .section-founding { width: 13em; } #acf-by-the-numbers.aflp-btn .sections [class*='section-'] .top { height: auto; padding-bottom: 1.5em; font-size: 1em; } #acf-by-the-numbers.aflp-btn .sections [class*='section-'] .top .top-wrap { } #acf-by-the-numbers.aflp-btn .sections [class*='section-'] .top .top-wrap .first { font-size: 1.25em; font-weight: 100; } #acf-by-the-numbers.aflp-btn .sections [class*='section-'] .top .top-wrap .qty { font-size: 3.125em; font-weight: 700; line-height: 1em; } #acf-by-the-numbers.aflp-btn .sections [class*='section-'] .bottom { font-size: 1em; } #acf-by-the-numbers.aflp-btn .sections [class*='section-'] .bottom .msg { } /* COLOR BAR DIVIDER -------------------------------------------- */ .color-bar-divider, .color-bar-divider * { box-sizing: border-box; } .color-bar-divider { height: 19px; background: #0a7d8a url('img/color-bar-rule-bg.png') center top repeat-y; } .color-bar-divider img { display: block; width: 100%; max-width: 1366px; margin: 0 auto; } /* CHECKLIST SECTION -------------------------------------------- */ .checklist-section, .checklist-section * { box-sizing: border-box; } .checklist-section { background-color: #fff; } .checklist-section.white-bg { background-color: #fff; } .checklist-section.grey-bg { background-color: #e8edf1; } .checklist-section .checklist-section-wrap { max-width: 1020px; margin: 0 auto; } .checklist-section .checklist-section-wrap .checklist-section-title { } .checklist-section .checklist-section-wrap .checklist-section-title h2 { text-align: center; } .checklist-section .checklist-section-wrap .checklist-section-title h2::after { } .checklist-section .checklist-section-wrap .checklist-section-content { } .checklist-section .checklist-section-wrap .checklist-section-content *:first-child { margin-top: 0; } .checklist-section .checklist-section-wrap .checklist-section-content *:last-child { margin-bottom: 0; } .checklist-section .checklist-section-wrap .checklist-section-content ul { list-style-type: none; padding: 0; margin: 0; font-size: 1em; -webkit-column-count: 2; -o-column-count: 2; -moz-column-count: 2; column-count: 2; -webkit-column-span: none; -o-column-span: none; -moz-column-span: none; column-span: none; } .checklist-section .checklist-section-wrap .checklist-section-content ul li { display: block; position: relative; padding: 0 0 3em 2.5em; font-size: 1em; } .checklist-section .checklist-section-wrap .checklist-section-content ul li::before { content: 'j'; display: block; position: absolute; z-index: 1; left: 0; top: 0; font-family: 'akron-community-foundation'; color: #fb9334; font-size: 1.5em; } /* CUSTOM H2 ---------------------------------------------------- */ .custom-h2, .custom-h2 * { box-sizing: border-box; } .custom-h2 { width: 100%; max-width: 1220px; padding: 0 100px; margin: 0 auto; } .custom-h2.acf-custom-block { padding: 0 100px; } .custom-h2 h2 { position: relative; padding: 25px 0; margin: 0 auto; font-size: 2.375em; line-height: 1em; text-align: center; } .custom-h2.underline-title h2 { margin: 0 auto; } .custom-h2.underline-title h2::after { content: ''; display: block; height: 1em; margin: 1em 0 0; font-size: 12px; background: transparent url(img/hash-orange-900.png) center top no-repeat; background-size: auto 100%; } /* DOWNLOAD CTA ------------------------------------------------- */ #content .content-wrap .download-cta, #content .content-wrap .download-cta * { box-sizing: border-box; } #content .content-wrap .download-cta { } #content .content-wrap .download-cta .download-cta-wrap { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: column nowrap; -webkit-flex-flow: column nowrap; flex-flow: column nowrap; align-items: center; padding: 0 50px; text-decoration: none; } #content .content-wrap .download-cta .download-cta-wrap .download-cta-title { min-height: 2em; color: #fff; font-size: 1.125em; font-weight: 900; line-height: 1.2em; text-align: center; text-transform: uppercase; } #content .content-wrap .download-cta .download-cta-wrap .download-cta-image { display: block; padding: 0 0 10px; } #content .content-wrap .download-cta .download-cta-wrap .download-cta-image img { display: block; max-width: 100%; margin: 0 auto; } #content .content-wrap .download-cta .download-cta-wrap .download-cta-button { display: block; text-align: center; } #content .content-wrap .download-cta .download-cta-wrap .download-cta-button a.btn { } /* inset cta grouping ------------------------------------------- */ #content .content-wrap .inset-cta-block, #content .content-wrap .inset-cta-block * { box-sizing: border-box; } #content .content-wrap .inset-cta-block { } #content .content-wrap .inset-cta-block .inset-cta-wrap { max-width: 1020px; margin: 0 auto; } #content .content-wrap .inset-cta-block .inset-cta-wrap .inset-cta-content { } #content .content-wrap .inset-cta-block .inset-cta-wrap .inset-cta-content *:first-child { margin-top: 0; } #content .content-wrap .inset-cta-block .inset-cta-wrap .inset-cta-content *:last-child { margin-bottom: 0; } #content .content-wrap .inset-cta-block .inset-cta-wrap .download-cta { float: right; width: 200px; margin: 0 0 0.5em 50px; } #content .content-wrap .inset-cta-block .inset-cta-wrap .download-cta .download-cta-wrap { display: block; background-color: #0a7d8a; padding: 30px 35px 20px; -webkit-transition: background-color 200ms ease-in-out; -o-transition: background-color 200ms ease-in-out; -moz-transition: background-color 200ms ease-in-out; transition: background-color 200ms ease-in-out; } #content .content-wrap .inset-cta-block .inset-cta-wrap .download-cta .download-cta-wrap:hover { background-color: #0e6a74; -webkit-transition: background-color 300px ease-in-out; -o-transition: background-color 300px ease-in-out; -moz-transition: background-color 300px ease-in-out; transition: background-color 300px ease-in-out; } #content .content-wrap .inset-cta-block .inset-cta-wrap .download-cta .download-cta-wrap .download-cta-image { } #content .content-wrap .inset-cta-block .inset-cta-wrap .download-cta .download-cta-wrap .download-cta-image img { } #content .content-wrap .inset-cta-block .inset-cta-wrap .download-cta .download-cta-wrap .download-cta-button { text-align: center; } #content .content-wrap .inset-cta-block .inset-cta-wrap .download-cta .download-cta-wrap .download-cta-button .link { display: inline-block; color: #fff; text-decoration: none; } /* MULTIPLE DOWNLOADS ------------------------------------------- */ #content .content-wrap .multiple-downloads, #content .content-wrap .multiple-downloads * { box-sizing: border-box; } #content .content-wrap .multiple-downloads { background: #000 url('img/blue-spots-bg.jpg') center center no-repeat; background-size: cover; } #content .content-wrap .multiple-downloads.acf-custom-block { padding: 50px 80px; } #content .content-wrap .multiple-downloads .multiple-downloads-title { padding: 0 20px; margin: 0 auto; } #content .content-wrap .multiple-downloads .multiple-downloads-title h2 { position: relative; padding: 0; margin: 0 auto 1.57em; color: #fff; font-size: 2.375em; line-height: 1em; text-align: center; } #content .content-wrap .multiple-downloads .multiple-downloads-title.underline-title h2 { margin: 0 auto; } #content .content-wrap .multiple-downloads .multiple-downloads-title.underline-title h2::after { content: ''; display: block; height: 1em; margin: 1em 0 3.75em; font-size: 12px; background: transparent url(img/hash-white-900.png) center top no-repeat; background-size: auto 100%; } #content .content-wrap .multiple-downloads .multiple-downloads-wrap { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row nowrap; -webkit-flex-flow: row nowrap; flex-flow: row nowrap; justify-content: center; max-width: 1060px; margin: 0 auto; } /* download cta */ #content .content-wrap .multiple-downloads .multiple-downloads-wrap .download-cta { width: 25%; } #content .content-wrap .multiple-downloads .multiple-downloads-wrap .download-cta .download-cta-wrap { padding: 0 20px; border-bottom: none; } #content .content-wrap .multiple-downloads .multiple-downloads-wrap .download-cta .download-cta-wrap .download-cta-image { padding: 20px 0; } #content .content-wrap .multiple-downloads .multiple-downloads-wrap .download-cta .download-cta-wrap .download-cta-image img { filter: brightness(1); -webkit-transition: filter 200ms ease-in-out; -o-transition: filter 200ms ease-in-out; -moz-transition: filter 200ms ease-in-out; transition: filter 200ms ease-in-out; } #content .content-wrap .multiple-downloads .multiple-downloads-wrap .download-cta .download-cta-wrap:hover .download-cta-image img { filter: brightness(0.6); -webkit-transition: filter 200ms ease-in-out; -o-transition: filter 200ms ease-in-out; -moz-transition: filter 200ms ease-in-out; transition: filter 200ms ease-in-out; } #content .content-wrap .multiple-downloads .multiple-downloads-wrap .download-cta .download-cta-wrap .btn.dark-blue { } #content .content-wrap .multiple-downloads .multiple-downloads-wrap .download-cta .download-cta-wrap:hover .btn.dark-blue { background-color: #032334; } /* ADDITIONAL FIELD GROUP --------------------------------------- */ .additional-field-group, .additional-field-group * { box-sizing: border-box; } .additional-field-group { overflow: hidden; padding: 50px 100px; background-color: #fff; } .additional-field-group > .wrap { max-width: 1020px; margin: 0 auto; } .additional-field-group.type-gallery > .wrap { max-width: 100%; } .additional-field-group > .wrap > *:last-child { margin-bottom: 0; } .additional-field-group .media-container { position: relative; max-width: 50%; } .additional-field-group.align-left .media-container { float: right; margin: 0 0 20px 80px; } .additional-field-group.align-right .media-container { float: left; margin: 0 80px 20px 0; } .additional-field-group .media-container img { display: block; margin: 0; } .additional-field-group .media-container.video { width: 50%; height: 0; padding-bottom: 30%; } .additional-field-group .media-container.video iframe { position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; border: none; } .additional-field-group .gallery-content-wrap { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row nowrap; -webkit-flex-flow: row nowrap; flex-flow: row nowrap; align-items: flex-end; justify-content: space-between; gap: 100px; margin: 0 0 1.5em; } .additional-field-group .gallery-content-wrap .gallery-content { } .additional-field-group .gallery-content-wrap .gallery-content > *:first-child { margin-top: 0; } .additional-field-group .gallery-content-wrap .gallery-content > *:last-child { margin-bottom: 0; } .additional-field-group .gallery-content-wrap .gallery-content .title { font-size: 22px; text-transform: uppercase; } .additional-field-group .gallery-content-wrap .gallery-link { } .additional-field-group .gallery-content-wrap .gallery-link a { white-space: nowrap; } .additional-field-group .responsive-embed { margin-bottom: 0; } /* FOOTER CTAS -------------------------------------------------- */ .footer-cta, .footer-cta * { box-sizing: border-box; } .footer-cta { overflow: hidden; position: relative; padding: 35px 100px; background-color: #f5f7f8; } .footer-cta::before { content: ''; display: block; position: absolute; z-index: 1; height: 20px; width: 1920px; background: transparent url('img/hash-orange-1920.png') right top no-repeat; background-size: auto 100%; } .footer-cta::before { top: 54px; right: 100%; margin-right: -75px; } .footer-cta .content { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row nowrap; -webkit-flex-flow: row nowrap; flex-flow: row nowrap; justify-content: space-between; width: 100%; max-width: 1166px; padding: 0; margin: 0 auto; } .footer-cta .content .footer-cta-rep-container { position: relative; width: 380px; text-align: center; color: #0a7d8a; } .footer-cta .content .footer-cta-rep-container .footer-cta-rep { position: relative; width: 25.3em; height: 20.6em; margin: 0 auto 2em; font-size: 0.625em; background: transparent url('img/footer-cta-rep-bg.png') center center no-repeat; background-size: 100% 100%; } .footer-cta .content .footer-cta-rep-container .footer-cta-rep .footer-cta-rep-image { display: block; position: absolute; z-index: 1; bottom: 0; left: 1.3em; width: 19em; height: 19em; border-radius: 100%; background: transparent url('img/spacer.gif') center top no-repeat; background-size: 100% auto; font-size: 1em; } .footer-cta .content .footer-cta-rep-container .footer-cta-rep-name, .footer-cta .content .footer-cta-rep-container .footer-cta-rep-title { max-width: 250px; margin: 0 auto; text-transform: uppercase; } .footer-cta .content .footer-cta-rep-container .footer-cta-rep-name { font-size: 0.875em; font-weight: 700; } .footer-cta .content .footer-cta-rep-container .footer-cta-rep-title { font-size: 0.75em; font-weight: 400; } .footer-cta .content .footer-cta-info { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: column nowrap; -webkit-flex-flow: column nowrap; flex-flow: column nowrap; align-items: flex-start; justify-content: center; min-height: 150px; width: calc(100% - 380px); max-width: 700px; padding: 0; color: #0a7d8a; } .footer-cta .content .footer-cta-info h3 { margin: 0 0 0.35em; color: #0a7d8a; font-size: 3.25em; font-style: italic; font-weight: 400; line-height: 1em; } .footer-cta .content .footer-cta-info .footer-cta-description { margin: 0 0 2.2em; font-size: 1em; font-weight: 300; } .footer-cta .content .footer-cta-info .footer-cta-button { } .footer-cta .content .footer-cta-info .footer-cta-button a.btn { } /* NARROW CONTENT AREA ------------------------------------------ */ .general-content-block, .general-content-block * { box-sizing: border-box; } .general-content-block { background-color: #fff; } .general-content-block.white-bg { background-color: #fff; } .general-content-block.grey-bg { background-color: #e8edf1; } .general-content-block .general-content-wrap { max-width: 1020px; margin: 0 auto; } .general-content-block.narrow-width .general-content-wrap { max-width: 700px; } .general-content-block .general-content-wrap > *:first-child { margin-top: 0; } .general-content-block .general-content-wrap > *:last-child { margin-bottom: 0; } .general-content-block .alignright, .general-content-block .alignleft { max-width: 100%; } .general-content-block .alignright { float: right; margin: 0 0 1em 3em; } .general-content-block .alignleft { float: left; margin: 0 3em 1em 0; } .general-content-block .alignright img, .general-content-block .alignleft img { display: block; } .general-content-block .alignright .wp-caption-text, .general-content-block .alignleft .wp-caption-text { margin: 0.75em 0 1em; font-size: 0.8em; font-weight: 300; } /* ICON GRID ---------------------------------------------------- */ #icon-grid, #icon-grid * { box-sizing: border-box; } #icon-grid { margin: 0; background-color: #e8edf1; } #icon-grid.acf-custom-block { padding: 25px 85px; } #icon-grid .content { width: 100%; max-width: 1040px; margin: 0 auto; } #icon-grid .icon-grid-header { max-width: 550px; padding: 0 15px 15px; margin: 0 auto; text-align: center; } #icon-grid .icon-grid-header *:first-child { margin-top: 0; } #icon-grid .icon-grid-header *:last-child { margin-bottom: 0; } #icon-grid .icon-grid-header h2 { } #icon-grid .icon-grid-header p { } #icon-grid .icon-grid-footer { width: 550px; padding: 15px 15px 0; margin: 0 auto; text-align: center; } #icon-grid .icon-grid-footer *:first-child { margin-top: 0; } #icon-grid .icon-grid-footer *:last-child { margin-bottom: 0; } #icon-grid .icon-grid-footer h2 { } #icon-grid .icon-grid-footer p { } #icon-grid .icon-grid-content { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row wrap; -webkit-flex-flow: row wrap; flex-flow: row wrap; } #icon-grid .icon-grid-item { display: -ms-flexbox; display: -webkit-flex; display: flex; position: relative; width: 50%; padding: 15px; } #icon-grid .icon-grid-item .icon-grid-item-wrap { width: 100%; background-color: #fff; padding: 30px; border-radius: 10px; } #icon-grid .icon-grid-item .icon-grid-item-icon { height: 65px; background: transparent url('img/spacer.gif') center top no-repeat; background-size: auto 100%; } #icon-grid .icon-grid-item .icon-grid-item-title { padding: 1em 0 0; color: #07435e; font-size: 1.25em; font-weight: 800; text-align: center; text-transform: uppercase; } #icon-grid .icon-grid-item .icon-grid-item-content { } #icon-grid .icon-grid-item .icon-grid-item-content p { } #icon-grid .icon-grid-item .icon-grid-item-content p a { } #icon-grid .icon-grid-item .icon-grid-item-content *:last-child { margin-bottom: 0; } /* IMAGE/VIDEO BLOCK -------------------------------------------- */ .img-vid-block, .img-vid-block * { box-sizing: border-box; } .img-vid-block { overflow: hidden; } .img-vid-block.white-bg { background-color: #fff; } .img-vid-block.grey-bg { background-color: #e8edf1; } .img-vid-block .img-vid-title { max-width: 1020px; margin: 0 auto; } .img-vid-block .img-vid-title h2, .img-vid-block .img-vid-title h3, .img-vid-block .img-vid-title h4 { position: relative; padding: 0; margin: 0 auto 0.75em; font-size: 2.375em; line-height: 1em; text-align: center; } .img-vid-block .img-vid-title h3 { font-size: 28px; line-height: 1em; } .img-vid-block .img-vid-title h4 { font-size: 20px; line-height: 1em; } .img-vid-block .img-vid-title.underline-title h2 { margin: 0 auto; } .img-vid-block .img-vid-title.underline-title h2::after { content: ''; display: block; height: 1em; margin: 1em 0 2.25em; font-size: 12px; background: transparent url(img/hash-orange-900.png) center top no-repeat; background-size: auto 100%; } .img-vid-block .media-container { position: relative; z-index: 1; } .img-vid-block .media-container.image { } .img-vid-block .media-container.image img { display: block; } .img-vid-block .media-container.image .image-caption { margin: 0.75em 0 1em; font-size: 0.8em; font-weight: 300; } /* standard text wrapping */ .img-vid-block .img-vid-content { max-width: 1020px; margin: 0 auto; font-weight: 300;} .img-vid-block .img-vid-content *:last-child { margin-bottom: 0; } .img-vid-block.text-left .img-vid-content .media-container { float: right; margin: 0 0 20px 80px; } .img-vid-block.text-right .img-vid-content .media-container { float: left; margin: 0 80px 20px 0; } .img-vid-block .img-vid-content .media-container { max-width: 50%; } .img-vid-block .img-vid-content .media-container.video { width: 50%; height: 0; padding-bottom: 30%; } .img-vid-block .img-vid-content .media-container.video iframe { position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; border: none; } /* flex-based independent columns */ .img-vid-block .img-vid-flex { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row wrap; -webkit-flex-flow: row wrap; flex-flow: row wrap; max-width: 1020px; margin: 0 auto; } .img-vid-block .img-vid-flex [class*='col-'] { width: 50%; } .img-vid-block .img-vid-flex [class*='col-'] p { } .img-vid-block .img-vid-flex [class*='col-'] ul { } .img-vid-block .img-vid-flex [class*='col-'] ul li { } .img-vid-block .img-vid-flex [class*='col-'] *:first-child { margin-top: 0; } .img-vid-block .img-vid-flex [class*='col-'] *:last-child { margin-bottom: 0; } .img-vid-block .img-vid-flex [class*='col-'] .media-container { width: 100%; } .img-vid-block .img-vid-flex [class*='col-'] .media-container.image { } .img-vid-block .img-vid-flex [class*='col-'] .media-container.image img { } .img-vid-block .img-vid-flex [class*='col-'] .media-container.video { } .img-vid-block .img-vid-flex [class*='col-'] .media-container.video iframe { } .img-vid-block .img-vid-flex [class*='col-'] .media-container.video { height: 0; padding-bottom: 56.25%; } .img-vid-block .img-vid-flex [class*='col-'] .media-container.video iframe { position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; border: none; } .img-vid-block .img-vid-flex [class*='col-'] .media-container.video iframe.youtube { } .img-vid-block .img-vid-flex [class*='col-'] .media-container.video iframe.vimeo { } .img-vid-block.text-left .img-vid-flex .col-left { padding-right: 100px; } .img-vid-block.text-right .img-vid-flex .col-right { padding-left: 100px; } /* INFOGRAPHIC SECTION ------------------------------------------ */ #infographic-section, #infographic-section * { box-sizing: border-box; } #infographic-section { border-top: 1px solid #eb7845; border-bottom: 1px solid #eb7845; } #infographic-section.acf-custom-block { padding: 20px 0; } #infographic-section .content { width: 100%; max-width: 1200px; margin: 0 auto; } #infographic-section .content ul, #content .content-wrap ul.infographic { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row wrap; -webkit-flex-flow: row wrap; flex-flow: row wrap; align-items: center; justify-content: center; list-style-type: none; padding: 0; margin: 0; text-align: center; } #infographic-section .content ul li, #content .content-wrap ul.infographic li { display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; position: relative; width: 33.33%; padding: 15px 0; text-align: center; } #infographic-section .content ul li::before, #content .content-wrap ul.infographic li::before { content: ''; display: block; position: absolute; z-index: 1; left: 0; top: 50%; width: 33px; height: 90px; margin: -45px 0 0 -16px; background: transparent url('img/infographic-arrow.png') center center no-repeat; background-size: 100% 100%; } #infographic-section .content ul li:first-child::before, #content .content-wrap ul.infographic li:first-child::before { display: none; } #infographic-section .content ul li img, #content .content-wrap ul.infographic li img { display: block; margin: 0 auto; } /* FEATURED ITEM AND NEWS --------------------------------------- */ #featured-item-news, #featured-item-news * { box-sizing: border-box; } #featured-item-news { } #featured-item-news .fin-header { background-color: #0a7d8a; } #featured-item-news .fin-header h2 { position: relative; padding: 1em 20px; margin: 0; color: #fff; font-size: 2.375em; font-style: italic; text-align: center; } #featured-item-news .fin-header h2::before, #featured-item-news .fin-header h2::after { content: ''; display: block; opacity: 0.8; position: absolute; z-index: 1; top: 50%; height: 0.421em; width: 100%; margin-top: -0.13157em; background: transparent url('img/hash-orange-1920.png') center top no-repeat; background-size: auto 100%; } #featured-item-news .fin-header h2::before { right: 50%; margin-right: 5.25em; background-position: right top; } #featured-item-news .fin-header h2::after { left: 50%; margin-left: 5.25em; background-position: left top; } #featured-item-news .fin-content { padding: 40px 0 50px; background-color: #ebebeb; } #featured-item-news .fin-content .content { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row nowrap; -webkit-flex-flow: row nowrap; flex-flow: row nowrap; } /* featured item */ #featured-item-news .fin-content .featured-item { display: -ms-flexbox; display: -webkit-flex; display: flex; justify-content: flex-end; width: 39.09%; padding: 0 110px 0 0; } #featured-item-news .fin-content .featured-item .featured-item-wrap { width: 100%; max-width: 360px; padding: 25px 40px; background-color: #fff; box-shadow: 0 0 9px rgba(0,61,89,0.22); } #featured-item-news .fin-content .featured-item .featured-item-wrap h3 { margin: 0 0 0.55em; color: #0a7d8a; font-size: 1.875em; font-weight: 400; font-style: italic; line-height: 1em; } #featured-item-news .fin-content .featured-item .featured-item-wrap .item-container { display: block; border-bottom: none !important; color: #111; text-decoration: none; } #featured-item-news .fin-content .featured-item .featured-item-wrap .item-container .item-header { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row nowrap; -webkit-flex-flow: row nowrap; flex-flow: row nowrap; justify-content: space-between; } #featured-item-news .fin-content .featured-item .featured-item-wrap .item-container .item-header .item-image { display: block; width: 155px; height: 90px; background: rgba(10,125,138,1) url('img/spacer.gif') center center no-repeat; background-size: cover; } #featured-item-news.no-date .fin-content .featured-item .featured-item-wrap .item-container .item-header .item-image { width: 100%; height: 0; padding-bottom: 58%; } #featured-item-news .fin-content .featured-item .featured-item-wrap .item-container .item-header .item-date { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: column nowrap; -webkit-flex-flow: column nowrap; flex-flow: column nowrap; align-items: center; justify-content: center; width: calc(100% - 155px); max-width: 95px; padding: 0 20px; } #featured-item-news .fin-content .featured-item .featured-item-wrap .item-container .item-header .item-date .item-month, #featured-item-news .fin-content .featured-item .featured-item-wrap .item-container .item-header .item-date .item-day { display: block; color: #0a7d8a; font-size: 1.25em; font-weight: 700; text-align: center; line-height: 1.1em; text-transform: uppercase; } #featured-item-news .fin-content .featured-item .featured-item-wrap .item-container .item-header .item-date .item-month { } #featured-item-news .fin-content .featured-item .featured-item-wrap .item-container .item-header .item-date .item-day { } #featured-item-news .fin-content .featured-item .featured-item-wrap .item-container .item-content { } #featured-item-news .fin-content .featured-item .featured-item-wrap .item-container .item-content .title { display: block; margin: 1em 0; color: #111; font-size: 1.25em; font-weight: 500; line-height: 1.2em; } #featured-item-news .fin-content .featured-item .featured-item-wrap .item-container .item-content p { font-weight: 300; } #featured-item-news .fin-content .featured-item .featured-item-wrap .item-container .item-content .button-container { } #featured-item-news .fin-content .featured-item .featured-item-wrap .item-container .item-content .button-container a.btn { } /* no featured item or news present */ #featured-item-news.no-featured-item .fin-content, #featured-item-news.no-news-items .fin-content { padding: 20px 65px 50px; } #featured-item-news.no-featured-item .fin-content .content, #featured-item-news.no-news-items .fin-content .content { max-width: 1200px; margin: 0 auto; } /* no news items present */ #featured-item-news.no-news-items .fin-content .featured-item { width: 100%; max-width: 360px; padding: 0; margin: 0 auto; } /* featured news */ #featured-item-news .fin-content .featured-news { width: 60.91%; } #featured-item-news .fin-content .featured-news h3 { position: relative; z-index: 1; padding: 1em 0; margin: 0; color: #003d59; font-size: 1.875em; font-style: italic; font-weight: 400; line-height: 1em; } #featured-item-news .fin-content .featured-news h3::after { content: ''; display: block; opacity: 0.8; position: absolute; z-index: 1; top: 50%; left: 3.75em; height: 0.421em; width: 100%; margin-top: -0.13157em; background: transparent url('img/hash-orange-long.png') left top no-repeat; background-size: auto 100%; } #featured-item-news .fin-content .featured-news .featured-news-content { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row nowrap; -webkit-flex-flow: row nowrap; flex-flow: row nowrap; } #featured-item-news .fin-content .featured-news .featured-news-content .news-article { width: 50%; max-width: 385px; padding: 0 75px 0 0; } #featured-item-news .fin-content .featured-news .featured-news-content .news-article .title { display: block; border-bottom: none !important; margin: 0 0 1em; color: #111; font-size: 1.25em; font-weight: 500; line-height: 1.2em; text-decoration: none; } #featured-item-news .fin-content .featured-news .featured-news-content .news-article .title:hover { text-decoration: underline; } #featured-item-news .fin-content .featured-news .featured-news-content .news-article p { font-weight: 300; } #featured-item-news .fin-content .featured-news .featured-news-content .news-article .button-container { } #featured-item-news .fin-content .featured-news .featured-news-content .news-article .button-container a { } /* no featured item present */ #featured-item-news.no-featured-item .fin-content .featured-news { width: 100%; padding: 0; } #featured-item-news.no-featured-item .fin-content .featured-news h3 { padding: 1em 35px; } #featured-item-news.no-featured-item .fin-content .featured-news h3::after { left: 5em; background-image: url('img/hash-orange-900.png'); } #featured-item-news.no-featured-item .fin-content .featured-news .featured-news-content .news-article { max-width: 100%; padding: 0 35px; } /* NARROW CONTENT AREA ------------------------------------------ */ .narrow-content-block, .narrow-content-block * { box-sizing: border-box; } .narrow-content-block { background-color: #fff; } .narrow-content-block.white-bg { background-color: #fff; } .narrow-content-block.grey-bg { background-color: #e8edf1; } .narrow-content-block .narrow-content-title { max-width: 700px; margin: 0 auto; } .narrow-content-block .narrow-content-title h2 { position: relative; padding: 0; margin: 0 auto 1em; font-size: 2.375em; line-height: 1em; text-align: center; } .narrow-content-block .narrow-content-title.underline-title h2 { margin: 0 auto; } .narrow-content-block .narrow-content-title.underline-title h2::after { content: ''; display: block; height: 1em; margin: 1em 0 2em; font-size: 12px; background: transparent url(img/hash-orange-900.png) center top no-repeat; background-size: auto 100%; } .narrow-content-block .narrow-content-content { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: column wrap; -webkit-flex-flow: column wrap; flex-flow: column wrap; max-width: 700px; margin: 0 auto; } /* PHOTO GALLERY BLOCK ------------------------------------------ */ .acf-photo-gallery-container, .acf-photo-gallery-container * { box-sizing: border-box; } .acf-photo-gallery-container { } .acf-photo-gallery-container .acf-photo-gallery-wrap { max-width: 1220px; padding: 0 100px; margin: 0 auto; text-align: center; } .acf-photo-gallery-container .acf-photo-gallery-wrap .acf-photo-gallery-thumb { border-bottom: none !important; } .acf-photo-gallery-container .acf-photo-gallery-wrap .acf-photo-gallery-thumb img { display: block; max-width: 100%; margin: 0 auto 0.5em; } .acf-photo-gallery-container .acf-photo-gallery-wrap .acf-photo-gallery-thumb .acf-photo-gallery-message { display: block; text-align: center; } .acf-photo-gallery-container .acf-photo-gallery-wrap .acf-photo-gallery { display: none; } /* SOCIAL MEDIA BUTTON LINKS ------------------------------------ */ .smb-links { list-style-type: none; list-style-image: none; overflow: hidden; padding: 0; margin: 0; text-align: center; } .smb-links li { display: inline-block; margin: 0 4px !important; padding: 0 !important; } .smb-links li::before { display: none !important; } .smb-links li a { display: block; width: 56px; height: 56px; background-color: #053b57; border-radius: 100%; line-height: 56px; text-align: center; text-decoration: none; -webkit-transition: background-color 200ms ease-in-out; -o-transition: background-color 200ms ease-in-out; -moz-transition: background-color 200ms ease-in-out; transition: background-color 200ms ease-in-out; } .smb-links li a span { display: none; } .smb-links li a:hover { background-color: #0a7d8a; -webkit-transition: background-color 300ms ease-in-out; -o-transition: background-color 300ms ease-in-out; -moz-transition: background-color 300ms ease-in-out; transition: background-color 300ms ease-in-out; } .smb-links li a::before { content: ''; display: block; color: #fff; font-size: 32px; font-family: 'akron-community-foundation'; text-align: center; } .smb-links li.facebook a::before { content: 'e'; } .smb-links li.twitter a::before { content: 'h'; } .smb-links li.youtube a::before { content: 'i'; } .smb-links li.instagram a::before { content: 'n'; } .smb-links li.linkedin a::before { content: 'q'; } /* SOCIAL MEDIA BLOCK ------------------------------------------- */ .social-media-block, .social-media-block * { box-sizing: border-box; } .social-media-block { background-color: #f2f5f6; } .social-media-block .content { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row nowrap; -webkit-flex-flow: row nowrap; flex-flow: row nowrap; justify-content: center; align-items: center; max-width: 1220px; padding: 45px 100px; margin: 0 auto; } .social-media-block .content .smb-title { padding-right: 35px; color: #053b57; font-size: 38px; font-style: italic; } .social-media-block .content .smb-links { margin: 0; } /* TEAL CTAS ---------------------------------------------------- */ #teal-cta, #teal-cta * { box-sizing: border-box; } #teal-cta { overflow: hidden; position: relative; padding: 35px 0; margin: 0; background-color: #0a7d8a; } #teal-cta.acf-custom-block { padding: 35px 0; } #teal-cta.acb-last { margin-top: 25px; } #teal-cta::before, #teal-cta::after { content: ''; display: block; position: absolute; z-index: 1; height: 20px; width: 1920px; background: transparent url('img/hash-green-1920.png') right top no-repeat; background-size: auto 100%; } #teal-cta::before { top: 54px; right: 100%; margin-right: -75px; } #teal-cta::after { bottom: 40px; left: 100%; margin-left: -145px; background-position: left top; } #teal-cta .content { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row nowrap; -webkit-flex-flow: row nowrap; flex-flow: row nowrap; width: 100%; max-width: 1125px; padding: 0 100px; margin: 0 auto; } #teal-cta .content .teal-cta-icon-container { position: relative; width: 24em; background: transparent url('img/teal-cta-icon-bg.png') right top no-repeat; background-size: 13.9em 14.6em; font-size: 10px; } #teal-cta .content .teal-cta-icon-container .teal-cta-icon { display: block; position: absolute; z-index: 1; top: 0.9em; right: 0; width: 10.9em; height: 10.9em; background: transparent url('img/spacer.gif') center center no-repeat; background-size: 6em 6em; font-size: 1em; } #teal-cta .content .teal-cta-info { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: column nowrap; -webkit-flex-flow: column nowrap; flex-flow: column nowrap; align-items: flex-start; justify-content: center; min-height: 150px; width: calc(100% - 240px); padding: 0 0 0 85px; } #teal-cta .content .teal-cta-info h3 { margin: 0 0 0.35em; color: #fff; font-size: 3.25em; font-style: italic; font-weight: 400; line-height: 1em; } #teal-cta .content .teal-cta-info .teal-cta-button { } #teal-cta .content .teal-cta-info .teal-cta-button a.btn { background-color: #053b57; } /* VIDEO GALLERY ------------------------------------------------ */ .video-gallery-item { display: flex; flex-direction: column; width: 33.3333%; } .video-gallery-item iframe { width: 100%; height: 100%; } .video-gallery-item > a { margin-top: 1.5rem; } .video-gallery-links { display: flex; justify-content: space-between; margin-bottom: 1.5rem; } .video-gallery-links h3 { font-size: 22px; margin-top: 0; margin-bottom: 0; text-transform: uppercase; } .video-gallery-row { display: flex; gap: 2rem; } /* HELPFUL PDFS ------------------------------------------------- */ .helpful-pdfs-container { display: flex; justify-content: space-between; } /* QUICK ANCHOR LINKS ------------------------------------------- */ #content .content-wrap p.quick-anchor-links-title { font-weight: bold; margin-top: 0; margin-right: 1.5rem; margin-bottom: 0; } .quick-anchor-links-row { display: flex; justify-content: center; } .quick-anchor-links-row span { margin-left: 12px; margin-right: 12px; } /* REP IMAGE AND CONTACT ---------------------------------------- */ .rep-image-and-contact-row { display: flex; justify-content: center; flex-wrap: wrap; row-gap: 40px;} .rep-image-and-contact-container { position: relative; width: 380px; text-align: center; color: #0a7d8a; display: flex; flex-direction: column; align-items: center;} .rep-image-and-contact-container .rep-image-and-contact { position: relative; width: 25.3em; height: 20.6em; margin: 0 auto 2em; font-size: 0.625em; background: transparent url('img/footer-cta-rep-bg.png') center center no-repeat; background-size: 100% 100%; } .rep-image-and-contact-container:nth-child(2) .rep-image-and-contact { background: transparent url('img/Christina-bg-circles.png') right center no-repeat; background-size: contain;} .rep-image-and-contact-container .rep-image-and-contact .rep-image-and-contact-image { display: block; position: absolute; z-index: 1; bottom: 0; left: 1.3em; width: 19em; height: 19em; border-radius: 100%; background: transparent url('img/spacer.gif') center top no-repeat; background-size: 100% auto; font-size: 1em; } .rep-image-and-contact-container .rep-image-and-contact-name, .rep-image-and-contact-container .rep-image-and-contact-title { max-width: 40ch; margin: 0 auto; text-transform: uppercase; } .rep-image-and-contact-container .rep-image-and-contact-name { font-size: 16px; font-weight: 700; font-family: sans-serif; } .rep-image-and-contact-container .rep-image-and-contact-title { font-size: 0.75em; font-weight: 400; } .rep-image-and-contact-container .rep-image-and-contact-email { font-size: 0.75em; } .rep-image-and-contact-container a.rep-image-and-contact-number { font-size: 0.75em; color: #0a7d8a; text-decoration: none; } /* EMAIL NEWSLETTER --------------------------------------------- */ .pub-enews { padding: 0 20px; } /* 20px is to make the 15px item padding equal the 35px of .pub-mag */ .pub-enews h2 { } .pub-enews .pub-content { } .pub-enews .pub-enew { width: 25%; padding: 0 15px; } .pub-enews .pub-enew .item { } .pub-enews .pub-enew .item .thumbnail { padding-bottom: 135%; } .pub-year .pub-enews .pub-enew .item .caption { color: #003d59; } /* STORIES AND EVENTS ------------------------------------------- */ .stories-and-events .stories-and-events-row { display: grid; gap: 1.5rem; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; grid-template-columns: repeat( auto-fit, minmax(245px, 1fr) ); } .stories-and-events .post-thumbnail__link-wrap { display: block; } .stories-and-events .stories-and-events-row .post-date { font-size: 18px; margin-top: 12px; margin-bottom: 12px; } .stories-and-events .stories-and-events-row .post-title a { font-size: 20px; color: #125359;} .stories-and-events .stories-and-events-row .post-thumbnail { display: -webkit-box; display: -ms-flexbox; display: flex; } .stories-and-events .stories-and-events-row .post-thumbnail { width: 100%; height: 245px; } .stories-and-events .stories-and-events-row .post-thumbnail img { height: 100%;max-height: 100%; object-fit: cover; max-width: 100%; } .stories-and-events .stories-and-events-row .is-post-type-events .post-thumbnail { width: 100%; height: auto; } .stories-and-events .stories-and-events-row .is-post-type-events .post-thumbnail img { width: auto; max-height: 100%; object-fit: cover; max-width: 100%; } /* SCHOLARSHIPS + FUNDS SORTABLE TABLES ------------------------- */ .ordered-table-wrap, .ordered-table-wrap * { box-sizing: border-box; } .ordered-table-wrap { max-width: 1220px; padding: 0 100px; margin: 0 auto; } .ordered-table-wrap .no-results { display: none; margin: 32px 0; } /* search styles */ .ordered-form-search { overflow: hidden; position: relative; } .ordered-form-search label { display: block; position: relative; z-index: 2; margin: 0 0 0.5em; color: #003d59; font-weight: 400; font-size: 1.5em; } .ordered-form-search input { display: block; position: relative; z-index: 2; width: 100%; max-width: 400px; padding: 0.5em 1em; border: 1px solid #ccc; } .ordered-form-search .original-sort-wrap { position: absolute; z-index: 1; right: 0; bottom: 0; } .ordered-form-search .original-sort-wrap button#original-sort { } .ordered-form-search .original-sort-wrap button#original-sort:disabled, .ordered-form-search .original-sort-wrap button#original-sort:disabled:hover { opacity: 0.5; background-color: rgba(10,125,138,1); } /* table styles */ .ordered-table { border-radius: 0; border: 1px solid #0a7d8a; border-collapse: collapse; box-shadow: none; } .ordered-table thead { border: 1px solid #0a7d8a; } .ordered-table thead tr { } .ordered-table thead tr th { border: none; background-color: #edf1f3; color: #053b57; } .ordered-table thead tr th.sort { cursor: pointer; } .ordered-table thead tr th.sort:hover { text-decoration: none; } .ordered-table thead tr th.sort span { display: inline-block; position: relative; padding-right: 2em; text-decoration: underline; } .ordered-table thead tr th.sort span::before, .ordered-table thead tr th.sort span::after { content: 'a'; display: none; position: absolute; z-index: 1; right: 0; font-family: 'akron-community-foundation'; text-align: center; text-transform: none; } .ordered-table thead tr th.sort span::before { top: 50%; margin-top: -0.5em; transform: rotate(180deg); } .ordered-table thead tr th.sort span::after { bottom: 50%; margin-bottom: -0.5em; } .ordered-table thead tr th.sort.desc span::before { display: block; } .ordered-table thead tr th.sort.asc span::after { display: block; } .ordered-table tbody { border: none; } .ordered-table tbody tr:nth-child(odd), .ordered-table tbody tr:nth-child(even) { background-color: #fff !important; } .ordered-table tbody tr.grey { background-color: rgba(0,0,0,0.04) !important; } .ordered-table tbody tr.hide { display: none; } .ordered-table tbody tr td { border: none; border-bottom: 1px solid #ccc; border-left: 1px solid #ccc; } .ordered-table tbody tr:last-child td { border-bottom: none; } .ordered-table tbody tr td:first-child { border-left: none; } .ordered-table tbody tr td .unix-time { display: none; } .ordered-table tbody tr td .title { font-weight: 700; } .ordered-table tbody tr td.fund-type, .ordered-table tbody tr td.fund-established { font-weight: 700; } /* current funds table */ .ordered-table-caption { margin: 32px 0 16px; } table#funds-listing { margin-top: 0; } table#funds-listing tbody tr td .sort-name, table#funds-listing tbody tr td .active, table#funds-listing tbody tr td .featured, table#funds-listing tbody tr td .keywords { display: none; } .ordered-table tbody tr.endowed td .title::before { content: '*'; display: inline-block; } table#funds-listing tbody tr td.fund-info .website { padding: 5px 0 0; } table#funds-listing tbody tr td.fund-info .donate { padding: 10px 0 0; } table#funds-listing tbody tr td.fund-type, table#funds-listing tbody tr td.fund-established { font-weight: 700; } table#funds-listing thead tr th.fund-original-order, table#funds-listing tbody tr td.fund-original-order { display: none; } /* scholarships table */ table#scholarships-listing { } table#scholarships-listing tbody tr td .sort, table#scholarships-listing tbody tr td .keywords { display: none; } table#scholarships-listing tbody tr td.scholarship-area-served, table#scholarships-listing tbody tr td.scholarship-deadline { font-weight: 700; } table#scholarships-listing thead tr th.scholarship-original-order, table#scholarships-listing tbody tr td.scholarship-original-order { display: none; } /* Search Page */ .search-page-container { display: flex; justify-content: center; text-align: center; max-width: 900px; width: 100%; margin: 0 auto; } /* SEARCH RESULTS ----------------------------------------------- */ #search-results, #search-results * { box-sizing: border-box; } #search-results { margin-bottom: 2em; } #search-results h2.search-header { margin: 0 0 1em; } #search-results .search-result { margin-bottom: 1.25em; } #search-results .search-result .search-title { padding: 0 0 0.2em; } #search-results .search-result .search-title a { } #search-results .search-result .search-blurb { } /* AFFILIATE LANDING PAGES -------------------------------------- */ /* advisory board intro */ .advisory-intro, .advisory-intro * { box-sizing: border-box; } .advisory-intro { text-align: center; } .advisory-intro .content { width: 100%; max-width: 1000px; padding: 50px 100px 40px; margin: 0 auto; } .advisory-intro .content *:first-child { margin-top: 0; } .advisory-intro .content *:last-child { margin-bottom: 0; } .advisory-intro h2 { position: relative; padding: 0; margin: 0; font-size: 2.375em; line-height: 1em; } .advisory-intro h2::after { content: ''; display: block; height: 1em; margin: 1.5em 0 2em; font-size: 12px; background: transparent url('img/hash-orange-900.png') center top no-repeat; background-size: auto 100%; } .advisory-intro p { font-size: 0.875em; line-height: 1.5em; } /* FORM DOWNLOAD LANDING PAGE ----------------------------------- */ .fdlp-container, .fdlp-container * { box-sizing: border-box; } .fdlp-container { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-flow: row nowrap; -webkit-flex-flow: row nowrap; flex-flow: row nowrap; justify-content: space-between; max-width: 1600px; padding: 0 75px; margin: 60px auto 130px; } .fdlp-container [class*='fdlp-col'] *:first-child { margin-top: 0; } .fdlp-container [class*='fdlp-col'] *:last-child { margin-bottom: 0; } .fdlp-container .fdlp-col-left, .fdlp-container .fdlp-col-right { width: calc(50% - 100px); } .fdlp-container .fdlp-col-left { } .fdlp-container .fdlp-col-center { position: relative; width: 200px; } .fdlp-container .fdlp-col-center span { display: block; position: relative; z-index: 2; width: 2.55em; margin: 0 auto; background-color: #053b57; border-radius: 100%; color: #fff; font-size: 21px; font-weight: 800; line-height: 2.55em; text-align: center; text-transform: uppercase; } .fdlp-container .fdlp-col-center::after { content: ''; display: block; position: absolute; z-index: 1; bottom: 140px; left: 50%; top: 20px; margin-left: -5px; width: 11px; background: transparent url('img/hash-orange-vertical.png') center bottom no-repeat; background-size: 100% auto; } .fdlp-container .fdlp-col-right { } .fdlp-container [class*='fdlp-col'] .gform_wrapper { padding: 5px 30px 20px !important; border: 1px solid #0a7d8a; background-color: #edf1f3; } body .fdlp-container [class*='fdlp-col'] .gform_wrapper .top_label .gfield_label, body .fdlp-container [class*='fdlp-col'] .gform_wrapper legend.gfield_label { /*padding-left: 1em;*/ color: #07435e; font-size: 1em; margin-top: 1em; } .fdlp-container [class*='fdlp-col'] .gform_wrapper .field_sublabel_below .ginput_complex.ginput_container label, .fdlp-container [class*='fdlp-col'] .gform_wrapper .field_sublabel_below div[class*=gfield_time_].ginput_container label { padding-top: 0.75em; padding-left: 1em; } .fdlp-container [class*='fdlp-col'] .gform_wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), .fdlp-container [class*='fdlp-col'] .gform_wrapper textarea { padding-left: 1em; padding-right: 1em; border: 1px solid #0a7d8a; border-radius: 2em; } .fdlp-container [class*='fdlp-col'] .gform_wrapper ul.gform_fields li.gfield { padding-right: 0 !important; margin: 0 0 1em !important; } .fdlp-container [class*='fdlp-col'] .gform_wrapper ul li div.ginput_container_checkbox, .fdlp-container [class*='fdlp-col'] .gform_wrapper ul li div.ginput_container_radio, .fdlp-container [class*='fdlp-col'] .gform_wrapper ul li div.ginput_container_select, .fdlp-container [class*='fdlp-col'] .gform_wrapper ul li div.gfield_description, .fdlp-container [class*='fdlp-col'] .gform_wrapper ul li div.ginput_container .ginput_counter { padding-left: 1em; } .fdlp-container [class*='fdlp-col'] .gform_wrapper .gform_footer { margin: 0; text-align: center; } .fdlp-container [class*='fdlp-col'] .gform_wrapper .gform_footer input.button, .gform_wrapper .gform_footer input[type=submit] { margin: 0; } /* 404 PAGE ----------------------------------------------------- */ .error-message { box-sizing: border-box; max-width: 1200px; padding: 50px 100px; margin: 0 auto;} /* WORDPRESS CORE OVERRIDES ------------------------------------- */ /* class="gutenberg-wrap" is added in functions.php to wrap all default gutenberg blocks */ .content-wrap .gutenberg-wrap { box-sizing: border-box; width: 100%; max-width: 1220px; padding: 0 100px; margin: 0 auto; } .content-wrap .gutenberg-wrap .gutenberg-wrap { width: auto; max-width: 100%; padding: 0; margin: 0; } .content-wrap > .gutenberg-wrap:first-child { padding-top: 50px; } .content-wrap > .gutenberg-wrap:last-child { padding-bottom: 50px; } /* wordpress core overrides */ .gutenberg-wrap > figure { padding: 0; margin: 0; } /* Post Page Password Form */ .content-wrap .post-password-form { max-width: 700px; padding-block: clamp(25px, 5vw, 50px); padding-inline: clamp(20px, 5vw, 100px); margin-inline: auto; text-align: center; } .content-wrap .post-password-form input[type=password] { display: block; width: 100%; max-width: 400px; margin-inline: auto;} /* ADVANCE CUSTOM FIELDS CHROME --------------------------------- */ /* class="acf-block-preview-content" should be included in the block templates to serve as a preview in the Gutenberg Editor */ .acf-block-preview-content { overflow: hidden; height: 0; } /* WORDPRESS CORE OVERRIDES ------------------------------------- */ .wp-block-image .alignleft { margin-right: 3em; } .wp-block-image .alignright { margin-left: 3em; } .wp-block-image img { height: auto; } .wp-block-image > figcaption { display: block !important; } .wp-block-image > figcaption, .wp-block-embed > figcaption { font-size: 0.8em; font-weight: 300; margin-bottom: 0; } img.alignright, .wp-block-image.alignright, .wp-block-embed.alignright { display: block; float: right; margin: 16px 0 24px 16px; padding: 0; max-width: 450px !important; } .wp-block-image img { height: auto; display: block; width: 100%; } .wp-block-image.alignright > figcaption { clear: right; margin-left: auto; margin-right: auto; margin-bottom: 0; } img.alignleft, .wp-block-image.alignleft, .wp-block-embed.alignleft { display: block; float: left; margin: 16px 16px 24px 0; padding: 0; max-width: 450px !important; } .wp-block-image.alignleft > figcaption { clear: left; margin-left: auto; margin-right: auto; margin-bottom: 0; } img.aligncenter, .wp-block-image.aligncenter, .wp-block-embed.aligncenter { margin-inline: auto; } /* FONTS -------------------------------------------------------- */ body { font-family: 'Noto Sans HK', sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } h1, h2, h1.blog-post, h4, #banner .banner-title, #stay-connected h3, #acf-by-the-numbers h2, .cta-button-section h2, #acf-by-the-numbers .sections [class*='section-'] .bottom, #footer .top h3, #personnel-carousels .personnel-carousel-header h3, #featured-item-news .fin-content .featured-item .featured-item-wrap h3, #featured-item-news .fin-content .featured-news h3, #teal-cta .content .teal-cta-info h3, .footer-cta .content .footer-cta-info h3, .ordered-form-search label, .social-media-block .content .smb-title { font-family: 'Noto Serif', serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .class-two { font-family: 'akron-community-foundation'; } /* BEQUEST GIVING LANDING PAGE -------------------------------------------------- */ .bequests-h3 { font-family: 'Noto Serif', serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-weight: 400; } .page-id-9520 .img-vid-block { padding-top: 20px; padding-bottom: 20px; } .page-id-9520 .img-vid-content { padding-left: 50px; padding-right: 50px; } /* Utility Classes -------------------------------------------------- */ .disclaimer-text { font-size: 14px; } .show-for-sr, .show-on-focus { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } .responsive-embed, .flex-video { position: relative; height: 0; margin-bottom: 1.25rem; padding-bottom: 75%; overflow: hidden } .responsive-embed iframe, .responsive-embed object, .responsive-embed embed, .responsive-embed video, .flex-video iframe, .flex-video object, .flex-video embed, .flex-video video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .responsive-embed.widescreen, .flex-video.widescreen { padding-bottom: 56.25%; }