diff --git a/package.json b/package.json
index e0a2263..470cf88 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "csgowtf",
-  "version": "0.1.0",
+  "version": "0.28.36",
   "private": true,
   "scripts": {
     "serve": "vue-cli-service serve",
diff --git a/src/components/MatchesTable.vue b/src/components/MatchesTable.vue
index 70a71f5..d89e1ca 100644
--- a/src/components/MatchesTable.vue
+++ b/src/components/MatchesTable.vue
@@ -6,14 +6,14 @@
         <th class="text-center map" scope="col">Map</th>
         <th class="text-center rank" scope="col">Rank</th>
         <th class="text-center length" scope="col" title="Match Length">
-          <img alt="Match length" class="match-len" src="../assets/images/icons/timer_both.svg">
+          <img alt="Match length" class="match-len helpicon" src="../assets/images/icons/timer_both.svg">
         </th>
         <th class="text-center score" scope="col">Score</th>
-        <th class="text-center kills" scope="col" v-if="!props.explore">K</th>
-        <th class="text-center assists" scope="col" v-if="!props.explore">A</th>
-        <th class="text-center deaths" scope="col" v-if="!props.explore">D</th>
-        <th class="text-center kdiff" scope="col" style="cursor: help" title="Kill-to-death ratio" v-if="!props.explore">+/-</th>
-        <th class="text-center hltv" scope="col" style="cursor: help" title="HLTV 1.0 Rating" v-if="!props.explore">Rating</th>
+        <th v-if="!props.explore" class="text-center kills" scope="col">K</th>
+        <th v-if="!props.explore" class="text-center assists" scope="col">A</th>
+        <th v-if="!props.explore" class="text-center deaths" scope="col">D</th>
+        <th v-if="!props.explore" class="text-center kdiff helptext" scope="col" title="Kill-to-death ratio">+/-</th>
+        <th v-if="!props.explore" class="text-center hltv  helptext" scope="col" title="HLTV 1.0 Rating">Rating</th>
         <th class="text-center duration" scope="col">Duration</th>
         <th class="date" scope="col">Date</th>
       </tr>
@@ -27,30 +27,27 @@
           @click="GoToMatch(match.match_id)"
       >
         <td class="td-map text-center">
-          <i v-if="match.parsed" class="fa fa-bar-chart parsed" style="cursor: help"
+          <i v-if="match.parsed" class="fa fa-bar-chart parsed helpicon"
              title="Demo has been parsed for additional data"></i>
-          <i v-if="!match.parsed && MatchNotParsedTime(match.date)" class="fa fa-hourglass-half not-yet-parsed"
-             style="cursor: help"
+          <i v-if="!match.parsed && MatchNotParsedTime(match.date)" class="fa fa-hourglass-half not-yet-parsed helpicon"
              title="Match has not been parsed yet"></i>
-          <img v-if="match.map"
-               :alt="match.map ? match.map : 'Map not found'"
-               :src="match.map !== '' ? require('../assets/images/map_icons/map_icon_' + match.map + '.svg') : require('../assets/images/map_icons/map_icon_lobby_mapveto.svg')"
-               :title="match.map"
+          <img v-if="match.map !== ''"
+               :alt="match.map"
+               :src="require('../assets/images/map_icons/map_icon_' + match.map + '.svg')"
+               :title="FixMapName(match.map)"
                class="map-icon">
           <i v-else class="fa fa-question-circle-o map-not-found" title="Match not parsed"></i>
         </td>
         <td class="td-rank text-center">
-          <img
+          <img v-if="props.explore"
+              :alt="DisplayRank(Math.floor(match.avg_rank || 0))[1]"
+              :src="DisplayRank(Math.floor(match.avg_rank || 0))[0]"
+              :title="DisplayRank(Math.floor(match.avg_rank || 0))[1]" class="rank-icon">
+          <img v-else
               :alt="DisplayRank(match.stats.rank?.new)[1]"
               :class="match.stats.rank?.new > match.stats.rank?.old ? 'uprank' : match.stats.rank?.new < match.stats.rank?.old ? 'downrank' : ''"
               :src="DisplayRank(match.stats.rank?.new)[0]"
-              :title="DisplayRank(match.stats.rank?.new)[1]"
-              class="rank-icon" v-if="!props.explore">
-          <img
-              :alt="DisplayRank(Math.floor(match.avg_rank || 0))[1]"
-              :src="DisplayRank(Math.floor(match.avg_rank || 0))[0]"
-              :title="DisplayRank(Math.floor(match.avg_rank || 0))[1]"
-              class="rank-icon" v-if="props.explore">
+              :title="DisplayRank(match.stats.rank?.new)[1]" class="rank-icon">
         </td>
         <td class="td-length text-center">
           <img v-if="match.max_rounds === 30 || !match.max_rounds" alt="Match long"
@@ -62,30 +59,30 @@
             class="td-score text-center fw-bold">
           {{ match.score[0] }} - {{ match.score[1] }}
         </td>
-        <td class="td-kills text-center" v-if="match.stats">
+        <td v-if="match.stats" class="td-kills text-center">
           {{ match.stats.kills ? match.stats.kills : "0" }}
         </td>
-        <td class="td-assists text-center" v-if="match.stats">
+        <td v-if="match.stats" class="td-assists text-center">
           {{ match.stats.assists ? match.stats.assists : "0" }}
         </td>
-        <td class="td-deaths text-center" v-if="match.stats">
+        <td v-if="match.stats" class="td-deaths text-center">
           {{ match.stats.deaths ? match.stats.deaths : "0" }}
         </td>
-        <td :class="(match.stats.kills ? match.stats.kills : 0) - (match.stats.deaths ? match.stats.deaths : 0) >= 0 ? 'text-success' : 'text-danger'"
-            class="td-plus text-center" v-if="match.stats">
+        <td v-if="match.stats"
+            :class="(match.stats.kills ? match.stats.kills : 0) - (match.stats.deaths ? match.stats.deaths : 0) >= 0 ? 'text-success' : 'text-danger'" class="td-plus text-center">
           {{
             (match.stats.kills ? match.stats.kills : 0) - (match.stats.deaths ? match.stats.deaths : 0)
           }}
         </td>
-        <td :class="GetHLTV_1(
+        <td v-if="match.stats"
+            :class="GetHLTV_1(
                       match.stats.kills,
                       match.score[0] + match.score[1],
                       match.stats.deaths,
                       match.stats.multi_kills?.duo,
                       match.stats.multi_kills?.triple,
                       match.stats.multi_kills?.quad,
-                      match.stats.multi_kills?.pent) >= 1 ? 'text-success' : 'text-warning'"
-            class="td-hltv text-center fw-bold" v-if="match.stats">
+                      match.stats.multi_kills?.pent) >= 1 ? 'text-success' : 'text-warning'" class="td-hltv text-center fw-bold">
           {{
             GetHLTV_1(
                 match.stats.kills,
@@ -111,7 +108,18 @@
 </template>
 
 <script>
-import {FormatDate, FormatDuration, FormatFullDate, FormatFullDuration, GetHLTV_1, GetWinLoss, GoToMatch, MatchNotParsedTime, DisplayRank} from "@/utils";
+import {
+  DisplayRank,
+  FixMapName,
+  FormatDate,
+  FormatDuration,
+  FormatFullDate,
+  FormatFullDuration,
+  GetHLTV_1,
+  GetWinLoss,
+  GoToMatch,
+  MatchNotParsedTime
+} from "@/utils";
 import {onMounted, reactive, watch} from "vue";
 
 export default {
@@ -140,7 +148,20 @@ export default {
       data.matches = props.matches
     })
 
-    return {props, data, FormatDate, FormatFullDate, FormatDuration, FormatFullDuration, GetHLTV_1, GetWinLoss, GoToMatch, MatchNotParsedTime, DisplayRank}
+    return {
+      props,
+      data,
+      FormatDate,
+      FormatFullDate,
+      FormatDuration,
+      FormatFullDuration,
+      GetHLTV_1,
+      GetWinLoss,
+      GoToMatch,
+      MatchNotParsedTime,
+      DisplayRank,
+      FixMapName
+    }
   }
 }
 </script>
@@ -165,10 +186,6 @@ table {
       width: 150px;
     }
 
-    th[title] {
-      text-decoration: underline dotted grey;
-    }
-
     td {
       vertical-align: middle;
     }
@@ -219,18 +236,6 @@ table {
     }
 
     .td-rank {
-      .uprank {
-        box-shadow: 0 0 20px greenyellow;
-        border: 1px solid greenyellow;
-        border-radius: 5px;
-      }
-
-      .downrank {
-        box-shadow: 0 0 20px #ff2f2f;
-        border: 1px solid #ff2f2f;
-        border-radius: 5px;
-      }
-
       img {
         width: 70px;
         height: auto;
diff --git a/src/components/ScoreTeam.vue b/src/components/ScoreTeam.vue
index 22e71cc..2a53285 100644
--- a/src/components/ScoreTeam.vue
+++ b/src/components/ScoreTeam.vue
@@ -35,14 +35,14 @@
         <th class="player__kills">K</th>
         <th class="player__assist">A</th>
         <th class="player__deaths">D</th>
-        <th class="player__diff cursor__help" title="Kill death difference">+/-</th>
+        <th class="player__diff helptext" title="Kill death difference">+/-</th>
         <th class="player__kd">K/D</th>
-        <th v-if="store.state.matchDetails.parsed" class="player__adr cursor__help" title="Average damage per round">
+        <th v-if="store.state.matchDetails.parsed" class="player__adr helptext" title="Average damage per round">
           ADR
         </th>
-        <th class="player__hs cursor__help" title="Percentage of kills with a headshot">HS%</th>
-        <th class="player__rating cursor__help" title="Estimated HLTV Rating 1.0">Rating</th>
-        <th class="player__mvp cursor__help" title="Most valuable player">MVP</th>
+        <th class="player__hs helptext" title="Percentage of kills with a headshot">HS%</th>
+        <th class="player__rating helptext" title="Estimated HLTV Rating 1.0">Rating</th>
+        <th class="player__mvp helptext" title="Most valuable player">MVP</th>
         <th class="player__score">Score</th>
       </tr>
       </thead>
@@ -69,7 +69,8 @@
                          :name="player.player.name"
                          :parsed="store.state.matchDetails.parsed"
                          :player_score="player.score"
-                         :rank="player.rank?.old"
+                         :rank_old="player.rank?.old"
+                         :rank_new="player.rank?.new"
                          :rounds_played="store.state.matchDetails.score.reduce((a, b) => a + b)"
                          :steamid64="player.player.steamid64"
                          :tracked="player.player.tracked"
@@ -174,10 +175,6 @@ table {
     padding: 5px 10px;
   }
 
-  .cursor__help {
-    cursor: help;
-  }
-
   .hr {
     height: 20px;;
     border-bottom: 1px solid white;
diff --git a/src/components/ScoreTeamPlayer.vue b/src/components/ScoreTeamPlayer.vue
index 7bb1b9c..d18d7c5 100644
--- a/src/components/ScoreTeamPlayer.vue
+++ b/src/components/ScoreTeamPlayer.vue
@@ -20,9 +20,10 @@
     <i class="fa fa-external-link"></i>
   </td>
   <td v-if="props.parsed" class="player__rank">
-    <img :alt="DisplayRank(props.rank)[1]"
-         :src="DisplayRank(props.rank)[0]"
-         :title="DisplayRank(props.rank)[1]">
+    <img :alt="DisplayRank(props.rank_old)[1]"
+         :class="props.rank_new > props.rank_old ? 'uprank' : props.rank_new < props.rank_old ? 'downrank' : ''"
+         :src="DisplayRank(props.rank_old)[0]"
+         :title="props.rank_new > props.rank_old ? 'Uprank to ' + DisplayRank(props.rank_new)[1] : props.rank_new < props.rank_old ? 'Downrank to ' + DisplayRank(props.rank_new)[1] : DisplayRank(props.rank_old)[1]">
   </td>
   <td v-if="!props.parsed" class="rank-placeholder"></td>
   <td class="player__kills">
@@ -83,7 +84,12 @@ export default {
       required: true,
       default: 'Name'
     },
-    rank: {
+    rank_old: {
+      type: Number,
+      required: true,
+      default: 0
+    },
+    rank_new: {
       type: Number,
       required: true,
       default: 0
diff --git a/src/scss/classes.scss b/src/scss/classes.scss
new file mode 100644
index 0000000..b4b1d94
--- /dev/null
+++ b/src/scss/classes.scss
@@ -0,0 +1,19 @@
+.helptext {
+  cursor: help;
+  text-decoration: underline dotted grey;
+}
+.helpicon {
+  cursor: help;
+}
+
+.uprank {
+  box-shadow: 0 0 20px greenyellow;
+  border: 1px solid greenyellow;
+  border-radius: 5px;
+}
+
+.downrank {
+  box-shadow: 0 0 20px #ff2f2f;
+  border: 1px solid #ff2f2f;
+  border-radius: 5px;
+}
diff --git a/src/scss/custom.scss b/src/scss/custom.scss
index 8bea1b8..ecf94be 100644
--- a/src/scss/custom.scss
+++ b/src/scss/custom.scss
@@ -66,3 +66,5 @@ $success: #609926;
   --csgo-green: #04B462;
   --csgo-grey: #5a5a5a;
 }
+
+@import "classes";
diff --git a/src/views/Match.vue b/src/views/Match.vue
index 69414a8..64f5e86 100644
--- a/src/views/Match.vue
+++ b/src/views/Match.vue
@@ -39,11 +39,11 @@
           <span class="text-white">{{ FormatFullDate(data.matchDetails.date) }}</span>
         </p>
         <div class="text-center fs-6">
-          <img v-if="data.matchDetails.max_rounds === 16" alt="Match length" class="match-len"
-               src="../assets/images/icons/timer_short.svg" title="Short-Match">
+          <img v-if="data.matchDetails.max_rounds === 16" alt="Match length" class="match-len helpicon"
+               src="../assets/images/icons/timer_short.svg" title="Short Match">
           <img v-if="data.matchDetails.max_rounds === 30 || !data.matchDetails.max_rounds" alt="Match length"
-               class="match-len"
-               src="../assets/images/icons/timer_long.svg" title="Long-Match">
+               class="match-len helpicon"
+               src="../assets/images/icons/timer_long.svg" title="Long Match">
 
           <span v-if="data.matchDetails.parsed" class="text-muted px-2">—</span>
 
@@ -51,20 +51,21 @@
                :alt="DisplayRank(Math.floor(data.matchDetails.avg_rank || 0))[1]"
                :src="DisplayRank(Math.floor(data.matchDetails.avg_rank || 0))[0]"
                :title="'Average Rank: ' + DisplayRank(Math.floor(data.matchDetails.avg_rank || 0))[1]"
-               class="rank-icon"/>
+               class="rank-icon helpicon"/>
 
           <span v-if="data.matchDetails.parsed && data.matchDetails.replay_url" class="text-muted px-2">—</span>
 
           <div v-if="data.matchDetails.parsed && data.matchDetails.replay_url" class="btn-group">
             <i id="downloadMenuBtn" aria-hidden="true" class="fa fa-ellipsis-h mx-2"
-               @click.prevent="handleDownloadMenu"></i>
+               @click.prevent="handleDownloadMenu" title="Click for more"></i>
             <div id="downloadGroup" class="group">
-              <a v-if="data.matchDetails.replay_url" :href="data.matchDetails.replay_url" title="Download Demo">
+              <a v-if="data.matchDetails.replay_url" :href="data.matchDetails.replay_url" target="_blank"
+                 title="Download Demo">
                 <i id="downloadDemo" aria-hidden="true" class="fa fa-download mx-2"></i>
               </a>
               <a v-if="data.matchDetails.share_code"
                  :href="'steam://rungame/730/76561202255233023/+csgo_download_match ' + data.matchDetails.share_code"
-                 title="Watch Demo">
+                 target="_blank" title="Watch Demo">
                 <i id="replayDemo" aria-hidden="true" class="fa fa-television mx-2"></i>
               </a>
             </div>
diff --git a/src/views/Player.vue b/src/views/Player.vue
index 39f7700..dbec626 100644
--- a/src/views/Player.vue
+++ b/src/views/Player.vue
@@ -178,7 +178,7 @@
                 </span>
               </li>
             </ul>
-            {{ setDmgGraphWidth() }}
+            <span>{{setDmgGraphWidth()}}</span>
           </div>
           <div v-if="data.playerMeta.win_maps" class="side-info-box best-map">
             <div class="heading">
@@ -421,7 +421,7 @@ export default {
         const dmg = ref(0)
 
         for (let i = 0; i <= 4; i++) {
-          weaponsContainer = document.querySelector('.dmplayerMetag-chart-' + i)
+          weaponsContainer = document.querySelector('.dmg-chart-' + i)
           if (weaponsContainer !== null) {
             if (i === 0) {
               dmg100.value = weaponsContainer.innerHTML * 1