@maherunlocker/custom-react-table/src/components/LoadingDataAnimation/Loading.css

**Custom-react-table** is based on <code>React-Table v7</code>: collection of hooks for **building powerful tables and datagrid experiences**. These hooks are lightweight, composable, and ultra-extensible, but **do not render any markup or styles for you*

#loading_animation {
  display: inline-block;
  color: rgba(68, 185, 252, 0.3);
  width: 50px;
  height: 50px;
  border: 3px solid rgba(68, 185, 252, 0.3);
  border-radius: 50%;
  border-top-color: #fff;
  animation: spin 1s ease-in-out infinite;
  -webkit-animation: spin 1s ease-in-out infinite;
}

@keyframes spin {
  to {
    -webkit-transform: rotate(360deg);
  }
}
@-webkit-keyframes spin {
  to {
    -webkit-transform: rotate(360deg);
  }
}
.centeranimation {
  display: flex !important;
  flex-direction: row !important;
  margin-top: 20% !important;
  justify-content: center !important;
  z-index: 1050 !important;
}
.errorLoding {
  opacity: 0;
  text-align: center;
  background-color: rgba(255, 0, 0, 0.4);
  border-radius: 10px;
  border: 4px solid rgba(255, 0, 0, 0.4);
  line-height: 1.5;
  -webkit-background-clip: padding-box; /* for Safari */
  background-clip: padding-box;
  transition: opacity 0.4s ease-in;
  -ms-transition: opacity 0.4s ease-in;
  -moz-transition: opacity 0.4s ease-in;
  -webkit-transition: opacity 0.4s ease-in;
}