diff --git a/src/App.vue b/src/App.vue
index 0e3e0cb..6268265 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -203,6 +203,7 @@ a {
 
 .clickable:hover {
   cursor: pointer;
+  color: #fd8846;
 }
 
 .md-menu-content-container {
diff --git a/src/assets/images/about/gameplay_1.jpg b/src/assets/images/about/gameplay_1.jpg
new file mode 100644
index 0000000..c8e0985
Binary files /dev/null and b/src/assets/images/about/gameplay_1.jpg differ
diff --git a/src/assets/images/about/gameplay_2.jpg b/src/assets/images/about/gameplay_2.jpg
new file mode 100644
index 0000000..dd83cbe
Binary files /dev/null and b/src/assets/images/about/gameplay_2.jpg differ
diff --git a/src/assets/images/about/gameplay_3.jpg b/src/assets/images/about/gameplay_3.jpg
new file mode 100644
index 0000000..e3b7d86
Binary files /dev/null and b/src/assets/images/about/gameplay_3.jpg differ
diff --git a/src/assets/images/about/image3.png b/src/assets/images/about/image3.png
new file mode 100644
index 0000000..4c7248d
Binary files /dev/null and b/src/assets/images/about/image3.png differ
diff --git a/src/assets/images/about/image4.png b/src/assets/images/about/image4.png
new file mode 100644
index 0000000..e32f87b
Binary files /dev/null and b/src/assets/images/about/image4.png differ
diff --git a/src/components/Others/CustomSvg/DiscordSvg.vue b/src/components/Others/CustomSvg/DiscordSvg.vue
index 626f1aa..6b2cb10 100644
--- a/src/components/Others/CustomSvg/DiscordSvg.vue
+++ b/src/components/Others/CustomSvg/DiscordSvg.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg v-on:click="openUrl()" fill="currentColor" :width="w" :height="h" viewBox="0 0 24 24" role="img" xmlns="http://www.w3.org/2000/svg" :style="`${inline?'display: inline':''}`"><title>Discord icon</title><path d="M20.222 0c1.406 0 2.54 1.137 2.607 2.475V24l-2.677-2.273-1.47-1.338-1.604-1.398.67 2.205H3.71c-1.402 0-2.54-1.065-2.54-2.476V2.48C1.17 1.142 2.31.003 3.715.003h16.5L20.222 0zm-6.118 5.683h-.03l-.202.2c2.073.6 3.076 1.537 3.076 1.537-1.336-.668-2.54-1.002-3.744-1.137-.87-.135-1.74-.064-2.475 0h-.2c-.47 0-1.47.2-2.81.735-.467.203-.735.336-.735.336s1.002-1.002 3.21-1.537l-.135-.135s-1.672-.064-3.477 1.27c0 0-1.805 3.144-1.805 7.02 0 0 1 1.74 3.743 1.806 0 0 .4-.533.805-1.002-1.54-.468-2.14-1.404-2.14-1.404s.134.066.335.2h.06c.03 0 .044.015.06.03v.006c.016.016.03.03.06.03.33.136.66.27.93.4.466.202 1.065.403 1.8.536.93.135 1.996.2 3.21 0 .6-.135 1.2-.267 1.8-.535.39-.2.87-.4 1.397-.737 0 0-.6.936-2.205 1.404.33.466.795 1 .795 1 2.744-.06 3.81-1.8 3.87-1.726 0-3.87-1.815-7.02-1.815-7.02-1.635-1.214-3.165-1.26-3.435-1.26l.056-.02zm.168 4.413c.703 0 1.27.6 1.27 1.335 0 .74-.57 1.34-1.27 1.34-.7 0-1.27-.6-1.27-1.334.002-.74.573-1.338 1.27-1.338zm-4.543 0c.7 0 1.266.6 1.266 1.335 0 .74-.57 1.34-1.27 1.34-.7 0-1.27-.6-1.27-1.334 0-.74.57-1.338 1.27-1.338z"/></svg>
+  <svg v-on:click="openUrl()" class="clickable" fill="currentColor" :width="w" :height="h" viewBox="0 0 24 24" role="img" xmlns="http://www.w3.org/2000/svg" :style="`${inline?'display: inline':''}`"><path d="M20.222 0c1.406 0 2.54 1.137 2.607 2.475V24l-2.677-2.273-1.47-1.338-1.604-1.398.67 2.205H3.71c-1.402 0-2.54-1.065-2.54-2.476V2.48C1.17 1.142 2.31.003 3.715.003h16.5L20.222 0zm-6.118 5.683h-.03l-.202.2c2.073.6 3.076 1.537 3.076 1.537-1.336-.668-2.54-1.002-3.744-1.137-.87-.135-1.74-.064-2.475 0h-.2c-.47 0-1.47.2-2.81.735-.467.203-.735.336-.735.336s1.002-1.002 3.21-1.537l-.135-.135s-1.672-.064-3.477 1.27c0 0-1.805 3.144-1.805 7.02 0 0 1 1.74 3.743 1.806 0 0 .4-.533.805-1.002-1.54-.468-2.14-1.404-2.14-1.404s.134.066.335.2h.06c.03 0 .044.015.06.03v.006c.016.016.03.03.06.03.33.136.66.27.93.4.466.202 1.065.403 1.8.536.93.135 1.996.2 3.21 0 .6-.135 1.2-.267 1.8-.535.39-.2.87-.4 1.397-.737 0 0-.6.936-2.205 1.404.33.466.795 1 .795 1 2.744-.06 3.81-1.8 3.87-1.726 0-3.87-1.815-7.02-1.815-7.02-1.635-1.214-3.165-1.26-3.435-1.26l.056-.02zm.168 4.413c.703 0 1.27.6 1.27 1.335 0 .74-.57 1.34-1.27 1.34-.7 0-1.27-.6-1.27-1.334.002-.74.573-1.338 1.27-1.338zm-4.543 0c.7 0 1.266.6 1.266 1.335 0 .74-.57 1.34-1.27 1.34-.7 0-1.27-.6-1.27-1.334 0-.74.57-1.338 1.27-1.338z"/></svg>
 </template>
 
 <script>
@@ -21,6 +21,10 @@ export default {
     inline: {
       type: Boolean,
       default: false
+    },
+    ttext: {
+      type: String,
+      default: "Открыть дискорд"
     }
   },
   methods: {
diff --git a/src/components/Others/CustomSvg/VkSvg.vue b/src/components/Others/CustomSvg/VkSvg.vue
new file mode 100644
index 0000000..d87c580
--- /dev/null
+++ b/src/components/Others/CustomSvg/VkSvg.vue
@@ -0,0 +1,34 @@
+<template>
+  <svg xmlns="http://www.w3.org/2000/svg" class="clickable" fill="currentColor" :width="w" :height="h" viewBox="0 0 24 24" :style="`enable-background:new 0 0 512 512; ${inline?'display: inline':''}`" v-on:click="openUrl()">
+    <path d="M19 0h-14c-2.761 0-5 2.239-5 5v14c0 2.761 2.239 5 5 5h14c2.762 0 5-2.239 5-5v-14c0-2.761-2.238-5-5-5zm.25 16.996h-2.134c-1.205 0-1.409-.687-2.401-1.679-.897-.897-1.395-.209-1.374 1.068.006.339-.161.611-.566.611-1.264 0-3.08.178-4.918-1.806-1.883-2.033-3.857-6.111-3.857-6.513 0-.237.196-.344.524-.344h2.17c.574 0 .623.284.783.649.667 1.521 2.265 4.574 2.69 2.87.244-.978.344-3.245-.703-3.44-.594-.11.452-.746 1.968-.746.377 0 .786.041 1.205.137.769.179.771.523.761 1.026-.039 1.903-.269 3.184.233 3.507.479.31 1.739-1.717 2.403-3.281.183-.433.219-.722.734-.722h2.654c1.39 0-.182 1.997-1.383 3.557-.968 1.255-.916 1.28.209 2.324.803.744 1.75 1.76 1.75 2.336.002.272-.21.446-.748.446z"/>
+  </svg>
+</template>
+
+<script>
+export default {
+  name: "VkSvg",
+  props: {
+    w: {
+      type: String,
+      default: "512px"
+    },
+    h: {
+      type: String,
+      default: "60%"
+    },
+    url: {
+      type:String,
+      default: null
+    },
+    inline: {
+      type: Boolean,
+      default: false
+    }
+  },
+  methods: {
+    openUrl(){
+      if (this.url !== null) window.open(this.url, '_blank');
+    }
+  }
+}
+</script>
\ No newline at end of file
diff --git a/src/components/TabsMenu.vue b/src/components/TabsMenu.vue
index 834f32a..0a71b9c 100644
--- a/src/components/TabsMenu.vue
+++ b/src/components/TabsMenu.vue
@@ -1,7 +1,7 @@
 <template>
 <div>
   <BackgroundImage/>
-  <md-tabs md-alignment="centered" :md-active-tab="$API.current_window">
+  <md-tabs md-alignment="centered" :md-active-tab="$API.current_window" :md-swipeable="true">
     <MainView/>
     <RulesView/>
     <ServersView/>
@@ -19,8 +19,8 @@
 import RulesView from "@/components/TabsMenuElements/RulesView/RulesView.vue";
 import ServersView from "@/components/TabsMenuElements/ServersView/ServersView.vue";
 import ProfileView from "@/components/TabsMenuElements/ProfileView/ProfileView.vue";
-import VipView from "@/components/VipView/VipView.vue";
-import AboutView from "@/components/TabsMenuElements/AboutView.vue";
+import VipView from "@/components/TabsMenuElements/VipView/VipView.vue";
+import AboutView from "@/components/TabsMenuElements/AboutView/AboutView.vue";
 import EmptyTab from "@/components/TabsMenuElements/EmptyTab.vue";
 import MainView from "@/components/TabsMenuElements/MainView/MainView.vue";
 import BackendStatus from "@/components/TabsMenuElements/BackendStatus/BackendStatus.vue";
diff --git a/src/components/TabsMenuElements/AboutView.vue b/src/components/TabsMenuElements/AboutView.vue
deleted file mode 100644
index 8f16777..0000000
--- a/src/components/TabsMenuElements/AboutView.vue
+++ /dev/null
@@ -1,11 +0,0 @@
-<template>
-  <md-tab id="aboutView" md-label="О нас">
-    <p>about</p>
-  </md-tab>
-</template>
-
-<script>
-export default {
-  name: 'AboutView'
-}
-</script>
\ No newline at end of file
diff --git a/src/components/TabsMenuElements/AboutView/AboutView.vue b/src/components/TabsMenuElements/AboutView/AboutView.vue
new file mode 100644
index 0000000..31ebf6d
--- /dev/null
+++ b/src/components/TabsMenuElements/AboutView/AboutView.vue
@@ -0,0 +1,67 @@
+<template>
+  <md-tab id="aboutView" md-label="О нас">
+    <div class="md-layout md-alignment-bottom-center">
+      <CharacterImage :size="10" :hide_if_small="true" :img_src="require(`@/assets/images/characters/engi_n.png`)" :audio_src="require(`@/assets/sounds/nigger.mp3`)"/>
+    </div>
+    <div class="md-layout md-alignment-bottom-center">
+      <div class="md-layout-item md-size-15 md-small-size-100 md-alignment-bottom-center rounded-and-colored" style="z-index: 1">
+        <h3 style="text-align: center; margin-top: 1%; margin-bottom: 0%; line-height: 1em">О нас</h3>
+      </div>
+    </div>
+    <div class="md-layout md-alignment-bottom-center" style="margin-top: -1.5%">
+      <div class="md-layout-item md-size-40 md-small-size-100 md-alignment-bottom-center rounded-only">
+        <h4 style="text-align: center; margin-top: 5%; margin-bottom: 0%">Кто мы?</h4>
+        <p class="about-p" style="text-align: center; margin-top: 0%">и что мы делаем в вашем списке серверов?</p>
+        <hr width="80%">
+        <div class="md-layout md-alignment-top-center">
+          <div class="md-layout-item md-size-45 md-small-size-45 md-medium-hide md-large-size-45" style="padding: 0% 2.5%">
+            <img class="about-img" :src="require('@/assets/images/about/image3.png')">
+            <img class="about-img" :src="require('@/assets/images/about/image4.png')">
+          </div>
+          <div class="md-layout-item md-size-45 md-medium-size-90" style="padding: 0% 2.5%">
+            <p class="about-p">Факты 13 — это дружный сервачок русского народа, где вы можете хорошо отдохнуть со своими друзьями или тупыми рандомами после школы или завода.</p>
+            <hr width="50%" align="right">
+            <p class="about-p">У нас обширный список серверов, на котором стоят уникальные карты, сделанные картоделом Русский Путин</p>
+            <hr width="50%" align="right">
+            <p class="about-p">Прекрасные плагины недающие заскучать и написанные таким же прекрасным кодером ОТДЫХАЕМ</p>
+            <hr width="50%" align="right">
+            <p class="about-p">Посмотреть наши смешные до усрачки посты можно в Дискорде или в группе ВК, а так-же посетить мертвую группу стим</p>
+            <div align="right">
+              <DiscordSvg :inline="true" :h="'2em'" :w="'2em'" :url="'https://tf2.pblr-nyk.pro/discord'" style="margin: 0% 1%"/>
+              <VkSvg :inline="true" :h="'2em'" :w="'2em'" :url="'https://tf2.pblr-nyk.pro/vk'" style="margin: 0% 1%"/>
+              <SteamSvg :inline="true" :h="'2em'" :w="'2em'" :url="'https://tf2.pblr-nyk.pro/steam'" style="margin: 0% 1%"/>
+            </div>
+            <hr width="50%" align="right">
+            <p class="about-p">Зачем ждать? Заходи сейчас! Если админ не разлил пиво на сервера</p>
+          </div>
+        </div>
+        <hr width="80%">
+      </div>
+    </div>
+  </md-tab>
+</template>
+
+<script>
+import SteamSvg from "@/components/Others/CustomSvg/SteamSvg.vue";
+import DiscordSvg from "@/components/Others/CustomSvg/DiscordSvg.vue";
+import VkSvg from "@/components/Others/CustomSvg/VkSvg.vue";
+import CharacterImage from "@/components/Others/CharacterImage.vue";
+
+export default {
+  name: 'AboutView',
+  components: {CharacterImage, VkSvg, DiscordSvg, SteamSvg}
+}
+</script>
+
+<style>
+.about-p {
+  text-align: right;
+  font-family: tf2secondary;
+  color: black
+}
+
+.about-img {
+  padding: 5% 0%;
+  border-radius: 15px;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/VipView/Components/VipBuyDialog.vue b/src/components/TabsMenuElements/VipView/Components/VipBuyDialog.vue
similarity index 100%
rename from src/components/VipView/Components/VipBuyDialog.vue
rename to src/components/TabsMenuElements/VipView/Components/VipBuyDialog.vue
diff --git a/src/components/VipView/Components/VipCard.vue b/src/components/TabsMenuElements/VipView/Components/VipCard.vue
similarity index 94%
rename from src/components/VipView/Components/VipCard.vue
rename to src/components/TabsMenuElements/VipView/Components/VipCard.vue
index c69b562..debb507 100644
--- a/src/components/VipView/Components/VipCard.vue
+++ b/src/components/TabsMenuElements/VipView/Components/VipCard.vue
@@ -19,7 +19,7 @@
 </template>
 
 <script>
-import VipBuyDialog from "@/components/VipView/Components/VipBuyDialog.vue";
+import VipBuyDialog from "@/components/TabsMenuElements/VipView/Components/VipBuyDialog.vue";
 
 export default {
   name: 'VipCard',
diff --git a/src/components/VipView/VipView.vue b/src/components/TabsMenuElements/VipView/VipView.vue
similarity index 97%
rename from src/components/VipView/VipView.vue
rename to src/components/TabsMenuElements/VipView/VipView.vue
index ff38b6b..d6112e1 100644
--- a/src/components/VipView/VipView.vue
+++ b/src/components/TabsMenuElements/VipView/VipView.vue
@@ -39,7 +39,7 @@
 </template>
 
 <script>
-import VipCard from "@/components/VipView/Components/VipCard.vue";
+import VipCard from "@/components/TabsMenuElements/VipView/Components/VipCard.vue";
 import CharacterImage from "@/components/Others/CharacterImage.vue";
 
 export default {