diff --git a/grade/report/grader/styles.css b/grade/report/grader/styles.css
index c7ad38909cf..74064cab65f 100644
--- a/grade/report/grader/styles.css
+++ b/grade/report/grader/styles.css
@@ -25,7 +25,7 @@
     border: 1px solid #ccc;
     border-top-width: 0;
     border-left-width: 0;
-    padding: 10px 20px;
+    padding: 0.5rem 1rem;
     vertical-align: top;
     height: 100%;
 }
@@ -48,7 +48,7 @@
 .path-grade-report-grader .grade_icons,
 .path-grade-report-grader .category_grade_icons {
     white-space: nowrap;
-    margin-top: 10px;
+    margin-top: 0.5rem;
 }
 
 .path-grade-report-grader .grade_type_value .grade_icons {
@@ -56,7 +56,7 @@
 }
 
 .path-grade-report-grader .grade_icons .icon {
-    margin-right: 20px;
+    margin-right: 1rem;
 }
 
 .path-grade-report-grader .grade_icons .icon:last-child {
@@ -90,8 +90,8 @@
 }
 
 .path-grade-report-grader .heading .gradeitemheader {
-    text-indent: -24px;
-    padding-left: 22px;
+    text-indent: -1.5rem;
+    padding-left: 1.5rem;
 }
 
 .path-grade-report-grader .heading .gradeitemheader .itemicon {
@@ -204,8 +204,8 @@
 
 .path-grade-report-grader .action-menu {
     display: inline-block;
-    margin-right: -10px;
-    padding-left: 10px;
+    margin-right: -0.5rem;
+    padding-left: 0.5rem;
 }
 
 .path-grade-report-grader .heading .action-menu {