diff --git a/themes/gohugoioTheme/layouts/partials/previous-next-links-in-section-with-title.html b/themes/gohugoioTheme/layouts/partials/previous-next-links-in-section-with-title.html
index 68fa81551..fa76846b7 100644
--- a/themes/gohugoioTheme/layouts/partials/previous-next-links-in-section-with-title.html
+++ b/themes/gohugoioTheme/layouts/partials/previous-next-links-in-section-with-title.html
@@ -1,13 +1,13 @@
 {{ if or .PrevInSection .NextInSection }}
 {{/* this div holds these a tags as a unit for flex-box display */}}
-	<div date-pref>
+	<div date-pref class="white">
 		{{if .NextInSection}}
-			<a href="{{.NextInSection.Permalink }}" class="db f5" title="{{ .NextInSection.Title }} ">{{ partial "svg/ic_chevron_left_black_24px.svg" (dict "fill" "#0594CB" "size" "12px") }} {{.NextInSection.Title}}</a>
+			<a href="{{.NextInSection.Permalink }}" class="br2 db-l f5 ph2 pv2 bg-light-gray white" title="{{ .NextInSection.Title }} ">{{ partial "svg/ic_chevron_left_black_24px.svg" (dict "fill" "#fff" "size" "12px") }} {{.NextInSection.Title}}</a>
 		{{end}}
 
 		{{if .PrevInSection}}
-			<a href="{{ .PrevInSection.Permalink }}" class="db f5 pr1  mt3" title="{{ .PrevInSection.Title }}">
-			{{.PrevInSection.Title}} {{ partial "svg/ic_chevron_right_black_24px.svg" (dict "fill" "#0594CB" "size" "12px") }}
+			<a href="{{ .PrevInSection.Permalink }}" class="br2 db-l f5 pr1 mt3 bg-light-gray ph2 pv2 white" title="{{ .PrevInSection.Title }}">
+			{{.PrevInSection.Title}} {{ partial "svg/ic_chevron_right_black_24px.svg" (dict "fill" "#fff" "size" "12px") }}
 			</a>
 		{{end}}
 	</div>