body {
    padding-top: 70px;
    background-color: gray;
  }

  textarea {
    resize: none;
    height: 100px;
}

  #questionCard {
      display: none;
  }

  .navbar-text {
    font-weight: bold;
  }

  #timerText {
    color: #fff;
    background-color: #007bff;
    border-color: #007bff;
    display: inline-block;
    font-weight: bold;
    color: #212529;
    text-align: center;
    vertical-align: middle;
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .25rem;
  }

  #scoreCard {

    margin-top: 20px;
  }

  div.listBody {
    margin-left: auto;
    margin-right: auto;
    display: table;
    text-align: left;
  }

  /* some CSS Tricks lists styling */
  ol {
    list-style: none;
    counter-reset: my-awesome-counter;
  }
  ol li {
    counter-increment: my-awesome-counter;
  }
  ol li::before {
    content: counter(my-awesome-counter) ". ";
    color: #007bff;
    font-weight: bold;
    text-align: left;
  }

  .shake {
    /* outline: 5px;
    outline-color: red; */
    /* also need animation and -moz-animation */
    -webkit-animation: shake .5s linear;
}
/* also need keyframes and -moz-keyframes */
 @-webkit-keyframes shake {
    8%, 41% {
        -webkit-transform: translateX(-20px);
    }
    25%, 58% {
        -webkit-transform: translateX(20px);
    }
    75% {
        -webkit-transform: translateX(-10px);
    }
    92% {
        -webkit-transform: translateX(10px);
    }
    0%, 100% {
        -webkit-transform: translateX(0);
    }
}