diff --git a/app/assets/images/logo_text_tr.png b/app/assets/images/logo_text_tr.png
new file mode 100644
index 0000000..fdb32ee
Binary files /dev/null and b/app/assets/images/logo_text_tr.png differ
diff --git a/app/assets/stylesheets/gitlab_bootstrap.scss b/app/assets/stylesheets/gitlab_bootstrap.scss
index af319b5..839ee64 100644
--- a/app/assets/stylesheets/gitlab_bootstrap.scss
+++ b/app/assets/stylesheets/gitlab_bootstrap.scss
@@ -403,7 +403,7 @@ form {
   margin-bottom: 40px;
   @include round-borders-all(4px);
   @include shade;
-  border-color:#CCC;
+  border-color:#DDD;
 
   ul { 
     margin:0;
diff --git a/app/assets/stylesheets/main.scss b/app/assets/stylesheets/main.scss
index 2310856..851d429 100644
--- a/app/assets/stylesheets/main.scss
+++ b/app/assets/stylesheets/main.scss
@@ -74,12 +74,17 @@ $hover: #FDF5D9;
  * - main menu styles
  *
  */
-@import "ui_basic.scss";
+@import "themes/ui_basic.scss";
 
 /**
  * UI mars theme
  */
-@import "ui_mars.scss";
+@import "themes/ui_mars.scss";
+
+/**
+ * UI Modern theme
+ */
+@import "themes/ui_modern.scss";
 
 /**
  * Gitlab bootstrap.
diff --git a/app/assets/stylesheets/themes/ui_basic.scss b/app/assets/stylesheets/themes/ui_basic.scss
new file mode 100644
index 0000000..16517dc
--- /dev/null
+++ b/app/assets/stylesheets/themes/ui_basic.scss
@@ -0,0 +1,122 @@
+/**
+ * This file represent some UI that can be changed 
+ * during web app restyle or theme select. 
+ * 
+ * Next items should be placed there
+ * - link colors
+ * - header styles
+ * - main menu styles
+ *
+ */
+.ui_basic { 
+  /*
+   * Common styles
+   *
+   */
+  a {
+    color: $link_color;
+    &:hover { 
+      text-decoration:none; 
+      color: $blue_link;
+    }
+  }
+
+
+  /*
+   *  Application Header
+   *
+   */
+  header { 
+    width:100%;
+    padding:0;
+    margin:0;
+    top:1px;
+    left:0;
+    background: #F1F1F1; /* for non-css3 browsers */
+    border-bottom: 1px solid #ccc; 
+    box-shadow: 0 -1px 0 white inset;
+    -moz-box-shadow: 0 -1px 0 white inset;
+    -webkit-box-shadow: 0 -1px 0 white inset;
+    z-index:10;
+    height:60px;
+
+    .app_logo {
+      width:230px;
+      float:left;
+      position:relative;
+      top:-5px;
+
+      a { 
+        float:left;
+
+        h1 { 
+          text-indent:-9999px;
+          width:102px;
+          background: url('logo_text.png') no-repeat 0px -3px;
+          float:left;
+          margin-left:5px;
+          font-size:20px;
+          line-height:36px;
+          font-weight:bold;
+          color:#aaa;
+          text-shadow: 0 1px 1px #FFF;
+          padding-left:50px;
+        }
+      }
+      .separator {
+        margin-left:20px;
+        float: left;
+        height: 60px;
+        width: 1px;
+        background: white;
+        border-left: 1px solid #DDD;
+        margin-top: -10px;
+      }
+    }
+    .container { 
+      .top_panel_content { 
+        margin:auto;
+        position:relative;
+        padding:15px 0;
+      }
+    }
+
+    .project_name {
+      float:left;
+      margin:0;
+      margin-right:30px;
+      font-size:20px;
+      line-height:36px;
+      font-weight:bold;
+      color:$style_color;
+      text-shadow: 0 1px 1px #FFF;
+    }
+
+    .fbtn { 
+      float: right;
+      margin-right:10px;
+      .btn { 
+        margin-left:8px;
+      }
+    }
+
+    .search { 
+      float: right;
+      margin-right: 55px;
+
+      .search-input { 
+        width:130px;
+        background-image: url("icon-search.png");
+        background-repeat: no-repeat;
+        background-position: 10px;
+        padding-left:25px;
+        @include border-radius(5px);
+        border:1px solid #ccc;
+      }
+    }
+  }
+  /*
+   *  End of Application Header
+   *
+   */
+}
diff --git a/app/assets/stylesheets/themes/ui_mars.scss b/app/assets/stylesheets/themes/ui_mars.scss
new file mode 100644
index 0000000..feb02e1
--- /dev/null
+++ b/app/assets/stylesheets/themes/ui_mars.scss
@@ -0,0 +1,121 @@
+/**
+ * This file represent some UI that can be changed 
+ * during web app restyle or theme select. 
+ * 
+ * Next items should be placed there
+ * - link colors
+ * - header styles
+ * - main menu styles
+ *
+ */
+.ui_mars {
+
+  /*
+   *  Application Header
+   *
+   */
+  header { 
+    width:100%;
+    padding:0;
+    margin:0;
+    top:1px;
+    left:0;
+    background: #474D57 url('bg-header.png') repeat-x bottom;
+    z-index:10;
+    height:60px;
+
+    .fbtn { 
+      float: right;
+      margin-right:10px;
+      .btn { 
+        margin-left:8px;
+        background-image: -webkit-gradient(linear, 0 0, 0 30, color-stop(0.066, #595D63), to(#31363E));
+        background-image: -webkit-linear-gradient(#595D63 6.6%, #31363E);
+        background-image: -moz-linear-gradient(#595D63 6.6%, #31363E);
+        background-image: -o-linear-gradient(#595D63 6.6%, #31363E);
+        font-size: 12px;
+        &:hover { 
+          background-image: -webkit-gradient(linear, 0 0, 0 30, color-stop(0.066, #595D63), to(#2C2F35));
+          background-image: -webkit-linear-gradient(#595D63 6.6%, #2C2F35);
+          background-image: -moz-linear-gradient(#595D63 6.6%, #202227);
+          background-image: -o-linear-gradient(#595D63 6.6%, #202227);
+          background-position:0 0;
+        }
+
+        border: 1px solid #31363E;
+        color:#D6DADF;
+        text-shadow: 0 -1px 0 #000000;
+      }
+    }
+    .search { 
+      float: right;
+      margin-right: 55px;
+      .search-input { 
+        background-image:url("icon-search.png");
+        float: right;
+        text-shadow: none;
+        width: 130px;
+        background-image: url("icon-search.png");
+        background-repeat: no-repeat;
+        background-position: 10px;
+        border-radius: 100px;
+        border: 1px solid rgba(0, 0, 0, 0.7);
+        box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2), 0 2px 2px rgba(0, 0, 0, 0.4) inset;
+        background-color: #D2D5DA;
+        background-color: rgba(255, 255, 255, 0.5);
+        padding: 5px;
+        padding-left: 26px;
+
+        &:focus {
+          background-color: white;
+        }
+      }
+    }
+    .search-input::-webkit-input-placeholder {
+      color: #666;
+    }
+    .app_logo {
+      width:230px;
+      float:left;
+      position:relative;
+      top:-5px;
+
+      a { 
+        float:left;
+
+        h1 { 
+          background: url('images.png') no-repeat -3px -6px;
+          width: 65px;
+          height: 26px;
+          margin: 6px 0;
+          padding: 0;
+          float: left;
+          text-indent: -1000em;
+          float:left;
+        }
+      }
+    }
+    .project_name {
+      float:left;
+      margin:0;
+      margin-right:30px;
+      font-size:20px;
+      line-height:38px;
+      font-weight:bold;
+      color:#fff;
+      text-shadow: 0 1px 1px #111;
+    }
+
+    .container { 
+      .top_panel_content { 
+        margin:auto;
+        position:relative;
+        padding:15px 0;
+      }
+    }
+  }
+  /*
+   *  End of Application Header
+   *
+   */
+}
diff --git a/app/assets/stylesheets/themes/ui_modern.scss b/app/assets/stylesheets/themes/ui_modern.scss
new file mode 100644
index 0000000..cb55bcc
--- /dev/null
+++ b/app/assets/stylesheets/themes/ui_modern.scss
@@ -0,0 +1,143 @@
+/**
+ * This file represent some UI that can be changed 
+ * during web app restyle or theme select. 
+ * 
+ * Next items should be placed there
+ * - link colors
+ * - header styles
+ * - main menu styles
+ *
+ */
+.ui_modern { 
+
+  background:#eee;
+
+  > .container { 
+    background:#FFF;
+    border: 1px solid #ccc;
+    padding:20px;
+    margin-top:30px;
+    -moz-box-shadow: 0 0 1px 1px #E3E3E3;
+    -webkit-box-shadow: 0 0 1px 1px #E3E3E3;
+    box-shadow: 0 0 1px 1px #E3E3E3;
+  }
+
+  nav.main_menu { 
+    position: absolute;
+    width: 100%;
+    left: 0;
+    top: 35px;
+    @include border-radius(0px);
+
+    a.current { 
+      border-bottom:none;
+    }
+  }
+
+  .commit-box, .issue_form_box {
+    margin-top: 0px;
+  }
+
+  .ui-box { 
+    @include border-radius(0px);
+  }
+
+  /*
+   * Common styles
+   *
+   */
+  a {
+    color: $link_color;
+    &:hover { 
+      text-decoration:none; 
+      color: $blue_link;
+    }
+  }
+
+
+  /*
+   *  Application Header
+   *
+   */
+  header { 
+    width:100%;
+    padding:0;
+    margin:0;
+    top:1px;
+    left:0;
+    background: #FFF; /* for non-css3 browsers */
+    z-index:10;
+    height:100px;
+
+    .app_logo {
+      float:left;
+      position:relative;
+      top:-5px;
+
+      a { 
+        float:left;
+
+        h1 { 
+
+          left: -30px;
+          position: relative;
+          text-indent:-9999px;
+          width:112px;
+          background: url('logo_text_tr.png') no-repeat 0px 0;
+          float:left;
+          font-size:20px;
+          line-height:36px;
+          font-weight:bold;
+          color:#aaa;
+          text-shadow: 0 1px 1px #FFF;
+          padding-left:50px;
+        }
+      }
+    }
+    .container { 
+      .top_panel_content { 
+        margin:auto;
+        position:relative;
+        padding:15px 0;
+      }
+    }
+
+    .project_name {
+      float:left;
+      margin:0;
+      margin-right:30px;
+      font-size:20px;
+      line-height:36px;
+      font-weight:bold;
+      color:$style_color;
+      text-shadow: 0 1px 1px #FFF;
+    }
+
+    .fbtn { 
+      float: right;
+      margin-right:10px;
+      .btn { 
+        margin-left:8px;
+      }
+    }
+
+    .search { 
+      float: right;
+      margin-right: 55px;
+
+      .search-input { 
+        width:130px;
+        background-image: url("icon-search.png");
+        background-repeat: no-repeat;
+        background-position: 10px;
+        padding-left:25px;
+        @include border-radius(5px);
+        border:1px solid #ccc;
+      }
+    }
+  }
+  /*
+   *  End of Application Header
+   *
+   */
+}
diff --git a/app/assets/stylesheets/ui_basic.scss b/app/assets/stylesheets/ui_basic.scss
deleted file mode 100644
index 16517dc..0000000
--- a/app/assets/stylesheets/ui_basic.scss
+++ /dev/null
@@ -1,122 +0,0 @@
-/**
- * This file represent some UI that can be changed 
- * during web app restyle or theme select. 
- * 
- * Next items should be placed there
- * - link colors
- * - header styles
- * - main menu styles
- *
- */
-.ui_basic { 
-  /*
-   * Common styles
-   *
-   */
-  a {
-    color: $link_color;
-    &:hover { 
-      text-decoration:none; 
-      color: $blue_link;
-    }
-  }
-
-
-  /*
-   *  Application Header
-   *
-   */
-  header { 
-    width:100%;
-    padding:0;
-    margin:0;
-    top:1px;
-    left:0;
-    background: #F1F1F1; /* for non-css3 browsers */
-    border-bottom: 1px solid #ccc; 
-    box-shadow: 0 -1px 0 white inset;
-    -moz-box-shadow: 0 -1px 0 white inset;
-    -webkit-box-shadow: 0 -1px 0 white inset;
-    z-index:10;
-    height:60px;
-
-    .app_logo {
-      width:230px;
-      float:left;
-      position:relative;
-      top:-5px;
-
-      a { 
-        float:left;
-
-        h1 { 
-          text-indent:-9999px;
-          width:102px;
-          background: url('logo_text.png') no-repeat 0px -3px;
-          float:left;
-          margin-left:5px;
-          font-size:20px;
-          line-height:36px;
-          font-weight:bold;
-          color:#aaa;
-          text-shadow: 0 1px 1px #FFF;
-          padding-left:50px;
-        }
-      }
-      .separator {
-        margin-left:20px;
-        float: left;
-        height: 60px;
-        width: 1px;
-        background: white;
-        border-left: 1px solid #DDD;
-        margin-top: -10px;
-      }
-    }
-    .container { 
-      .top_panel_content { 
-        margin:auto;
-        position:relative;
-        padding:15px 0;
-      }
-    }
-
-    .project_name {
-      float:left;
-      margin:0;
-      margin-right:30px;
-      font-size:20px;
-      line-height:36px;
-      font-weight:bold;
-      color:$style_color;
-      text-shadow: 0 1px 1px #FFF;
-    }
-
-    .fbtn { 
-      float: right;
-      margin-right:10px;
-      .btn { 
-        margin-left:8px;
-      }
-    }
-
-    .search { 
-      float: right;
-      margin-right: 55px;
-
-      .search-input { 
-        width:130px;
-        background-image: url("icon-search.png");
-        background-repeat: no-repeat;
-        background-position: 10px;
-        padding-left:25px;
-        @include border-radius(5px);
-        border:1px solid #ccc;
-      }
-    }
-  }
-  /*
-   *  End of Application Header
-   *
-   */
-}
diff --git a/app/assets/stylesheets/ui_mars.scss b/app/assets/stylesheets/ui_mars.scss
deleted file mode 100644
index feb02e1..0000000
--- a/app/assets/stylesheets/ui_mars.scss
+++ /dev/null
@@ -1,121 +0,0 @@
-/**
- * This file represent some UI that can be changed 
- * during web app restyle or theme select. 
- * 
- * Next items should be placed there
- * - link colors
- * - header styles
- * - main menu styles
- *
- */
-.ui_mars {
-
-  /*
-   *  Application Header
-   *
-   */
-  header { 
-    width:100%;
-    padding:0;
-    margin:0;
-    top:1px;
-    left:0;
-    background: #474D57 url('bg-header.png') repeat-x bottom;
-    z-index:10;
-    height:60px;
-
-    .fbtn { 
-      float: right;
-      margin-right:10px;
-      .btn { 
-        margin-left:8px;
-        background-image: -webkit-gradient(linear, 0 0, 0 30, color-stop(0.066, #595D63), to(#31363E));
-        background-image: -webkit-linear-gradient(#595D63 6.6%, #31363E);
-        background-image: -moz-linear-gradient(#595D63 6.6%, #31363E);
-        background-image: -o-linear-gradient(#595D63 6.6%, #31363E);
-        font-size: 12px;
-        &:hover { 
-          background-image: -webkit-gradient(linear, 0 0, 0 30, color-stop(0.066, #595D63), to(#2C2F35));
-          background-image: -webkit-linear-gradient(#595D63 6.6%, #2C2F35);
-          background-image: -moz-linear-gradient(#595D63 6.6%, #202227);
-          background-image: -o-linear-gradient(#595D63 6.6%, #202227);
-          background-position:0 0;
-        }
-
-        border: 1px solid #31363E;
-        color:#D6DADF;
-        text-shadow: 0 -1px 0 #000000;
-      }
-    }
-    .search { 
-      float: right;
-      margin-right: 55px;
-      .search-input { 
-        background-image:url("icon-search.png");
-        float: right;
-        text-shadow: none;
-        width: 130px;
-        background-image: url("icon-search.png");
-        background-repeat: no-repeat;
-        background-position: 10px;
-        border-radius: 100px;
-        border: 1px solid rgba(0, 0, 0, 0.7);
-        box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2), 0 2px 2px rgba(0, 0, 0, 0.4) inset;
-        background-color: #D2D5DA;
-        background-color: rgba(255, 255, 255, 0.5);
-        padding: 5px;
-        padding-left: 26px;
-
-        &:focus {
-          background-color: white;
-        }
-      }
-    }
-    .search-input::-webkit-input-placeholder {
-      color: #666;
-    }
-    .app_logo {
-      width:230px;
-      float:left;
-      position:relative;
-      top:-5px;
-
-      a { 
-        float:left;
-
-        h1 { 
-          background: url('images.png') no-repeat -3px -6px;
-          width: 65px;
-          height: 26px;
-          margin: 6px 0;
-          padding: 0;
-          float: left;
-          text-indent: -1000em;
-          float:left;
-        }
-      }
-    }
-    .project_name {
-      float:left;
-      margin:0;
-      margin-right:30px;
-      font-size:20px;
-      line-height:38px;
-      font-weight:bold;
-      color:#fff;
-      text-shadow: 0 1px 1px #111;
-    }
-
-    .container { 
-      .top_panel_content { 
-        margin:auto;
-        position:relative;
-        padding:15px 0;
-      }
-    }
-  }
-  /*
-   *  End of Application Header
-   *
-   */
-}
diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb
index 85595c1..6b9e457 100644
--- a/app/helpers/application_helper.rb
+++ b/app/helpers/application_helper.rb
@@ -85,11 +85,6 @@ module ApplicationHelper
   end
 
   def app_theme
-    if current_user && current_user.theme_id == 1
-      "ui_basic"
-    else
-      "ui_mars"
-    end
+    Gitlab::Theme.css_class_by_id(current_user.try(:theme_id))
   end
-
 end
diff --git a/app/views/profile/design.html.haml b/app/views/profile/design.html.haml
index 1942e83..ff6ae7f 100644
--- a/app/views/profile/design.html.haml
+++ b/app/views/profile/design.html.haml
@@ -10,6 +10,10 @@
       = label_tag do
         = f.radio_button :theme_id, 2
         Classic
+
+      = label_tag do
+        = f.radio_button :theme_id, 3
+        Modern
     %br
   %h3 Code review
   %hr
diff --git a/app/views/refs/_tree_file.html.haml b/app/views/refs/_tree_file.html.haml
index 201028d..ee56ab3 100644
--- a/app/views/refs/_tree_file.html.haml
+++ b/app/views/refs/_tree_file.html.haml
@@ -21,8 +21,7 @@
             = preserve do
               = raw file.colorize(options: { linenos: 'True'})
         - else
-          %h3
-            %center Empty file
+          %h4.nothing_here_message Empty file
   - elsif file.image?
     .view_file_content_image
       %img{ :src => "data:#{file.mime_type};base64,#{Base64.encode64(file.data)}"}
diff --git a/lib/gitlab/theme.rb b/lib/gitlab/theme.rb
new file mode 100644
index 0000000..6e2be76
--- /dev/null
+++ b/lib/gitlab/theme.rb
@@ -0,0 +1,15 @@
+module Gitlab
+  class Theme
+    def self.css_class_by_id(id)
+      themes = { 
+        1 => "ui_basic",
+        2 => "ui_mars",
+        3 => "ui_modern"
+      }
+
+      id ||= 1
+
+      return themes[id]
+    end
+  end
+end
--
libgit2 0.21.2