@font-face {
    font-family: HighlandGothic;
    src: url('HighlandGothicFLF.ttf');
}


body {
	margin: 0;
	padding: 0;
	background-color:grey;
	
	
background: rgb(204,204,204); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(204,204,204,1) 0%, rgba(238,238,238,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(204,204,204,1) 0%,rgba(238,238,238,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(204,204,204,1) 0%,rgba(238,238,238,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cccccc', endColorstr='#eeeeee',GradientType=0 ); 
	
	
}

#backgroundPic {

	min-width:100%;
	min-height:100%;
	//background-image: url("1.png");
	background-size:cover;
	background-repeat: no-repeat;
	background-position: center;
	z-index: -2;
	position:absolute;
}
#backgroundEffect {

	width:100%;
	height:100%;
	background-image: url("pattern.png");
	opacity:0.15;
	background-position: 0px -380;
	z-index: -1;
	position:absolute;
}
#NavBarTop {
	width: 100%;
	height:75px;
	position:relative;
	background-color: rgba(0,0,0,0.5);
	/*background-color:red; */
}
#NavBar {
	width:100%;
	height:50px;
	
	position:relative;
	
	/* Drop Shadow*/
	-webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.36);
	-moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.36);
	box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.36);
	
	/* NavBar Gradient*/

	background: rgb(255,175,75); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(255,175,75,1) 0%, rgba(255,146,10,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(255,175,75,1) 0%,rgba(255,146,10,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(255,175,75,1) 0%,rgba(255,146,10,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffaf4b', endColorstr='#ff920a',GradientType=0 ); /* IE6-9 */

	-webkit-user-select: none; /* Chrome/Safari */        
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* IE10+ */
	
	
}
#NavBarTop2 {
	margin:0 auto;
	/*width:600px;*/
	width:750px;
	height:50px;
	-webkit-clip-path: polygon(20% 0%, 80% 0%, 100% 100%, 0% 100%);
	clip-path: polygon(20% 0%, 80% 0%, 100% 100%, 0% 100%);
	background-color:#ffaf4b;

	position:absolute;
	bottom:0;
	left:0;
	right:0;
	text-align:center;
	color:white;
	font-family: HighlandGothic;
	
}
#NavContainer {
	margin:0 auto;
	height:100%;
	width:600px;
	/*background-color:blue;*/
	text-align: center;
	/*line-height:-10px*/
}
#NavContainer ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}
#NavContainer ul li {
	min-width: 10px;
	display:inline-block;
	text-decoration: none;
	padding-left:10px;
	padding-right:10px;
	padding-top:10px;
}
#NavContainer ul li:hover{
	border-bottom: 5px solid silver;
}
#NavContainer ul li a {
    display: inline-block;
	font-family: HighlandGothic;
	height:80%;
	text-decoration: none;
	color:white;
	font-size:25px;
	vertical-align:middle;
	font-weight:bold;
	
}
#show {
    color: rgba(255,255,255,0.5);    
    
}
.NavButton {
	position:relative;
	top:10px;
	display:inline-block;
	font-size:25px;
	height:40px;
	padding-left:5px;
	padding-right:5px;
	vertical-align: bottom;
	//background-color:red;
	

}
.NavButton:hover {
	border-bottom: 5px solid silver;
	box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

#bodyContent {
	height:70%;
	width:80%;
	//background-color:red;
	margin: 0 auto;
	position: relative;
}
#footerContent {
	height:10%;
	width:100%;
	
	position:absolute;
	bottom:0;
	padding-top:0;
	//background-image: url("footerbg.png");
	
	-webkit-box-shadow: 0px -2px 18px 0px rgba(0,0,0,0.28);
	-moz-box-shadow: 0px -2px 18px 0px rgba(0,0,0,0.28);
	box-shadow: 0px -2px 18px 0px rgba(0,0,0,0.28);
	//border-top: 5px solid #FF9900;
	border-top: 5px solid #ff920a;
	background-color: rgba(0,0,0,0.6);
	//background-color: red;
}

#InfoBoxContainer {
	
	//float:right;
	//min-height:100px;
	//margin-top: 35%;
	text-align:right;
	font-family: HighlandGothic;
	position: absolute;
    bottom: 55px;
	right: 0;
}
#InfoBoxContainer h1 {
	font-size:50px;
	color:silver;
    text-shadow:
    -1px -1px 0 rgba(0,0,0,0.28),
    1px -1px 0 rgba(0,0,0,0.28),
    -1px 1px 0 rgba(0,0,0,0.28),
    1px 1px 0 rgba(0,0,0,0.28); 

	padding:0;
	margin:0;
}
#InfoBoxContainer h2 {
	padding:0;
	margin:0;
	color:orange;
	font-size:40px;
    text-shadow:
    -1px -1px 0 rgba(0,0,0,0.28),
    1px -1px 0 rgba(0,0,0,0.28),
    -1px 1px 0 rgba(0,0,0,0.28),
    1px 1px 0 rgba(0,0,0,0.28);
}
#ip {
	position:absolute;
	left:40px;
	bottom:40%;
	color:silver;
	font-family: HighlandGothic;
	font-size:20px;
	z-index:1;
}
#ts3ip {
	position:absolute;
	//float:right;
	right: 40px;
	bottom: 40%;
	text-align:right;
	color:silver;
	font-family: HighlandGothic;
	font-size:20px;
	z-index:1;
}

#ts3ip a {
    text-decoration:none;
    color:silver;
    font-family: HighlandGothic;
	font-size:20px;
}


#copyright {
	position:relative;
	-webkit-clip-path: polygon(0 0, 100% 0, 80% 100%, 20% 100%);
	clip-path: polygon(0 0, 100% 0, 80% 100%, 20% 100%);
	//background-color: #FF9900;
	background-color:#ff920a;
	margin:0 auto;
	width:600px;
	height:50px;
	z-index:0;
	margin-top: -1px;
	//padding-top:10px;
	//margin-top:5px;

}
#playerList {
    //height:70%;
	max-height:70%;
    overflow-y:auto;
    border-left: thick double #ff9900;
    border-right: thick double #ff9900;
    width:20%;
    //background-color: rgba(200,200,200,.5);
	background-color: rgba(55,55,55,.5);
    padding-left:10px;
    margin:0 auto;
    padding-top:10px;
    padding-bottom:10px;
    font-family: HighlandGothic;
    color:white;
    z-index:5;
    position:fixed;
    top: 75px;
    left:40%;
    display:none;
}
#playerList table {
	color: white;
}

#playerlist table td.score {
	text-align: left;
}
#playerlist table th.score {
	text-align: left;
}
#copyrightText {
	text-align:center;
	color:white;
	font-family: HighlandGothic;
	padding-top:25px;
}