html {
  font-size: 24px;  
  color: #000;
  /*font-weight: bold;*/
  font-family: inherit;
}

#keyboard {
  display: flex;
  flex-flow: column;
  align-items: center;
  margin-top: 50px;
  font-family: 'News Cycle', sans-serif;
}

kbd {
  font-size: 28px;
  background: #fff;
  padding: 3px 13px 6px 13px;
  border-radius: 3px;
  display: inline-block;
  /*border-bottom: solid 2px #999;*/
  text-transform: uppercase;
  margin: 0px 2px 0px 2px;
  height: 57px;
  width: 62px;
  line-height: 1.7;
  cursor: pointer;
  font-family: 'News Cycle', sans-serif;
  padding-top: .7em !important;
}
.row {
  flex: 1 1 auto;
  margin-bottom: 10px;
}

#keyboard > div.keyboard-spacebar{
  height: 57px;
  width: 413px;
  background: #fff;
  padding: 15px 13px 6px 13px;
  border-radius: 3px;
  display: inline-block;
  /*border-bottom: solid 2px #999;*/
  text-transform: uppercase;
  color: #000;
}

/* Darker Black Buttons */
.keyboard-btn-delete,.keyboard-btn-go,.keyboard-btn-uparrow{
  background: #fff;
  text-align: center;
}

/* Custom Button Sizes */
.keyboard-btn-go {
  text-transform: none;
  width: 112px;
}

.keyboard-btn-delete, .keyboard-btn-uparrow {
  width: 63px;
  position: relative;
  top: 8px;
}
.keyboard-btn-uparrow {
  position: relative;
  top: -1px;
}
/* Delete Icon Image Height Initialize */
img[src$="delete.png"] { 
  height:28px;
}

/* Keyboard Row Alignment*/
span.row:nth-child(3){
  margin-left: -20px;
}
span.row:nth-child(4){
  margin-left: 3px;
}
span.row:nth-child(5){
  margin-left: 35px;
}

/* Custom Text Input Styling*/
form > input[type="text"]{
  height: 44px;
  background: #fff;
  border: none;
  width: 580px;
  color: #000;
  margin-bottom: 20px;
  font-size: inherit;
  font-family: inherit;
  text-transform: uppercase;
  padding-left: .5em;
}


/* Shift Functionality CSS for Jquery */
.lowercaseText {
  text-transform: lowercase;
}

.uppercaseText {
  text-transform: uppercase;
  padding-top: .5em;
}
ul > li {
   position: relative;
   display: inline;
}

ul > li > a > img[src*="images/"] {
  position: absolute;
  width: 100px;
  top: -7px;
  left: 0px;
} 