.toolbar-option {
    margin-left: 10px;
    margin-right: 10px;
  }
  
  $fontcolor: #676a6c;
  .content {
    width: 100%;
    display: flex;
    padding-right: 0px !important;
    .grid-container,
    .filter-panel {
      .crud-table {
        margin-bottom: 0px;
        width: 100%;
      }
      .form {
        padding: 10px 20px 10px 20px;
      }
    }
  
    .filter-panel {
      margin-bottom: 10px;
    }
  }
  
  .grid-ibox-content {
    width: 100%;
  }
  
  .btn-group {
    .btn {
      font-size: 10px;
    }
  }

  .td-view{
    cursor: auto !important
  }
  
  .mat-row-auth:hover {
    background-color: #f8f9fa;
    cursor: pointer !important;
  }
  
  .spinner-container {
    height: 100%;
    width: 100%;
    padding-top: 50px;
    position: fixed;
  }
  .spinner-container {
    height: 100%;
    width: 100%;
    padding-top: 50px;
    position: fixed;
  }
  
  .spinner-container mat-spinner {
    margin: -10px auto 0 auto;
  }
  
  th.mat-column-actions {
    width: 1px !important;
    padding-right: 0px !important;
  }
  
  td.mat-column-actions {
    min-width: 170px;
    padding-right: 20px !important;
    cursor: default !important;
  }
  td {
    vertical-align: middle !important;
    color: $fontcolor;
    font-size: 12px;
  }
  th {
    vertical-align: middle !important;
  }
  tr.mat-header-row {
    height: 50px !important;
  }
  
  tr.mat-footer-row,
  tr.mat-row {
    height: 40px !important;
  }
  
  .table-toolbar {
    right: 10px;
    top: 10px;
    button {
      font-size: 12px;
    }
  }
  
  .status-button-bar {
    button {
      font-size: 16px;
    }
    padding-top: 8px;
    padding-left: 15px;
  }
  
  .mat-raised-button {
    padding: 0px 10px;
  }
  
  .icon-centered-button span.mat-button-wrapper {
    display: flex;
  }
  
  .icon-centered-button mat-icon {
    font-size: 15px;
    padding-top: 2px;
  }
  
  ::ng-deep .mat-sort-header-arrow {
    visibility: hidden;
  }
  
  ::ng-deep .mat-sort-header-button {
    .mat-icon {
      padding-left: 10px;
      font-size: 12px;
      padding-top: 5px;
    }
  }
  
  th {
    background: rgb(242, 242, 242);
  }
  
  tr.example-detail-row {
    height: 0 !important;
  }
  
  tr.example-element-row:not(.example-expanded-row):hover {
    background: #dedede;
    cursor: pointer;
  }
  
  tr.example-element-row:not(.example-expanded-row):active {
    background: #efefef;
  }
  
  .example-element-row td {
    border-bottom-width: 0;
  }
  
  .example-element-detail {
    overflow: hidden;
    display: flex;
  }
  
  .example-detail-row td {
    padding-top: 0px;
    padding-bottom: 0px;
    border: none !important;
    background-color: #f2f2f2;
  }
  
  i.state {
    font-size: 1.3em;
  }
  
  i.fa-key.pull-left {
    color: rgba(128, 128, 128, 0.33);
    margin-right: 6px;
  }
  
  //////
  
  table {
    width: 100%;
  }
  
  tr.mat-header-row {
    height: 25px;
  }
  
  tr.mat-footer-row,
  tr.mat-row {
    height: 40px;
  }
  
  .button-grid {
    margin: 2px 5px;
    mat-icon {
      padding-top: 2px;
    }
  }
  
  .btn-header-new {
    margin-top: -4px;
  }
  
  .btn-grid-filter {
    height: 36px;
    width: 85px;
    padding-left: 0px;
    padding-top: 2px;
  }
  
  .btn-grid-action {
    padding: 0 10px;
    line-height: 0em;
  }
  
  .mat-row:hover {
    cursor: pointer;
    background-color: #f8f9fa;
  }
  
  .spinner-container {
    height: 100%;
    width: 100%;
    padding-top: 50px;
    position: fixed;
  }
  
  .spinner-container mat-spinner {
    margin: -10px auto 0 auto;
  }
  
  .mat-raised-button {
    padding: 0px 10px;
  }
  
  .icon-centered-button span.mat-button-wrapper {
    display: flex;
  }
  
  .icon-centered-button mat-icon {
    font-size: 15px;
    padding-top: 2px;
  }
  
  .ibox-content {
    padding-right: 0px;
  }
  
  .content {
    width: 100%;
    display: flex;
    padding-right: 0px !important;
  }
  
  .grid-ibox-content {
    width: 100%;
  }

  .avatar {
    vertical-align: middle;
    width: 35px;
    height: 35px;
    border-radius: 50%;
  }