diff --git a/src/App.vue b/src/App.vue
index c27172f..56e2695 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -13,11 +13,13 @@ import MdTabs from "vue-material/dist/components/MdTabs";
 import MdIcon from "vue-material/dist/components/MdIcon";
 import MdCard from "vue-material/dist/components/MdCard";
 import MdDialog from "vue-material/dist/components/MdDialog";
+import MdDrawer from "vue-material/dist/components/MdDrawer";
 
 Vue.use(MdTabs);
 Vue.use(MdIcon);
 Vue.use(MdCard);
 Vue.use(MdDialog);
+Vue.use(MdDrawer);
 
 import TabsMenu from "@/components/TabsMenu.vue";
 export default {
diff --git a/src/assets/images/logo/discord.png b/src/assets/images/logo/discord.png
new file mode 100644
index 0000000..9ec569d
Binary files /dev/null and b/src/assets/images/logo/discord.png differ
diff --git a/src/assets/images/logo/download.svg b/src/assets/images/logo/download.svg
new file mode 100644
index 0000000..ee5005e
--- /dev/null
+++ b/src/assets/images/logo/download.svg
@@ -0,0 +1,8 @@
+<?xml version="1.0" ?><!DOCTYPE svg  PUBLIC '-//W3C//DTD SVG 1.1//EN'  'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'><svg height="512px" style="enable-background:new 0 0 124 132;" version="1.1" viewBox="0 0 124 132" width="512px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><style type="text/css">
+<![CDATA[
+	.st0{fill:#EF3E42;}
+	.st1{fill:#FFFFFF;}
+	.st2{fill:none;}
+	.st3{fill-rule:evenodd;clip-rule:evenodd;fill:#FFFFFF;}
+]]>
+</style><defs/><path d="M99.1,113.7c2.6,0,4.7-2.1,4.7-4.7V79.9h11.2v29.8c0,8.4-6.8,15.2-15.2,15.2H18.5c-8.4,0-15.2-6.8-15.2-15.2V79.9h11.2V109  c0,2.6,2.1,4.7,4.7,4.7H99.1L99.1,113.7z M37.1,17.7h43.9V57h16.8L59.1,94.8L20.4,57h16.8V17.7L37.1,17.7z"/><rect class="st2" height="132" id="_x3C_Slice_x3E__100_" width="124"/></svg>
\ No newline at end of file
diff --git a/src/assets/images/logo/qiwi.png b/src/assets/images/logo/qiwi.png
new file mode 100644
index 0000000..8850c6b
Binary files /dev/null and b/src/assets/images/logo/qiwi.png differ
diff --git a/src/assets/images/logo/qiwi.svg b/src/assets/images/logo/qiwi.svg
new file mode 100644
index 0000000..e90d785
--- /dev/null
+++ b/src/assets/images/logo/qiwi.svg
@@ -0,0 +1 @@
+<?xml version="1.0"?><svg fill="#000000" xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 50 50" width="50px" height="50px">    <path d="M 23.5 0 C 11.093 0 1 10.093 1 22.5 C 1 34.907 11.093 45 23.5 45 C 26.095 45 27.935594 44.704359 29.558594 44.443359 C 30.976594 44.215359 32.315 44 34 44 C 42.165 44 47.199047 49.603156 47.248047 49.660156 C 47.444047 49.882156 47.721 49.998047 48 49.998047 C 48.186 49.998047 48.374063 49.947844 48.539062 49.839844 C 48.955062 49.572844 49.113109 49.042797 48.912109 48.591797 C 48.802109 48.343797 46.085359 42.483891 35.193359 39.962891 L 34.896484 39.880859 C 32.204484 39.214859 30.0305 38.13025 28.4375 36.65625 C 26.3795 34.75425 25.986375 32.834266 25.984375 32.822266 C 25.892375 32.313266 25.416156 31.960906 24.910156 32.003906 C 24.394156 32.050906 24 32.482 24 33 C 24 33.102 24.006516 35.09075 24.353516 36.96875 C 24.055516 36.98975 23.773 37 23.5 37 C 15.505 37 9 30.495 9 22.5 C 9 14.505 15.505 8 23.5 8 C 31.495 8 38 14.505 38 22.5 C 38 23.096 37.962719 23.698828 37.886719 24.298828 C 36.000719 24.000828 34.125 24 34 24 C 33.418 24 33 24.499531 33 25.019531 C 33.012 25.562531 33.455047 25.999 33.998047 26 C 34.018047 26 36.098938 26.019797 37.960938 27.216797 C 41.047937 29.200797 41.786969 32.196656 41.792969 32.222656 C 41.885969 32.634656 42.228437 32.942188 42.648438 32.992188 C 43.065437 33.035188 43.474109 32.822359 43.662109 32.443359 C 45.213109 29.308359 46 25.962 46 22.5 C 46 10.093 35.907 0 23.5 0 z M 38.634766 32.001953 C 38.389703 31.987 38.19875 32.093594 38.09375 32.277344 C 37.88175 32.648344 38.039797 33.383437 38.466797 34.023438 C 38.899797 34.671437 39.266594 35 39.558594 35 C 39.826594 35 40.09475 34.664516 39.96875 33.853516 C 39.89375 33.369516 39.611484 32.317594 38.896484 32.058594 C 38.803984 32.025094 38.716453 32.006937 38.634766 32.001953 z M 35.367188 35 C 34.918187 35 34.544453 35.116797 34.314453 35.341797 C 33.724453 35.919797 33.989578 36.9355 34.892578 37.5625 C 35.287578 37.8355 35.855109 38 36.412109 38 C 36.979109 38 37.453094 37.830438 37.746094 37.523438 C 38.271094 36.963438 37.969563 36.170906 36.976562 35.503906 C 36.484563 35.173906 35.912187 35 35.367188 35 z"/></svg>
\ No newline at end of file
diff --git a/src/assets/images/logo/report.svg b/src/assets/images/logo/report.svg
new file mode 100644
index 0000000..3069293
--- /dev/null
+++ b/src/assets/images/logo/report.svg
@@ -0,0 +1,53 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="79.536px" height="79.536px" viewBox="0 0 79.536 79.536" style="enable-background:new 0 0 79.536 79.536;"
+	 xml:space="preserve">
+<g>
+	<path style="fill:#010002;" d="M29.974,23.999c-0.536,0-1.043-0.287-1.315-0.79c-0.391-0.732-0.117-1.633,0.616-2.024l13.559-7.265
+		c0.714-0.404,1.626-0.122,2.014,0.608c0.394,0.728,0.119,1.634-0.61,2.022l-13.557,7.262
+		C30.458,23.939,30.215,23.999,29.974,23.999z M44.848,37.006c0.394-0.725,0.119-1.631-0.61-2.019l-13.557-7.265
+		c-0.723-0.404-1.628-0.122-2.022,0.608c-0.391,0.728-0.117,1.633,0.616,2.019l13.559,7.268c0.217,0.119,0.461,0.182,0.698,0.182
+		C44.066,37.799,44.579,37.509,44.848,37.006z M48.188,25.892c0-0.821-0.673-1.497-1.491-1.497H34.82
+		c-0.82,0-1.494,0.676-1.494,1.497c0,0.823,0.673,1.497,1.494,1.497h11.866C47.515,27.388,48.188,26.715,48.188,25.892z
+		 M16.92,36.261c4.8,0,8.691-3.884,8.691-8.694c0-4.808-3.886-8.701-8.691-8.701c-4.813,0-8.723,3.889-8.723,8.701
+		C8.202,32.377,12.106,36.261,16.92,36.261z M17.753,38.301H16.92h-0.842c-8.114,0-11.412,2.646-13.554,7.012
+		C1.862,46.664,0.749,57.646,0,65.802h5.955l1.367-14.136l0.43,14.136h18.336l0.43-14.136l1.367,14.136h5.955
+		c-0.759-8.155-1.862-19.138-2.535-20.489C29.179,40.947,25.865,38.301,17.753,38.301z M62.624,36.261
+		c4.785,0,8.689-3.884,8.689-8.694c0-4.808-3.899-8.701-8.689-8.701c-4.805,0-8.709,3.889-8.709,8.701
+		C53.915,32.377,57.809,36.261,62.624,36.261z M77.009,45.312c-2.144-4.365-5.441-7.012-13.561-7.012h-0.834h-0.829
+		c-8.113,0-11.428,2.646-13.566,7.012c-0.652,1.352-1.761,12.334-2.521,20.489h5.949l1.372-14.136l0.431,14.136h18.335l0.43-14.136
+		l1.367,14.136h5.955C78.78,57.646,77.672,46.664,77.009,45.312z"/>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>
diff --git a/src/assets/images/logo/steam.png b/src/assets/images/logo/steam.png
new file mode 100644
index 0000000..754c39c
Binary files /dev/null and b/src/assets/images/logo/steam.png differ
diff --git a/src/assets/images/logo/steam.svg b/src/assets/images/logo/steam.svg
new file mode 100644
index 0000000..acd9712
--- /dev/null
+++ b/src/assets/images/logo/steam.svg
@@ -0,0 +1,48 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="512px" height="512px" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
+<g>
+	<path d="M151.961,418.005c13.572,0,26.893-6.567,34.986-18.708c12.867-19.301,7.651-45.377-11.649-58.244l-33.037-22.022
+		c5.654-1.54,11.597-2.38,17.739-2.38c37.196,0,67.348,30.152,67.348,67.351s-30.153,67.349-67.349,67.349
+		c-36.202,0-65.722-28.564-67.274-64.387l35.977,23.984C135.863,415.721,143.955,418.005,151.961,418.005z M426.67,0
+		C473.607,0,512,38.406,512,85.344v341.314C512,473.626,473.607,512,426.67,512H85.344C38.406,512,0,473.625,0,426.659V325.145
+		l60.667,40.444c-5.826,31.587,3.469,65.415,27.899,89.845c39.452,39.452,103.415,39.452,142.868,0
+		c24.234-24.231,33.575-57.715,28.039-89.082L384,254.858v-0.001c23.123-3.319,45.408-13.872,63.197-31.661
+		c43.736-43.738,43.736-114.653,0-158.392c-43.74-43.739-114.654-43.739-158.393,0c-17.789,17.789-28.344,40.073-31.662,63.196l0,0
+		L154.796,283.115c-15.924,0.816-31.689,5.382-45.863,13.695L0,224.189V85.344C0,38.406,38.405,0,85.343,0H426.67z M448,144
+		c0-44.183-35.816-80-80-80s-80,35.817-80,80s35.816,80,80,80S448,188.183,448,144z M320,144c0-26.51,21.49-48,48-48s48,21.49,48,48
+		s-21.49,48-48,48S320,170.51,320,144z"/>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>
diff --git a/src/assets/images/logo/terminal.svg b/src/assets/images/logo/terminal.svg
new file mode 100644
index 0000000..e3f7418
--- /dev/null
+++ b/src/assets/images/logo/terminal.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="512px" height="512px" focusable="false" viewBox="0 0 12 12">
+  <path d="M11 1H1c-.55 0-1 .45-1 1v8c0 .55.45 1 1 1h10c.55 0 1-.45 1-1V2c0-.55-.45-1-1-1zM2.5 9.12a.62.62 0 01-.44-.18.628.628 0 010-.88L4.12 6 2.06 3.94c-.24-.24-.24-.64 0-.88s.64-.24.88 0L5.09 5.2c.44.44.44 1.15 0 1.59L2.94 8.94a.62.62 0 01-.44.18zm7-.12h-4c-.28 0-.5-.22-.5-.5s.22-.5.5-.5h4c.28 0 .5.22.5.5s-.22.5-.5.5z"/>
+</svg>
diff --git a/src/assets/images/logo/vk.png b/src/assets/images/logo/vk.png
new file mode 100644
index 0000000..d7a0b65
Binary files /dev/null and b/src/assets/images/logo/vk.png differ
diff --git a/src/components/TabsMenuElements/ServersView/Components/PlayerTableInfo.vue b/src/components/TabsMenuElements/ServersView/Components/PlayerTableInfo.vue
new file mode 100644
index 0000000..62c6a68
--- /dev/null
+++ b/src/components/TabsMenuElements/ServersView/Components/PlayerTableInfo.vue
@@ -0,0 +1,22 @@
+<template>
+  <tr>
+    <td class="player-border-top server-table-padding" style="text-align: left; font-family: tf2secondary; font-size: 2em; color: #131213;">{{player['name']}}</td>
+    <td class="player-border-top server-table-padding" style="text-align: center; font-family: tf2secondary; font-size: 2em; color: #131213">{{player['score']}}</td>
+    <td class="player-border-top server-table-padding" style="text-align: center; font-family: tf2secondary; font-size: 2em; color: #131213">{{player['duration']}}</td>
+  </tr>
+</template>
+
+<script>
+export default {
+  name: 'PlayerTableInfo',
+  props: {
+    player: Object
+  }
+}
+</script>
+
+<style>
+.player-border-top {
+  border-top: 1px solid;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/TabsMenuElements/ServersView/Components/ServerCard.vue b/src/components/TabsMenuElements/ServersView/Components/ServerCard.vue
index 3d6f19f..f150344 100644
--- a/src/components/TabsMenuElements/ServersView/Components/ServerCard.vue
+++ b/src/components/TabsMenuElements/ServersView/Components/ServerCard.vue
@@ -1,9 +1,9 @@
 <template>
-  <div class="md-layout-item md-size-100" style="padding-bottom: 1%">
-    <md-card v-on:click="openServerFullInfo()">
+  <div class="md-layout-item md-size-100" style="padding-bottom: 1%" v-on:click="openServerFullInfo()">
+    <md-card>
       <md-card-media-cover md-solid>
         <md-card-media class="card-size" md-ratio="16:9">
-          <img :src="serverImage" :alt="serverName" crossorigin="anonymous">
+          <img :src="serverImage" :alt="serverName" crossorigin="anonymous" :style="imgIfStatus()">
         </md-card-media>
         <md-card-area class="md-card-area-server">
           <md-card-header>
@@ -39,7 +39,24 @@ export default {
   }),
   methods: {
     openServerFullInfo() {
-      this.$refs.ssd.openDialog();
+      console.log("Open server full info");
+      if (this.serverData['status'] === true) this.$refs.ssd.openDialog();
+      else alert("сервер мертв, нелезь на него");
+    },
+    imgIfStatus() {
+      let scale_value = 0;
+      if (this.serverData['status'] === true) {
+        if (this.serverData['player_count'] > 0) {
+          scale_value = 0;
+        } else {
+          scale_value = 50;
+        }
+      } else {
+        scale_value = 100;
+      }
+      return {
+        "filter": `grayscale(${scale_value}%)`
+      }
     }
   }
 }
@@ -53,4 +70,12 @@ export default {
 .md-card-area-server {
   background: linear-gradient(to bottom, rgba(0, 0, 0, 0.01), rgba(0, 0, 0, 1)) !important;
 }
+
+.blur-if:hover {
+  -webkit-filter: blur(2px);
+  -moz-filter: blur(2px);
+  -o-filter: blur(2px);
+  -ms-filter: blur(2px);
+  filter: blur(2px);
+}
 </style>
\ No newline at end of file
diff --git a/src/components/TabsMenuElements/ServersView/Components/ServerFullInfo.vue b/src/components/TabsMenuElements/ServersView/Components/ServerFullInfo.vue
index e646554..a614be0 100644
--- a/src/components/TabsMenuElements/ServersView/Components/ServerFullInfo.vue
+++ b/src/components/TabsMenuElements/ServersView/Components/ServerFullInfo.vue
@@ -1,33 +1,65 @@
 <template>
   <div>
     <md-dialog :md-active.sync="showServerDialog">
-      <md-dialog-title>Preferences</md-dialog-title>
-
-      <md-tabs md-dynamic-height>
-        <md-tab md-label="General">
-          <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Ullam mollitia dolorum dolores quae commodi impedit possimus qui, atque at voluptates cupiditate. Neque quae culpa suscipit praesentium inventore ducimus ipsa aut.</p>
-        </md-tab>
-
-        <md-tab md-label="Activity">
-          <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Ullam mollitia dolorum dolores quae commodi impedit possimus qui, atque at voluptates cupiditate. Neque quae culpa suscipit praesentium inventore ducimus ipsa aut.</p>
-        </md-tab>
-
-        <md-tab md-label="Account">
-          <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Ullam mollitia dolorum dolores quae commodi impedit possimus qui, atque at voluptates cupiditate. Neque quae culpa suscipit praesentium inventore ducimus ipsa aut.</p>
-        </md-tab>
-      </md-tabs>
-
-      <md-dialog-actions>
-        <md-button class="md-primary" @click="showServerDialog = false">Close</md-button>
-        <md-button class="md-primary" @click="showServerDialog = false">Save</md-button>
-      </md-dialog-actions>
+      <div class="md-layout md-alignment-bottom-center" style="z-index: 1">
+        <div class="md-layout-item md-alignment-bottom-center rounded-and-colored md-size-60">
+          <h3 style="text-align: center; margin: 2% 0%">{{serverData['name']}}</h3>
+        </div>
+      </div>
+      <div class="md-layout md-alignment-bottom-center" style="margin-top: -2.5%">
+        <div class="md-layout-item md-size-65 server-info-rounded">
+          <img :src="serverData['preview']" style="width: 100%; height:12em;object-fit: cover;border-top-left-radius: 15px; border-top-right-radius: 15px">
+          <div>
+            <p class="p-server">{{serverData['description']}}</p>
+            <hr width="30%">
+          </div>
+          <div style="justify-content: center; display: flex; margin-top: 2.5%">
+            <div style="max-width: 40%; float: left;" v-on:click="onMove('steam')">
+              <img :src="require('@/assets/images/logo/terminal.svg')" class="img-server">
+              <p class="p-server" style="margin-bottom: -5%">Подключиться</p>
+              <p class="p-server-address">{{serverData['address']}}</p>
+            </div>
+            <div style="max-width: 40%; float: left;" v-if="serverData['workshop'].length > 0" v-on:click="onMove('workshop')">
+              <img :src="require('@/assets/images/logo/steam.svg')" class="img-server">
+              <p class="p-server" style="margin-bottom: -5%">Workshop</p>
+              <p class="p-server-address">by Пельмень</p>
+            </div>
+            <div style="max-width: 40%; float: left;" v-else v-on:click="onMove('fastdl')">
+              <img :src="require('@/assets/images/logo/download.svg')" class="img-server">
+              <p class="p-server" style="margin-bottom: -5%">FastDL</p>
+              <p class="p-server-address">by Добродей</p>
+            </div>
+          </div>
+          <hr width="30%">
+          <h3 v-if="serverData['player_count'] < 1" style="text-align: center; line-height: 1em">На сервере пусто, заходи с друзьями...</h3>
+          <div v-else>
+            <h3 style="text-align: center">Сейчас играет {{serverData['player_count']}}/{{serverData['max_players']}}</h3>
+            <hr width="30%">
+            <table style="margin-left: auto; margin-right: auto; height: 20em; padding-left: 10%; padding-right: 10%; padding-bottom: 5%">
+              <thead>
+                <tr>
+                  <th style="text-align: left; font-family: tf2secondary; font-size: 2em; color: #131213" class="server-table-padding">Имя</th>
+                  <th style="text-align: center; font-family: tf2secondary; font-size: 2em; color: #131213" class="server-table-padding">Очки</th>
+                  <th style="text-align: center; font-family: tf2secondary; font-size: 2em; color: #131213" class="server-table-padding">Время игры</th>
+                </tr>
+              </thead>
+              <tbody>
+              <PlayerTableInfo v-for="player_data in serverData['players']" :key="player_data['name']" :player="player_data"/>
+              </tbody>
+            </table>
+          </div>
+        </div>
+      </div>
     </md-dialog>
   </div>
 </template>
 
 <script>
+import PlayerTableInfo from "@/components/TabsMenuElements/ServersView/Components/PlayerTableInfo.vue";
+
 export default {
   name: "ServerFullInfo",
+  components: {PlayerTableInfo},
   props: {
     serverData: Object,
   },
@@ -37,7 +69,71 @@ export default {
   methods: {
     openDialog() {
       this.showServerDialog = true;
+    },
+    onMove(select){
+      switch (select) {
+        case 'steam': return window.open(`steam://${this.serverData['address']}`, '_self').focus();
+        case 'workshop': return window.open(this.serverData['workshop'], '_blank').focus();
+        case 'fastdl': return window.open(`https://tf2.pblr-nyk.pro/tf/maps/${this.serverData['map']}.bsp.bz2`, '_blank').focus();
+      }
     }
   }
 }
-</script>
\ No newline at end of file
+</script>
+
+<style>
+.p-server {
+  text-align: center; font-size: 2em; color: #131213
+}
+
+.p-server-address {
+  text-align: center; font-size: 1.5em; color: gray;
+}
+
+.img-server {
+  max-width: 50%; margin-left: auto; margin-right: auto; display: block; color: #131213;
+}
+
+.img-server:hover {
+  box-shadow: 0 0 10px #fd8846;
+  color: red;
+}
+
+.server-table-padding {
+  padding: 2% 0%;
+}
+
+table {
+  display: flex;
+  flex-flow: column;
+  height: 100%;
+  width: 100%;
+}
+
+table thead {
+  /* head takes the height it requires,
+  and it's not scaled when table is resized */
+  flex: 0 0 auto;
+  width: calc(100% - 0.9em);
+}
+table tbody {
+  /* body takes all the remaining available space */
+  flex: 1 1 auto;
+  display: block;
+  overflow-y: scroll;
+}
+
+table tbody tr {
+  width: 100%;
+}
+table thead, table tbody tr {
+  display: table;
+  table-layout: fixed;
+}
+
+.server-info-rounded {
+  border-radius: 20px;
+  border: 5px solid black;
+  background: #fdfdfe;
+}
+</style>
\ No newline at end of file