html {
  overflow-y: scroll;
}
body {
	background-color:#000000;
	color:#E59F3A;
	margin-right:1rem;
	margin-left:1rem;
	margin-top:1rem;
	font-family:Arial,Helvetica,sans-serif;
	position:relative;
	min-width:800px;
	z-index:1;
}
br {display:none;}
.NavBar {
	background-color:#FF9600;
	color:#000000;
	font-style:italic;
	text-align:center;
	font-weight:bold;
	vertical-align:middle;
	margin-bottom:1rem;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	text-align:left;
	max-width:1000px;
	min-width:calc(800px - 2rem);
}

.Head {
	overflow:hidden;
	font-size:6.5rem;
	height:85px;
	vertical-align:baseline;
	text-align:center;
}

.NavBar:before,.NavBar:after {
	content:'';
	position:absolute;
	top:0;
	width:calc(( 100vw - 1000px - 2rem) / 2);
	height:100%;
	display:block;
}
.NavBar:before{left:calc(( 100vw - 1000px - 2rem) / (-2) );}
.NavBar:after {right:calc(( 100vw - 1000px - 2rem) / (-2) );}
.NavBar:nth-of-type(1):before{background:#FF9600;}
.NavBar:nth-of-type(1):after {background:#FF9600;}
.NavBar:nth-of-type(2):before{background:linear-gradient(45deg,#AA6400,#FF9600 10%);}
.NavBar:nth-of-type(2):after {background:linear-gradient(-45deg,#AA6400,#FF9600 10%);}
.NavBar:nth-of-type(3):before{background:linear-gradient(55deg,#714300,#FF9600 20%);}
.NavBar:nth-of-type(3):after {background:linear-gradient(-55deg,#714300,#FF9600 20%);}
.NavBar:nth-of-type(4):before{background:linear-gradient(60deg,#4B2D00,#FF9600 30%);}
.NavBar:nth-of-type(4):after {background:linear-gradient(-60deg,#4B2D00,#FF9600 30%);}
.NavBar:nth-of-type(5):before{background:linear-gradient(65deg,#321E00,#FF9600 40%);}
.NavBar:nth-of-type(5):after {background:linear-gradient(-65deg,#321E00,#FF9600 40%);}
.NavBar:nth-of-type(6):before{background:linear-gradient(70deg,#211400,#FF9600 50%);}
.NavBar:nth-of-type(6):after {background:linear-gradient(-70deg,#211400,#FF9600 50%);}
.NavBar:nth-of-type(7):before{background:linear-gradient(75deg,#160D00,#FF9600 60%);}
.NavBar:nth-of-type(7):after {background:linear-gradient(-75deg,#160D00,#FF9600 60%);}
.NavBar:nth-of-type(8):before{background:linear-gradient(80deg,#0F0900,#FF9600 70%);}
.NavBar:nth-of-type(8):after {background:linear-gradient(-80deg,#0F0900,#FF9600 70%);}
.NavBar:nth-of-type(9):before{background:linear-gradient(85deg,#0A0600,#FF9600 80%);}
.NavBar:nth-of-type(9):after {background:linear-gradient(-85deg,#0A0600,#FF9600 80%);}
.NavBar:nth-of-type(n+10):before{background:linear-gradient(to right,#000000,#FF9600 90%);}
.NavBar:nth-of-type(n+10):after {background:linear-gradient(to left,#000000,#FF9600 90%);}

.NavBar:nth-of-type(2) {
	height:1.8rem;
	line-height:1.8rem;
	margin-bottom:calc(1rem*0.75);
	font-size:1.3rem;
}
.NavBar:nth-of-type(3) {
	height:1.75rem;
	line-height:1.75rem;
	margin-bottom:calc(1rem*0.56);
	font-size:1rem;
}
.NavBar:nth-of-type(4) {
	height:1.67rem;
	line-height:1.67rem;
	margin-bottom:calc(1rem*0.375);
	font-size:1rem;
}
.NavBar:nth-of-type(1n+5){
	height:1.5rem;
	line-height:1.5rem;
	margin-bottom:calc(1rem*0.25);
	font-size:1rem;
}

.Error {
    background-color:#FF0000;
    color:#000000;
    z-index:-1;
}

.NavElement,.NavLink {
	margin-left:1rem;
}

.NavLink {
	display: inline-block;
	min-width:20%;
}

.NavBar a:link {
	color:black;
	text-decoration:none;
}
.NavBar a:visited {
	color:black;
	text-decoration:none;
}
.NavBar a:hover {
	color:white;
	text-decoration:none;
}
.Game {
	position:relative;
	width:700px;
	height: 128px;
	margin: 10px auto;
	clear:left;
	border: 1px dashed silver;
}

.ServerName,.WinLine,.dateline,.players,.Dcrec{
	position:absolute;
	width:284px;
	height:18px;
	line-height:18px;
	vertical-align:middle;
	left:132px;
}
	

table,th,td {border:0;border-collapse: collapse;padding:0px;}

.dateline {
	left:416px;
	table-layout: fixed;
	width:284px;
	}
.date,.stime,.till,.etime {text-align:right;color:white}


.date {width:158px;color:lightgrey;}
.stime {width:50px;padding-right:6px;}
.etime {width:46px;padding-right:10px;}
.till {width:14px;text-align:center;}

.WinLine {
	top:72px;
	left:300px;
}

.players {
	left:132px;
	top:18px;
	width:568px;
	table-layout: fixed;
}

.players tr {
	float:left;
	width:283px;
}
.players tr:nth-of-type(2n){
	float:right;
}
.players tr:nth-of-type(2n-1){
	border-right: 1px solid white;
}
.players td {
	white-space: nowrap;
	overflow:hidden;
}
.players td:nth-of-type(3n-2){
	min-width:21px;
	max-width:21px;
	padding-left:6px;
}
.players td:nth-of-type(3n-1){
	min-width:200px;
	max-width:200px;
}
.players td:nth-of-type(3n){
	min-width:46px;
	max-width:46px;
	text-align:right;
	padding-right:10px;
	color:white;
}

.Red {color:#C83232;}
.Green {color:#32C832;}
.Blue {color:#3232FF;}
.Yellow {color:#C8C832;}
.Orange {color:#FF9600;}
.Truq {color:#00C8C8;}
.White {color:white;}
.Grey {color:lightgrey;}
.Alliances {
	float:left;
	width:128px;
	height:128px;
}

.Dcrec {
	top:108px;
	color:lightblue;
}

.Dcrec a:link {
	color:aqua;
}
.Dcrec a:visited {
	color:grey;
}
.paging1 {
	margin: auto;
	text-align:center;
	width:700px;
}
.paging1 a {
	margin: auto 6px;
}

.paging1 a:link {
	color:white;
	text-decoration:none;
}

.paging1 a:visited {
	color:white;
	text-decoration:none;
}

.paging1 a:hover {
	color:#E59F3A;
	text-decoration:underline;
}

.ConNum {
	display:inline-block;
	width:1.2rem;
	margin-left:1rem;
	text-align:right;
}
.Error>.ConNum {
	margin-right:1rem;
}
button,select,input {
	background:#000000;
	color:#E59F3A;
	border:1px solid white;
	outline:1px solid black;
	font-family:Arial,Helvetica,sans-serif;
	font-size:1em;
	font-weight:bold;
	margin-right:5px;
}

input[type=date]{
	width:5.5rem;
	text-align:center;
}
input[type=time]{
	width:3rem;
	text-align:center;
}
input[type=text]{
	width:16rem;
	padding:0px;
}
label {
    display: inline-block;
    cursor: pointer;
}
label:before {
    content: "";
    display: inline-block;
 
    width: 0.5rem;
    height: 0.5rem;
    border-radius:0.25rem;
 
    position: relative;
    left: -0.5rem;
    bottom: 1px;
    background-color: white;
}
input[type=radio]:checked + label:before {
    content: '';
   background-color: black;
   border:2px solid white;
   box-sizing: border-box;
}
input[type=radio] {
    display: none;
}

input.readonly{
	color:black;
	background-color:#FF9600;
	border: 1px solid black;
	outline:0;
}
input.readonly[name*=main] {
	width:7.7rem;
	padding-left:1rem;
}
input.readonly[name*=InEx],input.readonly[name*=Exact] {
	width:6rem;
	font-style:italic;
	text-align:center;
}
input.readonly[name*=Name],input.readonly[name*=Type]  {
	width:15rem;
	padding-left:1rem;
}

button:hover {
	border-color:#FFFFFF;
	color:#FFFFFF;
}

.DoSearch,.Add,.Remove{
	display:block;
	position:absolute;
	margin:0;
	background:#FF9600;
	color:black;
	border:0;
	outline:0;
}
	
.Add,.Remove {
	vertical-align:middle;
	text-align:center;

}
.DoSearch {
	right:1.5em;
	bottom:-1em;
	width:5em;
	border-bottom-right-radius:8px 20px;
	border-bottom-left-radius:8px 20px;
}

.Remove {
	font-size:2ex;
	line-height:1ex;
	width:16px;
	height:16px;
	right:2px;
	top:1px;
}

.Add {
	font-size:3ex;
	line-height:1.5ex;
	width:22px;
	height:22px;
	right:120px;
	top:1px;
}
.Add:after,.Remove:after,.Add:before,.Remove:before {
	border: 2px solid black;
	content: '';
	bottom:0;
	top:0;
	position:absolute;
	width:20%;
}
.Add:after,.Remove:after {
	border-left:none;
	right:0;
}
.Add:before,.Remove:before {
	border-right:none;
	left:0;
}
.sline,.fline,.tline {
	position:absolute;
	width:0;
	right:2em;
	top:1px;
	bottom:1px;
	border:2px solid black;
	display:block;
}
.fline{top:0.8rem;}
.tline {
	height:0;
	width:4rem;
	top:1rem;
}
.tline:after,.tline:before{
	content:'';
	width:0;
	position:absolute;
	border:2px solid black;
	bottom:0;
	height:1rem;
}
.tline:after{right:-2px;}
.tline:before {
	left:-2px;
	transform:rotate(60deg);
	transform-origin: 0 90%;
}
#Set {
	cursor:pointer;
	height:1em;
	width:85px;
	position:absolute;
	left:-85px;
	top:0;

	display:block;
	
	transform-origin:100% 100%;
	transform:translate(0,-1em) rotate(-90deg);
	text-align:center;
	line-height:1em;
	font-size:1rem;
	background-color:#FF9600;
	color:#000000;
	z-index:5;
	border: 1px solid black;
	border-bottom-style:none;
	box-sizing:border-box;
	border-top-right-radius:8px 20px;
	border-top-left-radius:8px 20px;
}
.Set:hover {
	color:white;
}
#settings1-wrap {
	position:fixed;
	width:0px;
	right:1rem;
	top:1rem;
	z-index:10;
	transition: width 500ms
	ease;

}
#settings1 {
	background-color:#FF9600;
	overflow:hidden;
	width:100%;

}
#settings2 {
	position:relative;
	width:300px;
	margin:auto;
	margin-top:2rem;
	margin-bottom:2rem;
	background:black;
	color:#E59F3A;
	font-size:1rem;
	font-style:normal;
	padding:2rem;
	font-weight:normal;
	border: 3px solid black;
	border-radius:10px;
}
.soption {
	clear:right;
}
.soption:after{
	content: '';
	display:block;
	height:0;
	clear:both;
}
.line {
	width:90%;
	height:0;
	margin:auto;
	border: 1px solid #FF9600;
}
.tzselect {
	float:right;
}
.radio {
	float:right;
	line-height:0.5rem;
	padding:0;
}
	
.twoway > br {
	display:initial;
}

form {
	height:100%;
}
.twoway {
	position:relative;
	vertical-align:middle;
	display:inline-block;
	line-height:0.75rem;
	font-size:0.75em;
	padding:0;
	height:1.5rem;
	margin-left:1rem;
	font-style:normal;
}