From 88237035b5e93abb66ee0ed5f77ba89f8eca1051 Mon Sep 17 00:00:00 2001
From: rylon <rylon@web.de>
Date: Fri, 31 Oct 2014 19:59:39 +0100
Subject: [PATCH] wizard skills visuals

---
 .../page/default_page/css/default_page.css    |   7 +-
 .../page/wizard_skills/css/wizard_skills.css  |  35 +-
 .../page/wizard_skills/wizard_skills.php      |   1 -
 .../page/wizard_skills/wizard_skills.tpl      | 835 +++++++++---------
 4 files changed, 471 insertions(+), 407 deletions(-)

diff --git a/mojotrollz/page/default_page/css/default_page.css b/mojotrollz/page/default_page/css/default_page.css
index 1940807..b80f44a 100644
--- a/mojotrollz/page/default_page/css/default_page.css
+++ b/mojotrollz/page/default_page/css/default_page.css
@@ -18,7 +18,7 @@ body {
 }
 
 .threecol_col{    
-    display: table-cell;    
+    display: table-cell;
     position: relative;
 }
 
@@ -75,9 +75,8 @@ body {
 }
 
 #frame_content {
-    margin-left: 10px;
-    margin-right: 10px;
-    margin-bottom: 10px;
+    padding: 15px;
+    display: table-cell;
 }
 
 #frame_content_left {
diff --git a/mojotrollz/page/wizard_skills/css/wizard_skills.css b/mojotrollz/page/wizard_skills/css/wizard_skills.css
index 36e9f9e..2c44cd7 100644
--- a/mojotrollz/page/wizard_skills/css/wizard_skills.css
+++ b/mojotrollz/page/wizard_skills/css/wizard_skills.css
@@ -64,15 +64,24 @@ a:visited
 	text-decoration: none;
 }
 
+.treerowspacer{
+    clear: both;
+}
 .contentarea{margin-top:5px;margin-left:5px;width:90%;}
 .button{
+    position: relative;
     //position:absolute;
+    float: left;
     background-image:none;background-repeat:no-repeat;background-position:2px 2px;text-align:center;vertical-align:middle;width:56px;height:54px;}
 .buttonnumber{
-    //position:absolute;
+    //position:absolute;    
+    position: relative;
+    float: right;
+    margin-top: -12px;
     color:#0F0;font-size:10px;vertical-align:middle;text-align:center;font-family:Verdana, Helvetica, Arial, sans-serif;width:21px;height:10px;right:3px;bottom:4px;}
 .window{
     //position:absolute;
+    position: relative;
     background-color:#000;left:-1000px;width:300px;top:135px;padding:1px 1px 1px 1px;color:#000;z-index:6;}
 .window a{color:#000001;}
 .window th{background-color:#333;border:1px solid #CCC;color:#FFF;}
@@ -80,34 +89,54 @@ a:visited
 
 .arrowrd{background-image:url(http://www.mojotrollz.eu/web/mojotrollz/api.php?call=files&cat=skilltree&id=rightdown.png);
         //position:absolute;
+        position: relative;
+        float: left;
         background-position:right top;z-index:2;}
 .arrowd{background-image:url(http://www.mojotrollz.eu/web/mojotrollz/api.php?call=files&cat=skilltree&id=down.png);
        //position:absolute;
+       position: relative;
+       float: left;
        background-position:right bottom;z-index:2;}
 .arrowld{background-image:url(http://www.mojotrollz.eu/web/mojotrollz/api.php?call=files&cat=skilltree&id=leftdown.png);
         //position:absolute;
+        position: relative;
+        float: left;
         background-position:left top;z-index:2;}
 .arrowl{background-image:url(http://www.mojotrollz.eu/web/mojotrollz/api.php?call=files&cat=skilltree&id=left.png);
        //position:absolute;
+       position: relative;
+       float: left;
        background-position:left bottom;z-index:2;}
 .arrowr{background-image:url(http://www.mojotrollz.eu/web/mojotrollz/api.php?call=files&cat=skilltree&id=right.png);
        //position:absolute;
+       position: relative;
+       float: left;
        background-position:right bottom;z-index:2;}
 
 .arrowrd_yellow{background-image:url(http://www.mojotrollz.eu/web/mojotrollz/api.php?call=files&cat=skilltree&id=rightdown_yellow.png);
                //position:absolute;
+               position: relative;
+               float: left;
                background-position:right top;z-index:2;}
 .arrowd_yellow{background-image:url(http://www.mojotrollz.eu/web/mojotrollz/api.php?call=files&cat=skilltree&id=down_yellow.png);
               //position:absolute;
+              position: relative;
+              float: left;
               background-position:right bottom;z-index:2;}
 .arrowld_yellow{background-image:url(http://www.mojotrollz.eu/web/mojotrollz/api.php?call=files&cat=skilltree&id=leftdown_yellow.png);
                //position:absolute;
+               position: relative;
+               float: left;
                background-position:left top;z-index:2;}
 .arrowl_yellow{background-image:url(http://www.mojotrollz.eu/web/mojotrollz/api.php?call=files&cat=skilltree&id=left_yellow.png);
               //position:absolute;
+              position: relative;
+              float: left;
               background-position:left bottom;z-index:2;}
 .arrowr_yellow{background-image:url(http://www.mojotrollz.eu/web/mojotrollz/api.php?call=files&cat=skilltree&id=right_yellow.png);
               //position:absolute;
+              position: relative;
+              float: left;
               background-position:right bottom;z-index:2;}
 
 .tooltip {
@@ -128,12 +157,12 @@ a:visited
 
 .yellowFont{color:#FFD100;}
 
-.talentheader {border-bottom:0px solid #002B55;background-image: url(http://www.mojotrollz.eu/web/mojotrollz/api.php?call=files&cat=skilltree&id=tableheader.png);}
+.talentheader {width: 300px; border-bottom:0px solid #002B55;background-image: url(http://www.mojotrollz.eu/web/mojotrollz/api.php?call=files&cat=skilltree&id=tableheader.png);}
 .talentheader div{padding-right:20px;background-repeat:no-repeat;background-position:bottom right;height:41px;width:209px;float:left;}
 .talentheader strong{font-weight:bold;display:block;padding-left:18px;padding-top:14px;vertical-align:bottom;}
 .talentheader img {margin-top:11px; cursor:pointer; background-image:url(http://www.mojotrollz.eu/web/mojotrollz/api.php?call=files&cat=skilltree&id=resetbutton.png);}
 
-.outerbg{border:0px solid #002B55;background-color:#002B55;}
+.outerbg{border:0px solid #002B55;background-color:#002B55; padding-left: 12px;}
 .talenticon{background-image:url(http://www.mojotrollz.eu/web/mojotrollz/api.php?call=files&cat=skilltree&id=borders.gif);background-position:0 0;background-repeat:no-repeat;width:56px;height:54px;}
 .noscript{
     //position:absolute;
diff --git a/mojotrollz/page/wizard_skills/wizard_skills.php b/mojotrollz/page/wizard_skills/wizard_skills.php
index c380234..967eff3 100644
--- a/mojotrollz/page/wizard_skills/wizard_skills.php
+++ b/mojotrollz/page/wizard_skills/wizard_skills.php
@@ -1,5 +1,4 @@
 <?php
-
 class wizard_skills extends SYSTEM\PAGE\Page {
     
     private function js(){        
diff --git a/mojotrollz/page/wizard_skills/wizard_skills.tpl b/mojotrollz/page/wizard_skills/wizard_skills.tpl
index 313df1a..f828dcf 100644
--- a/mojotrollz/page/wizard_skills/wizard_skills.tpl
+++ b/mojotrollz/page/wizard_skills/wizard_skills.tpl
@@ -1,418 +1,455 @@
-<table width="900" border="0" cellspacing="0" cellpadding="0" align="left">
+<table width="900" border="0" cellspacing="0" cellpadding="0" align="left" style="margin-left: 10px;">
     <tr>
-        <td width="300" class="talentheader">
-            <div id="treeheader1"><strong id="treeheadertext1"><span class="yellowFont">Balance</span><span class="stdText"> - 0 points</span></strong></div>
+        <td class="talentheader">
+            <div id="treeheader1">
+                <strong id="treeheadertext1">
+                    <span class="yellowFont">Balance</span>
+                    <span class="stdText"> - 0 points</span>
+                </strong>
+            </div>
             <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" id="treeheaderimg1" onmouseover="javascript:resetHoverOn('treeheaderimg1');" onmouseout="javascript:resetHoverOff('treeheaderimg1');" width="59" height="20" alt="Reset this tree">
         </td>
-        <td width="300" class="talentheader">
-            <div id="treeheader2"><strong id="treeheadertext2"><span class="yellowFont">Feral</span><span class="stdText"> - 32 points</span></strong></div>
+        <td class="talentheader">
+            <div id="treeheader2">
+                <strong id="treeheadertext2">
+                    <span class="yellowFont">Feral</span>
+                    <span class="stdText"> - 32 points</span>
+                </strong>
+            </div>
             <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" id="treeheaderimg2" onmouseover="javascript:resetHoverOn('treeheaderimg2');" onmouseout="javascript:resetHoverOff('treeheaderimg2');" width="59" height="20" alt="Reset this tree">
         </td>
-        <td width="300" class="talentheader">
-            <div id="treeheader3"><strong id="treeheadertext3"><span class="yellowFont">Restoration</span><span class="stdText"> - 0 points</span></strong></div>
+        <td class="talentheader">
+            <div id="treeheader3">
+                <strong id="treeheadertext3">
+                    <span class="yellowFont">Restoration</span>
+                    <span class="stdText"> - 0 points</span>
+                </strong>
+            </div>
             <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" id="treeheaderimg3" onmouseover="javascript:resetHoverOn('treeheaderimg3');" onmouseout="javascript:resetHoverOff('treeheaderimg3');" width="59" height="20" alt="Reset this tree">
         </td>
     </tr>
     <tr>
-        <td class="outerbg" id="tree1" width="300" height="480" valign="top" style="background-image: url(http://www.wowprovider.com/img/talent/bg/normal/druidBalance.jpg); background-color: rgb(0, 0, 0); background-repeat: no-repeat;">
-            <div class="button" id="t1r1p1" style="left: 212px; right: -100px; top: 201px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/spell_nature_abolishmagic.png);">
+        <td class="outerbg" id="tree1" width="300" height="480" valign="top" style="background-image: url(./api.php?call=files&cat=skilltree&id=druidBalance.jpg); background-color: rgb(0, 0, 0); background-repeat: no-repeat;">  
+            <div class="button" id="t1r1p1" style="left: 15px; top: 7px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/spell_nature_abolishmagic.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r1p1i" style="background-position: -56px 0px; float: left;">
                 <div class="buttonnumber" id="t1r1p1c" style="color: rgb(46, 255, 0);">0/5</div>
-                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r1p1i" style="background-position: -56px 0px;">
             </div>
-          <div class="button" id="t1r1p2" style="left: 277px; right: -100px; top: 201px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/spell_nature_natureswrath.png);">
-            <div class="buttonnumber" id="t1r1p2c" style="color: rgb(46, 255, 0);">0/1</div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r1p2i" style="background-position: -56px 0px;"></div>
-          <div class="button" id="t1r1p3" style="left: 342px; right: -100px; top: 201px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_natureswrath.png);">
-            <div class="buttonnumber" id="t1r1p3c" style="color: rgb(46, 255, 0);"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r1p3i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t1r1p4" style="left: 407px; right: -100px; top: 201px; display: none;">
-            <div class="buttonnumber" id="t1r1p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r1p4i"></div>
-          <div class="button" id="t1r2p1" style="left: 212px; right: -100px; top: 266px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_stranglevines.png);">
-            <div class="buttonnumber" id="t1r2p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r2p1i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t1r2p2" style="left: 277px; right: -100px; top: 266px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_starfall.png);">
-            <div class="buttonnumber" id="t1r2p2c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r2p2i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t1r2p3" style="left: 342px; right: -100px; top: 266px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/inv_staff_01.png);">
-            <div class="buttonnumber" id="t1r2p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r2p3i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t1r2p4" style="left: 407px; right: -100px; top: 266px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_wispsplode.png);">
-            <div class="buttonnumber" id="t1r2p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r2p4i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t1r3p1" style="left: 212px; right: -100px; top: 331px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_thorns.png);">
-            <div class="buttonnumber" id="t1r3p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r3p1i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t1r3p2" style="left: 277px; right: -100px; top: 331px; display: none;">
-            <div class="buttonnumber" id="t1r3p2c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r3p2i"></div>
-          <div class="button" id="t1r3p3" style="left: 342px; right: -100px; top: 331px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_crystalball.png);">
-            <div class="buttonnumber" id="t1r3p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r3p3i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t1r3p4" style="left: 407px; right: -100px; top: 331px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_naturetouchgrow.png);">
-            <div class="buttonnumber" id="t1r3p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r3p4i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t1r4p1" style="left: 212px; right: -100px; top: 396px; display: none;">
-            <div class="buttonnumber" id="t1r4p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r4p1i"></div>
-          <div class="button" id="t1r4p2" style="left: 277px; right: -100px; top: 396px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_purge.png);">
-            <div class="buttonnumber" id="t1r4p2c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r4p2i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t1r4p3" style="left: 342px; right: -100px; top: 396px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_arcane_starfire.png);">
-            <div class="buttonnumber" id="t1r4p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r4p3i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t1r4p4" style="left: 407px; right: -100px; top: 396px; display: none;">
-            <div class="buttonnumber" id="t1r4p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r4p4i"></div>
-          <div class="button" id="t1r5p1" style="left: 212px; right: -100px; top: 461px; display: none;">
-            <div class="buttonnumber" id="t1r5p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r5p1i"></div>
-          <div class="button" id="t1r5p2" style="left: 277px; right: -100px; top: 461px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_naturesblessing.png);">
-            <div class="buttonnumber" id="t1r5p2c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r5p2i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t1r5p3" style="left: 342px; right: -100px; top: 461px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_sentinal.png);">
-            <div class="buttonnumber" id="t1r5p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r5p3i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t1r5p4" style="left: 407px; right: -100px; top: 461px; display: none;">
-            <div class="buttonnumber" id="t1r5p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r5p4i"></div>
-          <div class="button" id="t1r6p1" style="left: 212px; right: -100px; top: 526px; display: none;">
-            <div class="buttonnumber" id="t1r6p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r6p1i"></div>
-          <div class="button" id="t1r6p2" style="left: 277px; right: -100px; top: 526px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_moonglow.png);">
-            <div class="buttonnumber" id="t1r6p2c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r6p2i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t1r6p3" style="left: 342px; right: -100px; top: 526px; display: none;">
-            <div class="buttonnumber" id="t1r6p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r6p3i"></div>
-          <div class="button" id="t1r6p4" style="left: 407px; right: -100px; top: 526px; display: none;">
-            <div class="buttonnumber" id="t1r6p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r6p4i"></div>
-          <div class="button" id="t1r7p1" style="left: 212px; right: -100px; top: 591px; display: none;">
-            <div class="buttonnumber" id="t1r7p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r7p1i"></div>
-          <div class="button" id="t1r7p2" style="left: 277px; right: -100px; top: 591px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_forceofnature.png);">
-            <div class="buttonnumber" id="t1r7p2c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r7p2i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t1r7p3" style="left: 342px; right: -100px; top: 591px; display: none;">
-            <div class="buttonnumber" id="t1r7p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r7p3i"></div>
-          <div class="button" id="t1r7p4" style="left: 407px; right: -100px; top: 591px; display: none;">
-            <div class="buttonnumber" id="t1r7p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r7p4i"></div>
-          <div class="button" id="t1r8p1" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t1r8p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r8p1i"></div>
-          <div class="button" id="t1r8p2" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t1r8p2c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r8p2i"></div>
-          <div class="button" id="t1r8p3" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t1r8p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r8p3i"></div>
-          <div class="button" id="t1r8p4" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t1r8p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r8p4i"></div>
-          <div class="button" id="t1r9p1" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t1r9p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r9p1i"></div>
-          <div class="button" id="t1r9p2" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t1r9p2c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r9p2i"></div>
-          <div class="button" id="t1r9p3" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t1r9p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r9p3i"></div>
-          <div class="button" id="t1r9p4" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t1r9p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r9p4i"></div>
-          <div class="button" id="t1r10p1" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t1r10p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r10p1i"></div>
-          <div class="button" id="t1r10p2" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t1r10p2c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r10p2i"></div>
-          <div class="button" id="t1r10p3" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t1r10p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r10p3i"></div>
-          <div class="button" id="t1r10p4" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t1r10p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r10p4i"></div>
-          <div class="button" id="t1r11p1" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t1r11p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r11p1i"></div>
-          <div class="button" id="t1r11p2" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t1r11p2c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r11p2i"></div>
-          <div class="button" id="t1r11p3" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t1r11p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r11p3i"></div>
-          <div class="button" id="t1r11p4" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t1r11p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r11p4i"></div><div class="arrowd" style="left: 360px; top: 313px; height: 22px; width: 15px;" id="arrowd133"></div><div class="arrowd" style="left: 295px; top: 508px; height: 22px; width: 15px;" id="arrowd162"></div><div class="arrowd" style="left: 295px; top: 313px; height: 87px; width: 15px;" id="arrowd142"></div><div id="arrowr113" class="arrowr" style="left: 324px; top: 221px; height: 15px; width: 25px;"></div>
+            <div class="button" id="t1r1p2" style="left: 25px; top: 7px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/spell_nature_natureswrath.png);">                
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r1p2i" style="background-position: -56px 0px;">
+                <div class="buttonnumber" id="t1r1p2c" style="color: rgb(46, 255, 0);">0/1</div>
+            </div>
+            <div id="arrowr113" class="arrowr" style="left: 15px; top: 25px; height: 15px; width: 25px;"></div>
+            <div class="button" id="t1r1p3" style="left: 11px; top: 7px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_natureswrath.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r1p3i" style="background-position: 0px 0px;">
+                <div class="buttonnumber" id="t1r1p3c" style="color: rgb(46, 255, 0);"></div>
+            </div>
+            
+            <div class="treerowspacer"></div>
+            
+            <div class="button" id="t1r2p1" style="left: 15px; top: 20px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_stranglevines.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r2p1i" style="background-position: 0px 0px;">
+                <div class="buttonnumber" id="t1r2p1c"></div>
+            </div>
+            <div class="button" id="t1r2p2" style="left: 25px; top: 20px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_starfall.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r2p2i" style="background-position: 0px 0px;">
+                <div class="buttonnumber" id="t1r2p2c"></div>
+            </div>
+            <div class="button" id="t1r2p3" style="left: 35px; top: 20px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/inv_staff_01.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r2p3i" style="background-position: 0px 0px;">
+                <div class="buttonnumber" id="t1r2p3c"></div>
+            </div>
+            <div class="button" id="t1r2p4" style="left: 45px; top: 20px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_wispsplode.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r2p4i" style="background-position: 0px 0px;">
+                <div class="buttonnumber" id="t1r2p4c"></div>
+            </div>
+            
+            <div class="treerowspacer"></div>
+            
+            <div class="button" id="t1r3p1" style="left: 15px; top: 35px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_thorns.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r3p1i" style="background-position: 0px 0px;">
+                <div class="buttonnumber" id="t1r3p1c"></div>
+            </div>
+            
+            <div class="arrowd" style="left: 42px; top: 14px; height: 87px; width: 15px;" id="arrowd142"></div>
+            
+            <div class="button" id="t1r3p2" style="left: 10px; top: 35px; visibility:hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r3p2i">
+                <div class="buttonnumber" id="t1r3p2c"></div>
+            </div>
+            
+            <div class="arrowd" style="left: 38px; top: 14px; height: 22px; width: 15px;" id="arrowd133"></div>
+            
+            <div class="button" id="t1r3p3" style="left: 6px; top: 35px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_crystalball.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r3p3i" style="background-position: 0px 0px;">
+                <div class="buttonnumber" id="t1r3p3c"></div>
+            </div>
+            <div class="button" id="t1r3p4" style="left: 16px; top: 35px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_naturetouchgrow.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r3p4i" style="background-position: 0px 0px;">
+                <div class="buttonnumber" id="t1r3p4c"></div>
+            </div>
+            
+            <div class="treerowspacer"></div>
+            
+            <div class="button" id="t1r4p1" style="left: 15px; top: 12px; visibility:hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r4p1i">
+                <div class="buttonnumber" id="t1r4p1c"></div>
+            </div>
+            <div class="button" id="t1r4p2" style="left: 25px; top: 12px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_purge.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r4p2i" style="background-position: 0px 0px;">
+                <div class="buttonnumber" id="t1r4p2c"></div>
+            </div>
+            <div class="button" id="t1r4p3" style="left: 35px; top: 12px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_arcane_starfire.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r4p3i" style="background-position: 0px 0px;">
+                <div class="buttonnumber" id="t1r4p3c"></div>
+            </div>
+            <div class="button" id="t1r4p4" style="left: 35px; top: 12px; visibility:hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r4p4i">
+                <div class="buttonnumber" id="t1r4p4c"></div>
+            </div>
+            
+            <div class="treerowspacer"></div>
+
+            <div class="button" id="t1r5p1" style="left: 15px; top: 25px; visibility:hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r5p1i">
+                <div class="buttonnumber" id="t1r5p1c"></div>
+            </div> 
+            <div class="button" id="t1r5p2" style="left: 25px; top: 25px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_naturesblessing.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r5p2i" style="background-position: 0px 0px;">
+                <div class="buttonnumber" id="t1r5p2c"></div>
+            </div>
+            <div class="button" id="t1r5p3" style="left: 35px; top: 25px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_sentinal.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r5p3i" style="background-position: 0px 0px;">
+                <div class="buttonnumber" id="t1r5p3c"></div>
+            </div>
+            <div class="button" id="t1r5p4" style="left: 45px; top: 25px; visibility:hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r5p4i">
+                <div class="buttonnumber" id="t1r5p4c"></div>
+            </div>
+            
+            <div class="treerowspacer"></div>
+          
+            <div class="button" id="t1r6p1" style="left: 15px; top: 35px; visibility:hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r6p1i">
+                <div class="buttonnumber" id="t1r6p1c"></div>
+            </div>
+            
+            <div class="arrowd" style="left: 42px; top: 19px; height: 22px; width: 15px;" id="arrowd162"></div>
+            
+            <div class="button" id="t1r6p2" style="left: 11px; top: 35px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_moonglow.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r6p2i" style="background-position: 0px 0px;">
+                <div class="buttonnumber" id="t1r6p2c"></div>
+            </div>
+            <div class="button" id="t1r6p3" style="left: 35px; top: 35px; visibility:hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r6p3i">
+                <div class="buttonnumber" id="t1r6p3c"></div>
+            </div>
+            <div class="button" id="t1r6p4" style="left: 45px; top: 35px; visibility:hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r6p4i">
+                <div class="buttonnumber" id="t1r6p4c"></div>
+            </div>
+            
+            <div class="treerowspacer"></div>
+            
+            <div class="button" id="t1r7p1" style="left: 15px; top: 45px; visibility:hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r7p1i">
+                <div class="buttonnumber" id="t1r7p1c"></div>
+            </div>
+            <div class="button" id="t1r7p2" style="left: 25px; top: 45px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_forceofnature.png);">                
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r7p2i" style="background-position: 0px 0px;">
+                <div class="buttonnumber" id="t1r7p2c"></div>
+            </div>
+            <div class="button" id="t1r7p3" style="left: 35px; top: 45px; visibility:hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r7p3i">
+                <div class="buttonnumber" id="t1r7p3c"></div>
+            </div>
+            <div class="button" id="t1r7p4" style="left: 45px; top: 45px; visibility:hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t1r7p4i">
+                <div class="buttonnumber" id="t1r7p4c"></div>
+            </div>
         </td>
-        <td class="outerbg" id="tree2" width="300" height="480" valign="top" style="background-image: url(http://www.wowprovider.com/img/talent/bg/normal/druidFeral.jpg); background-color: rgb(0, 0, 0);"><div class="button" id="t2r1p1" style="left: 512px; right: -100px; top: 201px; display: none;">
-            <div class="buttonnumber" id="t2r1p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r1p1i"></div>
-          <div class="button" id="t2r1p2" style="left: 577px; right: -100px; top: 201px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/ability_hunter_pet_hyena.png);">
-            <div class="buttonnumber" id="t2r1p2c" style="color: rgb(255, 209, 0);">5/5</div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r1p2i" style="background-position: -224px 0px;"></div>
-          <div class="button" id="t2r1p3" style="left: 642px; right: -100px; top: 201px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/ability_druid_demoralizingroar.png);">
-            <div class="buttonnumber" id="t2r1p3c" style="color: rgb(46, 255, 0);">0/5</div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r1p3i" style="background-position: -56px 0px;"></div>
-          <div class="button" id="t2r1p4" style="left: 707px; right: -100px; top: 201px; display: none;">
-            <div class="buttonnumber" id="t2r1p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r1p4i"></div>
-          <div class="button" id="t2r2p1" style="left: 512px; right: -100px; top: 266px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/ability_ambush.png);">
-            <div class="buttonnumber" id="t2r2p1c" style="color: rgb(46, 255, 0);">0/5</div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r2p1i" style="background-position: -56px 0px;"></div>
-          <div class="button" id="t2r2p2" style="left: 577px; right: -100px; top: 266px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/ability_druid_bash.png);">
-            <div class="buttonnumber" id="t2r2p2c" style="color: rgb(46, 255, 0);">0/2</div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r2p2i" style="background-position: -56px 0px;"></div>
-          <div class="button" id="t2r2p3" style="left: 642px; right: -100px; top: 266px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/inv_misc_pelt_bear_03.png);">
-            <div class="buttonnumber" id="t2r2p3c" style="color: rgb(255, 209, 0);">5/5</div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r2p3i" style="background-position: -224px 0px;"></div>
-          <div class="button" id="t2r2p4" style="left: 707px; right: -100px; top: 266px; display: none;">
-            <div class="buttonnumber" id="t2r2p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r2p4i"></div>
-          <div class="button" id="t2r3p1" style="left: 512px; right: -100px; top: 331px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/spell_nature_spiritwolf.png);">
-            <div class="buttonnumber" id="t2r3p1c" style="color: rgb(255, 209, 0);">2/2</div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r3p1i" style="background-position: -224px 0px;"></div>
-          <div class="button" id="t2r3p2" style="left: 577px; right: -100px; top: 331px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/ability_hunter_pet_bear.png);">
-            <div class="buttonnumber" id="t2r3p2c" style="color: rgb(255, 209, 0);">1/1</div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r3p2i" style="background-position: -224px 0px;"></div>
-          <div class="button" id="t2r3p3" style="left: 642px; right: -100px; top: 331px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/inv_misc_monsterclaw_04.png);">
-            <div class="buttonnumber" id="t2r3p3c" style="color: rgb(255, 209, 0);">3/3</div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r3p3i" style="background-position: -224px 0px;"></div>
-          <div class="button" id="t2r3p4" style="left: 707px; right: -100px; top: 331px; display: none;">
-            <div class="buttonnumber" id="t2r3p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r3p4i"></div>
-          <div class="button" id="t2r4p1" style="left: 512px; right: -100px; top: 396px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/spell_shadow_vampiricaura.png);">
-            <div class="buttonnumber" id="t2r4p1c" style="color: rgb(46, 255, 0);">0/2</div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r4p1i" style="background-position: -56px 0px;"></div>
-          <div class="button" id="t2r4p2" style="left: 577px; right: -100px; top: 396px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/ability_hunter_pet_cat.png);">
-            <div class="buttonnumber" id="t2r4p2c" style="color: rgb(255, 209, 0);">3/3</div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r4p2i" style="background-position: -224px 0px;"></div>
-          <div class="button" id="t2r4p3" style="left: 642px; right: -100px; top: 396px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/ability_ghoulfrenzy.png);">
-            <div class="buttonnumber" id="t2r4p3c" style="color: rgb(255, 209, 0);">2/2</div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r4p3i" style="background-position: -224px 0px;"></div>
-          <div class="button" id="t2r4p4" style="left: 707px; right: -100px; top: 396px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/ability_racial_cannibalize.png);">
-            <div class="buttonnumber" id="t2r4p4c" style="color: rgb(255, 209, 0);">2/2</div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r4p4i" style="background-position: -224px 0px;"></div>
-          <div class="button" id="t2r5p1" style="left: 512px; right: -100px; top: 461px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/ability_druid_ravage.png);">
-            <div class="buttonnumber" id="t2r5p1c" style="color: rgb(255, 209, 0);">2/2</div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r5p1i" style="background-position: -224px 0px;"></div>
-          <div class="button" id="t2r5p2" style="left: 577px; right: -100px; top: 461px; display: none;">
-            <div class="buttonnumber" id="t2r5p2c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r5p2i"></div>
-          <div class="button" id="t2r5p3" style="left: 642px; right: -100px; top: 461px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/spell_nature_faeriefire.png);">
-            <div class="buttonnumber" id="t2r5p3c" style="color: rgb(255, 209, 0);">1/1</div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r5p3i" style="background-position: -224px 0px;"></div>
-          <div class="button" id="t2r5p4" style="left: 707px; right: -100px; top: 461px; display: none;">
-            <div class="buttonnumber" id="t2r5p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r5p4i"></div>
-          <div class="button" id="t2r6p1" style="left: 512px; right: -100px; top: 526px; display: none;">
-            <div class="buttonnumber" id="t2r6p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r6p1i"></div>
-          <div class="button" id="t2r6p2" style="left: 577px; right: -100px; top: 526px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/spell_holy_blessingofagility.png);">
-            <div class="buttonnumber" id="t2r6p2c" style="color: rgb(255, 209, 0);">5/5</div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r6p2i" style="background-position: -224px 0px;"></div>
-          <div class="button" id="t2r6p3" style="left: 642px; right: -100px; top: 526px; display: none;">
-            <div class="buttonnumber" id="t2r6p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r6p3i"></div>
-          <div class="button" id="t2r6p4" style="left: 707px; right: -100px; top: 526px; display: none;">
-            <div class="buttonnumber" id="t2r6p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r6p4i"></div>
-          <div class="button" id="t2r7p1" style="left: 512px; right: -100px; top: 591px; display: none;">
-            <div class="buttonnumber" id="t2r7p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r7p1i"></div>
-          <div class="button" id="t2r7p2" style="left: 577px; right: -100px; top: 591px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/spell_nature_unyeildingstamina.png);">
-            <div class="buttonnumber" id="t2r7p2c" style="color: rgb(255, 209, 0);">1/1</div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r7p2i" style="background-position: -224px 0px;"></div>
-          <div class="button" id="t2r7p3" style="left: 642px; right: -100px; top: 591px; display: none;">
-            <div class="buttonnumber" id="t2r7p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r7p3i"></div>
-          <div class="button" id="t2r7p4" style="left: 707px; right: -100px; top: 591px; display: none;">
-            <div class="buttonnumber" id="t2r7p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r7p4i"></div>
-          <div class="button" id="t2r8p1" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t2r8p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r8p1i"></div>
-          <div class="button" id="t2r8p2" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t2r8p2c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r8p2i"></div>
-          <div class="button" id="t2r8p3" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t2r8p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r8p3i"></div>
-          <div class="button" id="t2r8p4" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t2r8p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r8p4i"></div>
-          <div class="button" id="t2r9p1" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t2r9p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r9p1i"></div>
-          <div class="button" id="t2r9p2" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t2r9p2c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r9p2i"></div>
-          <div class="button" id="t2r9p3" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t2r9p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r9p3i"></div>
-          <div class="button" id="t2r9p4" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t2r9p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r9p4i"></div>
-          <div class="button" id="t2r10p1" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t2r10p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r10p1i"></div>
-          <div class="button" id="t2r10p2" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t2r10p2c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r10p2i"></div>
-          <div class="button" id="t2r10p3" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t2r10p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r10p3i"></div>
-          <div class="button" id="t2r10p4" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t2r10p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r10p4i"></div>
-          <div class="button" id="t2r11p1" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t2r11p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r11p1i"></div>
-          <div class="button" id="t2r11p2" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t2r11p2c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r11p2i"></div>
-          <div class="button" id="t2r11p3" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t2r11p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r11p3i"></div>
-          <div class="button" id="t2r11p4" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t2r11p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r11p4i"></div><div class="arrowd_yellow" style="left: 660px; top: 378px; height: 22px; width: 15px;" id="arrowd243"></div><div id="arrowrd244" class="arrowrd_yellow" style="left: 689px; top: 351px; height: 15px; width: 51px;"></div><div class="arrowd_yellow" style="left: 725px; top: 366px; height: 35px; width: 15px;" id="arrowd244"></div><div class="arrowd_yellow" style="left: 595px; top: 443px; height: 87px; width: 15px;" id="arrowd262"></div></td>
-        <td class="outerbg" id="tree3" width="300" height="480" valign="top" style="background-image: url(http://www.wowprovider.com/img/talent/bg/normal/druidRestoration.jpg); background-color: rgb(0, 0, 0);"><div class="button" id="t3r1p1" style="left: 812px; right: -100px; top: 201px; display: none;">
-            <div class="buttonnumber" id="t3r1p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r1p1i"></div>
-          <div class="button" id="t3r1p2" style="left: 877px; right: -100px; top: 201px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/spell_nature_regeneration.png);">
-            <div class="buttonnumber" id="t3r1p2c" style="color: rgb(46, 255, 0);">0/5</div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r1p2i" style="background-position: -56px 0px;"></div>
-          <div class="button" id="t3r1p3" style="left: 942px; right: -100px; top: 201px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/spell_holy_blessingofstamina.png);">
-            <div class="buttonnumber" id="t3r1p3c" style="color: rgb(46, 255, 0);">0/5</div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r1p3i" style="background-position: -56px 0px;"></div>
-          <div class="button" id="t3r1p4" style="left: 1007px; right: -100px; top: 201px; display: none;">
-            <div class="buttonnumber" id="t3r1p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r1p4i"></div>
-          <div class="button" id="t3r2p1" style="left: 812px; right: -100px; top: 266px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_healingtouch.png);">
-            <div class="buttonnumber" id="t3r2p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r2p1i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t3r2p2" style="left: 877px; right: -100px; top: 266px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_healingwavegreater.png);">
-            <div class="buttonnumber" id="t3r2p2c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r2p2i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t3r2p3" style="left: 942px; right: -100px; top: 266px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/ability_druid_enrage.png);">
-            <div class="buttonnumber" id="t3r2p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r2p3i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t3r2p4" style="left: 1007px; right: -100px; top: 266px; display: none;">
-            <div class="buttonnumber" id="t3r2p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r2p4i"></div>
-          <div class="button" id="t3r3p1" style="left: 812px; right: -100px; top: 331px; display: none;">
-            <div class="buttonnumber" id="t3r3p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r3p1i"></div>
-          <div class="button" id="t3r3p2" style="left: 877px; right: -100px; top: 331px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_frost_windwalkon.png);">
-            <div class="buttonnumber" id="t3r3p2c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r3p2i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t3r3p3" style="left: 942px; right: -100px; top: 331px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_insectswarm.png);">
-            <div class="buttonnumber" id="t3r3p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r3p3i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t3r3p4" style="left: 1007px; right: -100px; top: 331px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/ability_eyeoftheowl.png);">
-            <div class="buttonnumber" id="t3r3p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r3p4i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t3r4p1" style="left: 812px; right: -100px; top: 396px; display: none;">
-            <div class="buttonnumber" id="t3r4p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r4p1i"></div>
-          <div class="button" id="t3r4p2" style="left: 877px; right: -100px; top: 396px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_holy_elunesgrace.png);">
-            <div class="buttonnumber" id="t3r4p2c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r4p2i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t3r4p3" style="left: 942px; right: -100px; top: 396px; display: none;">
-            <div class="buttonnumber" id="t3r4p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r4p3i"></div>
-          <div class="button" id="t3r4p4" style="left: 1007px; right: -100px; top: 396px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_rejuvenation.png);">
-            <div class="buttonnumber" id="t3r4p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r4p4i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t3r5p1" style="left: 812px; right: -100px; top: 461px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_ravenform.png);">
-            <div class="buttonnumber" id="t3r5p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r5p1i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t3r5p2" style="left: 877px; right: -100px; top: 461px; display: none;">
-            <div class="buttonnumber" id="t3r5p2c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r5p2i"></div>
-          <div class="button" id="t3r5p3" style="left: 942px; right: -100px; top: 461px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_protectionformnature.png);">
-            <div class="buttonnumber" id="t3r5p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r5p3i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t3r5p4" style="left: 1007px; right: -100px; top: 461px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_tranquility.png);">
-            <div class="buttonnumber" id="t3r5p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r5p4i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t3r6p1" style="left: 812px; right: -100px; top: 526px; display: none;">
-            <div class="buttonnumber" id="t3r6p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r6p1i"></div>
-          <div class="button" id="t3r6p2" style="left: 877px; right: -100px; top: 526px; display: none;">
-            <div class="buttonnumber" id="t3r6p2c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r6p2i"></div>
-          <div class="button" id="t3r6p3" style="left: 942px; right: -100px; top: 526px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_resistnature.png);">
-            <div class="buttonnumber" id="t3r6p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r6p3i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t3r6p4" style="left: 1007px; right: -100px; top: 526px; display: none;">
-            <div class="buttonnumber" id="t3r6p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r6p4i"></div>
-          <div class="button" id="t3r7p1" style="left: 812px; right: -100px; top: 591px; display: none;">
-            <div class="buttonnumber" id="t3r7p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r7p1i"></div>
-          <div class="button" id="t3r7p2" style="left: 877px; right: -100px; top: 591px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/inv_relics_idolofrejuvenation.png);">
+        <td class="outerbg" id="tree2" width="300" height="480" valign="top" style="background-image: url(./api.php?call=files&cat=skilltree&id=druidFeral.jpg); background-color: rgb(0, 0, 0); background-repeat: no-repeat;">
+            <div class="button" id="t2r1p1" style="left: 15px; top: 7px; visibility: hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r1p1i">
+                <div class="buttonnumber" id="t2r1p1c"></div>
+            </div>
+            <div class="button" id="t2r1p2" style="left: 25px; top: 7px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/ability_hunter_pet_hyena.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r1p2i" style="background-position: -224px 0px;">
+                <div class="buttonnumber" id="t2r1p2c" style="color: rgb(255, 209, 0);">5/5</div>
+            </div>
+            <div class="button" id="t2r1p3" style="left: 35px; top: 7px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/ability_druid_demoralizingroar.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r1p3i" style="background-position: -56px 0px;">
+                <div class="buttonnumber" id="t2r1p3c" style="color: rgb(46, 255, 0);">0/5</div>
+            </div>
+            <div class="button" id="t2r1p4" style="left: 45px; top: 7px; visibility: hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r1p4i">
+                <div class="buttonnumber" id="t2r1p4c"></div>
+            </div>
+            
+            <div class="treerowspacer"></div>
+          
+            <div class="button" id="t2r2p1" style="left: 15px; top: 21px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/ability_ambush.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r2p1i" style="background-position: -56px 0px;">
+                <div class="buttonnumber" id="t2r2p1c" style="color: rgb(46, 255, 0);">0/5</div>
+            </div>
+            <div class="button" id="t2r2p2" style="left: 25px; top: 21px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/ability_druid_bash.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r2p2i" style="background-position: -56px 0px;">
+                <div class="buttonnumber" id="t2r2p2c" style="color: rgb(46, 255, 0);">0/2</div>
+            </div>
+            <div class="button" id="t2r2p3" style="left: 35px; top: 21px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/inv_misc_pelt_bear_03.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r2p3i" style="background-position: -224px 0px;">
+                <div class="buttonnumber" id="t2r2p3c" style="color: rgb(255, 209, 0);">5/5</div>
+            </div>
+            <div class="button" id="t2r2p4" style="left: 45px; top: 21px; visibility: hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r2p4i">
+                <div class="buttonnumber" id="t2r2p4c"></div>
+            </div>
+            
+            <div class="treerowspacer"></div>
+            
+            <div class="button" id="t2r3p1" style="left: 15px; top: 35px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/spell_nature_spiritwolf.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r3p1i" style="background-position: -224px 0px;">
+                <div class="buttonnumber" id="t2r3p1c" style="color: rgb(255, 209, 0);">2/2</div>
+            </div>
+            <div class="button" id="t2r3p2" style="left: 25px; top: 35px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/ability_hunter_pet_bear.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r3p2i" style="background-position: -224px 0px;">
+                <div class="buttonnumber" id="t2r3p2c" style="color: rgb(255, 209, 0);">1/1</div>
+            </div>
+            <div class="button" id="t2r3p3" style="left: 35px; top: 35px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/inv_misc_monsterclaw_04.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r3p3i" style="background-position: -224px 0px;">
+                <div class="buttonnumber" id="t2r3p3c" style="color: rgb(255, 209, 0);">3/3</div>
+            </div>
+            
+            <div id="arrowrd244" class="arrowrd_yellow" style="left: 25px; top: 53px; height: 15px; width: 51px; display: block;"></div>
+            
+            <div class="button" id="t2r3p4" style="left: 43px; top: 35px; visibility: hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r3p4i">
+                <div class="buttonnumber" id="t2r3p4c"></div>
+            </div>
+            
+            <div class="treerowspacer"></div>
+            
+            <div class="button" id="t2r4p1" style="left: 15px; top: 45px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/spell_shadow_vampiricaura.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r4p1i" style="background-position: -56px 0px;">
+                <div class="buttonnumber" id="t2r4p1c" style="color: rgb(46, 255, 0);">0/2</div>
+            </div>
+            
+            <div class="arrowd_yellow" style="left: 42px; top: 30px; height: 22px; width: 15px;" id="arrowd243"></div>
+            
+            <div class="button" id="t2r4p2" style="left: 11px; top: 45px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/ability_hunter_pet_cat.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r4p2i" style="background-position: -224px 0px;">
+                <div class="buttonnumber" id="t2r4p2c" style="color: rgb(255, 209, 0);">3/3</div>
+            </div>
+            <div class="button" id="t2r4p3" style="left: 20px; top: 45px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/ability_ghoulfrenzy.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r4p3i" style="background-position: -224px 0px;">
+                <div class="buttonnumber" id="t2r4p3c" style="color: rgb(255, 209, 0);">2/2</div>
+            </div>
+            
+            <div class="arrowd_yellow" style="left: 46px; top: 14px; height: 35px; width: 15px;" id="arrowd244"></div>
+            
+            <div class="button" id="t2r4p4" style="left: 12px; top: 45px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/ability_racial_cannibalize.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r4p4i" style="background-position: -224px 0px;">
+                <div class="buttonnumber" id="t2r4p4c" style="color: rgb(255, 209, 0);">2/2</div>
+            </div>
+            
+            <div class="treerowspacer"></div>
+            
+            <div class="button" id="t2r5p1" style="left: 15px; top: 55px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/ability_druid_ravage.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r5p1i" style="background-position: -224px 0px;">
+                <div class="buttonnumber" id="t2r5p1c" style="color: rgb(255, 209, 0);">2/2</div>
+            </div>
+            <div class="button" id="t2r5p2" style="left: 25px; top: 55px; visibility: hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r5p2i">
+                <div class="buttonnumber" id="t2r5p2c"></div>
+            </div>
+            <div class="button" id="t2r5p3" style="left: 35px; top: 55px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/spell_nature_faeriefire.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r5p3i" style="background-position: -224px 0px;">
+                <div class="buttonnumber" id="t2r5p3c" style="color: rgb(255, 209, 0);">1/1</div>
+            </div>
+            <div class="button" id="t2r5p4" style="left: 45px; top: 55px; visibility: hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r5p4i">
+                <div class="buttonnumber" id="t2r5p4c"></div>
+            </div>
+            
+            <div class="treerowspacer"></div>
+            
+            <div class="button" id="t2r6p1" style="left: 15px; top: 65px; visibility: hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r6p1i">
+                <div class="buttonnumber" id="t2r6p1c"></div>
+            </div>
+            
+            <div class="arrowd_yellow" style="left: 12px; top: 21px; width: 15px;" id="arrowd262"></div>
+            
+            <div class="button" id="t2r6p2" style="left: 25px; top: 65px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/spell_holy_blessingofagility.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r6p2i" style="background-position: -224px 0px;">
+                <div class="buttonnumber" id="t2r6p2c" style="color: rgb(255, 209, 0);">5/5</div>
+            </div>
+            <div class="button" id="t2r6p3" style="left: 35px; top: 65px; visibility: hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r6p3i">
+                <div class="buttonnumber" id="t2r6p3c"></div>
+            </div>
+            <div class="button" id="t2r6p4" style="left: 45px; top: 65px; visibility: hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r6p4i">
+                <div class="buttonnumber" id="t2r6p4c"></div>
+            </div>
+            
+            <div class="treerowspacer"></div>
+            
+            <div class="button" id="t2r7p1" style="left: 15px; top: 75px; visibility: hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r7p1i">
+                <div class="buttonnumber" id="t2r7p1c"></div>
+            </div>
+            <div class="button" id="t2r7p2" style="left: 25px; top: 75px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/spell_nature_unyeildingstamina.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r7p2i" style="background-position: -224px 0px;">
+                <div class="buttonnumber" id="t2r7p2c" style="color: rgb(255, 209, 0);">1/1</div>
+            </div>
+            <div class="button" id="t2r7p3" style="left: 25px; top: 75px; visibility: hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r7p3i">
+                <div class="buttonnumber" id="t2r7p3c"></div>
+            </div>
+            <div class="button" id="t2r7p4" style="left: 25px; top: 75px; visibility: hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t2r7p4i">
+                <div class="buttonnumber" id="t2r7p4c"></div>
+            </div>
+        </td>
+        <td class="outerbg" id="tree3" width="300" height="480" valign="top" style="background-image: url(./api.php?call=files&cat=skilltree&id=druidRestoration.jpg); background-color: rgb(0, 0, 0); background-repeat: no-repeat;">
+            <div class="button" id="t3r1p1" style="left: 15px; top: 7px; visibility: hidden;">
+                <div class="buttonnumber" id="t3r1p1c"></div>
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r1p1i">
+            </div>
+            <div class="button" id="t3r1p2" style="left: 25px; top: 7px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/spell_nature_regeneration.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r1p2i" style="background-position: -56px 0px;">
+                <div class="buttonnumber" id="t3r1p2c" style="color: rgb(46, 255, 0);">0/5</div>
+            </div>
+            <div class="button" id="t3r1p3" style="left: 35px; top: 7px; opacity: 1; background-image: url(http://www.wowprovider.com/img/Spells/spell_holy_blessingofstamina.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r1p3i" style="background-position: -56px 0px;">
+                <div class="buttonnumber" id="t3r1p3c" style="color: rgb(46, 255, 0);">0/5</div>
+            </div>
+            <div class="button" id="t3r1p4" style="left: 45px; top: 7px; visibility: hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r1p4i">
+                <div class="buttonnumber" id="t3r1p4c"></div>
+            </div>
+            
+            <div class="treerowspacer"></div>
+            
+            <div class="button" id="t3r2p1" style="left: 15px; top: 25px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_healingtouch.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r2p1i" style="background-position: 0px 0px;">
+                <div class="buttonnumber" id="t3r2p1c"></div>
+            </div>
+            <div class="button" id="t3r2p2" style="left: 25px; top: 25px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_healingwavegreater.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r2p2i" style="background-position: 0px 0px;">
+                <div class="buttonnumber" id="t3r2p2c"></div>
+            </div>
+            <div class="button" id="t3r2p3" style="left: 35px; top: 25px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/ability_druid_enrage.png);">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r2p3i" style="background-position: 0px 0px;">
+                <div class="buttonnumber" id="t3r2p3c"></div>
+            </div>
+            <div class="button" id="t3r2p4" style="left: 45px; top: 25px; visibility: hidden;">
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r2p4i">
+                <div class="buttonnumber" id="t3r2p4c"></div>
+            </div>
+            
+            <div class="treerowspacer"></div>
+          
+            <div class="arrowd" style="left: 30px; top: 20px; height: 145px; width: 15px;" id="arrowd372"></div>
+          
+            <div class="button" id="t3r3p1" style="left: 0px; top: 35px; visibility: hidden;">
+                <div class="buttonnumber" id="t3r3p1c"></div>
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r3p1i">
+            </div>
+            <div class="button" id="t3r3p2" style="left: 10px; top: 35px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_frost_windwalkon.png);">
+                <div class="buttonnumber" id="t3r3p2c"></div>
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r3p2i" style="background-position: 0px 0px;">
+            </div>
+            <div class="button" id="t3r3p3" style="left: 20px; top: 35px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_insectswarm.png);">
+                <div class="buttonnumber" id="t3r3p3c"></div>
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r3p3i" style="background-position: 0px 0px;">
+            </div>
+            <div class="button" id="t3r3p4" style="left: 30px; top: 35px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/ability_eyeoftheowl.png);">
+                <div class="buttonnumber" id="t3r3p4c"></div>
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r3p4i" style="background-position: 0px 0px;">
+            </div>
+          
+            <!--<div class="treerowspacer"></div>-->
+          
+            <div class="button" id="t3r4p1" style="left: 0px; top: 45px; visibility: hidden;">
+                <div class="buttonnumber" id="t3r4p1c"></div>
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r4p1i">
+            </div>
+            <div class="button" id="t3r4p2" style="left: 10px; top: 45px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_holy_elunesgrace.png);">
+                <div class="buttonnumber" id="t3r4p2c"></div>
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r4p2i" style="background-position: 0px 0px;">
+            </div>
+            
+            <div class="arrowd" style="left: 35px; top: 30px; height: 87px; width: 15px;" id="arrowd353"></div>
+            
+            <div class="button" id="t3r4p3" style="left: 20px; top: 45px; visibility: hidden;">
+                <div class="buttonnumber" id="t3r4p3c"></div>
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r4p3i">
+            </div>
+            <div class="button" id="t3r4p4" style="left: 14px; top: 45px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_rejuvenation.png);">
+                <div class="buttonnumber" id="t3r4p4c"></div>
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r4p4i" style="background-position: 0px 0px;">
+            </div>
+            
+            <div class="treerowspacer"></div>
+            
+            <div class="button" id="t3r5p1" style="left: 15px; top: 18px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_ravenform.png);">
+                <div class="buttonnumber" id="t3r5p1c"></div>
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r5p1i" style="background-position: 0px 0px;">
+            </div>
+            
+            <div class="arrowd" style="left: 40px; top: 3px; height: 152px; width: 15px;" id="arrowd351"></div>
+            
+            <div class="button" id="t3r5p2" style="left: 12px; top: 18px; visibility: hidden;">
+                <div class="buttonnumber" id="t3r5p2c"></div>
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r5p2i">
+            </div>
+            
+            <div class="button" id="t3r5p3" style="left: 20px; top: 18px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_protectionformnature.png);">
+                <div class="buttonnumber" id="t3r5p3c"></div>
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r5p3i" style="background-position: 0px 0px;">
+            </div>
+            <div class="button" id="t3r5p4" style="left: 29px; top: 18px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_tranquility.png);">
+                <div class="buttonnumber" id="t3r5p4c"></div>
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r5p4i" style="background-position: 0px 0px;">
+            </div>
+          
+            <!--<div class="treerowspacer"></div>-->
+          
+            <!--<div class="button" id="t3r6p1" style="left: 12px; top: 21px; visibility: hidden;">
+                <div class="buttonnumber" id="t3r6p1c"></div>
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r6p1i">
+            </div>-->
+            <div class="button" id="t3r6p2" style="left: 12px; top: 21px; visibility: hidden;">
+                <div class="buttonnumber" id="t3r6p2c"></div>
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r6p2i">
+            </div>
+            <div class="button" id="t3r6p3" style="left: 20px; top: 28px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/spell_nature_resistnature.png);">
+                <div class="buttonnumber" id="t3r6p3c"></div>
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r6p3i" style="background-position: 0px 0px;">
+            </div>
+            <div class="button" id="t3r6p4" style="left: 12px; top: 21px; visibility: hidden;">
+                <div class="buttonnumber" id="t3r6p4c"></div>
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r6p4i">
+            </div>
+            
+            <div class="treerowspacer"></div>
+            
+            <div class="button" id="t3r7p1" style="left: 12px; top: 21px; visibility: hidden;">
+                <div class="buttonnumber" id="t3r7p1c"></div>
+                <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r7p1i">
+            </div>
+            <div class="button" id="t3r7p2" style="left: 25px; top: 0px; opacity: 1; background-image: url(http://www.wowprovider.com/img/SpellsGrey/inv_relics_idolofrejuvenation.png);">
             <div class="buttonnumber" id="t3r7p2c"></div>
             <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r7p2i" style="background-position: 0px 0px;"></div>
-          <div class="button" id="t3r7p3" style="left: 942px; right: -100px; top: 591px; display: none;">
+          <div class="button" id="t3r7p3" style="left: 12px; top: 21px; visibility: hidden;">
             <div class="buttonnumber" id="t3r7p3c"></div>
             <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r7p3i"></div>
-          <div class="button" id="t3r7p4" style="left: 1007px; right: -100px; top: 591px; display: none;">
+          <div class="button" id="t3r7p4" style="left: 12px; top: 21px; visibility: hidden;">
             <div class="buttonnumber" id="t3r7p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r7p4i"></div>
-          <div class="button" id="t3r8p1" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t3r8p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r8p1i"></div>
-          <div class="button" id="t3r8p2" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t3r8p2c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r8p2i"></div>
-          <div class="button" id="t3r8p3" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t3r8p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r8p3i"></div>
-          <div class="button" id="t3r8p4" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t3r8p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r8p4i"></div>
-          <div class="button" id="t3r9p1" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t3r9p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r9p1i"></div>
-          <div class="button" id="t3r9p2" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t3r9p2c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r9p2i"></div>
-          <div class="button" id="t3r9p3" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t3r9p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r9p3i"></div>
-          <div class="button" id="t3r9p4" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t3r9p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r9p4i"></div>
-          <div class="button" id="t3r10p1" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t3r10p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r10p1i"></div>
-          <div class="button" id="t3r10p2" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t3r10p2c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r10p2i"></div>
-          <div class="button" id="t3r10p3" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t3r10p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r10p3i"></div>
-          <div class="button" id="t3r10p4" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t3r10p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r10p4i"></div>
-          <div class="button" id="t3r11p1" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t3r11p1c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r11p1i"></div>
-          <div class="button" id="t3r11p2" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t3r11p2c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r11p2i"></div>
-          <div class="button" id="t3r11p3" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t3r11p3c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r11p3i"></div>
-          <div class="button" id="t3r11p4" style="left: -100px;right: -100px;">
-            <div class="buttonnumber" id="t3r11p4c"></div>
-            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r11p4i"></div><div class="arrowd" style="left: 960px; top: 378px; height: 87px; width: 15px;" id="arrowd353"></div><div class="arrowd" style="left: 830px; top: 313px; height: 152px; width: 15px;" id="arrowd351"></div><div class="arrowd" style="left: 895px; top: 443px; height: 152px; width: 15px;" id="arrowd372"></div></td>
-        </tr>
+            <img src="./api.php?call=files&cat=skilltree&id=spacer.gif" class="talenticon" alt="" id="t3r7p4i">
+          </div>
+        </td>
+    </tr>
 </table>
 <div id="frame_content_toolbar" style="margin-top: 75px; height: 75px;"></div>
\ No newline at end of file