diff --git a/Vocaluxe/Website/css/style.css b/Vocaluxe/Website/css/style.css
index 585e930c..19f6762c 100644
--- a/Vocaluxe/Website/css/style.css
+++ b/Vocaluxe/Website/css/style.css
@@ -91,3 +91,31 @@
     cursor: pointer;
 }
 
+#logo {
+    display: block;
+    margin-left: auto;
+    margin-right: auto;
+    margin-top: 10px;
+    margin-bottom: 10px;
+    width: 219px;
+    height:40px;
+}
+
+.ui-bar-b {
+  border: 1px solid #000;
+    border-top-width: 1px;
+    border-right-width: 1px;
+    border-bottom-width: 1px;
+    border-left-width: 1px;
+  background: #000;
+    background-image: none;
+  color: #fff;
+  font-weight: 700;
+  text-shadow: 0 1px 0 #3e6790;
+  background-image: -webkit-gradient(linear,left top,left bottom,from(#000000),to(#000000));
+  background-image: -webkit-linear-gradient(#000000,#000000);
+  background-image: -moz-linear-gradient(#000000,#000000);
+  background-image: -ms-linear-gradient(#000000,#000000);
+  background-image: -o-linear-gradient(#000000,#000000);
+  background-image: linear-gradient(#000000,#000000);
+}
diff --git a/Vocaluxe/Website/img/logo.png b/Vocaluxe/Website/img/logo.png
new file mode 100644
index 00000000..82d8afef
Binary files /dev/null and b/Vocaluxe/Website/img/logo.png differ
diff --git a/Vocaluxe/Website/index.html b/Vocaluxe/Website/index.html
index a8ce4b15..633c409f 100644
--- a/Vocaluxe/Website/index.html
+++ b/Vocaluxe/Website/index.html
@@ -60,7 +60,7 @@
 
     <div id="main" data-role="page" data-content-theme="a" data-add-back-btn="false">
         <div data-role="header">
-            <h1>Vocaluxe</h1>
+            <img id="logo" src="img/logo.png" alt="Vocaluxe logo">
         </div>
         <!-- /header -->