body {
  background: #fff;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

.keyboard-overlay-keyboard {
  border-radius: 6px;
  background: -webkit-linear-gradient(#484848, #252525) no-repeat;
  background-color: #252525;
  font-family: 'Droid Sans', Arial;
}

.keyboard-overlay-instructions {
  -webkit-box-orient: vertical;
  background: -webkit-linear-gradient(#334c7e, #0d172b);
  border-radius: 5px;
  border: 2px solid #576ccf;
  color: #fff;
  display: -webkit-box;
  position: absolute;
  vertical-align: middle;
  z-index: 100;
}

.keyboard-overlay-instructions-text {
  -webkit-box-flex: 3;
  margin-top: 13px;
  text-align: center;
  vertical-align: middle;
}

.keyboard-overlay-instructions-hide-text {
  -webkit-box-flex: 2;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
}

.keyboard-overlay-key {
  -webkit-box-orient: vertical;
  border-radius: 4px;
  background-color: rgba(24, 24, 24, 0.9);
  border: 2px solid #7f7f7f;
  color: #979796;
  display: -webkit-box;
  font-size: 75%;
  font-weight: bold;
  position: absolute;
}

.keyboard-overlay-key.is-shortcut {
  background: -webkit-linear-gradient(rgba(61, 61, 61, 0.8),
                                      rgba(27, 27, 27, 0.8));
  border-color: #fafafa;
  color: #9e9e9e;
}

.keyboard-overlay-key.is-shortcut.modifier-shift {
  border-color: #61ba64;
}

.keyboard-overlay-key.is-shortcut.modifier-ctrl {
  border-color: #5d80c7;
}

.keyboard-overlay-key.is-shortcut.modifier-alt {
  border-color: #b85454;
}

.keyboard-overlay-key.is-shortcut.modifier-shift.modifier-ctrl {
  border-color: #79ac8f;
}

.keyboard-overlay-key.is-shortcut.modifier-shift.modifier-alt {
  border-color: #bfbd79;
}

.keyboard-overlay-key.is-shortcut.modifier-ctrl.modifier-alt {
  border-color: #9e54ce;
}

.keyboard-overlay-key.is-shortcut.modifier-shift.modifier-ctrl.modifier-alt {
  border-color: #7f7f7f;
}

.keyboard-overlay-key.pressed {
  border-color: #fff;
  color: #fff;
  font-size: 85%;
}

.keyboard-overlay-key.pressed.is-shift {
  background: -webkit-linear-gradient(#44a142, #3e5f37);
}

.keyboard-overlay-key.pressed.is-shift.modifier-ctrl {
  background: -webkit-linear-gradient(#42a143, #2e5c53);
}

.keyboard-overlay-key.pressed.is-shift.modifier-alt {
  background: -webkit-linear-gradient(#45a343, #515134);
}

.keyboard-overlay-key.pressed.is-shift.modifier-ctrl.modifier-alt {
  background: -webkit-linear-gradient(#52a12a, #4f4d2e);
}

.keyboard-overlay-key.pressed.is-ctrl {
  background: -webkit-linear-gradient(#1f37a2, #19265a);
}

.keyboard-overlay-key.pressed.is-ctrl.modifier-shift {
  background: -webkit-linear-gradient(#439fa5, #1e3760);
}

.keyboard-overlay-key.pressed.is-ctrl.modifier-alt {
  background: -webkit-linear-gradient(#733690, #22255e);
}

.keyboard-overlay-key.pressed.is-ctrl.modifier-shift.modifier-alt {
  background: -webkit-linear-gradient(#733690, #21255d);
}

.keyboard-overlay-key.pressed.is-alt {
  background: -webkit-linear-gradient(#842c2a, #541e1c);
}

.keyboard-overlay-key.pressed.is-alt.modifier-shift {
  background: -webkit-linear-gradient(top left, #745e31, #55241e);
}

.keyboard-overlay-key.pressed.is-alt.modifier-ctrl {
  background: -webkit-linear-gradient(#76368f, #522128);
}

.keyboard-overlay-key.pressed.is-alt.modifier-shift.modifier-ctrl {
  background: -webkit-linear-gradient(top left, #735f29, #50241b);
}

.keyboard-overlay-shortcut-text {
  -webkit-box-flex: 1;
  -webkit-box-ordinal-group: 1;
  color: #fff;
  text-align: center;
}

.keyboard-overlay-key-text {
  -webkit-box-ordinal-group: 2;
  padding-bottom: 1px;
  text-align: center;
}