/* embed fonts ========================================================= */
@import url('https://fonts.googleapis.com/css?family=Oswald:700');
@import url("/_fonts/MetaNormal/MyFontsWebfontsKit.css");
@import url("/_fonts/MetaNormalItalic/MyFontsWebfontsKit.css");
@import url("/_fonts/MetaBold/MyFontsWebfontsKit.css");
@import url("/_fonts/genericons/genericons.css");
@import url("/_fonts/font-awesome/css/font-awesome.css"); /* use like: <span class="fa fa-facebook-square"></a> */
@import url("/_fonts/symbola/stylesheet.css");
@import url("/_fonts/stylesheet.css"); /* NOTE: fonts import MUST be in child stylesheet ONLY!!!!! */
/*
@font-face {
	font-family: 'BebasRegular';
	src: url('/_fonts/bebas___-webfont.eot');
	src: url('/_fonts/bebas___-webfont.eot?#iefix') format('embedded-opentype'),
		url('/_fonts/bebas___-webfont.woff') format('woff'),
		url('/_fonts/bebas___-webfont.ttf') format('truetype'),
		url('/_fonts/bebas___-webfont.svg#BebasRegular') format('svg');
	font-weight: normal;font-style: normal;
}
*/
/* /embed fonts ========================================================= */

/* Tag styles ========================================================= */



.wkkf-orange {
	color: #F8971D;
}
.wkkf-cerulean {
	color: #42C4DD;
}
.wkkf-blue {
	color: #0081C6;
}
.wkkf-lime {
	color: #A0CF67;
}
.wkkf-magenta {
	color: #DB0962;
}
.wkkf-violet {
	color: #716FB3;
}
.wkkf-brown {
	color: #7C3520;
}
.wkkf-graydk {
	color: #4D4D4F;
}
.wkkf-graymd {
	color: #6D6E70;
}
.wkkf-graylt {
	color: #F4F4F4;
}
.wkkf-white {
	color: white;
}

.wkkf-center {
	text-align: center;
}


body {
	color: #000000;
	background-color: #f2f2f2;
	overflow-x: hidden;
}

html,body,button,td,input,textarea,select,option {
	font: normal 18px "FFMetaWebNormal", sans-serif ;
	line-height: 1.5;
	color: #4D4D4F;
	text-shadow: none !important;
}

p {
}
p,
div.p,
blockquote,
.pp_inline li,
.pagecontainer li,
.form2 label {
}

a,
a:link,
a:visited,
a:hover,
.bn1,
.pagecontainer a img  {
	xcolor: #0000ff;
	xborder-color: #0000ff;
}
a:hover,
.bn1:hover,
.pagecontainer a:hover img {
	xcolor: #ff0000;
	xborder-color: #ff0000;
}

h1,h2,h3,h4,h5,h6 {
	//font-weight: normal;
}
h1 {
	font-size: 5.8125rem;
	font-family: "Oswald", sans-serif;
	text-transform: uppercase;
}
h2 {
	font-size: 2.5rem;
	font-family: "Oswald", sans-serif;
	text-transform: uppercase;
}
h3 {
	font-size: 1.875rem;
	font-family: "Oswald", sans-serif;
	text-transform: uppercase;
}
h4 {
	font-size: 2rem;
}
h5 {
	font-size: 1.25rem;
	font-weight: bold;
	text-transform: uppercase;
}
h6 {
	font-size: 1rem;
	font-family: "FFMetaWebBold", sans-serif;
	font-weight: normal;
	text-transform: uppercase;
}

/* set bold/italic/bolditalic fonts =====
b, strong	{
	font-weight: normal;
	font-family: 'LatoBold',arial,sans-serif;
}
i, em {
	font-style: normal;
	font-family: 'LatoItalic',arial,sans-serif;
}
b i, i b, strong i, i strong, b em, em b, strong em, em strong {
	font-weight: normal;
	font-style: normal;
	font-family: 'LatoBoldItalic',arial,sans-serif;
}
/set bold/italic/bolditalic fonts ===== */

blockquote {}
blockquote.quotes {}
blockquote.quotes:before,blockquote.quotes:after {}
blockquote.quotes:before {}
blockquote.quotes:after {}
.byline {}
.byline:before {}
/* /Tag styles ========================================================= */

/* list styles ========================================================= */
ul.bullet {}

.pagecontainer ul ul,
.pagecontainer ul ol, 
.pagecontainer ol ol, 
.pagecontainer ol ul {
}


/* color the bullet ===== */
/*
.pagecontainer ul {
	list-style: none;
	margin-left: 1rem;
	padding-left: 0;
xoutline: solid 1px #000;
}
.pagecontainer ul li {
	position: relative;
	padding-left: 0.9rem;
}
.pagecontainer ul li:before {content: '\25CF';}
.pagecontainer li ul li:before {content: '\25CB';}
.pagecontainer li li ul li:before {content: '\25A0';}
.pagecontainer ul li:before,
.pagecontainer li ul li:before,
.pagecontainer li li ul li:before {
	position: absolute;
	top: -0.1rem;
	left: 0;
	color: red;
}
*/
/* /color the bullet ===== */

/* color the numbers =====  */
/*
ol {
	margin: 0;
	padding: 0;
	list-style-type: none;
	counter-reset: item;
}
ol li {
	display: relative;
	padding-left: 1.2rem;
}
ol li:before {
	position: absolute;
	left: 0rem;
	content: counter(item) ". ";
	counter-increment: item;
	color: red;
}
ol li ul,
ol li ol {
	counter-reset: item;
}
*/
/* /color the numbers ===== */
/* /list styles ========================================================= */

/* shell structure ================================================================== */
.topnav,
header.header-shell-0,
header.header-shell-2,
.panel,
.title-container,
footer.footer-shell-1,
footer.footer-shell-2 {
	width: 960px;
	margin: 0px auto 0px auto; /* centers this div on the page, also, see body definition above */
}

.shell {
background-color: #fff;
}
/* /shell structure ================================================================== */

/* header ============================================================= */
.header-wrapper {
}
header.header-shell-0 {
}
header.header-shell-1 {}
header.header-shell-2 {
	margin-top: 40px;
}

#sitename {
	padding: 0px 0px 20px 0px;
	font-size: 300%;
}
#sitename a {
}
#sitename a span {
}
#sitedesc {
	padding-bottom: 20px;
}
#sitedesc a {
}
#sitedesc a span {
}

#sign-in-out-container {
}

#search-container {
}
#search-container #search {
}
/* /header ============================================================= */

/* page ============================================================== */
.pagecontainer {
	padding: 0px 0px 0px 0px;
	/* set header.header-shell-0 as fixed top bar -- header.header-shell-0, .pagecontainer, .topnav-container (nav.css) */
	/*
	padding: 76px 0px 20px 0px;
	*/
xborder: solid 1px #000000;
}
/*
.pagecontainer img {
	-webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.15);
	   -moz-box-shadow: 2px 2px 5px rgba(0,0,0,0.15);
	    -ms-box-shadow: 2px 2px 5px rgba(0,0,0,0.15);
	     -o-box-shadow: 2px 2px 5px rgba(0,0,0,0.15);
	        box-shadow: 2px 2px 5px rgba(0,0,0,0.15);
}
.pagecontainer img.noshadow {
	-webkit-box-shadow: none;
	   -moz-box-shadow: none;
	    -ms-box-shadow: none;
	     -o-box-shadow: none;
	        box-shadow: none;
}
*/
.panel_wrapper {
}
.panel {
}
.panel_wrapper-auto .panel {
	padding-right: 30%;
}

.wrapper {
}

.col_1 {
	width: 68.75%;
	margin-right: 1.25%;
}
.col_2 {
	width: 28.75%;
	margin-left: 1.25%;
}

.col_3 {
	width: 31.66%;
	margin-right: 1.25%;
}
.col_4 {
	width: 31.66%;
	margin-left: 1.25%;
	margin-right: 1.25%;
}
.col_5 {
	width: 31.66%;
	margin-left: 1.25%;
}

.col_6 {
	width: 23.12%;
	margin-right: 1.25%;
}
.col_7 {
	width: 23.12%;
	margin-left: 1.25%;
	margin-right: 1.25%;
}
.col_8 {
	width: 23.12%;
	margin-left: 1.25%;
	margin-right: 1.25%;
}
.col_9 {
	width: 23.12%;
	margin-left: 1.25%;
}

.col_10 {
	width: 100%;
}

.col_11 {
	width: 48.75%;
	margin-right: 1.25%;
}
.col_12 {
	width: 48.75%;
	margin-left: 1.25%;
}

.pad {
	/* 
	Also see .panel on this page.
	
	ONLY needed if percent left-right padding needs to be used on a box -- like .panel -- which is:
	1. given a width
	2. comes AFTER a 100% width or 100% max-width image AND
	3. AFTER a floated div
	
	ex:
	<img src="/pix/fred" width="100%" />
	<div style="float:left;">content</div>
	<div class="panel">
	<div class="pad">
	content
	</div>
	</div>
	*/
	padding: 0px 18% 0px 18%;
}
/* /page ============================================================== */

/* footer ============================================================= */
footer.footer-shell-1 {
	xpadding-top: 20px;
}
footer.footer-shell-2 {
}
/* /footer ============================================================= */

/* buttons =========================================================================== */
.bn1,
.bn1:hover,
.bn1:visited,
button,
input[type="button"],
input[type="submit"] {
}
.bn1:hover,
button:hover,
input[type="button"]:hover,
input[type="submit"]:hover {
}

.bn,
.bn_ext,
.more-link,
.bn_back,
.bn_top,
.more-link_back,
.bn_blog-prev-page,
.bn_blog-prev-post,
.bn_blog-next-page,
.bn_blog-next-post {
}

.bn_top {
}

.bn_add {
}
.bn_close {
}
.bn_copy {
}
.bn_delete {
}
.bn_edit {
}
.bn_help {
}
.bn_lock {
}
.bn_pdf {
}
/* /buttons =========================================================================== */

/* captions ========================================================================== */
.wp-caption {
}
.wp-caption .wp-caption-text {
}
.wp-caption.alignright {
}
.wp-caption.alignleft {
}

.caption2 {
}
.caption2-img {
}
.caption2-txt {
}
/* /captions ========================================================================== */


/* hp slider ========================================================================= */
.hp_slider_nav button {
}
.hp_slider_nav button:hover {
}
.hp_slider_nav button.current,
.hp_slider_nav button.current:hover {
}
/* /hp slider ========================================================================= */

/* hp_slider2 ========================================================================= */
.hp_slider2-container {
}

.hp_slider2 {
}

.hp_slide2 {
}

.hp_slide2-content {
}
#hm-slider .hp_slide2-content {
	/* vertical centering NOTE: requires parent container set to relative */
	position: absolute;
	top: 50%;
	transform: translate(0%, -50%);
	/* /vertical centering */
	width: 100%;
	padding: 0px 10% 0px 10%;
xborder: solid 1px red;
}

.hp_slider2-nav {
}
.hp_slider2-nav div {
}
.hp_slider2-nav div:hover {
}
.hp_slider2-nav div.current {
}

.hp_slider2-nav-arrows {
}
.hp_slider2-nav-arrows:hover {
}
.hp_slider2-nav-arrows-back {
}
.hp_slider2-nav-arrows-next {
}
/* /hp_slider2 ========================================================================= */

/* rotator =========================================================================== */
.rotator {
}
.rslide {
}
/* /rotator =========================================================================== */

/* bgimg ============================================================================= */
.bgimg-container {
	position: relative;
}
.bgimg {
}
.bgimg-content-container {
}
/* bgimg ============================================================================= */

/* bgimg2 ============================================================================= */
.bgimg2_container {
	background-position: top left;
}
a.bgimg2_href {
}
.bgimg2_img {
}
.bgimg2_img-overlay-gradient {
	/*
	min-width: 300px;
	background: -moz-linear-gradient(left,  rgba(247,49,49,1) 0%, rgba(192,110,131,1) 45%, rgba(125,185,232,0) 100%);
	background: -webkit-linear-gradient(left,  rgba(247,49,49,1) 0%,rgba(192,110,131,1) 45%,rgba(125,185,232,0) 100%);
	background: linear-gradient(to right,  rgba(247,49,49,1) 0%,rgba(192,110,131,1) 45%,rgba(125,185,232,0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f73131', endColorstr='#007db9e8',GradientType=1 );
	*/
	/*
	background-image: url("/pix/header-about.svg");
	background-position: top left;
	background-repeat: no-repeat;
	background-size: 100%;
	*/
}
.bgimg2_container-hover:hover .bgimg2_img-overlay {
}
.bgimg2_img-overlay {
}
.bgimg2_content {
}
/* /bgimg2 ============================================================================= */

/* adobe edge ============================================================================= */
/* 
needed for mac ios 
use like: <iframe class="iframe-adobe-edge" src="/hotpepper-header-animation/Hotpepper-animation-v2.html" width="100%" height="100%" scrolling="auto" frameborder="0"></iframe>
*/
iframe.iframe-adobe-edge {
	width: 10px;
	min-width: 100%;
}
/* /adobe edge ============================================================================= */

/* rss feed ===================================================================== */
.rss-feed {
}
.rss-feed ul {
}
.rss-feed li {
}
.rss-feed li:before {
}
.rss-feed li div {
}
.rss-feed h1,.rss-feed h2,.rss-feed h3,.rss-feed h4,.rss-feed h5,.rss-feed h6,.rss-feed h7 {
}
.rss-feed a {
}
.rss-feed a:hover {
}

.widget_rss {
}
.widget_rss ul {
}
.widget_rss li {
}
.widget_rss .widgettitle {
}
.widget_rss a.rsswidget {
}
.widget_rss .rssSummary {
}
/* /rss feed ===================================================================== */

/* misc classes ===================================================================== */
.alert,
.error,
.required {
}
.error.form-validation {}
.smtxt {}
.lgtxt {}
.callout {}

.footnote {}

.crumbtrail {}
.crumbtrail span {}

.hilite {}

.profile {}
.profile .password-change fieldset {}
.profile .password-change legend {}

audio.wp-audio-shortcode {
/* NOTE: CANNOT set width value here, style="width:100%" autogenerated in wp shortcode */
}

.title-container-wrapper {}
.title-container {}
.page-title,
.cat-title,
.post-title,
.single-post-title {
}
.cat-title #all-posts {}
/* /misc classes ===================================================================== */

.page-template-subpage .topnav-container {
	top: 0;
	height: 3rem;
	background-color: white;
}
.subpage_return {
	width: 100%;
	height: 3rem;
	background-color: white;
	position: fixed;
	top: 0;
	z-index: 300;
}
.subpage_return span {
	position: absolute;
}
.grantmaking_priorities_links .col_12 {
	text-align: right;
}
.subpage_return .genericon, .grantmaking_priorities_links .genericon {
	font-size: 1.75rem;
	top: 0.6rem;
	left: -1.5rem;
	cursor: pointer;
}
.return_back, .grantmaking_priorities_links .grantmaking_subpage_link {
	text-transform: uppercase;
	top: 1rem;
	left: 1.2rem;
	cursor: pointer;
}
.grantmaking_priorities_links .grantmaking_subpage_link {
	position: relative;
	top: 0.2rem;
	left: 0.8rem;
}
.grantmaking_priorities_links .col_12 .grantmaking_subpage_link {
	padding-right: 1.8rem;
}
.subpage_content {
	padding-top: 3rem;
	padding-bottom: 3rem;
}
.financials_subpage .subpage_content,
#grantmaking_subpage .subpage_content {
	padding-bottom: 0;
}
.financials_subpage .subpage_content p {
	padding-bottom: 0;
}
.financials_subpage a, .financials_subpage a:visited {
	color: #0081C6;
	font-family: "FFMetaWebBold", sans-serif;
}
.financials_subpage a:hover {
	color: #4D4D4F;
	text-decoration: none;
}
.subpage .panel_wrapper-auto .panel {
	padding: 0;
}
.pagecontainer.subpage {
	padding-top: 0rem;
}
.subpage .title-container-wrapper {
	display: none;
}
.bigbody {
	font-size: 1.375rem;
	line-height: 1.273rem;
	margin-bottom: 1.5rem;
}
#childrens_subpage h2,
#childrens_subpage .subpage_return .genericon {
	color: #F8971D;
}
#treasurer_subpage h2,
#treasurer_subpage .subpage_return .genericon {
	color: #DB0962;
}
#communities_subpage h2,
#communities_subpage .subpage_return .genericon {
	color: #42C4DD;
}
#ramon_subpage h2,
#ramon_subpage .subpage_return .genericon,
.financials_subpage h2,
.financials_subpage .subpage_return .genericon {
	color: #0081C6;
}
#grantmaking_subpage h2,
#grantmaking_subpage .subpage_return .genericon {
	color: #716FB3;
}
#families_subpage h2,
#families_subpage .subpage_return .genericon {
	color: #A0CF67;
}
.subpage_content h5 {
	margin-top: 1rem;
	margin-bottom: 1rem;
}

#communities_subpage ul {
	list-style: none;
	border: solid 1px #dadada;
	margin-top: 1rem;
	padding: 0;
}
#communities_subpage li {
	padding: 1.5rem 1.2rem;
	background-color: #E0F5F9;
}
#communities_subpage ul > li:last-child {
	padding: 1.5rem 1.2rem;
}
#communities_subpage li h5,
#communities_subpage li p {
	padding: 0;
	margin: 0;
}
#communities_subpage li:nth-of-type(2n) {
	background-color: white;
}
#communities_subpage li:first-of-type {
	background-color: #42C4DD;
	color: white;
}

#families_subpage ul {
	list-style: none;
	border: solid 1px #dadada;
	margin-top: 1rem;
	padding: 0;
}
#families_subpage li {
	padding: 1.5rem 1.2rem;
	background-color: #F4F9E8;
}
#families_subpage ul > li:last-child {
	padding: 1.5rem 1.2rem;
}
#families_subpage li h5,
#families_subpage li p {
	padding: 0;
	margin: 0;
}
#families_subpage li:nth-of-type(2n) {
	background-color: white;
}
#families_subpage li:first-of-type {
	background-color: #A0cf67;
	color: white;
}

#childrens_subpage ul {
	list-style: none;
	border: solid 1px #dadada;
	margin-top: 1rem;
	padding: 0;
}
#childrens_subpage li {
	padding: 1.5rem 1.2rem;
	background-color: #FFF6ee;
}
#childrens_subpage ul > li:last-child {
	padding: 1.5rem 1.2rem;
}
#childrens_subpage li h5,
#childrens_subpage li p {
	padding: 0;
	margin: 0;
}
#childrens_subpage li:nth-last-of-type(2n) {
	background-color: white;
}
#childrens_subpage li:first-of-type {
	background-color: #F8971D;
	color: white;
}
#childrens_subpage a, #childrens_subpage a:visited {
	color: #DB0962;
	font-family: "FFMetaWebBold", sans-serif;
}
#childrens_subpage a:hover {
	color: #4D4D4F;
	text-decoration: none;
}


.return_back {
	color: #6D6E70;
}
.page-treasurers-letter h5 {
	margin-bottom: 2rem;
}
.page-equitable-communities h5 {
	margin-bottom: 0.75rem;
}
.lajune {
	height: 1300px;
	background-image: url(/userfiles/letters_lajune.jpg);
	background-repeat: no-repeat;
	background-position: center 0;
	background-size: 100%;
}
.ramon {
	height: 1300px;
	background-image: url(/userfiles/letter_ramon.jpg);
	background-repeat: no-repeat;
	background-position: center 0;
	background-size: 100%;
}
.thriving_children {
	height: 1300px;
	background-image: url(/userfiles/children.jpg);
	background-repeat: no-repeat;
	background-position: center 0;
	background-size: 100%;
}
.stable_families {
	height: 1300px;
	background-image: url(/userfiles/family-2-1.jpg);
	background-repeat: no-repeat;
	background-position: center 0;
	background-size: 100%;
}
.equitable_communities {
	height: 1300px;
	background-image: url(/userfiles/community-1.jpg);
	background-repeat: no-repeat;
	background-position: center 0;
	background-size: 100%;
}
.williamson {
	height: 900px;
	background-image: url(/userfiles/don_treasurer_11172016_WKKF2385_1_500wide.jpg);
	background-repeat: no-repeat;
	background-position: 70% -15%;
	background-size: cover;
}
h2.treasurer + h5 {
	margin-top: 0.5rem;
	margin-bottom: 1.5rem;
}
.sharing_knowledge {
	height: 800px;
	background-image: url(/userfiles/sharing-knowledge_adj.jpg);
	background-repeat: no-repeat;
	background-position: 62% 0;
	background-size: 430%;
}

#leadership {
	position: relative;
	background-image: url(/userfiles/bg_cerlulean.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	height: 80vh;
}
#leaders_messages {
	width: 100%;
	background-color: rgba(0,0,0,0.5);
	color: white;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	padding: 2rem 0;
}
#leaders_messages h3 {
	padding-bottom: 0.2rem;
}
#leaders_messages h6 {
	padding-bottom: 1.2rem;
}
#leaders_messages .ar_bn {
	margin: 0;
}
.leader_letter {
	position: relative;
}
#leaders {
	pointer-events: none;
	position: relative;
}
#leaders_animation {
	position: relative;
}
#leader_ramon {
	max-height: 75vh;
	right: -20rem;
	top: 0;
	z-index: 50;
	position: absolute;
}
#leader_lajune {
	 max-height: 75vh;
	 left: -20rem;
	 top: 0;
	z-index: 100;
	position: absolute;
 }
#grantmaking {
	position: relative;
	background-image: url(/userfiles/bg_violet.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	min-height: 50rem;
	padding: 3rem 25%;
}
#grantmaking_header {
	/*margin-bottom: 1.5rem;*/
}
#grantmaking_animation {
	position: relative;
	height:680px;
}
#triangle {
	width: 800px;
	height: 750px;
}
#grantmaking_header h5 {
	margin-top: 1rem;
	margin-bottom: 0.4rem;
}
#grantmaking_children, #grantmaking_families, #grantmaking_communities {
	opacity: 0;
	position: absolute;
	cursor: pointer;
}
#grantmaking_children {
	background-color: #F8971D;
	left: 34%;
	top: 7.5%;
	right: 50%;
	bottom: 42%;
}
#grantmaking_families {
	background-color: #7C3220;
	left: 50%;
	top: 7.5%;
	right: 30%;
	bottom: 29%;
}
#grantmaking_communities {
	background-color: #DB0962;
	left: 30%;
	top: 50%;
	right: 50%;
	bottom: 29%;
}
#financials {
	position: relative;
	background-image: url(/userfiles/bg_gray.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	padding: 4rem 0 6rem 0;
}
#financials_header {
	padding: 0 12.5%;
	text-align: center;
}
#financials_section {
	max-height: 27rem;
}
#treasurers_section, #investments_section, #grantmaking_section {
	position: relative;
	min-height: 25rem;
	margin: 0 0.5%;
}
.financials_link_bg {
	position: absolute;
	width: 100%;
	bottom: 0;
	text-align: center;
	color: white;
	padding: 1.75rem 1rem;
	transition-duration: 600ms;
}
#treasurers_section .financials_link_bg {
	background-color: rgba(219,9,98,0.8);
}
#investments_section .financials_link_bg {
	background-color: rgba(2,129,198,0.8);
}
#grantmaking_section .financials_link_bg {
	background-color: rgba(113,111,179,0.8);
}
#grantmaking_section .financials_link_bg h3 {
	margin: 1.15rem 0;
}
#treasurers_section {
	background-image: url(/userfiles/don_treasurer_11172016_WKKF2385_1_500wide.jpg);
	background-repeat: no-repeat;
	background-position: top center;
	background-size: 150%;
}
#investments_section {
	background-image: url(/userfiles/WKKF_New-Photography-Photo-Book_091013-9-632x399.jpg);
	background-repeat: no-repeat;
	background-position: 47% 30%;
	background-size: cover;
}
#grantmaking_section {
	background-image: url(/userfiles/woman_and_child.jpg);
	background-repeat: no-repeat;
	background-position: 40% 45%;
	background-size: cover;
}
.ar_bn, .ar_bn_link {
	font-size: 1rem;
	font-family: "FFMetaWebBold", sans-serif;
	/*color: #F8971D;*/
	color: white;
	width: 8.75rem;
	height: 3.125rem;
	/*border: 1px solid #F8971D;*/
	border: 1px solid white;
	border-radius: 0.25rem;
	margin: 0 auto;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	cursor: pointer;
}
.ar_bn_link#audited_statements {
	color: #0081C6;
	border: 1px solid #0081C6;
}
.ar_bn p, .ar_bn_link p {
	text-align: center;
	padding: 0.75rem 0 0 0;
}
.ar_bn_link {
	width: fit-content;
	width: -webkit-fit-content;
	width: -moz-fit-content;
	margin: 0;
	padding: 0 0.75rem;
}
.ar_bn:not(#explore_button) p::after {
	content: '\f0da';
	font-family: "fontawesome";
	padding-left: 0.45rem;
}
.ar_bn_link p i.fa {
	transform: scaleX(-1);
	padding-right: 1rem;
}
.ar_bn:hover, .ar_bn_link:hover {
	/*color: white;
	background-color: #F8971D;*/
	color: #0081C6;
	background-color: white;
}
.ar_bn_link#audited_statements:hover {
	color: white;
	background-color: #0081C6;
}
#dom_overlay_container {
	pointer-events:none;
	overflow:hidden;
	width:800px;
	height:750px;
	position: absolute;
	left: 0px;
	top: 0px;
	display: block;
}
#dom_overlay_container_1 {
	pointer-events:none;
	overflow:hidden;
	display: block;
}
#canvas {
	position: absolute;
	display: block;
}
h4#home-page-communities {
	opacity: 0;
	transition-duration: 0.4s;
}
#explore_button {
	opacity: 0;
	transition-duration: 0.4s;
}
.table {
	width: 100%;
	border-spacing: 0;
}
.table.blue th {
	background-color: #0081C6;
}
.table-header th {
	color: white;
	padding: 1rem 1rem;
	text-align: right;
	position: relative;
	font-family: "FFMetaWebBold", sans-serif;
	font-weight: normal;
}
.table-year {
	position: absolute;
	left: 0;
	top: -2rem;
	text-align: left;
	font-size: 1.25rem;
	text-transform: uppercase;
}
.table.blue .highlight {
	color: #0081C6;
	font-family: "FFMetaWebBold", sans-serif;
}
.uppercase {
	text-transform: uppercase;
}
tr td:first-child {
	text-align: left;
}
td {
	padding: 0.375rem 0.625rem;
	text-align: right;
	vertical-align: top;
}
.separator {
	border-width: 0 0 0 1px;
	border-style: solid;
	border-color: #DADADA;
}
tr:nth-child(2n) {
	background-color: #F4F4F4;
}
tbody {
	border-width: 0 1px 1px 1px;
	border-style: solid;
	border-color: #DADADA;
}
#financial_position, #activities {
	margin-bottom: 4rem;
}
.disable-scroll {
	overflow-y: hidden;
}
#subpage_container {
	height: 100vh;
	z-index: 150;
	background-color: white;
	width: 100%;
	position: fixed;
	top: 0;
	left: 100%;
	overflow-y: scroll;
}
.grantmaking_bug {
	width: 5rem;
	display: inline-block;
	margin-right: 1rem;
	vertical-align: top;
}
.grantmaking_head {
	display: inline-block;
	margin-top: 0.4rem;
	margin-bottom: 1rem;
}
.panel.financial_panel h4, 
.financials_subpage h4,
#summary_investments h4,
#investment_assets h4 {
	border-bottom: 1px solid #0081C6;
	line-height: 0;
	margin-bottom: 3.6rem;
	margin-top: 3rem;
	padding-bottom: 1.6rem;
}
#grantmaking_subpage .panel.financial_panel h4 {
	border-bottom: 1px solid #716FB3;
}
.wide-title {
	padding-top: 0.25rem;
}
.table + p {
	padding-top: 1.4rem;
}

/* ======= CHART CSS ==============  */

#investments_chart {
	position: relative;
	width: 100%;
}

.yaxis {
	width: 97%;
	margin-left: 3%;
}
.yaxis_label {
	border-bottom: 1px solid #DADADA;
	padding: 1rem 0;

}
.yaxis_label h6 {
	font-family: "FFMetaWebNormal", sans-serif;
	position: absolute;
	transform: translateX(-3rem) translateY(0.5rem);
}
.bar_year h6 {
	font-family: "FFMetaWebNormal", sans-serif;
}
#investments_chart .chart_bars {
	position: absolute;
	top: 9.1%;
	bottom: 0%;
	left: 3%;
	width: 97%;
}
#investments_chart .chart_bar {
	position: absolute;
	bottom: 0;
	width: 10%;
	padding: 0 0.5rem;
}
.foundation {
	background-color: #F8971D;
}
.trust {
	background-color: #0081C6;
}
.graywrapper {
	background-color: #F4F4F4;
}
#investments_hover {
	position: absolute;
	xdisplay: none;
	top: 0;
	left: 0px;
}
#hover_trust, #hover_foundation {
	width: 9rem;
	height: 2rem;
	color: white;
	text-align: center;
	padding: 0.45rem 0 0 0;
}
#hover_trust, #hover_foundation {
	transform: translate(-5rem, -5rem);
}
#hover_trust {
	background-color: #0081C6;
}
#hover_foundation {
	background-color: #F8971D;
}
#investments_hover::after {
	color: #F8971D;
	content: '\f0d7';
	font-family: "fontawesome";
	font-size: 2.5rem;
	text-align: center;
	width: 100%;
	position: absolute;
	transform: translate(-5rem, -6rem)
}
#investments_chart .bar_year {
	position: absolute;
	bottom: -1.75rem;
	width: 10%;
	text-align: center;
}
#summary_investments {
	padding-top: 3rem;
	padding-bottom: 3rem;
}
#investments_legend {
	position: relative;
	padding-top: 3rem;
	padding-left: 2.5rem;
}
#investments_legend div {
	display: inline-block;
	padding-right: 2rem;
}
#investments_legend div::before {
	display: inline-block;
	content: '\f111';
	font-family: "fontawesome";
	padding-right: 0.5rem;
}
#investments_legend_foundation::before {
	color: #F8971D;
}
#investments_legend_trust::before {
	color: #0081C6;
}
#investments_table {
	margin-top: 4rem;
}
#investments_table table, #investment_assets_table table {
	background-color: white;
	width: 100%;
}
#investments_table table tr td:first-child {
	text-align: right !important;
}
#about {
	background-color: #231F20;
	position: relative;
}
#about_bg_image {
	background-image: url(/userfiles/wkkf_board.jpg);
	background-size: cover;
	background-position: top center;
	position: absolute;
	width: 100%;
	height: 60%;
}
#about_kellogg {
	padding: 2.5rem 5.5%;
	background-color: rgba(255,255,255,0.9);
	margin-top: 25rem;
	margin-bottom: 2.25rem;
	border-top: 0.5rem solid #F8971D;
	width: 75%;
}
#about_kellogg h2 {
	padding-bottom: 2rem;
}
#about_kellogg p em, em {
	font-family: "FFMetaWebNormalItalic", sans-serif;
	font-style: normal;
}
#board_of_directors {
	font-size: 0.6rem;
	padding-bottom: 0;
	font-family: "FFMetaWebNormalItalic", sans-serif;
	font-style: normal;
}
#about_buttons {
	text-align: center;
	padding-bottom: 6rem;
}
#about_buttons .ar_bn_link {
	display: inline-block;
	margin-left: 1.25rem;
	margin-right: 1.25rem;
	padding-left: 1.3rem;
	padding-right: 1.3rem;
}
div[data-chart*="grant_area"] + div, div[data-chart*="grants_place"] + div {
	padding-top: 0.6rem;
	padding-bottom: 2.5rem;
}
.chart_relative {
	position: relative;
}
.financial_panel.extratop {
	padding-top: 3rem;
}
.financial_panel.extrabottom {
	padding-bottom: 3rem;
}
,combined_allocation {
	padding-top: 3rem;
 }
.chart_wrapper[data-chart="commitments_year"] .chart_column {
	transform: translateY(54px);
	font-family: "FFMetaWebNormal", sans-serif;
}
.chart_wrapper[data-chart="payments_year"] .chart_column {
	transform: translateY(127px);
	font-family: "FFMetaWebNormal", sans-serif;
}
.chart_wrapper[data-chart="payout_year"] .chart_column {
	transform: translateY(78px);
	font-family: "FFMetaWebNormal", sans-serif;
}
.wp-video {
	/*position: relative;*/
	width: 100vw !important;
	height: 100vh !important;
	text-align: center;
	font-size: 0;
	overflow: hidden;
}
.wp-video .background_video {
	position: absolute;
	top: 0;
	left: 50%;
	margin-left: -50%;
	display: inline-block;
	min-height: 100vh;
	min-width: 100vw;
	max-width: 600vw;
	max-height: 250vh;
	width: auto;
	object-fit: cover;
	height: 100vh;
}
.video_placeholder {
	height: 100vh;
}
.mobile, .hidden {
	display: none;
}
#hero_text {
	position: absolute;
	height: 100vh;
	width: 100%;
	top: 0;
	padding: 20vh 0 30vh 0;
}

#hero_video {
	height: 99.9vh;
	background-image: url(/userfiles/video_poster.jpg);
	background-size: cover;
	background-position: center;
}
#title_graphic {
	margin: 0 auto;
	text-align: center;
}
#animation_container_1 {
	width:50%;
	height:auto;
	transform: translate(50%);
}
#title-reverse-static {
	 display: none;
 }
#title_graphic h4 {
	color: white;
	text-align: center;
}
.donuts_wrapper {
	text-align: center;
}
.donut_key {
	position: relative;
	display: inline-block;
	margin-right: 2rem;
	width: 8rem;
	vertical-align: top;
	margin-bottom: 0.3rem;
}
.donut_key::before {
	content: '\f111';
	font-family: "fontawesome";
	position: relative;
	left: -1.2rem;
	top: 0.9rem;
}
#donuts_key {
	margin-left: 1.5rem;
}
#donuts_key_asterisk {
	margin: 1rem 0 3rem 0;
}
.dot-violet::before {
	color: #716FB3;
}
.dot-blue::before {
	color: #0081C6;
}
.dot-lime::before {
	color: #A0cf67;
}
.dot-magenta::before {
	color: #DB0962;
}
.dot-graymd::before {
	color: #6D6E70;
}
.dot-cerulean::before {
	color: #42C4DD;
}
.dot-orange::before {
	color: #F8971D;
}
.dot-green::before {
	color: #27A527;
}
.hide {
	visibility: hidden;
}
.panel.financial_panel.grants_grantmaking h4 {
	margin-bottom: 0;
}
.panel.financial_panel.grants_grantmaking .columns_total {
	padding: 0 1rem 0 1rem;
	margin-bottom: 1rem;
}
.panel.financial_panel.grants_grantmaking .columns_total h4 {
	text-align: center;
	margin-top: 2rem;
}
#grants_grantmaking_chart {
	position: relative;
	width: 100%;
	margin-bottom: 1rem;
}
#grants_grantmaking_chart .yaxis_label {
	border-bottom: none;
}
#grants_grantmaking_chart .chart_bars {
	position: absolute;
	top: 9.1%;
	bottom: 0%;
	left: 3%;
	width: 97%;
}
#grants_grantmaking_chart .chart_bar {
	position: absolute;
	bottom: 0;
	padding: 0 0.5rem;
}
#grants_grantmaking_chart .bar_year {
	position: absolute;
	top: 103%;
	text-align: center;
}
#grants_grantmaking_chart .bar_year h6 {
	text-transform: none;
}
#grants_grantmaking_chart .bar_value {
	position: absolute;
	width: 100%;
	text-align: center;
	font-family: "Oswald", sans-serif;
	top: -1.7rem;
	padding-right: 0.5rem;
}

#grants_place_chart {
	position: relative;
	width: 100%;
	margin-bottom: 1rem;
}
#grants_place_chart .yaxis_label {
	border-bottom: none;
}
#grants_place_chart .chart_bars {
	position: absolute;
	top: 9.1%;
	bottom: 0%;
	left: 3%;
	width: 97%;
}
#grants_place_chart .chart_bar {
	position: absolute;
	bottom: 0;
	padding: 0 0.5rem;
}
#grants_place_chart .bar_year {
	position: absolute;
	top: 103%;
	text-align: center;
}
#grants_place_chart .bar_year h6 {
	text-transform: none;
}
#grants_place_chart .bar_value {
	position: absolute;
	width: 100%;
	text-align: center;
	font-family: "Oswald", sans-serif;
	top: -1.7rem;
	padding-right: 0.5rem;
}



#commitments_year_chart {
	position: relative;
	width: 100%;
	margin-bottom: 6rem;
}
#commitments_year_chart .yaxis {
	margin-left: 6%;
	width: 94%;
}
#commitments_year_chart .yaxis_label {
	border-bottom: 1px solid #DADADA;
}
#commitments_year_chart .yaxis_label h6 {
	transform: translateX(-4rem) translateY(0.5rem);
}
#commitments_year_chart .chart_bars {
	position: absolute;
	top: 9.1%;
	bottom: 0%;
	left: 6%;
	width: 94%;
}
#commitments_year_chart .chart_bar {
	position: absolute;
	bottom: 0;
	padding: 0 0.5rem;
}
#commitments_year_chart .bar_year {
	position: absolute;
	top: 103%;
	text-align: center;
}
#commitments_year_chart .bar_year h6 {
	text-transform: none;
}
#commitments_year_chart .bar_value {
	position: absolute;
	width: 100%;
	text-align: center;
	font-family: "Oswald", sans-serif;
	top: -1.7rem;
	padding-right: 0.5rem;
}
#commitments_year_hover {
	position: absolute;
	xdisplay: none;
	top: 0;
	left: 0;
	background-color: #DB0962;
	font-size: 0.8rem;
	color: white;
	text-align: center;
	padding: 1rem;
	transform: translate(-50%, -4rem);
}
#commitments_year_hover::after {
	color: #DB0962;
	content: '\f0d7';
	font-family: "fontawesome";
	font-size: 2.5rem;
	text-align: center;
	width: 100%;
	position: absolute;
	transform: translate(-1rem, 0)
}


#payments_year_chart {
	position: relative;
	width: 100%;
	margin-bottom: 6rem;
}
#payments_year_chart .yaxis {
	margin-left: 6%;
	width: 94%;
}
#payments_year_chart .yaxis_label {
	border-bottom: 1px solid #DADADA;
	padding: 1.125rem 0;
}
#payments_year_chart .yaxis_label h6 {
	transform: translateX(-4rem) translateY(0.5rem);
}
#payments_year_chart .chart_bars {
	position: absolute;
	top: 9.1%;
	bottom: 0%;
	left: 6%;
	width: 94%;
}
#payments_year_chart .chart_bar {
	position: absolute;
	bottom: 0;
	padding: 0 0.5rem;
}
#payments_year_chart .bar_year {
	position: absolute;
	top: 103%;
	text-align: center;
}
#payments_year_chart .bar_year h6 {
	text-transform: none;
}
#payments_year_chart .bar_value {
	position: absolute;
	width: 100%;
	text-align: center;
	font-family: "Oswald", sans-serif;
	top: -1.7rem;
	padding-right: 0.5rem;
}
#payments_year_hover {
	position: absolute;
	xdisplay: none;
	top: 0;
	left: 0;
	background-color: #DB0962;
	font-size: 0.8rem;
	color: white;
	text-align: center;
	padding: 1rem;
	transform: translate(-50%, -4rem);
}
#payments_year_hover::after {
	color: #DB0962;
	content: '\f0d7';
	font-family: "fontawesome";
	font-size: 2.5rem;
	text-align: center;
	width: 100%;
	position: absolute;
	transform: translate(-1rem, 0)
}


#payout_year_chart {
	position: relative;
	width: 100%;
	margin-bottom: 6rem;
}
#payout_year_chart .yaxis {
	margin-left: 6%;
	width: 94%;
}
#payout_year_chart .yaxis_label {
	border-bottom: 1px solid #DADADA;
	padding: 1.125rem 0;
}
#payout_year_chart .yaxis_label h6 {
	transform: translateX(-4rem) translateY(0.5rem);
}
#payout_year_chart .chart_bars {
	position: absolute;
	top: 9.1%;
	bottom: 0%;
	left: 6%;
	width: 94%;
}
#payout_year_chart .chart_bar {
	position: absolute;
	bottom: 0;
	padding: 0 0.5rem;
}
#payout_year_chart .bar_year {
	position: absolute;
	top: 103%;
	text-align: center;
}
#payout_year_chart .bar_year h6 {
	text-transform: none;
}
#payout_year_chart .bar_value {
	position: absolute;
	width: 100%;
	text-align: center;
	font-family: "Oswald", sans-serif;
	top: -1.7rem;
	padding-right: 0.5rem;
}
#payout_year_hover {
	position: absolute;
	xdisplay: none;
	top: 0;
	left: 0;
	background-color: #DB0962;
	font-size: 0.8rem;
	color: white;
	text-align: center;
	padding: 1rem;
	transform: translate(-50%, -4rem);
}
#payout_year_hover::after {
	color: #DB0962;
	content: '\f0d7';
	font-family: "fontawesome";
	font-size: 2.5rem;
	text-align: center;
	width: 100%;
	position: absolute;
	transform: translate(-1rem, 0)
}

.chart_bar .fill {
	height: 100%;
	background-color: black;
}
.vertical-chart .chart {
	width: 98% !important;
	margin-left: 2% !important;
}

#social-media-data {
	display: none;
}
#hero_video > p:first-of-type,
#leadership > p:first-of-type,
#grantmaking > p:first-of-type,
#financials > p:first-of-type,
#about > p:first-of-type {
	height: 0;
}
#grantmaking_area_place, #grantmaking_place {
	padding-top: 3rem;
}
#grantmaking_area_place h4 {
	margin-bottom: 1rem;
}