/*****************************************************************
 ** New Frontiers theme for FluxCP (loaded after flux.css).     **
 ** Gold + light brown, centred layout, matches the launcher.   **
 ** Layout markup: header.php / footer.php / main/topnav.php /  **
 ** main/loginbox.php of the default theme.                     **
 *****************************************************************/

/* ---------- page ---------- */
html { background: #b68a52; }
body.nf {
	margin: 0; padding: 0 0 30px;
	font: 14px/1.5 Georgia, 'Times New Roman', serif; color: #3b2a18;
	background: #c9a26b;
	background: radial-gradient(ellipse at 50% 0%, #f0dfb8 0%, #dcbf8c 30%, #c49a60 70%, #a97c45 100%) fixed;
	min-height: 100vh;
}
body.nf table, body.nf input, body.nf select, body.nf textarea { font-family: Georgia, 'Times New Roman', serif; font-size: 13px; }
a { color: #8a4f0e; }
a:hover { color: #b8741a; text-decoration: underline; }

#nf-wrap { max-width: 1120px; margin: 0 auto; padding: 0 16px; }

/* ---------- header / logo ---------- */
#nf-header { text-align: center; padding: 26px 0 8px; }
#nf-header #logo { display: inline-block; width: 620px; max-width: 100%; height: auto;
	filter: drop-shadow(0 6px 10px rgba(70, 40, 10, .35)); }

/* ---------- gold menu bar ---------- */
#nf-navbar {
	position: relative; z-index: 20; text-align: center;
	background: #d9a13d;
	background: linear-gradient(to bottom, #f7dc8e 0%, #e3b04d 45%, #c48a26 55%, #d9a13d 100%);
	border: 1px solid #6e4412; border-radius: 4px;
	box-shadow: inset 0 1px 0 #fff3c4, 0 0 0 3px rgba(231, 196, 106, .55), 0 6px 14px rgba(60, 35, 10, .35);
}
#nf-navbar:before, #nf-navbar:after { content: '\25C6'; position: absolute; top: 50%; margin-top: -10px;
	color: #fff3c4; font-size: 14px; text-shadow: 0 0 6px #fff2c4, 0 1px 1px #6e4412; }
#nf-navbar:before { left: 12px; } #nf-navbar:after { right: 12px; }
#nf-menu-toggle { display: none; }

.nf-menu { display: inline-block; margin: 0; padding: 0; list-style: none; }
.nf-menu > li { position: relative; display: inline-block; vertical-align: top; }
.nf-menu > li > a, .nf-menu > li > .nf-cat-name {
	display: block; padding: 11px 18px; cursor: pointer;
	font: 700 15px Cinzel, Georgia, serif; letter-spacing: 1px; color: #3b2208;
	text-shadow: 0 1px 0 rgba(255, 240, 190, .8); text-decoration: none;
}
.nf-menu > li > .nf-cat-name small { font-size: 10px; }
.nf-menu > li:hover > a, .nf-menu > li:hover > .nf-cat-name, .nf-menu > li.open > .nf-cat-name {
	background: rgba(255, 246, 214, .38); color: #2a1604; text-decoration: none; }
.nf-menu > li.current > a, .nf-menu > li.current > .nf-cat-name {
	color: #fff8e2; text-shadow: 0 1px 2px rgba(60, 30, 0, .9);
	background: rgba(110, 68, 18, .55); box-shadow: inset 0 2px 5px rgba(50, 25, 0, .5); }

/* guest LOGIN button */
.nf-menu > li.nf-login > a { margin: 5px 0 5px 10px; padding: 6px 20px; border: 1px solid #6e4412; border-radius: 3px;
	color: #fff8e2; text-shadow: 0 1px 2px rgba(60, 30, 0, .9); background: #8a5a1c;
	background: linear-gradient(to bottom, #b57b1d 0%, #8a5a1c 100%); box-shadow: inset 0 1px 0 rgba(255, 230, 160, .5); }
.nf-menu > li.nf-login:hover > a, .nf-menu > li.nf-login.current > a { background: #6e4412; color: #fff; }

.nf-drop {
	display: none; position: absolute; top: 100%; left: 50%; margin: 0 0 0 -110px; padding: 6px 0; width: 220px;
	list-style: none; text-align: left; z-index: 30;
	background: #fbf1d8; border: 1px solid #9c6b25; border-top: 3px solid #c8952f; border-radius: 0 0 4px 4px;
	box-shadow: 0 10px 18px rgba(60, 35, 10, .35);
}
.nf-cat:hover > .nf-drop, .nf-cat.open > .nf-drop { display: block; }
.nf-drop li a { display: block; padding: 7px 18px; color: #4a2e14; font-size: 14px; text-decoration: none; }
.nf-drop li a:hover { background: #f1d99c; color: #2a1604; }
.nf-drop li.current a { font-weight: bold; color: #7a4a12; background: #f6e5b8; }

/* ---------- account bar ---------- */
#nf-main { margin-top: 22px; }
#loginbox {
	margin: 0 0 14px; padding: 9px 16px; text-align: center; color: #4a2e14;
	background: rgba(251, 241, 216, .85); border: 1px solid #b8862e; border-radius: 4px;
	box-shadow: inset 0 0 12px rgba(200, 150, 60, .25);
}
#loginbox a { font-weight: bold; }
.loginbox-admin-menu { margin-top: 5px; padding-top: 5px; border-top: 1px dotted #c9a45e; color: #7a4a12; font-size: 13px; }
.loginbox-admin-menu .nf-sep { color: #c8952f; font-size: 9px; padding: 0 3px; }

/* ---------- content panel ---------- */
#content {
	position: relative; padding: 26px 34px 30px; color: #3b2a18;
	background: #f6e9c8;
	background: linear-gradient(to bottom, #fcf5e2 0%, #f5e6c2 70%, #efdcb0 100%);
	border: 1px solid #9c6b25; border-radius: 4px;
	box-shadow: 0 0 0 3px #e7c46a, 0 0 0 4px #8a5a1c, 0 12px 24px rgba(60, 35, 10, .4), inset 0 0 30px rgba(190, 140, 60, .22);
}
#content:before, #content:after { content: '\25C6'; position: absolute; top: -15px; font-size: 18px; color: #c8952f;
	text-shadow: 0 0 5px #fff2c4; }
#content:before { left: 50%; margin-left: -80px; } #content:after { right: 50%; margin-right: -80px; }

#content h2 { margin: 0 0 16px; padding-bottom: 10px; text-align: center; letter-spacing: 1px;
	font: 700 26px Cinzel, Georgia, serif; color: #6b3f10; text-shadow: 0 1px 0 #fff6dc;
	border-bottom: 2px solid #d9b369; }
#content h3 { font: 700 17px Cinzel, Georgia, serif; text-transform: none; color: #7a4a12;
	margin: 22px 0 8px; padding-bottom: 4px; border-bottom: 1px solid #dcc08a; }
#content h3:first-letter { font-weight: 700; }
#content h4 { font-family: Cinzel, Georgia, serif; color: #7a4a12; }

/* ---------- tables ---------- */
.horizontal-table th, .vertical-table th, .generic-form-table th, .install_table th {
	background: #ebd197; background: linear-gradient(to bottom, #f3dea8 0%, #e3c37d 100%);
	color: #3b2208; border-color: #c8a25c; }
.horizontal-table td, .vertical-table td, .install_table td { background: #fffaf0; border-color: #dcc28e; }
.horizontal-table tr:nth-child(even) td { background: #fbf2de; }
.horizontal-table tr:hover td { background: #f6e6bf; }
.horizontal-table th a, .vertical-table th a, .sortable { color: #5a3510; }
#server_status, .woe-table, .shop-table td, .info-text, .generic-form, .generic-form-div, .raw-txn-log {
	background: #fffaf0; border-color: #dcc28e; }
#server_status th, #server_status td, .woe-table th { border-color: #e3cc9c; }
.top-ranked td { background: #f6e2a8; color: #2a1604; }
.item-drop-mvp td { background: #fbeccd; }
.item-drop-card td { background: #f3ecd4; }
.equipped td { background: #f9ecc8; }
.character-stats .stat-value { color: #2a1604; }

/* ---------- forms ---------- */
input[type=text], input[type=password], input[type=file], input[type=email], input[type=number], textarea, select {
	background: #fffdf7; color: #3b2410; border: 1px solid #c9ad7c; border-radius: 3px; }
input[type=submit], input[type=button], input[type=reset], button, .submit_button {
	padding: 6px 16px; cursor: pointer; font: 700 13px Cinzel, Georgia, serif; letter-spacing: .5px; color: #fff8e2;
	border: 1px solid #6e4412; border-radius: 3px; text-shadow: 0 1px 2px rgba(70, 35, 0, .8);
	background: #c98f2c; background: linear-gradient(to bottom, #f5d27a 0%, #d9a13d 48%, #b57b1d 52%, #c98f2c 100%);
	box-shadow: inset 0 1px 0 #fff0b8, 0 2px 4px rgba(70, 40, 10, .35); }
input[type=submit]:hover, input[type=button]:hover, button:hover, .submit_button:hover {
	color: #fff; border-color: #5a360c;
	background: linear-gradient(to bottom, #ffe39a 0%, #e8b451 48%, #c48a26 52%, #d9a038 100%); }
.search-form, .search-form2 { border-top-color: #dcc28e; }
.search-form p, .search-form2 p { color: #7a5a30; border-bottom-color: #e3cc9c; }
.search-form label, .search-form2 label { color: #3b2a18; }
.search-form input[type=submit], .search-form input[type=button], .search-form input[type=reset] { font-size: 11px; padding: 3px 10px; }

/* ---------- messages ---------- */
.message { color: #fff3d6; background: #6b3f10; border: 1px solid #c8952f; border-radius: 3px;
	box-shadow: inset 0 0 0 1px #8a5a1c; }
.notice { color: #4a2e14; background: #fbf1d8; border: 1px solid #c8952f; border-radius: 3px; }
.red { background: #9a2c14; border-radius: 3px; }
.green { background: #4d7a2a; border-radius: 3px; }
.note { color: #4a2e14; background: #f3e3bd; border-left: 3px solid #c8952f; }
.up { color: #3d8a1e; } .down { color: #b3261e; }
.not-applicable, .offline { color: #9c8a6c; }
.keyword, .hold-hours { color: #b8741a; }

/* ---------- sub menu / page menu / paging ---------- */
#submenu { margin-bottom: 10px; color: #9c7a44; text-align: center; font-size: 13px; }
#submenu a { color: #7a4a12; }
.current-sub-menu { color: #3b2208 !important; }
#pagemenu { color: #7a5a30; border-color: #dcc28e; text-align: center; }
#pagemenu a { color: #7a4a12; }
#pagemenu a:hover { color: #b8741a; }
.pages { color: #b09364; border-top-color: #dcc28e; }
.pages .page-prev, .pages .page-next, .action a, .action span.anchor, .block-link, .shop-item-action a { color: #8a4f0e; }
.pages .current-page { color: #3b2208; }
.action, .td-action, .shop-item-action { color: #c9ad7c; }
.action a, .action span.anchor, .block-link, .shop-item-action a { border-bottom-color: #e3cc9c; }
.toggler a { color: #8a4f0e; }
.credit-balance { background: #fbf1d8; border-color: #c8952f; }

/* ---------- footer ---------- */
#nf-footer { margin-top: 26px; text-align: center; color: #4a2e14; font-size: 13px; text-shadow: 0 1px 0 rgba(255, 240, 205, .6); }
#nf-footer p { margin: 2px 0; }
.nf-footer-mark { color: #fff3c4; font-size: 16px; text-shadow: 0 0 6px #e7c46a, 0 1px 1px #6e4412; }
.nf-footer-title { font: 700 16px Cinzel, Georgia, serif; letter-spacing: 2px; color: #5a3510; }
.nf-footer-tools { margin: 10px 0 6px; }
.nf-footer-tools span { display: inline-block; margin: 0 8px; }
.nf-footer-tools select { font-size: 12px; padding: 1px 4px; }
#nf-footer #info, #nf-footer #copyright { font-size: 11px; font-style: italic; color: #6b4a25; }

/* ---------- small screens ---------- */
@media (max-width: 780px) {
	#nf-wrap { padding: 0 10px; }
	#nf-header { padding-top: 14px; }
	#nf-menu-toggle { display: block; padding: 11px; cursor: pointer; font: 700 15px Cinzel, Georgia, serif; color: #3b2208; }
	#nf-navbar:before, #nf-navbar:after { display: none; }
	#nf-nav { display: none; border-top: 1px solid #a8741c; }
	#nf-nav.show { display: block; }
	.nf-menu { display: block; }
	.nf-menu > li { display: block; }
	.nf-drop { position: static; width: auto; margin: 0; border-width: 1px 0 0; border-radius: 0; box-shadow: none; }
	#content { padding: 18px 14px 22px; }
	#content h2 { font-size: 21px; }
	.horizontal-table { display: block; overflow-x: auto; }
}
