Refactor CSS rules for the shift-key.

ui/keyboard/resources/main.css

 /*
  Copyright (c) 2013 The Chromium Authors. All rights reserved.
  Use of this source code is governed by a BSD-style license that can be
  found in the LICENSE file.
 */
 
 @font-face {
   font-family: roboto-bold;
   src: url(roboto_bold.ttf);
 }
 
 /**
  * TODO(rsadam@): Remove all these rules once we switch to native
  * shadow dom.
  */
 kb-keyboard.ctrl-active kb-modifier-key[char=Ctrl],
 kb-keyboard.alt-active kb-modifier-key[char=Alt] {
   color: lightblue;
 }
 
-kb-keyboard[keyset="upper"] kb-shift-key.dark /shadow-deep/ .key {
+kb-keyboard[keyset="upper"] kb-shift-key.dark /deep/ .key {
   background-image: url('images/shift-filled.svg');
 }
 
-kb-keyboard[keyset="lower"] kb-shift-key /shadow-deep/ .key {
+kb-keyboard[keyset="lower"] kb-shift-key /deep/ .key{
   background-image: url('images/shift.svg');
 }
 
 /**
 * Controls whether the shift key should be highlighted or not.
 */
-kb-keyboard.caps-locked kb-shift-key.dark /shadow-deep/
+kb-keyboard.caps-locked kb-shift-key.dark /deep/
     .shift-light {
   -webkit-box-shadow: 0 1px 1px rgba(213, 213, 213, 0.5),
     0 -1px 1px rgba(213, 213, 213, 0.5);
   background-image: -webkit-linear-gradient(#d5d5d5, #d5d5d5);
   border: none;
   height: 0.2em;
 }
-kb-keyboard.caps-locked kb-shift-key.dark /shadow-deep/
+kb-keyboard.caps-locked kb-shift-key.dark /deep/
     .shift-light-wrapper {
   bottom: 2px;
 }
 
 kb-keyboard.ctrl-active kb-modifier-key[char=Ctrl],
 kb-keyboard.ctrl-active kb-modifier-key[char=Ctrl]  {
   color: lightblue;
 }
 
 /** TODO(rsadam@): Move these rules to kb-row once we uprev to latest Polymer.*/
@@ skipping 14 matching lines @@
 }
 
 kb-row:nth-child(n+3) kb-key:not(.dark):not(.active){
   -webkit-box-shadow: inset 0px 1px #565656, inset 0px -1px #434343;
   background-image: -webkit-linear-gradient(#484848, #474747);
   background-size: cover;
   border-bottom-color: #393939;
   border-top-color: #717171;
 }
 
-kb-row:nth-child(2) kb-key:not([invert]) /shadow-deep/ .hint {
+kb-row:nth-child(2) kb-key:not([invert]) /deep/ .hint {
   color: #2C2C2C;
 }
 
-kb-row:nth-child(3) kb-key:not([invert]) /shadow-deep/ .hint {
+kb-row:nth-child(3) kb-key:not([invert]) /deep/ .hint {
   color: #272727;
 }
 
-kb-row:nth-child(n+3) kb-key:not([invert]) /shadow-deep/ .hint {
+kb-row:nth-child(n+3) kb-key:not([invert]) /deep/ .hint {
   color: #232323;
 }
 
 .dark {
   font-size: 70%;
 }
 
 .dark:not(.active) {
   -webkit-box-shadow: inset 0px 1px #313131, inset 0px -1px #202020;
   background-color: #222222;
   border-bottom-color: #1c1c1c;
   border-top-color: #4f4f4f;
 }
 
 :not(kb-altkey-set) > .active {
   -webkit-box-shadow: inset 0px 1px #969696, inset 0px -1px #6f6f6f;
   background-image: -webkit-linear-gradient(#8b8b8b, #7d7d7d);
   background-size: cover;
   border-bottom-color: #5b5b5b;
   border-top-color: #a4a4a4;
 }