@font-face {
      font-family: 'IM Fell English SC';
      src: local('IM Fell English SC Regular'), local('IMFellEnglishSC-Regular'),
           url('/fonts/IMFellEnglishSC-Regular.woff2') format('woff2'),
           url('/fonts/IMFellEnglishSC-Regular.ttf') format('truetype');
      font-weight: normal;
      font-style: normal;
      font-display: swap;
  }
  body {
  font-family: 'Papyrus', 'IM Fell English SC', Fantasy, serif;
  text-align: center;
  background-image: linear-gradient(to bottom, #ca4503, #d54f0f, #e0581a, #eb6123, #f66a2c, #ff7335, #ff7d3d);
  background-repeat: no-repeat;
  background-color: #ff7d3d;
  color: #fff;
  margin: 0;
  padding: 50px;
  font-size: 1em;
  }
  a {
  color: #fc0;
  }
  #countdownday {
  font-size: 3.3em;
  margin: 40px 10px 30px 10px;
  color: #dcff0f;
  }
  .big {font-size: 1.5em;}
  #citazione {
  font-size: 1.5em;
  font-style: italic;
  color: #410000;
  max-width: 900px;
  text-align:center;
  margin: 40px auto;
  }
  svg {
  max-width: 100%;
  height: auto;
  display: block;
  }
  .digit-bottom {
  margin-top: 2px;
  }
  #countdownday {
  font-size: 4em;
  margin-bottom: 20px;
  }
  #countdown li {
  display: inline-block;
  font-size: 1em;
  list-style-type: none;
  padding: 1em;
  text-transform: uppercase;
  }
  #countdown li span {
  display: block;
  font-size: 3rem;
  }
  .container-svg {
  margin: 0 auto;
  width: 100%;
  max-width: 477.731px;
  }
  #precisamente {font-size: 1.5em;}
  @media all and (max-width: 768px) {
    body {
      padding: 10px;
    }
    #countdown ul {
      padding: 2px !important;
    }
    #countdown li {
      font-size: calc(1.125rem * var(--smaller));
    }
    #countdown li span {
      font-size: 2.5rem;
    }
  }
  #happy {
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-name: flickering;
  animation-timing-function: step-start;
  color: #ff0;
  font-family: 'UnifrakturCook', cursive;
  font-size: 96px;
}

@keyframes flickering {
  0% {
    color: #ff0;
    text-shadow: none;
    transform: skewX(0);
  }
  5% {
    color: #ff0;
    text-shadow: none;
    transform: skewX(0);
  }
  10% {
    color: #ff0;
    text-shadow: 1px 1px #eee;
    transform: skewX(-15deg);
  }
  15% {
    color: #000;
    text-shadow: none;
    transform: skewX(-15deg);
  }
  20% {
    color: #ff0;
    text-shadow: none;
    transform: skewX(0);
  }
  25% {
    color: #000;
    text-shadow: 2px 2px #ff0;
    transform: skewX(0);
  }
  30% {
    color: #000;
    text-shadow: 2px 2px #ff0;
    transform: skewX(0);
  }
  35% {
    color: #000;
    text-shadow: 2px 2px #ff0;
    transform: skewX(0);
  }
  37% {
    color: #000;
    text-shadow: 1px 1px #eee;
    transform: skewX(0);
  }
  40% {
    color: #ff0;
    text-shadow: 1px 1px #eee;
    transform: skewX(0);
  }
  45% {
    color: #ff0;
    text-shadow: 1px 1px #eee;
    transform: skewX(0);
  }
  50% {
    color: #ff0;
    text-shadow: none;
    transform: skewX(0);
  }
  55% {
    color: #ff0;
    text-shadow: none;
    transform: skewX(0);
  }
  60% {
    color: #ff0;
    text-shadow: none;
    transform: skewX(0);
  }
  65% {
    color: #ff0;
    text-shadow: none;
    transform: skewX(0);
  }
  68% {
    color: #ff0;
    text-shadow: 1px 1px #eee;
    transform: skewX(0);
  }
  70% {
    color: #ff0;
    text-shadow: 1px 1px #eee;
    transform: skewX(0);
  }
  75% {
    color: #ff0;
    text-shadow: 1px 1px #eee;
    transform: skewX(10deg);
  }
  80% {
    color: #ff0;
    text-shadow: 1px 1px #eee;
    transform: skewX(10deg);
  }
  85% {
    color: #ff0;
    text-shadow: 1px 1px #eee;
    transform: skewX(10deg);
  }
  90% {
    color: #ff0;
    text-shadow: none;
    transform: skewX(0);
  }
  95% {
    color: #ff0;
    text-shadow: 1px 1px #eee;
    transform: skewX(0);
  }
  100% {
    color: #ff0;
    text-shadow: none;
    transform: skewX(0);
  }
}