@charset "utf-8";
/* Copyright 2011, NetEase Game. Area World of Warcraft(CTM). All Rights Reserved. */

/* Overall CN style fix */
* { text-transform: none !important; letter-spacing: 0 !important; font-family: 微软雅黑, Microsoft YaHei, Helvetica, Tahoma, StSun, 宋体, SimSun, sans-serif !important; font-style: normal !important }

/* Font related */
html,
body { font: normal 12px/1.3 微软雅黑, Microsoft YaHei, Helvetica, Tahoma, StSun, 宋体, SimSun, sans-serif; font-size: 12px }
.ui-button span,
.ui-cancel span,
.service-bar,
#footer { font-family: 微软雅黑, Microsoft YaHei, Helvetica, Tahoma, StSun, 宋体, SimSun, sans-serif }
.service-bar,
.service-link,
.explore-secondary a,
.ui-context .character-list .primary .char .realm,
.service-link,
.explore-secondary a,
#sidebar-bnet-ads,
#copyright { font-size: 12px }
#footer h3 a { font-size: 14px }

html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,em,img,strong,dl,dt,dd,ol,ul,li,form,table,tr,th,td,input,select { margin: 0; padding: 0; border: 0; outline: 0;  }
html, body { font: normal 12px/1.3 "Microsoft YaHei", Arial, Helvetica, sans-serif; background:url(http://img1.cache.netease.com/game/cataclysm/images/ctm_cn_bg.jpg) no-repeat #1b0905 top center;}
ol, ul { list-style: none; }
:focus { outline: 0; }
a { outline: none; text-decoration:none; cursor:pointer;}
a:hover { text-decoration:none; }
p { margin:0;  text-indent:2em;}
.clear {clear:both; height:0; overflow:hidden; display:block;}
body.cataclysm { background:#1b0905 !important;}
.cataclysm .bg_bottom { width:100%; height:962px; position:absolute; z-index:0; }

/*头图*/
#cctm { width:960px; left:50%; margin-left:-480px; position:absolute; top:35px;}
#cctm-main {width:960px; background:url(http://img1.cache.netease.com/game/cataclysm/images/ctm_main_y.jpg) repeat-y; height:900px; }

#cctm-banner { height:290px; background:url(http://img1.cache.netease.com/game/cataclysm/images/banner.jpg) no-repeat center; position:relative;}
#cctm-banner h1 { display:none;}
#cctm-banner .cctm-logo { position:absolute; width:265px; height:180px; right:35px; top:90px;}
#cctm-banner .cctm-logo a { display:block; width:265px; height:180px;}
/*导航菜单*/
#cctm-menu { height:84px; background:url(http://img1.cache.netease.com/game/cataclysm/images/menu.jpg) no-repeat center; position:relative; z-index:10;}
#cctm-menu .top-nav { width:606px; height:64px; background:url(http://img1.cache.netease.com/game/cataclysm/images/menu-nav.jpg) no-repeat top left; position:absolute; left:15px; top:11px; }
#cctm-menu ul li { position:relative; width:101px; height:64px; display:block; float:left;}
#cctm-menu ul li a { width:101px; display:block; height:64px; }
#cctm-menu ul li ul { position:absolute; left:-1px; top:64px; display:none;}
#cctm-menu ul li ul li { width:97px; height:30px; margin-right:2px; text-indent:0.5em; line-height:30px;}
#cctm-menu ul li ul li { border-left:1px solid #802900; border-bottom:1px solid #802900; border-right:1px solid #802900;}
#cctm-menu ul li ul li a { display:block; text-decoration:none; background:#1d0200; height:30px; width:97px; }
#cctm-menu ul li ul li a:hover { background:#741e04;}
#cctm-menu li:hover ul, #cctm-menu li.over ul { display: block; }
* html #cctm-menu ul li ul li { width:97px; height:30px; line-height:30px; margin-right:2px; }
* html #cctm-menu ul li ul li { border-left:1px solid #802900; border-bottom:1px solid #802900; border-right:1px solid #802900;}
* html #cctm-menu ul li ul li a { width:97px; height:30px; }
* html #cctm-menu ul li ul li a:hover { background:#741e04;}
#cctm-menu a.nav-index:hover { background:url(http://img1.cache.netease.com/game/cataclysm/images/menu-nav.jpg) no-repeat 0 -64px;}
#cctm-menu a.nav-tuandui:hover {background:url(http://img1.cache.netease.com/game/cataclysm/images/menu-nav.jpg) no-repeat -101px -64px;}
#cctm-menu a.nav-xiaodui:hover {background:url(http://img1.cache.netease.com/game/cataclysm/images/menu-nav.jpg) no-repeat -202px -64px;}
#cctm-menu a.nav-skill:hover {background:url(http://img1.cache.netease.com/game/cataclysm/images/menu-nav.jpg) no-repeat -303px -64px;}
#cctm-menu a.nav-shengwang:hover {background:url(http://img1.cache.netease.com/game/cataclysm/images/menu-nav.jpg) no-repeat -404px -64px;}
#cctm-menu a.nav-more:hover {background:url(http://img1.cache.netease.com/game/cataclysm/images/menu-nav.jpg) no-repeat -505px -64px;}
/*数据库搜索*/
#cctm-menu .search { width:280px; height:24px; position:absolute; right:30px; top:40px; }
#cctm-menu .search .st { width:200px; height:20px; padding:0 0 0 3px;  float:left; line-height:22px; display:inline; margin:0 5px 0 0;}
#cctm-menu .search .st { background:#160000; color:#f07c02; border:1px solid #761a00;}
#cctm-menu .search .ss { width:28px; height:22px; float:left;}
#cctm-menu .search .ss { background:url(http://img1.cache.netease.com/game/cataclysm/ctmbefore/search.gif) no-repeat 0 0;}
#cctm-menu .search .ss:hover { background-position: 0px -22px;}
.cctm-content { width:910px; position:relative; margin:0 auto;}
.cctm-top {height:580px;}
.cctm-bottom { background:url(http://img1.cache.netease.com/game/cataclysm/images/bottom-bg.gif) no-repeat center top; height:70px; width:960px;}
/* footer */
.footer { width:960px; height:109px; padding:50px 0 0 0; position:relative; background:#1b0905;}
.foot { color:#f88906; text-align:center; line-height:30px; }
.foot .col { color:#f88906; line-height:30px;}
.foot .text { text-align:center; }
.cRed { color:#F00;}

/* title */
.wiki .title { margin-bottom: 30px; }
.wiki .title .parent { font-size: 14px; display: block; padding-bottom: 10px; }
.wiki .title h2 { color: #f88906; font: 52px/100% "Palatino Linotype", Georgia, Times, sans-serif; letter-spacing: -1.5px; text-shadow: #241209 0 0 5px; }
.wiki .title .type { font-size: 16px; }
.wiki .expansion-name { font-style: italic; display: block; padding-top: 8px; }

/* directory */
.wiki.directory { min-height: 850px; padding-bottom: 25px; }
.wiki.directory .title { padding: 25px; padding-top: 35px; padding-bottom: 50px; margin: 0; }
.wiki.directory .desc { width: 50%; color: #a4704e; margin-top: 25px; line-height: 2em; }

.wiki .term { color: #98562a; }
.wiki .has-tip { border-bottom: 1px dotted #565656; cursor: help; }
.wiki a.has-tip { cursor: pointer; }
.wiki .fact-list { margin-left: 5px; }
.wiki .fact-list li { margin: 8px 0; padding-left: 15px; background: url("../images/bullet2.gif") 0 5px no-repeat; }
.wiki .fact-list .button-holder { padding-top: 6px; }
.wiki .learn-more li { margin-bottom: 10px; color: #B79855; }

.expansion-0 #content .content-top { background: url("../images/index-bg-0.jpg") 0 0 no-repeat; }
.expansion-1 #content .content-top { background: url("../images/index-bg-1.jpg") 0 0 no-repeat; }
.expansion-2 #content .content-top { background: url("../images/index-bg-2.jpg"/) 0 0 no-repeat; }
.expansion-3 #content .content-top { background: url("../images/index-bg-3.jpg") 0 0 no-repeat; }
/* layout */
.talentcalc { position: relative; }
.talentcalc-tree-wrapper { float: left; width: 228px; margin-right:12px; position: relative; }
.talentcalc-tree-wrapper.tree-last { margin-right: 0 !important; }
.talentcalc-tree-wrapper.tree-specialization .talentcalc-tree-header .icon .frame { background-position: 0 -50px; }
.talentcalc-pet .talentcalc-tree-wrapper { margin-right: 0 !important; }

/* choose a spec text */
.talentcalc-choosetext { font-size: 22px; text-align: center; margin-bottom: 25px; }

/* tree header */
.talentcalc-tree-header { height: 40px; margin-top: 4px; margin-bottom: 8px; }
.talentcalc-tree-header .points, .talentcalc-tree-header .name { float: left; height: 32px; line-height: 32px; }
.talentcalc-tree-header .icon { float: left; margin-right: 12px; }
.talentcalc-tree-header .icon-frame-treeheader { display: block; width: 32px; height: 32px; position: relative;  }
.talentcalc-tree-header .icon-frame-treeheader img { display: block; width: 26px; height: 26px; padding: 3px 0 0 3px; }
.talentcalc-tree-header .icon-frame-treeheader .frame { position: absolute; left: -9px; top: -9px; width: 50px; height: 50px; background: url("../images/tree-icon-frame.png") left top no-repeat; }
.talentcalc-tree-header .points { font-size: 16px; color: white; margin-right: 8px; }
.talentcalc-tree-header .name { font-size: 16px; width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.talentcalc-tree-header .roles { display: block; position: absolute; left: 3px; top: 19px; width: 32px; height: 16px; }

/* tree */
.talentcalc-tree { position: relative; background: black left top no-repeat; border: 1px solid black; }
.talentcalc-tree, .talentcalc-tree-overview { -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; }
.talentcalc-tree-wrapper.tree-specialization .talentcalc-tree,
.talentcalc-tree-wrapper.tree-specialization .talentcalc-tree-overview { border: 1px solid #ffd200;  }

/* tree button */
.talentcalc-tree-button { position: absolute; left: 0; top: 2px; }
.talentcalc-tree-button button span span { width: 174px; }

/* tree overview */
.talentcalc-tree-overview { position: absolute; left: 0; top: 52px; border: 1px solid black; background: rgba(0, 0, 0, 0.9); z-index: 1; }
.talentcalc-tree-overview .icon-wrapper { position: absolute; width: 1px; height: 1px; left: 50%; top: 0; }
.talentcalc-tree-overview .icon-wrapper .icon { position: absolute; left: -28px; top: 30px; }
.talentcalc-tree-overview .icon-wrapper .icon,
.talentcalc-tree-overview .icon-wrapper .texture { width: 56px; height: 56px; -moz-border-radius: 28px; -webkit-border-radius: 28px; border-radius: 28px; }
.talentcalc-tree-overview .icon-wrapper .texture { display: block; background: center center no-repeat; }
.talentcalc-tree-overview .icon-wrapper .frame { position: absolute; left: -4px; top: -4px; width: 64px; height: 64px; background: url(../images/tree-overview-icon-frame.png) no-repeat; }
.talentcalc-tree-overview ul.spells { position: absolute; left: 20px; top: 100px; }
.talentcalc-tree-overview ul.spells li { line-height: 22px; padding: 3px 0; color: #F5EBD1; cursor: help; }
.talentcalc-tree-overview ul.spells li.is-ability { line-height: 48px; font-weight: bold; }
.talentcalc-tree-overview ul.spells .icon, .talentcalc-tree-overview ul.spells .name { float: left; height: 22px; }
.talentcalc-tree-overview ul.spells .icon { margin-right: 5px; }
.talentcalc-tree-overview ul.spells li.is-ability .icon { margin-right: 2px; }
.talentcalc-tree-overview ul.spells li.is-ability .icon, .talentcalc-tree-overview ul.spells li.is-ability .name { height: 48px; }
.talentcalc-tree-overview ul.spells .icon-frame-ability { float: left; position: relative; width: 43px; height: 48px; }
.talentcalc-tree-overview ul.spells .icon-frame-ability img { display: block; width: 28px; height: 28px; padding: 10px 0 0 5px; }
.talentcalc-tree-overview ul.spells .icon-frame-ability .frame { position: absolute; left: -5px; top: 0; width: 48px; height: 48px; background: url("../images/tree-overview-icon-ability-frame.png") no-repeat; }
.talentcalc-tree-overview ul.spells .name { font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 160px; }
.talentcalc-tree-overview .description { position: absolute; left: 20px; top: 300px; color: #F5EBD1; font-size: 11px; width: 188px; height: 75px; overflow: hidden; text-overflow: ellipsis; }

.talentcalc-tree-wrapper.tree-nonspecialization .talentcalc-tree-overview ul.spells li,
.talentcalc-tree-wrapper.tree-nonspecialization .talentcalc-tree-overview .description { color: #8d8d8d; }
.talentcalc-tree-wrapper.tree-nonspecialization .talentcalc-tree-overview ul.spells li .icon .icon-frame-ability .frame { background-position: -48px 0; }

/* cells */
.talentcalc-cells-wrapper { position: absolute; left: 8px; top: 8px; }

/* cell */
.talentcalc-cell { position: absolute; width: 53px; height: 53px; }

/* icon */
.talentcalc-cell .icon { position: absolute; left: 8px; top: 8px; width: 36px; height: 36px; border: 1px solid #545557; }
.talentcalc-cell .icon .texture { display: block; width: 36px; height: 36px; background: no-repeat; }
.talentcalc-cell .icon .ability { position: absolute; left: -9px; top: -9px; width: 54px; height: 54px; background: url("../images/icon-frame-ability.png") no-repeat -54px 0; }
.talentcalc-cell .icon .frame { position: absolute; left: -6px; top: -5px; width: 47px; height: 46px; background: url("../images/icon-frame.png") no-repeat; }
.talentcalc-cell.talent-partial .icon .texture,
.talentcalc-cell.talent-full .icon .texture { display: none; }
.talentcalc-cell.talent-partial .icon .ability,
.talentcalc-cell.talent-full .icon .ability { background-position: 0 0; }
.talentcalc-cell.talent-partial .icon { border-color: #17c815; }
.talentcalc-cell.talent-partial .icon .frame { background-position: -47px top; }
.talentcalc-cell.talent-full .icon { border-color: #c7a200; } 
.talentcalc-cell.talent-full .icon .frame { background-position: -94px top; }
	
/* points */
.talentcalc-cell .points { position: absolute; left: 37px; top: 34px; width: 14px; height: 15px; line-height: 14px; display: none; font-family: Arial, sans-serif; font-size: 11px; font-weight: bold; border: 1px solid #545557; text-align: center; background: black; }
.talentcalc-cell .points .frame { position: absolute; left: -4px; top: -4px; width: 22px; height: 22px; background: url("../images/points-frame.png") no-repeat;}
.talentcalc-cell.talent-partial .points { display: block; border-color: #17c815; color: #6fff5b; }
.talentcalc-cell.talent-partial .points .frame { }
.talentcalc-cell.talent-full .points { display: block; border-color: #c7a200; color: #ffd200; }
.talentcalc-cell.talent-full .points .frame { background-position: -22px top;  }
	
/* arrow */
.talentcalc-cell .arrow { position: absolute; }
.talentcalc-cell .arrow ins { position: absolute; top: 0; width: 37px; height: 100%; background: url("../images/arrow-down.png") no-repeat; }
.talentcalc-cell .arrow em { position: absolute; left: 0; top: -20px; width: 100%; height: 20px; background: url("../images/arrow-corner.png") no-repeat; }
	
.talentcalc-cell .arrow-down { background: url("../images/arrow-down.png") 13px bottom no-repeat; }
.talentcalc-cell.talent-arrow .arrow-down { background-position: -37px bottom; }
	
.talentcalc-cell .arrow-left { background: url("../images/arrow-horiz.png") left 12px no-repeat; }
.talentcalc-cell.talent-arrow .arrow-left { background-position: left -38px; }

.talentcalc-cell .arrow-right { background: url("../images/arrow-horiz.png") right 12px no-repeat; }
.talentcalc-cell.talent-arrow .arrow-right { background-position: right -38px; }
	
.talentcalc-cell .arrow-left-down ins { left: 0; background-position: 13px bottom; }
.talentcalc-cell.talent-arrow .arrow-left-down ins { background-position: -37px bottom; }
.talentcalc-cell .arrow-left-down em { background-position: left 12px; }
.talentcalc-cell.talent-arrow .arrow-left-down em { background-position: left -38px; }
	
.talentcalc-cell .arrow-right-down ins { right: 0; background-position: 11px bottom; }
.talentcalc-cell.talent-arrow .arrow-right-down ins { background-position: -39px bottom; }
.talentcalc-cell .arrow-right-down em { background-position: right 12px; }
.talentcalc-cell.talent-arrow .arrow-right-down em { background-position: right -38px; }

/* interact area */
.talentcalc-cell a.interact { position: absolute; left: 7px; top: 7px; width: 40px; height: 40px; cursor: default; }
.talentcalc-cell a.interact .hover { display: block; width: 36px; height: 36px; margin: 2px 0 0 2px; }
.talentcalc-cell a.interact:hover .hover { background-color: rgba(255, 255, 255, 0.2); }
.talentcalc-cell.talent-partial a.interact,
.talentcalc-cell.talent-full a.interact { cursor: pointer; }
.talentcalc-locked .talentcalc-cell a.interact { cursor: default; }

.talentcalc-top { margin-bottom: 20px; clear: both; padding: 0 0 5px 0; border-bottom: 1px solid #2b190e;  }
.talentcalc-bottom { margin-top: 20px; clear: both; padding: 10px 0; border-top: 1px solid #2b190e; }
.talentcalc-bottom .export,
.talentcalc-bottom .calcmode,
.talentcalc-top .reset { float: right;  margin: 0;}
.talentcalc-top .reset .icon { display: inline-block; width: 15px; height: 15px; padding: 0; vertical-align: middle; background: url("../images/icons.gif") -400px -1px no-repeat; }

/* info */
.talentcalc-info { color: #855b47; }
.talentcalc-info div { display: inline-block; margin-right: 30px; }
.talentcalc-info .value { color: #e9bd7f; font-family: Arial, sans-serif; font-weight: normal; }
.talentcalc-info span ins { color: #855b47; padding-left: 3px; font-weight: normal; text-decoration: none; }
.talentcalc-bottom .export a,
.talentcalc-bottom .calcmode a,
.talentcalc-info .print a { background: url("../images/icons.gif") 0 -1px no-repeat; padding-left: 20px; }
.talentcalc-bottom .export a { background-position: -200px -26px; }
.talentcalc-info .print a { background-position: -400px -26px; }
.talentcalc-info .third-party { height: 21px; padding-top: 5px; }
.talentcalc-bottom .beastmastery { color: #855b47; float: left; }
.talentcalc-bottom .beastmastery input,
.talentcalc-bottom .beastmastery .icon-frame { vertical-align: middle; }
.talentcalc-bottom .beastmastery .icon-frame { margin-right: 3px; }
.talentcalc-info .classlist a { font-size: 14px; }

/* popup */
.talentcalc-popup label { display: block; margin-bottom: 2px; font-weight: bold; }
.talentcalc-popup .input { width: 98%; }
.talentcalc-popup .notice { color: #A4704E; margin-top: 5px; }

/* glyphs */
.talentcalc-glyphs { float: left; margin-left: 12px; height: 420px; width: 165px; padding: 10px; background: rgba(0, 0, 0, 0.5);
	-moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.talentcalc-glyphs ul { margin-top: 10px; }
.talentcalc-glyphs ul li { padding-top: 8px; }
.talentcalc-glyphs ul li a.item-link { display: block; width: 145px; overflow: hidden; }
.talentcalc-glyphs ul li.glyph-title { color: #71401f; font-size: 14px; }
.talentcalc-glyphs ul .item-link-large { display: inline-block; }
.talentcalc-glyphs ul .close { float: right; display: none; margin-top: 6px; width: 20px; height: 12px; background: url("../images/icons/cross-small.gif") center top no-repeat; }
.talentcalc-glyphs ul li.glyph-chosen:hover .close { display: block; }
.talentcalc-glyphs-header { font-size: 16px; }
.talentcalc-glyphs.locked { opacity: .5; }
.talentcalc-glyphs.locked .color-q0 { color: #9D9D9D !important; cursor: default; }

.talentcalc-glyphselector { height: 433px; width: 710px; top: 55px; position: absolute; }
.talentcalc-glyphselector .scroller { height: 431px; overflow: auto; background: #381a0f; }
.talentcalc-glyphselector ul li { clear: both; white-space: nowrap; overflow: hidden; }
.talentcalc-glyphselector ul li:nth-child(odd) { background: #30160c; }
.talentcalc-glyphselector ul li a { display: block; padding: 5px; line-height: 20px; height: 20px; color: #fef092; clear: both; }
.talentcalc-glyphselector ul li a:hover { background: #261109; }
.talentcalc-glyphselector ul li .icon-frame { float: left; margin-right: 5px; }
.talentcalc-glyphselector ul li .description { font-size: 11px; display: block; width: 70%; float: left; overflow: hidden; }
.talentcalc-glyphselector ul li .name { display: block; width: 25%; color: #fff; float: left; font-weight: bold; overflow: hidden; }

/* item inline links */
.item-link { display: inline-block; line-height: 22px; vertical-align: top; white-space: nowrap; }
.item-link .frame-18 { float: left; margin-right: 5px; }
.item-link .tip { border-bottom: 0; }
.item-link-large { height: 38px; line-height: 38px; }
.item-link-large .frame-36 { float: left; margin-right: 10px; }
.item-link-small, .item-link-small-right { display: inline-block; height: 18px; line-height: 18px; vertical-align: top; }
.item-link-small .frame-14 { float: left; margin-right: 3px; }
.item-link-small-right .count { float: left; }
.item-link-small-right .frame-14 { float: left; margin-left: 4px; }