diff --git a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/user-rep-table/user-rep-table.component.ts b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/user-rep-table/user-rep-table.component.ts
index e790641..735b4b5 100644
--- a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/user-rep-table/user-rep-table.component.ts
+++ b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/tables/user-rep-table/user-rep-table.component.ts
@@ -1,8 +1,8 @@
-import { Component, Inject } from '@angular/core';
+import { Component } from '@angular/core';
 import { UserRep } from '../../../models/user-management.api.models';
 import { UserRepService } from '../../../services/api/user-representation.service';
 import { BaseTableComponent } from '../base-table/base-table.component';
-import { GuiGridModule, GuiColumn } from '@generic-ui/ngx-grid';
+import { GuiGridModule } from '@generic-ui/ngx-grid';
 import { ColorModeService } from '../../../services/button/color-mode.service';
 import { CommonModule } from '@angular/common';
 import { FormsModule } from '@angular/forms';
diff --git a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/pages/user-representation/user-representation.component.html b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/pages/user-representation/user-representation.component.html
index db1757c..798d5c0 100644
--- a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/pages/user-representation/user-representation.component.html
+++ b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/pages/user-representation/user-representation.component.html
@@ -27,7 +27,7 @@
     <div class="col-3">
       <mat-tab-group>
         <mat-tab label="{{useRepLabel}}">
-          <app-user-rep-table #userReps [initData]="initWithoutData" [onSelectedRows]="repOnSelectedRows"></app-user-rep-table>
+          <app-user-rep-table #userReps [initData]="initWithoutData" [onSelectedRows]="repOnSelectedRows" [rowClass]="rep_row_class"></app-user-rep-table>
         </mat-tab>
       </mat-tab-group>
     </div>
diff --git a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/pages/user-representation/user-representation.component.ts b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/pages/user-representation/user-representation.component.ts
index 9d90f05..a583a2a 100644
--- a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/pages/user-representation/user-representation.component.ts
+++ b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/pages/user-representation/user-representation.component.ts
@@ -1,5 +1,5 @@
 import { AfterViewInit, Component, ViewChild, inject } from '@angular/core';
-import { GuiColumn, GuiSelectedRow } from '@generic-ui/ngx-grid/gui/grid/src/core/api/gui.grid.public-api';
+import { GuiColumn, GuiRowClass, GuiRowStyle, GuiSelectedRow } from '@generic-ui/ngx-grid/gui/grid/src/core/api/gui.grid.public-api';
 import { UserTableComponent } from '../../components/tables/user-table/user-table.component';
 import { UserRepTableComponent } from '../../components/tables/user-rep-table/user-rep-table.component';
 import { GroupTableComponent } from '../../components/tables/group-table/group-table.component';
@@ -32,6 +32,20 @@ export class UserRepresentationComponent extends BasePageComponent implements Af
 
   private readonly dialog: MatDialog = inject(MatDialog);
 
+  rep_row_class: GuiRowClass = {
+    classFunction(source, index) {
+      const now = new Date()
+
+      return (!source.validFrom && !source.validTo)
+        ? "current-period-row"
+        : (new Date(source.validFrom) > now)
+          ? "future-period-row"
+          : (new Date(source.validTo) < now)
+            ? "past-period-row"
+            : "current-period-row";
+    }
+  }
+
   initWithoutData = () => { }
 
   constructor(private userRepService: UserRepService) {
diff --git a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/styles.scss b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/styles.scss
index 300a04c..048ec0c 100644
--- a/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/styles.scss
+++ b/DigitalData.UserManager.API/ClientApp/user_manager_ui/src/styles.scss
@@ -104,3 +104,15 @@ code {
     width: #{$i * 5 + "%"} !important;
   }
 }
+
+.future-period-row {
+  background: #6E6E4C !important;
+}
+
+.current-period-row {
+    background: #4C6E4C !important;
+}
+
+.past-period-row {
+  background: #6E4C4C !important;
+}
\ No newline at end of file