html {
  overflow-y: scroll;
}

:root {
  overflow-y: auto;
  overflow-x: auto;
}

:root body {
  position: absolute;
}

body {
	margin: 0;
	width: 100vw;
	color:#ddd;
  overflow: hidden;
	text-align: center;
	background-position: 50% 50%;
	background-image: url("../../img/PB.gif");
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-color: #111;
	font: 12px Tahoma, Verdana;
	cursor: crosshair;
}
a {font:bold 10pt/16px "微软雅黑","黑体";text-decoration: none;color: #ddd; cursor: crosshair}
a:hover {color: #98fb98;text-decoration:underline}
h2 {font-family: "微软雅黑","黑体";}
h3 {font-family: "微软雅黑","黑体";}
table {align:center;border: 0px;font:10pt "微软雅黑","黑体";}
tr {margin: 0px;}
td {margin: 0px;}
th {margin: 0px;}
div {font-family:"微软雅黑","黑体";}
span {font:10pt/16px "微软雅黑","黑体";}
.long-list span {line-height:18px}
p {font:10pt/14pt "微软雅黑","黑体";}
li {font:bold 10pt/16px "微软雅黑","黑体";}

input {cursor: crosshair;}
.b {font-weight:bold;}
.u {text-decoration:underline;}
.title {font: 900 30px/32px "微软雅黑","黑体"; margin: 6px;color: #cceafa; width: 100%;filter:blur(add=1,direction=90,strength=12):glow(strength=5,color=gold); text-decoration:underline;}
.subtitle {font: bold 24px/32px "微软雅黑","黑体";margin: 6px;color: #cceafa; width: 100%;}
.headerlink{}
.small {font-size: 9pt}
.ver a{font:10pt "Viner Hand ITC","隶书";color:#f66;}
.b1 {background-color:rgba(98,135,163,0.6); *BACKGROUND: rgb(98,135,163); *filter:alpha(opacity=60); BORDER: #000 0px none; TEXT-ALIGN: center; COLOR: #fff; border-right: #111 1px solid; border-bottom: #111 1px solid;}
.b2 {background-color:rgba(98,135,163,0.6); *BACKGROUND: rgb(98,135,163); *filter:alpha(opacity=80); BORDER: #000 0px none; TEXT-ALIGN: center; COLOR: #fff; border-right: #111 1px solid;}
.b2h {background-color:rgba(98,135,163,0.3); *BACKGROUND: rgb(98,135,163); *filter:alpha(opacity=30); }
.b3 {background-color:rgba(17,17,17,0.5); *BACKGROUND:rgb(17,17,17); *filter:alpha(opacity=50); BORDER: #000 0px none; color: #fff; text-align: center; border-right: #111 1px solid;}
.long-list .b3 {text-align:left}
.b4 {BORDER: #000 0px none; color: #fff; text-align: center;font: 10pt;}
.b5 {BORDER: #000 0px none; color: #fff; text-align: center;font: 10pt;}
.b6 {background-color:rgba(0,99,0,0.65); *BACKGROUND:rgb(0,99,0); *filter:alpha(opacity=65); BORDER: #000 0px none; color: #fff; text-align: center; border-right: #111 1px solid;}
.b7 {background-color:rgba(99,0,0,0.65); *BACKGROUND:rgb(99,0,0); *filter:alpha(opacity=65); BORDER: #000 0px none; color: #fff; text-align: center; border-right: #111 1px solid;}
.b8 {background-color:rgba(17,17,17,0.5); *BACKGROUND:rgb(17,17,17); *filter:alpha(opacity=50); BORDER: #000 0px none; color: #fff; text-align: center;}
.map {background-color:rgba(17,17,17,0.5); *BACKGROUND:rgb(17,17,17); *filter:alpha(opacity=50);BORDER: #111 1px solid;text-align: center;}
.map2 {BORDER: #111 1px solid;text-align: center;font: bold 10pt;}
.maptdred {background-color:rgba(255,0,0,0.25); *BACKGROUND:#f00; *filter:alpha(opacity=25);BORDER: #111 1px solid;text-align: center;}
.maptdyellow {background-color:rgba(255,255,0,0.25); *BACKGROUND:#ff0; *filter:alpha(opacity=25);BORDER: #111 1px solid;text-align: center;}
.maptdlime {background-color:rgba(0,255,0,0.2); *BACKGROUND:#0f0; *filter:alpha(opacity=20);BORDER: #111 1px solid;text-align: center;}
.mapspanred{color:#f00;position:relative;font-size: 9pt;line-height:16px}
.mapspanlime{color:#0f0;position:relative;font-size: 9pt;line-height:16px}
.mapspanyellow{color:#ff0;position:relative;font-size: 9pt;line-height:16px}

.b1 span{position:relative;font-weight:bold;}
.b2 span{position:relative;}
.b3 span{position:relative;}
.b1 div{position:relative;}
.b2 div{position:relative;}
.b3 div{position:relative;}

rt{
	font-size:9px; 
	font-weight:normal;
	transform-origin-y: bottom;
  -webkit-transform-origin-y: bottom;
  transform: scale(0.80);
  -webkit-transform: scale(0.80);
}

table.admin {
	border:0;
	padding:0;
	BACKGROUND: #000;
}

table.admin th {	
	BACKGROUND: #3A4273;
	color: #FFFFFF;
	font: bold 10pt "微软雅黑";
	TEXT-ALIGN: center;
}

table.admin td {
	BACKGROUND: #E3E3EA;
	color: #3A4273;
	font: normal 10pt "微软雅黑";
	TEXT-ALIGN: left;
}

table.admin td.tdtitle {
	BACKGROUND: #E3E3EA;
	color: #3A4273;
	font: bold 12pt "微软雅黑";
	TEXT-ALIGN: center;
}

.Disabled{opacity:0.7;}

#changelog li{
	line-height:1.2;
	padding:10px 0;
}

#changelog li ul li{
	padding:0;
}

/*==========各种颜色==========*/
.black{color:#000000; }
.yellow{color:#ffff00;}
.orange{color:#ff9900; }
.gold{color:rgb(255,215,0); }
.cyan{color: #00ffff;}
.clan{color: #00ffff;}
.lightblue{color: rgb(150,210,255);}
.blue{color: #0000ff;}
.red{color: #ff0000;}
.red2 {color: #ff0000; font-size:18pt; }
.darkred{color: #990000;}
.green{color: #008000;}
.lime{color: #00ff00;}
.purple{color: #9900cc;}
.ltpurple{color: #bb55ff;}
.brickred{color:#fa8072;}
.seagreen{color:#4eee94;}
.evergreen{color:#98fb98;}
.white{color:#ffffff;}
.evergreen2{color:#98fb98;font-size:18pt;}
.dmg {color:#ff0000;font-weight:bold; }
.grey{color:#999;}
.darkgrey{color:#666;}
.lightpink{color:rgb(250,180,180);}
.ltcrimson{color:rgb(255,120,150);}
.ltazure{color:rgb(110,210,255);}
.linen{color:rgb(200,192,184);}
.vermilion{color:rgb(255,160,100);}
.ltvermilion{color:rgb(255,200,120);}
.L5{color: #ff0000;background:url("../../img/backround4.gif") repeat-x;}

/*==========文字描边==========*/
.white-shadow{text-shadow: 1px 1px 2px #fff}
.black-shadow{text-shadow: 1px 1px 2px #000}
.grey-shadow{text-shadow: 1px 1px 2px #ccc}

/*==========杂项界面==========*/
#main {
white-space:nowrap;
vertical-align:middle;
}
.battle td{
text-align: center;
}
.chatlist{
MARGIN: 0px;
height:120px;
width:100%;
word-break:break-all;
overflow-y:auto;
position:relative;
}
.newslist{
MARGIN: 0px;
height:120px;
width:100%;
word-break:normal;
overflow-x:hidden;
overflow-y:auto;
position:relative;
}
#sendchat{
MARGIN: 0px;
padding:0px;
border:0px; 
height:35px;
width:100%;
}
#chatmsg{
width:400px;
border-right: #ddc 2px solid;
border-top: #666 2px solid;
border-left: #666 2px solid;
border-bottom: #ddc 2px solid;
}
#chat_floating_banner{
	position:absolute;
	padding:5px 24px;
	z-index:10;
	background-color:rgba(0,0,0,0.7); *BACKGROUND: rgb(0,0,0); *filter:alpha(opacity=70); 
	-webkit-border-radius: 6px; 
	-moz-border-radius: 6px; 
	border-radius: 6px; 
}
#log{
	line-height:15px;
}
.footerline {
height: 1px;
background-image: url("../../img/footer_line.gif");
}
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } 
.clearfix {display: inline-table;} /* Hides from IE-mac \*/ * html .clearfix {height: 1%;} .clearfix {display: block;} /* End hide from IE-mac */ 
#game_interface input[type=button]{
	text-shadow: 0 1px 1px rgba(0,0,0,.3);
	-webkit-border-radius: 6px; 
	-moz-border-radius: 6px; 
	border-radius: 6px; 
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2);
}
#game_interface input[type=button].cmdbutton{
	min-width:80px;height:25px;margin:2;
}

#game_interface input[type=button].dropbutton{
	min-width:75px;height:23px;margin:1;
}

#game_interface input[type=button].bigbutton{
	min-width:120px;height:25px;margin:2;
}
#game_interface input[type=submit]{
	text-shadow: 0 1px 1px rgba(0,0,0,.3);
	-webkit-border-radius: 6px; 
	-moz-border-radius: 6px; 
	border-radius: 6px; 
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2);
}
#game_interface button{
	text-shadow: 0 1px 1px rgba(0,0,0,.3);
	-webkit-border-radius: 6px; 
	-moz-border-radius: 6px; 
	border-radius: 6px; 
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2);
}

.auto-style1 {
	border-width: 0px;
}

div#loading{
	display:none;	
	width:100%;height:100%;	position:absolute;z-index:10;
	BACKGROUND: #000;filter:alpha(opacity=50); opacity:0.5;
	background-image: url("../../img/loading.gif");background-repeat: no-repeat;background-position:center;background-attachment: fixed;
}

table#map_display{
	text-align:center;
	padding:0;
	border-collapse: collapse; border-spacing: 0;
	border:1px;
	position:relative;
	table-layout: fixed;
	background-repeat:no-repeat;background-position:right bottom;
}

table#map_display tr.map{
	text-align:center;
}

table#map_display td.map{
	text-align:center;
	padding:0px;
}

table#map_display div{
	display: table-cell;
	vertical-align: middle;
}

/*==========表情包==========*/
img.emoticon{
	width: 80px; height: 80px; margin: 1px; cursor: pointer; 
}
div#chatfloatbox{
	position: absolute; background-color: rgba(0,0,0,0.8); z-index:30;
}
/*==========半透明悬浮气泡框==========*/
div.bubblebox_positioner{
	position:fixed; left:0px; top:0px;
	margin:auto auto;
	min-width:100%; max-width:100%; min-height:100%; max-height:100%;
}
div.bubblebox_container{
	position:relative;
	background-color:rgba(17,17,17,0.5); *BACKGROUND:rgb(17,17,17); *filter:alpha(opacity=50);
	BORDER: #000 0px none; color: #fff;
	text-align: center;
	font:10pt 微软雅黑 serif;text-align:left; overflow-x:hidden; overflow-y:auto;
}
/*==========悬浮提示==========*/
#hoverHintMsg{
	display:none;
	max-width:400px;
	left:0px; top:0px;z-index:100;position:fixed;
	text-align:left;
	background-color:rgba(0,0,0,0.7); *BACKGROUND: rgb(0,0,0); *filter:alpha(opacity=70); 
	-moz-border-radius: 9px;
	-webkit-border-radius: 9px;
	border-radius: 9px;
}
#hoverHintMsgInner{
	margin:6px 9px;
}
.hoveringBlock {
	z-index:30;
	background-color:rgba(0,0,0,0.7); *BACKGROUND: rgb(0,0,0); *filter:alpha(opacity=70); 
	text-align:left;
	-moz-border-radius: 9px;
	-webkit-border-radius: 9px;
	border-radius: 9px;
}
/*==========剧情分镜==========*/
#storyboard_container {
	background-color:rgba(17,17,17,0.5);
}

#storyboard_control {
	position:relative;
}

#storyboard_control input.cmdbutton{
	width:120px;height:25px;margin:2;
}

#shootings_container{
	display: flex;
	align-items: center;
	justify-content: center;
}

.shootings {
	text-align:center;
	display:none;
}
/*==========商店道具==========*/
.shoprow{
	width:280px;display:flex;min-height:40px;
}

.shoprow .leftbox{
	width:50px;float:left;margin-right:5px;
}
.shoprow .leftbox input{min-width:50px;}
.shoprow .rightbox{
	width:60px;float:right;
}
.shoprow .rightbox input{width:60px;}
.shoprow .rightbox .inputunit{
	position:absolute;top:5%;right:25%;color:#aaaaaa;
}
/*==========视野按钮==========*/
button.memory_slot{
	width:95px;min-height:35px;margin:2px;padding:0;vertical-align:top;line-height:15px;word-wrap:break-word;
}
button.memory_record{
	width:95px;min-height:35px;margin:2px;padding:0;vertical-align:top;line-height:12px;word-wrap:break-word;
}
button.beacon_slot{
	box-shadow: 0 0 4px 1px rgba(255, 127, 0, .5) inset;
	border-color:rgba(255, 127, 0, 0.5);
	border-width: 3px;
	border-radius: 6px;
}
button.memory_record:disabled span.memory_name{
	color:#fff;
}
/*==========雷达屏幕==========*/
table.radar{
	border:0;margin:0;border-collapse:collapse;border-spacing:0;text-align:center;
}
table.radar tr{height:20px;}
/*==========tooltip样式，韩的常磐，不过可能最早是多鲁基弄的==========*/
[tooltip] {
    position: relative;
}
[tooltip]:hover::before {
    content: attr(tooltip);
	position: absolute;
	transform: translate(30px, 20px);
	display: inline-block;
	color: #ccc;
	padding: 6px; text-align: left; white-space:pre-line;
	/*text-shadow:1px 1px 1px rgb(106, 0, 108); text-fill-color: rgb(245, 174, 246); -webkit-text-fill-color: rgb(245, 174, 246);*/
	/*background-clip: border-box; background-color: rgba(198, 114, 199, 0.8);*/
	background-color:rgba(0,0,0,0.8); *BACKGROUND: rgb(0,0,0); *filter:alpha(opacity=80); 
	border-radius: 8px; border-width: 0;	
    width:max-content; max-width: 200px; position: absolute; z-index: 5;
}
/*==========单选、复选按钮==========*/
input[type=radio].radio_comb, #game_interface input[type=radio] {
	display:none;
}
input[type=radio].radio_comb + a, #game_interface input[type=radio] + a{
	position:relative;
	display:inline-block;
	border-radius: 5px;
	margin:2px 0;
	padding:3px 12px 3px 24px;
	background-color:#444;
	text-decoration: none;color: #fff;
}
input[type=radio].radio_comb:checked + a::after, #game_interface input[type=radio]:checked + a::after{
	position:absolute;
	content:"✓";
	top: 4px; left: 8px;
}
input[type=radio].radio_comb + a:hover, #game_interface input[type=radio] + a:hover{
	background-color:#567;
	text-decoration: none;color: #fff;
}
input[type=radio].radio_comb:checked + a, #game_interface input[type=radio]:checked + a{
	background-color:#cceafa;
	color: #000;
}
/*==========新头像选择框==========*/
div#icon_list_f_container, div#icon_list_m_container{
	text-align:center;position:relative;
}
span#icon_f_0_hint, span#icon_m_0_hint{
	position:absolute;top:32px;left:44px;text-shadow: 1px 1px 1px #000;
}
/*==========技能==========*/
table.skilltable{
	height:100%; width:100%; 
	border:0;margin:0;border-collapse:collapse;border-spacing:0;
}
table.skilltable td{padding:0;}
td.skilldesc_left{}
td.skilldesc_right{width:96px;}
span.skilldesc
{
	margin:8px auto;
	display:block;
}
div.skilldesc{margin:8px auto;display:block;}
div.skill_unacquired
{
	position:relative; left:0px; top:0px; 
	background-color:#ffffff; 
	height:100%; width:100%; 
	filter:alpha(opacity=18); -moz-opacity:0.18; opacity:0.18; -khtml-opacity: 0.18;
}
div.skill_unacquired_transparent
{
	position:relative; left:0px; top:0px; 
	height:100%; width:100%; 
}
div.skill_unacquired_hint
{
	position:absolute; left:0px; top:0px; height:100%; width:100%;
}
div.skill_unacquired_hint_transparent
{
	position:absolute; left:0px; top:0px; height:100%; width:100%;
	background-color:#000000; 
	filter:alpha(opacity=0.1); -moz-opacity:0.1; opacity:0.1; -khtml-opacity: 0.1;
}
div.skilllearn_desc_container{
	text-align:center;
	width:420px;z-index:100;position:fixed;
	filter:alpha(opacity=95); opacity:0.95; background-color:#000000
}
div.battlecmd_desc{
	position:absolute; left:5px; top:30px;
	width:95px;
	text-align:left;
	background-color:rgba(0,0,0,0.75);
}
/*==========卡片基础显示==========*/
/*==========已经移至style_card.css==========*/
/*==========进度条==========*/
#progressbar-border
{
	width:100%;
	height:15px;
	background-color: #000000;
	border:1px solid #ffffff;
	overflow:hidden;
}

#progressbar-inner3
{
	width:0%;
	height:15px;
	background: #3333ff; 
}

#progressbar-text3
{
	position:relative;
	left: 135px;
	color: #ffffff;
	top: -16px; 
}
/*==========刺激市场展柜==========*/
.showcase
{
	background-color: rgba(0,0,0,0.6);
	-moz-border-radius: 12px;
	-webkit-border-radius: 12px;
	border-radius: 12px;
	padding:10px;
}
/*==========滚动条==========*/
.gscroll::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.6);
	background-color: #CCCCCC;
}

.gscroll::-webkit-scrollbar
{
	width: 10px;
	background-color: #F5F5F5;
}

.gscroll::-webkit-scrollbar-thumb
{
	background-color: #000000;
	border: 2px solid #555555;
}
.gscroll_2::-webkit-scrollbar-track {
	box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
	border-radius: 10px;
	background:	#ededed;
}
.gscroll_2::-webkit-scrollbar
{
	width: 10px; /*高宽分别对应横竖滚动条的尺寸*/
	height: 1px;
}
.gscroll_2::-webkit-scrollbar-thumb 
{
	border-radius: 10px;
	box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
	background-color: #555;
	/* background-image: -webkit-linear-gradient(135deg,
						rgba(255, 255, 255, 0.2) 16.7%,
						transparent 16.7%,
						transparent 33.3%,
						rgba(255, 255, 255, 0.2) 33.3%,
						rgba(255, 255, 255, 0.2) 50%,
						transparent 50%,
						transparent 66.7%,
						rgba(255, 255, 255, 0.2) 66.7%,
						rgba(255, 255, 255, 0.2) 83.3%,
						transparent 83.3%,
						transparent); */
}
.gscroll_3::-webkit-scrollbar-track {
	box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
	border-radius: 10px;
	background:	#ededed;
}
.gscroll_3::-webkit-scrollbar
{
	width: 10px; /*高宽分别对应横竖滚动条的尺寸*/
	height: 1px;
}
.gscroll_3::-webkit-scrollbar-thumb 
{
	border-radius: 10px;
	box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
	background-color: #555;
	background-image: -webkit-linear-gradient(135deg,
						rgba(255, 255, 255, 0.2) 16.7%,
						transparent 16.7%,
						transparent 33.3%,
						rgba(255, 255, 255, 0.2) 33.3%,
						rgba(255, 255, 255, 0.2) 50%,
						transparent 50%,
						transparent 66.7%,
						rgba(255, 255, 255, 0.2) 66.7%,
						rgba(255, 255, 255, 0.2) 83.3%,
						transparent 83.3%,
						transparent);
}
/*==========旋转==========*/
.rotater_2 
{
	transform:rotate(180deg);
}
/*==========对话气泡==========*/
.dialogue-bubble-container{ 
	position: absolute;
	z-index:5;
	margin:0;padding:0;
	text-align:left;
	width:438px;
}

.dialogue-bubble{
	clear:both;
	float:left;
	position: relative;
	left:12px;
	margin:5px 0;
	height: 60px;
	min-width:120px;
	max-width:400px;
	background: rgb(60,85,100);
	-moz-border-radius: 12px;
	-webkit-border-radius: 12px;
	border-radius: 12px;
	display: flex;
	align-items: center;
}
.dialogue-bubble:before{
	position: absolute;
	content: "";
	width: 0;
	height: 0;
	right: 100%;
	top: 23px;
	border-top: 8px solid transparent;
	border-right: 12px solid rgb(60,85,100);
	border-bottom: 8px solid transparent;
}

.dialogue-bubble div{position: relative;margin:auto 25px;text-align:left;}
.dialogue-bubble span{position: relative;font-size:12pt;font-weight:bold;line-height:16pt;}

.dialogue-bubble.fade{
	opacity:0.6;filter:alpha(opacity=60);
}

.dialogue-bubble.fade:hover{
	opacity:1.0;filter:alpha(opacity=100);
}
/*==========动画效果==========*/
.Pulse{
	-webkit-animation-name: brightPulse; -webkit-animation-duration: 2s;-webkit-animation-iteration-count: infinite; 
}

.TransPulse{
	-webkit-animation-name: brightTransPulse; -webkit-animation-duration: 2s;-webkit-animation-iteration-count: infinite; 
}

@-webkit-keyframes brightPulse{
	from {  -webkit-box-shadow: 0 0 12px #666; }
  50% { background-color: #fa5; -webkit-box-shadow: 0 0 24px 8px #fa5; }
  to {  -webkit-box-shadow: 0 0 12px #666; }
}

@-webkit-keyframes brightTransPulse{
	from {  -webkit-box-shadow: 0 0 12px #666; }
  50% {  -webkit-box-shadow: 0 0 24px 8px #fa5; }
  to {  -webkit-box-shadow: 0 0 12px #666; }
}



/*==========selected==========*/
.item_select, 
.item_noselecte,
.to_merge,
.to_move,
.drop{
	margin:4px;
	padding:0;
	line-height:15px;
	word-wrap:break-word;
	border: 2px solid #ccbb00;
}
.item_select{
	width:150px;
	min-height:35px;
	vertical-align:top;
	background-color:rgb(255, 116, 116); 
}
.item_noselecte{
	width:150px;
	min-height:35px;
	vertical-align:top;
}
.to_merge{
	width: 100px;
	min-height: 50px;
	background-color:rgb(35, 123, 247); 
}
.to_move{
	width: 100px;
	min-height: 50px;
	background-color:rgb(191, 247, 35); 
}

.item_drop{
	width: 50px;
	height: 70px;
	margin-left: 30px;
	background-color:rgb(255, 36, 36); 
}

.option1 , .option2{
	display: flex;
	justify-content: space-between;
	align-items: center;
	min-height: 100px;
}
