/*
Theme Name: Washington Research Foundation
Theme URI: http://www.drivendevelopment.com/
Description: Custom WordPress theme for Washington Research Foundation.
Author: <a href="http://www.drivendevelopment.com/" target="_blank">Driven Development</a> on behalf of <a href="http://www.the-medium.net" target="_blank">The Medium</a>
Version: 1.0
*/

/*
font-family: aktiv-grotesk,sans-serif;
font-weight: 400;
font-style: normal;

font-family: aktiv-grotesk,sans-serif;
font-weight: 400;
font-style: italic;

font-family: aktiv-grotesk,sans-serif;
font-weight: 700;
font-style: normal;

font-family: aktiv-grotesk,sans-serif;
font-weight: 800;
font-style: normal;
*/

@import url(default.css);

/**
 * Defaults and Resets
 */
*,
*:before,
*:after {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}

html {font-size: 62.5%; -webkit-text-size-adjust: none;}

html, body {margin: 0; padding: 0; background: #fff;}

body {font-family: 'aktiv-grotesk', Arial, Verdana, Sans-Serif; font-size: 14px; line-height: 22px; color: #202020; font-weight: 400;}

form {margin: 0; padding: 0;}

img {border: 0; max-width: 100%; height: auto;}

td {vertical-align: top;}

p {margin: 0 0 20px 0;}
p:last-child {margin: 0;}

a {transition: 0.25s ease; color: #4581a6; text-decoration: none;}
a:focus,
a:hover {color: #193946; text-decoration: underline;}

h2,
.h2 {margin: 0 0 10px 0; font-size: 32px; line-height: 37px; color: #193946; font-weight: 900;}
h3,
.h3 {margin: 0 0 5px 0; font-size: 18px; line-height: 22px; color: #193946; font-weight: 900; text-transform: uppercase;}

/**
 * General
 */
.clearBoth, .clear {clear: both; height: 0px; font-size: 0; line-height: 0; display: block;}
.clearfix {zoom: 1;}
.clearfix:after {content: ""; display: block; height: 0; font-size: 0; line-height: 0; clear: both; visibility: hidden;}
.hidden {height: 1px; left: -10000px; overflow: hidden; position: absolute; top: auto; width: 1px;}
.screen-reader-text,
.visually-hidden {border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important;}

a#skip,
a#skip:hover,
a#skip:visited {position: absolute; left: 0px; top: -500px; width: 1px; height: 1px; overflow: hidden;}
a#skip:active,
a#skip:focus {position: static; width: auto; height: auto;}

nav ul {margin: 0; padding: 0; list-style-type: none;}

/**
 * Layout
 */
#header {border-top: solid 6px #e8654e;}
#header .primary {height: 90px; position: relative; background: #fff;}
#header .logo {position: absolute; top: 17px; left: 0; width: 500px;}
#header .logo img {display: block;}
#header .logos {position: absolute; top: 13px; left: 40px; display: flex;}
#header .logos .secondary-logo {position: relative; margin-left: 40px; top: 13px;}
#header .logos .secondary-logo:before {position: absolute; content: ""; left: -20px; top: -6px; height: 45px; width: 1px; background: #c0d3e0;}
#header .logos img {display: block;}
#header .alert {background: #e8654e; position: relative; font-size: 18px; line-height: 22px; text-align: center; display: none; color: #fff; font-weight: bold;}
#header .alert > div {padding-top: 4px; padding-bottom: 10px;}
#header .alert a {color: #fff; text-decoration: none;}
#header .alert a:focus,
#header .alert a:hover {text-decoration: underline; color: #fff;}
#header .alert .close {position: absolute; top: 0; right: 10px; color: #fff; border: none; background: none; padding: 0; margin: 0; display: block; width: 38px; height: 38px; text-align: center; font-size: 20px; line-height: 38px;}
#header a {color: #193946; text-decoration: none;}
#header a:focus,
#header a:hover {color: #4581a6;}
#header nav {position: absolute; top: 25px; right: 80px; font-size: 14px; line-height: 18px;}
#header nav > ul {display: flex; align-items: center;}
#header nav > ul > li {padding: 8px 15px; position: relative;}
#header nav > ul > li + li {border-left: solid 1px #7fa8c2;}
#header nav > ul > li > a {font-weight: bold; text-transform: uppercase; letter-spacing: 1px; display: block; position: relative;}
#header nav > ul > li.active > a:after,
#header nav > ul > li.current-menu-item > a:after,
#header nav > ul > li.current-menu-ancestor > a:after,
body.single-story #header nav > ul > li.menu-item-90 > a:after {position: absolute; content: ""; bottom: -8px; height: 3px; left: 0; right: 0; background: #85b6d6;}
#header nav > ul > li.contact {border-left: none; padding: 0;}
#header nav > ul > li.contact > a {padding: 11px 20px; background: #4581a6; color: #fff;}
#header nav > ul > li.contact > a:after {display: none;}
#header nav > ul > li.contact > a:focus,
#header nav > ul > li.contact > a:hover {background-color: #193946;}
#header nav > ul > li > ul {position: absolute; top: 62px; left: -20px; opacity: 0; pointer-events: none; z-index: -1; width: 250px; background: #fff; padding: 5px 25px 15px 35px; box-shadow: 0 10px 10px 0 rgba(0,0,0,0.2);}
#header nav > ul > li > ul a {display: block; position: relative; text-transform: uppercase; padding: 5px 20px 5px 0;}
#header nav > ul > li > ul a:after {position: absolute; right: 0; top: 5px; content: ">";}
#header nav > ul > li.active > ul {opacity: 1; pointer-events: all; z-index: 1;}
#header .search button,
#header .toggle-search {position: absolute; top: 25px; right: 30px; width: 40px; height: 40px; background: none; border: none; margin: 0; text-align: center; color: #274551; font-size: 20px; line-height: 40px;}
#header button:focus,
#header button:hover {color: #193946;}
#header .toggle-menu {position: absolute; top: 33px; right: 40px; display: none;}
#header .search {display: flex; position: absolute; top: 25px; right: 30px; opacity: 0; pointer-events: none;}
#header .search [type="text"] {border: none; border-bottom: solid 1px #ccc; padding: 10px; font-size: 12px; line-height: 16px; width: 250px;}
#header .search button {position: static;}
#header.show-search nav {display: none;}
#header.show-search .search {opacity: 1; pointer-events: all;}
#header.show-search .toggle-search {display: none;}
body.alert-bar #header .alert {display: block;}

#main {padding: 0 0 80px 0;}

#page {min-width: 320px; transition: right 0.25s ease; position: relative; right: 0;}

#footer {font-size: 12px; line-height: 14px;}
#footer a {text-decoration: none; color: #193946;}
#footer a:focus,
#footer a:hover {text-decoration: underline;}
#footer > .upper {padding-top: 40px; padding-bottom: 40px; background: #f2f7f8; border-top: solid 20px #85b6d6;}
#footer > .upper .container {position: relative;}
#footer > .upper .menu {text-transform: uppercase; margin: 0; padding: 0; list-style-type: none;}
#footer > .upper .menu > li > a {font-weight: bold; letter-spacing: 1px;}
#footer > .upper .menu > li + li {margin-top: 20px;}
#footer > .upper .menu > li > ul {margin: 0; padding: 0; list-style-type: none;}
#footer > .upper .menu > li > ul > li {margin-top: 10px;}
#footer > .middle {padding-top: 30px; padding-bottom: 30px; color: #66686c; font-size: 14px; line-height: 22px;}
#footer > .middle .container {display: flex; flex-wrap: wrap; align-items: center; max-width: 900px;}
#footer > .middle .container > .left {width: 8%;}
#footer > .middle .container > .left img {display: block;}
#footer > .middle .container > .right {width: 92%; padding: 0 0 0 30px;}
#footer > .lower > div {padding-bottom: 20px; color: #66686c;}
#footer > .lower .container {display: flex; flex-wrap: wrap; border-top: solid 1px #b2b2b2; padding-top: 20px; justify-content: space-between;}
#footer > .lower a {color: #66686c;}
#footer > .lower ul {margin: 0; padding: 0; list-style-type: none; display: flex;}
#footer > .lower ul li + li:before {content: "|"; margin: 0 10px;}
#footer .cols {display: flex; flex-wrap: wrap; margin: 0 -30px -20px -30px;}
#footer .cols > div {width: 20%; padding: 0 30px 20px 30px; position: relative;}
#footer .logo {position: absolute; bottom: -30px; right: 0;}
#footer .social {display: flex; flex-wrap: wrap; margin: 0; padding: 0; list-style-type: none; position: absolute; left: calc(80% + 50px); bottom: 40px; font-size: 22px; line-height: 22px; color: #66686c;}
#footer .social li + li {margin-left: 15px;}
#footer .social a {color: #66686c;}
#footer .social a:focus,
#footer .social a:hover {color: #193946;}

#mobile-menu {position: fixed; top: -100vh; left: 0; width: 100%; height: 100vh; overflow-y: scroll; -webkit-overflow-scrolling: touch; background: #4581a6; z-index: 1000; opacity: 0; transition: 0.3s ease; pointer-events: none;}
#mobile-menu a {font-weight: bold;}
#mobile-menu nav {font-size: 16px; line-height: 22px;}
#mobile-menu nav li + li {margin-top: 10px;}
#mobile-menu nav > ul > li > a {font-weight: bold;}
#mobile-menu nav a {color: #fff; text-decoration: none; font-weight: normal;}
#mobile-menu nav a:focus,
#mobile-menu nav a:hover {text-decoration: underline;}
#mobile-menu nav ul ul {padding: 5px 0 5px 20px; font-size: 14px; line-height: 18px; font-weight: normal; display: none;}
#mobile-menu nav ul ul li + li {margin-top: 5px;}
#mobile-menu nav > ul > li.menu-item-has-children > a:after {font-family: 'Font Awesome 5 Pro'; content: "\f107"; display: inline-block; vertical-align: middle; margin-left: 10px; font-weight: 300;}
#mobile-menu nav .no-menu {display: none;}
#mobile-menu .close-menu {position: absolute; top: 15px; right: 15px; background: none; border: none; padding: 0; margin: 0; width: 30px; height: 30px; color: #fff; font-size: 20px; line-height: 30px; text-align: center;}
#mobile-menu .content {display: flex; align-items: center; height: 100%; padding: 40px;}
#mobile-menu .content > div {width: 100%;}

.section > div {max-width: 1640px; margin: 0 auto; padding: 0 40px; position: relative;}
.section.small-gutter > div {padding-top: 60px; padding-bottom: 60px;}
.section.gutter > div {padding-top: 40px; padding-bottom: 40px;}
.section.medium-gutter > div {padding-top: 60px; padding-bottom: 60px;}
.section.dark-green {background: #193946;}
.section.light-green {background: #fcf8f5;}
.section.green {background: #fcf8f5;}
.section.dark-blue {background: #193946; color: #fff;}
.section.dark-blue h3 {color: inherit;}

/**
 * Miscellaneous
 */
.toggle-menu {color: #193946; font-size: 18px; line-height: 20px; font-weight: 600; background: none; padding: 0; margin: 0; border: none;}
.toggle-menu > div {display: inline-block; width: 32px; height: 26px;}
.toggle-menu > div span {display: block; width: 32px; height: 4px; margin-bottom: 6px; background: #193946; transition: .3s ease;}
.toggle-menu.active {color: #193946;}
.toggle-menu.active > div {-webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg);}
.toggle-menu.active > div span {background: #193946;}
.toggle-menu.active > div span:nth-child(1) {-webkit-transform: translateY(7px); -ms-transform: translateY(7px); transform: translateY(7px);}
.toggle-menu.active > div span:nth-child(2) {opacity: 0;}
.toggle-menu.active > div span:nth-child(3) {-webkit-transform: rotate(-90deg) translateX(13px); -ms-transform: rotate(-90deg) translateX(13px); transform: rotate(-90deg) translateX(13px);}

.flexslider {touch-action: pan-y !important; -ms-touch-action: pan-y !important;}
.flexslider ul {margin: 0; padding: 0; list-style-type: none;}

blockquote {margin: 30px 0; padding: 0 40px; border-left: solid 5px #4581a6; font-size: 18px; line-height: 26px; font-weight: bold; color: #4581a6;}

hr {margin: 40px 0; height: 1px; background: #b2b2b2; font-size: 1px; line-height: 1px; border: none;}

.action-link {display: inline-block; font-size: 14px; line-height: 18px; font-weight: bold; text-transform: uppercase; text-decoration: none; background: none; padding: 0; margin: 0; border: none;}
.action-link:focus,
.action-link:hover {color: #000; text-decoration: none;}
.action-link.blue {color: #4581a6;}
.action-link.blue:focus,
.action-link.blue:hover {color: #000;}
.action-link.seafoam {color: #193946;}
.action-link.seafoam:focus,
.action-link.seafoam:hover {color: #000;}
.action-link.white {color: #fff;}
.action-link.white:focus,
.action-link.white:hover {color: #4581a6;}
.action-link.dark-blue {color: #202020;}
.action-link.dark-blue:focus,
.action-link.dark-blue:hover {color: #4581a6;}
.action-link.copper {color: #e8654e;}
.action-link.copper:focus,
.action-link.copper:hover {color: #000;}

.btn {display: inline-block; background: #4581a6; font-size: 12px; line-height: 16px; color: #fff; text-decoration: none; text-transform: uppercase; font-weight: bold; padding: 12px 20px; border: none; text-align: center;}
.btn:focus,
.btn:hover {background: #193946; color: #fff; text-decoration: none;}
.btn.copper {background: #e8654e;}
.btn.copper:focus,
.btn.copper:hover {background: #193946; color: #fff; text-decoration: none;}
.btn.lrg {font-size: 18px; line-height: 22px; padding: 15px 20px;}

.buttons {display: flex; flex-wrap: wrap; justify-content: space-around;}
.buttons .btn {min-width: 210px; margin: 20px;}

.contain {overflow: hidden;}

.split-columns {display: flex; flex-wrap: wrap; position: relative; margin: 0 -120px;}
.split-columns > div {width: 50%; padding: 0 120px;}
.split-columns > div:nth-child(odd) {border-right: solid 1px #b2b2b2;}

.split-sidebar-layout {display: flex; flex-wrap: wrap;}
.split-sidebar-layout > .left {width: 75%; padding: 0 50px 0 0; border-right: solid 1px #b2b2b2;}
.split-sidebar-layout > .right {width: 25%; padding: 0 0 0 50px;}

.callout-intro {display: flex; flex-wrap: wrap; font-size: 16px; line-height: 20px; color: #193946; font-weight: 900; margin: 0 0 30px 0; text-transform: uppercase;}
.callout-intro h2 {margin: 0; font-size: 40px; line-height: 44px; text-transform: uppercase; font-weight: 900;}
.callout-intro .icon {width: 100px; padding: 0 25px 0 0;}
.callout-intro .icon img {display: block;}
.callout-intro .content {width: calc(100% - 100px);}

.stats {font-size: 14px; line-height: 20px; margin: 0 -40px -60px -40px; color: #fff; text-align: center; display: flex; flex-wrap: wrap; justify-content: center;}
.stats > div {display: flex; flex-direction: column; padding: 0 40px 60px 40px; max-width: 300px; width: 20%;}
.stats > div > div {padding: 0 0 20px 0; flex-grow: 1;}
.stats img {display: block; margin: 0 auto 20px auto;}
.stats strong {font-size: 48px; line-height: 48px; display: block;}

.stats-2 {font-size: 18px; line-height: 24px; color: #193946; text-align: center; margin: 0 -40px -60px -40px; display: flex; flex-wrap: wrap; justify-content: center;}
.stats-2 > div {width: 33.3333%; padding: 0 40px 60px 40px;}
.stats-2 strong {font-size: 48px; line-height: 52px; display: block; margin: 0 0 5px 0;}
.stats-2 .icon img {display: block; margin: 0 auto 20px auto;}
body.page-template-template-technology-commercialization-grants .stats-2-banner {background: #193946; color: #fff;}
body.page-template-template-technology-commercialization-grants .stats-2 {color: #fff;}

.section-title {margin: 0 0 20px 0; font-size: 16px; line-height: 20px; color: #193946; text-transform: uppercase; font-weight: 900; position: relative;}
.section-title.twitter:before {position: absolute; font-family: 'Font Awesome 5 Brands'; content: "\f099"; right: 0; top: 0; font-size: 18px; line-height: 20px;}

.page-header {font-size: 16px; line-height: 26px; background: #dae6ed no-repeat center center; background-size: cover; color: #fff;}
.page-header > div {padding-top: 60px; padding-bottom: 60px;}
.page-header h1,
.page-header .h1 {margin: 0 0 5px 0; font-size: 18px; line-height: 22px; font-weight: 900; text-transform: uppercase; color: #fff; overflow-wrap: normal;}
.page-header h2,
.page-header .h2 {margin: 0 0 10px 0; font-size: 48px; line-height: 58px; font-weight: 900; color: #fff; overflow-wrap: normal;}
.page-header h3 {color: #fff;}
.page-header .content {max-width: 1000px;}
.page-header .action {display: inline-block; background: #85b6d6; padding: 20px 40px 20px 0; color: #183845; text-decoration: none; position: relative; text-transform: uppercase; font-weight: bold;}
.page-header .action:before {position: absolute; content: ""; top: 0; left: -1000px; bottom: 0; width: 1000px; background: #85b6d6;}
.page-header .action:after {content: ">"; margin-left: 5px;}
.page-header .action:focus,
.page-header .action:hover {text-decoration: underline;}
.page-header .large {font-size: 30px; line-height: 34px;}

.mfp-container {padding: 20px;}

.two-column-layout {overflow: hidden;}
.two-column-layout > div {display: flex; flex-wrap: wrap; margin: 0 -40px -80px -40px;}
.two-column-layout > div > div {width: 50%; padding: 0 40px 80px 40px;}

.columns-with-icons-module {position: relative;}
.columns-with-icons-module > div {padding-bottom: 40px;}
.columns-with-icons-module:before {position: absolute; content: ""; top: 0; right: 0; left: 0; height: 80px; background: #fff;}

.icon-column-layout {position: relative;}
.icon-column-layout > div {display: flex; flex-wrap: wrap;}
.icon-column-layout > div > div {width: 33.3333%; padding: 0 40px 40px 40px; position: relative;}
.icon-column-layout > div > div:before {position: absolute; content: ""; left: 0; top: 120px; bottom: 0; width: 1px; background: #a5aca9;}
.icon-column-layout h2 {margin: 0 0 5px 0; font-size: 18px; line-height: 22px; color: #193946; text-transform: uppercase; font-weight: bold;}
.icon-column-layout .icon img {display: block; margin: 0 auto 40px auto;}

.callout-banner {text-align: center; font-size: 23px; line-height: 29px; color: #fff; font-weight: 300;}
.callout-banner .content {max-width: 1000px; margin: 0 auto;}

.pagination {margin: 30px 0; text-align: center; font-size: 16px; line-height: 20px; display: flex; justify-content: center;}
.pagination .nav-links {background: #f2f7f8; display: flex; justify-content: center; align-items: center;}
.pagination .page-numbers {margin: 0 15px;}
.pagination .page-numbers.current {color: #4581a6;}
.pagination .prev,
.pagination .next {width: 45px; height: 45px; background: #86b6d5; color: #fff; font-size: 35px; line-height: 51px; margin: 0;}
.pagination .next {background: #4581a6;}
.pagination .prev:focus,
.pagination .prev:hover,
.pagination .next:focus,
.pagination .next:hover {background: #193946; color: #fff;}
.pagination .fa {font-weight: 300;}
.pagination a {color: #202020; text-decoration: none;}
.pagination a:focus,
.pagination a:hover {color: #4581a6;}

.search-results > div + div {margin-top: 40px; padding-top: 40px; border-top: solid 1px #ccc;}
.search-results h2 {margin: 0; font-size: 26px; line-height: 30px;}

.infographic-banner {background: #f2f7f8;}
.infographic-banner h2 {margin: 0; text-transform: uppercase;}
.infographic-banner .container {display: flex; flex-wrap: wrap;}
.infographic-banner .container > .left {width: 70%; padding: 0 40px 0 0;}
.infographic-banner .container > .right {width: 30%; padding: 35px 0 0 0;}

.logo-grid {margin: 0 -20px; display: flex; flex-wrap: wrap; align-items: center;}
.logo-grid > div {width: 20%; padding: 0 10px 20px 10px;}
.logo-grid img {margin: 0 auto; display: block;}

/**
 * Stories
 */
.stories {display: flex; flex-wrap: wrap; margin: 0 -30px -60px -30px;}
.stories > div {display: flex; width: 50%; padding: 0 30px 60px 30px;}

.story-box {display: flex; flex-wrap: wrap; width: 100%; background: #dae6ed;}
.story-box h3 {margin: 0 0 10px 0; font-size: 18px; line-height: 22px; font-weight: 900; color: #193946;}
.story-box .photo {width: 37%; background: no-repeat center center; background-size: cover;}
.story-box .content {padding: 40px 40px 70px 40px; position: relative; width: 63%;}
.story-box .action-link {position: absolute; left: 40px; bottom: 40px;}
.story-box .action-link:after {margin-left: 5px; content: ">";}

.story-page-header {background: #4581a6;}
.story-page-header > div {padding-top: 60px; padding-bottom: 60px;}
.story-page-header h1 {margin: 0; font-size: 48px; line-height: 48px; color: #fff; text-transform: uppercase;}
.story-page-header .container {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end;}
.story-page-header .content {max-width: 950px;}
.story-page-header .section-header {margin: 0 0 10px 0; font-size: 18px; line-height: 22px; color: #adcddd; font-weight: 900; text-transform: uppercase; letter-spacing: 1px;}

.story-sidebar-layout {display: flex; flex-wrap: wrap; align-items: flex-start;}
.story-sidebar-layout > div {width: 70%; padding: 0 80px 0 0;}
.story-sidebar-layout > aside {width: 30%; padding: 50px 40px; background: #dae6ed; border-top: solid 14px #4581a6;}
.story-sidebar-layout > aside h2 {margin: 0 0 20px 0; font-size: 32px; line-height: 36px; color: #4581a6; font-weight: 900; text-transform: uppercase;}
.story-sidebar-layout > aside h3 {margin: 0 0 5px 0; font-size: 18px; line-height: 22px; color: #193946; font-weight: 900; text-transform: uppercase;}
.story-sidebar-layout > aside ul {margin: 0 0 30px 0; padding: 0 0 0 20px;}

.story-banner {display: flex; flex-wrap: wrap; background: #86b6d5; flex-direction: row-reverse;}
.story-banner h2 {margin: 0;}
.story-banner h3 {margin: 0 0 10px 0; font-size: 40px; line-height: 44px; color: #fff; text-transform: none;}
.story-banner h3 a {color: #fff; text-decoration: none;}
.story-banner h3 a:focus,
.story-banner h3 a:hover {text-decoration: underline;}
.story-banner > .content {width: 50%; display: flex; justify-content: flex-end; align-items: center;}
.story-banner > .content > div {width: 100%; max-width: 820px; padding: 40px 100px 40px 40px;}
.story-banner > .photo {width: 50%; background: no-repeat center center; background-size: cover;}
.story-banner > .photo img {width: 100%; display: block; visibility: hidden;}

.story .thumb {float: left; max-width: 260px; margin: 5px 60px 20px 0;}

.other-stories {margin: 100px 0 0 0; padding: 40px 0 0 0; border-top: solid 1px #b2b2b2;}
.other-stories h3 {margin: 0 0 30px 0;}

.wp-caption {font-size: 14px; line-height: 18px; color: #5a5a5a; text-align: right; font-style: italic; margin: 0 0 20px 0;}

.alignnone img {display: block; width: 100%; margin: 0 0 10px 0;}

/**
 * Team
 */
.profile-group header {margin: 0 0 20px 0;}
.profile-group header h3 {margin: 0 0 20px 0; font-size: 32px; line-height: 36px; color: #4581a6; font-weight: 900; text-transform: uppercase;}
.profile-group + .profile-group {border-top: solid 1px #b2b2b2; padding-top: 70px; margin-top: 70px;}
.profile-group.green .profiles button {color: #fff;}
.profile-group.green .profiles .content {background-color: #193946;}

.profiles {display: flex; flex-wrap: wrap; margin: 0 -30px -60px -30px; color: #fff;}
.profiles > div {width: 20%; padding: 0 30px 60px 30px; display: flex;}
.profiles > div > div {position: relative; width: 100%;}
.profiles h4 {margin: 0; font-size: 16px; line-height: 20px; text-transform: uppercase; font-weight: bold; color: #fff;}
.profiles img {display: block; width: 100%;}
.profiles button {position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; background: none; border: none; margin: 0; padding: 0; font-size: 18px; font-weight: bold; color: #fff; z-index: 1;}
.profiles button .fa {position: absolute; right: 20px; bottom: 20px;}
.profiles button:focus + .content,
.profiles button:hover + .content {text-decoration: underline;}
.profiles a {color: #fff;}
.profiles .thumb {padding-bottom: 120%; position: relative;}
.profiles .thumb img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
.profiles .content {padding: 15px 40px 15px 20px; position: absolute; left: 0; right: 0; bottom: 0; color: #fff;}
.profiles .content:before {position: absolute; content: ""; top: 0; right: 0; bottom: 0; left: 0; background: #4581a6; mix-blend-mode: multiply;}
.profiles .content > div {position: relative;}
.profiles .profile {display: none;}
.profiles .title {margin: 0; font-size: 13px; line-height: 15px;}

#profile-dialog h1 {margin: 0; font-size: 26px; line-height: 30px; color: #4581a6; font-weight: 900; text-transform: uppercase;}
#profile-dialog .head {padding: 15px 20px; background: #4581a6;}
#profile-dialog .body {padding: 50px 40px; display: flex; flex-wrap: wrap;}
#profile-dialog .body .thumb {width: 50%;}
#profile-dialog .body .thumb img {display: block; width: 100%;}
#profile-dialog .body .content {width: 50%; padding: 0 0 0 40px;}
#profile-dialog .bio {margin: 20px 0 0 0;}
#profile-dialog .title {margin: 0; font-size: 16px;}
#profile-dialog .links {margin: 5px 0 0 0; padding: 0; list-style-type: none; display: flex;}
#profile-dialog .links li + li {margin-left: 6px;}
#profile-dialog .links a {display: block; width: 32px; height: 32px; border-radius: 50%; font-size: 16px; line-height: 32px; text-align: center; border: solid 2px #4581a6; color: #4581a6; text-decoration: none;}
#profile-dialog .links a:focus,
#profile-dialog .links a:hover {border-color: #000; color: #000;}

body.single-profile .mfp-bg {opacity: 0;}

.dialog {max-width: 950px; margin: 0 auto; box-shadow: 0 5px 50px 0 rgba(0,0,0,0.2); position: relative; background: #fff;}
.dialog .mfp-close {opacity: 1; color: #fff; border: solid 2px #fff; top: 12px; right: 12px; border-radius: 50%; font-size: 0px; line-height: 0px;}
.dialog .mfp-close:before {font-family: 'Font Awesome 5 Pro'; content: "\f00d"; position: absolute; top: 0; left: 0; font-weight: 300; width: 100%; height: 100%; font-size: 30px; line-height: 42px;}
.dialog .mfp-close:focus,
.dialog .mfp-close:hover {color: #000; border-color: #000;}

.forward-back-nav {display: flex;}
.forward-back-nav .button {background: #376785; border: none; margin: 0; padding: 0; text-align: center; width: 40px; height: 40px; cursor: pointer; text-decoration: none; font-size: 40px; line-height: 40px; color: #fff; font-weight: 300;}
.forward-back-nav .button .fa {font-weight: 300;}
.forward-back-nav .button.next {background: #294d64; margin-left: 8px;}
.forward-back-nav .button:focus,
.forward-back-nav .button:hover {background: #193946;}

/**
 * Fellows
 */
.fellow-group header {margin: 0 0 20px 0;}
.fellow-group header h3 {margin: 0 0 20px 0; font-size: 32px; line-height: 36px; color: #4581a6; font-weight: 900; text-transform: uppercase;}
.fellow-group + .profile-group {border-top: solid 1px #b2b2b2; padding-top: 70px; margin-top: 70px;}

.fellows > div {display: flex; flex-wrap: wrap;}
.fellows > div + div {margin-top: 40px;}
.fellows > div > .thumb {width: 25%;}
.fellows > div > .thumb img {display: block; width: 100%;}
.fellows > div > .content {width: 75%; padding: 0 0 0 40px;}
.fellows h4 {margin: 0; font-size: 18px; line-height: 22px; color: #193946;}
.fellows .title {font-style: italic;}
.fellows .read-more-container {overflow: hidden;}
.fellows .read-more-container .content {max-height: 0px; transition: 1s;}
.fellows .read-more-container.show-more .content {max-height: 1000px;}
.fellows .read-more-container.show-more + p {margin-top: 20px;}

.fellows-layout {display: flex; flex-wrap: wrap; flex-direction: row-reverse;}
.fellows-layout > .right {width: 25%;}
.fellows-layout > .left {width: 75%; padding: 0 60px 0 0;}

/**
 * News
 */
.article-tile {background: #dae6ed; display: flex; flex-wrap: wrap; color: #383838; margin: 0 0 60px 0;}
.article-tile:last-child {margin: 0;}
.article-tile h3 {margin: 0; font-size: 16px; line-height: 20px; text-transform: none;}
.article-tile .photo {width: 45%; background: no-repeat center center; background-size: cover; padding-bottom: 25%;}
.article-tile .content {width: 55%; padding: 40px 50px;}
.article-tile .meta {margin: 0 0 5px 0; font-size: 13px; line-height: 17px;}

.articles {display: flex; flex-wrap: wrap; margin: 0 -20px -50px -20px;}
.articles > div {width: 50%; padding: 0 20px 50px 20px; display: flex; flex-wrap: wrap;}
.articles > div > .photo {width: 35%; background: no-repeat center center; background-size: cover; padding-bottom: 23%;}
.articles > div > .content {width: 65%; padding: 0 0 0 30px;}
.articles h3 {margin: 0; font-size: 16px; line-height: 22px; text-transform: none;}
.articles h3 a {text-decoration: none;}
.articles h3 a:focus,
.articles h3 a:hover {text-decoration: underline;}
.articles .meta {margin: 0 0 5px 0; font-size: 13px; line-height: 17px;}
.articles.large-thumbs > div > .photo {width: 45%; padding-bottom: 33%;}
.articles.large-thumbs > div > .content {width: 55%;}

.sidebar-layout {display: flex; flex-wrap: wrap;}
.sidebar-layout > .content {width: 75%; padding: 0 40px 0 0; border-right: solid 1px #b2b2b2;}
.sidebar-layout > aside {width: 25%; padding: 0 0 0 40px;}
.sidebar-layout .h3 {margin: 0 0 20px 0;}
.sidebar-layout .item {margin: 0 0 50px 0;}
.sidebar-layout .thumb {margin: 0 0 15px 0;}
.sidebar-layout .thumb img {display: block; width: 100%;}
.sidebar-layout .links {margin: 0; padding: 0; list-style-type: none; font-size: 18px; line-height: 22px; font-weight: bold;}
.sidebar-layout .links li + li {margin-top: 10px;}
.sidebar-layout .links a {color: #4581a6; text-decoration: none;}
.sidebar-layout .links a:focus,
.sidebar-layout .links a:hover {color: #000;}

.sidebar-layout-2 {display: flex; flex-wrap: wrap;}
.sidebar-layout-2 > .content {width: 66.6666%; padding: 0 25px 0 0;}
.sidebar-layout-2 > aside {width: 33.3333%; padding: 0 0 0 25px;}
.sidebar-layout-2 > aside > .intro {font-size: 16px; line-height: 24px; color: #fff; padding: 20px; background: #193946;}
.sidebar-layout-2 > aside > .intro.orange {background: #e8654e;}
.sidebar-layout-2 > aside > .content {background: #fcf8f5; padding: 30px 20px;}
.sidebar-layout-2 > aside h3 {color: inherit;}

.sidebar-logos {display: flex; flex-wrap: wrap;}
.sidebar-logos > div {width: 50%; display: flex; align-items: center; padding: 10px; justify-content: center;}
.sidebar-logos img {max-height: 80px; width: auto;}

/**
 * Grants
 */
body.page-template-template-grants .page-header .content {max-width: 800px;}

.grants-layout {display: flex; flex-wrap: wrap;}
.grants-layout > .content {width: 70%; padding: 0 40px 0 0;}
.grants-layout > aside {width: 30%;}

.grant-filters {background: #fcf8f5;}
.grant-filters h2 {margin: 0; padding: 20px 40px; font-size: 18px; line-height: 22px; background: #e8654e; color: #fff; text-transform: uppercase;}
.grant-filters ul {margin: 0; padding: 0; list-style-type: none; transition: 0.5s ease; overflow: hidden; }
.grant-filters ul li {margin-top: 5px;}
.grant-filters fieldset {border: none; padding: 0; margin: 20px 0 0 0;}
.grant-filters legend,
.grant-filters legend button {font-size: 18px; line-height: 22px; font-weight: 900; text-transform: uppercase; color: #193946; padding: 0;}
.grant-filters legend button {margin: 0; display: inline-block; background: none; border: none; padding: 0;}
.grant-filters legend button[aria-expanded="true"]:after {content: "\f106";}
.grant-filters legend button:after {font-family: 'Font Awesome 5 Pro'; content: "\f107"; margin-left: 10px;}
.grant-filters legend button:focus,
.grant-filters legend button:hover {color: #4581a6;}
.grant-filters ul[aria-hidden="true"] {max-height: 0px;}
.grant-filters ul[aria-hidden="false"] {max-height: 999px;}
.grant-filters > .content {padding: 40px;}
.grant-filters [type="text"] {display: block; width: 100%; background: #fff; border: solid 1px #b8cdc7; padding: 10px; font-size: 16px; line-height: 20px;}
.grant-filters [type="checkbox"] {position: absolute; left: -10000px; width: 1px; height: 1px; border: none; margin: 0; padding: 0;}
.grant-filters [type="checkbox"] + label {position: relative; padding: 0 0 0 25px; display: block;}
.grant-filters [type="checkbox"] + label:before {display: block; content: ""; position: absolute; top: 0px; left: 0; width: 16px; height: 16px; background: #fff; border: solid 1px #c7d2d9;}
.grant-filters [type="checkbox"]:checked + label:before {background: #4581a6;}
.grant-filters p label {display: block; margin: 0 0 5px 0; text-transform: uppercase; font-weight: 900; color: #193946;}
.grant-filters .keywords {margin: 0;}
.grant-filters .cols {display: flex; flex-wrap: wrap;}
.grant-filters .cols > div:first-child {width: 45%; padding: 0 20px 0 0;}
.grant-filters .cols > div:last-child {width: 55%;}
.grant-filters .fine-print {color: #193946; margin: 10px 0 0 0; font-size: 14px; line-height: 18px;}
.grant-filters .actions {margin: 30px 0 0 0;}
.grant-filters .actions .btn {margin-right: 10px;}

.grants {border-collapse: collapse; margin: 0 0 30px 0; width: 100%;}
.grants th {padding: 10px 10px; border-bottom: solid 1px #b2b2b2; font-weight: bold; text-transform: uppercase; text-align: left; white-space: nowrap;}
.grants th:first-child {padding-left: 0;}
.grants td {padding: 15px 10px; border-bottom: solid 1px #b2b2b2;}
.grants td:first-child {padding-left: 0;}
.grants td.institution {font-weight: bold;}
.grants .sort {color: #193946; text-decoration: none; text-transform: uppercase; display: inline-block; vertical-align: middle;}
.grants .sort:before {width: 24px; height: 24px; display: inline-block; position: relative; top: -2px; vertical-align: middle; margin-right: 10px; border: solid 1px #193946; font-family: 'Font Awesome 5 Pro'; content: "\f107"; text-align: center; font-size: 20px; line-height: 24px; color: #fff; color: #193946;}
.grants .sort.active:before {background: #193946; color: #fff;}

.grid-items {display: flex; flex-wrap: wrap; margin: 0 -25px 30px -25px;}
.grid-items > div {width: 50%; padding: 0 25px 40px 25px; display: flex;}
.grid-items > div > div {padding: 50% 0 0 0; background: no-repeat center center; background-size: cover; width: 100%; position: relative; overflow: hidden;}
.grid-items > div > div > a {position: absolute; top: 0; left: 0; right: 0; bottom: 0;}
.grid-items h2 {margin: 0 0 5px 0; font-size: 18px; line-height: 22px; text-transform: uppercase; color: inherit;}
.grid-items h2 a {text-decoration: none; color: inherit;}
.grid-items .content {position: relative; padding: 20px; color: #fff; text-align: center;}
.grid-items .content:before {background: #4581a6; mix-blend-mode: multiply; position: absolute; content: ""; top: 0; right: 0; bottom: -1000px; left: 0;}
.grid-items .content > div {position: relative;}
.grid-items.x3 > div {width: 33.3333%;}

.grid-items-2 {display: flex; flex-wrap: wrap; margin: 0 -25px 30px -25px; text-align: center; color: #fff; justify-content: center;}
.grid-items-2 > div {width: 33.3333%; padding: 0 25px 40px 25px; display: flex;}
.grid-items-2 > div > div {background: #4581a6;}
.grid-items-2 h3 {margin: 0 0 5px 0; font-size: 16px; line-height: 24px; text-transform: uppercase; color: inherit;}
.grid-items-2 h3 a {text-decoration: none; color: inherit;}
.grid-items-2 .upper {padding: 50% 0 0 0; background: no-repeat center center; background-size: cover; width: 100%; position: relative; overflow: hidden;}
.grid-items-2 .upper > a {position: absolute; top: 0; left: 0; right: 0; bottom: 0;}
.grid-items-2 .headline {position: relative; padding: 10px 20px; color: #fff; text-align: center; min-height: 75px;}
.grid-items-2 .headline:before {background: #4581a6; mix-blend-mode: multiply; position: absolute; content: ""; top: 0; right: 0; bottom: -1000px; left: 0;}
.grid-items-2 .headline > div {position: relative;}
.grid-items-2 .content {padding: 20px;}

.funding-rows {margin: 40px 0 150px 0;}
.funding-rows > div {display: flex; flex-wrap:  wrap; align-items: center;}
.funding-rows > div > .left {width: 30%; padding: 0 40px 0 0;}
.funding-rows > div > .right {width: 70%; padding: 0 0 0 40px; border-left: solid 6px #74a2bf;}
.funding-rows > div + div {margin-top: 80px; padding-top: 80px; border-top: solid 1px #b2b2b2;}

.funding {
    margin: 0 0 40px 0;
    font-size: 14px;
    line-height: 18px;
    display: grid;
    grid-column-gap: 15px;
    grid-template-columns: 1fr 1.5fr 2.5fr;
    grid-template-areas:
        "c1-head c2-head c3-head"
        "c1-subhead-1 c2-subhead-1 c3-subhead-1"
        "c1-content-1 c2-content-1 c3-content-1"
        "c1-subhead-2 c2-subhead-2 c3-subhead-2"
        "c1-content-2 c2-content-2 c3-content-2"
        "c1-subhead-3 c2-subhead-3 c3-subhead-3"
        "c1-content-3 c2-content-3 c3-content-3"
        ;
}
.funding h5 {margin: 0; font-size: 14px; line-height: 16px; text-transform: uppercase; font-weight: bold;}
.funding ul {margin: 0; padding: 0 0 0 20px;}
.funding ul li + li {margin-top: 5px;}
.funding .head {min-height: 115px; text-align: center; display: flex; align-items: center; justify-content: center; margin: 0 0 15px 0; font-weight: bold;}
.funding .head h4 {margin: 0 0 5px 0; font-size: 18px; line-height: 22px; color: #000; text-transform: uppercase; font-weight: bold;}
.funding .subhead {text-align: center; padding: 10px 20px;}
.funding .content {padding: 20px; text-align: left;}
.funding .c1-head {grid-area: c1-head; background: #b6d3e6; position: relative;}
.funding .c1-head:before {position: absolute; content: ""; width: 65px; top: 0; right: -65px; bottom: 0; background: url(images/funding-arrow-1.png) no-repeat; z-index: 1;}
.funding .c2-head {grid-area: c2-head; background: #86b6d5; position: relative;}
.funding .c2-head:before {position: absolute; content: ""; width: 68px; top: 0; right: -68px; bottom: 0; background: url(images/funding-arrow-2.png) no-repeat; z-index: 1;}
.funding .c3-head {grid-area: c3-head; background: #4581a6; color: #fff;}
.funding .c3-head h4 {color: #fff;}
.funding .c3-head > div {display: flex; width: 100%;}
.funding .c3-head > div > div {width: 50%; position: relative; z-index: 2; padding: 0 20px;}
.funding .c3-head > div > div:first-child {border-right: solid 1px #aec8d8;}
.funding .c1-subhead {background: #b6d3e6;}
.funding .c2-subhead {background: #86b6d5;}
.funding .c3-subhead {background: #4581a6;}
.funding .c3-subhead h5 {color: #fff;}
.funding .c1-content {background: #f0f6fa;}
.funding .c2-content {background: #e2eef5;}
.funding .c3-content {background: #dae5ec;}
.funding .c1-subhead-1 {grid-area: c1-subhead-1;}
.funding .c2-subhead-1 {grid-area: c2-subhead-1;}
.funding .c3-subhead-1 {grid-area: c3-subhead-1;}
.funding .c1-content-1 {grid-area: c1-content-1;}
.funding .c2-content-1 {grid-area: c2-content-1;}
.funding .c3-content-1 {grid-area: c3-content-1;}
.funding .c1-subhead-2 {grid-area: c1-subhead-2;}
.funding .c2-subhead-2 {grid-area: c2-subhead-2;}
.funding .c3-subhead-2 {grid-area: c3-subhead-2;}
.funding .c1-content-2 {grid-area: c1-content-2;}
.funding .c2-content-2 {grid-area: c2-content-2;}
.funding .c3-content-2 {grid-area: c3-content-2;}
.funding .c1-subhead-3 {grid-area: c1-subhead-3;}
.funding .c2-subhead-3 {grid-area: c2-subhead-3;}
.funding .c3-subhead-3 {grid-area: c3-subhead-3;}
.funding .c1-content-3 {grid-area: c1-content-3;}
.funding .c2-content-3 {grid-area: c2-content-3;}
.funding .c3-content-3 {grid-area: c3-content-3;}
.funding .split {display: flex;}
.funding .split > div {width: 50%;}
.funding .split > div:first-child {border-right: solid 1px #1f4353;}

.tc-programs {border-bottom: solid 18px #e8654e;}
.tc-programs .intro {background: #e8654e; color: #fff; text-transform: uppercase; font-weight: bold; font-size: 18px; line-height: 22px; text-align: center;}
.tc-programs .intro > div {padding-top: 20px; padding-bottom: 20px;}
.tc-programs .logos {background: #fcf8f5;}
.tc-programs .logos > div {padding-top: 40px; padding-bottom: 40px;}
.tc-programs .logos > div > div {display: flex; flex-wrap: wrap; justify-content: center;}
.tc-programs .logos > div > div > div {width: 33.3333%; display: flex; align-items: center; justify-content: center;}

.timeline {padding: 0; list-style-type: none; max-width: 350px; margin: 20px auto;}
.timeline > li {padding: 0 0 50px 55px; position: relative;}
.timeline > li:before {position: absolute; content: ""; left: 14px; top: 0; bottom: 0; width: 2px; background: #d7d7d7;}
.timeline > li:after {position: absolute; content: ""; left: 0; top: 0; width: 30px; height: 30px; border-radius: 50%; background: #df6649;}
.timeline > li:last-child {padding-bottom: 0;}
.timeline > li:last-child:before {display: none;}

.intro-copy {font-size: 24px; line-height: 38px; font-weight: bold; text-align: center; color: #193946; margin: 20px 0 60px 0;}

body.page-template-template-grants-v2 #main,
body.page-template-template-pfp #main,
body.page-template-template-student-programs #main,
body.page-template-template-technology-commercialization-grants #main {padding-bottom: 0;}

.current-funding-callout {display: flex; background: #4581a6; margin: 0 0 40px 0; font-size: 14px; line-height: 22px; color: #fff;}
.current-funding-callout h3 {font-size: 16px; line-height: 24px; text-transform: uppercase; color: #fff; margin: 0 0 5px 0;}
.current-funding-callout h3 a {color: #fff;}
.current-funding-callout .photo {width: calc(33.3333% - 33px); position: relative; min-height: 300px;}
.current-funding-callout .photo img {display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
.current-funding-callout .content {width: calc(66.6666% + 33px); padding: 40px; display: flex; align-items: center;}
body.page-template-template-student-programs-v2 .current-funding-callout .photo {min-height: 100px; background: #fff;}
body.page-template-template-student-programs-v2 .current-funding-callout .photo img {object-fit: contain;}

body.page-id-7881 .sidebar-layout-2 {display: block;}
body.page-id-7881 .sidebar-layout-2 > .content {width: 100%; padding: 0;}

/**
 * Front page
 */
#hero {position: relative; font-size: 16px; line-height: 24px; color: #fff;}
#hero h1 {margin: 0 0 20px 0; font-size: 56px; line-height: 56px; font-weight: 900; text-transform: uppercase; letter-spacing: 1px; color: #fff;}
#hero h1 em {font-size: 90px; line-height: 90px; font-style: normal; display: block;}
#hero .container {padding: 60px 0; max-width: 625px;}
#hero .hero-callout {font-size: 14px; line-height: 22px; display: flex; flex-wrap: wrap; align-items: center; position: relative; margin: 40px 0 0 0; background: rgba(134,182,213,0.83); padding: 40px 40px 40px 0; color: #212121;}
#hero .hero-callout:before {position: absolute; content: ""; top: 0; left: -1000px; bottom: 0; width: 1000px; background: rgba(134,182,213,0.83);}
#hero .hero-callout > .image {width: 37%;}
#hero .hero-callout > .image img {display: block;}
#hero .hero-callout > .content {width: 63%; padding: 0 0 0 40px;}
#hero .slider {position: absolute; top: 0; right: 0; bottom: 0; left: 0;}
#hero .slider .slide {width: 100%; height: 100%; background: no-repeat center center; background-size: cover;}
#hero .slider .slick-list {height: 100%;}
#hero .slider .slick-track {height: 100%;}
#hero .slider .slick-dots {margin: 0 auto; padding: 0; list-style-type: none; position: absolute; bottom: 20px; left: calc(50% - 780px); z-index: 10;}
#hero .slider .slick-dots li {float: left; margin: 0 10px 0 0;}
#hero .slider .slick-dots button {font-size: 0px; line-height: 0px; text-indent: -10000px; display: block; width: 17px; height: 17px; background: rgba(255,255,255,0.4); cursor: pointer; border: none; outline: none;}
#hero .slider .slick-dots button:focus,
#hero .slider .slick-dots button:hover {background: #fff;}
#hero .slider .slick-dots .slick-active button {background: #fff;}

.news-grid {display: flex; flex-wrap: wrap; margin: 0 -30px;}
.news-grid > div {width: 50%; padding: 0 30px 40px 30px; display: flex;}
.news-grid h3 {margin: 0; font-size: 16px; line-height: 22px; color: #193946; text-transform: none;}
.news-grid h3 a {text-decoration: none;}
.news-grid h3 a:focus,
.news-grid h3 a:hover {text-decoration: underline;}
.news-grid .photo {width: 35%;}
.news-grid .content {width: 65%; padding: 0 0 0 30px;}
.news-grid .meta {font-size: 12px; line-height: 16px; color: #595959; margin: 0 0 5px 0;}
.news-grid.x3 > div {width: 33.3333%;}

/**
 * Investments
 */
.investments-layout {display: flex; flex-wrap: wrap; align-items: flex-start;}
.investments-layout > .content {width: 70%; padding: 0 30px 0 0;}
.investments-layout > aside {width: 30%; padding: 40px; background: #f2f7f8;}

.investments {display: flex; flex-wrap: wrap; margin: 0 -15px -30px -15px;}
.investments > div {width: 33.3333%; display: flex; padding: 0 15px 30px 15px;}
.investments .details {width: 100%; min-height: 225px; display: flex; align-items: center; justify-content: center; padding: 30px 30px 70px 30px; position: relative; border: none; background: #fff; margin: 0; box-shadow: 0 0 15px 0 rgba(58,70,78,0.2); transition: 0.25s ease;}
.investments .details span {position: absolute; left: 0; right: 0; bottom: 0; font-size: 16px; line-height: 40px; font-weight: bold; text-align: right; padding: 0 15px; color: #fff; text-transform: uppercase; background: #4581a6; transition: 0.25s ease;}
.investments .details span:after {display: inline-block; font-family: 'Font Awesome 5 Pro'; content: "\f067"; margin-left: 10px; line-height: normal;}
.investments .details:focus,
.investments .details:hover {transform: scale(1.1);}
.investments .details:focus span,
.investments .details:hover span {background: #e8654e;}
.investments .investment-profile {display: none;}

.exits {display: flex; flex-wrap: wrap; margin: 30px -7px -14px -7px;}
.exits > div {width: 16.6666%; padding: 0 7px 14px 7px; display: flex;}
.exits > div > div {width: 100%; display: flex;}
.exits button {width: 100%; border: none; display: flex; align-items: center; justify-content: center; min-height: 170px; background: #fff; box-shadow: 0 0 15px 0 rgba(58,70,78,0.2); padding: 20px; margin: 0; transition: 0.25s ease;}
.exits button:focus,
.exits button:hover {transform: scale(1.1);}
.exits .investment-profile {display: none;}

#investment-dialog .head {padding: 15px 20px; background: #4581a6;}
#investment-dialog .body {padding: 50px 40px; display: flex; flex-wrap: wrap;}
#investment-dialog .body > .logo {width: 25%; padding: 0 20px 0 0;}
#investment-dialog .body > .content {width: 75%; padding: 0 0 0 30px; border-left: solid 1px #b2b2b2;}
#investment-dialog .body h2 {margin: 0; font-size: 26px; line-height: 30px; text-transform: uppercase;}
#investment-dialog .body h3 {margin: 0; font-size: 13px; line-height: 17px; text-transform: uppercase; color: #193946;}
#investment-dialog .body .description {margin: 30px 0;}
#investment-dialog .body .website {font-size: 16px; line-height: 20px;}
#investment-dialog .body .website a {color: #4581a6; text-decoration: none;}
#investment-dialog .body .website a:focus,
#investment-dialog .body .website a:hover {text-decoration: underline; color: #193946;}
#investment-dialog .body .meta {display: flex; flex-wrap: wrap; margin: 0 -10px -20px -10px;}
#investment-dialog .body .meta > div {width: 50%; padding: 0 10px 20px 10px;}

.investment-filters-bar > div {padding-top: 25px; padding-bottom: 25px;}

.investment-filters .filters {display: flex; align-items: center;}
.investment-filters .toggle-filters {font-size: 22px; line-height: 26px; color: #193946; font-weight: bold; text-transform: uppercase; position: relative; background: none; border: none; padding: 0; margin: 0; display: none;}
.investment-filters .toggle-filters:after {display: inline-block; vertical-align: middle; margin-left: 10px; font-family: 'Font Awesome 5 Pro'; content: "\f107";}
.investment-filters .filter {position: relative; width: calc(25% - 100px); padding-left: 20px; flex-grow: 1;}
.investment-filters .filter .filter-label {margin: 0 0 2px 0; font-size: 14px; line-height: 18px; color: #193946; font-weight: bold; text-transform: uppercase; display: block;}
.investment-filters .filter-toggle {display: block; text-align: left; width: 100%; cursor: pointer; border: solid 1px #b8cdc7; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 10px 40px 10px 10px; font-size: 16px; line-height: 20px; position: relative; background: #fff; margin: 0;}
.investment-filters .filter-toggle:after {position: absolute; top: 10px; right: 10px; font-family: 'Font Awesome 5 Pro'; content: "\f107"; color: #193946;}
.investment-filters .filter-toggle + ul {margin: 0; padding: 0; list-style-type: none; opacity: 0; transition: 0.5s ease; pointer-events: none; position: absolute; left: 20px; right: 0; background: #fff; z-index: 0; border: solid 1px #b8cdc7; border-top-width: 0;}
.investment-filters .filter-toggle + ul label {display: block; padding: 5px 10px; cursor: pointer; font-size: 16px; line-height: 20px;}
.investment-filters .filter-toggle + ul label:hover,
.investment-filters .filter-toggle + ul input:focus + label {background: #193946; color: #fff;}
.investment-filters .filter-toggle[aria-expanded="true"]:after {content: "\f106";}
.investment-filters .filter-toggle[aria-expanded="true"] + ul {opacity: 1; pointer-events: all; z-index: 1;}
.investment-filters .filter-toggle span {text-overflow: ellipsis;}
.investment-filters .main-label {font-size: 16px; line-height: 20px; color: #193946; font-weight: bold; text-transform: uppercase; padding-top: 22px;}
.investment-filters .go {width: 43px; padding: 22px 0 0 1px;}
.investment-filters .go button {background: #e8654e; display: block; width: 100%; text-align: center; color: #fff; border: none; padding: 0; margin: 0;}
.investment-filters .go button .fa {font-size: 20px; line-height: 42px;}
.investment-filters .go button:focus,
.investment-filters .go button:hover {background: #193946;}
.investment-filters [type="text"] {display: block; width: 100%;}

.faqs {padding: 20px 40px; background: #f2f7f8;}
.faqs > div + div {margin-top: 30px; padding-top: 30px; border-top: solid 1px #193946;}
.faqs h2 {margin: 0;}
.faqs button {font-size: 16px; line-height: 20px; color: #193946; font-weight: bold; padding: 10px 55px 10px 0; width: 100%; cursor: pointer; margin: 0; border: none; display: block; position: relative; background: none; border-radius: 0; color: #193946; font-weight: bold; text-align: left;}
.faqs button:after {font-family: 'Font Awesome 5 Pro'; content: "\f078"; display: block; width: 36px; height: 36px; border: solid 2px #5f92b3; color: #5f92b3; font-size: 20px; line-height: 32px; position: absolute; top: 0; right: 0; text-align: center;}
.faqs .content {max-height: 0; overflow: hidden; transition: .5s ease;}
.faqs .content > div {padding: 10px 0;}
.faqs .expanded button:after {transform: rotate(180deg);}
.faqs .expanded .content {max-height: 2500px;}

.faq-intro {padding: 0 0 0 100px; background: url(images/icon-faqs.svg) no-repeat left top; margin: 0 0 20px 0; min-height: 95px; background-size: 90px auto;}

/**
 * Popups
 */
.pum-theme-seattle-childrens {background: url(images/bg-sc-popup.jpg) no-repeat center center !important; background-size: cover !important; color: #193946;}
.pum-theme-seattle-childrens p {color: #193946; line-height: 26px;}
.pum-theme-seattle-childrens .pum-container {max-width: 1020px !important; padding: 40px 40px 40px 480px !important;}
.pum-theme-seattle-childrens .pum-container:before {content: ""; position: absolute; top: 0; left: 0; bottom: 0; width: 420px; background: url(images/sc-blue-glove-lab.jpg) no-repeat; background-size: cover;}
.pum-theme-seattle-childrens .popup-stat {display: flex; margin: 30px 0; text-transform: uppercase; color: #276b91;}
.pum-theme-seattle-childrens .popup-stat strong {font-size: 50px; line-height: 37px; margin-right: 20px;}
.pum-theme-seattle-childrens .popup-stat span {border: solid 2px #bbc6d5; border-width: 2px 0; display: flex; align-items: center;}
.pum-theme-seattle-childrens .pum-close {background: #4581a6 !important;}

/**
 * Forms
 */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
input[type="number"],
input[type="url"],
input[type="date"],
input[type="datetime-local"],
input[type="color"],
select,
textarea {padding: 10px; border: solid 1px #ccc; font-size: 16px; line-height: 20px; font-family: 'aktiv-grotesk', Arial, Verdana, Sans-Serif;}

input[type="submit"] {cursor: pointer; border-radius: 0;}

button {cursor: pointer; transition: 0.25s ease; font-family: 'aktiv-grotesk', Arial, Verdana, Sans-Serif; -webkit-appearance: none; -webkit-border-radius: none;}

.proposal-form-details {float: right; width: 50%; max-width: calc(100% - 640px);}

.pre-proposal-form {margin: 0 -10px; max-width: 600px;}
.pre-proposal-form label {display: block;}
.pre-proposal-form input,
.pre-proposal-form select,
.pre-proposal-form textarea {width: 100%; max-width: 100%;}
.pre-proposal-form p {padding: 0 10px;}
.pre-proposal-form .col {float: left; width: 50%;}
.pre-proposal-form .char-count {font-size: 12px; display: block; color: #666;}

@media only screen and (max-width: 1640px) {

    #hero .slider .slick-dots {left: 40px;}

}

@media only screen and (max-width: 1300px) {

    #header nav {right: 75px;}
    #header nav > ul > li {padding: 0 10px;}
    #header .logo {width: 400px; top: 23px;}

}

@media only screen and (max-width: 1250px) {

    #header nav,
    #header .toggle-search {display: none;}
    #header .toggle-menu {display: block;}

    body.mobile-menu {overflow: hidden;}
    body.mobile-menu #mobile-menu {opacity: 1; top: 0; pointer-events: all;}

    .investment-filters .main-label {display: none;}
    .investment-filters .toggle-filters {display: inline-block;}
    .investment-filters .toggle-filters + .filters {max-height: 0px; overflow: hidden; transition: 0.5s ease;}
    .investment-filters .toggle-filters[aria-expanded="true"] + .filters {overflow: visible; max-height: 9999px;}
    .investment-filters .filters {display: block;}
    .investment-filters .filters > div {margin-top: 20px;}
    .investment-filters .filter {width: 100%; padding-left: 0;}
    .investment-filters .filter-toggle + ul {opacity: 1; pointer-events: all; z-index: 1; max-height: 0px; overflow: hidden; position: static; left: auto; right: auto;}
    .investment-filters .filter-toggle[aria-expanded="true"] + ul {overflow: visible; max-height: 999px;}

    .profiles > div {width: 25%;}

    .proposal-form-details {max-width: 100%; width: 100%; float: none; margin: 0 0 40px 0;}

}

@media only screen and (max-width: 1200px) {

    .grants-layout > .content {width: 100%; padding: 0 0 60px 0;}
    .grants-layout > aside {width: 100%;}

    .stats > div {width: 33.3333%;}
    .stats strong {font-size: 40px; line-height: 40px;}

    #hero h1 {font-size: 60px; line-height: 60px;}
    #hero h1 em {font-size: 80px; line-height: 80px;}

    .split-sidebar-layout > .left {width: 100%; padding: 0 0 40px 0; border-right: none; border-bottom: solid 1px #b2b2b2; margin: 0 0 40px 0;}
    .split-sidebar-layout > .right {width: 100%; padding: 0;}

    .sidebar-layout > .content {width: 100%; padding: 0 0 40px 0; margin: 0 0 40px 0; border-right: none; border-bottom: solid 1px #b2b2b2;}
    .sidebar-layout > aside {width: 100%; padding: 0; max-width: 400px;}

    .stories > div {width: 100%;}

    .story-box .photo {padding-bottom: 50%;}

    .logo-grid > div {width: 25%;}

    .grid-items.x3 > div {width: 50%;}

    .news-grid.x3 > div {width: 50%;}

}

@media only screen and (max-width: 1050px) {

    #footer .cols > div {width: 33.3333%;}
    #footer .social {position: relative; left: auto; bottom: auto; margin: 30px 0; justify-content: center;}

    .story-sidebar-layout > div {width: 100%; padding: 0; margin: 0 0 60px 0;}
    .story-sidebar-layout > aside {width: 100%;}

    .investments-layout > .content {width: 100%; padding: 0 0 60px 0;}
    .investments-layout > aside {width: 100%;}

    .exits > div {width: 25%;}

    .split-columns {margin: 0;}
    .split-columns > div {width: 100%; padding: 0;}
    .split-columns > div:nth-child(2n+1) {border-right: none;}
    .split-columns > div + div {border: none; border-top: solid 1px #b2b2b2; margin-top: 40px; padding-top: 40px;}

    .two-column-layout > div {margin: 0;}
    .two-column-layout > div > div {width: 100%; padding: 0;}
    .two-column-layout > div > div + div {margin-top: 40px;}

    .icon-column-layout > div > div {width: 100%; padding: 0;}
    .icon-column-layout > div > div:before {display: none;}
    .icon-column-layout > div > div + div {border-top: solid 1px #a5aca9; margin-top: 40px; padding-top: 40px;}

    .story-banner > .content {width: 100%;}
    .story-banner > .content > div {float: none; max-width: 100%; padding: 60px 40px;}
    .story-banner > .photo {width: 100%;}
    .story-banner > .photo {visibility: visible;}

    .news-grid > div,
    .news-grid.x3 > div {width: 100%;}

    .stats > div {width: 50%;}

    .profiles > div {width: 33.3333%;}

    .infographic-banner .container > .left {width: 100%; padding: 0;}
    .infographic-banner .container > .right {width: 100%;}

    .funding {
        grid-template-columns: 1fr;
        grid-template-areas:
            "c1-head"
            "c1-subhead-1"
            "c1-content-1"
            "c1-subhead-2"
            "c1-content-2"
            "c1-subhead-3"
            "c1-content-3"
            "c2-head"
            "c2-subhead-1"
            "c2-content-1"
            "c2-subhead-2"
            "c2-content-2"
            "c2-subhead-3"
            "c2-content-3"
            "c3-head"
            "c3-subhead-1"
            "c3-content-1"
            "c3-subhead-2"
            "c3-content-2"
            "c3-subhead-3"
            "c3-content-3"
            ;
    }
    .funding .c1-head:before,
    .funding .c2-head:before {display: none;}
    .funding div + .head {margin-top: 40px;}

    .grid-items-2 > div {width: 50%;}

}

@media only screen and (max-width: 1000px) {
}

@media only screen and (max-width: 950px) {

    .article-tile .photo {width: 100%;}
    .article-tile .content {width: 100%;}

    .articles > div {width: 100%;}
    .article-tile .photo {padding-bottom: 50%;}

    .fellows-layout > .right,
    .fellows-layout > .left {width: 100%; padding: 0;}
    .fellows-layout > .right {margin: 0 0 40px 0;}

    .stats-2 > div {width: 100%;}

    .grid-items > div,
    .grid-items.x3 > div {width: 100%;}

    .sidebar-layout-2 > .content,
    .sidebar-layout-2 > aside {width: 100%; padding: 0;}
    .sidebar-layout-2 > .content {margin: 0 0 40px 0;}

    .pum-theme-seattle-childrens .pum-container:before {width: 100%; bottom: auto; height: 500px; display: none;}
    .pum-theme-seattle-childrens .pum-container {padding: 40px 40px 40px 40px !important;}
}

@media only screen and (max-width: 900px) {

    .grants thead {display: none;}
    .grants td {display: block; padding: 0; border: none;}
    .grants td:first-child {padding-top: 15px;}
    .grants td:last-child {border-bottom: solid 1px #b2b2b2; padding-bottom: 15px;}
    .grants .mobile-label {display: inline; font-weight: normal;}

    .funding-rows > div > .left {width: 100%; padding: 0 0 20px 0;}
    .funding-rows > div > .right {width: 100%; padding: 0; border-left: none;}

}

@media only screen and (max-width: 850px) {

    #footer > .lower .container {display: block;}
    #footer > .lower .container > .left {margin: 0 0 5px 0;}
    #footer > .lower ul li + li:before {margin: 0 5px;}

    .profiles > div {width: 50%;}

    .logo-grid > div {width: 33.3333%;}

}

@media only screen and (max-width: 800px) {

    #footer .cols > div {width: 100%;}

    .page-header h2,
    .page-header .h2,
    .story-page-header h1 {font-size: 60px; line-height: 64px;}

    .investments > div {width: 50%;}

    .exits > div {width: 33.3333%;}

    #profile-dialog .body .thumb {width: 25%;}
    #profile-dialog .body .content {width: 75%;}

}

@media only screen and (max-width: 750px) {

    #hero {font-size: 16px; line-height: 24px;}
    #hero h1 {font-size: 30px; line-height: 30px;}
    #hero h1 em {font-size: 40px; line-height: 44px;}
    #hero .hero-callout > .image,
    #hero .hero-callout > .content {width: 100%; padding: 0;}
    #hero .hero-callout > .image {margin: 0 0 20px 0;}

    .callout-intro h2 {font-size: 40px; line-height: 44px;}

    .story-box .photo {width: 100%; padding-bottom: 100%;}
    .story-box .content {width: 100%;}

    .grid-items-2 > div {width: 100%;}

    .pre-proposal-form {margin: 0;}
    .pre-proposal-form p {padding: 0;}
    .pre-proposal-form .col {float: none; width: 100%;}

    .current-funding-callout {display: block; text-align: center;}
    .current-funding-callout .photo {width: 100%; min-height: 1px;}
    .current-funding-callout .photo img {position: relative;}
    .current-funding-callout .content {width: 100%; padding: 20px;}

}

@media only screen and (max-width: 700px) {
}

@media only screen and (max-width: 650px) {

    #header .primary {height: 70px;}
    #header .logo {width: 300px; top: 1px;}
    #header .logos {top: 20px; left: 20px;}
    #header .logos .primary-logo {width: 135px;}
    #header .logos .secondary-logo {width: 75px; top: 5px; margin-left: 20px;}
    #header .logos .secondary-logo:before {height: 29px; left: -10px;}
    #header .toggle-menu {top: 24px; right: 20px;}

    #investment-dialog .body {padding: 30px;}
    #investment-dialog .body > .logo {width: 100%; padding: 0 0 30px 0;}
    #investment-dialog .body > .logo img {display: block; margin: 0 auto;}
    #investment-dialog .body > .content {width: 100%; padding: 30px 0 0 0; border-left: none; border-top: solid 1px #b2b2b2;}
    #investment-dialog .body .meta > div {width: 100%;}

    .grant-filters .cols > div:first-child,
    .grant-filters .cols > div:last-child {width: 100%; padding: 0;}

}

@media only screen and (max-width: 600px) {

    .page-header {font-size: 17px; line-height: 29px;}
    .page-header > div {padding-top: 60px; padding-bottom: 60px;}
    .page-header h1,
    .page-header .h1,
    .story-page-header .section-header {font-size: 16px; line-height: 20px;}
    .page-header h2,
    .page-header .h2,
    .story-page-header h1 {font-size: 28px; line-height: 32px;}

    .investments > div {width: 100%;}
    .investments .details:focus,
    .investments .details:hover {transform: none;}

    .exits > div {width: 50%;}

    .profiles > div {width: 100%;}

    #profile-dialog h1 {font-size: 26px; line-height: 30px;}
    #profile-dialog .title {font-size: 18px;}
    #profile-dialog .body {padding: 30px;}
    #profile-dialog .body .thumb {width: 100%;}
    #profile-dialog .body .content {width: 100%; padding: 0; margin: 20px 0 0 0;}

    .callout-intro {font-size: 15px; line-height: 19px;}
    .callout-intro h2,
    .story-banner h3 {font-size: 22px; line-height: 26px;}

    .pum-theme-seattle-childrens .popup-stat {display: block; text-align: center;}
    .pum-theme-seattle-childrens .popup-stat strong {line-height: normal;}
    .pum-theme-seattle-childrens .popup-stat span {display: block; padding: 7px 0;}
}

@media only screen and (max-width: 550px) {

    .stats > div {width: 100%;}

}

@media only screen and (max-width: 500px) {

    .article-tile .content {padding: 30px;}

    .articles > div > .photo,
    .articles.large-thumbs > div > .photo {width: 100%; margin: 0 0 20px 0; padding-bottom: 50%;}
    .articles.large-thumbs > div > .photo {padding-bottom: 74%;}
    .articles > div > .content,
    .articles.large-thumbs > div > .content {width: 100%; padding: 0;}

    .logo-grid > div {width: 50%;}

    .sidebar-logos > div {width: 100%;}

}

@media only screen and (max-width: 450px) {

    #header .logo {width: 230px; top: 4px;}

    .exits > div {width: 100%;}

}

@media only screen and (max-width: 400px) {
}

@media only screen and (max-width: 350px) {
}

@media only screen and (max-width: 300px) {
}