body {box-sizing:border-box; padding:14px;-moz-user-select: none;-khtml-user-select: none;user-select: none;}
td{vertical-align:top}
#col1{ width:130px; min-width:130px; padding-right:14px}
#game_fr{height: 100%; width: 100%; min-height: 762px; /*max-height: 1000px*/}

	#col2{width:40%; padding-right:14px}	
	#col4{width:40%; min-width:240px}

@media (min-height: 1081px){
	body{zoom:1.5};
}

#col3{ width:350px; min-width:350px; padding-right:14px}

#col6{ padding-bottom: 10px; height: 100%}

.grm{background: #fcfcfc;
background: -moz-linear-gradient(top,  #fcfcfc 0%, #f5f5f5 50%, #ebebeb 51%, #eaeaea 100%);
background: -webkit-linear-gradient(top,  #fcfcfc 0%,#f5f5f5 50%,#ebebeb 51%,#eaeaea 100%);
background: linear-gradient(to bottom,  #fcfcfc 0%,#f5f5f5 50%,#ebebeb 51%,#eaeaea 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#eaeaea',GradientType=0);}

.gr{background: #fcfcfc;
background: -moz-linear-gradient(top,  #fcfcfc 0%, #f7f7f7 100%);
background: -webkit-linear-gradient(top,  #fcfcfc 0%,#f7f7f7 100%);
background: linear-gradient(to bottom,  #fcfcfc 0%,#f7f7f7 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#f7f7f7',GradientType=0 );}

.grg{background: #a0e048;
background: -moz-linear-gradient(top,  #a0e048 0%, #76c917 100%);
background: -webkit-linear-gradient(top,  #a0e048 0%,#76c917 100%);
background: linear-gradient(to bottom,  #a0e048 0%,#76c917 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a0e048', endColorstr='#76c917',GradientType=0 );}

.grg:hover{background: #e0c948;
background: -moz-linear-gradient(top,  #e0c948 0%, #c99517 100%);
background: -webkit-linear-gradient(top,  #e0c948 0%,#c99517 100%);
background: linear-gradient(to bottom,  #e0c948 0%,#c99517 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0c948', endColorstr='#c99517',GradientType=0 );}

.bb{border-bottom:1px solid #777777}
.bl{border-left:1px solid #777777}
.fl{float:left}
.vam{vertical-align:middle}

.upCase{text-transform:uppercase}

.t18AC{font-family:AgencyFBCyrillic; font-size: 18px; color: #4e4e4e; text-align:center}
#nick{width:100%; color:#7AB535; font-weight:bold; text-transform: capitalize;}
.container{box-sizing:border-box; border:1px solid #777777; width:100%; height:100%; position:relative}

.ibtn{ display:inline-block; cursor:pointer; width:22px; height:22px; margin:7px 10px 7px 10px; border-radius: 3px;-webkit-box-shadow: 0px 2px 1px 0px rgba(0,0,0,0.5), inset 0px 1px 0px 2px rgba(255,255,255,1);-moz-box-shadow: 0px 2px 1px 0px rgba(0,0,0,0.1), inset 0px 1px 0px 2px rgba(255,255,255,1);box-shadow: 0px 2px 1px 0px rgba(0,0,0,0.1), inset 0px 1px 0px 2px rgba(255,255,255,1);border-style: solid; border-width: 1px; border-image-source: linear-gradient(to bottom, #ededed, #c2c5cb); border-image-slice: 1;}

.ico1, .ico2, .ico3, .ico4, .ico5, .ico6, .ico7, .ico8{background:#f9f9f9 url(../img/icons.png) 0 1px no-repeat; opacity:0.7}
.ico2{background-position: 0 -21px}
.ico3{background-position: 0 -42px}
.ico4{background-position: 0 -63px}
.ico5{background-position: 0 -82px}
.ico6{background-position: 0 -105px}
.ico7{background-position: 0 -126px}
.ico8{background-position: 0 -147px}
.ico1:hover, .ico2:hover, .ico3:hover, .ico4:hover, .ico5:hover, .ico6:hover, .ico7:hover, .ico8:hover{ opacity:1}

#exit{background: url(../img/user_out.png) left top no-repeat; width: 86px; height: 25px; margin: 1px auto; cursor: pointer}
#exit:hover{opacity: 0.6}
.tar{text-align: right}

#total_users{display:inline-block; font-family: AgencyFBCyrillic; font-size: 16px; text-align: center; color: #000000; margin: 7px 0 7px 7px; padding-left: 7px}

#lvl_list{font-family:AgencyFBCyrillic; font-size: 18px; color: #626262}
.lvl{font-family: AgencyFBCyrillic; font-size: 14px; position: relative; cursor: pointer; height: 69px; width: 245px;
background: #efefef;
background: -moz-linear-gradient(top, #efefef 0%, #cecece 100%);
background: -webkit-linear-gradient(top, #efefef 0%,#cecece 100%);
background: linear-gradient(to bottom, #efefef 0%,#cecece 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efefef', endColorstr='#cecece',GradientType=0 );}
	.lvl > div:nth-child(1){AgencyFBCyrillic; font-size: 48px; color: #4f4f4f; font-weight: bold; position: absolute; top: 11px; bottom: auto; left: 15px; line-height: 0.8em; transform-origin: left center;}
	.lvl > div:nth-child(2){AgencyFBCyrillic; font-size: 14px; color: #4f4f4f; font-weight: bold; position: absolute; top: 8px; left: 44px; line-height: 1em;}
	.lvl > div:nth-child(3){margin: 0 50px 0 44px}
	.lvl > div:nth-child(3) > div{height: 23px; line-height: 1.5em; font-size:14px; font-weight: bold; color: #4f4f4f}
	.lvl > div:nth-child(3) > div:nth-child(2){background: url(../img/icons.png) -3px -62px no-repeat; }
	.lvl > div:nth-child(3) > div:nth-child(3){background: url(../img/icons.png) -3px -166px no-repeat; }
	.lvl > div:nth-child(4){position: absolute; bottom: 0; right: 0; top:0; width: 50px}
	
	.lvl > div:nth-child(4){
		background: url(../img/lvl_star.png) top center no-repeat;
		transition: filter 0.22s ease, background-position 0.22s ease;
	}
	.lvl:hover:not(.current) > div:nth-child(4){background-position: bottom center; filter: none;}
	/* Текущий уровень: нижняя (активная) звезда → зелёная, в тон иконке игроков */
	.lvl.current > div:nth-child(4){
		background-position: bottom center;
		filter: hue-rotate(76deg) saturate(1.35) brightness(1.05);
	}

	.lvl{transition: box-shadow 0.28s ease, background 0.28s ease, opacity 0.28s ease;}
	#lvl_list .lvl:not(.current){ opacity: 0.92; }

	.lvl.current{
		overflow: hidden;
		background: linear-gradient(105deg, #e8f4fc 0%, #f4fafd 18%, #efefef 52%, #e6eef5 100%);
		box-shadow:
			inset 0 0 0 1px rgba(73, 145, 227, 0.45),
			0 0 14px rgba(73, 145, 227, 0.22);
		position: relative;
		z-index: 2;
		animation: lvl-row-glow-light 2.6s ease-in-out infinite;
	}
	.lvl.current::before{
		content: '';
		position: absolute;
		left: 0;
		top: 0;
		bottom: 0;
		width: 5px;
		background: linear-gradient(180deg, #4991e3 0%, #7fd422 48%, #4991e3 100%);
		background-size: 100% 220%;
		animation: lvl-bar-flow 2.4s ease-in-out infinite;
		z-index: 3;
		pointer-events: none;
	}
	.lvl.current::after{
		content: '';
		position: absolute;
		top: -20%;
		bottom: -20%;
		left: -60%;
		width: 42%;
		background: linear-gradient(
			105deg,
			transparent 0%,
			rgba(255, 255, 255, 0.45) 48%,
			transparent 100%
		);
		animation: lvl-active-shine 3.2s ease-in-out infinite;
		pointer-events: none;
		z-index: 1;
	}
	.lvl.current > div:nth-child(1){
		color: #2b7ab8;
		text-shadow: 0 0 12px rgba(73, 145, 227, 0.45);
		animation: lvl-num-breathe-light 2.2s ease-in-out infinite;
		z-index: 2;
	}
	.lvl.current > div:nth-child(2){ color: #3d3d3d; z-index: 2; }
	.lvl.current > div:nth-child(3){ position: relative; z-index: 2; }
	.lvl.current > div:nth-child(4){
		z-index: 2;
		animation: lvl-star-pulse 2.4s ease-in-out infinite;
	}
	.lvl.current .lvl_input{
		border: 1px solid #7eb8e8;
		box-shadow: 0 0 8px rgba(73, 145, 227, 0.28);
	}
	
	.lvl > div:nth-child(3) > div:nth-child(1) > div{color: #0C0C0C}
	.lvl > div:nth-child(3) > div:nth-child(2) > div{color: #4991e3}
	.lvl > div:nth-child(3) > div:nth-child(3) > div{color: #7fd422}
	.lvl_input{height: 22px; line-height: 1.5em; font-size:16px; width: 122px; background-color: #fff; margin-left: 26px; padding: 0 0 0 4px}

#chat{box-sizing:border-box; position:absolute; left:0; right:0; top:28px; bottom:71px; overflow:hidden}
#chat_loader{position: absolute; top: 28px; left:0; right: 0; bottom: 71px; background: rgba(255, 255, 255, 0.5); z-index: 10}
#chat_loader *{color:#FF4F00;}

#chat_loader > div{position: absolute; top: 50%; left: 50%;}
#chat_loader > div > div{left: -50%; position: relative;}

#lang_switch > span{display: inline-block; width: 35px; height: 25px; background-position: center center; background-repeat: no-repeat}
#lang_switch[curr_lang="EN"] > span{background-image: url(../img/flag/GB.png)}
#lang_switch[curr_lang="DE"] > span{background-image: url(../img/flag/DE.png)}
#lang_switch[curr_lang="RU"] > span{background-image: url(../img/flag/RU.png)}
#lang_switch[curr_lang="CN"] > span{background-image: url(../img/flag/CN.png)}
#lang_switch[curr_lang="JP"] > span{background-image: url(../img/flag/JP.png)}
#lang_switch[curr_lang="FR"] > span{background-image: url(../img/flag/FR.png)}

#lang_switch, #lang_switch *{color: #393939}
#lang_switch{position: absolute; right: 0; top:0; cursor: pointer}

#lang_switch:hover{background-color: #fff}
#lang_switch:hover > #lang_opt, #lang_opt:hover{display: block}
#lang_switch:not(:hover) > #lang_opt:not(:hover), #lang_opt:not(:hover){display: none}

#lang_opt{position: absolute; right: 0; top:25px; background-color: #ffffff; z-index: 99}
#lang_opt > div{padding: 0 45px 0 7px; height: 27px; background-position: right 3px center; background-repeat: no-repeat}

#lang_opt > div[lang="EN"]{background-image: url(../img/flag/GB.png)}
#lang_opt > div[lang="DE"]{background-image: url(../img/flag/DE.png)}
#lang_opt > div[lang="RU"]{background-image: url(../img/flag/RU.png)}
#lang_opt > div[lang="CN"]{background-image: url(../img/flag/CN.png)}
#lang_opt > div[lang="JP"]{background-image: url(../img/flag/JP.png)}
#lang_opt > div[lang="FR"]{background-image: url(../img/flag/FR.png)}

#lang_opt > div:hover{background-color: #E3E3E3}
#lang_opt > div:not(:last-child){border-bottom: 1px solid #ccc}

#chat_btn{}
#chat_btn > div:not(:first-child){border-left:1px solid #777777}
#chat_btn > div{display:inline-block; box-sizing:border-box; cursor:pointer; font:inherit; width:33%; color:#a8a8a8}
#chat_btn > .active, #chat_btn > div:hover{color:#000000}
#chat_btn > div > span{font:inherit; color:inherit}
#chat_talk{box-sizing:border-box; height:70px; padding-top:7px; position:absolute; bottom:0; left: 0; right: 0;}



#say_chat, #chat_say_btn{margin:0; border: none; padding:3px}
#say_chat{font-family: ArialRoundedMT; font-size: 14px; text-align: left; color: #363636; border-left:1px solid #e0e0e0; width:100%}
#chat_say_btn, #vote_btn{ border-radius:0 3px 3px 0; font-family: AgencyFBCyrillic; font-size: 14px; text-align:center; color: #ffffff; text-shadow: 0 1px 3px rgba(255, 255, 255, 0.5)}
#chat_say_btn{float:right; width: 45px}
#vote_btn{float: left; margin: 7px 0 0 7px}
#chat_talk{}
#smile{width:22px; height:22px}
#chat_talk > div:first-child{box-sizing:border-box; position:relative; margin:0 7px; background-color: #ffffff; border:1px  solid #e0e0e0; height:24px}
.txtcont{ position:absolute; left:23px; top:0; bottom:0; right:45px}
#terms {text-align:right; line-height: 2em; padding-right: 7px;}
#terms > a{font-family: AgencyFBCyrillic; font-size: 12px; font-weight: bold; text-align: right; color: #d1d1d1;}

#chat > div{min-height:57px; box-sizing:border-box; border:1px solid #d9d9d9; position: relative; margin:7px}

#chat > div > div:nth-child(1){font-family: SourceSansPro; font-size: 9px; color: #bdbdbd; text-transform:uppercase; margin:0 7px}
#chat > div:not(.mymessage) > div:nth-child(1){text-align:right}
#chat > div.mymessage > div:nth-child(1){text-align:left}

#chat > div > div:nth-child(2) > div{font-family: SourceSansPro; font-size: 12px; color: #a9a9a9; font-weight:bold}
#chat > div > div:nth-child(2){font-family: Geneva, Arial, Helvetica, sans-serif; font-size: 12px; font-weight:normal; text-align: left; color: #363636;}
#chat > div:not(.mymessage) > div:nth-child(2){text-align:left; margin: 0 7px 7px 7px; word-break: break-all;}
#chat > div.mymessage > div:nth-child(2){text-align: right; margin: 0 7px 7px 7px;}

#chat > div{
background: #ffffff;
background: -moz-linear-gradient(top,  #ffffff 0%, #eeeeee 100%);
background: -webkit-linear-gradient(top,  #ffffff 0%,#eeeeee 100%);
background: linear-gradient(to bottom,  #ffffff 0%,#eeeeee 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee',GradientType=0 );
}

#money_block{ box-sizing:border-box; padding:7px; -webkit-box-shadow: 0px 2px 4px 0px #bbbbbb;-moz-box-shadow: 0px 2px 4px 0px #bbbbbb;box-shadow: 0px 2px 4px 0px #bbbbbb; border-radius:3px; border:1px solid  #a0a0a0; position:relative; height:85px}
#money_block > div{height:70px; cursor:pointer}
#money_block > div:not(:nth-child(2)) > div:first-child{height:52px; text-align:center}
#money_block > div > div:last-child{font-family: AgencyFBCyrillic; font-size: 16px; font-weight: bold; text-align: left; color: #7bc37b;}
#money_block > div:nth-child(1){float: left; width:60px}
#money_block > div:nth-child(1) > div:first-child{background:url(../img/inmoney.png) center 15px no-repeat; opacity: 0.4}
#money_block > div:nth-child(2){position:absolute; left:69px; top:7px; right:69px; bottom:7px}
#money_block > div:nth-child(2) > div:first-child{font-family: AgencyFBCyrillic; font-size: 25px; color: #707070; text-align:center; line-height:1.5em; box-sizing:border-box; height:37px; margin-top:15px;-webkit-box-shadow: 0px 1px 3px 0px rgba(204,204,204,1);-moz-box-shadow: 0px 1px 3px 0px rgba(204,204,204,1);box-shadow: 0px 1px 3px 0px rgba(204,204,204,1);border:1px solid #979797;}
#money_block > div:nth-child(2) > div:not(#money){
  font-family: AgencyFBCyrillic, Arial, Helvetica, sans-serif;
  font-size: 13px;
  font-weight: bold;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #555;
  margin-top: 4px;
  line-height: 1.15;
}
#money_block > div:nth-child(3){float: right; width:60px}
#money_block > div:nth-child(3) > div:first-child{background:url(../img/outmoney.png) center 15px no-repeat; opacity: 0.4}


#balance_mark{
  position: absolute;
  right: 10px;
  color: #656565;
  top: 22px;
  font-family: AgencyFBCyrillic, Arial, Helvetica, sans-serif;
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 0.04em;
}
#delta_bal{position: absolute; top:2px; font-family: AgencyFBCyrillic; width: 100%; left: 0; text-align: center; font-size: 12px; height: 12px !important}

.rtxt{color: #ff773b}
.gtxt{color: #7ed321}

#game_info{
  box-sizing:border-box;
  padding-top:7px;
  height: 85px;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  justify-content: space-between;
  gap: 10px;
  --gi-pad: 4px;
  --gi-label-w: 52px;
  --gi-gap: 6px;
  --gi-win-icon-w: 38px;
}

/* Shadow */
#pole > div, #op_cancel, #op_send, #current_game_history, #wn_cont, #gmt_time, #pers_container, #pers_chart, #pers_history, #current_game, #game_win_panel, #tips > div, #current_game_history{
-webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.19), 0 0 4px 0 rgba(204, 204, 204, 0.5);
-moz-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.19), 0 0 4px 0 rgba(204, 204, 204, 0.5);
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.19), 0 0 4px 0 rgba(204, 204, 204, 0.5)}

#pole > div{position: relative}
#pole > div > div{position:absolute; left:0; top:0; bottom:0; right:0; display:none}

#pole:not([win_num]) > div:nth-child(1) > div,
#pole:not([win_num]) > div:nth-child(2) > div,
#pole:not([win_num]) > div:nth-child(3) > div,
#pole:not([win_num]) > div:nth-child(4) > div,
#pole:not([win_num]) > div:nth-child(5) > div,
#pole:not([win_num]) > div:nth-child(6) > div,
#pole:not([win_num]) > div:nth-child(7) > div,
#pole:not([win_num]) > div:nth-child(8) > div,
#pole:not([win_num]) > div:nth-child(9) > div,
#pole[mybet="0"]:hover > div:not(:hover) > div{display:block; background:url(../img/coins/bet.png) center 2px no-repeat; opacity: 0.5}
#pole[mybet="0"]:hover > div:hover > div, #pole:not([win_num]):not(:hover) > div > div{display:none}

#pole[mybet="1"]:not([win_num]) > div:not(:nth-child(1)) > div, 
#pole[mybet="2"]:not([win_num]) > div:not(:nth-child(2)) > div, 
#pole[mybet="3"]:not([win_num]) > div:not(:nth-child(3)) > div, 
#pole[mybet="4"]:not([win_num]) > div:not(:nth-child(4)) > div, 
#pole[mybet="5"]:not([win_num]) > div:not(:nth-child(5)) > div, 
#pole[mybet="6"]:not([win_num]) > div:not(:nth-child(6)) > div, 
#pole[mybet="7"]:not([win_num]) > div:not(:nth-child(7)) > div, 
#pole[mybet="8"]:not([win_num]) > div:not(:nth-child(8)) > div, 
#pole[mybet="9"]:not([win_num]) > div:not(:nth-child(9)) > div {
  display: block;
  background: url(../img/coins/bet.png) center -112px no-repeat;
  opacity: 1;
}

/* Как в оригинале (tmp/game9-src): выбранная клетка без оверлея — яркая; остальные с «тусклой» фишкой выше */
#pole[mybet="1"]:not([win_num]) > div:nth-child(1) > div, 
#pole[mybet="2"]:not([win_num]) > div:nth-child(2) > div, 
#pole[mybet="3"]:not([win_num]) > div:nth-child(3) > div, 
#pole[mybet="4"]:not([win_num]) > div:nth-child(4) > div, 
#pole[mybet="5"]:not([win_num]) > div:nth-child(5) > div, 
#pole[mybet="6"]:not([win_num]) > div:nth-child(6) > div, 
#pole[mybet="7"]:not([win_num]) > div:nth-child(7) > div, 
#pole[mybet="8"]:not([win_num]) > div:nth-child(8) > div, 
#pole[mybet="9"]:not([win_num]) > div:nth-child(9) > div {
  display: none;
}

#pole[win_num="1"] > div:not(:nth-child(1)) > div, 
#pole[win_num="2"] > div:not(:nth-child(2)) > div, 
#pole[win_num="3"] > div:not(:nth-child(3)) > div, 
#pole[win_num="4"] > div:not(:nth-child(4)) > div, 
#pole[win_num="5"] > div:not(:nth-child(5)) > div, 
#pole[win_num="6"] > div:not(:nth-child(6)) > div, 
#pole[win_num="7"] > div:not(:nth-child(7)) > div, 
#pole[win_num="8"] > div:not(:nth-child(8)) > div, 
#pole[win_num="9"] > div:not(:nth-child(9)) > div,
#pole[mybet="0"] > div > div{display:none}

#pole[win_num="1"]:not([mybet="1"]):not([mybet="0"]) > div:nth-child(1) > div, 
#pole[win_num="2"]:not([mybet="2"]):not([mybet="0"]) > div:nth-child(2) > div, 
#pole[win_num="3"]:not([mybet="3"]):not([mybet="0"]) > div:nth-child(3) > div, 
#pole[win_num="4"]:not([mybet="4"]):not([mybet="0"]) > div:nth-child(4) > div, 
#pole[win_num="5"]:not([mybet="5"]):not([mybet="0"]) > div:nth-child(5) > div, 
#pole[win_num="6"]:not([mybet="6"]):not([mybet="0"]) > div:nth-child(6) > div, 
#pole[win_num="7"]:not([mybet="7"]):not([mybet="0"]) > div:nth-child(7) > div, 
#pole[win_num="8"]:not([mybet="8"]):not([mybet="0"]) > div:nth-child(8) > div, 
#pole[win_num="9"]:not([mybet="9"]):not([mybet="0"]) > div:nth-child(9) > div {display:block; background:url(../img/coins/win.png) center center  no-repeat;  animation-name: spin; animation-duration: 2000ms; animation-iteration-count: infinite; animation-timing-function: linear; opacity: 1}

#pole[mybet="1"][win_num="1"] > div:nth-child(1) > div, 
#pole[mybet="2"][win_num="2"] > div:nth-child(2) > div, 
#pole[mybet="3"][win_num="3"] > div:nth-child(3) > div, 
#pole[mybet="4"][win_num="4"] > div:nth-child(4) > div, 
#pole[mybet="5"][win_num="5"] > div:nth-child(5) > div, 
#pole[mybet="6"][win_num="6"] > div:nth-child(6) > div, 
#pole[mybet="7"][win_num="7"] > div:nth-child(7) > div, 
#pole[mybet="8"][win_num="8"] > div:nth-child(8) > div, 
#pole[mybet="9"][win_num="9"] > div:nth-child(9) > div{display: block; border:2px solid #f00; opacity: 1}

#pole[mybet="1"][win_num="1"] > div:nth-child(1), 
#pole[mybet="2"][win_num="2"] > div:nth-child(2), 
#pole[mybet="3"][win_num="3"] > div:nth-child(3), 
#pole[mybet="4"][win_num="4"] > div:nth-child(4), 
#pole[mybet="5"][win_num="5"] > div:nth-child(5), 
#pole[mybet="6"][win_num="6"] > div:nth-child(6), 
#pole[mybet="7"][win_num="7"] > div:nth-child(7), 
#pole[mybet="8"][win_num="8"] > div:nth-child(8), 
#pole[mybet="9"][win_num="9"] > div:nth-child(9){text-shadow: -1px -1px 0 #f00, 1px -1px 0 #f00, -1px 1px 0 #f00, 1px 1px 0 #f00;}

@keyframes spin {
    from {
        transform:rotate(0deg);
    }
    to {
        transform:rotate(360deg);
    }
}

.insh{-webkit-box-shadow: inset 0 1px 3px 0 rgba(20, 20, 20, 0.5);
-moz-box-shadow: inset 0 1px 3px 0 rgba(20, 20, 20, 0.5);
box-shadow: inset 0 1px 3px 0 rgba(20, 20, 20, 0.5);}
.br3{border-radius: 3px;}

hr.delim{border:none; border-bottom:1px solid #979797; width:60%; margin:0 auto}

#current_game{
  height:67px;
  font-family: AgencyFBCyrillic;
  margin: 0;
  flex: 1 1 50%;
  min-width: 0;
  overflow:hidden;
  text-align:center;
  padding: 5px 4px;
  box-sizing: border-box;
  box-shadow: 0px 2px 4px 0px #bbbbbb;
  border-radius:3px;
  border:1px solid  #a0a0a0;
  position:relative;
  display: flex;
  align-items: stretch;
}

#game_win_panel{
  height:67px;
  font-family: AgencyFBCyrillic;
  margin: 0;
  flex: 1 1 50%;
  min-width: 0;
  overflow-x: visible;
  overflow-y: hidden;
  text-align:center;
  padding: 5px 4px;
  box-sizing: border-box;
  box-shadow: 0px 2px 4px 0px #bbbbbb;
  border-radius:3px;
  border:1px solid  #a0a0a0;
  position:relative;
  display: flex;
  align-items: stretch;
}

@keyframes win_last_fx_win {
  0% {
    text-shadow: 0 0 0 transparent;
    box-shadow: inset 0 0 0 rgba(46, 159, 46, 0);
  }
  35% {
    text-shadow:
      0 0 16px rgba(46, 159, 46, 0.85),
      0 0 28px rgba(46, 159, 46, 0.45);
    box-shadow:
      inset 0 0 18px rgba(46, 159, 46, 0.25),
      0 0 20px rgba(46, 159, 46, 0.2);
  }
  100% {
    text-shadow: 0 0 10px rgba(46, 159, 46, 0.4);
    box-shadow: inset 0 0 0 rgba(46, 159, 46, 0);
  }
}

@keyframes win_last_fx_lose {
  0% {
    text-shadow: 0 0 0 transparent;
    box-shadow: inset 0 0 0 rgba(211, 47, 47, 0);
  }
  30% {
    text-shadow:
      0 0 16px rgba(211, 47, 47, 0.85),
      0 0 26px rgba(211, 47, 47, 0.4);
    box-shadow:
      inset 0 0 18px rgba(211, 47, 47, 0.22),
      0 0 18px rgba(211, 47, 47, 0.18);
  }
  100% {
    text-shadow: 0 0 10px rgba(211, 47, 47, 0.38);
    box-shadow: inset 0 0 0 rgba(211, 47, 47, 0);
  }
}

#win_last > div.win_last-fx-win{
  animation: win_last_fx_win 0.95s ease-out;
}
#win_last > div.win_last-fx-lose{
  animation: win_last_fx_lose 0.95s ease-out;
}

#win_last {
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: var(--gi-gap);
  padding: 0 var(--gi-pad);
  min-height: 52px;
}

#win_last::before {
  content: "";
  flex: 0 0 var(--gi-win-icon-w);
  width: var(--gi-win-icon-w);
  min-height: 28px;
  align-self: center;
  background: url(../img/coins/win.png) center center no-repeat;
  background-size: 24px 24px;
}

#win_last > div{
  flex: 1 1 auto;
  min-width: max-content;
  background-color: #fafafa;
  box-shadow: inset 0 1px 3px 0 rgba(220, 220, 220, 0.5);
  -webkit-box-shadow: inset 0 1px 3px 0 rgba(220, 220, 220, 0.5);
  -moz-box-shadow: inset 0 1px 3px 0 rgba(220, 220, 220, 0.5);
  border: solid 1px #e3e3e3;
  margin: 0;
  font-family: AgencyFBCyrillic;
  font-size: 18px;
  text-align: center;
  color: #656565;
  line-height: 1.2em;
  padding: 4px 6px;
  white-space: nowrap;
  overflow: visible;
  text-overflow: clip;
}

#win_last > div.gtxt{
  color: #1b6b1b;
  font-weight: 800;
  font-size: 18px;
  letter-spacing: 0.02em;
  text-shadow: 0 0 10px rgba(46, 159, 46, 0.45);
}
#win_last > div.rtxt{
  color: #b71c1c;
  font-weight: 800;
  font-size: 18px;
  letter-spacing: 0.02em;
  text-shadow: 0 0 10px rgba(211, 47, 47, 0.45);
}

#bet_lvl {
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: var(--gi-gap);
  padding: 0 var(--gi-pad);
  min-height: 52px;
}

#bet_lvl_tag {
  flex: 0 0 var(--gi-label-w);
  width: var(--gi-label-w);
  align-self: center;
  box-sizing: border-box;
  font-family: AgencyFBCyrillic, Arial, Helvetica, sans-serif;
  font-size: 15px;
  font-weight: bold;
  line-height: 1.15;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #7bc37b;
  text-align: center;
  padding: 4px 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#bet_lvl_val{
  flex: 1 1 0;
  min-width: 0;
  align-self: center;
  background-color: #fafafa;
  box-shadow: inset 0 1px 3px 0 rgba(220, 220, 220, 0.5);
  -webkit-box-shadow: inset 0 1px 3px 0 rgba(220, 220, 220, 0.5);
  -moz-box-shadow: inset 0 1px 3px 0 rgba(220, 220, 220, 0.5);
  border: solid 1px #e3e3e3;
  margin: 0;
  font-family: AgencyFBCyrillic;
  font-size: 18px;
  text-align: center;
  color: #656565;
  line-height: 1.2em;
  padding: 4px 8px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}


.progress{position:relative; font: inherit; font-size: 8px; color: #8a8a8a; background:url(../img/bg_progress.png) left bottom repeat-x; height:14px; max-height:14px; min-height:14px; line-height: 1em;}
.progress > div{position:absolute; left:0; top:0; right:0; bottom:0}
.progress > div:nth-child(1){background:url(../img/bg_progress.png); background:url(../img/bg_progress.png) left bottom repeat-x; height:14px; max-height:14px; min-height:14px}
.progress > div:nth-child(2){font: inherit; font-size: 12px; color: #000; height:14px; max-height:14px; min-height:14px; text-align:center; opacity:1; text-transform:uppercase; line-height:1.2em}

#pole{ padding-top: 7px; width:350px; height:358px}
#pole > div{width:112px; height:110px; border:1px solid #797979; font-family: Hennigar; font-size: 59px; text-align: center; line-height: 1.8em; border-radius:3px; float:left; cursor:pointer;}
	 
div#pole.dark > div{color: #999}
div#pole:not(.dark) > div{color: #fff; text-shadow:
   -1px -1px 0 #979797,  
    1px -1px 0 #979797,
    -1px 1px 0 #979797,
     1px 1px 0 #979797;}

/* Grad */
#pole > div, #op_cancel, #op_send, #current_game_history, #pers_container, #pers_chart, #gmt_time, #pers_history, #current_game, #game_win_panel, #current_game_history{background: #f7f7f7; 
background: -moz-linear-gradient(top, #ffffff 0%, #f7f7f7 100%);
background: -webkit-linear-gradient(top, #ffffff 0%,#f7f7f7 100%);
background: linear-gradient(to bottom, #ffffff 0%,#f7f7f7 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f7f7f7',GradientType=0 );}


#pole > div{ margin: 0 7px 7px 0; box-sizing: border-box;}
#pole > div:nth-child(3n){margin-right:0}

#op_cancel, #op_send{height:110px; border-radius:3px; cursor:pointer; border:1px solid #797979;}
#op_cancel{width:110px; float:left}
#op_send{margin-left: 120px; position: relative}

#op_cancel > div{width:100%; height:100%; background:url(../img/btn_cancel.png) center center no-repeat}
#op_send > div:nth-child(1){width:100%; height:100%;  background:url(../img/btn_send.png) center center no-repeat}

#current_game_history{margin-top: 12px; overflow:hidden; height: 108px; position: relative; width: 100%}
#current_game_history.onTop{position: absolute; left: 0;  z-index: 10; width: 100%}
#cgh_scroll_top{border-bottom:1px solid #979797;}

#cgh_data > div{box-sizing: border-box; border:1px solid transparent; height: 15px}
#cgh_data > div:hover, #cgh_data > div.selected{border:1px solid #000}
#cgh_data > div > div, #ph_data > div{font-family: HelveticaNeueCyr-Roman; font-size: 12px; text-align: center; color: #000; text-transform:uppercase; box-sizing:border-box; line-height: 1.2em}

#cgh_head {margin: 0}
#cgh_head > div:nth-child(1),
#cgh_head > div:nth-child(2),
#cgh_head > div:nth-child(3),
#cgh_head > div:nth-child(4){float:left}
#cgh_head > div:nth-child(5), #cgh_data > div > div:nth-child(5){float: left} 

#cgh_head > div:nth-child(3){background: url(../img/colored_people.png) center 3px no-repeat}
#cgh_head > div:nth-child(4){background: url(../img/colored_people.png) center -23px no-repeat}
#cgh_head > div:nth-child(5){background: url(../img/colored_people.png) center -49px no-repeat}

/* Адаптивная ширина колонок истории игры (вместо фиксированных px). */
#cgh_head > div:nth-child(1), #cgh_data > div > div:nth-child(1){width:17%}
#cgh_head > div:nth-child(2), #cgh_data > div > div:nth-child(2){width:11%}
#cgh_head > div:nth-child(3), #cgh_data > div > div:nth-child(3){width:25%}
#cgh_head > div:nth-child(4), #cgh_data > div > div:nth-child(4){width:25%}
#cgh_head > div:nth-child(5), #cgh_data > div > div:nth-child(5){width:22%}

#cgh_data > div > div:nth-child(1),
#cgh_data > div > div:nth-child(2),
#cgh_data > div > div:nth-child(3),
#cgh_data > div > div:nth-child(4){float:left}

#cgh_data{ position:absolute; left:0; right:37px; bottom:0px; top:24px; overflow:hidden}
#cgh_data > div:nth-child(2n+1){ background-color:#ececec}
#cgh_data > div > div{
	color:#000;
	cursor: pointer;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

#cgh_scroll_top:hover, #cgh_scroll_down:hover, #ph_scroll_l:hover, #ph_scroll_r:hover{background-color: #f0f0f0}
#cgh_scroll_top, #cgh_scroll_down, #ph_scroll_l, #ph_scroll_r{width:30px; cursor:pointer; position: absolute; right: 0px}
#cgh_scroll_top, #ph_scroll_l{background:#e5e5e5 url(../img/btn_tbl_scroll_up.png) center center no-repeat; top: 0px; bottom: 50%; border-bottom: 3px solid #fff;}
#cgh_scroll_down, #ph_scroll_r{background:#e5e5e5 url(../img/btn_tbl_scroll_down.png) center center no-repeat; top:50%; bottom: 0px; border-top:3px solid #fff}
	
	
#wn_cont{width:173px; height:167px; box-sizing:border-box; padding:7px; position:relative; float:left; border-radius:3px; background-color:#fff}
#win_num{font-family: Hennigar; font-size: 99px; text-align: center; color: #ffffff; line-height:1.55em}
#win_num{text-shadow:
   -1px -1px 0 #767676,  
    1px -1px 0 #767676,
    -1px 1px 0 #767676,
     1px 1px 0 #767676;-webkit-text-stroke: 1px #767676;}

.ang1, .ang2, .ang3, .ang4{position:absolute; width:29px; height:29px; background-color:#e1e1e1; border:1px solid #767676; overflow:visible; box-sizing:border-box}
.ang1 > div, .ang2 > div, .ang3 > div, .ang4 > div{position:absolute; background-color:#fff; width:23px; height:23px}

.ang1{left:7px; top:7px; z-index:10}
.ang2{right:7px; top:7px; z-index:10}
.ang3{right:7px; bottom:7px; z-index:10}
.ang4{left:7px; bottom:7px; z-index:10}

.ang1 > div{top:4px; left:4px; border-top: 1px solid #767676; border-left: 1px solid #767676;}
.ang2 > div{top:4px; right:4px; border-right: 1px solid #767676; border-top: 1px solid #767676;}
.ang3 > div{bottom:4px; right:4px; border-right: 1px solid #767676; border-bottom: 1px solid #767676;}
.ang4 > div{bottom:4px; left:4px; border-left: 1px solid #767676; border-bottom: 1px solid #767676;}

#gmt_time{ margin-left:181px; box-sizing:border-box; border-radius:3px; position: relative; height: 100%; padding: 7px;}
#gmt_time > div {border:1px dashed #979797;font-family: ic; text-align: center; color: #474c4f; overflow: hidden}
#gmt_time > div:first-child{font-size: 60px; line-height: 1.3em; height:93px}
#gmt_time > div:last-child{margin-top:7px; height:49px; position:relative}

#t_over, #no_bet{position:absolute; left:0; right:0; bottom:0; top:0; background: url(../img/tover.png) top left repeat}

.g_txt{font-size: 13px; text-align: center; color: #7ed321;}

#progress_timer{width:238px; height:14px; background:url(../img/bg_progress.png) top left no-repeat; margin:0 auto}
#progress_timer > div{height:14px; background:url(../img/bg_progress.png) bottom left no-repeat}


#pers_container, #pers_history{padding:7px; box-sizing:border-box; margin-top:12px; position: relative}
#pers_container{height: 347;}
#pers_container > div:nth-child(1){border:1px dashed #979797; height:100%}
#pers_container > div:nth-child(2){position: absolute; left: 8px; top: 8px; right: 8px; bottom: 6px; z-index: 10; display: none}
#pers_container > div:nth-child(2) > div:nth-child(1){position: absolute; left: 0; top: 0; right: 0; bottom: 0; background-color: #ededed}
#pers_container > div:nth-child(2) > div:nth-child(2){position: absolute; right: 0px; top: 0px; z-index: 11; width: 25px; height: 25px; background: url(../img/close_btn.png) center center no-repeat; opacity: 0.5}
#pers_container > div:nth-child(2) > div:nth-child(2):hover{opacity: 1}

#pers_history{ position: relative; height: 100%}

/* Personal history: flex columns, Agency header like #cgh_head */
#ph_h{
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  box-sizing: border-box;
  margin: 0 30px 0 0;
  padding: 0 2px;
  min-height: 24px;
  background: transparent;
  border: none;
  border-radius: 0;
}

#cgh_head > div{
  box-sizing: border-box;
  height: 24px;
  font-family: AgencyFBCyrillic;
  font-size: 15px;
  text-align: center;
  color: #2992cb;
  text-transform: uppercase;
}
#ph_h > div.ph-hdr{
  box-sizing: border-box;
  min-height: 24px;
  height: auto;
  font-family: AgencyFBCyrillic;
  font-size: 15px;
  font-weight: normal;
  line-height: 1.35em;
  text-align: center;
  color: #2992cb;
  text-transform: uppercase;
}
#ph_h > div.ph-hdr.ph-ledger{ color: #2992cb; }
#ph_h > div.ph-hdr.ph-balance{ font-weight: bold; }

#ph_h > div:not(.empty):not(.ph-col-grid):not(.ph-balance){
  flex: 1 1 5%;
  min-width: 0;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
#ph_h > div.ph-col-grid{
  flex: 2 1 72px;
  min-width: 6.75rem;
  max-width: none;
  overflow: visible;
  display: flex;
  align-items: center;
  justify-content: center;
}
#ph_h > div.ph-balance{
  flex: 1 1 4.75rem;
  min-width: 4.75rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding-right: 10px;
  box-sizing: border-box;
}
#ph_h > div.empty{
  flex: 0 0 1.4%;
  max-width: 11px;
  min-width: 0;
}
#ph_h > div.ph-sec-end{
  flex: 0 0 8px;
  max-width: 10px;
  border-right: 1px solid #2992cb;
  margin: 0 6px 0 0;
  padding: 0;
  align-self: stretch;
  opacity: 0.55;
  box-sizing: content-box;
}

#ph_mon{position: absolute; left: 7px; top: 26px; right: 37px; bottom: 0; overflow: hidden}

#ph_data{box-sizing:border-box; margin:4px 0 0 0; overflow-x: auto; overflow-y: hidden; white-space:nowrap; border: none;}
#ph_data > div{
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  box-sizing: border-box;
  min-height: 16px;
  min-width: max-content;
  width: 100%;
  border: 1px solid rgba(0,0,0,0);
  text-transform: none;
}
#ph_data > div:nth-child(2n+1) > div:not(.empty){background-color: #ececec}
#ph_data > div > div{
  color:#000;
  overflow:visible;
  text-align:center;
  box-sizing:border-box;
  min-height: 14px;
  font-size: 12px;
  line-height: 14px;
  font-family: HelveticaNeueCyr-Roman, Arial, sans-serif;
  display: flex;
  align-items: center;
  justify-content: center;
}
#ph_data > div > div.ph-col-grid{
  flex: 2 1 72px;
  min-width: 6.75rem;
  max-width: none;
  overflow: visible;
  letter-spacing: 0.02em;
  white-space: nowrap;
}
#ph_data > div > div.ph-m.ph-bal{
  font-weight: 600;
  justify-content: flex-end;
  padding-right: 10px;
  box-sizing: border-box;
}

#ph_data > div > div > span{
  color: inherit;
}
#ph_data > div > div > span:not(:last-child){margin-right: 3px}

#ph_data > div > div:not(.empty):not(.ph-col-grid):not(.ph-bal){
  flex: 1 1 5%;
  min-width: 0;
}
#ph_data > div > div.ph-bal{
  flex: 1 1 4.75rem;
  min-width: 4.75rem;
}
#ph_data > div > div.empty{
  flex: 0 0 1.4%;
  max-width: 11px;
  min-width: 0;
}
#ph_data > div > div.ph-sec-end{
  flex: 0 0 8px;
  max-width: 10px;
  border-right: 1px solid #2992cb;
  margin: 0 6px 0 0;
  opacity: 0.45;
  overflow: visible;
  box-sizing: content-box;
}
#ph_data > div > div.ph-m{
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}

#ph_data div[noselected="1"] > span:nth-child(1){color: #FF0000}
#ph_data div[noselected="2"] > span:nth-child(2){color: #FF0000}
#ph_data div[noselected="3"] > span:nth-child(3){color: #FF0000}
#ph_data div[noselected="4"] > span:nth-child(4){color: #FF0000}
#ph_data div[noselected="5"] > span:nth-child(5){color: #FF0000}
#ph_data div[noselected="6"] > span:nth-child(6){color: #FF0000}
#ph_data div[noselected="7"] > span:nth-child(7){color: #FF0000}
#ph_data div[noselected="8"] > span:nth-child(8){color: #FF0000}
#ph_data div[noselected="9"] > span:nth-child(9){color: #FF0000}

div[pgameid]{cursor: pointer; box-sizing: border-box}
div[pgameid]:hover, div[pgameid].selected{border-color: #000 !important}
div[bet_status="1"]{background-color: #FFC6C6 !important}
.nowin {background-color: #c2e8fb}

#over{background-color:rgba(0, 0, 0, 0.75); position:fixed; left:0; top:0; right:0; bottom: 0; z-index:1000; width: 100%; height: 100%}
#frm{ width:300px; max-width:300px; position:relative}

#frm > div{display:none; border-radius: 4px; background-color: #ffffff;-webkit-box-shadow: 4px 7px 19px 0px rgba(195,195,195,1);-moz-box-shadow: 4px 7px 19px 0px rgba(195,195,195,1);box-shadow: 4px 7px 19px 0px rgba(195,195,195,1);}

.frm_head{font-family: Bodoni; font-size: 18px; letter-spacing: 2px; color: #434343; line-height:2em; padding:7px;
-webkit-box-shadow: 0px 0px 13px 0px rgba(174,174,174,1);
-moz-box-shadow: 0px 0px 13px 0px rgba(174,174,174,1);
box-shadow: 0px 0px 13px 0px rgba(174,174,174,1);}
.frm_head > a{font-family:Helvetica, Arial, sans-serif; font-size:10px; float:right; text-decoration:none; color: #bdc3c6; letter-spacing: 0;}

#reg input:not(.my){ border-radius: 3px; background: #fcfcfd url(../img/qw.png) 97% 0px no-repeat; border:1px solid #ecf0f3;font-size: 10px; color: #889399; font-family:Helvetica, Arial, sans-serif; width:100%; line-height:2em; margin-bottom:7px; padding-left:7px}

.buinp{background: #fcfcfd url(../img/qw.png) 97% 0px no-repeat; border-radius: 3px; border-top: none !important; border-left: none !important; border-right:none !important; background: #fcfcfd url(../img/qw.png) 97% 0px no-repeat; border-bottom:1px solid #d4d4d4;font-size: 10px; color: #889399; width:100%; line-height:2em; margin-bottom:7px; padding-left:7px; font-family: OpenSans!important; font-size: 14px!important; color: #757575 !important}
.datapan{padding:21px}

.btn_frm{border-radius: 2px;  background-color: #616161; font-size: 17px; font-weight: 600; font-family:Helvetica, Arial, sans-serif; text-align: center; color: #ffffff; cursor:pointer; line-height:3em}
.rel_cont{position:relative}
#msg_txt, #msg_txt *{color:#000}

.wc{color:#4B9100 !important}
.lc{color:#d00013 !important}

#login, #reg{ width: 1147px; height: 569px; box-sizing: border-box}
#login > div:nth-child(2), 
#reg > div:nth-child(2){padding: 83px 74px; width: 388px; height: 370px;}
#login > div:nth-child(2) > div:nth-child(2){padding-top: 20px}

#agree{position: relative}
#agree, #agree > span{text-align: justify; color: #a6a6a6; vertical-align: top; font-size: 12px}
#agree > span{display: inline-block;margin-left: 30px; font-family: HelveticaNeueCyr-Light}

#reg > div:nth-child(2) > div:nth-child(2){border-top:1px solid #4990e2; margin-top: 20px}
#login > div:nth-child(1), 
#reg > div:nth-child(1){float: right; background: url(../img/r_login_bg_multy.png) right top no-repeat; width: 610px; height: 569px}

#login > div:nth-child(1) > div, 
#reg > div:nth-child(1) > div{margin: 0 auto; width: 356px;}
#login > div:nth-child(1) > div:nth-child(1), 
#reg > div:nth-child(1) > div:nth-child(1){font-family: OpenSans; font-size: 25px; font-weight: 600; line-height: 1.47; text-align: left; color: #ffffff; margin-top: 340px; }
#login > div:nth-child(1) > div:nth-child(2), 
#reg > div:nth-child(1) > div:nth-child(2){ font-family: OpenSans; font-size: 14px; line-height: 2.14; text-align: left; color: #ffffff;}
.login_frm_head{font-family: LoginHead; font-size: 50px; text-align: center; color: #000}
.login_frm_head > div{font-family: OpenSans; font-size: 14px; font-weight: 600; color: inherit}

.btn_log{border-radius: 3px; -webkit-box-shadow: 0px 0px 16px 0px rgba(255,255,255,1);-moz-box-shadow: 0px 0px 16px 0px rgba(255,255,255,1); box-shadow: 0px 0px 16px 0px rgba(255,255,255,1);font-family: OpenSans; font-size: 14px; font-weight: 600; line-height: 3em;  text-align: center; color: #ffffff; width: 115px !important; cursor: pointer}

.bg_none{background-color: transparent}
.bg_none:hover{background-color: rgba(255,255,255,0.10)}

.bg_blue{background-color: #4990E2}
.bg_blue:hover{background-color: rgba(73,144,226,0.70)}

#copy{font-family: OpenSans; font-size: 12px; text-align: left; color: #a1a1a1; padding-left: 72px}

.frm_descr{font-family: OpenSans; font-size: 12px; text-align: left; color: #4990e2;}
.frm_check{font-family: OpenSans; font-size: 14px; text-align: left; color: #a1a1a1;}

.frm_input{background-color: transparent !important; border-top: none !important; border-left: none !important; border-right:none !important; border-bottom: 1px solid #4990e2!important; font-family: OpenSans!important; font-size: 14px!important; color: #757575 !important; background: none !important}

input.my{display:none;}
input.my + label{ font-family: OpenSans; font-size: 14px; text-align: left; color: #a1a1a1;  cursor: pointer;}
input.my + label::before{content: ""; display: inline-block; height: 14px; width: 14px; margin: 0 5px 0 0; background-image: url(../img/my_check.png); background-repeat: no-repeat;}

input.my + label::before {background-position: 0 0}
input.my:checked + label::before {background-position: 0 -16px;}
input.my:disabled + label::before {background-position: 0 0;}
input.my:checked:disabled + label::before {background-position: 0 -16px;}

.abs{position: absolute}
.rel{position: relative}

.pass_viz, .pass_viz > div{width: 5px; height: 30px; display: block}
.pass_viz{position: relative; background: url(../img/pass-vis.png) left top no-repeat; margin-left: 25px; cursor: pointer}
.pass_viz > div{position: absolute; background: url(../img/pass-vis.png) right top no-repeat}

.pass_field_sett{background: url(../img/fa-eye.png) left center no-repeat; width: 30px; height: 32px;}

#sec_lvl{font-family: OpenSans; font-size: 14px; text-align: left; color: #d0011b;}
#sec_desc{font-family: OpenSans; font-size: 10px; text-align: left; color: #a1a1a1;}

/* chart */
.b_desc{font-family: LucidaGrande; font-size: 11px; color: #282828; fill: #282828;}
.b_desc_w{font-family: LucidaGrande; font-size: 11px; color: #ffffff; fill: #ffffff;}
.vote{display: none; color: #ff0000; cursor: pointer; padding-right: 21px; font-size: 12px; text-align: right}

.ggrad{background: #fcfcfc;background: -moz-linear-gradient(top,  #fcfcfc 0%, #f1f1f1 100%);background: -webkit-linear-gradient(top,  #fcfcfc 0%,#f1f1f1 100%);  background: linear-gradient(to bottom,  #fcfcfc 0%,#f1f1f1 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#f1f1f1',GradientType=0)}

.grgrad{background: #b4ed50;background: -moz-linear-gradient(top,  #b4ed50 0%, #99e879 100%);background: -webkit-linear-gradient(top,  #b4ed50 0%,#99e879 100%); background: linear-gradient(to bottom,  #b4ed50 0%,#99e879 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b4ed50', endColorstr='#99e879',GradientType=0 )}

#pay_frm, #outpay_frm{border:1px solid #929292; border-radius: 4px; position: relative; width: 450px}
.pf_head{font-size: 14px; text-align: center; line-height: 1.5em; border-bottom: 1px solid #929292; border-radius: 4px 4px 0 0; color: #000000}
.pf_body{padding: 14px; text-align: center}
.pf_body input{margin-top: 3px; margin-bottom: 3px}

.bb_input{-webkit-box-shadow: 0px 0px 5px 0px rgba(100, 152, 201, 0.4);-moz-box-shadow: 0px 0px 5px 0px rgba(100, 152, 201, 0.4); box-shadow: 0px 0px 5px 0px rgba(100, 152, 201, 0.4); border: 1px solid rgba(100, 152, 201, 0.4); padding: 2px 7px}
.gr_btn{font-size: 12px; text-align: center; color: #000; border:1px solid #797979; border-radius: 3px; width: 150px; line-height: 1.5em; cursor: pointer; padding: 0;}
.inp_descr{color: #999; font-weight: bold}

#qrcode{display: none; width: 100%; min-height: 150px; text-align: center}
#qrcode img{ width: 150px; height: 150px}
#qrcode > div{color: #333; -moz-user-select: text;-khtml-user-select: text;user-select: text;}


.close_pay_frm{position: absolute; right: 7px; top:0px; color: #000; cursor: pointer}
.close_pay_frm:hover{color:#f00}

#social_login{}
#social_login > *, #social_login span {color: #757575 !important; margin-top: 7px;}
#social_login > a:not(:first-child){margin-left: 3px}
#social_login > a:hover{text-decoration: none}
#social_login span{padding: 3px; width: 150px; height: 28px; box-sizing: border-box; display: inline-block}
#social_login span:hover{background-position: bottom center !important}
#social_login span#fb{background-image: url(../img/soc_btn/fb.png); background-position: top center; background-repeat: no-repeat}
#social_login span#wch{background-image: url(../img/soc_btn/wechat.png); background-position: top center; background-repeat: no-repeat}

@keyframes lvl-bar-flow {
	0%, 100% { background-position: 0% 0%; }
	50% { background-position: 0% 100%; }
}
@keyframes lvl-active-shine {
	0%, 12% { transform: translateX(-30%) skewX(-16deg); opacity: 0; }
	28% { opacity: 0.55; }
	100% { transform: translateX(320%) skewX(-16deg); opacity: 0; }
}
@keyframes lvl-row-glow-light {
	0%, 100% { box-shadow: inset 0 0 0 1px rgba(73, 145, 227, 0.4), 0 0 12px rgba(73, 145, 227, 0.18); }
	50% { box-shadow: inset 0 0 0 1px rgba(127, 212, 34, 0.45), 0 0 18px rgba(127, 212, 34, 0.22); }
}
@keyframes lvl-num-breathe-light {
	0%, 100% { text-shadow: 0 0 10px rgba(73, 145, 227, 0.35); transform: scale(1); }
	50% { text-shadow: 0 0 16px rgba(127, 212, 34, 0.45); transform: scale(1.03); }
}
@keyframes lvl-star-pulse {
	0%, 100% { filter: hue-rotate(76deg) saturate(1.35) brightness(1.05); transform: scale(1); }
	50% { filter: hue-rotate(76deg) saturate(1.55) brightness(1.12); transform: scale(1.07); }
}
@media (prefers-reduced-motion: reduce) {
	.lvl.current,
	.lvl.current::before,
	.lvl.current::after,
	.lvl.current > div:nth-child(1),
	.lvl.current > div:nth-child(4) {
		animation: none !important;
	}
}

#sys_msg{position: absolute; left:7px; right: 7px; top:28px; color: black; line-height: 1.2em; font-size: 14px; background: url(/icon/icon_16x16.png) 1px 1px no-repeat; text-indent: 18px;}
#sys_msg a{color: #336699}
#sys_msg a:hover{background-color: #336699; color: #fff}

#tips{position: fixed; bottom: 60px; right: 15px; width: 384px; z-index: 5000; display: none}
#tips > div{width: 364px; margin-top: 7px; box-sizing: border-box; border:2px solid #aeaeae; border-radius: 6px; position: relative}
#tips > div > div{color: #333333; margin: 14px}
#tips > div > span{position: absolute; display: block; width: 23px; height: 24px; bottom: 6px; right: -23px}

#tips > div.bgError{background: #ff005c !important}
#tips > div.bgError > span{background: url(../img/ugolok_r.png) left top no-repeat;}
#tips > div.bgInfo{background: #ff8900 !important}
#tips > div.bgInfo > span{background: url(../img/ugolok_o.png) left top no-repeat;}
#tips > div.bgNormal{background: #81e981 !important}
#tips > div.bgNormal > span{background: url(../img/ugolok.png) left top no-repeat;}

#vertical{display: none}