.countdown{font-family: arial; text-transform: uppercase;}
.countdown > div{ display: inline-block; width: 11%; float: left;}
.countdown > div > span{display: block; text-align: center;}
.countdown-container{margin:0 10px; border: 1px solid #777; text-align: center; }
.countdown-container .countdown-heading{font-size: 1em; margin: 3px; color: #666}
.countdown-container .countdown-value{font-size: 2em; background: transparent; padding:10px; color:#fff; text-shadow: 2px 2px 2px rgba(0,0,0,0.4)}
.display {min-height: 200px;}
/* Use a media query to add a breakpoint at 800px: */
@media screen and (max-width: 800px) {
  .countdown  {
    width: 100%; /* The width is 100%, when the viewport is 800px or smaller */
    clear: left;
    display: block;
  }
  .countdown > div {
    width: 100%;
    margin-bottom: 20px;
  }
  .display {
    min-height: 1300px;
  }
}