.png_color{
  filter: invert(13%) sepia(14%) saturate(2119%) hue-rotate(182deg) brightness(100%) contrast(100%);
}


.it_background{
  width: 100px;

  height:  100px;
  background-image: linear-gradient(0deg, #60bbea, #60bbea);
  border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
  opacity: 0.7;
  /*top: -15px;*/

  animation-duration: 3s;
  animation-name: transform_it_shape;
  animation-iteration-count: infinite ;
  animation-direction: alternate;
  overflow:auto;
}



.it_png{
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    position: absolute;
}

.it_container{
  position: relative;
}




@keyframes transform_it_shape {
  from {
    width:  100px;
    height:  75px;
  filter: blur(1px); opacity: 1;

  }

  to {
    width:  90px;
    height:  60px;
    filter: blur(1px); opacity: 1; 
  }
}

/* Another icon */


 .vermessung_background{
  width: 100px;

  height:  100px;
  background-image: linear-gradient(0deg, #60bbea, #60bbea);
  border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
  opacity: 0.7;
  

  animation-duration: 5s;
  animation-name: transform_vermessung_shape;
  animation-iteration-count: infinite ;
  animation-direction: alternate;

}



.vermessung_png{
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    position: absolute;
}

.vermessung_container{
  position: relative;
}




@keyframes transform_vermessung_shape {
  from {
    width:  75px;
    height:  100px;
  filter: blur(1px); opacity: 1;

  }

  to {
    width:  60px;
    height:  90px;
    filter: blur(1px); opacity: 1; 
    top: -15px;
  }
}



/*Another icon*/


 .kaufmannisch_background{
  width: 100px;

  height:  100px;
  background-image: linear-gradient(0deg, #60bbea, #60bbea);
  border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
  opacity: 0.7;
  

  animation-duration: 5s;
  animation-name: transform_kaufmannisch_shape;
  animation-iteration-count: infinite ;
  animation-direction: alternate;

}



.kaufmannisch_png{
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    position: absolute;
}

.kaufmannisch_container{
  position: relative;
}



@keyframes transform_kaufmannisch_shape {
  from {
    width:  90px;
    height:  100px;
  filter: blur(1px); opacity: 1;

  }

  to {
    width:  80px;
    height:  90px;
    filter: blur(1px); opacity: 1; 
    top: +15px;
  }
}

/*Another icon*/


 .project_managment_background{
  width: 100px;

  height:  100px;
  background-image: linear-gradient(0deg, #60bbea, #60bbea);
  border-radius: 50% 40% 50% 50% / 60% 65% 40% 45%;
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
  opacity: 0.7;
  

  animation-duration: 5s;
  animation-name: transform_project_managment_shape;
  animation-iteration-count: infinite ;
  animation-direction: alternate;

}



.project_managment_png{
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    position: absolute;
}

.project_managment_container{
  position: relative;
}



@keyframes transform_project_managment_shape {
  from {
    border-radius: 0% ;
    width:  90px;
    height:  100px;
  filter: blur(1px); opacity: 1;

  }

  to {
    border-radius: 20% ;
    width:  80px;
    height:  90px;
    filter: blur(1px); opacity: 1; 
    top: +15px;
  }
}

/*Another icon*/


 .genehmigung_background{
  width: 100px;

  height:  100px;
  text-align: center;
  color: #60bbea;
  font-size: 150px;
  /*background-image: linear-gradient(0deg, #60bbea, #60bbea);*/
  border-radius: 50% 40% 50% 50% / 60% 65% 40% 45%;
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%) rotate(15deg);
  opacity: 0.7;
  top: -40px;

  animation-duration: 5s;
  animation-name: transform_genehmigung_shape;
  animation-iteration-count: infinite ;
  animation-direction: alternate;

}



.genehmigung_png{
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    position: absolute;
}

.genehmigung_container{
  position: relative;
}



@keyframes transform_genehmigung_shape {
  from {
    /*font-size: 80px;*/
    width:  120px;
    height:  100px;
  filter: blur(1px); opacity: 1;

  }

  to {
    /*font-size: 150.5px;*/
    width:  100px;
    height:  90px;
    filter: blur(1px); opacity: 1; 
    
  }
}


/*another icon*/

.plannung_background{
  width: 80px;

  height:  40px;
  background-image: linear-gradient(0deg, #60bbea, #60bbea);
  border-radius: 50% 40% 50% 50% / 60% 65% 40% 45%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  opacity: 0.7;
  

  animation-duration: 5s;
  animation-name: transform_plannung_shape;
  animation-iteration-count: infinite;
  animation-direction: alternate;

}



.plannung_png{
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    position: absolute;
}

.plannung_container{
  position: relative;
}



@keyframes transform_plannung_shape {
  from {
    border-radius: 0% ;
    width:  90px;
    height:  50px;
  filter: blur(1px); opacity: 1;

  }

  to {
    border-radius: 20% ;
    width:  80px;
    height:  40px;
    filter: blur(1px); opacity: 1; 
    /*top: +15px;*/
  }
}


/*Vision Icon*/


.vision_background{
  width: 80px;

  height:  40px;
  background-image: linear-gradient(0deg, #60bbea, #60bbea);
  border-radius: 50% 40% 50% 50% / 60% 65% 40% 45%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%); 
  opacity: 0.7;
  

  animation-duration: 5s;
  animation-name: transform_vision_shape;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  overflow:auto;

}



.vision_png{
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    position: absolute;
    overflow:auto
}

.vision_container{
/*overflow:auto;*/
  position: relative;
}



@keyframes transform_vision_shape {
  from {
    width:  90px;
    height:  50px;
  filter: blur(1px); opacity: 1;

  }

  to {
    width:  80px;
    height:  40px;
    filter: blur(1px); opacity: 1; 
    /*top: +15px;*/
  }
}


/*Mission Icon*/

.mission_background{
  width: 120px;

  height:  120px;
  background-image: linear-gradient(0deg, #60bbea, #60bbea);
  border-radius: 50% ;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%); 
  opacity: 0.7;
  

  animation-duration: 5s;
  animation-name: transform_mission_shape;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  overflow:auto;

}



.mission_png{
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    position: absolute;
    overflow:auto
}

.mission_container{
/*overflow:auto;*/
  position: relative;
}



@keyframes transform_mission_shape {
  from {
    border-radius: 50% ;
    /*width:  90px;*/
    /*height:  50px;*/
  filter: blur(1px); opacity: 1;

  }

  to {
    border-radius: 30% ;
    /*width:  80px;*/
    /*height:  40px;*/
    filter: blur(1px); opacity: 1; 
    /*top: +15px;*/
  }
}