.ex-img-accordion .item:hover {
flex: 3;
}
.ex-img-accordion .item:hover .overlay-inner * {
opacity: 1;
visibility: visible;
transform: none;
transition: all .3s .3s;
}


/* For mobile phones: */
[class*="ex-col-"] {
    width: 100%;
}


/* Image accordion */
.ex-img-accordion {
  display: flex;
  height: 50vh;
}

.ex-img-accordion .item {
  position: relative;
  flex: 1;
  text-align: center;
  text-decoration: none;
  color: #fff;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  transition: flex .4s;
}
.ex-grow-accordion {
  flex: 3;
}
.ex-img-accordion .overlay {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  transition: background-color .4s;
}
.ex-img-accordion .item:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.5);
  z-index: 0;
  top: 0px;
  left: 0px;
  bottom: 0px;
  right: 0px;
  transition: all 0.3s ease-in-out;
}
.ex-img-accordion .item:hover::after {
  background-color: transparent;
}
.ex-img-accordion .item:hover .overlay {
  background-color: rgba(0, 0, 0, .3);
}

.ex-img-accordion .overlay-inner * {
  visibility: hidden;
  opacity: 0;
  transform-style: preserve-3d;
}

.ex-img-accordion .overlay .title {
  color: #fff;
  transform: translate3d(0, -60px, 0);
}

.ex-img-accordion .overlay .content {
  color: #fff;
  transform: translate3d(0, 60px, 0);
}
.ex-img-accordion .overlay-inner-show * {
  opacity: 1;
  visibility: visible;
  transform: none !important;
  transition: all .3s .3s;
}

@media screen and (max-width: 800px) {
  .ex-img-accordion {
    flex-direction: column;
  }

  .ex-img-accordion .item:hover {
    flex: 1;
  }

  .ex-img-accordion .item:hover .overlay {
    background-color: transparent;
  }

  .ex-img-accordion .overlay .title,
  .ex-img-accordion .overlay .content {
    opacity: 1;
    visibility: visible;
    transform: none;
  }
  .ex-img-accordion {height:100vh}
}


/*************/

.link-agence-carousel.owl-carousel{display: flex !important; 
    flex-direction: row;
    justify-content: center;}
.link-agence-carousel.owl-carousel .owl-item img{border: 1px solid #000;
  margin-bottom: 8px;}
.link-agence-carousel.owl-carousel .owl-item a{font-weight: 400;}  
.link-agence-carousel.owl-carousel .owl-item a:hover{text-decoration: underline!important;}

.sliding-image-box{
  position:relative;
  overflow: hidden;
}
.sliding-image-box .image-2{
  position: absolute;
  left: 0;
  top: -100%;
  transition: all 0.4s;
}
.sliding-image-box:hover .image-2{
  top: 0;
}
.sliding-image-box .content{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  opacity: 0;
  transition: all 0.8s;
  width: 100%;
}
.sliding-image-box:hover .content{
  opacity: 1;
}
.cherry-service{
  overflow: hidden;
  position: relative;
  box-shadow: 0px 2px 5px 0px #ddd;
  height: 100%;
}
.cherry-service .heading{
  margin: 15px 0;
}
.cherry-service .mask{
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
    right: 0;
    transition: all 0.4s;
}
.cherry-service:hover .mask{
  margin-top: -50%;
}
.cherry-service .mask::after{
  content: '';
  width: 30px;
  height: 30px;
  position: absolute;
  bottom: -10px;
  transform: rotate(45deg);
  background-color: inherit;
  margin-left: -15px;
}
.cherry-service .content{
  position: relative;
  padding: 50px;
}
.cherry-service .content img,.cherry-service .content .heading{
  transition: all 0.4s;
}
.cherry-service:hover .content .text-content{
  color: #333;
}
.cherry-service:hover .content img,.cherry-service:hover .content .heading{
  opacity: 0;
  transform: translateY(-500%);
}

.accordion-section{
	margin-bottom: 10px;
}
.accordion-section .accordion-content{
	display: none;
	padding: 4px;
	border: 1px solid #dedede;
}
.accordion-section .accordion-title{
	background: #dedede;
	padding: 4px;
	cursor: pointer;
}
.typewriter-bloc{
	display: inline-block;
}

.typewriter{
	overflow: hidden;
  	white-space: nowrap;
  	width: 0;
}

@keyframes typing {
  from { width: 0 }
  to { width: 100% }
}

.animation-bar {
  width: auto;
  height: 30px;
  margin: 20px;
}

[class*=element-bar-] {
  height: 30px;
  display: block;
  background: red;
}

@-webkit-keyframes percentage-slide-1 {
  0% {
    width: 1%;
  }
  100% {
    width: 1%;
  }
}

@keyframes percentage-slide-1 {
  0% {
    width: 1%;
  }
  100% {
    width: 1%;
  }
}
.element-bar-1 {
    animation-name: percentage-slide-1;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-2 {
  0% {
    width: 1%;
  }
  100% {
    width: 2%;
  }
}

@keyframes percentage-slide-2 {
  0% {
    width: 1%;
  }
  100% {
    width: 2%;
  }
}
.element-bar-2 {
  animation-name: percentage-slide-2;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-3 {
  0% {
    width: 1%;
  }
  100% {
    width: 3%;
  }
}

@keyframes percentage-slide-3 {
  0% {
    width: 1%;
  }
  100% {
    width: 3%;
  }
}
.element-bar-3 {
  animation-name: percentage-slide-3;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-4 {
  0% {
    width: 1%;
  }
  100% {
    width: 4%;
  }
}

@keyframes percentage-slide-4 {
  0% {
    width: 1%;
  }
  100% {
    width: 4%;
  }
}
.element-bar-4 {
  animation-name: percentage-slide-4;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-5 {
  0% {
    width: 1%;
  }
  100% {
    width: 5%;
  }
}

@keyframes percentage-slide-5 {
  0% {
    width: 1%;
  }
  100% {
    width: 5%;
  }
}
.element-bar-5 {
  animation-name: percentage-slide-5;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-6 {
  0% {
    width: 1%;
  }
  100% {
    width: 6%;
  }
}

@keyframes percentage-slide-6 {
  0% {
    width: 1%;
  }
  100% {
    width: 6%;
  }
}
.element-bar-6 {
  animation-name: percentage-slide-6;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-7 {
  0% {
    width: 1%;
  }
  100% {
    width: 7%;
  }
}

@keyframes percentage-slide-7 {
  0% {
    width: 1%;
  }
  100% {
    width: 7%;
  }
}
.element-bar-7 {
  animation-name: percentage-slide-7;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-8 {
  0% {
    width: 1%;
  }
  100% {
    width: 8%;
  }
}

@keyframes percentage-slide-8 {
  0% {
    width: 1%;
  }
  100% {
    width: 8%;
  }
}
.element-bar-8 {
  animation-name: percentage-slide-8;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-9 {
  0% {
    width: 1%;
  }
  100% {
    width: 9%;
  }
}

@keyframes percentage-slide-9 {
  0% {
    width: 1%;
  }
  100% {
    width: 9%;
  }
}
.element-bar-9 {
  animation-name: percentage-slide-9;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-10 {
  0% {
    width: 1%;
  }
  100% {
    width: 10%;
  }
}

@keyframes percentage-slide-10 {
  0% {
    width: 1%;
  }
  100% {
    width: 10%;
  }
}
.element-bar-10 {
  animation-name: percentage-slide-10;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-11 {
  0% {
    width: 1%;
  }
  100% {
    width: 11%;
  }
}

@keyframes percentage-slide-11 {
  0% {
    width: 1%;
  }
  100% {
    width: 11%;
  }
}
.element-bar-11 {
  animation-name: percentage-slide-11;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-12 {
  0% {
    width: 1%;
  }
  100% {
    width: 12%;
  }
}

@keyframes percentage-slide-12 {
  0% {
    width: 1%;
  }
  100% {
    width: 12%;
  }
}
.element-bar-12 {
  animation-name: percentage-slide-12;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-13 {
  0% {
    width: 1%;
  }
  100% {
    width: 13%;
  }
}

@keyframes percentage-slide-13 {
  0% {
    width: 1%;
  }
  100% {
    width: 13%;
  }
}
.element-bar-13 {
  animation-name: percentage-slide-13;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-14 {
  0% {
    width: 1%;
  }
  100% {
    width: 14%;
  }
}

@keyframes percentage-slide-14 {
  0% {
    width: 1%;
  }
  100% {
    width: 14%;
  }
}
.element-bar-14 {
  animation-name: percentage-slide-14;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-15 {
  0% {
    width: 1%;
  }
  100% {
    width: 15%;
  }
}

@keyframes percentage-slide-15 {
  0% {
    width: 1%;
  }
  100% {
    width: 15%;
  }
}
.element-bar-15 {
  animation-name: percentage-slide-15;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-16 {
  0% {
    width: 1%;
  }
  100% {
    width: 16%;
  }
}

@keyframes percentage-slide-16 {
  0% {
    width: 1%;
  }
  100% {
    width: 16%;
  }
}
.element-bar-16 {
  animation-name: percentage-slide-16;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-17 {
  0% {
    width: 1%;
  }
  100% {
    width: 17%;
  }
}

@keyframes percentage-slide-17 {
  0% {
    width: 1%;
  }
  100% {
    width: 17%;
  }
}
.element-bar-17 {
  animation-name: percentage-slide-17;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-18 {
  0% {
    width: 1%;
  }
  100% {
    width: 18%;
  }
}

@keyframes percentage-slide-18 {
  0% {
    width: 1%;
  }
  100% {
    width: 18%;
  }
}
.element-bar-18 {
  animation-name: percentage-slide-18;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-19 {
  0% {
    width: 1%;
  }
  100% {
    width: 19%;
  }
}

@keyframes percentage-slide-19 {
  0% {
    width: 1%;
  }
  100% {
    width: 19%;
  }
}
.element-bar-19 {
  animation-name: percentage-slide-19;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-20 {
  0% {
    width: 1%;
  }
  100% {
    width: 20%;
  }
}

@keyframes percentage-slide-20 {
  0% {
    width: 1%;
  }
  100% {
    width: 20%;
  }
}
.element-bar-20 {
  animation-name: percentage-slide-20;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-21 {
  0% {
    width: 1%;
  }
  100% {
    width: 21%;
  }
}

@keyframes percentage-slide-21 {
  0% {
    width: 1%;
  }
  100% {
    width: 21%;
  }
}
.element-bar-21 {
  animation-name: percentage-slide-21;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-22 {
  0% {
    width: 1%;
  }
  100% {
    width: 22%;
  }
}

@keyframes percentage-slide-22 {
  0% {
    width: 1%;
  }
  100% {
    width: 22%;
  }
}
.element-bar-22 {
  animation-name: percentage-slide-22;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-23 {
  0% {
    width: 1%;
  }
  100% {
    width: 23%;
  }
}

@keyframes percentage-slide-23 {
  0% {
    width: 1%;
  }
  100% {
    width: 23%;
  }
}
.element-bar-23 {
  animation-name: percentage-slide-23;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-24 {
  0% {
    width: 1%;
  }
  100% {
    width: 24%;
  }
}

@keyframes percentage-slide-24 {
  0% {
    width: 1%;
  }
  100% {
    width: 24%;
  }
}
.element-bar-24 {
  animation-name: percentage-slide-24;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-25 {
  0% {
    width: 1%;
  }
  100% {
    width: 25%;
  }
}

@keyframes percentage-slide-25 {
  0% {
    width: 1%;
  }
  100% {
    width: 25%;
  }
}
.element-bar-25 {
  animation-name: percentage-slide-25;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-26 {
  0% {
    width: 1%;
  }
  100% {
    width: 26%;
  }
}

@keyframes percentage-slide-26 {
  0% {
    width: 1%;
  }
  100% {
    width: 26%;
  }
}
.element-bar-26 {
  animation-name: percentage-slide-26;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-27 {
  0% {
    width: 1%;
  }
  100% {
    width: 27%;
  }
}

@keyframes percentage-slide-27 {
  0% {
    width: 1%;
  }
  100% {
    width: 27%;
  }
}
.element-bar-27 {
  animation-name: percentage-slide-27;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-28 {
  0% {
    width: 1%;
  }
  100% {
    width: 28%;
  }
}

@keyframes percentage-slide-28 {
  0% {
    width: 1%;
  }
  100% {
    width: 28%;
  }
}
.element-bar-28 {
  animation-name: percentage-slide-28;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-29 {
  0% {
    width: 1%;
  }
  100% {
    width: 29%;
  }
}

@keyframes percentage-slide-29 {
  0% {
    width: 1%;
  }
  100% {
    width: 29%;
  }
}
.element-bar-29 {
  animation-name: percentage-slide-29;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-30 {
  0% {
    width: 1%;
  }
  100% {
    width: 30%;
  }
}

@keyframes percentage-slide-30 {
  0% {
    width: 1%;
  }
  100% {
    width: 30%;
  }
}
.element-bar-30 {
  animation-name: percentage-slide-30;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-31 {
  0% {
    width: 1%;
  }
  100% {
    width: 31%;
  }
}

@keyframes percentage-slide-31 {
  0% {
    width: 1%;
  }
  100% {
    width: 31%;
  }
}
.element-bar-31 {
  animation-name: percentage-slide-31;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-32 {
  0% {
    width: 1%;
  }
  100% {
    width: 32%;
  }
}

@keyframes percentage-slide-32 {
  0% {
    width: 1%;
  }
  100% {
    width: 32%;
  }
}
.element-bar-32 {
  animation-name: percentage-slide-32;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-33 {
  0% {
    width: 1%;
  }
  100% {
    width: 33%;
  }
}

@keyframes percentage-slide-33 {
  0% {
    width: 1%;
  }
  100% {
    width: 33%;
  }
}
.element-bar-33 {
  animation-name: percentage-slide-33;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-34 {
  0% {
    width: 1%;
  }
  100% {
    width: 34%;
  }
}

@keyframes percentage-slide-34 {
  0% {
    width: 1%;
  }
  100% {
    width: 34%;
  }
}
.element-bar-34 {
  animation-name: percentage-slide-34;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-35 {
  0% {
    width: 1%;
  }
  100% {
    width: 35%;
  }
}

@keyframes percentage-slide-35 {
  0% {
    width: 1%;
  }
  100% {
    width: 35%;
  }
}
.element-bar-35 {
 animation-name: percentage-slide-35;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-36 {
  0% {
    width: 1%;
  }
  100% {
    width: 36%;
  }
}

@keyframes percentage-slide-36 {
  0% {
    width: 1%;
  }
  100% {
    width: 36%;
  }
}
.element-bar-36 {
  animation-name: percentage-slide-36;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-37 {
  0% {
    width: 1%;
  }
  100% {
    width: 37%;
  }
}

@keyframes percentage-slide-37 {
  0% {
    width: 1%;
  }
  100% {
    width: 37%;
  }
}
.element-bar-37 {
  animation-name: percentage-slide-37;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-38 {
  0% {
    width: 1%;
  }
  100% {
    width: 38%;
  }
}

@keyframes percentage-slide-38 {
  0% {
    width: 1%;
  }
  100% {
    width: 38%;
  }
}
.element-bar-38 {
  animation-name: percentage-slide-38;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-39 {
  0% {
    width: 1%;
  }
  100% {
    width: 39%;
  }
}

@keyframes percentage-slide-39 {
  0% {
    width: 1%;
  }
  100% {
    width: 39%;
  }
}
.element-bar-39 {
  animation-name: percentage-slide-39;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-40 {
  0% {
    width: 1%;
  }
  100% {
    width: 40%;
  }
}

@keyframes percentage-slide-40 {
  0% {
    width: 1%;
  }
  100% {
    width: 40%;
  }
}
.element-bar-40 {
  animation-name: percentage-slide-40;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-41 {
  0% {
    width: 1%;
  }
  100% {
    width: 41%;
  }
}

@keyframes percentage-slide-41 {
  0% {
    width: 1%;
  }
  100% {
    width: 41%;
  }
}
.element-bar-41 {
  animation-name: percentage-slide-41;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-42 {
  0% {
    width: 1%;
  }
  100% {
    width: 42%;
  }
}

@keyframes percentage-slide-42 {
  0% {
    width: 1%;
  }
  100% {
    width: 42%;
  }
}
.element-bar-42 {
  animation-name: percentage-slide-42;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-43 {
  0% {
    width: 1%;
  }
  100% {
    width: 43%;
  }
}

@keyframes percentage-slide-43 {
  0% {
    width: 1%;
  }
  100% {
    width: 43%;
  }
}
.element-bar-43 {
  animation-name: percentage-slide-43;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-44 {
  0% {
    width: 1%;
  }
  100% {
    width: 44%;
  }
}

@keyframes percentage-slide-44 {
  0% {
    width: 1%;
  }
  100% {
    width: 44%;
  }
}
.element-bar-44 {
  animation-name: percentage-slide-44;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-45 {
  0% {
    width: 1%;
  }
  100% {
    width: 45%;
  }
}

@keyframes percentage-slide-45 {
  0% {
    width: 1%;
  }
  100% {
    width: 45%;
  }
}
.element-bar-45 {
  animation-name: percentage-slide-45;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-46 {
  0% {
    width: 1%;
  }
  100% {
    width: 46%;
  }
}

@keyframes percentage-slide-46 {
  0% {
    width: 1%;
  }
  100% {
    width: 46%;
  }
}
.element-bar-46 {
  animation-name: percentage-slide-46;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-47 {
  0% {
    width: 1%;
  }
  100% {
    width: 47%;
  }
}

@keyframes percentage-slide-47 {
  0% {
    width: 1%;
  }
  100% {
    width: 47%;
  }
}
.element-bar-47 {
  animation-name: percentage-slide-47;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-48 {
  0% {
    width: 1%;
  }
  100% {
    width: 48%;
  }
}

@keyframes percentage-slide-48 {
  0% {
    width: 1%;
  }
  100% {
    width: 48%;
  }
}
.element-bar-48 {
  animation-name: percentage-slide-48;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-49 {
  0% {
    width: 1%;
  }
  100% {
    width: 49%;
  }
}

@keyframes percentage-slide-49 {
  0% {
    width: 1%;
  }
  100% {
    width: 49%;
  }
}
.element-bar-49 {
  animation-name: percentage-slide-49;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-50 {
  0% {
    width: 1%;
  }
  100% {
    width: 50%;
  }
}

@keyframes percentage-slide-50 {
  0% {
    width: 1%;
  }
  100% {
    width: 50%;
  }
}
.element-bar-50 {
  animation-name: percentage-slide-50;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-51 {
  0% {
    width: 1%;
  }
  100% {
    width: 51%;
  }
}

@keyframes percentage-slide-51 {
  0% {
    width: 1%;
  }
  100% {
    width: 51%;
  }
}
.element-bar-51 {
  animation-name: percentage-slide-51;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-52 {
  0% {
    width: 1%;
  }
  100% {
    width: 52%;
  }
}

@keyframes percentage-slide-52 {
  0% {
    width: 1%;
  }
  100% {
    width: 52%;
  }
}
.element-bar-52 {
  animation-name: percentage-slide-52;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-53 {
  0% {
    width: 1%;
  }
  100% {
    width: 53%;
  }
}

@keyframes percentage-slide-53 {
  0% {
    width: 1%;
  }
  100% {
    width: 53%;
  }
}
.element-bar-53 {
  animation-name: percentage-slide-53;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-54 {
  0% {
    width: 1%;
  }
  100% {
    width: 54%;
  }
}

@keyframes percentage-slide-54 {
  0% {
    width: 1%;
  }
  100% {
    width: 54%;
  }
}
.element-bar-54 {
  animation-name: percentage-slide-54;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-55 {
  0% {
    width: 1%;
  }
  100% {
    width: 55%;
  }
}

@keyframes percentage-slide-55 {
  0% {
    width: 1%;
  }
  100% {
    width: 55%;
  }
}
.element-bar-55 {
  animation-name: percentage-slide-55;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-56 {
  0% {
    width: 1%;
  }
  100% {
    width: 56%;
  }
}

@keyframes percentage-slide-56 {
  0% {
    width: 1%;
  }
  100% {
    width: 56%;
  }
}
.element-bar-56 {
  animation-name: percentage-slide-56;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-57 {
  0% {
    width: 1%;
  }
  100% {
    width: 57%;
  }
}

@keyframes percentage-slide-57 {
  0% {
    width: 1%;
  }
  100% {
    width: 57%;
  }
}
.element-bar-57 {
  animation-name: percentage-slide-57;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-58 {
  0% {
    width: 1%;
  }
  100% {
    width: 58%;
  }
}

@keyframes percentage-slide-58 {
  0% {
    width: 1%;
  }
  100% {
    width: 58%;
  }
}
.element-bar-58 {
  animation-name: percentage-slide-58;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-59 {
  0% {
    width: 1%;
  }
  100% {
    width: 59%;
  }
}

@keyframes percentage-slide-59 {
  0% {
    width: 1%;
  }
  100% {
    width: 59%;
  }
}
.element-bar-59 {
  animation-name: percentage-slide-59;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-60 {
  0% {
    width: 1%;
  }
  100% {
    width: 60%;
  }
}

@keyframes percentage-slide-60 {
  0% {
    width: 1%;
  }
  100% {
    width: 60%;
  }
}
.element-bar-60 {
 animation-name: percentage-slide-60;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-61 {
  0% {
    width: 1%;
  }
  100% {
    width: 61%;
  }
}

@keyframes percentage-slide-61 {
  0% {
    width: 1%;
  }
  100% {
    width: 61%;
  }
}
.element-bar-61 {
  animation-name: percentage-slide-61;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-62 {
  0% {
    width: 1%;
  }
  100% {
    width: 62%;
  }
}

@keyframes percentage-slide-62 {
  0% {
    width: 1%;
  }
  100% {
    width: 62%;
  }
}
.element-bar-62 {
  animation-name: percentage-slide-62;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-63 {
  0% {
    width: 1%;
  }
  100% {
    width: 63%;
  }
}

@keyframes percentage-slide-63 {
  0% {
    width: 1%;
  }
  100% {
    width: 63%;
  }
}
.element-bar-63 {
  animation-name: percentage-slide-63;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-64 {
  0% {
    width: 1%;
  }
  100% {
    width: 64%;
  }
}

@keyframes percentage-slide-64 {
  0% {
    width: 1%;
  }
  100% {
    width: 64%;
  }
}
.element-bar-64 {
  animation-name: percentage-slide-64;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-65 {
  0% {
    width: 1%;
  }
  100% {
    width: 65%;
  }
}

@keyframes percentage-slide-65 {
  0% {
    width: 1%;
  }
  100% {
    width: 65%;
  }
}
.element-bar-65 {
  animation-name: percentage-slide-65;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-66 {
  0% {
    width: 1%;
  }
  100% {
    width: 66%;
  }
}

@keyframes percentage-slide-66 {
  0% {
    width: 1%;
  }
  100% {
    width: 66%;
  }
}
.element-bar-66 {
  animation-name: percentage-slide-66;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-67 {
  0% {
    width: 1%;
  }
  100% {
    width: 67%;
  }
}

@keyframes percentage-slide-67 {
  0% {
    width: 1%;
  }
  100% {
    width: 67%;
  }
}
.element-bar-67 {
  animation-name: percentage-slide-67;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-68 {
  0% {
    width: 1%;
  }
  100% {
    width: 68%;
  }
}

@keyframes percentage-slide-68 {
  0% {
    width: 1%;
  }
  100% {
    width: 68%;
  }
}
.element-bar-68 {
  animation-name: percentage-slide-68;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-69 {
  0% {
    width: 1%;
  }
  100% {
    width: 69%;
  }
}

@keyframes percentage-slide-69 {
  0% {
    width: 1%;
  }
  100% {
    width: 69%;
  }
}
.element-bar-69 {
  animation-name: percentage-slide-69;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-70 {
  0% {
    width: 1%;
  }
  100% {
    width: 70%;
  }
}

@keyframes percentage-slide-70 {
  0% {
    width: 1%;
  }
  100% {
    width: 70%;
  }
}
.element-bar-70 {
  animation-name: percentage-slide-70;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-71 {
  0% {
    width: 1%;
  }
  100% {
    width: 71%;
  }
}

@keyframes percentage-slide-71 {
  0% {
    width: 1%;
  }
  100% {
    width: 71%;
  }
}
.element-bar-71 {
    animation-name: percentage-slide-71;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-72 {
  0% {
    width: 1%;
  }
  100% {
    width: 72%;
  }
}

@keyframes percentage-slide-72 {
  0% {
    width: 1%;
  }
  100% {
    width: 72%;
  }
}
.element-bar-72 {
    animation-name: percentage-slide-72;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-73 {
  0% {
    width: 1%;
  }
  100% {
    width: 73%;
  }
}

@keyframes percentage-slide-73 {
  0% {
    width: 1%;
  }
  100% {
    width: 73%;
  }
}
.element-bar-73 {
    animation-name: percentage-slide-73;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-74 {
  0% {
    width: 1%;
  }
  100% {
    width: 74%;
  }
}

@keyframes percentage-slide-74 {
  0% {
    width: 1%;
  }
  100% {
    width: 74%;
  }
}
.element-bar-74 {
    animation-name: percentage-slide-74;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-75 {
  0% {
    width: 1%;
  }
  100% {
    width: 75%;
  }
}

@keyframes percentage-slide-75 {
  0% {
    width: 1%;
  }
  100% {
    width: 75%;
  }
}
.element-bar-75 {
    animation-name: percentage-slide-75;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-76 {
  0% {
    width: 1%;
  }
  100% {
    width: 76%;
  }
}

@keyframes percentage-slide-76 {
  0% {
    width: 1%;
  }
  100% {
    width: 76%;
  }
}
.element-bar-76 {
    animation-name: percentage-slide-76;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-77 {
  0% {
    width: 1%;
  }
  100% {
    width: 77%;
  }
}

@keyframes percentage-slide-77 {
  0% {
    width: 1%;
  }
  100% {
    width: 77%;
  }
}
.element-bar-77 {
    animation-name: percentage-slide-77;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-78 {
  0% {
    width: 1%;
  }
  100% {
    width: 78%;
  }
}

@keyframes percentage-slide-78 {
  0% {
    width: 1%;
  }
  100% {
    width: 78%;
  }
}
.element-bar-78 {
    animation-name: percentage-slide-78;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-79 {
  0% {
    width: 1%;
  }
  100% {
    width: 79%;
  }
}

@keyframes percentage-slide-79 {
  0% {
    width: 1%;
  }
  100% {
    width: 79%;
  }
}
.element-bar-79 {
    animation-name: percentage-slide-79;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-80 {
  0% {
    width: 1%;
  }
  100% {
    width: 80%;
  }
}

@keyframes percentage-slide-80 {
  0% {
    width: 1%;
  }
  100% {
    width: 80%;
  }
}
.element-bar-80 {
    animation-name: percentage-slide-80;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-81 {
  0% {
    width: 1%;
  }
  100% {
    width: 81%;
  }
}

@keyframes percentage-slide-81 {
  0% {
    width: 1%;
  }
  100% {
    width: 81%;
  }
}
.element-bar-81 {
  animation-name: percentage-slide-81;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-82 {
  0% {
    width: 1%;
  }
  100% {
    width: 82%;
  }
}

@keyframes percentage-slide-82 {
  0% {
    width: 1%;
  }
  100% {
    width: 82%;
  }
}
.element-bar-82 {
  animation-name: percentage-slide-82;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-83 {
  0% {
    width: 1%;
  }
  100% {
    width: 83%;
  }
}

@keyframes percentage-slide-83 {
  0% {
    width: 1%;
  }
  100% {
    width: 83%;
  }
}
.element-bar-83 {
  animation-name: percentage-slide-83;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-84 {
  0% {
    width: 1%;
  }
  100% {
    width: 84%;
  }
}

@keyframes percentage-slide-84 {
  0% {
    width: 1%;
  }
  100% {
    width: 84%;
  }
}
.element-bar-84 {
  animation-name: percentage-slide-84;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-85 {
  0% {
    width: 1%;
  }
  100% {
    width: 85%;
  }
}

@keyframes percentage-slide-85 {
  0% {
    width: 1%;
  }
  100% {
    width: 85%;
  }
}
.element-bar-85 {
  animation-name: percentage-slide-85;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-86 {
  0% {
    width: 1%;
  }
  100% {
    width: 86%;
  }
}

@keyframes percentage-slide-86 {
  0% {
    width: 1%;
  }
  100% {
    width: 86%;
  }
}
.element-bar-86 {
  animation-name: percentage-slide-86;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-87 {
  0% {
    width: 1%;
  }
  100% {
    width: 87%;
  }
}

@keyframes percentage-slide-87 {
  0% {
    width: 1%;
  }
  100% {
    width: 87%;
  }
}
.element-bar-87 {
  animation-name: percentage-slide-87;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-88 {
  0% {
    width: 1%;
  }
  100% {
    width: 88%;
  }
}

@keyframes percentage-slide-88 {
  0% {
    width: 1%;
  }
  100% {
    width: 88%;
  }
}
.element-bar-88 {
  animation-name: percentage-slide-88;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-89 {
  0% {
    width: 1%;
  }
  100% {
    width: 89%;
  }
}

@keyframes percentage-slide-89 {
  0% {
    width: 1%;
  }
  100% {
    width: 89%;
  }
}
.element-bar-89 {
  animation-name: percentage-slide-89;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-90 {
  0% {
    width: 1%;
  }
  100% {
    width: 90%;
  }
}

@keyframes percentage-slide-90 {
  0% {
    width: 1%;
  }
  100% {
    width: 90%;
  }
}
.element-bar-90 {
  animation-name: percentage-slide-90;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-91 {
  0% {
    width: 1%;
  }
  100% {
    width: 91%;
  }
}

@keyframes percentage-slide-91 {
  0% {
    width: 1%;
  }
  100% {
    width: 91%;
  }
}
.element-bar-91 {
  animation-name: percentage-slide-91;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-92 {
  0% {
    width: 1%;
  }
  100% {
    width: 92%;
  }
}

@keyframes percentage-slide-92 {
  0% {
    width: 1%;
  }
  100% {
    width: 92%;
  }
}
.element-bar-92 {
  animation-name: percentage-slide-92;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-93 {
  0% {
    width: 1%;
  }
  100% {
    width: 93%;
  }
}

@keyframes percentage-slide-93 {
  0% {
    width: 1%;
  }
  100% {
    width: 93%;
  }
}
.element-bar-93 {
  animation-name: percentage-slide-93;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-94 {
  0% {
    width: 1%;
  }
  100% {
    width: 94%;
  }
}

@keyframes percentage-slide-94 {
  0% {
    width: 1%;
  }
  100% {
    width: 94%;
  }
}
.element-bar-94 {
  animation-name: percentage-slide-94;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-95 {
  0% {
    width: 1%;
  }
  100% {
    width: 95%;
  }
}

@keyframes percentage-slide-95 {
  0% {
    width: 1%;
  }
  100% {
    width: 95%;
  }
}
.element-bar-95 {
  animation-name: percentage-slide-95;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-96 {
  0% {
    width: 1%;
  }
  100% {
    width: 96%;
  }
}

@keyframes percentage-slide-96 {
  0% {
    width: 1%;
  }
  100% {
    width: 96%;
  }
}
.element-bar-96 {
  animation-name: percentage-slide-96;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-97 {
  0% {
    width: 1%;
  }
  100% {
    width: 97%;
  }
}

@keyframes percentage-slide-97 {
  0% {
    width: 1%;
  }
  100% {
    width: 97%;
  }
}
.element-bar-97 {
  animation-name: percentage-slide-97;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-98 {
  0% {
    width: 1%;
  }
  100% {
    width: 98%;
  }
}

@keyframes percentage-slide-98 {
  0% {
    width: 1%;
  }
  100% {
    width: 98%;
  }
}
.element-bar-98 {
  animation-name: percentage-slide-98;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-99 {
  0% {
    width: 1%;
  }
  100% {
    width: 99%;
  }
}

@keyframes percentage-slide-99 {
  0% {
    width: 1%;
  }
  100% {
    width: 99%;
  }
}
.element-bar-99 {
  animation-name: percentage-slide-99;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-100 {
  0% {
    width: 1%;
  }
  100% {
    width: 100%;
  }
}

@keyframes percentage-slide-100 {
  0% {
    width: 1%;
  }
  100% {
    width: 100%;
  }
}
.element-bar-100 {
  animation-name: percentage-slide-100;
    animation-duration: 3s;
}

@-webkit-keyframes percentage-slide-101 {
  0% {
    width: 1%;
  }
  100% {
    width: 101%;
  }
}

@keyframes percentage-slide-101 {
  0% {
    width: 1%;
  }
  100% {
    width: 101%;
  }
}
.element-bar-101 {
  animation-name: percentage-slide-101;
    animation-duration: 3s;
}