/* v2022:030 */
/*	@import url(https://fonts.googleapis.com/css?family=Oswald:300,400,700|PT+Serif:400,700|Open+Sans:300,400,700|Monda);	*/

@media screen {
	BODY			{
		--PageWidth: 1200px;
		--PageMargin: 20px;
		--ColorDiv: #728242;
		--MenuHover: #FCF90E;
		--LinkHover: #FF9D9D;
		--DebugWidth: 0px;
	}
}
/*************************************************************************************************/
/* Common elements */
HTML					{ box-sizing: border-box; }
*, *:before, *:after	{ box-sizing: inherit; }

BODY			{ margin: 0px; background-color: #212121; }
BODY, P			{ color: #FFF; font: 13.5pt 'PT Sans',sans-serif; }
A				{ color: #FFFFC0; border-width: 0px; } /* #F7ECA1 */
H3				{ font: 20pt Monda,sans-serif; }

HEADER DIV, DIV.Head, DIV.HeadSE, DIV.Body, FOOTER UL, FOOTER ARTICLE
				{ max-width: var(--PageWidth); margin: 0px auto; }

HR				{ border-color: var(--ColorDiv); }
/*************************************************************************************************/
/* Header */
HEADER			{ background-color: #1B1B1B; }
HEADER DIV		{ padding: 15px 20px; text-align: center; /* display: flex; align-items: center; */}
HEADER IMG		{ max-width: 540px; width: 89%; margin: 3px auto; }

/*************************************************************************************************/
/* Top Menu */
NAV#TopMenu	{ background: linear-gradient(to bottom, #555, #000); display: flex; justify-content: center; align-items: center; }
NAV A		{ color: #FFF; }
NAV A:hover	{ color: var(--MenuHover); }
DIV.TopMnu	{ display: none; text-align: left; } /* Default is off for all screens */
DIV.TopMnu IMG	{ margin: 8px 0px 0px 7px; vertical-align: top;  overflow: hidden;
				  width: 15px; height: 16px;
				  transition-duration: 0.8s; transition-property: transform; }
#SubStates	{ display: none; }
DIV.TopMnu	{ transition: opacity 0.8s; opacity: 0; }

/*************************************************************************************************/
/* Head frame, title, slogan and subtitle */
DIV.Head		{ padding: 20px; }
DIV.Head H1, #Top THEAD TH, H2.SubTitle,
DIV.Head H2		{ color: #DDD; text-shadow: 6px 6px 4px #000; }
DIV.Head H1		{ font: 300 32pt Oswald,sans-serif; margin: 0px;
					padding: 0px 0px 5px 0px; border-bottom: 4px solid #707070; }
H2.SubTitle,
DIV.Head H2		{ font: 200 24pt Oswald,sans-serif; margin: 0px; padding: 0px; }
H2.SubTitle B,
DIV.Head H2 B	{ font-weight: 600; margin-left: 10px; }
DIV.Head H3		{ font: 300 20pt Oswald,sans-serif; color: #DDD; margin: 4px 0px 0px;
		padding: 0px 0px 15px 0px; border-top: 0px solid #888; text-align: right; }

/*************************************************************************************************/
/* On The Air and Now Playing Tables */
DIV.Head #Top	{ display: flex; justify-content: space-between; align-items: flex-start;
				  border-bottom: 1px solid #728242; padding-bottom: 20px; margin: 20px 0px 0px; }

DIV.Head TABLE	{ display: inline-table; max-width: 374px; border-collapse: collapse; border: 1px solid #4C4C4C; }

DIV.Head #Air	{ }
DIV.Head #Air IMG	{ width: 84px; margin: 5px; }
DIV.Head #Now B, DIV.Head #Now U,
DIV.Head #Now I		{ display: block; font-weight: 400; }
DIV.Head #Now IMG	{ margin: 5px; } /* width: 84px; */

#Top THEAD TH	{ font: 15pt Monda,sans-serif;
			background: linear-gradient(to bottom, #606060, #404040); }
#Top TBODY TD,
#Top TBODY TH,
#Top TFOOT TD	{ background-color:  #282828; text-align: center;
				  font: 13pt 'PT Sans Narrow','Arial Narrow',sans-serif; }

#Top TBODY TD	{ padding: 5px; }
#Top TBODY TD,
#Top TBODY TH	{ height: 160px; }

#Top TFOOT TD	{ vertical-align: bottom; padding: 10px 5px; }

#Top TBODY U, #Top TBODY S, #Now TBODY U,
#Now TBODY S	{ text-decoration: none; }
#Top TBODY S,
#Now TBODY S	{ color: #999; }

#Lnk			{ display: block; }
/*
#Top TBODY A	{ display: block; }
#Air A			{ display: inline; }
*/


/*************************************************************************************************/
/* Big Buttons */
DIV.Head #Big	{ text-align: end; /* inline-block; */ }
DIV.Head #Big A	{ border-radius: 10px; width: 170px; height: 100px; display: inline-block;
	background: linear-gradient(to bottom, #8DF144, #259320); font: 24pt Monda,sans-serif;
	text-shadow:  3px 3px 2px #000; color: #FFF; text-decoration: none; line-height: 24pt;
	text-align: center; padding-top: 16px; margin-left: 15px; transition: 300ms; }
DIV.Head #Big A:first-child	{ background: linear-gradient(to bottom, #8C9E53, #5C6935); margin-bottom: 15px; }
DIV.Head #Big A:hover		{ color: var(--MenuHover); }

/*************************************************************************************************/
/* Common Main Area */
MAIN			{ min-height: 320px; }
MAIN P			{ color: #CCC; font: 14pt 'PT Sans',sans-serif; }
MAIN P A		{ color: #F1F0C5; text-decoration: none; transition: 300ms; }
MAIN P A:Hover	{ color: #FF8080; text-decoration: underline; }


DIV.Progs		{ max-width: 1800px; margin: 0px auto; text-align: center; }
DIV.Progs H3	{ text-align: left; margin: 0px auto; padding: 0px 21px; }
DIV.Progs IMG	{ width: 360px; border: 1px solid #000; margin: 20px; box-shadow: 0 0 20px #000; }

DIV.Main		{ margin: 0px auto; padding: 10px 20px; margin: 20px;
				  background-color: #8C9E54; text-shadow: 1px 1px 1px #000; }
DIV.Main P, DIV.Main A	{ color: #FFF; font-size: 15pt; }
DIV.Main A		{ color: #FFEA9F; }

DIV.Body		{ padding: 0px 20px 20px; }
DIV.Body A		{ text-decoration: none; }

IMG.Icon		{ display: inline-block; margin-right: 15px; vertical-align: middle; }
P.Icons A		{ display: block; margin: 10px 0px 10px 20px; }

/* Pledge Button */
P.Pledge	{ text-align: center; }
P.Pledge A	{ display: inline-block; font: 14pt Monda,sans-serif; box-shadow: 1px 1px 2px 0px #0000005C;
			  color: #444 ! important; text-shadow: 1px 1px 0px #EEEEEE; padding: 3px 8px;
			  border-radius: 5px; border: 1px solid #000; text-decoration: none ! important;
			  background: #59C232 linear-gradient(to bottom, #8DF144, #259320);
			}
P.Pledge A:Hover	{ color: #A00000 !important; background: #EEE;
					  background: #59C232 linear-gradient(to bottom, #9DF154, #35A330);
					}
/*****************/
TABLE.Banners		{ max-width: 90%; border-collapse: collapse; max-width: var(--PageWidth); margin: 26px auto 0px auto; }
TABLE.Banners TH	{ font-size: 10pt; font-weight: normal; text-align: right; }
TABLE.Banners IMG	{ width: 100%; }

A.CityTimes			{ display: block; background-color: #FFF; padding: 10px 15px; border: 1px solid #000; }
A.CityTimes IMG { background-color: #FFF; display: inline-block;
	display: block; width: 100%; max-width: 776px;
	margin: 10px auto 0px auto; }
A.CityTimes IMG.CityTimesSmall	{ display: none; }

HR				{ border-color: var(--ColorDiv); }

/*************************************************************************************************/
/* Home Page */
DIV.News		{ xtext-align: center; }
DIV.ListBlock,
DIV.News ARTICLE{ display: block; background-color: #282828; border: 1px solid #4C4C4C;
		overflow: overlay; color: #CCC; padding: 20px; text-align: left; margin: 5px 0px 15px 0px;
		box-shadow: 3px 3px 7px 2px #000; }
/*
DIV.News ARTICLE>IMG	{ max-width: 560px; width: 100%; display: block; margin: 10px auto 0px; }
DIV.News H3		{ text-align: left; margin: 0px var(--PageMargin); padding: 0px; }
*/
DIV.News IMG.Cover	{ width: 80%; height: auto; display: block; margin: 20px auto; border: 1px solid #000; }
DIV.News IMG.Tile	{ border: 1px solid #000; margin: 0px 20px 10px 0px; float: left; max-width: 160px; width: 42%; }
DIV.News H4.Title		{ text-align: left; font: 300 18pt Oswald,sans-serif; margin: 0px; }
DIV.News LI,
DIV.News P		{ font: 14pt 'PT Sans',sans-serif; }
DIV.News BR		{ clear: left; }
DIV.News .Ads	{ background-color: #282828; border: 1px solid #4C4C4C;
				  margin: 5px 20px 15px 20px; padding: 20px 19px 15px 19px; }

DIV.News DIV.Pix		{ border: 1px solid black; background-color: #E5E5E5; padding: 10px;
				   		  max-width: 620px; margin: 15px auto; text-align: center; color: #000; }
DIV.News DIV.Pix IMG	{ width: 100%; border: 1px solid black; display: block; }
DIV.News DIV.Pix P		{ color: #000; font-size: 12pt; font-style: italic; text-align: left; }

DIV.News A.More	{ color: #00E7FF; display: block; margin: 20px 0px 0px 0px;
				  overflow: overlay; padding: 1px 5px 2px 30px; border: 0px solid #FFF;
	background: url(/sysLibrary/images/box.asp?m=f061&s=26&c=00E7FF&k=o&t=0) no-repeat;
}

/* These tags are temporary disabled for porting from previous version */
DIV.HomeNewsCmnt	{ display: none; }

/* Recently Aired Album Covers */
DIV.Recent		{ display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap; padding: 0px 0px 0px 20px; }    /* var(--PageMargin);  */
DIV.Recent H3	{ }
DIV.Recent IMG	{ width: 160px; height: 160px; border: 1px solid #000; margin: 0px 20px 20px 0px; }


/*************************************************************************************************/
/* Home Page Hosts Block */
DIV.Hosts		{ display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap; padding: 0px; }
DIV.Hosts H3	{ }
DIV.Hosts A		{ display: inline-block; font: 12pt 'PT Sans Narrow','Arial Narrow'; text-align: center; margin: 0px 15px; }
DIV.Hosts IMG	{ display: block; height: 140px; width: auto; border: 1px solid #000; margin: 15px auto 0px; }
DIV.Hosts A:Hover		{ color: var(--LinkHover); }
DIV.Hosts A:Hover IMG	{ border-color: var(--LinkHover); }

/*************************************************************************************************/
/* Home Page Flags Block */
DIV.Flags		{ display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap; padding: 0px; }

DIV.Flags P		{ display: flex; flex-direction: column; align-items: center; justify-content: flex-start; margin: 4px 7px;}
DIV.Flags IMG	{ display: block; height: 48px; width: 64px; border: 1px solid #FFF; margin: 15px auto 0px;
			/*	  box-sizing: content-box; */ }
DIV.Flags B		{ display: inline-block; font: 400 12pt 'PT Sans Narrow','Arial Narrow'; text-align: center;
				  margin: 0px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; width: 64px; }
/*
DIV.Flags A:Hover		{ color: var(--LinkHover); }
DIV.Flags A:Hover IMG	{ border-color: var(--LinkHover); }
*/

/* Today's Birthdays and On This Day */
DIV.ListBlock H4				{ margin: 0px; font: 18pt Oswald,sans-serif; }
DIV.ListBlock H4 SPAN			{ color: #80FF80; }
DIV.ListBlock UL				{ margin-top: 10px; }
DIV.ListBlock LI				{ margin: 8px 0px 0px; }
DIV.ListBlock A					{ font-weight: normal; transition: 300ms; }
DIV.ListBlock A:Hover			{ color: var(--LinkHover); text-decoration: underline; }

/*************************************************************************************************/
/* Block Item */
DIV.Block		{ display: block; background-color: #282828; border: 1px solid #4C4C4C; overflow: overlay;
		padding: 0px; text-align: left; margin: 5px 0px 15px 0px; box-shadow: 3px 3px 7px 2px #000; }
DIV.Block H4		{ font: 18pt Monda,sans-serif; text-align: left; padding: 5px 30px; border: 1px solid #AAA;
	background: linear-gradient(to bottom, #606060, #404040); text-shadow: 6px 6px 4px #000; color: #DDD;
				margin: 0px; }

DIV.Block IMG.Tile	{ border: 1px solid #000; margin: 0px 20px 5px 0px; float: left;
			max-width: 160px; width: 42%; }

DIV.Block DIV	{ padding: 20px 20px 15px 20px;
	/* border: 1px solid #AAA; border-top-width: 0px; margin: 0px 0px 0px 30px; padding: 20px 0px 0px 0px; */
				}

DIV.Block LI	{ margin: 5px 0px; }
DIV.Block P		{}

zDIV.Block P	{ font-size: 14pt; margin: 0px 20px 15px 20px; padding: 0px; padding-left: 100px; text-indent: -106px; }
zDIV.Block B	{ display: inline-block; width: 110px; text-align: right; padding-right: 20px; }

/*************************************************************************************************/
/* Table, such as Programs List */
TABLE.TblList	{  border-collapse: collapse; border: 1px solid #AAA; }
TABLE.TblList THEAD TH	{ font: 15pt Monda,sans-serif; text-align: center; padding: 5px 30px; border: 1px solid #AAA;
			background: linear-gradient(to bottom, #606060, #404040); text-shadow: 6px 6px 4px #000;
			color: #DDD; margin: 20px 0px 0px 0px; }
TABLE.TblList TBODY TR:nth-child(even)	{ background: #2A2A2A; }
TABLE.TblList TBODY TR:nth-child(odd)	{ background: #181818; }
TABLE.TblList TBODY TD	{ padding: 5px 10px; }
TABLE.TblList TBODY TH	{ border-left: 1px solid #4C4C4C; vertical-align: bottom; }
TABLE.TblList TBODY TH IMG { height: 22px; }

/*************************************************************************************************/
/* /Programs/ */
#Progs DIV.Body		{ color: #CCC; }
#Progs DIV.Body H3	{ clear: both; }
/* #Progs DIV.Body H3	{ font: 300 18pt Oswald; clear: both; border-top: 1px solid var(--ColorDiv); } */

DIV.ProgramHost	{ float: right; max-width: 150px; text-align: center; margin-left: 10px; }
DIV.ProgramHost IMG	{ display: block; width: 100%; margin-bottom: 10px; }

#Progs .Recent		{ text-align: center; max-height: 188px; overflow: hidden; }
#Progs .Recent IMG	{ width: 75px; height: 75px; margin: 8px; display: inline-block; }

#Progs Table.pla		{ width: 100%; }
#Progs Table.pla TR.Odd { background: #212121; }
#Progs Table.pla TD.Pad { background: #282828; }

P.Rss		{ font-size: 12pt; }
P.Rss IMG	{ width: 16px; height: 16px; border-width: 0px; margin: 0px 5px 0px 38px; vertical-align: text-top; }

/*************************************************************************************************/
/* Footer */

FOOTER			{ background-color: #111111; padding: 0px 0px; border-top: 1px solid var(--ColorDiv); }
FOOTER UL		{ display: flex; list-style: none; padding: 0px 15px; margin: 55px auto 20px auto;
				  justify-content: space-between; gap: 10px 30px; }
FOOTER H4		{ font: 23px 'PT Sans',sans-serif; margin: 0px 0px 25px 0px; }
FOOTER LI		{ margin: 0px; font: 12pt 'PT Sans',sans-serif; flex-grow: 1; width: 28%; }
FOOTER LI A		{ display: block; font: 12pt 'PT Sans',sans-serif; color: #FFF;
				  border-bottom: 1px solid #363636; padding: 10px 5px 10px 0px; }
FOOTER LI:first-child A::before		{ content: "\f101"; font: 10pt FontAwesome; padding-right: 5px; color: #AAA; }
			/*	{ content: "> "; font-size: 10pt; padding-right: 5px; color: #AAA;}	*/

FOOTER .Apps	{ margin-bottom: 20px; padding-bottom: 10px; border-bottom: 1px solid #363636; text-align: left; }
FOOTER .Apps IMG{ vertical-align: middle; display: inline-block; margin: 10px 20px 10px 0px; height: 40px; }
FOOTER .Apps A	{ border-width: 0px; padding: 0px; }
FOOTER .Apps A::before { content: ""; }

FOOTER SPAN A	{ display: inline-block; border-width: 0px; }
FOOTER LI #FB, FOOTER #TW, FOOTER #IG, FOOTER #YT
				{ font: 30pt FontAwesome; margin: 5px 25px 25px 0px; color: #FFF; line-height: 5px; }
FOOTER #FB::before	{ content: "\f082"; }
FOOTER #TW::before	{ content: "\f081"; }
FOOTER #IG::before	{ content: "\f16D"; }
FOOTER #YT::before	{ content: "\f166"; }

FOOTER UL LI:nth-of-type(3)		{ line-height: 16pt; color: #CCC; font: 12pt 'PT Sans',sans-serif; }
FOOTER UL LI:nth-of-type(3) H4	{ color: #FFF; }
FOOTER UL LI:nth-of-type(3) A	{ line-height: 29pt; display: inline-block; border-width: 0px; padding: 0px; }
FOOTER UL LI:nth-of-type(3) A:first-child { margin-top: 25px; }
FOOTER UL LI:nth-of-type(3) A::before	{ content: "\f095"; font: 14pt FontAwesome; padding-right: 10px; color: #AAA; }
FOOTER UL LI:nth-of-type(3) .Email::before	{ content: "\f003"; }
FOOTER UL LI:nth-of-type(3) .Cont::before	{ content: "\f040"; }
FOOTER ADDRESS	{ font-style: normal; margin-bottom: 10px; }

FOOTER A		{ text-decoration: none; transition: 300ms; }
FOOTER #FB:hover, FOOTER #TW:hover, FOOTER #IG:hover, FOOTER #YT:hover,
FOOTER LI A:hover	{ color: var(--LinkHover); }

FOOTER ARTICLE	{ border-top: 1px solid #363636; padding: 10px; color: #CCC; }
FOOTER ARTICLE .Credit { text-align: center; font-size: 13pt; font-style: normal; } /* The 13.3px margin matches the default top margin of P's */
FOOTER ARTICLE .Credit IMG { width: 200px; background-color: #FFF; }
#Cr1	{ float: right; margin-top: 5.3px; }
#Cr2	{ margin: 20px 15px; }
FOOTER ARTICLE U { display: block; text-align: center; font-size: 12pt; text-decoration: none; }
FOOTER ARTICLE U IMG { width: 120px; }
FOOTER ARTICLE, FOOTER ARTICLE P
				{ font-size: 10pt; }

FOOTER SECTION	{ height: 54px; background-color: #282828;
				  color: #777; font: 11pt 'PT Sans',sans-serif;
				  display: flex; justify-content: center; align-items: center; }

/*************************************************************************************************/
/* Speakeasy */

DIV.Head H6				{ text-align: right; padding-top: 5px; margin: 0px; font: 13.5pt 'PT Sans',sans-serif; }
DIV.Head H6 B			{ color: #FFD7FF; font-weight: 400; }
DIV.Head H6 B::before,
DIV.Head H6 A::before	{ font: 14pt FontAwesome; padding: 0px 10px; color: #AAA; }
DIV.Head H6 B::before	{ content: "\f007"; color: #99CBFF; }
DIV.Head H6 A::before	{ content: "\f08B"; color: #FF6060; padding-right: 0px; }
DIV.Head H6 #in::before	{ content: "\f090"; color: #00FF00; padding-right: 10px; }
DIV.Head H6 A			{ text-decoration: none; }
DIV.Head H6 A:Hover		{ text-decoration: underline; }

/*************************************************************************************************/
/* Login Page */

DIV.LoginNote	{ margin-bottom: 30px; }
DIV.LoginNote B	{ font-weight: normal; color: #FFF; }
DIV.LoginPage	{ display: flex; justify-content: space-between; }
DIV.LoginBlock	{ flex-grow: 1; }

TABLE.Login		{ border: 1px solid #4C4C4C; xmax-width: 420px; text-align: left;
					background-color: #212121; border-collapse: collapse; }
TABLE.Login THEAD TH	{ font: 15pt Monda,sans-serif; background: linear-gradient(to bottom, #606060, #404040);
		margin: 0px 0px 15px 0px; text-align: center; text-shadow: 1px 1px black; }

TABLE.Login TBODY TH	{ color: #CCC; padding: 10px 5px 0px 15px; width: 50%; }
TABLE.Login TBODY TD	{ color: #CCC; padding: 10px 15px 0px 5px; width: 50%; }
TABLE.Login TBODY TH,
TABLE.Login TBODY INPUT	{ font: 14pt 'PT Sans',sans-serif; }
TABLE.Login TBODY INPUT	{ background-color: #FFF; width: 100%; }
TABLE.Login TFOOT INPUT	{ background: linear-gradient(to bottom, #DDD, #999); padding: 0px 10px;
		text-shadow: 1px 1px 0px #CCC; color: #000; border-radius: 2px; font: 14pt Monda,sans-serif;
		display: block; margin: 10px auto; text-decoration: none; cursor: pointer; width: auto; }

TABLE.Login INPUT[TYPE=CHECKBOX] { zoom: 1.7; display: inline-block; margin: 3px 7px 7px 3px; }

TABLE.Login TFOOT TD	{ text-align: center; font-size: 12pt; padding: 10px 10px 15px; }
TABLE.Login TFOOT TD P	{ margin-block: 0px; padding-left: 40px; text-indent: -40px; text-align: left; font-size: 14pt; color: #CCC; }
TABLE.Login TFOOT TH P	{ margin: 20px 15px; }
FORM.Signup S			{ text-decoration: none; color: #FF0000; }
FORM.Signup I			{ font-style: normal; color: #00FF00; }

DIV.LoginPage SMALL	{ border: 1px solid #CCC; font-size: 14pt; background-color: #006799; color: #FFF;
	margin: 30px 0px; padding: 20px; display: block; text-align: center;  }
DIV.LoginPage SMALL A	{ white-space: nowrap; }

DIV.LoginPhoto		{ margin-left: 30px; }
DIV.LoginPhoto IMG	{ display: block; width: 100%; max-width: 640px; margin-bottom: 10px; }
DIV.LoginPhoto P	{ margin: 0px 0px 5px; padding: 0px; font-size: 10pt; text-align: right; }
P.InMsg,
P.ErMsg,
P.OkMsg { border: 1px solid #FFF; color: #FFF; background-color: #A00000; padding: 20px 15px; }
P.ErMsg { background-color: #A00000; }
P.OkMsg { background-color: #00A000; }
P.InMsg { background-color: #FF00FF; }
P.InMsg A:Hover,
P.InMsg A { color: #00FFFF; }


DIV.g-recaptcha			{ text-align: center; padding: 10px 0px 0px; }
DIV.g-recaptcha > DIV	{ display: inline-block; }


/*************************************************************************************************/
/* Message Box */
#MsgBoxID-Overlay { background-color:#000000; }

#MsgBoxID { border: 1px solid #4C4C4C; min-height: 180px; width: 420px; text-align: right;
	display: flex; flex-direction: column; justify-content: space-between; background-color: #212121; }
#MsgBoxID I { font: 15pt Monda,sans-serif; background: linear-gradient(to bottom, #606060, #404040);
	margin: 0px; padding: 0px 0px 0px 28px; text-align: right; display: flex; }
#MsgBoxID I B { width: 100%; text-align: center; display: inline-block; font-weight: 400; text-shadow: 1px 1px black; }
#MsgBoxID I A { display: inline-block; cursor: pointer; border-radius: 4px;
	width: 18px; height: 18px; position: relative; right:10px; top:7px; border: 1px solid #AA002B;
	background: radial-gradient(farthest-corner at 6px 3px, #ff9292 19%, #A00000 60%);
	border-color: #DB0E39 #AA002B #A0002D #D90431; }
#MsgBoxID I S { display: block; background: url(/images/2022/x16.svg) no-repeat;
	width: 16px; height: 16px; border: 0px; }
#MsgBoxID I A:hover { border: 1px solid #00DD00;
	background: radial-gradient(farthest-corner at 6px 3px, #90C090 19%, #008000 60%); }
#MsgBoxID P { margin: 0px; padding: 10px; text-align: left; }
#MsgBoxID U { display: block; text-decoration: none; margin: 10px 8px 10px 10px; }
#MsgBoxID U B,
#MsgBoxID U S { background: linear-gradient(to bottom, #DDD, #999); text-shadow: 1px 1px 0px #CCC;
	color: #000; padding: 0px 10px; border-radius: 2px; font: 14pt Monda,sans-serif;
	display: inline; margin: 0px 5px 10px; text-decoration: none; cursor: pointer; }
/*************************************************************************************************/
/* Common Elements */

.YouTube	{ aspect-ratio: 16 / 9; width: 100%; height: auto; } /* 8/31/2023 11:38AM */

.GrnBox		{ background-color: #CCFFCC; padding: 20px; border: 1px solid #FFF; color: #000; }
.c			{ text-align: center; }
/*************************************************************************************************/
/* Programs Section */
@media screen and (min-width: 1625px) {
	DIV.Progs H3	{ width: 1625px; }
}
@media screen and (min-width: 1223px) and (max-width: 1624px)  {
	DIV.Progs H3	{ width: 1222px; }
}
@media screen and (min-width: 821px) and (max-width: 1222px)  {
	DIV.Progs H3	{ width: 821px; }
}
@media screen and (min-width: 1px) and (max-width: 820px)  {
	DIV.Progs H3	{ width: 100%; text-align: center; }
}


/************************************************************************/
/* Column doesn't gives a padding on the sides, but it doesn't align to the center neither */
DIV.Recent2 DIV { column-gap: 20px; column-width: 160px; column-count: 8; }
@media (max-width: 1240px) { DIV.Recent2 DIV { column-count: 7; }}
@media (max-width: 1060px) { DIV.Recent2 DIV { column-count: 6; }}
@media (max-width: 880px)  { DIV.Recent2 DIV { column-count: 5; }}
@media (max-width: 700px)  { DIV.Recent2 DIV { column-count: 4; }}
@media (max-width: 520px)  { DIV.Recent2 DIV { column-count: 3; }}
@media (max-width: 340px)  { DIV.Recent2 DIV { column-count: 2; }}
/************************************************************************/

@media (min-width: 1195px) {
	DIV.Head TABLE	{ width: 374px; }
	#Air			{ margin-right: 15px; }
}
@media (max-width: 1194px) {
	DIV.Head TABLE	{ width: 374px; }
	#Air			{ margin-right: 15px; }
	#Top TBODY TD,
	#Top TBODY TH	{ height: 178px; } /* 178(original design)-23(tfoot.td)-20(tfoot.margin)=135 */
	DIV.Head #Big	{ width: 185px; }
}
@media (min-width: 580px) and (max-width: 919px) {
	FOOTER UL LI:nth-of-type(3) A.Tel	{ line-height: inherit; display: block; margin-top: 20px; }
	FOOTER UL LI:nth-of-type(3) A.Tel:first-child	{ margin-top: 0px; }
	FOOTER UL LI:nth-of-type(3) A.Email	{ margin-top: 15px; }
}
@media (min-width: 860px) {
	DIV.Dimm, DIV.Burger, A.Menu { display: none; }
	NAV	{ display: block; }

	#TopMenu	{ /* flex-grow: 4; text-align: right; */ }
	/* Define SubMenu first, with .TopMnu; then define overwrite #Sub0 with defaults */

/*
	#TopMenu A	{ display: inline-block; color: #FFF; text-decoration: none;
				  font: 14pt Monda,sans-serif; padding: 0px 10px; } */

	DIV.TopMnu	{ display: none; background-color: #444; border: 1px solid #000;
		box-shadow: 6px 6px 12px 0px rgb(0 0 0 / 75%); font: 15pt/23pt Monda,sans-serif;
	    margin: 0px 5px; max-height: calc(100vh - 100px); max-width: 400px;
	    overflow-y: auto; overflow: visible; overscroll-behavior: contain; padding: 0px 15px;
	    position: absolute; z-index: 2;
	}
	DIV.TopMnu A	{ display: block; margin: 7px 1px; padding-bottom: 5px;
					  border-bottom: 1px solid #AAA; text-decoration: none; }
	DIV.TopMnu A:last-child	{ border-bottom: 0px; }

	/* Now, overwrite the root menu with the defaults */
	#Sub0	{ display: block; background-color: transparent; border-width: 0px;
		box-shadow: none; font: 14pt Monda,sans-serif;
	    left: auto; margin: 0px; max-height: none; max-width: none;
	    overflow-y: visible; overflow: visible; overscroll-behavior: auto; padding: 0px;
	    position: static; top: auto; z-index: auto; text-align: center;
		opacity: 1;
	}

	#Sub0 A	{ display: inline-block; padding: 0px 10px; text-decoration: none;
			  font: 14pt Monda,sans-serif; border-width: 0px; }
}
@media (max-width: 859px) {
	HEADER DIV	{ display: block; text-align: center; align-items: normal; flex-direction: unset; }
	HEADER IMG	{ margin: 3px auto 0px auto; }
	NAV,
	HEADER UL	{ display: none; }
	/**********************************************************/
	/* Burger Button */
	A.Menu			{ display: block; position: absolute; top: 27px; left: 10px;
		width: 28px; margin: 5px; padding: 5px 0px; border: 3px solid #FFF;
		border-width: 3px 0px; }

	A.Menu B	{ display: block; width: 100%; height: 3px; background-color: #FFF; }


	/**********************************************************/
	/* Cover Gray-out Layer */
	DIV.Dimm	{ display: none; position: fixed; background-color: #FFF; z-index: 1;
			  	  top: 179px; left: 0px; height: calc(100vh - 113px); width: 100vw; opacity: 0.3; }

	/*	NAV	6/6/2022 9:45PM	*/
	DIV.TopMnu { display: none; background-color: #444; border: 1px solid #000;
		box-shadow: 6px 6px 12px 0px rgb(0 0 0 / 75%); font: 15pt/23pt Monda,sans-serif;
	    margin: 0px 5px; max-height: calc(100vh - 100px); max-width: 400px;
	    overflow-y: auto; overflow: visible; overscroll-behavior: contain; padding: 0px;
	    position: absolute; z-index: 2; top: 62px; left: -5px;

		margin: 70px 0px 0px 48px; /* Offset to the right-bottom */
	}
	#Sub0	{ margin: 0px 5px; } /* Compensate right-bottom offset */
	DIV.TopMnu IMG		{ float: right; }
	NAV A				{ display: block; margin: 7px 10px; padding-bottom: 5px; color: #FFF;
						  border-bottom: 1px solid #AAA; text-decoration: none; }
	NAV A:last-child	{ border-bottom: 0px; }

	/**********************************************************/
	/* Big Buttons */
	DIV.Head #Top	{ flex-wrap: wrap; }
	DIV.Head TABLE	{ width: 49%; }
	DIV.Head #Big	{ width: 100%; text-align: center; margin-top: 40px; }
	DIV.Head #Big A:first-child	{ margin-left: 0px; }

}
@media (max-width: 360px), (min-width: 680px) and (max-width: 859px) {
	/**********************************************************/
	/* Login Table */
	TABLE.Login THEAD, TABLE.Login TBODY, TABLE.Login TFOOT,
	TABLE.Login TR, TABLE.Login TD, TABLE.Login TH,
	TABLE.Login TBODY TD, TABLE.Login TBODY TH,
	TABLE.Login { display: block; width: 100%; }
	TABLE.Login TBODY TD, TABLE.Login TBODY TH	{ padding: 10px 5px 0px 5px; }
	TABLE.Login TFOOT TH	{ padding-top: 10px; }
	TABLE.Login INPUT[TYPE=CHECKBOX] { margin-left: 0px; }
}
@media (max-width: 679px) {
	DIV.LoginPage	{ flex-direction: column; }
	DIV.LoginBlock	{ align-self: center; }
	DIV.LoginPhoto	{ margin-left: 0px; }
}

@media (min-width: 820px) { #Cr2 { display: none; } }
@media (max-width: 819px) { #Cr1 { display: none; } }

@media (max-width: 805px) {
	DIV.Head TABLE	{ width: 48%; }
}

@media (max-width: 619px) {
	DIV.Recent IMG	{ width: 120px; height: 120px; }
}

@media (max-width: 599px) {
DIV.Head #Top	{ justify-content: center; }
	DIV.Head TABLE	{ width: 80%; max-width: none; }
	#Air { margin-bottom: 20px; margin-right: 0px; }
	FOOTER UL LI	{ display: block; }
}
@media (max-width: 579px) {
	FOOTER			{ border-top-color: #111; }
	FOOTER UL		{ display: block; margin-top: 0px; }
	FOOTER UL LI	{ display: block; width: 100%; }
	FOOTER LI A:last-child	{ border-width: 0px; }
	FOOTER UL LI H4	{ margin-top: 50px; border-top: 1px solid var(--ColorDiv); padding-top: 5px; }
	FOOTER .Apps	{ border-bottom: 0px; }
	FOOTER .Apps A	{ display: inline-block ; }
	FOOTER .Apps A:nth-child(2)	{ margin-left: 20px; }
	FOOTER .Apps IMG{ margin-right: 7px; }
}
@media (max-width: 499px) {
	DIV.Recent IMG	{ width: 96px; height: 96px; margin: 0px 15px 15px 0px; }
}
@media (max-width: 480px) {
	DIV.Head TABLE	{ width: 100%; }
}
@media (max-width: 435px) {
	HEADER IMG	{ margin-right: 0px; width: 80%; max-width: 264px; }
	A.CityTimes IMG.CityTimesSmall	{ display: block; }
	A.CityTimes IMG.CityTimesBig	{ display: none; }
}
@media (max-width: 419px) {
	DIV.Head #Big A:first-child,
	DIV.Head #Big A	{ margin: 0px auto 15px auto; display: block; }
}
@media (max-width: 409px) {
	DIV.Recent A.Grp2	{ display: none; }
}
@media (max-width: 370px) {
	FOOTER .Apps A	{ display: block ; }
	FOOTER .Apps A:nth-child(2)	{ margin-left: 0px; }
	FOOTER .Apps IMG{ margin-right: 20px; height: 48px; }
}
@media (max-width: 359px) {
	DIV.News P IMG	{ display: block; width: 80%; margin: 0px auto 10px auto; float: none; }
}
@media (max-width: 320px) {
	HEADER DIV	{ text-align: right; }
	A.CityTimes	{ padding: 5px 3px; }
}
@media (max-width: 299px) {
	DIV.Recent A.Grp1	{ display: none; }
	DIV.Recent IMG		{ margin: 0px 9px 10px 9px; }
}
@media (max-width: 840px), handheld and (orientation: landscape) {
	/* #id846 { width: 100%; } */
}

/************************************************************************/

HEADER IMG.z {  width: 80%; }

/*
#Air, #Now, #Big	{ column-gap: 5px; }
.z #Big A { column-width: 200px; }
@media (max-width: 1960px) {
	#Air, #Now, #Big	{ column-count: 3; }
}
*/

.cap3	{ opacity: 0.1; }
.cap3, cap4		{ font: 800 26pt 'Open Sans'; color: red; position:absolute;
	bottom:40%; transition:bottom 1.3s, opacity 1s; }