/*
	Breakpoints:
	default = small
	37.5rem = 600px (medium)
	48rem = 768px	(large)
	90rem = 1440px	(xl)
*/

:root {
	--mu-color-primary: #212042; /* #446; */
	--mu-color-primary-accent: #67C;
	--mu-color-primary-alt: #113;

	--mu-color-secondary: #212021;
	--mu-color-secondary-accent: #333;
	--mu-color-secondary-alt: #111;
	
	--mu-color-tertiary: #FFF;
    --mu-color-tertiary-accent: #FED;
    --mu-color-tertiary-alt: #DDD;

	--mu-color-text: #AAF;
	--mu-color-text-alt: #999;

	--mu-color-link: var(--mu-color-tertiary);
	--mu-color-link-visited: var(--mu-color-tertiary-alt);
	--mu-color-link-hover: var(--mu-color-tertiary-accent);
	--mu-color-focus-outline: var(--mu-color-primary-accent);

	--mu-color-inactive: #600;

    --mu-color-bg: #111;
    --mu-body-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    /* Serif
        --body-font: 'Merriweather Web', 'Georgia', 'Cambria', 'Times', 'Apple color emoji', 'Segoe UI Emoji', 'Segoe Ui Symbol', serif;
       Mono
        --mono-font: ui-monospace, SFMono-Regular, Consolas, 'Liberation Mono',	Menlo, monospace;
    */

    --mu-scroll-padding: 0; /* Reminder to set if you use a sticky menu/header */
    --mu-responsive-spacing-outer: .5rem;
	--mu-responsive-spacing-inner: .25rem;

	--mu-border-radius-sm: 3px;
	--mu-border-radius-lg: 5px;
}

@media (min-width: 48em){
	:root {
		--mu-responsive-spacing-outer: 1rem;
		--mu-responsive-spacing-inner: .5rem;
	}
}	
@media (min-width: 80em){
	:root {
		--mu-responsive-spacing-outer: 2rem;
	}
}	


/*
	RESET STYLES
	Based on Eric Meyer's "reset.css" per
	http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
	with minor additions by Doug Gibson (dgibson.net)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin:0;
	padding:0;
	border:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}
html{font-size:100%}
/* html{overflow:scroll} */ /* Force scroll bar to stop jumping */
body{line-height:1.0;color:black;background:white}
ol,ul{list-style:none}

/* only way to remove the border from fieldset in Opera 7 */
fieldset{border:solid 0 transparent}

/* remember to highlight inserts somehow! */
ins{text-decoration:none}
del{text-decoration:line-through}

/* tables still need 'cellspacing="0"' in the markup if desired */
table{border-collapse:collapse;border-spacing:0;}
caption,th,td{text-align:left;font-weight:normal}

blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}




/*	Metalunderground.com CSS
		
	Filtered for: screen,projector
	
	Layout Type: Fixed 960px wide
	
	Primary foreground color: 
	Secondary foreground color:
	Primary background color: #FFFFFF
	Secondary background color: #02203A
	
	Remember:
		Don't rely on browser defaults - set styles explicitly
	
	Organization:
		
		General HTML Tag styles
			Reset browser differences
			General styles
		CSS Layout/page structure
		Template-level elements
		Other reusable components (paging, etc)
		Misc elements
		Generic formatting classes
		Add-ons (Script dependencies)
		Hacks
*/



/*	
*************************
GENERAL HTML TAG STYLES
*************************
*/

html,body{height:100%}
body{background:#111 url(images/background_metal_black3.gif) fixed;text-align:center}
/* background:#111 url(images/background_main_vertical2.gif) top center repeat-y */

/* Define base fonts here (include all elements that do not inherit well) */
body{
	color:#AAF;
	font:.875rem/1.0 Tahoma,"Trebuchet MS",Trebuchet,Arial,Helvetica,Verdana,sans-serif
}
td,.normal{font:1em/1.0 Tahoma,"Trebuchet MS",Trebuchet,Arial,Helvetica,Verdana,sans-serif}
/* color:#97AAFF */

/* Easy Toggle for testing */
pokpkp *{border:dashed 0px #F00}


/* Clear some elements as a rule */
pre,blockquote{clear:left}

/* Headings */
h1,h2,h3,h4,h5,h6{color:#FFF;font-weight:bold;line-height:1.2}
h2{margin-bottom:.2em;font-size:2em}
h3{font-size:1.6em}
h3.headline{font-size:1.7em}
h4,h5,h6{font-size:1.0em}
h4{color:#999}
.seperator,.divider{border-bottom:solid 1px #605858;margin-bottom:5px}



/* Links */
a, a:link {
	color: var(--mu-color-link);
	text-decoration: underline;
	text-decoration-skip-ink: all;
	text-underline-offset: 2px;
	text-decoration-color: var(--mu-color-text);
}
/*
a:visited {
	color:var(--mu-color-link-visited);
}
*/
a:hover,
a:focus	{
	color: var(--mu-color-link);
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-decoration-color: var(--mu-color-tertiary-alt);
}
a:active {
	color:#67C;
	text-decoration:underline;
}

.normal a{text-decoration:none}
/*a[rel=external]{padding-right:14px;background:transparent url(images/icon_external_12x12.gif) right no-repeat}*/

/* More HTML Elements */
abbr,acronym,.abbr,.help{border-bottom:1px dotted #666;cursor:help}
code,pre{color:#333;font-family:Courier,"Courier New",monospace}
blockquote,blockquote p,.blockquote{color:#999}
strong,.strong{font-weight:bold}
em,.em{font-style:italic}
del,.del{text-decoration:line-through}
ins,.ins{font-style:italic}


/* Form Elements */
form{text-align:left}
input,select,option,textarea,button{
	color:#CCC;
	background-color:#212021;
	font-family:Tahoma,Arial,Helvetica,sans-serif;
	min-height: 1.25rem;
}
input,textarea,select,button{
	border: solid 1px #666;
	border-radius: 3px;
	min-height: 2rem;
	padding: 0 .25rem;
}
textarea{
	padding: .25rem;
}
input[type=text]:not([size]),
input[type=password]:not([size]),
input[type=file]:not([size]),
textarea:not([col]) {
	width: 100%;
}

/* background:#333 url(images/topleft_shadow2.gif) top left no-repeat */
input:hover,
select:hover,
textarea:hover,
.button:hover {
	border-color: #DDD;
}
/* select option:hover{outline:#F00 dotted 1px} */
input:focus,
select:focus,
textarea:focus,
button:focus,
.button:focus {
	border-color: #AAA;
	outline: solid 2px var(--mu-color-focus-outline);
}
textarea{font-size:1em} /* Firefox inheritance fix */

/* Checkbox and Radios */
input[type=checkbox],
input[type=radio] {
	min-height: auto;
	height: 1rem;
	width: 1rem;
	padding: 0;
	vertical-align: text-bottom;
	accent-color: var(--mu-color-primary-accent);
}
input.checkbox, input.radio{background:#000 none;border:none 0 #000}
input[type=checkbox], input[type=radio]{background:#000 none;border:none 0 #000}

/* Button Styles (doubles for links as well) */
button,.button{
	color:#CCC;
	/*background:#C0C0C0 url(images/button_grad_grey.gif) top repeat-x;*/
	background: linear-gradient(#333, #111);
	padding:0 .5em;
	line-height: 1;
	font-weight: 600;
	font-family: Arial,Helvetica,sans-serif;
	cursor:pointer;
}
button:hover,
.button:hover
button:focus,
.button:focus {
	color:#FFF
}

/* Tweak for links */
a.button{padding:.1em .5em;text-decoration:none}

/*.button:hover{border-color: #999;color:#FFF;background-color:#C0C0C0}*/

/* Mozilla doesn't render disabled form elements like IE (there is no way to tell it's disabled in NS6+), so this CSS2 trick makes it close to the same */
input[disabled],
select[disabled],
select[disabled] option,
textarea[disabled],
.disabled.button{
	background-color:#CCC;
	color:#808080;
	cursor:not-allowed
}

/* Special override styles for specific input types */
/*
input.text,input.password{width:150px}
.long.text,textarea{width:350px}
*/
textarea.short{height:2.5em}
textarea.longtext{
	min-height:15em;
}

.cancellink{padding-left:2em;text-decoration:underline !important}


/* Fieldset Styles */
/*
fieldset,.fieldset{padding:5px 15px;border:solid 1px #333}
legend{color:#999;padding:0 .5em;font-size:1em;font-weight:bold}
*/
/* General Label Styles */
label,.label,fieldset dt{color:#CCC;font-weight:600}
label{cursor:hand;cursor:pointer}
label em{font-weight:normal;font-size:.9em}


/* Form structure and layout */
fieldset{display:block; width:100%}
/* fieldset{display:inline-table;position:relative;margin:1em 0 0 0;padding:0;clear:both}*/
legend{color:#999;margin-left:1em;font-weight:bold}
fieldset ol,fieldset dl{display:block;padding:.5em 1em 0 0;list-style:none;} /* display:inline-table;??? */
fieldset li{padding-bottom:0;padding-bottom:1em !important}
fieldset dt,fieldset dd{padding-bottom:0;padding-bottom:1em !important}
fieldset dd{color:#CCC}
fieldset li label,.label,fieldset dt{display:block;}
fieldset.submit{border-style:none;background-color:transparent;background-image:none}
fieldset li p{position:relative;margin:0;padding:0;}


/* Continue the floating madness */

fieldset ol li{width:100%}
fieldset{background:#000;background-image:none;background-repeat:repeat-x;border:0 solid #333}
fieldset legend{margin-bottom:1em;padding:0 .2em}

fieldset{padding:0 0 1em 0;border-style:none;border-top:1px solid #999}
fieldset.submit{background-color:#000;padding-top:0em}

/* Handle Nested Fieldsets */
fieldset fieldset{margin:1.5em 0 -2.5em 0;padding-left:0;border-style:none;background-color:transparent;background-image:none}
fieldset fieldset legend{margin-left:0;padding:0;font-weight:normal}
fieldset fieldset ol{position:relative;top:-1.5em;margin:0;padding:0}
fieldset fieldset label{display:inline;width:auto;margin-right:auto}


/* TEMP Basic Form Styles */
/*
fieldset legend{margin-bottom:2em}
fieldset label{display:block;float:left;width:8em;margin-right:1em;margin-bottom:1em;line-height:1.5em}
fieldset br{clear:both;margin:1em;padding:1em}
*/

/* Table Styles */
table{width:100%;border:solid 1px #333;border-collapse:collapse}
/* table.scrollable{_height:10em;_overflow-y:scroll}*/
caption{display:none;text-align:left;font-weight:bold}
thead th{background-color:#333;color:#FFF;vertical-align:bottom;border-bottom:solid 2px #555}
tbody th{color:#999;border-right:solid 2px #555}
th{font-weight:bold}
td,th{position:relative;text-align:left;margin:0px;padding:3px;border:none}
td{color:inherit;vertical-align:top;border-bottom:solid 1px #333}
/*thead+tbody tr:hover{background-color:#333}*/
thead+tbody tr:hover{background-color:#333}


col.sorted{background-color:#FFA ! important}

.greybar,.graybar{background-color:#212021} /* Deprecate */

tbody tr:nth-child(2n) {
	background-color:#212021;
}

tbody tr.inactiverecord{color:#999;background-color:#600}
p .inactiverecord{color:#600;background-color:#600;border:solid 1px #999}



/* Miscellaneous Elements */
img{border-style:none;border-width:0px}/*background-image:url(images/waiting_status_white.gif) center center no-repeat;*/
hr{height:1px;color:#67A;}
div.hr{height:2px;background-color:#222;margin:.5em 0;}
div.hr.double{margin:1.5em 0}
div.hr hr{display:none}

/* Responsive */
img,picture,svg,
video,object,embed,iframe{max-width:100%}





/*	
*************************
CSS LAYOUT
*************************
*/

/* Main Page Layout */
#pagewrapper{
	position:relative;
	display: flex;
	flex-direction: column;
	text-align:center;
	/*background-image:url(images/background_main_vertical2d.gif);*/
	background-position:center top;
	background-repeat:repeat-y;
	min-height: 100vh;
}
/*
#pagewrapper2{position:relative;text-align:center;background-image:url(images/background_base_tile4h.gif);background-position:center top;background-repeat:no-repeat}
#pagewrapper3{position:relative;text-align:center}
*/

#pagecontainer{
	position:relative;
	flex-grow: 1;
	flex-shrink: 0;
	flex-basis: 100%;
	width: 100%;
	max-width: 960px;
	/*margin:0 auto;*/
	text-align:left;
	background-color: black;
}

/* Only show the random background image > 768px */
@media (min-width: 48em) {
	#pagecontainer{
		background-image:url(images/masthead/randimg.cfm);
		background-position:right 80px;
		background-repeat:no-repeat;
		margin: 0 auto;
	}
	#footer {
		margin: 0 auto;
	}
}



#main-leaderboard{padding:1rem 0;text-align:left;vertical-align:middle}
#main-leaderboard img{display: block; margin:auto;}

#masthead{position:relative;
	width:100%;
	max-width:100%;
	margin-bottom: 1rem;
}
#masthead h1{
	display:block;
	max-width:100%;
	max-height:75px;
	__background-image:url(images/metalundergroundcom_logo2.gif);
}
#masthead img {
	height: auto;
}

#masthead p{margin:0;color:#999;text-indent: var(--mu-responsive-spacing-outer)}

#primarynav{
	position:relative;
	width:100%;
	max-width:100%;
	overflow: hidden;
}



/* #main{padding:10px} */
#main{
	position:relative;
	height:100%;
}

@media (min-width: 48em) {
	#main{
		display: flex;
		flex-wrap: nowrap;
		align-items: stretch;
	}
}


/* Main Page Layout */

#content{
	position:relative;
	flex-basis: 600px;
	flex-shrink: 1;
	flex-grow: 1;
	text-align:center
}

#sidebar:empty {
	display:none;
}

#sidebar:not(:empty){
	position:relative;
	flex-basis:300px;
	flex-shrink: 1;
	flex-grow: 1;
	text-align:center;
	background-color: #111;
}

#footer{
	color:#999;
	width:100%;
	max-width:960px;
	background-color: var(--mu-color-primary-alt);
}
#footercontainer{
	max-width:960px;
	text-align:center;
	margin:0 auto
}

/* ???
body.iframe{background:#000 none}
body.iframe #main{width:100%}
body.iframe #content{width:100%;padding:20px 0}
*/

/*	
*************************
SITE-WIDE TEMPLATE STYLES
*************************
*/

#primarynav ul{
	position:relative;
	display:flex;
	align-items: stretch;
	justify-content: start;
	min-height: 3.215rem;
	background-color:rgba(33, 32, 33, 0.7);
}

#primarynav ul li{display:flex;align-items:center;flex-shrink:1;}
#primarynav ul li:hover{background-color:#333}
#primarynav ul li a {
	position: relative;
	display: block;
	padding: 1em;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
}

#primarynav svg.icon {
	fill: #DDD;
	width: 2em;
	height: auto;
	vertical-align: top;
}

#primarynav li a span {
	display: none;
}


#userinfo p{margin:0;padding:.3em 1em;text-align:right;font-weight:bold;font-size:.8em}

a#skip{display:block;position:absolute;top:0;left:-10000em;z-index:2;width:20em;padding:4px 0 1em 0;background:transparent;font-weight:bold;text-align:center}
a#skip:link,a#skip:visited{color:#FFF}

/* Restyle some elements within the main content areas */
#main p,#main li,#main blockquote,#main td, #main th{font-size:1em;line-height:1.55}
#main p,#main pre,#main blockquote{margin-bottom:.8em}
#main p,#main ul,#main ol,#main li,#main dl,#main dt,#main dd,#main pre,#main blockquote,
#main h1,#main h2,#main h3,#main h4,#main h5,#main h6{text-align:left}

#content,
#sidebar {padding:var(--mu-responsive-spacing-inner)}

ol.numbered{color:#999;margin-bottom:1em}
ol.numbered li{margin-left: 1.5rem;list-style-type:decimal}
ul.bulleted{color:#999;margin-bottom:1em}
ul.bulleted li{margin-left:40px;list-style-type:disc}
ul.bulleted li ul li{list-style-type:square}

#sidebar{color:#999}
#sidebar h3{margin:0 0 .3em 0;font-size:1.5em}
#sidebar .relatedbands,#sidebar .relatedreviews{position:relative;}
#sidebar .bandinfo,#sidebar .reviewinfo{position:relative;border-bottom:dotted 1px #333;padding:.5em 5px}
#sidebar .bandinfo img,#sidebar .reviewinfo img{float:left;margin:0 5px}
#sidebar .bandinfo h4,#sidebar .reviewinfo h4,
#sidebar .bandinfo p,#sidebar .reviewinfo p,
#sidebar .bandinfo ul,#sidebar .reviewinfo ul{padding-left:75px}
/*#sidebar .bandinfo li{margin-left:0}*/
#sidebar td,#sidebar li{font-size:.9em}

#sidebar table {margin-bottom: 1rem}

#footer{font-size:1em;line-height:1.4;text-align:center}
#footer span{padding-right:.5em}
#footer #about{width:350px;float:left;margin:0;padding:5px 10px;line-height:1.4em;font-size:.85em}
#footer #footerinfo{width:150px;float:right;margin:0;padding:5px 10px;line-height:1.4em;font-size:.85em}
#footer #appversion,#footer #copyright{display:block}

#footer #copyrightinfo{	padding: 1rem;text-align:left;font-size:.8em}
#footer #standardslinks{padding-left:.2rem .5rem;border-left:solid 1px #999}


#footer #footernav{
	position:relative;
	display: flex;
	flex-wrap: wrap;
	justify-content:flex-start;
	gap: 1rem;
	width: 100%;
	max-width:960px;
	padding: 1rem; 
	background-color: var(--mu-color-primary);
	border-top: 1px solid var(--mu-color-primary-accent);
}
#footer #footernav ul.nav{position:relative;float:left;width:137px;text-align:left}
#footer li{font-weight:bold}
#footer li li{margin-left:.5em;font-weight:normal}

#footernav a {
	text-decoration: none;
}
#footernav a:hover,
#footernav a:focus {
	text-decoration: underline;
}


#customnavbar{
	width:100%;
	min-height:30px;
	overflow:hidden;
	font:.85em/30px Verdana,Tahoma,san-serif;
	background-color: var(--mu-color-secondary);
	border-bottom: 2px solid var(--mu-color-secondary-accent);
}
#customnavbar ul{
	display: flex;
	flex-wrap:wrap;
	max-width: 960px;
	margin: 0 auto;
}
#customnavbar ul li{position:relative;padding:0 var(--mu-responsive-spacing-inner);text-align:center}
#customnavbar ul li a{position:relative;font-weight:bold}
#customnavbar ul li a:hover{}
#customnavbar ul li#customnav-welcome{color:#999;font-weight:bold}
#customnavbar ul li#customnav-search{
	display: none;
}

#customnavbar ul li#customnav-search form {
	display: flex;
    align-items: center;
    gap: .5rem;
}
#customnavbar ul li#customnav-search span{display:block}
#customnavbar ul li#customnav-search label{color:#FFF;font-weight:bold;flex-basis: 18rem;text-align:end}
#customnavbar ul li#customnav-search input{height:1.25rem;font-size:12px;min-height:auto;}
#customnavbar ul li#customnav-search input.button{font-size:12px}


/* TOPNAV */
#topnavbar{position:absolute;top:0;left:0;max-width:960px;height:30px;font:.85em/2em Verdana,Tahoma,san-serif}
#topnavbar ul{position:relative;display:block;max-width:960px;height:30px;overflow:hide}
#topnavbar ul{_height:0;min-height:0}
#topnavbar ul li{display:inline;float:left;padding:0 10px;text-align:center}
* html #topnavbar ul li{width:75px;overflow:hidden} /* IE6- needs a fixed width on the list items */
#topnavbar ul li a{font-weight:bold}
#topnavbar ul li#topnav-welcome{color:#999;padding-left:3em;font-weight:bold}
#topnavbar ul li#topnav-search{float:right;width:320px;}
#topnavbar ul li#topnav-search span{display:block}
#topnavbar ul li#topnav-search label{color:#FFF;font-weight:bold}
#topnavbar ul li#topnav-search input{height:12px}

#topmsg{
	display:none;
	position:relative;
	top:0;
	left:0;
	width:100%;
	height:3.5em;
	z-index:2;
	color:#FFF;
	background-color:#666;
	border-top:solid 3px #999;
	border-bottom:solid 1px #999;
	padding-top:2px;
	line-height:1.5em;
	font-weight:bold;
}

/* SECONDARY NAV */
#secondarynav ul,#secondarynav ul li{margin:0;padding:0}
#secondarynav ul li{padding:0 0 0 5px;font-weight:bold}
#secondarynav ul li ul li{font-weight:normal}


#toplinkbar{margin-bottom:1em;text-align:left}

/* Make some adjustments if we're running a background skin/ad */
body.hasbgskin #pagewrapper{cursor:hand;cursor:pointer}
body.hasbgskin #topnav,
body.hasbgskin #pagecontainer,
body.hasbgskin #footer{cursor:default}
body.hasbgskin #pagepeel{display:none;}

/*	
***********************
SECTION-SPECIFIC STYLES
***********************
*/

/* Primary Nav - Current Sections */
body.homepage li#nav-home{color:#FFF;background-color:#446}
body.news-section li#nav-news{color:#FFF;background-color:#446}
body.bands-section li#nav-bands{color:#FFF;background-color:#446}
body.interviews-section li#nav-interviews{color:#FFF;background-color:#446}
body.reviews-section li#nav-reviews{color:#FFF;background-color:#446}
body.photo_gallery-section li#nav-gallery{color:#FFF;background-color:#446}
body.about_us-section li#nav-aboutus{color:#FFF;background-color:#446}
body.restricted-section li#nav-admin{color:#FFF;background-color:#446}
body.restricted-section #pagecontainer {
	background-image: none;
}

/* Special Time of Year Styles */
body.dec{}
/*body.Oct-31{background:#111 url(images/background_tile_scary.jpg) fixed}*/


/* Home Page */
body.homepage #main li{margin-left:0;list-style-type:none}
body.homepage #main ul li{list-style-type:none;padding-bottom:.5rem}
body.homepage #main ol li{list-style-type:decimal}

body.homepage #main h3 .comments {
	font-size: .8rem;
    font-weight: normal;
}

.comments {
    color: white;
}
.comments svg.icon {
	width: .8em;
	height: .8em;
}

body.homepage .related-articles{margin-top:-5px;font-size:11px;font-weight:bold}

/* Login */
body.login-section #content fieldset{border:0}

/* Bands */
body.bands-section .bandphoto{position:relative;float:left;width:250px;margin:0 1em 1em 0;border-bottom:solid 2px #333;text-align:left;overflow:hidden;color:#999}

/* Reviews */
body.reviews-section .feature:hover{background-color:#212021}


/*	
*************************
OTHER REUSABLE COMPONENTS
*************************
*/

/* Login form */
#loginform{width:350px;border:solid 1px #666;margin:10px auto;}

#forgot{width:50%;margin:0 auto;}
#forgot ul{margin-left:-25px;padding-left:6em;}
#forgot li{list-style-type:none}

/* Home page elements */
.homepage p.intro{float:left;width:430px;}
#homestats{float:right;width:200px;background-color:#EEE;border:solid 1px #DDD}
#homestats h2{color:#999;text-indent:1em;font-size:1em}

/* Features */
.feature{position:relative;width:100%;margin-bottom:.6em;text-align:left}
.feature.headline{padding-bottom:.5em;border-bottom:solid 1px #666}


.feature,
.release-header {
	display: flex;
	flex-wrap: wrap;
	gap: var(--mu-responsive-spacing-inner);
}

.feature > *:first-child,
.release-header > *:first-child {
	min-width: 250px;
}

.feature > a img,
.release-header img {
	width: 100%;
	height: auto;
}

.feature > *:last-child,
.release-header > *:last-child {
	flex-shrink: 1;
	flex-grow: 1;
	flex-basis: 13rem;
}


/* Article Content Styles */
.article{position:relative;margin-bottom:1.5em}
.newstype{color:#999}
#main .article p.newstype{margin-bottom:0} /* margin-left:55px; */
.article .article-meta{position:static;color:#999}
.article .source{color:#999;}

/*
article .posted-date{display:block;position:relative;position:absolute;top:0;left:0;width:50px;padding:5px;color:#000;border:solid 1px #999;text-align:center}
article .posted-date span{position:relative;display:block;width:50px;color:#FFF;text-align:center;border:solid 1px #999;}
*/

.article span{padding:1px 0;margin:0;line-height:1;text-align:center;text-indent:0}

@media (min-width: 54em) {
	.article .posted-month{position:absolute;top:.25rem;left:-5rem;display:block;width:3.125rem;color:#FFF;background-color:#111;font-size:1.1em;font-weight:bold;border-top:solid 2px #666;border-right:solid 2px #333;border-left:solid 2px #555}
	.article .posted-day{position:absolute;top:1.375rem;left:-5rem;display:block;width:3.125rem;color:#FFF;background-color:#000;font-size:1.8em;font-weight:bold;border-right:solid 2px #333;border-left:solid 2px #555;}
	.article .posted-year{position:absolute;top:2.875rem;left:-5rem;display:block;width:3.125rem;color:#999;background-color:#000;border-bottom:solid 2px #212021;border-right:solid 2px #333;border-left:solid 2px #555;}
}

.article .newstype{}
.article .posted-time{}
.article .posted-text{display:none}

.article li,.article dd,.article blockquote,.indent{margin-left:40px}
.article ol li{list-style-type:decimal}
.article ol li ol li{list-style-type:lower-alpha}
.article ul, .article ol{color:#999;margin-bottom:.5em}
.article ul li{list-style-type:disc}
.article ul li ul li{list-style-type:square}



.articleimg{float:left;padding:0 1em 1em 0;margin-right:0 !important}
.articleinfo{color:#CCC;background-color:#111;margin:.5em 0;padding:1em;border:solid 1px #212021;}
.posted{color:#999;font-size:.9em}
.discuss{color:#C0C0C0;background-color:#111;margin-top:-.5em;padding:.1em;border:solid 1px #212021}
.article .discuss{margin-top:.5em}
.heading-meta,.heading-meta a:link{color:#CCC}
.heading-meta{display:block}

#mainarticlephoto{position:relative;float:left;width:260px;text-align:left}
#mainarticlephoto p{color:#999;padding:0 .5em}

/* Center embedded players */
.article p iframe {
	margin: 0 auto;
}



div.match{
	background-color:#311 !important;
	border:dashed 1px #C33 !important;
}
tr.match td{background-color:#311 !important;}

.article #byline{
	display:flex;
	gap: 1rem;
	padding:1rem;
	background-color:#212021;
	border:solid 1px #333
}
.article #byline .gravatar{
	flex-shrink: 0;
	flex-grow: 0;
	height:auto;
	transform: rotate(-5deg);
}


.gravatar{text-align:center;font-size:.7rem}
.gravatar p.usertitle{color:#999;text-align:center !important}
.gravatar-img{width:80px;height:80px}


/*#getanavatar{float:right;width:180px;background-color:#212021;padding:0 10px;text-align:center}*/
#getanavatar p{
	color:#AAA;
	font-size:.9em;
}

#getanavatar{
	display: flex;
    flex-direction: column;
	align-items: center;
	background-color:#212021;
	padding:0 var(--mu-responsive-spacing-inner);
	text-align:center
}

#getanavatar p{color:#AAA;font-size:.9em}


/* Tabsets */
.tabset{margin:2em 0}
.tabset,.tabbody{position:relative;min-width:0}
.tabbody {max-width: 100%;overflow-x:auto}
/*#main li,#main blockquote,#main td{font-size:1em;line-height:1.55}*/
#main .tabs,#main .tabs li{line-height:1.5 !important}
#main ul.tabs{text-align:left;margin:1em 0 1em 0;padding:3px 10px 3px 10px;border-bottom:solid 1px #333;list-style-type:none;font-size:12px;font-weight:bold} /* padding-bottom must change w/ padding-top below */
#main ul.tabs li{display:inline;margin:0;padding:0}
#main ul.tabs li.current{
	border-bottom:solid 1px #000; /* set border color to page background color */
	background-color:#000; /* set background color to match above border color */
}


#main ul.tabs li.current a{position:relative;top:1px;color:#FFF;background-color:#000;padding-top:6px} /* padding must change with respect to padding (X) above and below */
#main ul.tabs li a{color:#999;background-color:#212021;border:solid 1px #333;margin-right:0px;padding:5px 8px;text-decoration:none;border-bottom:none} /* set padding (tab size) as desired; FIRST number must change with respect to padding-top (X) above */
#main ul.tabs a:hover{color:#FFF}


#main #sidebar ul.tabs li{}
#main #sidebar ul.tabs li.current{
	border-bottom:solid 1px #212021; /* set border color to page background color */
	background-color:#111; /* set background color to match above border color */
}
#main #sidebar ul.tabs li a{color:#999;background-color:#000;border:solid 1px #333;margin-right:0px;padding:5px 8px;text-decoration:none;border-bottom:none} /* set padding (tab size) as desired; FIRST number must change with respect to padding-top (X) above */
#main #sidebar ul.tabs li.current a{color:#FFF;background-color:#111}
#main #sidebar ul.tabs a:hover{color:#FFF}



/* Calendar */
table.calendar{width:auto;border:solid 1px #333;border-collapse:collapse;font-size:.95em}
table.calendar td,table.calendar th{text-align:center;margin:0;padding:0;border:solid 1px #333}
table.calendar td{width:2.7em}
table.calendar tbody tr:hover{background-color:transparent}
table.calendar td.today a{background-color:#67C}
table.calendar td.selecteddate a{background-color:#444;background-image:url(images/selecteddate_sm.gif);background-position:center;background-repeat:no-repeat}
table.calendar td a{display:block;padding:1px 2px;text-decoration:none}
table.calendar th a:link,table.calendar th a:visited{color:#FFF;text-decoration:none}
table.calendar tr:hover{background-color:transparent}
table.calendar td a:hover{background-color:#67C}

/* Pagination */
div.pagination{position:relative;width:auto;margin-bottom:1px;text-align:center}
div.pagination input{width:2em;text-align:center}
div.pagination input.button{width:auto}
div.pagination a,div.pagination .fauxnavlink{margin:auto .5em}
.paginationnav{position:relative;display:block;background-color:#EDF;border:solid 1px #99C;margin:0;padding:.5em;padding-right:5em;text-align:center}
.paginationnav a{font-weight:bold}
div.pagination .fauxnavlink{color:#999}
.paginationsummary{display:none;text-align:left;padding:.2em}
.instance1 .paginationsummary{display:block}
.paginationform{margin:0 1em}
/*
.pagination a.previous-page,.pagination a.first-page{background:transparent url(images/arrow_left_16x16.gif) center left no-repeat;padding-left:14px}
.pagination a.next-page,.pagination a.last-page{background:transparent url(images/arrow_right_16x16.gif) center right no-repeat;padding-right:14px}
*/

/* List Style */
p.pagination{background-color:#111;padding:.5em 1em;text-align:right !important}
tr.pagination td{background-color:#111;text-align:right}
.paginationpage{background-color:#212021;border:solid 1px #333;padding:.1em .3em}
.paginationcurrentpage{background-color:#113;border:solid 1px #67C}


/* Table action items */
th.actions{width:60px}
td a.action{white-space:nowrap;text-decoration:none}
td a.view,td a.info,
td a.add,td a.edit,td a.update,
td a.searchdoc,td a.searchip,
td a.download
{float:left;display:block;width:18px;overflow:hidden;padding:0;text-indent:18px}
/*
td a.view{background:transparent url(images/action_view.png) left no-repeat}
td a.info{background:transparent url(images/action_info.png) left no-repeat}
td a.edit{background:transparent url(images/action_edit.png) left no-repeat}
td a.download{background:transparent url(images/action_download.png) left no-repeat}
td a.add{background:transparent url(images/action_update.png) left no-repeat}
td a.update{background:transparent url(images/action_update.png) left no-repeat}
td a.searchdoc{background:transparent url(images/action_search_doc.png) left no-repeat}
td a.searchip{background:transparent url(images/action_search_ip.png) left no-repeat}
*/

.post-form-options{border-top:solid 1px #666;padding-top:1em}


.section{border-bottom:solid 1px #212021;margin-bottom:1em;clear:both}
.pod{background:#111;margin:1em .5em 0 0;padding:0;clear:both}
#bandsearch-pod{background:#112}
.shaded{background:#111}
.altshaded{background:#113}

/* Dynamic Column Layouts */
/*
.two-col,.three-col,.four-col{position:relative;float:left;width:100%}
.two-col .col{float:left;width:49.9%}
.three-col .col{float:left;width:33%}
.col div{margin-right:.5em}
.col div div{margin:0}
*/
.two-col,.three-col,.four-col {
	display:block;
	position:relative;
	margin: .5rem;
}

@media (min-width: 37.5em) {
	.two-col,.three-col,.four-col {
		display:grid;
		grid-gap: 1rem;
		margin: 0;
	}
	.two-col {grid-template-columns: 1fr 1fr;}
	.three-col {grid-template-columns: 1fr 1fr 1fr;}
	.four-col {grid-template-columns: 1fr 1fr 1fr 1fr;}
}
/*
.col h4,.two-col .col ul{margin:0 .5em .3em .5em}
*/

#related-articles{background-color:#212021;padding:.5em 0;padding-left:.5em;margin-top:.5em;margin-bottom:1.5em;}
#featurebar1{background-color:#113;border:dotted 1px #67B;margin:5px 0;padding:.5em 0 .5em .3em}
#featurebar2{background-color:#212021;border:dotted 1px #666;margin:5px 0;padding:.5em 0 .5em .3em}

.releasetype{font-style:italic;font-size:.8em}



/* Page-Specific Formatting (Top Directories/Nav - Down; Page Top-Down */
#homeimg{width:90%;max-width:300px}
#contests{margin-bottom:1em}


.pullquote{float:right;width:35%;color:#CCC;background-color:#111;margin:1em;padding:.5em .5em .5em .2em;border-left:solid 3px #212021;font:1.2em/1.5 bold;text-align:right}


/* Other special link types */
/*
a.search{}
a.addnew{background:transparent url(images/addnew.gif) no-repeat center left;padding-left:14px}
a.download{padding-left:20px;background:transparent url(images/download.gif) left no-repeat}
.pdf{padding-right:15px;background:transparent url(images/pdf_icon_13x13.gif) right no-repeat}
*/

/* Social Icons */
.sm-icon-list a{padding-left:20px}
.sm-icon-list .social-icons-sm-facebook{background:transparent url(images/link_decor_lib.gif) 0 0 no-repeat}
.sm-icon-list .social-icons-sm-twitter{background:transparent url(images/link_decor_lib.gif) 0 -20px no-repeat}
.sm-icon-list .social-icons-sm-myspace{background:transparent url(images/link_decor_lib.gif) 0 -40px no-repeat}
.sm-icon-list .social-icons-sm-lastfm{background:transparent url(images/link_decor_lib.gif) 0 -60px no-repeat}
.sm-icon-list .social-icons-sm-youtube{background:transparent url(images/link_decor_lib.gif) 0 -80px no-repeat}
.sm-icon-list .social-icons-sm-linkedin{background:transparent url(images/link_decor_lib.gif) 0 -120px no-repeat}
.sm-icon-list .social-icons-sm-tumblr{background:transparent url(images/link_decor_lib.gif) 0 -180px no-repeat}
.sm-icon-list .social-icons-sm-googleplus{background:transparent url(images/link_decor_lib.gif) 0 -200px no-repeat}

/* For images representing icons, make them inline-block instead of block */
.icon {
	fill: currentColor;
	display: inline-block;
	margin: 0 2px;
}

/* Form Validation Classes */
.required{color:#C00}
.errorFieldLabel{color:#CC0000;font-weight:bold;font-style:italic}
.errorField{border-style:dashed;border-color:#CC0000}
.errorMsg, .alertbox{
	color:#FFF;
	background-color: #DDD;
	width:95%;
	padding:15px 15px 15px 15px;
	border:dashed 2px #C33;
}

/* Special message types */
#envir{
	color:#CCC;
	background:#212021 url(images/bullet_info_bw.gif) left center no-repeat;
	margin:5px 0;
	padding:.3em 30px .3em 16px;
	font-weight:bold;
	border-top:solid 1px #333;
	border-bottom:solid 1px #333
}

.new{
	color:#000;
	background-color:#FF3;
	padding:0 .2em;
	font-size:8px;
	font-family:Verdana,sans-serif;
	font-variant:small-caps;
	vertical-align:super;
}


.msg{padding:5px 25px;margin:5px 0}

.success{color:#AFA;background:#131 url(images/msg_lib_16x16.png) 5px 7px no-repeat;border:solid 1px #262;}
.info,.note{color:#CCF;background:#236 url(images/msg_lib_16x16.png) 5px -92px no-repeat;border:solid 1px #67C;padding-left:25px}
.warning{color:#CCC;background:#212021 url(images/msg_lib_16x16.png) 5px -292px no-repeat;border:solid 1px #333;padding-left:25px}
.error{color:#FEE;background:#311 url(images/msg_lib_16x16.png) 5px -690px no-repeat;border:solid 1px #C33}

/*.success{background-image:url(images/check.gif)background-position:5px 5px;background-repeat:no-repeat}*/
/*.envir{background-image:url(images/bullet_info.gif);background-position:left center;background-repeat:no-repeat;padding-left:16px;font-weight:bold}*/

/*.inline-note{background: transparent url(images/info.gif) 5px 5px no-repeat;padding:.3em 30px}*/



/* User Preferences (Font size selection) */
.userprefs{display:none;position:absolute;top:0px;right:0px;z-index:5;height:75px;padding:1px 2px;font-family:Georgia,"Times New Roman",Times,serif;}
.userprefs a{color:#666;vertical-align:top;border:dotted 1px #666;margin:0;padding:0 2px;text-decoration:none}
.userprefs a.fontsize-sm{font-size:10px;padding:0 3px}
.userprefs a.fontsize-md{font-size:11px;padding:0 3px}
.userprefs a.fontsize-lg{font-size:12px;padding:0 3px}
.userprefs a.fontsize-xl{font-size:14px}
.userprefs a.current{color:#6C7EBE;border:solid 1px #6C7EBE}
.userprefs a:hover{color:#6C7EBE;border-color:#6C7EBE}
#styleswitcher{float:left;text-align:left}

.toplink{float:right;text-align:right;font-weight:bold;margin-top:3em}
.toplink a{display:block;text-indent:15px;/*background:transparent url(images/arrow_up_16x16.gif) left no-repeat*/}
.backlink{margin:0;text-align:right}


.tableHeaderOver:hover{background-color:#56A;cursor:hand;cursor:pointer}

.previewpane{width:100%;height:250px;overflow:auto}


.staffmember{position:relative;/*float:left;width:580px;*/padding:5px 10px}
.dynadmin-options{position:absolute;width:200px;right:10px;bottom:20px;text-align:right}


/*	
*************************
MISC ELEMENT FORMATTING
*************************
*/

.shaded{background-color:#111}
.altshaded{background-color:#113}
.altcolor{color:#666}

ul.noindent{margin-left:-25px}
.inpagenav{margin:1em 0}
.submitbuttons{margin:1em 0}

/*.inactive-item{background-image:url(images/bg_inactive_item.gif)}*/


/*	
**************************
GENERIC FORMATTING CLASSES
**************************
*/
.container{position:relative}
.wrapper{width:100%;position:relative}
.box{border:solid 1px #DDD}
.pod{padding:.5em}
.contentwrapper{padding:0 1em}
.constrained{overflow:hidden}


.plaintext{color:#67C !important;font-weight:normal;font-style:normal;text-decoration:none}
.highlight{color:#000;background-color:#FFF;padding:0 .3em}
.odd{background-color:#212021}
.even{background-color:#000}

.inactive,.disabled{color:#999}


.indent{margin-left:3em !important}
.left{text-align:left !important}
.right{text-align:right !important}
.center{text-align:center !important}
.middle{vertical-align:middle !important}
.float-left{position:relative; float: left !important}
.float-right{position: relative; float: right !important}

.float-left.w-padding{margin:0 10px 5px 0}
.float-right.w-padding{margin:0 0 5px 10px}

.action{font-weight:bold}

.nowrap{white-space: nowrap !important}
.clear{clear:both}


.bigger{font-size:125%}
.small,.smallprint{font-size:.8em}
.invisible{visibility:hidden}
.hidden{display:none}
.hideme{}
.non-visual{position:absolute;left:-9999px}

.question{color:#CCC;font-weight:bold}
.answer{margin-left:20px}
.yes,.true{color:#090}
.no,.false{color:#C00}
.incomplete{text-decoration:line-through !important}
/*
.asc,.sortedASC{padding-right:15px;background-image:url(images/up.gif);background-position:right;background-repeat:no-repeat}
.desc,.sortedDESC{padding-right:15px;background-image:url(images/down.gif);background-position:right;background-repeat:no-repeat}
*/


/*	
**************************
STYLES FOR ADD-ONS
**************************
*/

.tipsy{padding:5px;font-size:10px;opacity:0.8;filter:alpha(opacity=80);background-repeat:no-repeat;background-image:url(images/tipsy.gif)}
.tipsy-inner{padding:5px 8px 4px 8px;background-color:black;color:white;max-width:200px;text-align:center}
.tipsy-inner{-moz-border-radius:3px;-webkit-border-radius:3px}
.tipsy-north{background-position:top center}
.tipsy-south{background-position:bottom center}
.tipsy-east{background-position:right center}
.tipsy-west{background-position:left center}



#lean_overlay{position:fixed;z-index:100;top:0px;left:0px;height:100%;width:100%;background:#000;display:none}
#lean_modal{width:500px;max-width:90%;line-height:1.5;text-align:left}
#lean_modal p{margin-bottom:.8em}

/*	
**************************
HACKS
**************************
*/
.clearer{clear:both;height:1px;overflow:hidden;margin-top:-1px}
.clearfix:after{content:".";display:block;height:0;line-height:0px;clear:both;visibility:hidden}
.clearfix {display:inline-table;}
/* Hides from IE-mac \*/
* html .clearfix{height:1%}
.clearfix{display:block}
/* End hide from IE-mac */

/* autoscroll override for Firefox */
/*html>img{width:0!important;height:61px!important;padding-left:49px!important;background:url(images/autoscroller.png)}*/

/* Style selections for advanced browsers */
::-moz-selection{background:#67B;color:#FFF}
::selection{background:#67B;color:#FFF}




@media (min-width: 37.5em) {
	#customnavbar ul li#customnav-search{
		flex-grow: 5;
		align-self: flex-end;
		display: flex;
		align-items: flex-end;
		justify-content: flex-end;
	}
	
	#primarynav ul li a {
		padding: 0.5em;
	}

	#primarynav li a span {
		display: inline;
	}

	#primarynav svg.icon {
		display: none;
		width: 1em;
	}
}