body { margin: 0 5px 0 5px;}

/* undo things from style.css that are not smart */ 
table {width: auto; margin: initial;}

/* style.css sets forms to inline, but wordpress mgmt plugin requires the default (block) */
form#eeSFL_UploadForm {display: block;}

/* screen reader elements that should be hidden from sighted users (eg. donation form labels) */
.sr-only {position:absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden;}

#masthead-container {
    padding-top: 5px;
	text-transform: uppercase; 
	font-family: 'Montserrat', 'Arial Black', 'Gadget', sans-serif;
	max-width: 1100px;
	min-width: 305px;
	margin: auto auto;
	line-height: normal;
}

a img {display: inline-block;}

.current-menu-item, .current-page-item {color: #FA7004;}

.site-title {
	text-transform: uppercase; 
	font-weight: bolder;
	color: #4e6563;
	text-align: center;
	white-space: nowrap;
	font-family: 'Montserrat', 'Arial Black', 'Gadget', sans-serif;
}
.site-title td, .site-title td a { vertical-align: middle; font-weight: bolder; }
#ckcuburger {padding-left: 15px; text-align: right;}
#logotable {width: 100%;}
#logotext {text-align: left;}
#ckculogo img {vertical-align: middle;}
button#responsive-menu-button {font-size: 12px; vertical-align: middle;}

#ckculogo {padding-right: 5px; width: 70px; min-width: 70px;}  

body.home #menu-item-202 {
    display: none;
}

#menu-item-166 { color: #018BEA; }
/* #menu-item-433, .donate, a.donate:visited, #menu-cod a.donate, #menu-cod a.donate:visited { color: #BB0000; } RED DONATE LINKS */

#menu-top {color: #7F8E8D; font-weight: bolder; padding: 0; margin: 0; }
#menu-main {color: #526765;	font-weight: bolder; padding-bottom: 5px;}
#menu-main > li, #menu-top > li {display:inline-block; } 
#menu-main a, #menu-main a:visited, #menu-main a:active, #menu-top a, #menu-top a:visited, #menu-top a:active, .site-title a, .site-title a:visited, .site-title a:active {
	text-decoration: none;
	color: inherit;
	font-weight: inherit;
	display:inline-block;
	margin: 0; padding: 0;
}
#menu-main a:hover, #menu-top a:hover, .site-title a:hover {text-decoration: underline;}
#menu-top {text-align: right;}
#menu-main a, #menu-main a:visited, #menu-main a:active, #menu-top a, #menu-top a:visited, #menu-top a:active {padding-right: 1em; }
#menu-top input {width: 100px;}

#grayline {background-color: #313538; height: 5px; clear: both;}
.orangeline {display: block; height: 1px; border: 0; border-top: 2px solid #FA7004; margin: 0; padding: 0;}


#highlight-title, #podcast-title {margin-top: 15px;}
#highlight-stack {display: block;}
#highlight-border {display: none;}
#highlightCAROUSEL {margin-left: 25px; margin-right: 25px; margin-bottom: 0;}
#highlightCAROUSEL button {box-shadow: none; text-shadow: none;}
.highlight-item {
    background-color: #A0A0A0;
    color: white;
	font-family: 'Open Sans', 'Arial', 'Gadget', sans-serif;
	padding:10px;
	word-wrap: break-word;
	line-height: 120%;
	cursor: pointer;
}
.highlight-label {
    background-color: #A0A0A0;
    color: white;
	font-family: 'Open Sans', 'Arial', 'Gadget', sans-serif;
	line-height: 120%;
	cursor: pointer;
}
#highlight-stack .highlight-item {clear: both; margin-bottom: 3px;}
.highlight-item {
    /* height: 5em; 
    float: left; 
    margin-top: 3px;
    margin-right: 7px;
    margin-bottom: 3px; */
    
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
    filter: gray;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}
.highlight-colorthumb {
    height: 5em; 
    float: left; 
    margin-top: 3px;
    margin-right: 7px;
    margin-bottom: 3px;
}
.highlight-progname {text-decoration: underline;}
.highlight-item a.more, .highlight-item a.more:visited, .highlight-item a.more:active {color: white; font-weight: bolder;}
.highlight-item a, .highlight-item a:visited, .highlight-item a:active {color: white;}

#podcast-stack {display: block; clear:both;}
#podcast-border {display: none; width: 100%; background-color: #325678;}
#podcastCAROUSEL {margin-left: 25px; margin-right: 25px; margin-bottom: 0;}
#podcastCAROUSEL button {box-shadow: none; text-shadow: none;}
.podcast-item {
    background-color: #325678;
    color: white;
	font-family: 'Open Sans', 'Arial', 'Gadget', sans-serif;
	padding:10px;
	cursor: pointer;
	text-align: left;
}
.podcast-label {
    background-color: #325678;
    color: white;
	font-family: 'Open Sans', 'Arial', 'Gadget', sans-serif;
	margin-top: 3px;
	cursor: pointer;
	text-align: left;
	padding-left: 10px;
}
#podcast-stack .podcast-item {
	clear: both;
	margin-bottom: 3px;
}

form {display: inline;}
main article th {text-align: left; color: #526765; padding-right: 10px;}
main article td {padding-right: 10px;}

#blog-title, #social-title, .splash-label {
	color: #526765;
	text-transform: uppercase; 
	font-family: 'Montserrat', 'Arial', 'Gadget', sans-serif;
}

#blog-title, #social-title {
	padding-bottom: 5px;
	margin-bottom: 10px;
	margin-top: 15px;
	border-bottom: 2px dotted #526765;
}



main article h1, main article h1 a, main article h1 a:visited, main article h1 a:active, 
main article h2, main article h2 a, main article h2 a:visited, main article h2 a:active, 
main article h3, main article h3 a, main article h3 a:visited, main article h3 a:active, 
main article h4, main article h4 a, main article h4 a:visited, main article h4 a:active 
{
	color: #526765;
	margin-bottom: 10px;
	margin-top: 15px;
	font-family: 'Open Sans', 'Arial', 'Gadget', sans-serif;
	text-decoration: none;
	font-weight: bold;
}


main article {
	color: #32403F;
	font-family: 'Open Sans', 'Arial', 'Gadget', sans-serif;
	padding-bottom: 5px;
	margin-bottom: 10px;
	margin-top: 15px;
}

main article + article {
	border-top: 1px dashed #333333;
}

.forcewrap {
    overflow-wrap: break-word;
    word-wrap: break-word;
    -ms-word-break: break-all;
    word-break: break-word;
    /* Adds a hyphen where the word breaks, if supported (No Blink) */
    -ms-hyphens: auto;
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;
}

#blog-holder article img[align=left] {margin: 10px 10px 10px 0;} 
#blog-holder article img[align=right] {margin: 10px 0 10px 10px;} 

.blogstory img {display: none;}
#social-holder {display: none;}
#sidebar-holder {display:none; margin-top: 20px;}

.entry-title {color: #FA7004; text-transform: uppercase;}

#funding-layout-border {background-color: #676566;}
#funding-header, #funding-details {background-color: #676566; font-family: 'Montserrat', 'Arial Black', 'Gadget', sans-serif; color: white; padding-left: 5px; padding-right: 5px;}
#funding-header {padding: 10px; position: relative; text-transform: uppercase; text-align: center; font-weight: bolder;}
#funding-details {padding-bottom: 15px; padding-top: 5px;}
#donate-holder div {display: inline-block; vertical-align: middle; }
.donate-text {color: #FFE2A2; margin-right: 5px;}
#donate-button {background-color: #FFE2A2; border-radius: 5px; padding: 1px 5px; vertical-align: middle;}
#donate-button a, #donate-button a:visited, #donate-button a:active {color: #318057; text-decoration: none;}
#funding-phone a, #funding-phone a:visited, #funding-phone a:active, #funding-appeal a, #funding-appeal a:visited, #funding-appeal a:active {color: white; text-decoration: underline;}
#funding-appeal {vertical-align: top; overflow: auto;}
#funding-appeal article {color: #FFE2A2; margin-top: 0;}
#funding-phone article {color: #FFE2A2; margin-top: 0; margin-top: 1em;}
#funding-logo {display: block; width: 50%; margin: 0 auto 0 auto;}
#funding-logo-holder {background-color: white; height: 96px; width: 150px;}
#pledge-holder {display: block; width: 100%; }
#pledge-logo {display: block; width: 50%; margin: 0 auto 0 auto;}
#thermotable {font-weight: bolder; border-collapse: collapse; width: 100%;white-space: nowrap; }
#thermotable table {font-weight: bolder; border-collapse: collapse; width: 100%;white-space: nowrap;}
#thermotable-bar {background-color: #318057; border: 2px solid white; text-align: right; padding-right: 5px; }
#thermotable-slot {background-color: #666666; border: 2px solid white; padding-left: 5px; }
#thermotable-goal {padding-left: 5px;}
#matthew-sig {height: 1.5em;}

/* JQUERY MODAL */
.blocker {z-index: 11; padding: 5px;} /* jquery modal for newsletter signup must display over flow flow cards */
.modal {width: 100%; max-width: 450px;}

/* CENTRALIZED FONT SIZING FOR CLARITY -- 1 REM now equals 16px when browser at 100%
	PX		REM
	6.7		.41875
	9		.5625
	10		.625
	11		.6875
	11.8	.7375
	12		.75
	13		.8125
	14		.875
	15		.9375
	16		1
	18		1.125
	20		1.25
	24		1.5
	28		1.75
	40		2.5
	50		3.125 */
.site-title {font-size: 40px; font-size: 2.5rem;}
#funding-header, #matthew-sig {font-size: 14px; font-size: 0.875rem;}
#donate-button {font-size: 14px; font-size: 0.875rem;}
#menu-top {font-size: 9px; font-size: 0.5625rem;}
#menu-main, .playlist-track {font-size: 12px; font-size: 0.75rem;} 
main article h1, main article h1 a, main article h1 a:visited, main article h1 a:active, #blog-title, #social-title, .show-blurb, .splash-label {font-size: 14px; font-size: 0.875rem;}
main article h2, main article h2 a, main article h2 a:visited, main article h2 a:active {font-size: 12px; font-size: 0.75rem;}
main article, #thermotable, #funding-appeal article {font-size: 12px; font-size: 0.75rem;}
#sidebar-holder #airing-detail, #sidebar-holder .highlight-item, .podcast-label, .highlight-label {font-size: 12px; font-size: 0.75rem;}
#sidebar-holder .show-blurb {font-size: 14px; font-size: 0.875rem;}
.smalltext { font-size: 11px; font-size: 0.6875rem;} /* always smaller than article text */

/* for telephones in wide mode we stick with the minimal layout but there is space to up a few sizes for clarity */
@media screen and (min-width: 500px) {
    .site-title {font-size: 50px; font-size: 3.125rem;}
}

@media screen and (min-width: 825px) {

    .site-title {text-align: left;}
    
    /* these are all tagged with home-splash so that they don't affect the stacked version we want to see on subpages */
    .layoutBORDER {width: 100%;}
    .layoutLIMITER {max-width: 1100px; width: 100%; margin: auto auto; overflow: hidden; background: inherit;} 
    .layoutLIMITER-tightright {max-width: 1100px; width: 100%; margin: auto 0 auto auto; overflow: hidden; background: inherit;} 
       
    /* funding drive content floats at top */
    #funding-header {height: 50px; position: fixed; top: 0px; left: 5px; right: 5px; z-index: 11; padding: 0;}
    #funding-header + div {margin-top: 50px;}
    #donate-holder {position: relative; top: 50%; transform: translateY(-50%);}
    .admin-bar #funding-header {top: 32px;}
           
    .blogstory img {display: inherit; max-width: 100%;}

    #blog-holder {/*margin-right: 246px; */overflow: hidden; }
    #social-holder {width: 226px; float: right; display:block; }

    #page-holder, #blog-holder {/*margin-right: 315px; */overflow: hidden; }
    #sidebar-holder, #social-holder {width: 280px; float: right; display:block; }
    
    #menu-top {font-size: 10px; font-size: 0.625rem;}
    #menu-main, .playlist-track {font-size: 15px; font-size: 0.9375rem;} 
    main article h1, main article h1 a, main article h1 a:visited, main article h1 a:active, #blog-title, #social-title, .show-blurb, .splash-label {font-size: 14px; font-size: 0.875rem;}
    main article h2, main article h2 a, main article h2 a:visited, main article h2 a:active {font-size: 11px; font-size: 0.6875rem;}
    main article, #thermotable, #funding-appeal article {font-size: 11px; font-size: 0.6875rem;}
    .smalltext {font-size: 10px; font-size: 0.625rem;}
    #funding-header, #matthew-sig {font-size: 20px; font-size: 1.25rem;}
    .site-title {font-size: 40px; font-size: 2.5rem;}
    #funding-logo {display: initial; float: right; width: initial; height: 100px; margin: 0px 150px 0 10px;}
    #pledge-logo {display: initial; float: right; width: initial; height: 150px;}
	#pledge-holder {display: block; width: 66%; text-align: left;}
	.modal {width: 450px; max-width: none;}
	.blocker {padding: 20px;} /* jquery modal for newsletter signup must display over flow flow cards */
	#ckcuburger {display: none}
}

/* when we first expand from phone mode, the detail font and pics are small to save space. Provide aditional steps up. */
@media screen and (min-width: 900px) {
    #menu-top {font-size: 10px; font-size: 0.625rem;}
    #menu-main, .playlist-track {font-size: 16px; font-size: 1rem;} 
    main article h1, main article h1 a, main article h1 a:visited, main article h1 a:active, #blog-title, #social-title, .show-blurb, .splash-label {font-size: 16px; font-size: 1rem;}
    main article h2, main article h2 a, main article h2 a:visited, main article h2 a:active {font-size: 12px; font-size: 0.75rem;}
    main article, #thermotable, #funding-appeal article {font-size: 12px; font-size: 0.75rem;}
    #sidebar-holder #airing-detail, #sidebar-holder .highlight-item {font-size: 13px; font-size: 0.8125rem;}
    #sidebar-holder .show-blurb {font-size: 16px; font-size: 1rem;}
    .smalltext {font-size: 10px; font-size: 0.625rem;}

    #page-holder, #blog-holder {/*margin-right: 365px; */overflow: hidden; }
    #sidebar-holder, #social-holder {width: 330px; float: right; display:block; }
}

@media screen and (min-width: 1030px) {
    #menu-top {font-size: 12px; font-size: 0.75rem;}
    #menu-main, .playlist-track {font-size: 16px; font-size: 1rem;} 
    main article h1, main article h1 a, main article h1 a:visited, main article h1 a:active, #blog-title, #social-title, .show-blurb, .splash-label {font-size: 18px; font-size: 1.125rem;}
    main article h2, main article h2 a, main article h2 a:visited, main article h2 a:active {font-size: 14px; font-size: 0.875rem;}
    main article, #thermotable, #funding-appeal article {font-size: 14px; font-size: 0.875rem;}
    .smalltext {font-size: 12px; font-size: 0.75rem;}
}


/*
@font-face {
  font-family: 'Montserrat';
  font-weight: 400;
  font-style: normal;
  src: url('/fonts/Montserrat-regular/Montserrat-regular.eot');
  src: url('/fonts/Montserrat-regular/Montserrat-regular.eot?#iefix') format('embedded-opentype'),
       local('Montserrat-Regular'),
       local('Montserrat-regular'),
       url('/fonts/Montserrat-regular/Montserrat-regular.woff') format('woff'),
       url('/fonts/Montserrat-regular/Montserrat-regular.ttf') format('truetype'),
       url('/fonts/Montserrat-regular/Montserrat-regular.svg#Montserrat') format('svg');
}

@font-face {
  font-family: 'Montserrat';
  font-weight: 700;
  font-style: normal;
  src: url('/fonts/Montserrat-700/Montserrat-700.eot');
  src: url('/fonts/Montserrat-700/Montserrat-700.eot?#iefix') format('embedded-opentype'),
       local('Montserrat-Bold'),
       local('Montserrat-700'),
       url('/fonts/Montserrat-700/Montserrat-700.woff') format('woff'),
       url('/fonts/Montserrat-700/Montserrat-700.ttf') format('truetype'),
       url('/fonts/Montserrat-700/Montserrat-700.svg#Montserrat') format('svg');
}

@font-face {
  font-family: 'Open Sans';
  font-weight: 400;
  font-style: normal;
  src: url('/fonts/Open-Sans-regular/Open-Sans-regular.eot');
  src: url('/fonts/Open-Sans-regular/Open-Sans-regular.eot?#iefix') format('embedded-opentype'),
       local('Open Sans'),
       local('Open-Sans-regular'),
       url('/fonts/Open-Sans-regular/Open-Sans-regular.woff') format('woff'),
       url('/fonts/Open-Sans-regular/Open-Sans-regular.ttf') format('truetype'),
       url('/fonts/Open-Sans-regular/Open-Sans-regular.svg#OpenSans') format('svg');
}

@font-face {
  font-family: 'Open Sans';
  font-weight: 700;
  font-style: normal;
  src: url('/fonts/Open-Sans-700/Open-Sans-700.eot');
  src: url('/fonts/Open-Sans-700/Open-Sans-700.eot?#iefix') format('embedded-opentype'),
       local('Open Sans Bold'),
       local('Open-Sans-700'),
       url('/fonts/Open-Sans-700/Open-Sans-700.woff') format('woff'),
       url('/fonts/Open-Sans-700/Open-Sans-700.ttf') format('truetype'),
       url('/fonts/Open-Sans-700/Open-Sans-700.svg#OpenSans') format('svg');
}

@font-face {
  font-family: 'Open Sans Condensed';
  font-weight: 300;
  font-style: normal;
  src: url('/fonts/Open-Sans-800/Open-Sans-800.eot');
  src: url('/fonts/Open-Sans-800/Open-Sans-800.eot?#iefix') format('embedded-opentype'),
       local('Open Sans Extrabold'),
       local('Open-Sans-800'),
       url('/fonts/Open-Sans-800/Open-Sans-800.woff') format('woff'),
       url('/fonts/Open-Sans-800/Open-Sans-800.ttf') format('truetype'),
       url('/fonts/Open-Sans-800/Open-Sans-800.svg#OpenSans') format('svg');
}
*/