diff --git a/nextjs/src/app/course/[courseName]/CourseNavigation.tsx b/nextjs/src/app/course/[courseName]/CourseNavigation.tsx
index 2b18a87..08dfe85 100644
--- a/nextjs/src/app/course/[courseName]/CourseNavigation.tsx
+++ b/nextjs/src/app/course/[courseName]/CourseNavigation.tsx
@@ -54,6 +54,7 @@ export function CourseNavigation() {
         </div>
       ) : (
         <button
+          className="unstyled btn-outline"
           onClick={() => {
             queryClient.invalidateQueries({
               queryKey: canvasAssignmentKeys.assignments(settings.canvasId),
diff --git a/nextjs/src/app/globals.css b/nextjs/src/app/globals.css
index d19fa1c..e2c1998 100644
--- a/nextjs/src/app/globals.css
+++ b/nextjs/src/app/globals.css
@@ -97,8 +97,8 @@ button:not(.unstyled):not(.btn-danger),
 }
 
 .btn-outline {
-  @apply bg-transparent text-blue-200 border border-blue-500;
-  @apply hover:border-blue-500 hover:text-blue-100 hover:bg-blue-900;
+  @apply bg-transparent text-slate-300 border-blue-900 border-2;
+  @apply hover:border-blue-950 hover:text-blue-100 hover:bg-blue-950;
 }
 
 select {