@charset "utf-8";
/* CSS Document */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin:0; padding:0; border:0; outline:0; font-size:12px; vertical-align:baseline; background:transparent; font-family: Arial, tahoma, sans-serif; }
body { line-height:1; }
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { display:block; }
ul ,li { list-style:none; }
blockquote, q { quotes:none; }
blockquote:before, blockquote:after, q:before, q:after { content:''; content:none; }
a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }
/* change colours to suit your needs */
ins { background-color:#ff9; color:#000; text-decoration:none; }
/* change colours to suit your needs */
mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom:1px dotted; cursor:help; }
table { border-collapse:collapse; border-spacing:0; }
/* change border colour to suit your needs */
hr { display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:1em 0; padding:0; }
input, select { vertical-align:middle; }
h1,h2,h3,h4,h5,h6{ font-family: Arial, tahoma, sans-serif;}
.clear{ clear: both;}
.h1{ height: 1px; clear: both;}
.dv_load { background-color: #FFFFFF; border: 1px solid #DDDDDD; color: #333; display: none; font-size: 15px; padding: 5px 10px; position: fixed; text-align: center; z-index: 100; }
.notification { font-family: Arial, Helvetica, clean, sans-serif; font-size: large; font-weight: bold; background-color: rgb(247, 247, 247); color: red; }
.success { font-family: Arial, Helvetica, clean, sans-serif; font-size: large; font-weight: bold; background-color: #acfa58; color: black; }
.fail { font-family: Arial, Helvetica, clean, sans-serif; font-size: large; font-weight: bold; background-color: #fe2e2e; color: white; }
.w1000{ width: 1000px; margin: 0 auto; position: relative;}
body{ position: relative; background: url("../images/bg.jpg") center -10px no-repeat #000000; }
.center{ width: 100%; position: relative; }


/* header */
header{ width: 100%; height: 308px; }
/*header .nav-decorate-left{ width: 16px; height: 97px; left: 0; bottom: -8px; display: block; position: absolute; background: url("../images/navleft.png") 0 0 no-repeat;}
header .nav-decorate-right{ width: 16px; height: 97px; right: 0; bottom: -8px; display: block; position: absolute; background: url("../images/navright.png") 0 0 no-repeat;}*/
header .playnow{ width: 345px; height: 350px; left: -25px; bottom: 5px; position: absolute; z-index: 10;}
header .logo{ width: 314px; height: 288px; top: 6px; left: 4px; position: relative; margin: 0 auto; background: url("../images/logo.png") 0 0 no-repeat;}
header .logo a{ position: absolute; right: 0; top: 0; width: 314px; height: 288px; display: block;}
nav.main_nav{bottom: 0; left: 0; height: 138px; width: 1097px; position: absolute;  }
nav.main_nav ul{  height: 60px; left: 270px; top: 39px; position: absolute; z-index: 15;}
nav.main_nav ul li{ height: 80px;}
nav.main_nav ul li.active, nav.main_nav ul li:hover{ background: url("../images/nav_hover.png") center top no-repeat;  margin-top: 0;}
nav.main_nav .fl{ float: left;}
nav.main_nav .fr{ float: right;}
nav.main_nav .navline{ width: 2px; height: 60px; background: url("../images/navline.png") 0 0 no-repeat; margin-top: 14px;}
nav.main_nav ul li a {float: left; margin-top: 14px;}
nav.main_nav ul li a span{ display: block; height: 60px; margin: 0 20px; background: url("../images/nav.png") 0 0 no-repeat; outline:none;}
nav.main_nav ul li.n1 a span{ background-position: 0 0; width: 75px; margin: 0 20px;}
nav.main_nav ul li.n2 a span{ background-position: 0 -60px; width: 66px;}
nav.main_nav ul li.n3 a span{ background-position: 0 -120px; width: 82px;}
nav.main_nav ul li.n4 a span{ background-position: 0 -180px; width: 80px;}
nav.main_nav ul li.n5 a span{ background-position: 0 -240px; width: 104px;}
nav.main_nav ul li.n6 a span{ background-position: 0 -300px; width: 123px;}

nav.main_nav ul li.n1.active a span, nav.main_nav ul li.n1:hover a span{ background-position: -123px 0;}
nav.main_nav ul li.n2.active a span, nav.main_nav ul li.n2:hover a span{ background-position: -123px -60px;}
nav.main_nav ul li.n3.active a span, nav.main_nav ul li.n3:hover a span{ background-position: -123px -120px;}
nav.main_nav ul li.n4.active a span, nav.main_nav ul li.n4:hover a span{ background-position: -123px -180px;}
nav.main_nav ul li.n5.active a span, nav.main_nav ul li.n5:hover a span{ background-position: -123px -240px;}
nav.main_nav ul li.n6.active a span, nav.main_nav ul li.n6:hover a span{ background-position: -123px -300px;}

/* header end*/
/* main */
.main{ width: 980px; height: 1002px; margin: 0 auto; background: url("../images/bg_2.jpg") 0 0 no-repeat;}
.main .main_body{min-height: 100px; max-height: 1696px; }
.main .main_footer{ height: 1px; clear: both;}
.main .main_left{ float: left; width: 650px;}
.main .main_right{ float: left; padding-left: 0; width: 320px; padding-top: 15px;}
/* main end*/
/* banner */
.main .banner{ width: 622px; color: #FFFFFF; position: relative; margin: 0 auto; z-index: 7; height: 355px; overflow: hidden; }
#myFocus {width:620px; height:269px; overflow: visible; margin: 0 auto;}
/* banner end*/

/* login */
.main .main_right .login{ width: 316px; height: 331px; background: url("../images/login_bg.jpg") 0 0 no-repeat; position: relative; margin-bottom: 46px;}
.main .main_right .login .playnow{ width: 316px; height: 77px; display: block; background: url("../images/playnow.jpg") 0 0 no-repeat; position: absolute; bottom: 0; left: 0;}
.main .main_right .login .playnow:hover{ background-position: 0 -77px;}
.main .main_right .login .playnow a{ width: 316px; height: 77px; display: block;}
.main .main_right .login .userinfo{ display: block; width: 293px; padding: 10px; bottom: 76px; left: 2px; position: absolute; background: rgba(0,0,0,0.7); }
.main .main_right .login .userinfo h4{ color: #EBEBEB; font-size: 16px; line-height: 32px;}
.main .main_right .login .userinfo p{ font-size: 13px; color: #EBEBEB; line-height: 16px;}
.main .main_right .login .userinfo a{ color: #fff6c7;}
.main .main_right .login .userinfo a:hover{ color: #FFE24C;}
.main .main_right .login .userinfo a.code{ text-decoration: none; text-transform: uppercase; line-height: 28px; }
.main .main_right .login .userinfo a.logout{ float: right; text-decoration: none; padding-top: 0;}
/* login end */

/* news */
.news{ width: 618px; border: 1px solid #675f58; margin-top: 38px; padding-bottom: 5px; margin-left: 15px; box-shadow: 0px 0px 1px 1px #020100;}
.news .title { width: 100%; height: 46px; background: url("../images/newstitle.jpg") center center no-repeat;}
.news .title h4, .main_right .sidebar .title h4{ line-height: 46px; color: #dadada; font-size: 18px; padding-left: 27px;}

.article-wrapper{ padding-top: 15px; background: url("../images/article-line.png") center top no-repeat; margin-bottom: 10px; position: relative; height: 101px;}
.article-wrapper.ft{ background: none;}
.article-wrapper a{ text-decoration: none;}
.article-wrapper .article-image{ width: 94px; height: 96px; background: #000000; border: 1px solid #DFDFDF; float: left; margin-left: 27px; }
.article-wrapper .article-image img{ margin: 1px; width: 92px; height: 94px;}
.article-wrapper .article-content{ float: left; width: 460px; margin-left: 17px; height: 75px; overflow: hidden;}
.article-wrapper .article-content h3{ font-size: 18px !important; line-height: 18px !important; padding-bottom: 8px !important; color: #D5D5D5 !important;}
.article-wrapper:hover .article-content h3{ color: #FFFFFF !important;}
.article-wrapper .article-content .article-summary, .article-wrapper .article-content .article-summary *{ font-size: 12px !important; color: #DADADA !important; line-height: 16px !important; text-align: justify !important; font-style: normal !important;}
.article-wrapper:hover .article-content .article-summary, .article-wrapper:hover .article-content .article-summary *{ color: #FFFFFF !important;}
.article-wrapper .article-meta{ padding: 10px 0 0 140px; color: #979797; clear: both; position: absolute; bottom: 4px; width: 460px;}
.article-wrapper .article-meta a.more{ float: right; width: 55px; height: 14px; line-height: 60px; overflow: hidden; background: url("../images/more.png") 0 0 no-repeat;}
.article-wrapper:hover .article-meta a.more{ background-position: 0 -14px;}

article {padding: 0 20px;}
article h3{ color: #fff6c7; font-size: 21px; text-align: center; text-transform: uppercase;}
article .article-meta{ padding-top: 10px; clear: both; color: #b2605a; text-align: right;}
article .article-content{ color: #b99d6e !important; font-size: 14px !important; line-height: 20px !important; text-align: left !important; padding-top: 10px; font-style: normal !important;}
article .article-content *{ color: #b99d6e !important; font-size: 14px !important; line-height: 20px !important; text-align: left !important; font-style: normal !important;}
article .article-content img{ max-width: 621px !important; margin: 0 auto 10px !important; display: block;}
article .article-content a{ color: #FFF6c7 !important;}
article .article-content a:hover{ color: #FFE24C !important;}
/* news end */

/* sidebar */
.main_right .sidebar{ width: 317px; margin-top: 10px; margin-left: 2px;}
.main_right .sidebar .title { width: 317px; height: 33px; background: url("../images/side.png") 0 0 no-repeat; }
.main_right .sidebar.ss{ border: 1px solid #2B2B2B; }
.main_right .sidebar.ss .title{ background-position: -1px 0; height: 50px; width: 315px;}
.main_right .sidebar.ss .title:hover{ background-position: -1px -50px;}
.main_right .sidebar.fb .title{ background-position: 0 -100px;}
.main_right .sidebar.fb .title:hover{ background-position: 0 -137px;}
.main_right .sidebar.tw .title{ background-position: 0 -174px;}
.main_right .sidebar.tw .title:hover{ background-position: 0 -211px;}
.main_right .sidebar.bbs .title{ background-position: 0 -248px;}
.main_right .sidebar.bbs .title:hover{ background-position: 0 -285px;}
.main_right .sidebar .title h4{ display: block; height: 33px; padding: 0; line-height: 120px;}
.main_right .sidebar .title h4 a{ display: block; width: 100%; height: 33px; overflow: hidden; line-height: 120px;}
.main_right .sidebar.download .title{ background: url("../images/download.png") 0 0 no-repeat; height: 67px; }
.main_right .sidebar.download .title h4{ height: 67px; }
.main_right .sidebar.download .title a{ height: 67px; line-height: 200px;}
.pic ul li a span{ position: absolute; width: 698px; height: 319px; top: 0; left: 0; display: block; z-index: 2; background: url("../images/slider.png") 0 0 no-repeat; }


.main_right .sidebar.ss .list ul li{ width: 100%; height: 32px; line-height: 32px; display: block; background: url("../images/server-line.png") center top no-repeat;}
.main_right .sidebar.ss .list ul li a{ padding-left: 40px; height: 32px; color: #D8D8D8; text-decoration: none; display: block; background:url("../images/status.png") 0 0 no-repeat;}
.main_right .sidebar.ss .list ul li a:hover{ color: #ffffff; }
.main_right .sidebar.ss .list ul li.active a{ background-position: -277px -5px; }
.main_right .sidebar.ss .list ul li.beta a{ background-position: -277px -57px; }
.main_right .sidebar.ss .list ul li.offline a{ background-position: -277px -106px;}
/* sidebar end */

/* server list */
.serverlist{ }
.serverlist-bg { position: relative;}
.subpage .serverlist .list .title{ height: 47px; background: url("../images/server-ui.jpg") 0 -36px no-repeat; text-align: center; color: #FFFFFF; line-height: 47px; margin-top: 2px;}
.serverlist .list{ position: relative;}
.serverlist .list ul.serverlist-list{ width: 892px; margin: 0 auto; }
.serverlist .list ul.serverlist-list li{ width: 204px; height: 50px; background: url("../images/server-ui.jpg") -2px -121px no-repeat; float: left; margin: 15px 0 0 15px;}
.serverlist .list ul.serverlist-list li:hover{ background-position: -2px -171px;}
.serverlist .list ul.serverlist-list li a{ display: block; width: 169px; height: 50px; background: url("../images/server-ui.png") -190px 0 no-repeat; line-height: 50px; overflow: hidden; text-decoration: none; padding-left: 35px; color: #FFFFFF; text-shadow: 1px 1px 1px #000000;}
.serverlist .list ul.serverlist-list li.offline{ background-position: -2px -221px}
.serverlist .list ul.serverlist-list li.offline a{ background-position: -190px -100px}
.serverlist .list ul.serverlist-list li.beta a{ background-position: -190px -50px}
.serverlist .list.l1, .serverlist .list.l2{ overflow: hidden; height: 120px;}
.serverlist .list.l3{ overflow: hidden; height: 554px;}
.serverlist .list.l3 ul.serverlist-list{ display: block; overflow-y: auto; height: 447px; width: 917px; padding-left: 26px;}

.server_nav { display: block; height: 38px; padding: 20px 0 0 40px;}
.server_nav li{ float: left; background: #191919; border: 0 solid #000000; border-width: 0 0 1px 1px;}
.server_nav li.ui-state-active{ background: #773400; }
.server_nav li a{ color: #a1a1a1; text-decoration: none; display: block; padding: 0; width: 143px; height: 36px; background: url("../images/server-ui.jpg") -1px -83px no-repeat; text-align: center; line-height: 41px; text-shadow: 1px 1px 1px #000000; font-size: 18px; font-family: 'times new roman';;}
.server_nav li.ui-state-active a{ color: #FFFFFF; background-position: -145px -83px;}
#tab1, #tab2, #tab3, #tab4{ clear: both;}
.serverlist a.closebg{ width: 100%; height: 100%; position: absolute; top: 0; left: 0;}
.serverlist .line{ height: 1px; width: 943px; background: url("../images/server-ui.jpg") 0 -120px no-repeat; position: absolute; top: 106px;}

.server_search{ height: 36px; position: relative; background: url("../images/server-ui.jpg") 0 0 no-repeat;}
.server_search h4{ height: 36px; line-height: 36px; color: #FFFFFF; font-size: 14px; text-transform: uppercase; font-family: Arial, serif, sans-serif; text-indent: 20px;}
.server_search input.txt{ /*border:0 none;*/ line-height: 36px; top: 0; color: #000; padding-left: 10px; width: 155px; outline: none; height: 36px; position: absolute; left: 444px; background: url("../images/server-ui.png") 0 2px no-repeat; border: 0 none;}
.server_search input.btn{ left: 614px; height: 36px; top: 0; position: absolute; background: url("../images/server-ui.png") 0 -34px no-repeat; width: 87px; cursor: pointer; padding: 0; margin: 0; border: 0;}
.server_search input.btn:hover{ background-position: 0 -70px;}
/*@media screen and (min-width: 1200px) { .serverlist{ width: 1000px;}}*/
/* server list end */

/* Pagination */
.pagination {margin-top: 15px; text-align: center; float: right; padding: 0 25px 0 0;}
.pagination a{ width: 24px; height: 22px; float: left; background: url("../images/arr.png") 0 0 no-repeat; overflow: hidden; line-height: 60px;}
.pagination a.next{ background-position: -24px 0;}
.pagination a.prev:hover{ background-position: 0 -22px;}
.pagination a.next:hover{ background-position: -24px -22px;}
.pagination span{ float: left; color: #606060; line-height: 24px; margin: 0 5px;}
/* Pagination end */

/* body-trail */
.body-trail { height: 20px; margin-bottom: 30px; padding: 0 20px;}
.body-trail li{ float: left; }
.body-trail li a{ color: #747474; text-decoration: none;}
.body-trail li.last a{ color: #0185af;}
.body-trail li span{ color: #747474; margin: 0 5px;}
.body-trail li a span{ margin: 0;}
.body-trail li.last a span{ color: #b2605a;}
/* body-trail end */

/* footer */
footer{ width: 100%; clear: both;}
footer .footer_main{ background: url("../images/footer-line.png") center 100px repeat-x;}
footer a.gototop{ width: 30px; height: 55px; top: 0; right: 50px; position: absolute; background: url("../images/totop.png") 0 0 no-repeat; display: none;}
footer .column{ float: left; width:200px; padding: 60px 10px 0;}
footer .column.c1{ padding-left: 65px}
footer .column.c4{ width: 260px;}
footer .column h2{ color: #ff9c00; font-size: 22px; margin-bottom: 40px; font-family: Arial, 'segoe ui', 'times new roman', serif;}
footer .column a{ color: #E2E2E2; text-decoration: none; font-size: 14px; line-height: 24px;}
footer .column a:hover{ color: #FFFFFF;}
footer .column p{ color: #7b7b7b; font-size: 12px; margin: 0 0 4px;}
footer .column ul.img_link li{ float: left;}
footer .column ul.img_link li a {width: 30px; height: 31px; display: block; background: url("../images/img_link.png") no-repeat; padding: 0 10px 10px 0; }
footer .column ul.img_link li a.link_1 {background-position: 0 0; }
footer .column ul.img_link li a.link_2 {background-position: -40px 0; }
footer .column ul.img_link li a.link_3 {background-position: -80px 0; }
footer .column ul.img_link li a.link_4 {background-position: -120px 0; }
footer .column ul.img_link li a.link_5 {background-position: -160px 0; }
footer .row{ clear: both; height: 70px; margin-top: 20px; background: url("../images/footer-line.png") center top repeat-x; padding: 40px 60px  60px;}
footer .row .r2logo{ float: left; width: 212px; height: 60px; background: url("../images/r2logo.png") 0 0 no-repeat;}
footer .row p{ color: #6e6f6f; padding: 28px 0 0 260px; line-height: 16px;}
/* footer */

/* subpage */
.subpage .main{ background:url("../images/bg_3.jpg") 0 0 no-repeat;}
.subpage .news { margin: 0 auto; padding: 0; border: 0 none; width: 950px; box-shadow: none;}
.subpage .news .title, .subpage .serverlist .title{ height: 85px; width: 950px; background: none; }
.subpage .news .title h4, .subpage .serverlist .title h4{ line-height: 85px; color: #fff6c7; text-align: center; font-size: 24px;}
.subpage header .subpage .news { width: 983px; border: 0 none; padding-bottom: 0; }
.subpage .news { width: 983px; border: 0 none; padding-bottom: 0; }
.subpage article .article-content { padding: 0 20px; max-height: 850px; overflow-y: auto; overflow-x: hidden;}
.subpage .serverlist { width: 983px; border: 0 none; padding-bottom: 0;}