#loading-bg{
  width: 100%;
  height: 100%;
  background: #FFF;
  display: block;
  position: absolute;
}
.loading-logo{
  position: absolute;
  left: calc(50% - 45px);
  top: 40%;
}
.loading {
  position: absolute;
  left: calc(50% - 35px);
  top: 50%;
  width: 55px;
  height: 55px;
  border-radius: 50%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: 3px solid transparent;
}
.loading .effect-1,  .loading .effect-2{
  position: absolute;
  width: 100%;
  height: 100%;
  border: 3px solid transparent;
  border-left: 3px solid rgba(121, 97, 249,1);
  border-radius: 50%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.loading .effect-1{
  animation: rotate 1s ease infinite;
}
.loading .effect-2{
  animation: rotateOpacity 1s ease infinite .1s;
}
.loading .effect-3{
  position: absolute;
  width: 100%;
  height: 100%;
  border: 3px solid transparent;
  border-left: 3px solid rgba(121, 97, 249,1);
  -webkit-animation: rotateOpacity 1s ease infinite .2s;
  animation: rotateOpacity 1s ease infinite .2s;
  border-radius: 50%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.loading .effects{
  transition: all .3s ease;
}
.satirIcon{
  width: 16px;
  margin-right: 5px;
}
.filterIcon{
  font-size: 25px!important;
  margin-right: 5px;
}
.bg-info {
  background: #17a2b8!important;
  color: black;
}
.info {
  color: #17a2b8!important;
}

.bg-warning {
  background: #ff9f43!important;
  color: black;
}
.bg-primary {
  background:#707172!important;
  color: white;
}
.bg-success {
  background: #28c76f!important;
}
.bg-danger {
  background: #ea5455!important;
  color: black;
}
.bg-dark {
  background: #1e1e1e!important;
  color: white;
}


.warning {
  color: #ff9f43!important;
}
.primary {
  color:#007bff!important;
}
.success {
  color: #28c76f!important;
}
.danger {
  color: #ea5455!important;
}
.dark {
  color: #1e1e1e!important;
}
label{
  padding-left: 2px;
}
.list-item-component.info,
.list-item-component.warning,
.list-item-component.success,
.list-item-component.danger,
.list-item-component.primary {
  border-left: solid 5px !important;
}
.technic-title span {
  border-right: solid grey 1px;
  padding: 0 5px;
}
.technic-title span:last-child {
  border-right: none;
  padding: 0 5px;
}

@keyframes rotate{
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(1turn);
    transform: rotate(1turn);
  }
}
@keyframes rotateOpacity{
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    opacity: .1;
  }
  100% {
    -webkit-transform: rotate(1turn);
    transform: rotate(1turn);
    opacity: 1;
  }
}