/* BODY BACKGROUND */
body {
    color: #F8F8F8;
    background: url('/html/modern/bg.png') #21222A;
}
/* ALL BOX BORDERS */
table.generic td.title, table.generic td.header, table.generic td.cell1, table.generic td.cell2, td.postsidebar, ul.postmeta, td.border, td.bborder, td.nuborder, div.quote div.box, .top-inner-box {
	border-color: #3F3F45;
}
/* PAGE AREA WRAPPERS */
.top, .wrapper-body, #header-boxes > div {
    background: #3F3F45;
}
#footer, .top-inner, .wrapper-body-inner {
	box-shadow: 0 2px 4px rgba(0,0,0,.4) inset;
}
/* INSIDE PAGE WRAPPERS BG */
.top-inner, .wrapper-body-inner, #header-boxes > div > div {
    background: #1D1E26;
}
.topalt, #footer {
    background: #121417;
}
/* EVERY OTHER ROW HIGHLIGHT */
table.brdr tr:nth-child(even) > td, table.brdr tr:nth-child(even) > th, table.generic td.cell2 {
	background: #26272F;
}
/* TABLE HEADERS */
td.title, table.generic td.header, td.cat {
	background: #3F3F45 !important;
}
/* TABLE LINE */
td.line {
    background-color: #3F3F45 !important;
}
/* TABLE HEADER HYPERLINKS */
td.title a, td.cat a {
	color: #F3AC94;
}
/* FOOTER */
#footer {
	color: rgba(248,248,248,.75);
	text-shadow: 0 1px 1px black;
}
/* BORDER COLOURS ON TOP AND BOTTOM AREAS LIKE TOPALT */

/* GLOBAL MESSAGE & TOP OF PAGE */
#header-globalmsg > div {
    background: #1D1E26 !important;
}
#header-globalmsg > div > span { /* TEXT COLOUR OF GLOBALMSG */
	color: #F8F8F8 !important;
}
#header-globalmsg > div > span > a { /* HYPERLINK COLOUR OF GLOBALMSG */
	color: #F79F6A !important;
}
/* HR, HYPERLINKS */
a:link, a:visited {
    color: #F79F6A;    
}
.admin, a.admin {               
    color: #F3AC94;     
}
.user, a.user, .ex a, #footer a {             
    color: #71B7DF;     
}
.stats, td.cat, a.stats {      	
    color: #8FB3F7;     
}
/* FORM ELEMENTS */
/* ALL FORM ELEMENTS */
input:not([type="submit"]):not([type="reset"]):not([type="button"]), select, textarea, .form-multi {
	background: #07090F;
    border-color: rgba(0,0,0,0);
    box-shadow: 0 0 0 2px rgba(0,0,0,.3);
}
/* FOCUSED/ACTIVE ELEMENTS */
input:not([type="submit"]):not([type="reset"]):not([type="button"]):focus, textarea:focus, select:focus, select:active {
    box-shadow: 0 0 0 2px #F79F6A;
}
/* BUTTONS */
input[type="submit"], input[type="reset"], input[type="button"], button {
	background: #121417;
	color: #6DA6ED;
	text-shadow: 0 1px 2px rgba(0,0,0,.3);
}
/* CLICKING BUTTON */
input[type="submit"]:active, input[type="reset"]:active, input[type="button"]:active, button:active {
    box-shadow: 0 0 0 3px rgba(0,0,0,.45) inset;
}
/*CODES*/
div.code span.boxhead, div.code pre.box {
    color: #80D010;
    border-color: #80D010;
}

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

/* BODY BACKGROUND */
.gray, a.gray {             	
    color: #999999;
}
.warning {                  	
    color: #B53121;     
}
.new {                      	
    color: #FAD13D;     
}
.off {                      
    color: #ADADBC;    
}

/* FORM ELEMENTS */
/* ALL FORM ELEMENTS */

/* MAIN CUSTOM ELEMENTS AND MODIFICATIONS */
body {
	font: 14px / 1.3 "Roboto", sans-serif;
}
body, html {
	margin: 0;
	padding: 0;
}

#wrap {
	padding-top: 16px;
}

.top {
	margin: 0 16px;
}

.top, .wrapper-body {
	padding: 10px;
	box-shadow: 0 1px 2px rgba(0,0,0,.25);
	border: 0;
	border-radius: 4px;
}
.wrapper-body > h3 {
	padding: 0 0 10px 0;
	margin: 0;
	font-size: 12pt;
	text-align: center;
	text-shadow: 0 1px 1px rgba(0,0,0,.3);
}
.wrapper-body-inner {
	padding: 6px;
}
.top-inner-box {
	border-bottom: 2px solid #3F3F45;
}
.top-inner-box:last-child {
	border-bottom: 0;
}
.full {
	width: 100%;
	border-collapse: collapse;
}

#footer {
	border-top: 1px solid #3F3F45;
	padding: 20px 0 40px 0;
	font-size: 14px;
	line-height: 22px;
	text-align: center;
    margin-top: 40px;
}
#footer-box {
	max-width: 960px;
	margin: auto;
}
#footer p.affiliates img {
	vertical-align: top;
}

#main {
	display: flex;
	align-items: flex-start;
	box-sizing: border-box;
	position: relative;
	width: 100%;
	padding: 0 20px;
}
#content {
	position: relative;
	flex: 1;
	margin-right: 24px;
}
nav#mainmenu-wrapper {
	order: 20;
	flex: 0 0 215px;
}
/*#mainmenu a {
    font-weight: bold;
}*/
nav#mainmenu-wrapper .wrapper-body + .wrapper-body {
	margin-top: 24px;
}
#social h3 {
	margin-top: 0 !important;
}

/* NEW TABLES CSS FILES THAT SOME PAGES USE */
table.generic {
	width: 100%;
	border-collapse: collapse;
}

table.generic td.title, table.generic td.header, table.generic td.cell1, table.generic td.cell2 {
	border: 1px solid #3F3F45;
}

table.generic td.title, table.generic td.header {
	text-align: center;
	font-weight: bold;
	padding: 2px;
	white-space: nowrap;
}

table.generic td.cell1, table.generic td.cell2 {
	padding: 4px;
}

table.grid {
	width: 100%;
}

td.space {
	background: transparent !important;
}

table.grid td {
	padding: 0;
}

div.spacer {
	height: 20px;
}

td.postsidebar {
	padding: 8px;
	width: 150px;
	font-size: 11px;
    border: 1px solid #3F3F45;
	line-height: 15px;
}
td.postsidebar .small {
	font-size: 11px;
}
td.postsidebar .un-outer {
	font-size: 14px;
}

ul.postmeta {
	font-size: 10px;
	margin: 0;
	padding: 1px 4px;
	list-style-type: none;
	border-bottom: 1px solid #3F3F45;
	white-space: nowrap;
}

li.postinfo {
	margin-right: 220px;
}

span.lastedit {
	border-bottom: 1px dotted #ffffff;
}

li.postmenu {
	width: 220px;
	float: right;
}

div.postcontainer {
	clear: both;
}

div.postpadding {
	padding: 4px;
}
div.avatar {
	max-width: 150px;
	max-height: 150px;
	overflow: auto;
}
div.usertitle {
	max-width: 150px;
	overflow: hidden;
	font-size: 10px;
}
.userstatus {
	font-size: 10px;
	font-weight: bold;
}

.small {
	font-size: 10px;
}




/* SMALL CHANGES TO EXISTING CSS, COLOURS, BORDERS ETC */
a:link, a:visited {
	text-decoration: none;
}

a:hover, a:active, a:focus {
	text-decoration: underline;
	background: linear-gradient(to bottom, currentColor -25000%, transparent 10000%);
}
a.js-link {
	cursor: pointer;
}
a.un, span.un {
	font-weight: bold;
}
.stats {
    font-weight: bold;
}
img {
	border: 0;
}
hr {
	margin: 16px auto;
	border: none;
    border-bottom: 1px solid #3F3F45;
	width: 90%;
}
form {
	margin: 0;
}



input:not([type="submit"]):not([type="reset"]):not([type="button"]), select, textarea, .form-multi {
	border: 1px solid rgba(0,0,0,0);
	border-radius: 6px;
	padding: 4px;
	color: inherit;
}
input:not([type="submit"]):not([type="reset"]):not([type="button"]):focus, textarea:focus {
	border-color: transparent;
	outline: none;
}
select:focus, select:active {
	outline: none;
}
input {
	font-family: roboto, tahoma, sans-serif;
	font-size: 10pt;
}
input[type="submit"], input[type="reset"], input[type="button"], button {
	cursor: pointer;
	padding: 8px;
	border: none;
	border-radius: 4px;
	font-weight: bold;
	font-size: 11pt;
}
select.mini {
	font-size: 9pt;
}
div.ex {
	padding-left: 14px;
	position: relative;
	z-index: 1;
}
nav#mainmenu-wrapper .menutoggle {
	background-image: url('/html/modern/Filled.png');
	background-repeat: no-repeat;
	background-position: center;
	height: 16px;
	margin: 5px 0;
}
nav#mainmenu-wrapper .menutoggle > img {
	display: none;
}
nav#mainmenu-wrapper .menutoggle.closed {
	background-image: url('/html/modern/Unfilled.png');
}
td.menu img {
	margin-top: 2px;
	margin-bottom: 2px;
	vertical-align: top;
}
div.hr {
	background: url('/html/modern/HRLoggedOut.png') center center no-repeat;
	height: 16px;
}
table.brdr {
	width: 100%;
	border-collapse: collapse;
}
td.normal, td.news, td.shot, td.pad, td.rope {
	padding: 4px;
}
td.border {
	border: 1px solid #3F3F45;
}
td.bborder {
	border-bottom: 2px solid #3F3F45;
}
td.nuborder {
	border-left: 2px solid #3F3F45;
	border-right: 2px solid #3F3F45;
	border-bottom: 2px solid #3F3F45;
}
td.space {
	height: 22px;
}
td.vspace {
	width: 22px;
}
td.line {
	height: 3px;
}
td.title, td.cat {
	font-weight: bold;
	padding: 2px;
}
td.head {
	font-weight: bold;
}
div.quote {
	margin-left: 40px;
	margin-right: 40px;
}
div.quote span.boxhead {
	font-size: 11px;
}
div.quote div.box {
	margin-top: 2px;
	padding: 3px;
	border: 1px solid #3F3F45;
}
div.code {
	margin-left: 40px;
	margin-right: 40px;
}
div.code span.boxhead {
	font-size: 11px;
	color: #00FF00;
}
div.code pre.box {
	margin: 2px 0 0 0;
	padding: 3px;
	font-family: monospace;
	border: 1px solid #80D010;
}
div.code pre.box.hljs {
	color: inherit;
}
.nowrap {
	white-space: nowrap;
}
.center	{
	text-align: center;
}
.right {
	text-align: right;
}
.selected {
	text-decoration: underline;
}
.new, .off, .warning {
	text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000, 0 0 3px #fff;
    font-weight: bold;
}

.ui-state-hover, .ui-state-active {
	background-color: #0033FF;
}
.ui-menu {
	background-color: black;
	border: 1px solid #999;
	width: 150px;
	padding: 2px;
	position: absolute !important;
}

.ui-menu-item {
	list-style-type: none;
	padding: 0;
	margin: 0;	
}
.ui-menu-item a {
	display: block;
	cursor: default;
}
.ui-menu-item a:hover {
	text-decoration: none;
}

.form-multi {
	overflow-y: auto;
	cursor: text;
	width: 480px;
    height: 84px;
}
.form-multi:focus-within {
	border-color: transparent;
	box-shadow: 0 0 0 2px rgba(143,183,239,.5);
	outline: none;
}
.form-multi ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}
.form-multi li {
	float: left;
	margin: 2px;
	line-height: 22px;
	padding: 0 5px;
}

.form-multi-item {
	border: 1px solid #999;
	white-space: nowrap;
}
.form-multi-item a {
	cursor: pointer;
}

.form-multi-input-container {
	border: 1px solid transparent;
}
.form-multi-error {
	border: 1px solid #F00;
	background-color: #300;
}
.form-multi-ruler, .form-multi-input[type=text], .form-multi-input[type=text]:focus {
	border: 0;
	padding: 0;
	margin: 0;
	outline: 0;
	font-size: 14px;
}
.form-multi-input, .form-multi-input:focus {
	width: 32px;
	background-color: transparent !important;
	box-shadow: none !important;
	border: none !important;
	padding: 0 !important;
	border-radius: 0 !important;
}
.form-multi-remove {
	font-weight: bold;
}	

#section-form-images {
	list-style-type: none;
	margin: 0;
	padding: 0;
}
#section-form-images li {
	margin: 1px;
	padding: 2px;
	width: 128px;
	background-color: #000000;
	border: 1px solid #999999;
	float: left;
}
#section-form-images a {
	float: right;
}
#section-form-images input {
	margin: 6px 0 0 6px;
	padding: 0;
}
.section-form-image {
	width: 128px;
	height: 112px;
	margin-top: 2px;
	cursor: default;
	background-repeat: no-repeat;
	background-position: center center;
}
.section-form-image-inner {
	width: 100%;
	height: 100%;
}
.section-form-image-inner-inactive {
	background-image: url('/images/dim.png');
}

a.image-list-item-current {
	color: #ffffff;
	text-decoration: underline;
}
#screenshotContainer {
	background-repeat: no-repeat;
	background-position: center center;
}

.obsoletewarning {
	border: 1px solid #bbbb22;
	padding: 3px 6px;
}

/* HEADER */
#header {
	display: flex;
	position: relative;
	height: 224px;
	overflow: hidden;
}
#header-background, #header-shading {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}
#header-background {
	background: url('/assets/images/header/header.php') repeat-x #0D1B28;
	image-rendering: -webkit-optimize-contrast;
	image-rendering: crisp-edges;
	image-rendering: pixelated;
	filter: blur(2.5px);
	z-index: 0;
}
#header-shading {
	background-image: linear-gradient(to bottom, rgba(10, 10, 10, 0) 0%, rgba(40, 45, 50, 0.4) 2%, rgba(60, 40, 45, 0.2) 60%, rgba(60, 40, 45, 0.35) 100%);
	z-index: 1;
}
#header > a {
	float: left;
	display: block;
	height: 100%;
	margin: 37px 32px;
	width: 431px;
	height: 150px;
	z-index: 2;
	background: none;
}
#header-boxes {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-end;
	z-index: 2;
}
#header-boxes > div {
	position: relative;
	margin: 0 0 16px;
	max-width: calc(100vw - 527px);
	float: left;
	box-sizing: border-box;
	padding: 8px;
	box-shadow: 0 1px 2px rgba(0,0,0,.25);
	border: 0;
	border-radius: 4px;
}
#header-globalmsg:empty {
	display: none;
}
#header-boxes > div > div {
	border: 0 !important;
	margin: 0 !important;
	padding: 6px 16px !important;
}
#header-globalmsg > div {
	text-align: center;
	width: auto !important;
	font-size: inherit !important;
}

@media screen and (max-width: 960px) {
	#header {
		flex-direction: column;
		align-items: center;
		height: auto;
	}
	#header-background {
		height: 224px;
		background-size: cover;
		background-repeat: no-repeat;
	}
	
	#header > a {
		display: flex;
		align-items: center;
		justify-content: center;
		flex: 1;
		margin: 16px;
		width: 100%;
		max-width: 90vw;
	}
	#header > a > img {
		max-width: 100%;
	}
	
	#header-boxes {
		width: 100%;
	}
	#header-boxes > div {
		margin: 0;
		width: 100%;
		max-width: none;
		padding: 6px;
		border-radius: 0;
	}
	#header-boxes > div:not(:last-child) {
		padding-bottom: 0;
	}
}


.topalt {
	border-top: 1px solid #3F3F45;
	border-bottom: 1px solid #3F3F45;
}
.topalt-box {
	border-bottom: 1px solid #3F3F45;
	padding: 10px 24px;
}
.topalt-box:last-child {
	border-bottom: none;
}
.topalt-box small {
	font-size: 12px;
}
.topalt-box .normal {
	padding: 0;
}
.topalt-box .rope {
	padding: 0;
	font-size: 13px;
}