body {
  font-size: 16pt;
  font-family: sans-serif;
  position: relative;
  padding-top: 50px;
  background-color: tomato;
  position: relative; }

.container {
  max-width: 1028px;
  width: 100%;
  margin: auto; }

#display-holder {
  padding: 30px 0;
  text-align: center; }
  #display-holder .display {
    padding-bottom: 25px; }
    #display-holder .display span {
      font-size: 4em;
      font-weight: bold;
      color: #fff; }
      #display-holder .display span:nth-child(even) {
        padding: 0 15px; }

#word-form {
  text-align: center;
  padding-bottom: 25px; }
  #word-form input {
    padding: 15px;
    outline: none; }
  #word-form input[type="text"] {
    width: 320px; }

.control-holder {
  padding: 15px;
  display: none;
  opacity: 0;
  transform: translateY(15px);
  transition: .75s ease all; }
  .control-holder.active {
    display: block;
    transform: translateX(0);
    opacity: 1; }
  .control-holder ul {
    list-style: none;
    width: 320px;
    margin: auto; }
    .control-holder ul li {
      display: inline-block; }

#current-words {
  color: #fff;
  text-align: center; }
  #current-words h2 {
    font-weight: 400;
    font-size: 1.25em;
    padding: 0;
    margin: 0;
    padding-bottom: 5px;
    text-transform: uppercase; }
  #current-words p {
    font-weight: 200;
    font-size: .75em;
    padding: 0;
    margin: 0; }
  #current-words ul {
    list-style: none;
    padding: 15px 0;
    margin: 0; }
    #current-words ul li {
      padding: 5px;
      border: 2px solid #fff;
      display: inline-block;
      border-radius: 2px;
      transition: 1s ease all;
      cursor: pointer;
      margin: 5px; }
      #current-words ul li:hover {
        background: #fff;
        color: tomato; }

#saved-combos {
  position: absolute;
  width: 250px;
  color: #fff;
  padding: 12px;
  right: 0;
  border: 2px solid white;
  margin-right: 50px;
  font-size: .75em;
  text-align: center; }
  #saved-combos h2 {
    color: #fff;
    font-size: 1em;
    padding: 0;
    margin: 0;
    text-transform: uppercase;
    padding-bottom: 10px; }
  #saved-combos ul {
    padding: 0;
    margin: 0;
    list-style: none; }
    #saved-combos ul li {
      padding: 10px 0;
      padding-left: 10px;
      transition: .5s ease;
      position: relative;
      cursor: pointer;
      border-radius: 3px; }
      #saved-combos ul li:hover {
        background: rgba(186, 56, 15, 0.5);
        color: tomato; }
        #saved-combos ul li:hover:after {
          color: #fff; }
      #saved-combos ul li:after {
        content: "x";
        float: right;
        padding: 0 10px; }

/*# sourceMappingURL=main.css.map */