:host {
  display: block;
  height: auto;
  overflow: visible;

  // overwrite tab styles
  ::ng-deep {

    .mat-tab-label  {
      height: 90px;
      padding: 15px;
      background: #fff;
      margin-left: 20px;
      box-shadow: 0 0 14px 0 #a5a5a5;
      border-radius: 3px;

      &:first-of-type {
        margin-left: 0;
      }
    }


    .mat-tab-group.mat-primary .mat-ink-bar,
    .mat-tab-nav-bar.mat-primary .mat-ink-bar {
      background: #00CCFF;
      border-radius: 0 0 2px 2px;
      height: 3px;
      overflow: visible;
      bottom:6px;
    }

    // make shadows visible
    .mat-tab-labels,
    app-candidate-primary-skills,
    app-candidate-technical-skills,
    app-candidate-business-skills {
      padding: 6px;
    }

    .mat-tab-header,
    .mat-tab-nav-bar {
      border-bottom: none;
      overflow: visible;
    }
  }
}

// tab styles
.tab {
  text-align: left;
  width: 100%;
  color: #000;

  h4 {
    font-size: 16px;
    line-height: 19px;
    font-family:robotoregular;
    color: #000;
  }

  img {
    height: 30px;
    width: auto;
  }

  span {
    float: right;
    line-height: 30px;
    font-size: 27px;
  }
}
