diff --git a/public/assets/css/dash/settings.css b/public/assets/css/dash/settings.css
index 5c2bddc..d2509d2 100644
--- a/public/assets/css/dash/settings.css
+++ b/public/assets/css/dash/settings.css
@@ -251,17 +251,62 @@ section#site-features > div.site-maintenance {
   color: var(--primary);
 }
 
-section[class="member-settings"] > div[class="theme"] button[data-enabled="true"] {
-  color: var(--white);
-  background: var(--secondary-highlight);
+/*
+    SITE FEATURES TAB
+*/
+
+section#site-themes > button {
+  background: var(--secondary);
   display: inline-block;
   border-radius: 3px;
   padding: 3px;
-  width: 83%;
-  margin-right: 5px;
+  width: 250px;
+  height: 200px;
+  margin: 10px 0;
 }
 
-section[class="member-settings"] > div[class="theme"] a {
+section#site-themes > button > div {
+  height: 145px;
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  top: -10px;
+  position: relative;
+  border-radius: 3px;
+}
+
+section#site-themes > button[data-enabled="true"] > div {
+  background: var(--secondary-highlight);
+  color: var(--secondary);
+}
+
+section#site-themes > button[data-enabled="true"] label {
+  color: var(--primary);
+}
+
+section#site-themes > button[data-enabled="false"] > div {
+  background: var(--primary);
+  color: var(--secondary);
+}
+
+section#site-themes > button[data-enabled="false"] label {
+  color: var(--secondary);
+}
+
+section#site-themes > button[data-enabled="true"] > svg {
+  fill: var(--primary);
+  position: relative;
+  top: 5px;
+}
+
+section#site-themes > button[data-enabled="false"] > svg {
+  fill: var(--primary);
+  position: relative;
+  top: 5px;
+}
+
+section#site-themes > a {
   background: var(--secondary-highlight);
   display: inline-block;
   width: 15%;
@@ -269,15 +314,8 @@ section[class="member-settings"] > div[class="theme"] a {
   text-align: center;
   vertical-align: top;
   top: 13px;
-  position: relative;
-}
-
-section[class="member-settings"] > div[class="theme"] button[data-enabled="false"] {
-  color: var(--primary);
-  background: var(--secondary);
-  display: block;
-  border-radius: 3px;
-  padding: 3px;
+  position: absolute;
+  z-index: 30;
 }
 
 section[class="data-settings"] {
diff --git a/public/assets/scripts/dash/app/controllers/SettingsIndex.js b/public/assets/scripts/dash/app/controllers/SettingsIndex.js
index dec9d88..5e7f0fe 100644
--- a/public/assets/scripts/dash/app/controllers/SettingsIndex.js
+++ b/public/assets/scripts/dash/app/controllers/SettingsIndex.js
@@ -170,9 +170,19 @@ export default class SettingsIndex {
 		e.preventDefault();
 		let themes = document.querySelectorAll('.theme-select');
 		for (var i = 0, length = themes.length; i < length; i++) {
-			e.target.id == themes[i].id
-				? themes[i].setAttribute('data-enabled', 'true')
-				: themes[i].setAttribute('data-enabled', 'false');
+			let theme = e.target.id;
+			if (e.target.id == '') {
+				theme = e.target.getAttribute('for');
+			}
+			if (theme == themes[i].id) {
+				themes[i].setAttribute('data-enabled', 'true');
+				document.getElementById('label-' + themes[i].id).innerHTML =
+					'ACTIVE THEME';
+			} else {
+				themes[i].setAttribute('data-enabled', 'false');
+				document.getElementById('label-' + themes[i].id).innerHTML =
+					'INACTIVE THEME';
+			}
 		}
 	}
 	handleMailOptions(e) {
diff --git a/resources/views/back/settings.blade.php b/resources/views/back/settings.blade.php
index 0426858..2269a9e 100644
--- a/resources/views/back/settings.blade.php
+++ b/resources/views/back/settings.blade.php
@@ -43,7 +43,7 @@
 
                 </div>
             </section>
-            <section id="site-features" class="section-tab show">
+            <section id="site-features" class="section-tab hide">
                 <div class="features-mail">
                     <label>SYSTEM EMAIL</label>
                     <div>
@@ -142,28 +142,33 @@
                     </div>
                 </div>
             </section>
-            <section id="site-themes" class="section-tab hide">
-                MEMBER THEMES
-                <div class="theme">
-                    <label>Themes</label><br/>
-                    @foreach($themes as $theme)
-                        @if($theme['name'] == $currentTheme)
-                            <button id="{{ $theme['name'] }}" class="theme-select" data-enabled="true">
-                                <svg id="nav-menu-icon" class="icon">
-                                    <use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-palette"/>
-                                </svg>
-                                <span>{{ $theme['display-name'] }}</span>
-                            </button><a target="_blank" href='/theme'>Edit</a>
-                        @else
-                            <button href="#" id="{{ $theme['name'] }}" class="theme-select" data-enabled="false">
-                                <svg id="nav-menu-icon" class="icon">
-                                    <use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-palette"/>
-                                </svg>
-                                <span>{{ $theme['display-name'] }}</span>
-                            </button>
-                        @endif
-                    @endforeach
-                </div>
+            <section id="site-themes" class="section-tab show">
+                @foreach($themes as $theme)
+                    @if($theme['name'] == $currentTheme)
+                        <!--
+                        <a target="_blank" href='/theme'>Edit</a>
+                        -->
+                        <button id="{{ $theme['name'] }}" class="theme-select" data-enabled="true">
+                            <div for="{{ $theme['name'] }}">
+                                <label id="label-{{ $theme['name'] }}">ACTIVE THEME</label>
+                            </div>
+                            <svg id="nav-menu-icon" class="icon">
+                                <use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-palette"/>
+                            </svg>
+                            <span for="{{ $theme['name'] }}">{{ $theme['display-name'] }}</span>
+                        </button>
+                    @else
+                        <button id="{{ $theme['name'] }}" class="theme-select" data-enabled="false">
+                            <div for="{{ $theme['name'] }}">
+                                <label id="label-{{ $theme['name'] }}">INACTIVE THEME</label>
+                            </div>
+                            <svg id="nav-menu-icon" class="icon">
+                                <use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-palette"/>
+                            </svg>
+                            <span for="{{ $theme['name'] }}">{{ $theme['display-name'] }}</span>
+                        </button>
+                    @endif
+                @endforeach
             </section>
         </section>
     </article>