lottery/resources/scss/base/bootstrap-extended/_helper.scss

// ================================================================================================
// 	File Name: helper.scss
// 	Description: Helper classes provides template related customization.
// 	----------------------------------------------------------------------------------------------
// 	Item Name: Vuexy - Vuejs, React, Angular, HTML & Laravel Admin Dashboard Template
// 	Author: PIXINVENT
// 	Author URL: http://www.themeforest.net/user/pixinvent
// ================================================================================================

// Content helpers
// -------------------------

// typography page icon with list
.list-style-icons {
  padding-left: 10px;
  margin-left: 0;
  list-style: none;
  > li svg,
  > li i {
    margin-right: 6px;
  }
}

//Pull the element
.pull-up {
  transition: all 0.25s ease;

  &:hover {
    transform: translateY(-4px) scale(1.02);
    box-shadow: 0px 14px 24px rgba(62, 57, 107, 0.2);
    z-index: 30;
  }
}

// Spinner classes
.spinner {
  display: inline-block;
  animation: spin 1s linear infinite;
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.spinner-reverse {
  display: inline-block;
  animation: spin-reverse 1s linear infinite;
}
@keyframes spin-reverse {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(-360deg);
  }
}

// Bullets used in application pages
.bullet {
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  display: inline-block;
  &.bullet-xs {
    width: 0.5rem;
    height: 0.5rem;
  }
  &.bullet-sm {
    width: 0.714rem;
    height: 0.714rem;
  }
  &.bullet-lg {
    width: 1.25rem;
    height: 1.25rem;
  }
}

// Section Label - used in pages and apps
.section-label {
  font-size: 0.85rem;
  color: $text-muted;
  text-transform: uppercase;
  letter-spacing: 0.6px;
}

// Used for table cell fit
.cell-fit {
  width: 0.1%;
  white-space: nowrap;
}

// Card match height
.match-height {
  > [class*='col'] {
    display: flex;
    flex-flow: column;

    > .card {
      flex: 1 1 auto;
    }
  }
}