diff --git a/lms/static/sass/_discussion.scss b/lms/static/sass/_discussion.scss
index 0fdd87225d..f4f78c604b 100644
--- a/lms/static/sass/_discussion.scss
+++ b/lms/static/sass/_discussion.scss
@@ -37,6 +37,25 @@
   }
 }
 
+@mixin dark-grey-button {
+  display: block;
+  height: 35px;
+  padding: 0 15px;
+  border-radius: 3px;
+  border: 1px solid #222;
+  background: -webkit-linear-gradient(top, #777, #555);
+  font-size: 13px;
+  font-weight: 700;
+  line-height: 32px;
+  color: #fff;
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.6);
+  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 1px rgba(0, 0, 0, .15);
+
+  &:hover {
+    background: -webkit-linear-gradient(top, #888, #666);
+  }
+}
+
 @mixin discussion-wmd-input {
   width: 100%;
   height: 240px;
diff --git a/lms/static/sass/course.scss b/lms/static/sass/course.scss
index 6c63c17f1f..95091afa4c 100644
--- a/lms/static/sass/course.scss
+++ b/lms/static/sass/course.scss
@@ -12,6 +12,7 @@
 // Course base / layout styles
 @import 'course/layout/courseware_header';
 @import 'course/layout/footer';
+@import 'course/base/mixins';
 @import 'course/base/base';
 @import 'course/base/extends';
 @import 'module/module-styles.scss';
diff --git a/lms/static/sass/course/base/_base.scss b/lms/static/sass/course/base/_base.scss
index 2296e417b8..a64219b202 100644
--- a/lms/static/sass/course/base/_base.scss
+++ b/lms/static/sass/course/base/_base.scss
@@ -39,11 +39,6 @@ a {
   }
 }
 
-
-
-
-
-
 form {
   label {
     display: block;
@@ -132,6 +127,9 @@ img {
   }
 }
 
+.test-class {
+  border: 1px solid #f00;
+}
 
 
 .toast-notification {
@@ -143,13 +141,16 @@ img {
   padding: 15px 20px 17px;
   border-radius: 3px;
   border: 1px solid #333;
-  @include linear-gradient(top, rgba(255, 255, 255, .1), rgba(255, 255, 255, 0));
-  background-color: rgba(30, 30, 30, .92);
-  @include box-shadow(0 1px 3px rgba(0, 0, 0, .3), 0 1px 0 rgba(255, 255, 255, .1) inset);
+  background: -webkit-linear-gradient(top, rgba(255, 255, 255, .1), rgba(255, 255, 255, 0)) rgba(30, 30, 30, .92);
+  box-shadow: 0 1px 3px rgba(0, 0, 0, .3), 0 1px 0 rgba(255, 255, 255, .1) inset;
   font-size: 13px;
   color: #fff;
   opacity: 0;
-  @include transition(all .2s);
+  -webkit-transition: all .2s;
+
+  p, span {
+    color: #fff;
+  }
 
   .error-icon {
     display: block;
@@ -191,5 +192,4 @@ img {
     margin-top: 10px;
     text-align: center;
   }
-}
-
+}
\ No newline at end of file
diff --git a/lms/static/sass/course/base/_mixins.scss b/lms/static/sass/course/base/_mixins.scss
index 0b63313c40..ab6e909c10 100644
--- a/lms/static/sass/course/base/_mixins.scss
+++ b/lms/static/sass/course/base/_mixins.scss
@@ -35,4 +35,23 @@
   &:hover {
     @include linear-gradient(top, #fff, #ddd);
   }
+}
+
+@mixin dark-grey-button {
+  display: block;
+  height: 35px;
+  padding: 0 15px;
+  border-radius: 3px;
+  border: 1px solid #222;
+  background: -webkit-linear-gradient(top, #777, #555);
+  font-size: 13px;
+  font-weight: 700;
+  line-height: 32px;
+  color: #fff;
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.6);
+  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 1px rgba(0, 0, 0, .15);
+
+  &:hover {
+    background: -webkit-linear-gradient(top, #888, #666);
+  }
 }
\ No newline at end of file