:root {
  --dark: #333;
  --niceBlue: #005bea;
  --white: #f9f9f9;
}

/* loader style */

.overlay {
  width: 100% !important;
  height: 100% !important;
  background: white !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  z-index: 20000;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.loader span {
  z-index: 100;
  font-size: 25px;
  font-weight: 900;
  opacity: 0.4;
  position: relative;
  left: -920px;
}

.overlay.hide {
  opacity: 0;
  visibility: hidden;
}

/* Float action button for moving to the top */

.float-action-button {
  width: 25px;
  height: 25px;
  border-radius: 50%;
  box-shadow: 0 0 3px var(--dark);
  text-align: center;
  vertical-align: center;
  position: fixed;
  z-index: 50;
  left: 50%;
  bottom: 10px;
  transition: 0.3s ease all;
}

.float-action-button:hover {
  background-color: var(--niceBlue);
}

.float-action-button:hover > a {
  color: var(--white);
}