diff --git a/core/modules/color/color.module b/core/modules/color/color.module
index 6942c6f..74009b3 100644
--- a/core/modules/color/color.module
+++ b/core/modules/color/color.module
@@ -259,7 +259,7 @@ function theme_color_scheme_form($variables) {
   // Color schemes
   $output .= drupal_render($form['scheme']);
   // Palette
-  $output .= '<div id="palette" class="clearfix">';
+  $output .= '<div id="palette" class="color-palette clearfix">';
   foreach (element_children($form['palette']) as $name) {
     $output .= drupal_render($form['palette'][$name]);
   }
diff --git a/core/modules/color/css/color.admin-rtl.css b/core/modules/color/css/color.admin-rtl.css
index f8dbbd5..3890d30 100644
--- a/core/modules/color/css/color.admin-rtl.css
+++ b/core/modules/color/css/color.admin-rtl.css
@@ -3,7 +3,7 @@
  * Right-to-left specific stylesheet for the Color module.
  */
 
-#placeholder {
+.color-placeholder {
   left: 0;
   right: auto;
 }
@@ -25,21 +25,21 @@
   margin-right: 0;
   margin-left: 5px;
 }
-#palette .hook {
+.color-palette .hook {
   float: right;
 }
-#palette .down,
-#palette .up,
-#palette .both {
+.color-palette .down,
+.color-palette .up,
+.color-palette .both {
   background: url(../images/hook-rtl.png) no-repeat 0 0;
 }
-#palette .up {
+.color-palette .up {
   background-position: 0 -27px;
 }
-#palette .both {
+.color-palette .both {
   background-position: 0 -54px;
 }
-#palette .lock {
+.color-palette .lock {
   float: right;
   right: -10px;
 }
diff --git a/core/modules/color/css/color.admin.css b/core/modules/color/css/color.admin.css
index 98e9cc2..37aff14 100644
--- a/core/modules/color/css/color.admin.css
+++ b/core/modules/color/css/color.admin.css
@@ -8,7 +8,7 @@
   max-width: 50em;
   position: relative;
 }
-#placeholder {
+.color-placeholder {
   position: absolute;
   top: 0;
   right: 0; /* LTR */
@@ -36,25 +36,25 @@
   cursor: pointer;
 }
 
-#palette .hook {
+.color-palette .hook {
   float: left; /* LTR */
   margin-top: 3px;
   width: 16px;
   height: 16px;
 }
-#palette .down,
-#palette .up,
-#palette .both {
+.color-palette .down,
+.color-palette .up,
+.color-palette .both {
   background: url(../images/hook.png) no-repeat 100% 0; /* LTR */
 }
-#palette .up {
+.color-palette .up {
   background-position: 100% -27px; /* LTR */
 }
-#palette .both {
+.color-palette .both {
   background-position: 100% -54px; /* LTR */
 }
 
-#palette .lock {
+.color-palette .lock {
   float: left; /* LTR */
   position: relative;
   top: -1.4em;
@@ -64,13 +64,13 @@
   background: url(../images/lock.png) no-repeat 50% 2px;
   cursor: pointer;
 }
-#palette .unlocked {
+.color-palette .unlocked {
   background-position: 50% -22px;
 }
-#palette .form-item {
+.color-palette .form-item {
   width: 20em;
 }
-#palette .item-selected {
+.color-palette .item-selected {
   background: #eee;
 }