/* --------------------------------- */
/* ------------- Fonts ------------- */
/* --------------------------------- */

html {
	scroll-behavior: smooth;
}


@font-face {
	font-family: 'KalamR';
	src: URL('../fonts/Kalam-Regular.ttf') format('truetype');
  }

@font-face {
	font-family: 'Grenze';
	src: URL('../fonts/GrenzeGotisch-Regular.ttf') format('truetype');
}

@font-face {
	font-family: 'Trajan';
	src: URL('../fonts/TrajanPro-Bold.otf') format('truetype');
}

@font-face {
	font-family: 'Bowlby';
	src: URL('../fonts/BowlbyOneSC-Regular.ttf') format('truetype');
}


/* @font-face {
	font-family: 'Trajan';
	src: URL('../fonts/TrajanPro-Bold.otf') format('truetype');
} */

/*
	font-family: 'Grandstander', cursive;
*/
  
.kalamR, .kalamR:link { font-family: KalamR; }
.grenze, .grenze:link { font-family: Grenze; }
.trajan, .trajan:link { font-family: Trajan; }
.bowlby, .bowlby:link { font-family: Bowlby; }
.mono, .mono:link { font-family: monospace; }

	
hr 
	{
		width: 75%; 
		color: #333; 
		height: 1px;
	}

h2 
	{
		font-family: 'Grenze';
		font-size: 38px;
		display: block;
		margin: 0px auto 5px auto;
		text-align: center;
		font-weight: normal;
	}

h3 
	{
		font-family: 'Grenze';
		font-size: 24px;
		display: block;
		margin: 0px auto 10px auto;
		text-align: left;
		font-weight: normal;
	}

/* --------------------------------- */
/* ------------- Links ------------- */
/* --------------------------------- */

a:link, a:visited, a:hover, a:active
	{
		font-size: 10px;
		color: red;
		/* text-decoration: none; */
	}

a:link,
a:visited,
a:hover,
a:active
	{
		font-family: inherit;
		font-size: inherit;
		color: #999;
	}
a.am:link,
a.am:visited,
a.am:hover,
a.am:active
	{
		font-size: 14px;
		color: #999;
	}


a.grey:link,
a.grey:visited,
a.grey:hover,
a.grey:active
	{
		font-size: 13px;
		color: #555;
	}
a.grey:hover,
a.grey:active
	{
		color: #666;
	}

a.link-normal:link,
a.link-normal:visited,
a.link-normal:hover,
a.link-normal:active
	{
		font-size: 13px;
		color: red;
	}

/* --------------------------------- */
/* ------------ General ------------ */
/* --------------------------------- */

.dis
	{
		font-size: 14px;
		color: white;
		padding: 10px;
		border: 1px solid #999;
	}

/* --------------------------------- */
/* ------------ Armory ------------- */
/* --------------------------------- */

.disp-armory-repair
	{
		color: #444;
		position: absolute;
		top: 30px;
		right: 0px;
	}

/* --------------------------------- */
/* ---------- Left Menu ------------ */
/* --------------------------------- */


div.menu-admin
	{
		padding-left: 15px;
		margin-top: 10px;
	}

div.menu-admin div:first-child
	{
		font-size: 18px;
		font-weight: bold;
		color: white;
	}

a.link-admin:link,
a.link-admin:visited,
a.link-admin:hover,
a.link-admin:active
	{
		font-size: 18px;
		font-family: Grenze;
		display: block;
		margin-bottom: -5px;
		color: white;
		-webkit-touch-callout: none; /* iOS Safari */
		-webkit-user-select: none; /* Safari */
		-khtml-user-select: none; /* Konqueror HTML */
		-moz-user-select: none; /* Old versions of Firefox */
		-ms-user-select: none; /* Internet Explorer/Edge */
		user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
	}

a.link-admin:link,
a.link-admin:visited
	{
		opacity: 0.8;
	}
a.link-admin:hover,
a.link-admin:active
	{
		opacity: 1;
	}


/* --------------------------------- */
/* ---------- Form Fieldd ---------- */
/* --------------------------------- */





.img-captcha
	{
		height: 104px;
		border-radius: 3px;
		border-style: solid;
		border-width: 1px;
		border-color: #777;
		margin-right: 2px;
	}
.img-captcha-text
	{
		height: 60px;
		border-radius: 3px;
		border-style: solid;
		border-width: 1px;
		border-color: #777;
		margin-right: 2px;
	}
input.captcha-text
	{
		margin-top: 6px;
		width: 176px;
	}


table.tab-captcha,
table.tab-recruiter
	{
		border-spacing: 0px;
	}
table.tab-captcha
{
	margin: 0px auto;
}

table.tab-captcha tr td,
table.tab-recruiter tr td
	{
		border-width: 0px !important;
		padding: 0px !important;
	}

table.tab-numpad
	{
		border-collapse: separate;
		border-spacing: 10px !important;
	}

table.tab-numpad tr td
	{
		border-width: 0px !important;
		padding: 0px !important;
	}




.upg_error
	{
		margin-top: -20px;
		margin-bottom: 12px;
		text-align: center;
		height: 12px;
	}

.user_label
	{
		font-family: Grenze;
		font-size: 28px;
		line-height: 16px;
		margin-bottom: -10px;
	}

img.img-safe
	{
		width: 150px;
	}

.report
	{
		font-family: monospace;
		font-size: 14px;
		font-weight: normal;
		/* font-family: KalamR;
		font-family: Grenze;
		font-family: Trajan;
		font-family: Bowlby; */
	}

.premium::before,
.premium::after	
	{
		content: '*';
		color: yellow;
		font-size: 12px;
		font-family: verdana;
	}

.notice-invalid
	{
		font-family: monospace;
		font-size: 18px;
		font-weight: normal;
		margin: 10px 0px 10px 5px;
		text-align: left;
	}



#recruiter-frame
	{
		height: 100px;
		width: calc( calc(100px * 5) + 3px);
		overflow: hidden;
		cursor: pointer;
		border: 1px solid #333;
		background-color: #050505;
		border-radius: 5px;
		border-collapse: separate;
	}
#recruiter-frame img
	{
		width: 100px;
	}

#latest-batch
	{
		opacity: 0.8;
	}

#queue_log
	{
		max-height: 140px;
		height: 140px;
		overflow-y: auto;
		overflow-x: hidden;
		padding: 0px;
		word-wrap: break-word;
	}

.rec-label
	{
		font-size: 11px;
		color: #666;
		margin-bottom: -2px;
		display: inline-block;
	}
.rec-value
	{
		font-size: 14px;
		display: inline-block;
	}
.rec-data
	{
		text-align: left;
		padding: 0px;
	}
.rec-head
	{
		margin-bottom: 5px;
		font-style: italic;
	}
.rec-body
	{
		margin-bottom: 10px;
		margin-left: 20px;
	}

.captcha_area
	{
		display: flex;
		justify-content: flex-end;
		align-items: flex-end;
		height: 140px;
	}

.btn-captcha
	{
		/* height: 100%; */
		height: 28px;
		width: 32px;
		display: flex;
		justify-content: center;
		align-items: center;
	}

input.numpad
	{
		height: 66px;
		width: 32px;
	}

.recruiter-intro
	{
		margin-top: -25px;
		margin-bottom: 10px;
	}

.editor
	{
		background-color: black !important;
		height: 600px !important;
	}

.race-label
	{
		font-size: inherit;
		color: inherit;
		font-style: italic;
	}

.reset-race
	{
		float: right;
		width: 300px;
	}
.reset-race img
	{
		width: 120px;
	}

.img-chat
	{
		max-height: 100px;
	}

.alert-title
	{
		margin-top: -10px;
	}

.img-delete
	{
		display: inline-block;
		margin-top: -4px;
	}

.help-heading
	{
		font-size: 16px;
		font-weight: bold;
		margin-left: 10px !important;
		margin-bottom: 15px !important;
		margin-top: 5px !important;
	}
.help-subheading,
.help-question
	{
		font-size: 14px !important;
		font-weight: bold;
		margin-bottom: 5px !important;
		margin-top: 10px !important;
	}
.help-question
	{
		font-style: italic;
	}
.help-text
	{
		margin-bottom: 5px;
	}
.help-list
	{
		margin-left: 20px;
		margin-bottom: 10px;
	}
.help-list div
	{
		margin-bottom: 3px;
	}
.help-bold
	{
		font-weight: bold;
		margin-bottom: 5px !important;
		margin-top: 5px !important;
	}


div.navigate
	{
		border: 1px solid #333;
		border-radius: 3px;
		background-color: #111;
		padding: 10px;
	}

div.navigate ul, ul.links-hor
	{
		/* text-align: center;  */
	/* 	list-style-type: none;
		margin: auto 0;
		padding: 0;
		overflow: hidden; */
		/* max-width: 500px; */
		/* background-color: #333333; */
		width: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
		list-style: none;
		margin: 0;
		padding: 0;
		flex-wrap: wrap;
  	}
  
div.navigate ul li, ul.links-hor li
	{
		/* float: left; */
  		margin: 0px 0px;
  	}
  
div.navigate ul li a, ul.links-hor li a 
  	{
		background-color: transparent;
		display: block;
		color: white;
		text-align: center;
		padding: 5px 10px;
		text-decoration: none;
		box-shadow: none;
		border-radius: 3px;

		-webkit-touch-callout: none; /* iOS Safari */
		-webkit-user-select: none; /* Safari */
		-khtml-user-select: none; /* Konqueror HTML */
		-moz-user-select: none; /* Old versions of Firefox */
		-ms-user-select: none; /* Internet Explorer/Edge */
		user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
  	}
div.navigate ul li a:hover, ul.links-hor li a:hover
  	{
		background-color: #151515;
		box-shadow: #444 0px 0px 8px 2px;
	}
div.navigate ul li a.selected, ul.links-hor li a.selected, ul.links-hor li a
  	{
		background-color: #222;
		border: 1px solid #333;
	}
ul.links-hor
  	{
		justify-content: left;
	}
ul.links-hor li a
  	{
		margin-right: 10px;
	}

div.contributor
	{
		margin: 10px;
	}

div.contributor .thanks
	{
		font-size: 20px;
		color: white;
		font-weight: bold;
		margin: 0px 0px 5px 0px;
	}
div.contributor .head
	{
		font-size: 20px;
		color: white;
		font-weight: bold;
		margin: 0px 0px 5px 0px;
	}
div.contributor .subhead
	{
		font-size: 13px;
		color: white;
		font-weight: bold;
		font-style: italic;
		margin: 5px 0px;
	}
div.contributor .list
	{
		font-size: 16px;
		color: white;
		margin: 5px 0px 5px 20px;
	}
div.contributor .list div
	{
		font-size: 13px;
		color: white;
		margin: 0px 0px 5px 0px;
	}


.help_section *
	{
		font-family: verdana;
	}

.help_section h1
	{
		font-size: 15px;
	}
.help_section h2
	{
		font-size: 16px;
		text-align: left;
	}
.help_section h3
	{
		font-size: 18px;
		font-weight: normal;
	}
.help_section h4
	{
		font-size: 24px;
	}
.help_section h5
	{
		font-size: 24px;
	}

.help_section p
	{
		margin-bottom: 10px;
	}
.help_section .s3
	{
		font-size: 8px;
	}
.help_section .s2
	{
		font-size: 10px;
	}
.help_section .s1
	{
		font-size: 12px;
	}
.help_section .l1
	{
		font-size: 14px;
	}
.help_section .l2
	{
		font-size: 15px;
	}
.help_section .l3
	{
		font-size: 16px;
	}
.help_section .l4
	{
		font-size: 18px;
	}
.help_section .l5
	{
		font-size: 20px;
	}
.help_section section
	{
		margin-bottom: 10px;
	}
.help_section article
	{
		margin-left: 20px;
		margin-bottom: 10px;
	}
.help_section div
	{
		margin-bottom: 5px;
	}
	
.help_section ul
	{
		margin-bottom: 10px;
	}
.help_section ul li
	{
		margin-bottom: 2px;
	}