diff --git a/components/Header.vue b/components/Header.vue
index cbdf6b9..4056152 100644
--- a/components/Header.vue
+++ b/components/Header.vue
@@ -17,18 +17,18 @@
         <img src="/img/logo.svg" alt="inspin digital">
       </NuxtLink>
       <ul class="links">
-        <li><NuxtLink to="/about" :class="route.path === '/about' ? 'highlight' : ''">About</NuxtLink></li>
-        <li><NuxtLink to="/products" :class="route.path === '/products' ? 'highlight' : ''">Products</NuxtLink></li>
-        <li><NuxtLink to="/resources" :class="route.path === '/resources' ? 'highlight' : ''">Resources</NuxtLink></li>
-        <li><NuxtLink to="/articles" :class="route.path === '/articles' ? 'highlight' : ''">Articles</NuxtLink></li>
+        <li><NuxtLink to="/about" :class="route.path.includes('/about') ? 'highlight' : ''">About</NuxtLink></li>
+        <li><NuxtLink to="/products" :class="route.path.includes('/products') ? 'highlight' : ''">Products</NuxtLink></li>
+        <li><NuxtLink to="/resources" :class="route.path.includes('/resources') ? 'highlight' : ''">Resources</NuxtLink></li>
+        <li><NuxtLink to="/articles" :class="route.path.includes('/articles') ? 'highlight' : ''">Articles</NuxtLink></li>
       </ul>
       <ul class="cta" v-if="!user">
         <li class="btn"><NuxtLink to="/contact">Get in touch</NuxtLink></li>
         <li><NuxtLink to="/login">Sign in</NuxtLink></li>
       </ul>
       <ul class="user" v-if="user">
-        <li><NuxtLink to="/settings" :class="route.name === 'settings' ? 'highlight' : ''">{{ user.first_name }} {{ user.last_name }}</NuxtLink></li>
-        <li><NuxtLink to="/dashboard" :class="route.name === 'dashboard' ? 'highlight' : ''">Dashboard</NuxtLink></li>
+        <li><NuxtLink to="/settings" :class="route.name.includes('settings') ? 'highlight' : ''">{{ user.first_name }} {{ user.last_name }}</NuxtLink></li>
+        <li><NuxtLink to="/dashboard" :class="route.name.includes('dashboard') ? 'highlight' : ''">Dashboard</NuxtLink></li>
       </ul>
     </div>