diff --git a/bootstrap_barrio.layouts.yml b/bootstrap_barrio.layouts.yml
index d50868c1eeb4053f68fab4206d3b662debed7333..f6565f567c3cd2e27ea7a267d62d857b4a87d2ff 100644
--- a/bootstrap_barrio.layouts.yml
+++ b/bootstrap_barrio.layouts.yml
@@ -2,6 +2,7 @@ bb_cardbasic:
   label: Card basic
   category: Barrio
   template: templates/ds/layout--ds-card-basic
+  class: '\Drupal\ds\Plugin\DsLayout'
   regions:
     first:
       label: Content
@@ -9,6 +10,7 @@ bb_cardtopimage:
   label: Card top image
   category: Barrio
   template: templates/ds/layout--ds-card-top-image
+  class: '\Drupal\ds\Plugin\DsLayout'
   regions:
     first:
       label: Image
@@ -18,6 +20,7 @@ bb_cardimageoverlay:
   label: Card image overlay
   category: Barrio
   template: templates/ds/layout--ds-card-image-overlay
+  class: '\Drupal\ds\Plugin\DsLayout'
   regions:
     first:
       label: Image
@@ -27,6 +30,7 @@ bb_cardheaderfooter:
   label: Card header footer
   category: Barrio
   template: templates/ds/layout--ds-card-header-footer
+  class: '\Drupal\ds\Plugin\DsLayout'
   regions:
     first:
       label: Header
@@ -38,6 +42,7 @@ bb_card3stack:
   label: Card three block stacked
   category: Barrio
   template: templates/ds/layout--ds-card-3stack
+  class: '\Drupal\ds\Plugin\DsLayout'
   regions:
     first:
       label: First
diff --git a/css/components/header.css b/css/components/header.css
index d7dbc83add518c09b88f9dd933f9f65f40a0b703..417dbc10d4c1e0c6a5d2fb053cdcabed0f4c56fe 100644
--- a/css/components/header.css
+++ b/css/components/header.css
@@ -1,18 +1,39 @@
 /* ------------------ Header ------------------ */
-.navbar-brand .site-logo {
-  margin-right: 1rem;
+
+#navbar-top.navbar-dark .nav-link:hover,
+#navbar-top.navbar-dark .nav-link:focus {
+    color: rgba(255, 255, 255, 0.75);
 }
 
-@media (max-width: 33.9em) {
-.navbar-toggleable-xs .navbar-nav .nav-item + .nav-item, .navbar-toggleable-xs.collapse.in .navbar-nav .nav-item  {
-  margin-left: 0;
-  float: none;
+#navbar-top.navbar-dark .nav-link {
+    color: rgba(255, 255, 255, 0.5);
 }
+
+#navbar-top.navbar-light .nav-link:hover,
+#navbar-top.navbar-light .nav-link:focus {
+    color: rgba(0, 0, 0, 0.7);
 }
 
-@media (max-width: 47.9em) {
-.navbar-toggleable-sm .navbar-nav .nav-item + .nav-item, .navbar-toggleable-xs.collapse.in .navbar-nav .nav-item  {
-  margin-left: 0;
-  float: none;
+#navbar-top.navbar-light .nav-link {
+    color: rgba(0, 0, 0, 0.5);
+}
+
+.navbar-brand .site-logo {
+    margin-right: 1rem;
 }
+
+@media (max-width: 33.9em) {
+    .navbar-toggleable-xs .navbar-nav .nav-item+.nav-item,
+    .navbar-toggleable-xs.collapse.in .navbar-nav .nav-item {
+        margin-left: 0;
+        float: none;
+    }
 }
+
+@media (max-width: 47.9em) {
+    .navbar-toggleable-sm .navbar-nav .nav-item+.nav-item,
+    .navbar-toggleable-xs.collapse.in .navbar-nav .nav-item {
+        margin-left: 0;
+        float: none;
+    }
+}
\ No newline at end of file