
/** skills-section **/

.skills-section{
  position: relative;
}

.image_block_five .image-box{
  position: relative;
  display: block;
}

.image_block_five .image-box .image{
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: 20px;
}

.image_block_five .image-box .image img{
  width: 100%;
  border-radius: 20px;
}

.image_block_five .image-box .image:before{
  position: absolute;
  top: 0;
  left: -85%;
  z-index: 2;
  display: block;
  content: '';
  width: 50%;
  height: 100%;
  background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .3) 100%);
  background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, .3)));
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .3) 100%);
  -webkit-transform: skewX(-25deg);
  -ms-transform: skewX(-25deg);
  transform: skewX(-25deg);
  z-index: 1;
}

.image_block_five .image-box .image:hover:before {
  -webkit-animation: shine 1s;
  animation: shine 1s;
}

.image_block_five .image-box .image-shape .shape-1{
  position: absolute;
  left: -91px;
  bottom: -76px;
  width: 213px;
  height: 213px;
  background-repeat: no-repeat;
  -webkit-animation: zoom-fade 5s infinite linear;
  animation: zoom-fade 5s infinite linear;
}

.image_block_five .image-box .image-shape .shape-2{
  position: absolute;
  top: -72px;
  right: -56px;
  width: 180px;
  height: 180px;
  background-repeat: no-repeat;
  -webkit-animation: zoom-fade 4s infinite linear;
  animation: zoom-fade 4s infinite linear;
}

.image_block_five .image-box .image-shape .shape-3 {
  position: absolute;
  left: -143px;
  bottom: 63px;
  width: 113px;
  height: 108px;
  background-repeat: no-repeat;
}

.progress-box .bar{
  position:relative;
  width:100%;
  height:7px;
  background: #EBF5E9;
  border-radius: 25px;
}
  
.progress-box .bar-inner{
  position:relative;
  display:block;
  background: var(--theme-color);
  width:0px;
  height:7px;
  border-radius: 25px 0px 0px 25px;
  -webkit-transition:all 1500ms ease;
  -ms-transition:all 1500ms ease;
  -o-transition:all 1500ms ease;
  -moz-transition:all 1500ms ease;
  transition:all 1500ms ease; 
}

.progress-box{
  position: relative;
  margin-bottom: 22px;
}

.progress-box:last-child{
  margin-bottom: 0px;
}

.progress-box .count-text{
  position: absolute;
  top: -32px;
  right: 0px;
  font-size: 16px;
  font-weight: 500;
  color: #222;
}

.progress-box p{
  display: block;
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
  color: #222;
  margin-bottom: 6px;
}












































