3 files changed, 113 insertions, 63 deletions
diff --git a/assets/less/site.less b/assets/less/site.less
index d9431553e..3c1c799a4 100644
--- a/assets/less/site.less
+++ b/assets/less/site.less
@@ -18,7 +18,7 @@
 @import "site/footer";
 @import "site/lazy";
 @import "site/textured-bg";
-@import "site/fonticons";
+@import "site/banner-ad";
 @import "site/fusion-ad";
 @import "site/bsap-ad";
 
diff --git a/assets/less/site/banner-ad.less b/assets/less/site/banner-ad.less
new file mode 100644
index 000000000..df478c049
--- /dev/null
+++ b/assets/less/site/banner-ad.less
@@ -0,0 +1,112 @@
+#banner {
+  color: #fff;
+  .message-container {
+    display: table;
+    width: auto;
+    margin: 0 auto;
+    padding: 15px 0;
+  }
+  .tagline, .action {
+    display: table-cell;
+    vertical-align: middle;
+  }
+  .tagline {
+    font-weight: 200;
+    font-size: 16px;
+    padding-right: 20px;
+  }
+
+  &.black-tie {
+    @black-tie-bg: #222222;
+    background-color: @black-tie-bg;
+    border-bottom: solid 1px mix(@black-tie-bg, #fff, 95%);
+
+    .btn-primary {
+      @color: @black-tie-bg;
+      @background: mix(#fff,@black-tie-bg,90%);
+      @border: mix(#fff,@black-tie-bg,60%);
+      font-weight: bold;
+      color: @color;
+      background-color: @background;
+      border-color: @border;
+      border-bottom-width: 2px;
+      text-shadow: none;
+      border-radius: 4px;
+
+      &:hover,
+      &:focus,
+      &:active,
+      &.active,
+      .open > &.dropdown-toggle {
+        color: #fff;
+        background-color: darken(@border, 3%);
+        border-color: darken(@border, 12%);
+        border-bottom-color: darken(@border, 18%);
+      }
+      &:active,
+      &.active,
+      .open > &.dropdown-toggle {
+        background-image: none;
+      }
+      &.disabled,
+      &[disabled],
+      fieldset[disabled] & {
+        &,
+        &:hover,
+        &:focus,
+        &:active,
+        &.active {
+          background-color: @background;
+          border-color: @border;
+        }
+      }
+    }
+  }
+
+  &.fonticons {
+    @fonticons-bg: #1c1e29;
+    @fonticons-orange: desaturate(#ff7f3f, 5%);
+    background-color: @fonticons-orange;
+    border-bottom: solid 1px mix(@fonticons-bg, @fonticons-orange, 15%);
+    .btn-primary {
+      @color: #fff;
+      @background: mix(#fff,@fonticons-bg,10%);
+      @border: @fonticons-bg;
+      font-weight: bold;
+      color: @color;
+      background-color: @background;
+      border-color: @border;
+      border-bottom-width: 2px;
+      text-shadow: none;
+      border-radius: 4px;
+
+      &:hover,
+      &:focus,
+      &:active,
+      &.active,
+      .open > &.dropdown-toggle {
+        color: #fff;
+        background-color: darken(@border, 3%);
+        border-color: darken(@border, 12%);
+        border-bottom-color: darken(@border, 18%);
+      }
+      &:active,
+      &.active,
+      .open > &.dropdown-toggle {
+        background-image: none;
+      }
+      &.disabled,
+      &[disabled],
+      fieldset[disabled] & {
+        &,
+        &:hover,
+        &:focus,
+        &:active,
+        &.active {
+          background-color: @background;
+          border-color: @border;
+        }
+      }
+    }
+  }
+}
diff --git a/assets/less/site/fonticons.less b/assets/less/site/fonticons.less
deleted file mode 100644
index 2caada1c3..000000000
--- a/assets/less/site/fonticons.less
+++ /dev/null
@@ -1,62 +0,0 @@
-.fonticons {
-  @fonticons-bg: #1c1e29;
-  @fonticons-orange: desaturate(#ff7f3f, 5%);
-  background-color: @fonticons-orange;
-  color: #fff;
-  padding: 10px 0;
-  border-bottom: solid 1px mix(@fonticons-bg, @fonticons-orange, 15%);
-  .message-container {
-    display: table;
-    width: auto;
-    margin: 0 auto;
-  }
-  .tagline, .action {
-    display: table-cell;
-    vertical-align: middle;
-  }
-  .tagline {
-    font-weight: 200;
-    font-size: 16px;
-    padding-right: 20px;
-  }
-  .btn-primary {
-    @color: #fff;
-    @background: mix(#fff,@fonticons-bg,10%);
-    @border: @fonticons-bg;
-    font-weight: bold;
-    color: @color;
-    background-color: @background;
-    border-color: @border;
-    border-bottom-width: 2px;
-    text-shadow: none;
-    border-radius: 4px;
-
-    &:hover,
-    &:focus,
-    &:active,
-    &.active,
-    .open > &.dropdown-toggle {
-      color: #fff;
-      background-color: darken(@border, 3%);
-      border-color: darken(@border, 12%);
-      border-bottom-color: darken(@border, 18%);
-    }
-    &:active,
-    &.active,
-    .open > &.dropdown-toggle {
-      background-image: none;
-    }
-    &.disabled,
-    &[disabled],
-    fieldset[disabled] & {
-      &,
-      &:hover,
-      &:focus,
-      &:active,
-      &.active {
-        background-color: @background;
-        border-color: @border;
-      }
-    }
-  }
-}