@keyframes flashlight {
  0%   {opacity: 1;}
  10%  {opacity: 0;}
  20%  {opacity: 1;}
  30% {opacity: 0;}
  40%   {opacity: 1;}
  50%  {opacity: 0;}
  60%  {opacity: 1;}
  70% {opacity: 0;}
  80%   {opacity: 1;}
  90%  {opacity: 0;}
  100%  {opacity: 1;}
}
.flashlight {
  animation-name: flashlight;
  animation-duration: 3s;
  animation-iteration-count: infinite;
}

.carbon-banner {
  z-index: -1;
}
html.has-carbonbanner{
    margin-top: 40px !important;
}

.increment-carbon-footprint {
  display: inline-block;
  min-width: 80px;
  font-weight: bold;
}

.dots-preloader{
   width: 56px;
   height: 13.4px;
   background: radial-gradient(circle closest-side,#a3a3a3 90%,#0000) 0%   50%,
        radial-gradient(circle closest-side,#a3a3a3 90%,#0000) 50%  50%,
        radial-gradient(circle closest-side,#a3a3a3 90%,#0000) 100% 50%;
   background-size: calc(100%/3) 100%;
   background-repeat: no-repeat;
   animation: dots-preload 1s infinite linear;
}

@keyframes dots-preload {
   33% {
      background-size: calc(100%/3) 0%  ,calc(100%/3) 100%,calc(100%/3) 100%;
   }

   50% {
      background-size: calc(100%/3) 100%,calc(100%/3) 0%  ,calc(100%/3) 100%;
   }

   66% {
      background-size: calc(100%/3) 100%,calc(100%/3) 100%,calc(100%/3) 0%;
   }
}
.footprint-calculator-preloader{
  transition: height 1s;
  z-index: 999;
}