@charset "utf-8";

/* HOMEPAGE TOP COLUMNS */
#content-top-lt {
	width: 24%;
	height: 224px;
	float: left;
	overflow: hidden
}
#content-top-rt {
	width: 75%;
	height: 0;
	padding-bottom: 24%;
	/* 679px:224px@75% */
	float: right;
	position: relative
}
#content-top-rt>a {
	color: rgba(0, 0, 0, 0)
}
#content-top-rt img {
	display: block;
	width: 100%
}
#content-top-rt a,
#content-top-rt div {
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	background-size: cover
}
#content-top-lt .home {
	color: white;
	padding: 18px 18px 0 18px;
	font-weight: bold
}
#info-nav {
	text-align: left;
	padding: 4px 18px 0 20px
}
#resources-nav {
	text-align: left;
	padding: 4px 0
}
#resources-nav p {
	line-height: 10px;
	padding: 4px 0
}
#content-top-rt #hero-nav {
	position: absolute;
	height: 18px;
	left: auto;
	right: 6px;
	bottom: 6px;
	top: auto;
	z-index: 1001
}
#content-top-rt #hero-nav span {
	color: white;
	float: right;
	font-family: "Roboto Condensed", sans-serif;
	font-size: 15px;
	font-weight: bold;
	line-height: 19px;
	margin-right: 5px;
	opacity: 0.9;
	text-transform: uppercase;
	text-shadow: 0 0 4px black
}
.extended-education #content-top-rt #hero-nav span,
.uc #content-top-rt #hero-nav span {
	display: none
}
#content-top-rt #hero-nav a {
	position: static;
	float: right;
	width: 18px;
	height: 18px
}
#content-top-rt #hero-nav a img.off,
#content-top-rt #hero-nav a.off img.off {
	display: block
}
#content-top-rt #hero-nav a img.on,
#content-top-rt #hero-nav a.on img.on {
	display: none
}
#content-top-rt #hero-nav a.on img.on {
	display: block
}
#content-top-rt #hero-nav a.on img.off {
	display: none
}
.wnmc #content-top-lt {
	height: 285px
}
.wnmc #content-top-rt #hero-nav {
	display: none
}
@media only screen and (max-width:926px) {

	#content-top-lt,
	.wnmc #content-top-lt {
		width: 44%;
		height: auto;
		border-right-style: none;
		border-bottom-style: none;
		margin: 4% 0 4% 4%;
		border-radius: 4px;
		-moz-border-radius: 4px;
		-webkit-border-radius: 4px;
		background-color: #3a4d68
	}
	#content-top-lt .home {
		display: block;
		color: white
	}
	#content-top-lt #info-nav {
		padding: 0 12px 12px
	}
	#wnmc-programs {
		margin: 0;
		padding: 0
	}
	#info-nav {
		display: none
	}
	#resources-nav {
		padding-left: 12px
	}
	#content-top-rt {
		width: 100%;
		height: 0;
		float: none;
		padding-bottom: 32%;
		/* 679px:224px */
	}
	#info-title:after {
		content: " ▼"
	}
	.show-info-nav #info-nav {
		display: block
	}
	.show-info-nav #info-title:after {
		content: " ▲"
	}
	#content-top-lt .home,
	#info-title {
		font-size: 16px;
		padding: 8px 10px
	}
}
@media only screen and (max-width:650px) {
	#content-top-rt #hero-nav {
		display: none
	}
}
@media only screen and (max-width:490px) {

	#content-top-lt,
	.wnmc #content-top-lt {
		float: none;
		width: auto;
		margin: 4%
	}
}
/* END HOMEPAGE TOP COLUMNS */
/* HOMEPAGE BOTTOM COLUMNS */
#homepage-content {
	background-color: #0b3852
}
#content-columns {
	position: relative;
	z-index: 1
}
#content-columns:before {
	content: " ";
	position: absolute;
	z-index: -1;
	right: 0;
	top: 0;
	width: 33%;
	height: 100%;
	background-color: #ebecef
}
#content-bot {
	clear: both;
	background-color: #0b3852
}
#content-bot:after {
	content: "";
	display: table;
	clear: both
}
#content-bot-rt {
	position: relative;
	width: 75%;
	float: right;
	background-color: white
}
#content-bot-rt #message>div {
	font-size: 16px;
	background-color: #231f20;
	padding: 10px 20px 15px;
	color: #ff6;
	font-weight: bold
}
#content-bot-rt #message>div>p {
	color: #ff6;
	padding: 0
}
#content-bot-rt #message .special-alert {
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 24px;
	font-weight: bold;
	color: white
}
#content-bot-rt #message a {
	color: #ffff66;
	text-decoration: underline;
	font-weight: bold
}
#content-bot-lt {
	width: 25%;
	float: left;
	text-align: left;
	clear: both;
	padding: 10px 15px 0 18px;
	box-sizing: border-box
}
#content-bot-lt a {
	color: white
}
#content-bot-lt h3.home {
	font-size: 18px;
	font-weight: bold;
	text-transform: uppercase;
	color: white
}
#homepage-spotlight-content p {
	padding: 5px 0 10px 0
}
#content-columns {
	margin: 0 auto;
	text-align: center
}
#content-columns-news {
	width: 33%;
	float: right;
	padding: 20px 12px 0 18px;
	text-align: left;
	box-sizing: border-box
}
#content-columns-news a {
	color: #231f20
}
#content-columns-news h4,
#content-columns-news h4 a {
	font: bold 18px "Roboto Condensed", sans-serif;
	color: #4366A8;
	text-transform: uppercase;
	margin-bottom: 10px
}
#content-columns-news ul {
	margin: 0 0 0 5px;
	padding: 0;
	list-style-type: none
}
#content-columns-news li {
	line-height: 16px;
	margin: 0;
	padding: 2px 0;
	color: #336941
}
#content-columns-mid {
	width: 66%;
	float: left;
	margin: 0;
	padding: 18px 15px 30px 18px;
	text-align: left;
	box-sizing: border-box
}
#content-columns-mid h1:first-child {
	margin-top: 0;
	padding-top: 0
}
#content-columns-mid p {
	font-size: 14px;
	line-height: 22px;
	font-weight: normal
}
.home-photo {
	width: auto;
	height: auto;
	margin: 6px 0 20px 0;
	padding: 0
}
.home-photo-lt {
	width: 184px;
	height: auto;
	margin: 0;
	padding: 0;
	float: left
}
.home-photo-rt {
	width: 186px;
	height: auto;
	margin: 0;
	padding: 0;
	float: right;
	text-align: left
}
#homepage-colorbar {
	display: block;
	width: 100%;
	height: 12px
}
#content-columns-mid-content,
#content-columns-mid-content h1,
#content-columns-mid-content h1 a,
#content-columns-mid-content h2,
#content-columns-mid-content h2 a,
#content-columns-mid-content h3,
#content-columns-mid-content h3 a,
#content-columns-mid-content h4,
#content-columns-mid-content h4 a,
#content-columns-mid-content h5,
#content-columns-mid-content h5 a,
#content-columns-mid-content h6,
#content-columns-mid-content h6 a {
	font-weight: bold
}
#content-columns-mid-content h1 {
	font: bold 32px "Roboto Condensed", sans-serif
}
#content-bot-lt #programs {
	padding: 5px 0 0 0;
	margin-bottom: 15px
}
@media only screen and (max-width:926px) {
	#content-bot {
		clear: none;
		background-color: transparent
	}
	#content-bot-lt {
		float: right;
		clear: none;
		width: 44%;
		margin: 4% 4% 4% 0;
		padding: 0;
		border-radius: 4px;
		-moz-border-radius: 4px;
		-webkit-border-radius: 4px;
		overflow: hidden
	}
	#programs {
		margin-bottom: 8px
	}
	#content-bot-rt {
		float: none;
		width: 100%;
		clear: both
	}
	#content-columns:before,
	#content-columns-news {
		box-sizing: border-box;
		width: 27%
	}
	#content-columns-mid {
		box-sizing: border-box;
		width: 72%
	}
	#homepage-colorbar {
		display: none
	}
	#content-bot-lt h3.home:after {
		content: " ▼"
	}
	#content-bot-lt h3.home {
		border-bottom-style: none;
		margin: 0
	}
	#homepage-spotlight-content,
	#programs {
		display: none
	}
	.show-homepage-spotlight #homepage-spotlight-content,
	.show-homepage-spotlight #programs {
		display: block;
	}
	.show-homepage-spotlight #content-bot-lt h3.home {
		border-bottom-style: solid
	}
	div#content-bot-lt.show-homepage-spotlight h3.home::after {
		content: " ▲"
	}
	#content-bot-lt h3.home {
		font-size: 16px;
		padding: 8px 10px
	}
	body.wnmc #content-bot-lt h3.home::after {
		content: " Show Recently Played ▼";
		font-size: 75%;
		font-weight: normal
	}
	body.wnmc div#content-bot-lt.show-homepage-spotlight h3.home::after {
		content: " Hide Recently Played ▲"
	}
	#homepage-spotlight-content p {
		padding-left: 10px
	}
}
@media only screen and (max-width:700px) {
	#content-columns:before {
		content: none
	}
	#content-columns-mid,
	#content-columns-news {
		float: none;
		width: auto !important;
		padding: 8px
	}
	#content-columns-news {
		background-color: #ebecef;
		clear: left
	}
	#programs-rt div a {
		padding-left: 0 !important
	}
}
@media only screen and (max-width:490px) {
	#content-bot-lt {
		float: none;
		width: auto;
		margin: 4%
	}
}
@media only screen and (max-width:420px) {
	.wnmc #content-columns-mid iframe {
		display: none;
		/* Hide "WNMC Music News" iframe */
	}
}
/* END HOMEPAGE BOTTOM COLUMNS */
/* EVENTS */
.events-list {
	padding-top: 4px
}
div.events {
	margin: 4px 0 0;
	padding: 2px 0 0
}
.events-rt {
	text-align: left;
	margin-left: 44px
}
.events-rt p {
	line-height: 1.4em
}
.events-lt {
	width: 35px;
	float: left;
	text-align: center;
	line-height: 1.5em;
	text-transform: uppercase;
	padding-top: 2px
}
.events-lt span,
.events-lt span+span+span {
	color: #5e6a8d;
	display: block;
	font-size: 14px
}
.events-lt span+span {
	font-size: 29px
}
p.eventdates {
	color: #5e6a8d;
	text-align: center;
	line-height: 18px;
	text-transform: uppercase
}
@media only screen and (max-width:920px) {
	.events-rt {
		width: auto;
		float: none
	}
	.events-lt {
		margin-right: 10px
	}
}
/* END EVENTS */