.spinner {
   width: 40px;
   height: 40px;
   position: relative;
   margin: 100px auto;
}

.double-bounce1, .double-bounce2 {
   width: 100%;
   height: 100%;
   border-radius: 50%;
   background-color: #333;
   opacity: 0.6;
   position: absolute;
   top: 0;
   left: 0;
   -webkit-animation: bounce 2.0s infinite ease-in-out;
   animation: bounce 2.0s infinite ease-in-out;
}

.double-bounce2 {
   -webkit-animation-delay: -1.0s;
   animation-delay: -1.0s;
}

@-webkit-keyframes bounce {
   0%, 100% {
      -webkit-transform: scale(0.0);
   }

   50% {
      -webkit-transform: scale(1.0);
   }
}

@keyframes bounce {
   0%, 100% {
      transform: scale(0.0);
      -webkit-transform: scale(0.0);
   }

   50% {
      transform: scale(1.0);
      -webkit-transform: scale(1.0);
   }
}
#progress {
   background-color: lightblue;
}

.spinner-container {
   height: 25%;
}

.display {
   position: fixed;
   text-align: center;
   height: 100%;
   width: 100%;

}
.padded
{
   padding: 10px;
}

   .display p {
      padding: 10pt;
   }



.display h1 {
   font-size: 4vw;
   margin-top: 15%;
   line-height: 1;
}

@media (max-width: 690px) {
   .display h1 {
      font-size: 16pt;
   }
}

.display h2 {
   font-size: 14pt;
}

#progress h1 {
   margin-top: inherit;
}

@media (max-height: 389px) {
   .display h1 {
      margin-top: 10px;
   }
}

.btn-xlarge {
    padding: 18px 28px;
    font-size: 22px;
    line-height: normal;
    -webkit-border-radius: 8px;
       -moz-border-radius: 8px;
            border-radius: 8px;
}

.text-center
{
   text-align: center;
}

.text-center ul, .text-center ol 
{
   list-style-position: inside;
}