body { background: #000 top center no-repeat;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
margin: 0;
color: #AEA07A;
background-image: url(../images/bg.jpg);}

#warpper { width:1000px; margin:0 auto;}
#header {width: 1000px;height:532px;background:url(../images/header.png);}

#left { width:240px; float:left; background: url(../images/left.png) ; height:1369px;}
#center { width:519px; float:left;}
#right { width:241px; float:right; background: url(../images/right.png) ; height:1369px;}

#slide_area {width:519px;height:180px;background: url(../images/slide2.png);}
#items { width:519px; height:141px; background:url(../images/items.png);}
#contentz {background:url(../images/content.png);height: 1170px;width:519px;padding-top: 17px;/* padding-right: 28px; */}

/* Scrollbar Styling */
.scrollbar::-webkit-scrollbar {
    width: 3px;
}
 
.scrollbar::-webkit-scrollbar-track {
    background-color: #00000000;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

.scrollbar::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: #6d6d6d; 
}

#content_area{
    /* width: 200px; */
    width: 495px;
    /* background: #fff !important; */
    height: 500px;
    padding-left: 2px;
}
#footer { background:url(../images/footer.png) top no-repeat; clear:both; width:100%; height:99px;}

#menu,#menu a { font-size:13px;font-weight: bold; font-family:Tahoma, Arial, Helvetica, sans-serif; text-transform:uppercase; color:#f0e8ce; text-decoration:none;padding:5px;}
#menu a:hover { font-size:13px;font-weight: bold; font-family:Tahoma, Arial, Helvetica, sans-serif; text-transform:uppercase; color:#f0e8ce; text-decoration:none; padding:5px; background:rgba(239, 239, 239, 0.23);-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px; border-top::1px solid #a94d4d;-webkit-box-shadow: 0px 5px 0px 0px rgba(50, 50, 50, 0.75);
-moz-box-shadow:    0px 2px 0px 0px rgba(50, 50, 50, 0.75);
box-shadow:         0px 2px 0px 0px rgba(50, 50, 50, 0.75);}


#menu_area {padding-top: 83px;}
#time_area {margin-top: 68px;
margin-left: 145px;}

#member_area {width: 200px;
height: 245px;
margin-top: 77px;
margin-left: 20px;}

#rss_area {width: 200px;
height: 245px;
margin-top: 201px;
margin-left: 20px;}

#stats_area {width: 200px;
height: 245px;
margin-top: 77px;
margin-left: 20px;}

#hof_area {width: 200px;
height: 245px;
margin-top: 128px;
margin-left: 21px;}

#other_area {width: 200px;
height: 245px;
margin-top: 128px;
margin-left: 20px;}

#login_field {
						background: url(../images/field.png);
						width: 188px;
						height: 29px;
						color: #666;
						text-align: center;
						font-size: 11px;
						border: 0px;
						margin-bottom: 3px;
					}
										#loginbtn { float:right; padding-top:3px;}
					#logintxt { float:left; padding-top:3px;}
					 
					#lost,#lost a {
						font-family: 'Archivo Narrow', sans-serif;
						color:#ab9696;
						text-decoration:none;
						font-size:11px;
						padding-top:5px;line-height: 1.2;
						text-shadow:#000 0px 1px 0px; 
						
						}
					#lost,# a:hover {
						font-family: 'Archivo Narrow', sans-serif;
						color:#fff;
						text-decoration:none;
						font-size:11px;
						padding-top:5px;
						text-shadow:#000 0px 1px 0px; 
						
						}
						#space { height:3px;}
						#login_area {width: 189px;
margin: 0 auto;}
#rss { width: 179px;
height: 45px;
margin: 0 auto;
padding-top: 4px;}
#rss_img { background:url(../images/forum.png); width:46px; height:45px; float:left;}
#rss_text { float:left; height:45px;}
#rss_title {height: 15px;
padding-left: 2px;
padding-top: 11px;}
#rss_title a{font-size: 13px;
font-family:Tahoma, Arial, Helvetica, sans-serif;
color: #E8D8E2;
text-decoration: none;
text-shadow: #000 0px 0px 3px;}
#rss_title a:hover{font-size: 13px;
font-family:Tahoma, Arial, Helvetica, sans-serif;
color: #fff;
text-decoration: none;
text-shadow: #000 0px 0px 3px;}
#rss_date { height:10px; font-size:8px; text-align:left;padding-left: 2px;text-shadow: #000 0px 0px 3px;}


.rank_player{width: 172px;height: 20px;border-bottom: 1px solid rgba(255, 255, 255, 0.1);background: rgba(255, 255, 255, 0.02);padding: 1px;/* margin-left: 15px; */margin-bottom: 4px;-webkit-box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.4);-moz-box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.4);box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.39);font-size: 10px;}

.rank_player2 {width: 183px;
height: 26px;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(255, 255, 255, 0.02);
padding: 5px;
margin-bottom: 7px;
margin-left: 10px;
-webkit-box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.4);
-moz-box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.4);
box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.39);
font-size: 10px;}

.c1 {color: #CDBFCF;}

#item {width: 89px;
height: 76px;
margin-top: 36px;
float: left;}
#item_space {width: 37px;
height: 141px;
float: left;}

#item_image {text-align: center;
margin-top: 8px;}

#item_title {text-align: center;
color: #E8D7E8;
text-shadow: #000 0px 0px 3px;
font-size: 11px;
margin: 3px;}
#item_price {text-align: center;
color: #C59140;
text-shadow: #000 0px 0px 3px;
font-size: 9px;}
#vote {width: 198px;
height: 100px;
margin-top: 30px;
/* background: #fff; */
padding-left: 3px;}
#vote1{background: url(../images/votebg.png) top no-repeat;
height: 32px;
width: 92px;
margin: 3px;
float: left;}

#vote2{background: url(../images/votebg.png);
height: 32px;
width: 90px;
margin-right: 3px;
float:left}#stat {clear: both;margin-top: 34px;margin-left: 12px;}



















.online {color:#4CAF50}
.name {color:#949283}


.element-item {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  float: left;
  width: 101px;
  height: 155px;
  margin: 6px;
  padding: 10px;
  color: #A39E99;
  text-shadow: 1px 1px 2px rgba(0,0,0,.45);
  background-color: rgb(55, 56, 60);
  box-shadow: 0 0 6px rgba(2, 2, 2, 1), 1px 2px 1px rgba(42, 43, 52, 1), inset 0 0 1px rgba(100, 100, 107, 1), inset 0 0 19px rgba(58, 58, 61, 1);
}
.isotope:after {
  content: '';
  display: block;
  clear: both;
}
.isotope {
position: relative;
  height: 800px;
  text-align: center;
  margin-left: 7px;
  margin-top: 20px;
}
.element-item:hover {background-color: rgb(68, 68, 68);}


#news_center {
	width:468px;
	margin:0 auto;
}

.news_title {
	background: #1a262e;
	width: 497px;
	height:46px;
	float: left;
	cursor: pointer;
	font-size:15px;
	color: rgb(143 121 114);
	text-shadow:#000000 0px 1px 0px;
	font-family: 'Archivo Narrow', sans-serif;
	text-decoration:none;
	margin-bottom:2px;
	margin-top:2px;
	-webkit-box-shadow: 0 8px 6px -6px rgb(0 0 0 / 40%);
	-moz-box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.4);
	box-shadow: 0 8px 6px -6px rgb(0 0 0 / 39%);
}
	
.news_content2 {	
	float: left;
	display: none;
}

#news_board {
	background: rgba(0, 0, 0, 0.44);
	width: 487px;
	margin-bottom: 5px;
	margin-top: 1px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	padding: 5px;
	border-left: 1px solid rgba(255, 255, 255, 0.08);
	border-right: 1px solid rgba(255, 255, 255, 0.08);
	border-top: 1px solid rgba(255, 255, 255, 0.08);
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: rgb(105, 105, 105);
	line-height: 1.45;
}

#accoun_panel_menu {
  /* width: 1200px; */
  /* height: auto; */
  /* float: left; */
  margin: 0 0 0 -28px;
}
#accoun_panel_menu li
#boost {
  width: 570px;
  height: 60px;
  margin: 30px 0 55px 0;
  padding: 0;
  background: none;
  box-shadow: none;
}
#accoun_panel_menu li, 
#accoun_panel_menu li a, 
#accoun_panel_menu li a div
#icon, 
#accoun_panel_menu li a span, 
#accoun_panel_menu li a span p {
  transition: all 500ms;
  -moz-transition: all 500ms;
  -webkit-transition: all 500ms;
  -o-transition: all 500ms;
}
#accoun_panel_menu li a {
  /* display: block; */
  width: 274px;
  height: 55px;
}
#accoun_panel_menu li a div#icon {
  width: 37px;
  height: 46px;
  background-size: 100%;
  float: left;
  border-radius: 3px;
  box-shadow: inset 0 0 0 1px #ffffff, inset 0 0 6px 3px rgb(0 0 0 / 70%), 0 0 5px rgb(0 0 0 / 80%), 0 1px 1px rgb(0 0 0 / 50%);
  margin: 8px 10px 0 10px;
  color: #fff;
  font-size: 30px;
  padding-left: 7px;
}


#accoun_panel_menu li a:hover span p {
  color: #d5a83c;
}
#accoun_panel_menu li a:hover span {
  color: #7d776c;
}
#accoun_panel_menu li {display: block;/* float: left; *//* width: 91%; */padding: 10px;height: 68px;border-radius: 10px;background: rgb(18 60 86);margin: -1px 0px 6px -10px;border-bottom: 1px solid #ffffff1a;box-shadow: inset 0 0 0 1px rgb(255 255 255 / 1%), 0 0 16px -1px rgb(0 0 0 / 14%), 0 6px 1px rgb(24 31 40);}

#accoun_panel_menu li a span {float: left;/* display: block; */text-align: left;line-height: 0%;font-size: 11px;font-family: 'Tahoma';/* font-family: calibrib; */color: #6c91a9;text-shadow: 0 1px 1px rgba(0,0,0,.4), 0 0 4px rgba(0,0,0,.6);}#accoun_panel_menu li a span p {
  color: #ffffff;
  font-size: 16px;
  /* text-transform: uppercase; */
}
.on {
	background: #4d4054;
	width: 497px !important;
	height:46px;
	font-size:15px;
	color:#ffffff;
	text-shadow:#000000 0px 1px 0px;
	font-family: 'Archivo Narrow', sans-serif;
	text-decoration:none;
	opacity: 1;
}
	
.over {
	background: #2b3b45;
	width: 497px;
	height:46px;
	font-size:15px;
	color:#fff;
	text-shadow:#000000 0px 1px 0px;
	font-family: 'Archivo Narrow', sans-serif;
	text-decoration:none;
	opacity: 0.7;
	-webkit-transition: all 600ms ease-in-out;
	-moz-transition: all 600ms ease-in-out;
	-o-transition: all 600ms ease-in-out;
	transition: all 600ms ease-in-out;
	-webkit-box-shadow: 0 8px 6px -6px rgb(0 0 0 / 40%);
	-moz-box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.4);
	box-shadow: 0 8px 6px -6px rgb(0 0 0 / 39%);
}

#news_t {
	padding-left: 10px;
	padding-top: 13px;
}

#slide_dimension {
	width:465px;
	height:175px;
	padding-left:18px;
	padding-top:7px;
}


ul li {
    list-style: none;
}#page_title {
    color: #8d7770;
    /* font-family: 'Tahoma'; */
    font-size: 21px;
    text-decoration: none;
    padding: 5px;
    border: 1px solid #ffffff08;
    background: rgb(0 0 0 / 0%);
    margin-bottom: -2px;
    border-width: 1px;
    /* border-color: rgb(19 75 111); */
    border-style: solid;
    /* border-radius: 25px; */
    /* padding: 0px 7px; */
    font-size: 11px;
    transition: .3s;
    text-align: center;
    line-height: 36px;
}



#vote-options li {float: left;margin-top: 10px;padding: 6px;margin: 5px;height: 193px;background: rgb(43 59 69);/* box-shadow: 0 0 4px rgba(0,0,0,.6), 0 1px 1px rgba(0,0,0,.5), inset 0 0 0 1px rgba(255,255,255,.015), inset 0 1px 0 rgba(255,255,255,.05); */-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;/* margin-left: -38px; */z-index: 1;}

#vote-options li img {
	/* width:75px; */
	/* height:45px; */
}
#dwd {border: 1px solid #999; */line-height: 28px;margin: 6px 0;padding: 0 5px;width: auto;height: 36px;border: none;cursor: pointer;line-height: 0;text-transform: capitalize;padding: 0 21px 2px 21px;vertical-align: top;/* margin: 2px 0 0 0; */background: #2b3b45;background: #576067;font-size: 13px;color: #FFFFFF;/* padding: 10px; */text-transform: uppercase;font-weight: normal;border-radius: 3px;text-shadow: 0 0 6px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.55);box-shadow: inset 0 2px 0 #85909a, inset 0 0 8px rgb(255 132 0 / 10%), 0 0 7px rgb(0 0 0 / 32%), 0 0px 3px rgb(37 23 23);transition: all 500ms;-moz-transition: all 500ms;-webkit-transition: all 500ms;-o-transition: all 500ms;}
#vote-options li button {
border: 1px solid #999; */
  line-height: 28px;
  margin: 6px 0;
  padding: 0 5px;
  width: auto;
  height: 36px;
  border: none;
  cursor: pointer;
  line-height: 0;
  text-transform: capitalize;
  padding: 0 21px 2px 21px;
  vertical-align: top;
  /* margin: 2px 0 0 0; */
  background: #A61B1B;
  font-family: 'Tahoma';
  font-size: 13px;
  color: #FFFFFF;
  /* padding: 10px; */
  text-transform: uppercase;
  font-weight: normal;
  border-radius: 3px;
  text-shadow: 0 0 6px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.55);
  box-shadow: inset 0 2px 0 #BD2B29, inset 0 0 8px rgba(255,132,0,.1), 0 0 7px rgba(0, 0, 0, 0.32), 0 0px 3px rgba(37, 23, 23, 1);
  transition: all 500ms;
  -moz-transition: all 500ms;
  -webkit-transition: all 500ms;
  -o-transition: all 500ms;
}
#vote-options li h5 {
  color: #B3A288;
  font-weight: bolder;
  /* font-size: 24px; */
  border-left: 1px dashed #4D494D;
  padding-left: 10px;
  margin-left: 10px;
}

.paypal_button {
border: 1px solid #999; */
  line-height: 28px;
  margin: 6px 0;
  padding: 0 5px;
  width: auto;
  height: 36px;
  border: none;
  cursor: pointer;
  line-height: 0;
  text-transform: capitalize;
  padding: 0 21px 2px 21px;
  vertical-align: top;
  /* margin: 2px 0 0 0; */
  background: #A61B1B;
  font-family: 'Tahoma';
  font-size: 13px;
  color: #FFFFFF;
  /* padding: 10px; */
  text-transform: uppercase;
  font-weight: normal;
  border-radius: 3px;
  text-shadow: 0 0 6px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.55);
  box-shadow: inset 0 2px 0 #BD2B29, inset 0 0 8px rgba(255,132,0,.1), 0 0 7px rgba(0, 0, 0, 0.32), 0 0px 3px rgba(37, 23, 23, 1);
  transition: all 500ms;
  -moz-transition: all 500ms;
  -webkit-transition: all 500ms;
  -o-transition: all 500ms;
	behavior: url(../images/PIE.htc);
}
.paypal_button:hover {
border: 1px solid #999; */
  line-height: 28px;
  margin: 6px 0;
  padding: 0 5px;
  width: auto;
  height: 36px;
  border: none;
  cursor: pointer;
  line-height: 0;
  text-transform: capitalize;
  padding: 0 21px 2px 21px;
  vertical-align: top;
  /* margin: 2px 0 0 0; */
  background: #A61B1B;
  font-family: 'Tahoma';
  font-size: 13px;
  color: #FFFFFF;
  /* padding: 10px; */
  text-transform: uppercase;
  font-weight: normal;
  border-radius: 3px;
  text-shadow: 0 0 6px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.55);
  box-shadow: inset 0 2px 0 #BD2B29, inset 0 0 8px rgba(255,132,0,.1), 0 0 7px rgba(0, 0, 0, 0.32), 0 0px 3px rgba(37, 23, 23, 1);
  transition: all 500ms;
  -moz-transition: all 500ms;
  -webkit-transition: all 500ms;
  -o-transition: all 500ms;
	cursor:pointer;
	behavior: url(../images/PIE.htc);
}


#buy {
  /* width: 61px; */
  /* height: 20px; */
  border: none;
  cursor: pointer;
  line-height: 0;
  text-transform: capitalize;
  padding: 0 21px 2px 21px;
  vertical-align: top;
  margin: 2px 0 0 0;
  background: #665232;
  font-family: 'Tahoma';
  font-size: 11px;
  color: #FFFFFF;
  padding: 10px;
  text-transform: uppercase;
  font-weight: normal;
  border-radius: 3px;
  text-shadow: 0 0 6px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.55);
  box-shadow: inset 0 2px 0 #866F4A, inset 0 0 8px rgba(255,132,0,.1), 0 0 7px rgba(0, 0, 0, 0.32), 0 0px 3px rgba(37, 23, 23, 1);
  transition: all 500ms;
  -moz-transition: all 500ms;
  -webkit-transition: all 500ms;
  -o-transition: all 500ms;
}
#buy:hover {
  /* width: 61px; */
  /* height: 20px; */
  border: none;
  cursor: pointer;
  line-height: 0;
  text-transform: capitalize;
  padding: 0 21px 2px 21px;
  vertical-align: top;
  margin: 2px 0 0 0;
  background: #9E4044;
  font-family: 'Tahoma';
  font-size: 11px;
  color: #FFFFFF;
  padding: 10px;
  text-transform: uppercase;
  font-weight: normal;
  border-radius: 3px;
  text-shadow: 0 0 6px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.55);
  box-shadow: inset 0 2px 0 #866F4A, inset 0 0 8px rgba(255,132,0,.1), 0 0 7px rgba(0, 0, 0, 0.32), 0 0px 3px rgba(37, 23, 23, 1);
  transition: all 500ms;
  -moz-transition: all 500ms;
  -webkit-transition: all 500ms;
  -o-transition: all 500ms;
}/* clear fix */

.notification-box
{
	position: relative;
	margin-bottom: 20px;
	border-radius: 3px;
	padding: 10px 10px 10px 32px;
	background-repeat: no-repeat;
	background-position: 10px 11px;
	border: 1px solid;
	color: #444;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px rgba(255,255,255,0.4) inset;
	-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px rgba(255,255,255,0.4) inset;
	behavior: url(../images/PIE.htc);
	border-style: solid;
	border-radius: 25px;
	padding: 11px 39px;
	font-size: 10px;
}
.notification-box p
{
	margin-bottom: 0;
	margin-top: 20px;
}
.notification-box > p:first-child
{
	margin: 0;
}
.notification-box-info
{
	background-color: #cfe6fc;
	background-image: url(../images/info.png);
	border-color: #a4c8f5;
}
.notification-box-success
{
	background-color: #d2f7ad;
	background-image: url(../images/tick.png);
	border-color: #aedb2e;
}
.notification-box-warning
{
	background-color: #fae7a2;
	background-image: url(../images/warning.png);
	border-color: #f5c558;
}
.notification-box-error
{
	background-color: #ffd5af;
	background-image: url(../images/error.png);
	border-color: #f8b472;
}

#register_button {
	  width: auto;
	  height: 36px;
	  border: none;
	  cursor: pointer;
	  line-height: 0;
	  text-transform: capitalize;
	  padding: 0 21px 2px 21px;
	  vertical-align: top;
	  margin: 2px 0 0 0;
	  background: #A61C1C;
	  /* font-family: 'Tahoma'; */
	  font-size: 13px;
	  color: #FFFFFF;
	  padding: 10px;
	  /* text-transform: uppercase; */
	  font-weight: normal;
	  border-radius: 3px;
	  text-shadow: 0 0 6px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.55);
	  /* box-shadow: inset 0 2px 0 #BD2B29, inset 0 0 8px rgba(255,132,0,.1), 0 0 7px rgba(0, 0, 0, 0.32), 0 0px 3px rgba(37, 23, 23, 1); */
	  transition: all 500ms;
	  -moz-transition: all 500ms;
	  -webkit-transition: all 500ms;
	  -o-transition: all 500ms;
	  border-width: 1px;
	  border-color: rgb(109 55 68);
	  border-style: solid;
	  border-radius: 25px;
	  padding: 8px 32px;
	  font-size: 13px;
	  transition: .3s;
	  background: url(../images/popup-bg.png) no-repeat;
	  background-color: #312028;
	  /* padding-bottom: 10px !important; */
}

#register_button:hover {
	  width: auto;
	  height: 36px;
	  border: none;
	  cursor: pointer;
	  line-height: 0;
	  text-transform: capitalize;
	  padding: 0 21px 2px 21px;
	  vertical-align: top;
	  margin: 2px 0 0 0;
	  background: #301f29;
	  /* font-family: 'Tahoma'; */
	  font-size: 13px;
	  color: #FFFFFF;
	  padding: 10px;
	  /* text-transform: uppercase; */
	  font-weight: normal;
	  border-radius: 3px;
	  /* text-shadow: 0 0 6px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.55); */
	  /* box-shadow: inset 0 2px 0 #316384, inset 0 0 8px rgba(255,132,0,.1), 0 0 7px rgba(0, 0, 0, 0.32), 0 0px 3px rgba(37, 23, 23, 1); */
	  transition: all 500ms;
	  -moz-transition: all 500ms;
	  -webkit-transition: all 500ms;
	  -o-transition: all 500ms;
	  border-width: 1px;
	  border-color: rgb(111 91 95);
	  border-style: solid;
	  border-radius: 25px;
	      padding: 8px 32px;
	  font-size: 13px;
	  transition: .3s;
	  background: url(../images/popup-bg.png) no-repeat;
	  background-color: #534346;
}
.f2, .f {
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: rgba(0, 0, 0, 0.29);
  height: 25px;
  /* width: 305px; */
  color: #fff;
  margin-bottom: 7px;
  /* font-family: 'Tahoma'; */
  font-size: 13px;
  text-shadow: 0 0 5px rgba(0,0,0,.15), 1px 0px 1px rgba(0,0,0,.25);
  color: #ffffff;
  border: none;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  width: 200px;
  height: 29px;
  padding: 0 10px 6px 14px;
  background: rgb(21 30 35 / 55%);
  /* box-shadow: inset 1px 1px 2px rgb(0 0 0 / 25%), inset 0 0 10px rgb(0 0 0 / 18%), 1px 1px 0 rgb(255 255 255 / 15%); */
  transition: all 300ms;
  -moz-transition: all 300ms;
  -webkit-transition: all 300ms;
  -o-transition: all 300ms;
  border-width: 1px;
  border-color: rgb(46 56 62);
  border-style: solid;
  border-radius: 6px;
  padding: 0px 27px;
  font-size: 15px;
  transition: .3s;
  }.f3{
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: rgba(0, 0, 0, 0.29);
  height: 25px;
  /* width: 305px; */
  color: #fff;
  margin-bottom: 7px;
  /* font-family: 'Tahoma'; */
  font-size: 13px;
  text-shadow: 0 0 5px rgba(0,0,0,.15), 1px 0px 1px rgba(0,0,0,.25);
  color: #ffffff;
  border: none;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  /* width: 59%; */
  height: 29px;
  padding: 0 10px 6px 14px;
  background: rgb(21 30 35 / 55%);
  /* box-shadow: inset 1px 1px 2px rgb(0 0 0 / 25%), inset 0 0 10px rgb(0 0 0 / 18%), 1px 1px 0 rgb(255 255 255 / 15%); */
  transition: all 300ms;
  -moz-transition: all 300ms;
  -webkit-transition: all 300ms;
  -o-transition: all 300ms;
  border-width: 1px;
  border-color: rgb(46 56 62);
  border-style: solid;
  border-radius: 6px;
  padding: 0px 27px;
  font-size: 15px;
  transition: .3s;
  }
  
/*smog*/


.smog {
    position: absolute;
    top: 5px;
    left: 488px;
    width: 100%;
    height: 100%;
    z-index: 1;
    margin: 0 auto;
    overflow: hidden;
}
.smog .num1 {
    -webkit-animation: spreadSmog 7s infinite linear;
    animation: spreadSmog 7s infinite linear;
}
.smog .num2 {
  -webkit-animation: spreadSmog 15s infinite linear;
  animation: spreadSmog 15s infinite linear;
}
.smog .num3 {
  -webkit-animation: spreadSmog 40s infinite linear;
  animation: spreadSmog 40s infinite linear;
}
.smog .num1 {
    bottom: 0;
    left: -677px;
    width: 2354px;
    height: 1300px;
    opacity: 0;
}
.smog i {
    position: absolute;
    display: block;
    background: url(../images/sp_smog.png) no-repeat;
    transform-origin: 50% 100%;
}
.smog .num2 {
    bottom: 0;
    left: -677px;
    width: 2354px;
    height: 1300px;
    opacity: 0;
}
.smog .num3 {
    bottom: 0;
    left: -677px;
    width: 2354px;
    height: 1300px;
    opacity: 0;
}
@keyframes spreadSmog {
  0% {
    transform: scale(0.5);
    -webkit-transform: scale(0.5);
    opacity: 0;
}
45% {
    transform: scale(0.75);
    -webkit-transform: scale(0.75);
    opacity: 1;
}
90% {
    transform: scale(1);
    -webkit-transform: scale(1);
    opacity: 0;
}
100% {
    transform: scale(1);
    -webkit-transform: scale(1);
    opacity: 0;
}
}
/*sparks*/

.sparks2 {
    position: absolute;
    width: 1200px;
    margin-left: 200px;
    top: 600px;
    z-index: 1;
    overflow: hidden;
}

.sparks2 > div {
    position: absolute;
    z-index: 1;
}

.sparks2 .spark_11 {
    background: url(../images/spark_11.png) no-repeat;
    width: 764px;
    height: 313px;
    right: 0;
    bottom: -320px;
    transform: scale(0.6);
    animation: spark-1 4s linear infinite;
    animation-delay: 1s;
}

@keyframes spark-1 {
    0% {
        bottom: -320px;
        transform: scale(0.6);
        opacity: 1;
    }
    25% {
        bottom: -240px;
        transform: scale(0.7);
        opacity: 1;
    }
    50% {
        bottom: -160px;
        transform: scale(0.8);
        opacity: 1;
    }
    75% {
        bottom: -80px;
        transform: scale(0.9);
        opacity: 0.5;
    }
    100% {
        bottom: 0px;
        transform: scale(1);
        opacity: 0;
    }
}

.sparks2 .spark_22 {
    background: url(../images/spark_22.png) no-repeat;
    width: 179px;
    height: 335px;
    right: 230px;
    bottom: -320px;
    transform: scale(0.6);
    animation: spark-1 4s linear infinite;
    animation-delay: 2s;
}

.sparks2 .spark_33 {
    background: url(../images/spark_33.png) no-repeat;
    width: 128px;
    height: 165px;
    right: 280px;
    bottom: -140px;
    transform: scale(0.6);
    animation: spark-3 4s linear infinite;
    animation-delay: 2s;
}

@keyframes spark-3 {
    0% {
        bottom: -140px;
        transform: scale(0.6);
        opacity: 1;
    }
    25% {
        bottom: -80px;
        transform: scale(0.7);
        opacity: 1;
    }
    50% {
        bottom: -20px;
        transform: scale(0.8);
        opacity: 1;
    }
    75% {
        bottom: 40px;
        transform: scale(0.9);
        opacity: 0.5;
    }
    100% {
        bottom: 100px;
        transform: scale(1);
        opacity: 0;
    }
}

.sparks2 .spark-big2 {
    background: url(../images/spark_44.png) no-repeat;
    width: 794px;
    height: 176px;
    right: 0;
    bottom: -180px;
    transform: scale(0.6);
    animation: spark-5 4s linear infinite;
}

.onz {
    background: url(../images/online.png) no-repeat;
    width: 24px;
    height: 25px;
}

.ofz {
    background: url(../images/offline.png) no-repeat;
    width: 24px;
    height: 25px;
}
.sparks2 .spark_55 {
    animation-delay: 2s;
    right: 40px;
}

@keyframes spark-5 {
    0% {
        bottom: -180px;
        transform: scale(0.6);
        opacity: 1;
    }
    25% {
        bottom: -120px;
        transform: scale(0.7);
        opacity: 1;
    }
    50% {
        bottom: -60px;
        transform: scale(0.8);
        opacity: 1;
    }
    75% {
        bottom: 0px;
        transform: scale(0.9);
        opacity: 0.5;
    }
    100% {
        bottom: 60px;
        transform: scale(1);
        opacity: 0;
    }
}/*
 CSS for the main interaction
*/
.tabset > input[type="radio"] {
    position: absolute;
    left: -200vw;
  }
  
  .tabset .tab-panel {
    display: none;
  }
  
  .tabset > input:first-child:checked ~ .tab-panels > .tab-panel:first-child,
  .tabset > input:nth-child(3):checked ~ .tab-panels > .tab-panel:nth-child(2),
  .tabset > input:nth-child(5):checked ~ .tab-panels > .tab-panel:nth-child(3),
  .tabset > input:nth-child(7):checked ~ .tab-panels > .tab-panel:nth-child(4),
  .tabset > input:nth-child(9):checked ~ .tab-panels > .tab-panel:nth-child(5),
  .tabset > input:nth-child(11):checked ~ .tab-panels > .tab-panel:nth-child(6) {
    display: block;
    background: #0000003d;
    padding: 14px;
    height: 89px;
  }
  
  
  
  .tabset > label {
    position: relative;
    display: inline-block;
    /* padding: 27px 39px 17px; */
    width: 68px;
    height: 33px;
    border: 1px solid transparent;
    border-bottom: 0;
    cursor: pointer;
    /* font-weight: 600; */
    padding-top: 10px;
    text-align: center;
    background: #d9be996b;
    color: #fff;
    text-shadow: #000 0px 1px 3px;
  }
  
  .tabset > label::after {
    content: "";
    position: absolute;
    left: 13px;
    bottom: 10px;
    width: 45px;
    height: 4px;
    text-align: left;
    /* background: #0087df; */
  }
  
  .tabset > label:hover,
  .tabset > input:focus + label {
    color: #fdf5f2;
  }
  
  .tabset > label:hover::after,
  .tabset > input:focus + label::after,
  .tabset > input:checked + label::after {
    background: #ffffff21;
  }
  
  .tabset > input:checked + label {
    /* border-color: #0e4264; */
    /* border-bottom: 1px solid #2b3b45; */
    margin-bottom: -1px;
    background: #53455a;
  }
  
  .tab-panel {
    padding: 30px 0;
    border-top: 1px solid #ffffff0d;
  }
  
  
  .tabset {
    max-width: 100%;
    margin-left: 23px;
    margin-right: 22px;
    /* margin-top: 23px; */
    padding-top: 6px;
  }.logon-status{width: 100%;height:46px;background:rgba(0,0,0,.008);padding-top: 10px;}.logon-status #logon-status{float:left;margin: -12px 0 0 11px;}
#logon-status p{font-size:11px;font-style:italic;color:#fff;}
#logon-status h3{/* font-family:'Tahoma'; */text-transform:uppercase;font-size: 15px;color: #ffffff;text-shadow:0 0 3px rgba(0,0,0,.55),1px 1px 0 rgba(0,0,0,.45);font-weight:300;}
#logon-status h3 p.status{/* font-family:'Tahoma'; */display:inline-block;font-style:normal;font-size: 21px;}#logon-status h3 p.status.online{color:#313f09;}
#logon-status h3 p.status.offline{color:#620c08;}.logon-status #server-time{float:right;width: 240px;height: 29px;text-align:right;/* margin: 7px 10px 0 0; */color: #fff;}
#server-time p{font-family:'Tahoma';/* font-weight:bold; */font-size: 15px;color: #fad9a4;}
#server-time span{/* font-family:'Tahoma'; */font-size: 26px;top: 2px;left: 0px;color: #ffffff;/* text-shadow:0 0 3px rgba(0,0,0,.55),1px 1px 0 rgba(0,0,0,.45); */}

#rvr {
  /* width: 670px; */
  /* height: 250px; */
  /* background: url(../images/rank2.jpg) no-repeat; */
  background-size: 100% 100%;
  margin: 0 auto;
}

#kaliux {
	/* width: 114px; */
	/* height: 160px; */
	float:left;
}

#dilamun {
	/* width: 146px; */
	/* height: 141px; */
	float:right;
}

#kaliux_score {
  color: #00FFFF;
  text-shadow: 0px 0px 2px rgba(0, 0, 0, 1);
  /* padding-left: 15px; */
  /* padding-top: 12px; */
  font-size: 15px;
  text-align: center;
}

#kaliux_char {
  color: #adaa8d;
  text-shadow: 0px 0px 2px rgba(0, 0, 0, 1);
  /* padding-left: 15px; */
  /* font-family: 'Tahoma'; */
  /* padding-top: 12px; */
  text-align: center;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 15px;
}

#kaliux_title {
  color: #59ceff;
  text-shadow: 0px 0px 2px rgba(0, 0, 0, 1);
  padding-left: 15px;
  /* padding-top: 12px; */
  text-align: center;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 18px;
}
#kaliux_perc {
  color: #FFFFFF;
  text-shadow: 0px 0px 2px rgba(0, 0, 0, 1);
  /* padding-left: 15px; */
  /* padding-top: 15px; */
  font-size: 17px;
  text-align: center;
  text-transform: uppercase;
  font-size: 24px;
}


#dilamun_score {
  color: #FF0000;
  text-shadow: 0px 0px 2px rgba(0, 0, 0, 1);
  /* padding-left: 15px; */
  /* padding-top: 10px; */
  font-size: 15px;
  text-align: center;
}

#dilamun_char {
  color: #adaa8d;
  text-shadow: 0px 0px 2px rgba(0, 0, 0, 1);
  /* padding-left: 19px; */
  /* font-family: 'Tahoma'; */
  text-align: center;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 15px;
}

#dilamun_title {
  color: #fd3c3c;
  text-shadow: 0px 0px 2px rgba(0, 0, 0, 1);
  padding-left: -4px;
  padding-top: 0px;
  text-align: center;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 18px;
}
#dilamun_perc {
  color: #FFFFFF;
  text-shadow: 0px 0px 2px rgba(0, 0, 0, 1);
  /* padding-left: 15px; */
  /* padding-top: 15px; */
  /* padding-bottom: 6px; */
  font-size: 17px;
  text-align: center;
  text-transform: uppercase;
  font-size: 24px;
  /* background: #0003; */
}a {color: rgba(255, 255, 255, 0.42);text-decoration:none;text-shadow: #000 0px 1px 2px;}
a:hover {  color:#fff;}

/* FORCE FONT MENU LEFT */
#menu a,
#menu a:link,
#menu a:visited,
#menu a:hover,
#menu a:active {
  font-family: Tahoma, Arial, sans-serif !important;
  font-size: 13px !important;
  text-transform: none !important;
}

/* LEFT MENU (rss_area / rank_player) - FORCE FONT */
#rss_area .rank_player .c1 a,
#rss_area .rank_player .c1 a:link,
#rss_area .rank_player .c1 a:visited,
#rss_area .rank_player .c1 a:hover,
#rss_area .rank_player .c1 a:active{
  font-family: Tahoma, Arial, sans-serif !important;
  font-size: 13px !important;     /* ปรับได้ */
  text-transform: none !important;
}

#rss_area .rank_player,
#rss_area .rank_player2,
#rss_area .c1{
  font-family: Tahoma, Arial, sans-serif !important;
}

/* MEMBER AREA (login/panel) - FORCE FONT + SIZE */
#member_area,
#member_area .name,
#member_area .c1,
#member_area .rank_player,
#member_area .rank_player2,
#member_area a.menuitem,
#member_area a.menuitem:link,
#member_area a.menuitem:visited,
#member_area a.menuitem:hover,
#member_area a.menuitem:active{
  font-family: Tahoma, Arial, sans-serif !important;
  font-size: 13px !important;   /* ปรับได้ */
  text-transform: none !important;
}

#member_area .name
{
	height: 12px;
}

/* ถ้าตัวลูกศร » ดูเล็ก/ชิดเกิน เพิ่ม spacing นิด */
#member_area a.menuitem{
  display: inline-block;
  line-height: 1.2;
}
/* ===== MEMBER WALLET (3 rows) ===== */
#member_area .member_wallet{
  /* ให้เหมือนกล่องเมนูซ้าย */
  border: 1px solid rgba(255,255,255,0.06);
  background: rgba(255,255,255,0.02);
  box-shadow: 0 8px 6px -6px rgba(0,0,0,0.45);
  padding: 6px 6px;
  margin-top: 6px;
}

#member_area .wallet_row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 3px 6px;
  margin-bottom: 2px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

#member_area .wallet_row:last-child{
  border-bottom: none;
  margin-bottom: 0;
}

#member_area .wallet_left{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #E8D8E2;
  text-shadow: 0 0 3px #000;
  white-space: nowrap;
}

#member_area .wallet_icon{
  width: 12px;
  height: 12px;
  display: inline-block;
  opacity: 0.95;
}

#member_area .wallet_value{
  color: #D7C27A;              /* โทนทองอ่อน */
  font-weight: bold;
  text-shadow: 0 0 3px #000;
  padding-left: 10px;
  white-space: nowrap;
}

/* ถ้าเลขยาวมาก ให้ไม่ดันหลุด */
#member_area .member_wallet .c1{
  overflow: hidden;
}

/* ===== MEMBER WALLET (scoped) ===== */
#member_area .member_wallet{
  border: 1px solid rgba(255,255,255,0.06);
  background: rgba(255,255,255,0.02);
  box-shadow: 0 8px 6px -6px rgba(0,0,0,0.45);
  padding: 6px 6px;
  margin-top: 6px;
}

#member_area .member_wallet .wallet_row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4px 6px;
  margin-bottom: 2px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  border-radius: 6px;
  transition: background 0.15s ease;
}
#member_area .member_wallet .wallet_row:hover{
  background: rgba(255,255,255,0.03);
}
#member_area .member_wallet .wallet_row:last-child{
  border-bottom: none;
  margin-bottom: 0;
}

#member_area .member_wallet .wallet_left{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  text-shadow: 0 0 3px #000;
  white-space: nowrap;
}
#member_area .member_wallet .wallet_icon{
  width: 12px;
  height: 12px;
  opacity: 0.95;
}

#member_area .member_wallet .wallet_value{
  font-weight: bold;
  text-shadow: 0 0 3px #000;
  padding-left: 10px;
  white-space: nowrap;
}

/* ===== สีแยกแต่ละแถว ===== */
/* แคช (บริจาค) - ทอง */
#member_area .member_wallet .wallet_cash .wallet_left{ color: rgba(255,226,150,0.95); }
#member_area .member_wallet .wallet_cash .wallet_value{
  color: #D7C27A;
  text-shadow: 0 0 6px rgba(255,200,90,0.15), 0 0 3px #000;
}

/* เพชร - ฟ้า */
#member_area .member_wallet .wallet_gem .wallet_left{ color: rgba(150,220,255,0.95); }
#member_area .member_wallet .wallet_gem .wallet_value{
  color: #8FD6FF;
  text-shadow: 0 0 6px rgba(120,210,255,0.18), 0 0 3px #000;
}

/* แคชออนไลน์ - ม่วง/ชมพู */
#member_area .member_wallet .wallet_online .wallet_left{ color: rgba(210,175,255,0.95); }
#member_area .member_wallet .wallet_online .wallet_value{
  color: #D9B3FF;
  text-shadow: 0 0 6px rgba(210,150,255,0.18), 0 0 3px #000;
}

/* 🔹 พื้นหลังร่วมของทั้ง 3 บล็อค */
#member_area .member_wallet > div {
  background: linear-gradient(
    180deg,
    rgba(45, 38, 58, 0.85),
    rgba(20, 18, 28, 0.95)
  );
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 6px;

  padding: 6px 8px;
  margin-bottom: 6px;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    0 3px 6px rgba(0,0,0,0.45);
}
/* 🎯 สีตัวอักษร (ของคุณใช้ได้เลย + เสริมเล็กน้อย) */
#member_area .member_wallet .wallet_cash .wallet_left {
  color: rgba(255,226,150,0.95);
  text-shadow: 0 0 6px rgba(255,200,120,0.35);
}

#member_area .member_wallet .wallet_gem .wallet_left {
  color: rgba(150,220,255,0.95);
  text-shadow: 0 0 6px rgba(120,200,255,0.35);
}

#member_area .member_wallet .wallet_online .wallet_left {
  color: rgba(210,175,255,0.95);
  text-shadow: 0 0 6px rgba(190,140,255,0.35);
}


/* RIGHT SIDEBAR (stats + ranking tabs) - FORCE FONT + SIZE */
#right,
#right table,
#right td,
#right .c1,
#right .rank_player,
#right .rank_player2,
#right a,
#right a:link,
#right a:visited,
#right a:hover,
#right a:active,
#right a.rnk{
  font-family: Tahoma, Arial, sans-serif !important;
  font-size: 12px !important;      /* ปรับได้ */
  text-transform: none !important;
  letter-spacing: 0 !important;
}

/* ถ้าช่องหัวตาราง (เลเวล/สังหาร/Score) อยากเล็กลงนิด ให้แยกเฉพาะ header */
#right #hof_area .rank_player2 tr:first-child td,
#right #other_area .rank_player2 tr:first-child td{
  font-size: 12px !important;      /* ปรับได้ */
}

/* ปุ่มแท็บ (เลเวล / PvP) ให้สวยและอ่านง่ายขึ้นนิด */
#right a.rnk{
  display: inline-block;
  line-height: 1.2;
  padding: 2px 10px;
}


/* ===== Progress bar (online bar) ===== */
/* ถ้าอยากให้ “แท่งด้านใน” หนาขึ้นอีก ให้เพิ่ม height ของ #stat เป็น 14px หรือ 15px ได้เลยครับ ✅ */
#stat{
  width: 176px !important;          /* ให้เท่ากับ max-width เดิม */
  height: 14px;                     /* กรอบหนาขึ้นนิด */
  margin: 8px auto 0 auto;          /* จัดกึ่งกลาง */
  padding: 1px;                     /* เว้นขอบเล็กน้อย */
  border-radius: 10px;
  background: rgba(0,0,0,0.35);
  border: 1px solid rgba(255,255,255,0.12);
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.75);
  overflow: hidden;                 /* ตัดมุมให้แท่งข้างในโค้งตาม */
}

/* ตัวแท่งด้านใน (แม้มี inline style ก็ยังปรับความสวยได้) */
#stat > div{
  height: 100% !important;          /* ให้เต็มกรอบ */
  border-radius: 10px;
  background-position: left center;
  background-repeat: repeat-x;
}