diff --git a/src/app/admin-view/grades/attendence-summary/hour-display/hour-display.component.ts b/src/app/admin-view/grades/attendence-summary/hour-display/hour-display.component.ts
index 1927073..4adf26b 100644
--- a/src/app/admin-view/grades/attendence-summary/hour-display/hour-display.component.ts
+++ b/src/app/admin-view/grades/attendence-summary/hour-display/hour-display.component.ts
@@ -1,5 +1,5 @@
 import { Component, Input } from '@angular/core';
-import moment from 'moment';
+import { DateTime } from "luxon";
 
 @Component({
     selector: 'app-hour-display',
@@ -12,10 +12,10 @@ export class HourDisplayComponent {
   
   style () {
     if (/(0+[0-9]|1[0-9]|2[0-3]):(0+[0-9]|[1-5][0-9])/g.test(this.value)) {
-      var diff = moment(this.value, 'HH:mm').diff(moment(), 'minutes');
-      if (diff > 30) {
+      var diff = DateTime.fromFormat(this.value, "HH:mm").diffNow("minutes")
+      if (diff.as("minutes") > 30) {
         return { "background-color": "red" }
-      } else if (diff > 0) {
+      } else if (diff.as("minutes") > 0) {
         return { "background-color": "yellow", "color": "black"}
       } else {
         return { "background-color": "green"}