/*
Hier habe ich nichts dran verändert. Dieses CSS ist genau so, wie es von der Bibliothek kam. Quelle: https://www.jqueryscript.net/time-clock/Flip-Clock-Style-jQuery-Countdown-Count-Up-Timer-Plugin-flipTimer.html
Ich musste hier bisher nichts ändern. Ich habe mal mit der Zeit zum wechseln einer Ziffer rumgespielt. (Mit ersetzen alle Aufkommen von 0.3s durch etwas anderes ersetzen.)
Der Wert sollte nicht weniger als 0.15s sein.
*/
@-webkit-keyframes flipTop {
  0% {
    -webkit-transform: perspective(400px) rotateX(0deg); }

  100% {
    -webkit-transform: perspective(400px) rotateX(-90deg); } }

@-webkit-keyframes flipBottom {
  0% {
    -webkit-transform: perspective(400px) rotateX(90deg); }

  100% {
    -webkit-transform: perspective(400px) rotateX(0deg); } }

@-moz-keyframes flipTop {
  0% {
    -moz-transform: perspective(400px) rotateX(0deg); }

  100% {
    -moz-transform: perspective(400px) rotateX(-90deg); } }

@-moz-keyframes flipBottom {
  0% {
    -moz-transform: perspective(400px) rotateX(90deg); }

  100% {
    -moz-transform: perspective(400px) rotateX(0deg); } }

@-ms-keyframes flipTop {
  0% {
    -ms-transform: perspective(400px) rotateX(0deg); }

  100% {
    -ms-transform: perspective(400px) rotateX(-90deg); } }

@-ms-keyframes flipBottom {
  0% {
    -ms-transform: perspective(400px) rotateX(90deg); }

  100% {
    -ms-transform: perspective(400px) rotateX(0deg); } }

@-keyframes flipTop {
  0% {
    transform: perspective(400px) rotateX(0deg); }

  100% {
    transform: perspective(400px) rotateX(-90deg); } }

@-keyframes flipBottom {
  0% {
    transform: perspective(400px) rotateX(90deg); }

  100% {
    transform: perspective(400px) rotateX(0deg); } }

.flipTimer {
  color: #FFF;
  font-family: "Helvetica Neue", Helvetica, sans-serif;
  font-size: 90px;
  font-weight: bold;
  line-height: 100px;
  height: 100px; }
  .flipTimer .seperator {
    vertical-align: top;
    margin: 0 -20px;
    display: inline; }
  .flipTimer .seconds,
  .flipTimer .minutes,
  .flipTimer .hours,
  .flipTimer .days {
    height: 100%;
    display: inline; }
  .flipTimer .digit-set {
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.8);
    border: 1px solid #111111;
    width: 70px;
    height: 100%;
    display: inline-block;
    position: relative;
    margin: 0 1px; }
  .flipTimer .digit {
    position: absolute;
    height: 100%; }
    .flipTimer .digit > div {
      position: absolute;
      left: 0;
      overflow: hidden;
      height: 50%;
      padding: 0 10px; }
      .flipTimer .digit > div.digit-top, .flipTimer .digit > div.shadow-top {
        background-color: #333;
        border-bottom: 1px solid #333;
        box-sizing: border-box;
        top: 0;
        z-index: 0;
        border-radius: 10px 10px 0 0; }
        .flipTimer .digit > div.digit-top:before, .flipTimer .digit > div.shadow-top:before {
          content: "";
          box-shadow: inset 0 10px 25px rgba(0, 0, 0, 0.4);
          height: 100%;
          width: 100%;
          position: absolute;
          left: 0;
          top: 0; }
      .flipTimer .digit > div.shadow-top {
        background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0, 0, 0, 0)), to(black));
        width: 70px;
        opacity: 0;
        -webkit-transition: opacity 0.3s ease-in; }
      .flipTimer .digit > div.digit-bottom, .flipTimer .digit > div.shadow-bottom {
        background-color: #333;
        bottom: 0;
        z-index: 0;
        border-radius: 0 0 10px 10px; }
        .flipTimer .digit > div.digit-bottom .digit-wrap, .flipTimer .digit > div.shadow-bottom .digit-wrap {
          display: block;
          margin-top: -100%; }
        .flipTimer .digit > div.digit-bottom:before, .flipTimer .digit > div.shadow-bottom:before {
          content: "";
          box-shadow: inset 0 10px 25px rgba(0, 0, 0, 0.3);
          border-radius: 0 0 10px 10px;
          height: 100%;
          width: 100%;
          position: absolute;
          left: 0;
          top: 0; }
      .flipTimer .digit > div.shadow-bottom {
        background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(black), to(rgba(0, 0, 0, 0)));
        width: 50px;
        opacity: 0;
        -webkit-transition: opacity 0.3s ease-in; }
    .flipTimer .digit.previous .digit-top,
    .flipTimer .digit.previous .shadow-top {
      opacity: 1;
      z-index: 2;
      -webkit-transform-origin: 50% 100%;
      -webkit-animation: flipTop 0.3s ease-in both;
      -moz-transform-origin: 50% 100%;
      -moz-animation: flipTop 0.3s ease-in both;
      -ms-transform-origin: 50% 100%;
      -ms-animation: flipTop 0.3s ease-in both;
      transform-origin: 50% 100%;
      animation: flipTop 0.3s ease-in both; }
    .flipTimer .digit.previous .digit-bottom,
    .flipTimer .digit.previous .shadow-bottom {
      z-index: 1;
      opacity: 1; }
    .flipTimer .digit.active .digit-top {
      z-index: 1; }
    .flipTimer .digit.active .digit-bottom {
      z-index: 2;
      -webkit-transform-origin: 50% 0%;
      -webkit-animation: flipBottom 0.3s 0.3s ease-out both;
      -moz-transform-origin: 50% 0%;
      -moz-animation: flipBottom 0.3s 0.3s ease-out both;
      -ms-transform-origin: 50% 0%;
      -ms-animation: flipBottom 0.3s 0.3s ease-out both;
      transform-origin: 50% 0%;
      animation: flipBottom 0.3s 0.3s ease-out both; }
