.loading-overlay {
  &.is-full-page {
    .loading-background {
      background:rgba(0,0,0,0.85);
    }
  }
  .loading-container {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    .loading-tornado {
      &:after {
        content: '';
        display: block;
        height: 60px;
        width: 60px;
        background-image: url('../img/logo.svg');
        animation: spinAroundReverse 2000ms infinite linear;
      }
    }

    .loading-message {
      padding-top: .5rem;
      color: $primary;
      text-align: center;

      &.is-danger {
        color: $danger;
      }
    }
  }
}

@keyframes spinAroundReverse {
  from {
    transform: rotate(359deg); }
  to {
    transform: rotate(0deg); }
}