html, body {
	height: 100%;
	margin: 0;
	overflow: hidden;
	font-family: 'Î¢ÈíÑÅºÚ';
}

.bg {
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url("../TemplateData/background.jpg") 50% 0 no-repeat;
	background-size: cover;
}

@media screen and (min-width: 0px)
{
	.headbr {
		width: 70%;
	}
	
	.jindu_box {
		width: 878px;
		position: relative;
		padding-top: 40px;
		margin: 0 auto;
		box-sizing: border-box;
		margin-bottom: 100px;
	}
	
	.loading_tip {
		position: absolute;
		width: 100%;
		font-size: 20px;
		color: #CC0000;
		text-align: center;
		line-height: 24px;
		z-index: 10;
		margin-top:-110px;
	}
	
    .contactor {
		position: absolute;
		width: 100%;
		font-size: 16px;
		color: #FFFFFF;
		text-align: center;
		line-height: 30px;
		z-index: 10;
		margin-top:-115px;
    }
	
	#home_bg {
		position: relative;
		max-width: 1366px;
		text-align: center;
		margin: 30px auto 0;
	}	
}

@media screen and (min-width: 1367px)
{
	.headbr {
		width: 80%;
	}
	
	.jindu_box {
		width: 878px;
		position: relative;
		padding-top: 50px;
		margin: 0 auto;
		box-sizing: border-box;
		margin-bottom: 100px;
	}
	
	.loading_tip {
		position: absolute;
		width: 100%;
		font-size: 24px;
		color: #CC0000;
		text-align: center;
		line-height: 24px;
		z-index: 10;
		margin-top:-135px;
	}
	
    .contactor {
		position: absolute;
		width: 100%;
		font-size: 16px;
		color: #FFFFFF;
		text-align: center;
		line-height: 30px;
		z-index: 10;
		margin-top:-95px;
    }
	
	#home_bg {
		position: relative;
		max-width: 1366px;
		text-align: center;
		margin: 80px auto 0;
	}
}

@media screen and (min-width: 1601px)
{
	.headbr {
		width: 100%;
	}
	
	.jindu_box {
		width: 878px;
		position: relative;
		padding-top: 100px;
		margin: 0 auto;
		box-sizing: border-box;
		margin-bottom: 100px;
	}
	
	.loading_tip {
		position: absolute;
		width: 100%;
		font-size: 28px;
		color: #CC0000;
		text-align: center;
		line-height: 30px;
		z-index: 10;
		margin-top:-150px;
	}
	
    .contactor {
		position: absolute;
		width: 100%;
		font-size: 16px;
		color: #FFFFFF;
		text-align: center;
		line-height: 30px;
		z-index: 10;
		margin-top:-110px;
    }
	
	#home_bg {
		position: relative;
		max-width: 1366px;
		text-align: center;
		margin: 120px auto 0;
	}
}

#webgl-content {
	width: 100%; 
	height:100%;
	position: relative;
}

#gameContainer {
	width: 100%;
	height:100%;
}

#fullscreen {
	position: absolute;
	right:0;
	bottom:0;
	z-index: 1;
	width: 100;
	height: 100; 
	background-image: url('../TemplateData/fullscreen.png'); 
	background-size: contain; 
	transition: all ease 300ms;
}

#mycanvas {
	width:1px;
	height:1px;
}

.jindu {
	position: relative;
	width: 100%;
	box-sizing: border-box;
	height: 80px;
	margin-bottom: 10px;
}

.jindu-value-bg {
	padding: 5px 3px;
	width: 100%;
	box-sizing: border-box;
	background: url("../TemplateData/loadingprogressbar_bg.png") 0 0 no-repeat;
	background-size: 100%;
}

.jindu_value {
	position: relative;
	width: 0%;
	height: 30px;
	background: url("../TemplateData/loadingprogressbar.png") 0 0 repeat;
}

#jindu_num {
	position: absolute;
	right: -80px;
	top: 0;
	z-index: 1;
	font-size: 28px;
	color: #fff;
}

.versiontip_bg {
	display: none;
}

.versiontip {
	width: 600px;
	padding: 50px 20px 40px;
	box-sizing: border-box;
	margin: 0 auto;
	color: #fff;
}

.versiontip .title {
	font-size: 24px;
	line-height: 30px;
	text-align: center;
	font-weight: bold;
	margin-bottom: 40px;
}

.versiontip .tiptext {
	font-size: 16px;
	line-height: 26px;
	text-align: center;
	margin-bottom: 30px;
}

.downloadtext {
	font-size: 16px;
	line-height: 26px;
	text-align: center;
	color: #FFFFFF;
	margin-bottom: 10px;
}

.downloadtext:hover {
	color: #33CC00;
}

.HideLoginFrame {
	position:absolute;
	z-index:999;
	left:50%;
	top:50%;
	pointer-events:none;
	display:none;
}

.CTPanelUp1 {
	pointer-events:none;
	background: url("../TemplateData/LoginPanel.png") 0 0 no-repeat;
}

#HideHoverPanelBtn1 {
	pointer-events:auto;
}

.CTPanelUp2 {
	pointer-events:none;
	background: url("../TemplateData/CT_PanelUp.png") 0 0 no-repeat;
}

#HideHoverPanelBtn2 {
	pointer-events:auto;
}

#ReportPageContainer {
	position:absolute;
	z-index:999;
	overflow-y:scroll;
    overflow-x:hidden;
	background-color:rgb(0,0,0,0.5);
	display:none;
}

#ReportPagePanel {
	background: url("../TemplateData/ReportBg.png") 0 0 no-repeat;
}

#HollowReportHoverBtn {
	position:absolute;
	z-index:1000;
	display:none;
}

#ReportBtn_Clicked {
	display:none;
	border:0;
	width:100%;
	height:100%;
}

div ul {
	padding:0;
    margin:0;
}

div ul li{
	padding:0;
    margin:0;
	list-style-type:none;
}

.float-left {
	float:left;
}

.clearboth {
	clear:both;
}

#closeBtn {
	cursor:pointer;
}

#UploadBtn {
	cursor:pointer;
}

.heightblank {height:150px;}
.widthblank {width:100px;}
.widthMid {width:28px;}
.widthBtn {width:136px;}
.heightblank2 { height:95px;}
.widthblank2 {width:113px;}
.widthBtn2 {width:136px;}

#uploadPanel { width:500px; height:200px; position:absolute; z-index:1001;display:none; background: url("../TemplateData/UploadPanel.png") 0 0 no-repeat;}
#ReturnPanel { width:352px; height:157px; position:absolute; z-index:1002;display:none; background: url("../TemplateData/ReturnPanel.png") 0 0 no-repeat;}

#ForceClickLayer {
	position:absolute;
	z-index:998;
	display:none;
	background-color:rgb(0,0,0,0.5);
}

#ForceClickLayer0 {
	position:absolute;
	z-index:998;
	display:none;
	background-color:rgb(0,0,0,0.5);
	pointer-events:none;
}