@mixin mat-icon($size: 24px) {
    font-size: $size;
    height: $size;
    width: $size;
    color:white;
}

@mixin mat-headline {
    margin: 0px;
    color: white;
}

@mixin dashcard($theme) {

    .dashcard {
        margin: 10px 5px;
        height: 100px;
        background-color:white;
    }
    .mat-icon {
        @include mat-icon(40px);
    }
    .border-top {
        border-top: 1px solid white;
    }
    .mat-headline {
        @include mat-headline();
    }
    .mat-body-1{
        @include mat-headline();
    }
}
.nav-item {
  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  cursor: default;

  &:hover {
    transform: translate(0, -8px);
    box-shadow: 0 20px 20px rgba(0, 0, 0, .16)
  }
}
@mixin round-progressbar($theme) {
    .round-progressbar {
      
        .semi_on{
          top:  auto;
          bottom: 5%;
          left: 50%;
          transform: translateX(-50%);
          -moz-transform: translateX(-50%);
          -webkit-transform: translateX(-50%);
          font-size: 250 / 7 px;
        }

        .semi_off{
          top:  50%;
          bottom: auto;
          left: 50%;
          transform: translateY(-50%) translateX(-50%);
          -moz-transform: translateY(-50%) translateX(-50%);
          -webkit-transform: translateY(-50%) translateX(-50%);
          font-size: 250 / 7 px;

        } 
      
         margin: 10px 5px;
         padding: 10px;
         background-color:white;
         
         & .header {
            text-align: center;
            color:white;
         }
         & .roundholder{
            position: absolute;
            
            & .current{
                position: relative;
            }
         }
        .progress-wrapper {
            position: relative;
            margin: 20px auto;
        }

        .current {
            position: absolute;
            font-weight: 100;
            line-height: 1;
            font-size: 32px;
            color: white;
        }

        round-progress {
          margin: auto;
        }
    }
}@mixin sales-list($theme) {
    
    .sales-list{
        margin: 10px 5px;
        background: white;
    }
    .pull-right{
        flex: 1 1 auto;
    }
    mat-list-item:hover {
        background: #e8eaf6;
        cursor: pointer;
    }
    .mat-chip {
        padding: 1px 13px;
    }
    
}
.nav-item {
  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  cursor: default;

  &:hover {
    transform: translate(0, -8px);
    box-shadow: 0 20px 20px rgba(0, 0, 0, .16)
  }
}