body { font-family: Verdana; background: #000; color: #fff; text-align:center; }

a { color: #CBA300; text-decoration:none; }
a:hover { text-decoration:underline; color: #FFFFFF; }

h1 {display:none; }

.menu { text-align:center; margin:5px 0 15px; font-size:12px; font-weight:bold; }
.menu a.active { color: #FFFFFF; }

.adsense-bottom { margin:3px 0; }
/* -- talent cal -- */

.talContainer, .talCalcContainer, .petTalCalcContainer { width: 700px; position:relative; background:none; }
.talContainer { height: 659px; padding: 33px 0 0 0 }
.talentFrame { width: 700px; padding: 0px; background: none }
.talCalcContainer { height: 659px; margin:0 auto;  padding: 19px 0 0 0 }
.petTalCalcContainer { height: 402px; padding:20px 0 0 0 ; }
.petTalCalcContainer .talentFrame { width: 210px; margin-left:164px }

.calcInfo { margin:0 auto 0; height: 22px; padding: 12px 100px 10px 100px; border: 1px solid #75601c; border-left: none; border-right: none; color: #FFF; }
.calcInfo span.ptsHolder { margin: 0 30px 0 0; }
.calcInfo #pointsLeft { margin-right: 12px }
.calcInfoLeft { float: left; display: block }
.calcInfo a.petBeastMastery { display: block; float: left; width: 19px; height: 17px; line-height: 17px; background: url('http://eu.wowarmory.com/_images/talents/button-beastmaster2.gif') no-repeat 0 0; position: relative; top: 1px; font-size: 11px; text-align: center; color: #00ff00; text-decoration: none }
.calcInfo a.petBeastMastery:hover { background-position: 0 -17px }
.calcInfo a.petBeastMastery-on { color: red !important; background-position: 0 -34px !important }

/* TODO: Add nice 1px #75601c border to the talent trees, will require updating the background image */
.talContainer .talentTree { margin-left:12px;width: 210px; height: 569px; padding: 5px 0 0 0; display: block; float: left; background-repeat:no-repeat;border: 1px solid #75601c }
.petTalCalcContainer .talentTree { height: 314px; }
.talContainer .talentTree .tier { height: 52px; width: 210px;  position:relative; }
.talContainer .talentTree .talent { position:absolute; display: block; height: 42px; width: 46px; background-position: 2px 2px; background-repeat:no-repeat; }
.talContainer .talentTree .talentHolder { width: 44px; height: 39px; padding: 2px 0 0 2px; background: url('http://eu.wowarmory.com/_images/talents/talent-wrap-small.gif') no-repeat 0 50%;  }
.talContainer .talentTree .tier .talentHover { background: url('http://eu.wowarmory.com/_images/talents/talent-hover.png') 0 0 no-repeat; float: left; height: 30px; width: 30px; }
.talContainer .talentTree .tier .talentHover:hover { background-position: 0 100%; }
/* different select states */
.talContainer .talentTree .disabled { background-position: 0 0 !important; }
.talContainer .talentTree .talentMax { background-position: 0 100% !important;  }

.talContainer .talentTree .disabled .rankCtr { color: #FFF !important; }
.talContainer .talentTree .talentMax .rankCtr { color: #FFD100 !important; }
.talContainer .talentTree .rankCtr { color: #1AFF1A; }

.talContainer .talentTree .col0 { top: 0; left: 10px;  }
.talContainer .talentTree .col1 { top: 0; left: 60px;  }
.talContainer .talentTree .col2 { top: 0; left: 110px;  }
.talContainer .talentTree .col3 { top: 0; left: 160px;  }

.talContainer .rankCtr {color: #FFF; width: 15px; font-size: 11px; position:absolute; bottom: 1px; right: 4px; }
.talContainer .requiredArrow { display: block; position: absolute; z-index: 100; }

.talContainer .vArrow { background: url('http://eu.wowarmory.com/_images/talents/arrow-down.gif') 0 100% no-repeat; }
.talContainer .hArrow { background: url('http://eu.wowarmory.com/_images/talents/arrow-vertical.gif') 0 100% no-repeat; }
.talContainer .plain { background-image: url('http://eu.wowarmory.com/_images/talents/arrow-plain.gif'); }
.talContainer .arrowLeft { background-position: 0 0; }
.talContainer .arrowRight { background-position: 100% 0; }
.talContainer .disabledArrow { background-position: 100% 100%; }
.talContainer .disabledArrowL { background-position: 0 100% !important; }

.talContainer .talentTreeInfo {background: #2F2F2F; margin: 4px 0px 0 0px; line-height: 21px; padding: 5px 10px 0 10px; height: 25px; overflow: hidden; white-space: nowrap;border: 1px solid #75601c;  }

/* Reset/Export button */
.resetExportHolder, .resetExportPetHolder {margin: 0 auto;margin-top:5px; clear: both; position:relative; top: 50px;}
/*.reload{margin:2px 0 0 15px;}*/

.subtleResetButton { cursor:pointer; float: right; text-decoration: none !important; margin: 0 3px 0 0; display: block; height: 22px; padding: 0 0 0 7px; background: url('http://eu.wowarmory.com/_images/button-blue-left.gif') 0 0 no-repeat;}
.subtleResetButton span { cursor:pointer; float: left; display: block; height: 21px; padding: 1px 10px 0 5px; }



.nemaes { font-size:20px; color:#CBA300; margin: 0 0 15px; display: block; }

		#rankTopStyle { position: absolute;
			top: 33px;
			left: 28px;
			z-index: 100;
       }	   
	   
		#descriptionTopStyle { position: absolute;
			top: 20px;
			left: 50px;
			z-index: 100;
      }	   	   
	   
		#descriptionTopStyleThird { position: absolute;
			top: 20px;
			left: -350px;
			z-index: 100;
       }	   	   

		#descriptionTopStyleBottom { position: absolute;
			top: -60px;
			left: 50px;
			z-index: 100;
       }
	   
		#descriptionTopStyleThirdBottom { position: absolute;
			top: -60px;
			left: -350px;
			z-index: 100;
       }	   
	   
		#takeUpNoSpace { position: absolute;
			z-index: 100;
       }	   	   
	   
		#wrapper { position: relative;
			z-index: 100;
       }	   

		#talentThumbStyle { position: absolute;
			top: 0px;
       }

		#iconOver { position: absolute;
			top: -2px;
			left: -2px;
       }
	   
		#wrapper99 { position: relative;
			z-index: 99;
       }	   

		#wrapper51 { position: relative;
			z-index: 51;
       }	   	   

		#wrapper49 { position: absolute;
			z-index: 49; top:2px; left:2px;
       }	   	 
	   
		#wrapper50 { position: relative;
			z-index: 50;
       }	   

		#arrowdown1 { position: absolute;
			top: -20px;
			left: 11px;
			z-index: 100;
       }	   	   

		#arrowdown2 { position: absolute;
			top: -85px;
			left: 11px;
			z-index: 100;
       }	   	   

		#arrowdown3 { position: absolute;
			top: -150px;
			left: 11px;
			z-index: 100;
       }	   	   	   	   

		#arrowdown4 { position: absolute;
			top: -215px;
			left: 11px;
			z-index: 100;
       }	   	   	   	   
	   
		#arrowacrossright { position: absolute;
			top: 15px;
			left: -20px;
			z-index: 100;
       }
	   
	   	#arrowacrossleft { position: absolute;
			top: 12px;
			left: 39px;
			z-index: 100;
       }   

		#arrowdownleft { position: absolute;
			top: -47px;
			left: 10px;
			z-index: 100;
       }
	   

		#arrowdownright { position: absolute;
			top: -47px;
			left: -20px;
			z-index: 100;
       }

		#tabs { position: absolute;
			top: -14px;
			z-index: 30;
       }	   

		#tabsUp { position: absolute;
			top: -14px;
			z-index: 30;
			}
	   
#iconOverParchment{
position: absolute;
z-index: 100;

}

	#alignLeft{text-align:left;float:left;color:ffffff;}
	#alignRight{text-align:right;float:right;color:ffffff;}
    
    
table { font-size: 12px; }

.treePadding {padding: 0px 30px 0 10px;}
.talenttreename { height:27px; line-height:27px; position: relative; left: -3px;}
.talenttreeicon { width:27px; height:27px; position: relative; left: 4px; }

#replaceMeWithTalents {margin-top:6px; _margin-top:20px;}

.treeName {color: #ffe400; font-weight: bold; font-size: 14px; }
.treeColon {color: #FFFFFF; font-size: 12px;}
.treePoint {color: #FFFFFF; font-size: 12px;}
.treePoints {color: #FFFFFF; font-size: 12px;}

.rankTooltip		{ font-family: "Tahoma", "Arial", "Helvetica", "Sans-Serif"; color: #ffffff; font-size: 11px;}
.mySmall 		{ font-family: "Verdana", "Arial", "Helvetica", "Sans-Serif"; color: #ffffff; font-size: 11px; line-height: 11pt;}
.mySmall2 		{ font-family: "Verdana", "Arial", "Helvetica", "Sans-Serif"; color: #ffd100; font-size: 11px; line-height: 11pt;}
.mySmallOff 		{ font-family: "Verdana", "Arial", "Helvetica", "Sans-Serif"; color: #ffffff; font-size: 11px; line-height: 11pt;}
.mySmall22 		{ font-family: "Verdana", "Arial", "Helvetica", "Sans-Serif"; color: #ffd100; font-size: 11px; line-height: 11pt;}
.mySmallOff2 		{ font-family: "Verdana", "Arial", "Helvetica", "Sans-Serif"; color: #ffffff; font-size: 11px; line-height: 11pt;}
.mySmallGreen 		{ font-family: "Verdana", "Arial", "Helvetica", "Sans-Serif"; color: #1aff1a; font-size: 11px; position: relative;}
.mySmallGreen2 		{ font-family: "Verdana", "Arial", "Helvetica", "Sans-Serif"; color: #1aff1a; font-size: 11px; position: relative;}

		.arrowdown1 { position: absolute;
			top: -23px;
			left: 11px;
			z-index: 100;
       }	   	   

		.arrowdown2 { position: absolute;
			top: -88px;
			left: 11px;
			z-index: 100;
       }	   	   

		.arrowdown3 { position: absolute;
			top: -155px;
			left: 11px;
			z-index: 100;
       }	   	   	   	   

		.arrowdown4 { position: absolute;
			top: -220px;
			left: 11px;
			z-index: 100;
       }	   	   	   	   
	   
		.arrowacrossright { position: absolute;
			top: 12px;
			left: -20px;
			z-index: 100;
       }   
	   
		.arrowdownleft { position: absolute;
			top: -50px;
			left: 10px;
			z-index: 100;
       }
	   
		.arrowacrossleft { position: absolute;
			top: 10px;
			left: 39px;
			z-index: 100;
       }   

		.arrowdownright { position: absolute;
			top: -50px;
			left: -20px;
			z-index: 100;
       }
	   
	   .arrowdown2right { position: absolute;
			top: -113px;
			left: -20px;
			z-index: 100;
       }	   
	   
		.arrowdown2left { position: absolute;
			top: -113px;
			left: 10px;
			z-index: 100;
       }