/*
 * MFG look for SMF 2.1: restyles the stock Curve2 templates to roughly match the old EosAlpha
 * "mfg" theme (Themes/mfg/css/{skin_default,mfg_overrides}.css). CSS only, no template changes.
 * Installed as Themes/default/css/mfg.css and loaded by mfg_load_theme() in Subs-MFG.php, after
 * index.css and responsive.css. Images live in Themes/default/images/mfg/ (see deploy-test.sh).
 * Layout overrides are limited to desktop widths, so 2.1's responsive mobile layout keeps working.
 */

/* Page, fonts, links
------------------------------------------------------- */
html {
	background: #e2e2e2;
}
body {
	background: #e2e2e2;
	font: 78%/140% Verdana, Arial, Helvetica, sans-serif;
	color: #222;
}
/* Everything down to the footer is white, the grey only shows below it (like the old #wrap),
   and the footer sits right below the content instead of at the bottom of the window. */
#footerfix {
	background: #fff;
	flex: none;
}
a, a:visited {
	color: #437d96;
}
a:hover {
	color: #aa7d88;
	text-decoration: none;
}
.bbc_link, .bbc_link:hover {
	border-bottom: 1px dotted #346;
}
input[type="text"], input[type="password"], input[type="search"], input[type="email"],
input[type="number"], input[type="url"], select, textarea {
	border: 1px solid #aac;
	border-radius: 3px;
	box-shadow: none;
}

/* Top bar (user menus, search): kept, but plain instead of a shadowed strip */
#top_section {
	background: #fff;
	border-bottom: none;
	box-shadow: none;
}
#top_info > li > a {
	color: #437d96;
}

/* Header: logo on the dotted background */
#header {
	padding: 0 0 0 20px;
	min-height: 145px;
	align-items: center;
	background: url(../images/mfg/upper_bg.png) 225px 30px no-repeat;
}
h1.forumtitle {
	padding: 0;
}
h1.forumtitle img {
	width: 360px;
	max-width: 100%;
	vertical-align: middle;
}
#smflogo, #siteslogan {
	display: none;
}

/* Main frame: light blue-grey box with the dark menu bar on top, dark footer below */
#wrapper {
	background: #f0f4f7;
	border: 1px solid #ddd;
	border-top: none;
	border-bottom: none;
	border-radius: 0;
	box-shadow: none;
}
#upper_section {
	padding: 0;
}
#inner_section {
	padding: 0 20px;
	border-radius: 0;
	background: none;
}
#inner_wrap {
	margin: 10px 0 8px;
	border-bottom: 1px solid #ddd;
}
#inner_wrap .news h2 {
	color: #435da6;
}
#main_content_section {
	padding: 5px 20px 16px;
}

/* Linktree (breadcrumbs) */
.navigate_section ul {
	background: #f0f0f0;
	border: 1px solid #ddd;
	border-radius: 3px;
	box-shadow: none;
	padding: 2px 10px;
}
.navigate_section ul li a, .navigate_section ul li a:visited {
	color: #333;
}
.navigate_section ul li a:hover span {
	color: red;
}
.navigate_section ul li.last a span {
	font-weight: bold;
}
.navigate_section ul li .dividers {
	font-size: 0;
	padding: 0 4px;
}
.navigate_section ul li .dividers::before {
	content: "\2192";
	font-size: 12px;
	color: #333;
}

/* Footer */
#footer {
	margin: 0;
	padding: 0 0 10px;
	background: #fff;
	border-top: none;
}
#footer .inner_wrap {
	background: #222;
	color: #ddd;
	padding: 3px 10px;
	border-radius: 0 0 6px 6px;
}
#footer li, #footer p, #footer a {
	color: #ddd;
	font-size: 8pt;
}
#footer a {
	color: #ccccee;
}

/* Desktop: full width with 30px margins, dark menu bar with tabs */
@media (min-width: 856px) {
	#top_section .inner_wrap, #wrapper, #header, #footer .inner_wrap {
		max-width: none;
		width: auto;
		margin: 0 30px;
	}
	#top_section .inner_wrap {
		padding: 0 20px;
	}
	#inner_section {
		display: flex;
		flex-direction: column;
	}
	#main_menu {
		order: -1;
		margin: 0 -20px;
		padding: 2px 6px 0 30px;
		min-height: 26px;
		background: #222;
		border-radius: 6px 6px 0 0;
	}
	#main_menu .dropmenu > li {
		margin: 0;
		font-size: 13px;
		line-height: 24px;
	}
	#main_menu .dropmenu > li > a, #main_menu .dropmenu > li > a:visited {
		color: #fff;
		padding: 0 10px;
		border: none;
		border-top: 2px solid transparent;
		border-radius: 0;
		text-shadow: 1px 1px 2px #000;
	}
	#main_menu .dropmenu > li > a .main_icons {
		display: none;
	}
	#main_menu .dropmenu > li:hover > a, #main_menu .dropmenu > li > a:focus {
		background: #444;
		border: none;
		border-top: 2px solid transparent;
		box-shadow: none;
		color: #fff;
	}
	#main_menu .dropmenu > li > a.active, #main_menu .dropmenu > li > a.active:hover, #main_menu .dropmenu > li:hover > a.active {
		background: #f5f5f5;
		color: #000;
		font-weight: bold;
		border: none;
		border-top: 2px solid orange;
		box-shadow: none;
		text-shadow: none;
	}
	#main_menu .dropmenu > li > a .amt {
		background: #c78844;
	}
	#main_menu .dropmenu li ul {
		background: #f2f2f2;
		border: 1px solid #ccc;
		box-shadow: 1px 3px 10px 1px #888;
	}
	#main_menu .dropmenu li li a, #main_menu .dropmenu li li a:visited {
		color: #000;
	}
}

/* Category and title bars: pale blue with an orange line */
div.cat_bar, .title_bar {
	background: #a7b9cd;
	border: none;
	border-bottom: 1px solid orange;
	border-radius: 2px 2px 0 0;
	box-shadow: none;
	text-shadow: none;
}
.cat_bar.collapsed, .cat_bar.cat_bar_round {
	border-radius: 2px;
}
.cat_bar h3, h3.catbg, h3.titlebg, h4.titlebg, .titlebg {
	padding: 4px 10px 3px;
	font: normal 14.5px/19px "Segoe UI", Tahoma, Arial, sans-serif;
}
h3.catbg, h3.catbg a, h3.catbg a:hover, h3.catbg a:visited,
.titlebg, .titlebg a, .titlebg a:visited, .cat_bar .desc, .cat_bar .desc a {
	color: #435da6;
	text-shadow: none;
}

/* Boxes */
.windowbg, .generic_list_wrapper, .approvebg, .approvebg2 {
	border: 1px solid #ddd;
	border-radius: 3px;
	box-shadow: none;
}
.windowbg:nth-of-type(odd), .windowbg:nth-of-type(even), .bg.odd, .bg.even {
	background: #e7eaef;
}
.windowbg.sticky {
	background: #e8d8cf;
}
.windowbg.locked {
	background: #e2e2e2;
}
.windowbg:target {
	background: #f2f2a5;
}
.roundframe, .information, .descbox {
	background: #e7eaef;
	border-color: #ddd;
	box-shadow: none;
}
.roundframe {
	border-radius: 3px;
}

/* Buttons and page links: flat grey, the active one blue */
.button, .quickbuttons > li > a, .inline_mod_check {
	background: #e2e2e2;
	color: #222;
	border: 1px solid #c8c8c8;
	border-radius: 2px;
	box-shadow: none;
	text-transform: none;
	font-family: Tahoma, sans-serif;
	font-size: 11px;
}
.button:hover, .button:focus, .quickbuttons > li:hover > a, .quickbuttons > li > a:focus {
	background: #d5ecfa;
	color: #222;
	border-color: #98aaba;
	box-shadow: none;
}
.button.active, .button.active:hover, .button.active:focus, input[type="submit"].button {
	background: #4685cc;
	color: #fff;
	border: 1px solid #3a6fa9;
	text-shadow: none;
	font-weight: normal;
}
.pagesection .button, .pagelinks .button {
	color: #777;
}
.pagesection .button.active {
	color: #fff;
}
.pagelinks .button {
	background: #f2f2f2;
	border-color: #ddd;
	border-radius: 0;
}
.pagelinks .current_page {
	display: inline-block;
	padding: 0 5px;
	background: #8f8f8f;
	color: #ddd;
	border: 1px solid #000;
	font: 11px Tahoma, sans-serif;
	line-height: 17px;
}

/* Board index and message index
------------------------------------------------------- */
.main_container {
	background: #e7eaef;
	padding: 0 4px 4px;
}
.main_container .cat_bar {
	margin: 0 -4px;
}
.up_contain {
	background: #e7eaef;
	border: none;
	border-bottom: 1px solid #ccccee;
	border-radius: 0;
	margin: 0;
}
.info .subject, .info .subject:visited {
	color: #333;
	font: normal 14.5px/130% "Segoe UI", "Lucida Grande", Tahoma, Arial, sans-serif;
}
.info .subject:hover {
	color: #aa7d88;
}
.boardindex_table .board_stats p {
	border-color: #ccccee;
}
.children {
	border-top: 1px dotted #ccccee;
}
.children a, .children a:visited {
	color: #666;
}
/* Topic list */
#topic_container .windowbg {
	background: #eaecf2;
	border-color: #ccccee;
}
#topic_container .windowbg.sticky {
	background: #e8d8cf;
}
#topic_container .windowbg.locked {
	background: #e2e2e2;
}
.info .preview a, .info span.preview a:visited {
	color: #333;
}
#topic_header {
	background: #a7b9cd;
	color: #435da6;
	border-bottom: 1px solid orange;
}
/* The per-board icons (74x51) of the old theme, one image per board and state in
   images/mfg/boards/ (split from its sprite by split-boardicons.php). 2.1 puts the board id on the
   row (#board_<id>). <id>.png: new posts, <id>_off.png: no new posts (redirect boards too).
   Boards without their own icon get default.png. */
.board_icon a {
	background: url(../images/mfg/boards/default.png) no-repeat;
	width: 74px;
	height: 51px;
}
.board_icon a.board_off {
	background-image: url(../images/mfg/boards/default_off.png);
}
/* Stock 2.1 positions its sprite per state (.board_on2, .board_off, .board_redirect). */
.board_icon a.board_on, .board_icon a.board_on2, .board_icon a.board_off, .board_icon a.board_redirect {
	background-position: 0 0;
	background-size: auto;
}
.board_icon {
	width: 94px;
}
.boardindex_table .board_icon {
	width: 94px;
}
.boardindex_table .info {
	width: calc(55% - 94px);
}
#board_306 .board_icon a { background-image: url(../images/mfg/boards/306.png); }
#board_306 .board_icon a.board_off { background-image: url(../images/mfg/boards/306_off.png); }
#board_307 .board_icon a { background-image: url(../images/mfg/boards/307.png); }
#board_307 .board_icon a.board_off { background-image: url(../images/mfg/boards/307_off.png); }
#board_308 .board_icon a { background-image: url(../images/mfg/boards/308.png); }
#board_308 .board_icon a.board_off { background-image: url(../images/mfg/boards/308_off.png); }
#board_309 .board_icon a { background-image: url(../images/mfg/boards/309.png); }
#board_309 .board_icon a.board_off { background-image: url(../images/mfg/boards/309_off.png); }
#board_310 .board_icon a { background-image: url(../images/mfg/boards/310.png); }
#board_310 .board_icon a.board_off { background-image: url(../images/mfg/boards/310_off.png); }
#board_311 .board_icon a { background-image: url(../images/mfg/boards/311.png); }
#board_311 .board_icon a.board_off { background-image: url(../images/mfg/boards/311_off.png); }
#board_312 .board_icon a { background-image: url(../images/mfg/boards/312.png); }
#board_312 .board_icon a.board_off { background-image: url(../images/mfg/boards/312_off.png); }
#board_313 .board_icon a { background-image: url(../images/mfg/boards/313.png); }
#board_313 .board_icon a.board_off { background-image: url(../images/mfg/boards/313_off.png); }
#board_314 .board_icon a { background-image: url(../images/mfg/boards/314.png); }
#board_314 .board_icon a.board_off { background-image: url(../images/mfg/boards/314_off.png); }
#board_315 .board_icon a { background-image: url(../images/mfg/boards/315.png); }
#board_315 .board_icon a.board_off { background-image: url(../images/mfg/boards/315_off.png); }
#board_316 .board_icon a { background-image: url(../images/mfg/boards/316.png); }
#board_316 .board_icon a.board_off { background-image: url(../images/mfg/boards/316_off.png); }
#board_317 .board_icon a { background-image: url(../images/mfg/boards/317.png); }
#board_317 .board_icon a.board_off { background-image: url(../images/mfg/boards/317_off.png); }
#board_318 .board_icon a { background-image: url(../images/mfg/boards/318.png); }
#board_318 .board_icon a.board_off { background-image: url(../images/mfg/boards/318_off.png); }
#board_319 .board_icon a { background-image: url(../images/mfg/boards/319.png); }
#board_319 .board_icon a.board_off { background-image: url(../images/mfg/boards/319_off.png); }
#board_320 .board_icon a { background-image: url(../images/mfg/boards/320.png); }
#board_320 .board_icon a.board_off { background-image: url(../images/mfg/boards/320_off.png); }
#board_321 .board_icon a { background-image: url(../images/mfg/boards/321.png); }
#board_321 .board_icon a.board_off { background-image: url(../images/mfg/boards/321_off.png); }
#board_322 .board_icon a { background-image: url(../images/mfg/boards/322.png); }
#board_322 .board_icon a.board_off { background-image: url(../images/mfg/boards/322_off.png); }
#board_323 .board_icon a { background-image: url(../images/mfg/boards/323.png); }
#board_323 .board_icon a.board_off { background-image: url(../images/mfg/boards/323_off.png); }
#board_324 .board_icon a { background-image: url(../images/mfg/boards/324.png); }
#board_324 .board_icon a.board_off { background-image: url(../images/mfg/boards/324_off.png); }
#board_325 .board_icon a { background-image: url(../images/mfg/boards/325.png); }
#board_325 .board_icon a.board_off { background-image: url(../images/mfg/boards/325_off.png); }
#board_326 .board_icon a { background-image: url(../images/mfg/boards/326.png); }
#board_326 .board_icon a.board_off { background-image: url(../images/mfg/boards/326_off.png); }
#board_339 .board_icon a { background-image: url(../images/mfg/boards/339.png); }
#board_339 .board_icon a.board_off { background-image: url(../images/mfg/boards/339_off.png); }
#board_340 .board_icon a { background-image: url(../images/mfg/boards/340.png); }
#board_340 .board_icon a.board_off { background-image: url(../images/mfg/boards/340_off.png); }
#board_344 .board_icon a { background-image: url(../images/mfg/boards/344.png); }
#board_344 .board_icon a.board_off { background-image: url(../images/mfg/boards/344_off.png); }
#board_345 .board_icon a { background-image: url(../images/mfg/boards/345.png); }
#board_345 .board_icon a.board_off { background-image: url(../images/mfg/boards/345_off.png); }
#board_346 .board_icon a { background-image: url(../images/mfg/boards/346.png); }
#board_346 .board_icon a.board_off { background-image: url(../images/mfg/boards/346_off.png); }
#board_347 .board_icon a { background-image: url(../images/mfg/boards/347.png); }
#board_347 .board_icon a.board_off { background-image: url(../images/mfg/boards/347_off.png); }
#board_348 .board_icon a { background-image: url(../images/mfg/boards/348.png); }
#board_348 .board_icon a.board_off { background-image: url(../images/mfg/boards/348_off.png); }
#board_349 .board_icon a { background-image: url(../images/mfg/boards/349.png); }
#board_349 .board_icon a.board_off { background-image: url(../images/mfg/boards/349_off.png); }
#board_350 .board_icon a { background-image: url(../images/mfg/boards/350.png); }
#board_350 .board_icon a.board_off { background-image: url(../images/mfg/boards/350_off.png); }
#board_352 .board_icon a { background-image: url(../images/mfg/boards/352.png); }
#board_352 .board_icon a.board_off { background-image: url(../images/mfg/boards/352_off.png); }
#board_353 .board_icon a { background-image: url(../images/mfg/boards/353.png); }
#board_353 .board_icon a.board_off { background-image: url(../images/mfg/boards/353_off.png); }
#board_355 .board_icon a { background-image: url(../images/mfg/boards/355.png); }
#board_355 .board_icon a.board_off { background-image: url(../images/mfg/boards/355_off.png); }
#board_356 .board_icon a { background-image: url(../images/mfg/boards/356.png); }
#board_356 .board_icon a.board_off { background-image: url(../images/mfg/boards/356_off.png); }
#board_357 .board_icon a { background-image: url(../images/mfg/boards/357.png); }
#board_357 .board_icon a.board_off { background-image: url(../images/mfg/boards/357_off.png); }
#board_358 .board_icon a { background-image: url(../images/mfg/boards/358.png); }
#board_358 .board_icon a.board_off { background-image: url(../images/mfg/boards/358_off.png); }
#board_359 .board_icon a { background-image: url(../images/mfg/boards/359.png); }
#board_359 .board_icon a.board_off { background-image: url(../images/mfg/boards/359_off.png); }
#board_361 .board_icon a { background-image: url(../images/mfg/boards/361.png); }
#board_361 .board_icon a.board_off { background-image: url(../images/mfg/boards/361_off.png); }
#board_362 .board_icon a { background-image: url(../images/mfg/boards/362.png); }
#board_362 .board_icon a.board_off { background-image: url(../images/mfg/boards/362_off.png); }
#board_363 .board_icon a { background-image: url(../images/mfg/boards/363.png); }
#board_363 .board_icon a.board_off { background-image: url(../images/mfg/boards/363_off.png); }
#board_364 .board_icon a { background-image: url(../images/mfg/boards/364.png); }
#board_364 .board_icon a.board_off { background-image: url(../images/mfg/boards/364_off.png); }
#board_365 .board_icon a { background-image: url(../images/mfg/boards/365.png); }
#board_365 .board_icon a.board_off { background-image: url(../images/mfg/boards/365_off.png); }
#board_366 .board_icon a { background-image: url(../images/mfg/boards/366.png); }
#board_366 .board_icon a.board_off { background-image: url(../images/mfg/boards/366_off.png); }
#board_369 .board_icon a { background-image: url(../images/mfg/boards/369.png); }
#board_369 .board_icon a.board_off { background-image: url(../images/mfg/boards/369_off.png); }
#board_370 .board_icon a { background-image: url(../images/mfg/boards/370.png); }
#board_370 .board_icon a.board_off { background-image: url(../images/mfg/boards/370_off.png); }
#board_372 .board_icon a { background-image: url(../images/mfg/boards/372.png); }
#board_372 .board_icon a.board_off { background-image: url(../images/mfg/boards/372_off.png); }
#board_374 .board_icon a { background-image: url(../images/mfg/boards/374.png); }
#board_374 .board_icon a.board_off { background-image: url(../images/mfg/boards/374_off.png); }
#board_377 .board_icon a { background-image: url(../images/mfg/boards/377.png); }
#board_377 .board_icon a.board_off { background-image: url(../images/mfg/boards/377_off.png); }
#board_382 .board_icon a { background-image: url(../images/mfg/boards/382.png); }
#board_382 .board_icon a.board_off { background-image: url(../images/mfg/boards/382_off.png); }
#board_383 .board_icon a { background-image: url(../images/mfg/boards/383.png); }
#board_383 .board_icon a.board_off { background-image: url(../images/mfg/boards/383_off.png); }
#board_384 .board_icon a { background-image: url(../images/mfg/boards/384.png); }
#board_384 .board_icon a.board_off { background-image: url(../images/mfg/boards/384_off.png); }
#board_385 .board_icon a { background-image: url(../images/mfg/boards/385.png); }
#board_385 .board_icon a.board_off { background-image: url(../images/mfg/boards/385_off.png); }
#board_386 .board_icon a { background-image: url(../images/mfg/boards/386.png); }
#board_386 .board_icon a.board_off { background-image: url(../images/mfg/boards/386_off.png); }

/* Topic display
------------------------------------------------------- */
#display_head .display_title {
	color: #888;
	font-weight: normal;
}
#forumposts .windowbg {
	background: #e7eaef;
	border: 1px solid #fff;
	border-radius: 6px;
	box-shadow: 0 0 0 1px #ddd;
	margin: 10px 0 0;
}
#forumposts .windowbg:target {
	background: #f4f4dc;
}
.poster h4, .poster h4 a, .poster h4 a:visited, .poster li:hover h4 a {
	color: #222;
	font-weight: normal;
}
.inner {
	border-top: none;
	box-shadow: none;
}
.keyinfo .postinfo, .keyinfo .postinfo a, .keyinfo .postinfo a strong, .page_number {
	color: #444;
}
.signature, .custom_fields_above_signature, .custom_fields_below_signature, .attachments {
	border-top: 1px solid #ccc;
	box-shadow: none;
}
.signature {
	max-height: 201px;
	overflow: hidden;
}
/* Desktop: the old post header, a pale blue bar across the whole post with the poster's name on
   the left and the date on the right of it. */
@media (min-width: 721px) {
	#forumposts .windowbg {
		padding: 0;
		overflow: visible;
	}
	#forumposts .post_wrapper {
		position: relative;
	}
	#forumposts .post_wrapper::before {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		height: 26px;
		background: #a7b9cd;
		border-radius: 5px 5px 0 0;
	}
	#forumposts .poster {
		position: relative;
		width: 220px;
		padding: 0 5px 10px;
		text-align: center;
	}
	#forumposts .poster h4 {
		height: 26px;
		line-height: 26px;
		font-size: 1.1em;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	#forumposts .poster .user_info {
		padding-top: 6px;
	}
	#forumposts .poster .profile_icons, #forumposts .poster .im_icons ol {
		display: inline-block;
	}
	#forumposts .postarea, #forumposts .moderatorbar {
		position: relative;
		margin-left: 230px;
		padding-right: 10px;
	}
	#forumposts .keyinfo {
		min-height: 26px;
	}
	#forumposts .keyinfo .postinfo {
		min-height: 26px;
		padding: 0;
		font-size: 11px;
		line-height: 26px;
	}
	#forumposts .inner {
		padding: 8px 0 2px;
	}
	#forumposts .moderatorbar {
		padding-bottom: 5px;
	}
}

/* [img width=N height=N]: Eos stretched the image to the given size, 2.1 letterboxes it. */
.bbc_img.resized {
	object-fit: fill;
}

/* Quotes and code
------------------------------------------------------- */
blockquote.bbc_standard_quote, blockquote.bbc_alternate_quote {
	background: #eaeaea url(../images/mfg/quote.png) 0.1em 0.1em no-repeat;
	color: #111;
	font-size: 90%;
	font-style: italic;
	line-height: 1.4em;
	padding: 0.6em 1.4em 0.8em;
	border: 1px solid #ddd;
	border-left: 3px solid #b99;
}
blockquote.bbc_alternate_quote {
	background-color: #e9e9e9;
}
blockquote cite {
	font-style: normal;
	border-bottom: none;
}
blockquote cite::before {
	content: none;
}
.bbc_code {
	background: #f5f5f5;
	border: 1px solid #ddd;
	border-left: 3px solid #98aaba;
	border-radius: 0;
}
