div#comparison {
  width: 100%;
  padding-top: 70%;
  max-width: 1600px;
  top: 0;
  bottom: 0;
  max-height: 1600px;
  direction: ltr;
}
#comparison::before {
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(/mea/sa/themes/custom/bione/img/chart.jpg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
div#comparison figure {
  background: url(/mea/sa/themes/custom/bione/img/slider_empty.jpg);
  background-size: cover;
  position: absolute;
  background-position: left;
  font-size: 0;
  width: calc(100% - 80px);
  height: calc(100% - 50px);
  margin: auto;
  top: 0;
  right: 80px;
  left: 60px;
}
div#comparison figure > img {
  position: relative;
  width: 100%;
}
div#comparison figure div {
  background: url(/mea/sa/themes/custom/bione/img/slider_filled.jpg);
  background-size: cover;
  position: absolute;
  width: 0%;
  overflow: hidden;
  bottom: 0;
  background-position: left;
  height: 100%;
}
/* Animate figure to full width in a loop */
.animchart #divisor {
  animation: animate_chart 2.5s ease-in-out;
  -webkit-animation-fill-mode: forwards; /* Safari 4.0 - 8.0 */
  animation-fill-mode: forwards;
}
/* Keframes animate_charts */
@keyframes animate_chart {
  0% {
    width: 5%;
  }
  100% {
    width: 100%;
  }

}
