@charset "utf-8";
/*basic*/
body, div, h1, h2, h3, h4, h5, h6, p, blockquote, dl, dt, dd, ul, ol, li, fieldset, form, tr, th, td, center, input, button, textarea { padding: 0; margin: 0; }
table { border-collapse: collapse; border-spacing: 0; }
td, th { text-align: center; }
fieldset, img { border: 0; }
button, input, select, textarea { font: 14px/1.8 'Merriweather', Arial, Verdana, Helvetica, sans-serif; }
li { list-style: none; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; }
body { color: #fff; font: 14px/1.8 'Merriweather', Microsoft YaHei, Arial, Helvetica, sans-serif; background: #06090e;  }

.fl { float: left; }
.fr { float: right; }
.t_hide { height: 0; overflow: hidden; }
.mt10 { margin-top: 10px; }
.t_center { text-align: center; }
.t_left { text-align: left; }
.t_right { text-align: right; }
.p_relative { position: relative; }
.clearfix:after { content: ""; height: 0; visibility: hidden; display: block; clear: both; }
.clearfix { zoom: 1; }
.clear { clear: both; }
a { color: #fff; text-decoration: none; }
a, a:active { outline: none; }

/*********public style*********/
.fullbg{ width: 100%; background: #000; overflow: hidden; }
.wrapper{ margin: 0 auto; width:1080px; position:relative; }
.header {position:relative; font-size: 0;}
.header img { width: 100%; }
.content { min-height: 800px; background: url(../images/bg.jpg) no-repeat center top; }
.backhome { /*position: absolute; left: 50%; top: 0; margin-left: -540px;*/ width: 96%; max-width: 1080px; margin: 0 auto; position: relative; }
.backhome a { position: absolute; left: 0; top: 10px; display: block; width: 78px; height: 29px; line-height: 29px; background: url(../images/btns.png) no-repeat -1px -221px; text-align: center; color: #000; font-size: 18px; }
.backhome a:hover { background-position: -1px -252px; }

/*bar*/
.mainbar { background: #000; border-bottom:#333232 solid 2px;  }
.maintabs { float: left; width: 790px; }
.maintabs a { display:block; float: left; text-transform:uppercase; height:56px; line-height:56px; color:#fff; padding:0 40px; font-size:20px; text-align:center; min-width:120px;  }
.maintabs a:hover, .maintabs a.on { text-decoration: none; }
.tabline { display:none; background: url(../images/btns.png) 0 0; width:120px; height:7px; margin:0 auto;}
.maintabs a:hover .tabline, .maintabs a.on .tabline { display:block}


.search { float: right; /*width:460px;*/ width: 280px; height: 60px; line-height: 58px; }
.searchbtn > *, .searchbtn, .searchtype { position: relative; display:inline-block; *display: inline; *zoom: 1; vertical-align:middle }
.search .sbtn { border:none; width:39px; height:39px; background: url(../images/btns.png) no-repeat 0 -14px; cursor:pointer }
.search .sbtn:hover {background-position:-43px -14px;}
.search .ipt { background: #232222; width: 225px; height: 38px; padding: 0 5px; line-height: 38px; color: #fff; margin: 0 auto; border: 1px solid #2e2e2e; font-size: 16px; }

.searchtype { width:69px; height: 42px; cursor:pointer; padding: 9px; text-align: center; color: #f3d77f; cursor: pointer; }
.t1 { line-height: 14px; }
.t2 { line-height: 42px; }
.searchtype:hover, .searchtype.on { background: url(../images/btns.png) no-repeat 0 -379px; color: #000; }

.on .major_stats { display: block; }
.major_stats { display: none; position:absolute; top: 60px; right: 0; background:#232222; border:1px solid #986b2e; width:330px; padding:5px; z-index:10;}
.major_stats label{ display: block; float:left; width:33%; line-height: 20px; color:#d1b474; text-align: left; font-size: 12px; }
.findbtn{ width:51px; height:21px; text-align:center; line-height:21px; color:#090909; background: url(../images/btns.png) no-repeat -1px -59px; border:none; float:right}
.findbtn:hover { background-position: -62px -59px;}
	

/*cont*/
.pageview { width: 1080px; margin: 0 auto; padding-top: 20px; }


/*eudemons*/
.typelist { width:100%; padding:15px 0; font-size: 12px; }
.typelist li { float: left; height: 30px; line-height: 30px; padding-bottom: 10px;  }
.typelist li.l2 { line-height: 15px; }
.typelist li.l3 label { width: 162px; line-height: 15px; }
.typelist li input, .typelist li label { position: relative; display:inline-block; *display: inline; *zoom: 1; vertical-align:middle }
.typelist li label { width: 72px; margin-left: 5px; }

.eudemons-list { font-size: 12px; }
.eudemons-list li { float:left; text-align:center; color:#fff; width: 135px; height:130px; margin: 10px 0; position: relative; text-align: center; }
.eudemons-list li a { display: block; }
.eudemons-list li a img, .search-mask  { width:80px; border:#d1b474 solid 3px;  border-radius: 6px; }
.search-mask { display: none; height: 80px; position: absolute; left: 50%; margin-left: -43px; top: 0; background: url(../images/search.png) no-repeat center center; cursor: pointer; }
.eudemons-list li:hover .search-mask { display: block; }
.comparebtn:hover { background-position:-1px -252px;}
a.exampleTip i { display: block; font-style: normal; line-height:16px; padding-top:5px; }
.eudemons-list span.comparebtn { display: none; width:78px; height:29px; margin: 0 auto; background: url(../images/btns.png) no-repeat -1px -221px; line-height:29px; text-align:center; color:#070707; } 
.eudemons-list li:hover i{ display:none;}
.eudemons-list li:hover span.comparebtn { display:block; }
.eudemons-list li:hover span.comparebtn:hover { background-position: -1px -252px; }

.introcont { background:#141414; padding:10px; width:280px; border:1px solid #986b2e; position:absolute; left:70%;bottom:80%; z-index:11; display:none; }
.eudemons-list li:hover .introcont { display:block;}
.imgcont{ float:left; width:80px; height:80px; border:#d1b474 solid 3px; border-radius: 6px;}
.imgcont img {width:100%;}
.detailcont {float: left; width: 160px; line-height: 18px; text-align: left; margin-left: 10px;}
.addFavio{ display:block; position: absolute; z-index: 3; bottom: 0; left: 50%; margin-left: -50px; }




/*compare*/
.topbtns { margin:10px 0 0 0; text-align: right; }
.topbtns a { display:inline-block; color:#666; padding:0 15px; font-size: 16px; border-right: 1px solid #666; }
.topbtns a:hover {color:#f7db82; text-decoration:underline;}
.bottombtns { width: 257px; margin: 0 auto; padding: 20px 0 30px 0; }
.bottombtns a{ background:url(../images/btns.png) no-repeat -242px 0; width:257px; height:80px; display:block; font-size: 0;}
.bottombtns a:hover { background-position: -242px -82px; }

.compare { }
.compare-list li { position: relative;  float: left; width:100px; color:#bcecfb; text-align:center; line-height:18px; margin: 0 20px; padding-bottom:20px;}
.compare-list li img { width:100%; height: 100px; border:2px solid #cfb25b; border-radius:6px;}

.compare-list { padding: 50px 40px 0 40px; }
.compare-list li span {position: absolute; right: -14px; top: 80px; display: block; width: 30px; height: 30px; background: url(../images/btns.png) no-repeat -132px -1px; }
.compare-list li a.on span { background-position: -169px -2px; }

/*rank*/
.pageview h2 { width:500px; height:40px; line-height:40px; text-align:center; background:url(../images/ranktitle.png) no-repeat; color:#f9dd83; font-size:34px; margin:0 auto;	}
.pageview table { width: 100% }
.myul {margin: 20px auto; width:400px;}
.myul li { float: left; width:178px; height:37px; text-align:center; line-height:38px; color:#090909; background:url(../images/btns.png) no-repeat -247px -166px; margin:0 10px; font-size:18px; cursor: pointer; }
.myul li.on, .myul li:hover{ background-position: -247px -206px; }
.myprop_list th { background:url(../images/thbg.png) no-repeat; height:17px; line-height:17px; padding:20px 0; }
.myul li.on { cursor: default; }
.myprop_list th a {color:#141414; }
.myprop_list td { color:#fff;}
#propList {background:#232323; padding-bottom:20px;}
#propList td a:hover { text-decoration:underline; color:#fce086;}
#propList tr:nth-child(even) { background:#313131;}
#propList td { line-height: 20px; padding: 10px 0; }

span.up, span.down { display: inline-block; *display: inline; *zoom: 1; vertical-align: middle; z-index:100; width:16px; height:16px; margin: -2px 2px 0 2px;}
span.up { background:url(../images/btns.png) no-repeat -139px -51px;}
span.down { background:url(../images/btns.png) no-repeat -160px -51px; }

.page{margin: 0 auto; width: 90%; text-align: center;padding: 20px 0;}
.page a {margin:0 5px;}
.page a:hover {text-decoration: underline;color: #fce086;}


/*profile*/
.eudemon-profile { width: 80%; margin: 0 auto; padding: 20px 0; }
.eudemon-menu { color: #eccd78; font-size: 12px; padding-bottom: 20px; }
.eudemon-menu a { color: #999; }
.eudemon-menu a:hover { color: #eccd78; text-decoration: underline; }
h3 { color: #f4d776; font-size: 20px; text-align: center; }
.type { text-align: center; color: #636363; }
.imglist li { display: inline-block; *display: inline; *zoom: 1; vertical-align: middle; margin: 0 20px; }
.imglist {  text-align: center; }
.imglist, .attr-all, .intro { padding: 10px 0; }
.eudemon-profile p strong { color: #f4d776; font-weight: normal; }
.attr { padding: 10px 0; width: 50%; float: left; border-top: 1px dashed #343232; }
.nodata { display: none; text-align: center; padding: 50px 0; color: #999; }

/*compare result*/
.eudemon-vs { width: 80%; margin: 0 auto; padding: 20px 0; }
.vs-result  { padding: 20px 0; text-align: center; }
.vs-result li { display: inline-block; *display: inline; *zoom: 1; vertical-align: middle; color: #f4d776; }
.vs-result li.vs { width: 122px; height: 122px; background: url(../images/vs.png) no-repeat 0 0; }
.pageview .vs-table { width: 70%; margin: 50px auto; }
.vs-table .c1 { width: 20%; padding-right: 5%; text-align: right; }
.vs-table .c2, .vs-table .c3, .vs-table .c4 { width: 14%; padding: 0 3%; text-align: left; }
.vs-table td { line-height: 30px; }
.stat { border-bottom: 1px dashed #343232; padding-bottom: 20px; }
.stat strong { color: #f4d776; font-size: 18px; }
.stat i { font-style: normal; color: #f4d776; }
.stat li { float: left; padding-right: 60px; }
.vs-table .up { color: #109e09; }
.vs-table .down { color: #bb0a0a; }



/*footer*/
.footer { text-align: center; padding: 40px 0; }
.footer .social a { display: inline-block; *display: inline; *zoom: 1; width: 48px; height: 48px; background: url(../images/pic.png) no-repeat 0 0; text-indent: -999em; vertical-align: middle; margin: 0 5px; }
.footer .social a.fb { background-position: -291px -326px; }
.footer .social a.yt { background-position: -359px -326px; }
.footer .social a.discord { background: url(https://www.eudemons.com/en/images/icon-discord.png) no-repeat 0 0; }
.footer .social a.tt { background: url(https://www.eudemons.com/en/images/icon-tiktok.png) no-repeat 0 0; }
.footer .social a.ins { background: url(https://www.eudemons.com/en/images/icon-ins.png) no-repeat 0 0; }
.footer .social a.twitter { background: url(https://www.eudemons.com/en/images/icon-twitter.png) no-repeat 0 0; }

.footer .copyright a { text-indent: 0; background: none; width: auto; height: auto; margin: 0 5px; vertical-align: middle; }
.footer .copyright a:hover { text-decoration: underline; }

.footer table, .footer .copyright { margin: 10px auto 0 auto; }
.footer table a { text-indent: 0; background: none; width: auto; height: auto; margin: 0 5px; vertical-align: middle; }
.footer table a:hover { text-decoration: underline; }



/**/




/*
.tc_h2 { color:#fee09d; font-size:24px; font-weight:normal;}
.tc_txt { padding:20px; line-height:24px;}
.tc_txt img { width:169px; height:169px; overflow:hidden; border:2px solid #dfbf6d; border-radius:6px;}
.tc_txt01 { padding:20px 40px;}

.eudemon-cont {padding-top:50px;}
.tc_h1 { color:#fbdf85; font-size:30px; font-weight:normal; padding-bottom:10px; line-height:40px; text-align:center;}
.tc_p1 { line-height:40px; font-size:18px;}
.tc_p1 span { display:inline-block; color:#f9de84; font-size:22px;}
.tc_p2 { text-align:center;color:#666666; padding-bottom:20px; font-size:16px;}
.tc_txt td { text-align:center; line-height:28px;}
.line { border-bottom:1px dashed #343435; overflow:hidden; display:block; margin-bottom:15px; padding-top:10px; clear:both;}
.eudemon-cont table{ margin:10px auto}

.rank-cont {padding: 50px 5px 10px 5px; line-height:24px; text-align:center}
.rank-cont h2 { width:500px; height:40px; line-height:40px; text-align:center; background:url(../images/ranktitle.png) no-repeat; color:#f9dd83; font-size:34px; margin:0 auto;}


.tc_l { float:left; width:300px;}
.tc_c { text-align:center;}
.tc_txt02 { padding:20px 10px; overflow:hidden;}
.tc_l2 { float:left; width: 38%; padding-right: 1%; border-right: 1px solid #c19f5f; }
.tc_r2 { float:left; width: 59%; margin-top:50px; }
.tc_txt02 li { position: relative; height:160px; float:left; width:90px; margin: 0 10px; color:#A7FFFF; font-size:14px; text-align:center; line-height:16px; display:block;}
.tc_txt02 li img { width:90px; height:90px;}
.tc_txt02 li a:hover{ text-decoration:none}
.tc_h3 { color:#f8dc83; font-size:30px; font-weight:normal; line-height:40px; padding-bottom:10px; margin:20px 0; text-align:center}
.aToolTip { background: #043e33; border: 1px solid #118a59; color: #fff; padding-bottom: 10px; width: 458px;}
.equal {color:#FFFFFF;}

.compare-cont { font-size: 16px; padding: 40px 20px 20px 20px; line-height: 24px; }
.compare-cont h2{}
.compare-img { background: url(../images/vs.png) no-repeat center 50px; padding-bottom: 20px; }
.compare-img p { float: left; width: 50%; text-align: center; font-size: 18px; line-height: 30px; color:#f1d47d }
.compare-img p img { width: 180px; height: 180px; border:3px solid #dfbf6d; border-radius:6px;}

.compare-table { width: 80%; color: #fff; font-size:18px; }
.compare-table .c-c1 { width: 20%; text-align: right; }
.compare-table .c-c2 { width: 8%; text-align: right; }
.compare-table .c-c3 { width: 10%; text-align: left; }
.compare-table .c-c4 { width: 15%; text-align: center; }
.compare-table .c-c5 { width: 10%; text-align: right; }
.compare-table .c-c6 { width: 10%; text-align: left; }
.compare-table i.up, .compare-table i.down, th span.up, th span.down { display: inline-block; *display: inline; *zoom: 1; vertical-align: middle; z-index:100; width:16px; height:16px; margin: -2px 2px 0 2px;}
.compare-table i.up, th span.up { background:url(../images/btns.png) no-repeat -139px -51px;}
.compare-table i.down, th span.down { background:url(../images/btns.png) no-repeat -160px -51px; }
.compare-table td.up { color:#00ff1e; }
.compare-table td.down { color:#ff0000; }


.compare-static { width: 80%; padding: 20px 5%; margin: 0 auto 30px auto; background: url(../images/v2/obg2.png) repeat; font-size: 20px; line-height:28px; border-bottom:1px dashed #343435;  }
.compare-static strong { font-size: 22px; color:#f1d47d}
.compare-static i { font-style: normal; display: inline-block; *display: inline; *zoom: 1; vertical-align: middle; margin-right: 40px; color: #fff; }

.result-cont {padding-top:50px;}
.result-cont h2 {height:60px; line-height:60px; font-size:28px; color:#f9dd83; }
.search-result { padding: 60px 10px 20px 10px; overflow: hidden; }
.search-result li { position: relative; height: 160px; float: left; width: 90px; margin: 0 18px 10px 18px; color: #A7FFFF; font-size: 14px;text-align: center;line-height: 16px;display: block; }
.search-result li a { display: block; }
.search-result li img { width: 100%; }*/




/*pop box*/
.mask{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #000; opacity: 0.4; filter: alpha(opacity=40); z-index: 1112;}
.msg_form_class, .bugs_form_class, .suggest_form_class { display:none; width: 100%; height: 100%; position: fixed; left: 0; top: 36%; }
.msg_form_class { z-index:1114; }
.bugs_form_class, .suggest_form_class { z-index:1112; }
.commonbox { width: 100%; height: 100%; position: absolute; left: 0; top: 0; }

.tipbox{position: relative; margin: 0 auto; z-index: 1113;color: #fff; background: #130c00; border: 2px solid #ceac5c; }
.box1{width: 440px;}
.box2{width: 80%; max-width: 800px; }
.box3{width: 460px;}
.box4{width: 800px;}

.tip_t{ position: relative; z-index: 2; height: 50px; text-align: center; border-radius: 10px 10px 0 0; }
.tip_t a.close{ position: absolute; top: 5px; right: 0; width: 40px; height: 40px; line-height: 30px; color: #ceac5c; font-size: 40px; }
.tip_t a.close:hover{ color: #fff; }
.tip_t h2{ color: #ceac5c; line-height: 48px; font-size: 30px; text-align: center; }
.tip_c{ position: relative; z-index: 1; }
.tip_con{width: 88%; margin: 0 auto; padding: 20px 0 5px 0; position: relative;}
.tip_con.sp{width: 96%;}
.tip_con .code_img img { vertical-align: middle; }
.tip_con span{color: #ceac5c;}
.tip_con p{ padding: 7px 0; line-height: 16px;}
.tip_con table{width: 100%; margin: 10px auto;}
.tip_con table td, .tip_con table th{text-align: center; border: 1px solid #7e5832; line-height: 30px;}
.tip_con table th { font-size: 16px; }
.tip_con form ul{padding: 0 20px;}
.tip_con form ul li{padding: 3px;}
.tip_con form label{font-size: 16px; text-transform: capitalize; width: 100px; display: inline-block; text-align: right; padding-right: 3px;}
.tip_con form input.ipt, .tip_con form select.slt { width: 200px; padding-left: 2px; color: #000; border: 1px solid #fecf9b; border-right-color: #fff6ed; border-bottom-color: #fff6ed; height: 24px; line-height: 24px; }
.tip_con form input.ipt{  }
.tip_con form input.code{width: 120px;}
.tip_con form select.slt{  }
.tip_con textarea{ font-family: Arial; font-size: 14px; width: 100%; height:160px; border: 1px solid #fecf9b; border-right-color: #fff6ed; border-bottom-color: #fff6ed; }
.tip_db{padding-bottom: 15px; text-align: center;}
.tip_db ul{margin: 0 auto; text-align: center;}
.tip_db p a{color: #d2914d; }
.tip_db p a:hover{text-decoration: underline;}
.tip_db a.btn_tip {  display: block; width: 112px; height: 36px; margin: 10px auto; color: #170e0e; background: #ceac5c; line-height: 36px; font-size: 20px; text-transform: uppercase;  border-radius: 8px; }
.tip_db a.btn_tip:hover { background: #ffee00; text-decoration: none;}
.reg-hint { text-align: center; }
.reg-hint a, .tip_db li, .pp-tabs a { display: inline-block; *display: inline; *zoom: 1; vertical-align: middle; width: 40%; }
.loading{width: 100%; height: 100%; position: fixed; top: 0; left: 0; line-height: 56px; color: #fff; background: #000 url(../images/loader.gif) no-repeat center center; opacity: 0.7; z-index: 10000; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=70); }



.mod-orient-layer{display:none;position:fixed;height:100%;width:100%;left:0;top:0;right:0;bottom:0;background:#000;z-index:9997}
.mod-orient-layer-content{position:absolute;width:100%;top:45%;margin-top:-75px;text-align:center}
.mod-orient-layer-icon-orient{ display: block; background:url(https://www.eudemons.com/en/images/icon-orient.png) no-repeat 0 0/100% 100%; width:9.4vw;height:15.3vw;transform:rotate(90deg);-webkit-transform:rotate(90deg);-webkit-animation:rotation infinite 1.5s ease-in-out;animation:rotation infinite 1.5s ease-in-out; margin:0 auto; }
.mod-orient-layer-desc{margin-top:2vw;font-size:4vw;color:#fff;}

@-webkit-keyframes rotation{
    10%,100%,90%{-webkit-transform:rotate(90deg)}
    50%,60%{-webkit-transform:rotate(0)}
}
@keyframes rotation{
    10%,100%,90%{transform:rotate(90deg)}
    50%,60%{transform:rotate(0)}
}
@media screen and (orientation:portrait){
    #orientLayer{display:block}
}