@keyframes selfRotate {
  from{
    transform: translate(-50%, -50%) rotate(0deg);
  }
  to{
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
@keyframes selfRotate2 {
  from{
    // transform: ;
    transform: rotate(0deg);
  }
  to{
    // transform: ;
    transform: rotate(360deg);
  }
}
@keyframes selfRotateReverse {
  from{
    transform: rotate(0deg);
  }
  to{
    transform: rotate(-360deg);
  }
}

@keyframes showFromSmall {
  from{
    transform: translate(-50%, -50%) scale(0.1);
  }
  to{
    transform: translate(-50%, -50%) scale(1);
  }
}

@keyframes showfromSide {
  from{
    opacity: 0 !important;
    transform: translateX(-100px);
  }
  to{
    opacity: 1 !important;
    transform: translate(0px);
  }
}

@keyframes showfromSide2 {
  from{
    opacity: 0.1;
    transform: translateX(100px);
  }
  to{
    opacity: 1;
    transform: translate(0px);
  }
}

@keyframes selfRotateButtom {
  from{
    transform: rotate(0deg);
  }
  to{
    transform: rotate(-360deg);
  }
}

