npm - @duetds/components - Versions diffs - 6.7.0 → 6.8.0 - Mend

@duetds/components 6.7.0 → 6.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (749) hide show

package/lib/collection/components/duet-header/duet-header.css CHANGED Viewed

@@ -71,12 +71,12 @@
   font-size: 0.875rem;
   font-weight: 400;
   line-height: 1.5;
-  color: #00294d;
+  color: rgb(0, 41, 77);
   text-align: left;
 }
 .duet-header.duet-theme-turva {
   font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-  color: #171c3a;
+  color: rgb(23, 28, 58);
 }
 @media (min-width: 62em) {
   .duet-header.duet-theme-turva {
@@ -105,8 +105,8 @@
   width: 100%;
   height: 4rem;
   padding: 0 16px;
-  background: white;
-  border-bottom: 1px solid #e1e3e6;
+  background: rgb(255, 255, 255);
+  border-bottom: 1px solid rgb(225, 227, 230);
   box-shadow: 0 2px 6px 0 rgba(0, 41, 77, 0.07);
 }
 @media (min-width: 62em) {
@@ -125,7 +125,7 @@
   }
 }
 .duet-theme-turva .duet-header-top {
-  border-color: #e4e4e6;
+  border-color: rgb(228, 228, 230);
   box-shadow: 0 2px 6px 0 rgba(117, 117, 117, 0.13);
 }
 @media (min-width: 62em) {
@@ -145,10 +145,10 @@
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
-  border-left: 1px solid #cfd2d4;
+  border-left: 1px solid rgb(207, 210, 212);
 }
 .duet-theme-turva .duet-header-top .duet-header-region {
-  border-color: #cfcfd1;
+  border-color: rgb(207, 207, 209);
 }
 @media (max-width: 35.9375em) {
   .duet-header-top .duet-header-region {
@@ -172,12 +172,12 @@
   width: 100%;
   overflow-y: auto;
   visibility: hidden;
-  background: #f3f9fc;
+  background: rgb(243, 249, 252);
   opacity: 0;
   -webkit-overflow-scrolling: touch;
 }
 .duet-theme-turva .duet-header-bottom {
-  background: #f5f5f7;
+  background: rgb(245, 245, 247);
 }
 @media (min-width: 62em) {
   .duet-header-bottom {
@@ -188,7 +188,7 @@
     flex-direction: row;
     overflow: visible;
     visibility: visible;
-    background: white;
+    background: rgb(255, 255, 255);
     opacity: 1;
   }
   .duet-header-bottom.duet-header-inactive {
@@ -216,8 +216,8 @@
 }
 @media (min-width: 62em) {
   .duet-header-items,
-.duet-header-bottom-utils,
-.duet-header-utils {
+  .duet-header-bottom-utils,
+  .duet-header-utils {
     opacity: 1;
     transition: none !important;
     transform: none;
@@ -238,7 +238,7 @@
   font-size: 1rem;
   font-weight: 400;
   line-height: 1.5;
-  background: white;
+  background: rgb(255, 255, 255);
 }
 @media (min-width: 62em) {
   .duet-header-items {
@@ -254,7 +254,7 @@
   }
 }
 .duet-header-items .duet-header-item-container {
-  border-bottom: 1px solid #e1e3e6;
+  border-bottom: 1px solid rgb(225, 227, 230);
   border-radius: 0;
 }
 @media (min-width: 62em) {
@@ -285,7 +285,7 @@
   overflow: hidden;
   font-size: 1rem;
   line-height: 48px;
-  color: #00294d;
+  color: rgb(0, 41, 77);
   text-decoration: none;
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -297,23 +297,23 @@
   }
 }
 .duet-theme-turva .duet-header-items .duet-header-item {
-  color: #171c3a;
-  border-color: #e1e3e6;
+  color: rgb(23, 28, 58);
+  border-color: rgb(225, 227, 230);
 }
 .duet-header-items .duet-header-item:hover {
-  color: #004d80;
+  color: rgb(0, 77, 128);
 }
 .duet-theme-turva .duet-header-items .duet-header-item:hover {
-  color: #444445;
+  color: rgb(68, 68, 69);
 }
 .duet-header-items .duet-header-item:focus {
   outline: 0;
 }
 :host(.user-is-tabbing) .duet-header-items .duet-header-item:focus {
-  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3;
+  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px rgb(0, 119, 179);
 }
 :host(.user-is-tabbing) .duet-theme-turva .duet-header-items .duet-header-item:focus {
-  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a;
+  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px rgb(23, 28, 58);
 }
 @media (min-width: 62em) {
   .duet-header-items .duet-header-item {
@@ -327,16 +327,16 @@
   }
 }
 .duet-header-items .duet-header-item.active {
-  color: #0077b3;
+  color: rgb(0, 119, 179);
 }
 .duet-theme-turva .duet-header-items .duet-header-item.active {
-  color: #c60c30;
+  color: rgb(198, 12, 48);
 }
 .duet-header-items .duet-header-item.active:hover {
-  color: #0077b3;
+  color: rgb(0, 119, 179);
 }
 .duet-theme-turva .duet-header-items .duet-header-item.active:hover {
-  color: #c60c30;
+  color: rgb(198, 12, 48);
 }
 .duet-header-items .duet-header-item.active::after {
   position: absolute;
@@ -345,10 +345,10 @@
   left: 0;
   width: 4px;
   content: "";
-  background: #0077b3;
+  background: rgb(0, 119, 179);
 }
 .duet-theme-turva .duet-header-items .duet-header-item.active::after {
-  background: #c60c30;
+  background: rgb(198, 12, 48);
 }
 @media (min-width: 62em) {
   .duet-header-items .duet-header-item.active::after {
@@ -376,10 +376,10 @@
   outline: 0;
 }
 :host(.user-is-tabbing) .duet-header-toggle:focus {
-  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3;
+  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px rgb(0, 119, 179);
 }
 :host(.user-is-tabbing) .duet-theme-turva .duet-header-toggle:focus {
-  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a;
+  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px rgb(23, 28, 58);
 }
 @media (min-width: 62em) {
   .duet-header-toggle {
@@ -402,14 +402,14 @@
   display: block;
   width: 100%;
   height: 2px;
-  background: #00294d;
+  background: rgb(0, 41, 77);
   border-radius: 20rem;
   opacity: 1;
   transition: 0.25s ease-in-out;
   transform: rotate(0deg) scale(0.98);
 }
 .duet-theme-turva .duet-header-hamburger .duet-header-bar {
-  background: #171c3a;
+  background: rgb(23, 28, 58);
 }
 .duet-header-hamburger .duet-header-bar:nth-child(1) {
   top: 0;
@@ -494,35 +494,35 @@ button {
   font-size: 1rem;
   font-weight: 400;
   line-height: 48px;
-  color: #00294d;
+  color: rgb(0, 41, 77);
   text-align: left;
   text-decoration: none;
   text-overflow: ellipsis;
   white-space: nowrap;
   cursor: pointer;
-  border-bottom: 1px solid #e1e3e6;
+  border-bottom: 1px solid rgb(225, 227, 230);
   border-radius: 4px;
   -webkit-appearance: none;
   appearance: none;
 }
 .duet-theme-turva .duet-header-button {
-  color: #171c3a;
-  border-color: #e4e4e6;
+  color: rgb(23, 28, 58);
+  border-color: rgb(228, 228, 230);
 }
 .duet-header-button:hover {
-  color: #004d80;
+  color: rgb(0, 77, 128);
 }
 .duet-theme-turva .duet-header-button:hover {
-  color: #940925;
+  color: rgb(148, 9, 37);
 }
 .duet-header-button:focus {
   outline: 0;
 }
 :host(.user-is-tabbing) .duet-header-button:focus {
-  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3;
+  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px rgb(0, 119, 179);
 }
 :host(.user-is-tabbing) .duet-theme-turva .duet-header-button:focus {
-  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a;
+  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px rgb(23, 28, 58);
 }
 .duet-header-button:active {
   opacity: 0.75;
@@ -544,25 +544,25 @@ button {
     width: 1px;
     height: 20px;
     content: "";
-    background: #cfd2d4;
+    background: rgb(207, 210, 212);
     transform: translateY(-50%);
   }
   .duet-theme-turva .duet-header-button::before {
-    background: #cfcfd1;
+    background: rgb(207, 207, 209);
   }
 }
 .duet-header-button.active {
-  color: #0077b3;
+  color: rgb(0, 119, 179);
   border-radius: 0;
 }
 .duet-theme-turva .duet-header-button.active {
-  color: #c60c30;
+  color: rgb(198, 12, 48);
 }
 .duet-header-button.active:hover {
-  color: #0077b3;
+  color: rgb(0, 119, 179);
 }
 .duet-theme-turva .duet-header-button.active:hover {
-  color: #c60c30;
+  color: rgb(198, 12, 48);
 }
 @media (min-width: 62em) {
   .duet-header-button.active::after {
@@ -572,10 +572,10 @@ button {
     left: 0;
     width: 3px;
     content: "";
-    background: #0077b3;
+    background: rgb(0, 119, 179);
   }
   .duet-theme-turva .duet-header-button.active::after {
-    color: #c60c30;
+    color: rgb(198, 12, 48);
   }
 }
 .duet-header-button.duet-header-logout .duet-header-icon.mobile {
@@ -599,11 +599,11 @@ button {
   height: 2.5rem;
   margin: 2.25rem 0;
   font-weight: 600;
-  border: 2px solid #00294d;
+  border: 2px solid rgb(0, 41, 77);
   border-radius: 20rem;
 }
 .duet-theme-turva .duet-header-utils .duet-header-button.duet-header-logout {
-  border-color: #171c3a;
+  border-color: rgb(23, 28, 58);
 }
 .duet-header-utils .duet-header-button.duet-header-logout .duet-header-icon {
   margin-right: 0.5rem;
@@ -636,7 +636,7 @@ button {
 @media (min-width: 62em) {
   .duet-header-utils > *:last-child::before,
-.duet-header-utils > *:last-child button::before {
+  .duet-header-utils > *:last-child button::before {
     display: none;
   }
 }
@@ -669,8 +669,8 @@ button {
 }
 @media (min-width: 62em) {
   .duet-header-dropdown .duet-header-language.duet-header-dropdown-toggle.active::after, .duet-header-dropdown .duet-header-language.duet-header-dropdown-toggle.active:hover::after,
-.duet-header-dropdown .duet-header-contact.duet-header-dropdown-toggle.active::after,
-.duet-header-dropdown .duet-header-contact.duet-header-dropdown-toggle.active:hover::after {
+  .duet-header-dropdown .duet-header-contact.duet-header-dropdown-toggle.active::after,
+  .duet-header-dropdown .duet-header-contact.duet-header-dropdown-toggle.active:hover::after {
     width: 100%;
   }
 }
@@ -720,10 +720,10 @@ button {
   outline: 0;
 }
 :host(.user-is-tabbing) .duet-header-dropdown-toggle:focus {
-  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3;
+  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px rgb(0, 119, 179);
 }
 :host(.user-is-tabbing) .duet-theme-turva .duet-header-dropdown-toggle:focus {
-  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a;
+  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px rgb(23, 28, 58);
 }
 .duet-header-dropdown-toggle:active {
   outline: none;
@@ -736,16 +736,16 @@ button {
   margin-top: -1rem;
   margin-left: 5px;
   vertical-align: top;
-  background: #f7b228;
+  background: rgb(247, 178, 40);
   border-radius: 50%;
   box-shadow: 0 0 0 1px #c18b1f;
 }
 .duet-theme-turva .duet-header-badge {
-  background: #faa40f;
+  background: rgb(250, 164, 15);
 }
 .active-bar {
-  color: #0077b3;
+  color: rgb(0, 119, 179);
 }
 .active-bar::after {
   position: absolute;
@@ -754,10 +754,10 @@ button {
   left: 0;
   width: 4px;
   content: "";
-  background: #0077b3;
+  background: rgb(0, 119, 179);
 }
 .duet-theme-turva .active-bar::after {
-  background: #c60c30;
+  background: rgb(198, 12, 48);
 }
 .duet-header-dropdown {
@@ -781,16 +781,16 @@ button {
     width: 100%;
     height: 3px !important;
     content: "";
-    background: #0077b3;
+    background: rgb(0, 119, 179);
     transition: 300ms ease;
     transform: translateY(3px);
   }
   .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle::after {
-    background: #c60c30;
+    background: rgb(198, 12, 48);
   }
 }
 .duet-header-dropdown .duet-header-dropdown-toggle.active, .duet-header-dropdown .duet-header-dropdown-toggle.active:hover {
-  border-bottom: 1px solid #f5f8fa;
+  border-bottom: 1px solid rgb(245, 248, 250);
 }
 .duet-header-dropdown .duet-header-dropdown-toggle.active::after, .duet-header-dropdown .duet-header-dropdown-toggle.active:hover::after {
   position: absolute;
@@ -799,17 +799,17 @@ button {
   left: 0;
   width: 4px;
   content: "";
-  background: #0077b3;
+  background: rgb(0, 119, 179);
 }
 .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.active::after, .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.active:hover::after {
-  background: #c60c30;
+  background: rgb(198, 12, 48);
 }
 .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.active, .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.active:hover {
-  border-color: #f5f5f7;
+  border-color: rgb(245, 245, 247);
 }
 @media (min-width: 62em) {
   .duet-header-dropdown .duet-header-dropdown-toggle.active, .duet-header-dropdown .duet-header-dropdown-toggle.active:hover {
-    color: #004d80;
+    color: rgb(0, 77, 128);
     border: 0;
   }
   .duet-header-dropdown .duet-header-dropdown-toggle.active::after, .duet-header-dropdown .duet-header-dropdown-toggle.active:hover::after {
@@ -822,29 +822,29 @@ button {
     transform: translateY(0);
   }
   .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.active, .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.active:hover {
-    color: #940925;
+    color: rgb(148, 9, 37);
   }
 }
 @media (min-width: 62em) {
   .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.duet-header-session {
-    color: white;
-    background: #c60c30;
+    color: rgb(255, 255, 255);
+    background: rgb(198, 12, 48);
     border-radius: 0;
   }
   .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.duet-header-session:hover, .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.duet-header-session.active, .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.duet-header-session.active:hover {
-    color: white;
-    background: #940925;
+    color: rgb(255, 255, 255);
+    background: rgb(148, 9, 37);
   }
 }
 .duet-header-dropdown .duet-header-dropdown-content {
   display: none;
   padding-bottom: 16px;
-  background: #f3f9fc;
-  border-bottom: 1px solid #e1e3e6;
+  background: rgb(243, 249, 252);
+  border-bottom: 1px solid rgb(225, 227, 230);
 }
 .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content {
-  background: #f5f5f7;
-  border-color: #e1e3e6;
+  background: rgb(245, 245, 247);
+  border-color: rgb(225, 227, 230);
 }
 @media (min-width: 62em) {
   .duet-header-dropdown .duet-header-dropdown-content {
@@ -905,7 +905,7 @@ button {
   font-size: 0.875rem;
   font-weight: 400;
   line-height: 1.5;
-  color: #00294d;
+  color: rgb(0, 41, 77);
   text-align: left;
   text-decoration: none;
   white-space: nowrap;
@@ -913,7 +913,7 @@ button {
   transition: 300ms ease;
 }
 .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item) {
-  color: #171c3a;
+  color: rgb(23, 28, 58);
 }
 @media (min-width: 62em) {
   .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item) {
@@ -923,20 +923,20 @@ button {
 }
 @media (min-width: 62em) {
   .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):hover {
-    background: #e6f2f8;
+    background: rgb(230, 242, 248);
   }
   .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):hover {
-    background: #e4e4e6;
+    background: rgb(228, 228, 230);
   }
 }
 .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):focus {
   outline: 0;
 }
 :host(.user-is-tabbing) .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):focus {
-  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3;
+  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px rgb(0, 119, 179);
 }
 :host(.user-is-tabbing) .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):focus {
-  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a;
+  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px rgb(23, 28, 58);
 }
 .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item).active {
   padding-right: 36px;
@@ -948,11 +948,11 @@ button {
 }
 @media (min-width: 62em) {
   .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item).active {
-    color: white;
-    background: #0077b3;
+    color: rgb(255, 255, 255);
+    background: rgb(0, 119, 179);
   }
   .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item).active {
-    background: #c60c30;
+    background: rgb(198, 12, 48);
   }
 }
 .duet-header-dropdown .duet-header-dropdown-content .duet-header-link-external {
@@ -993,23 +993,23 @@ button {
   height: 1px;
   overflow: hidden;
   font-weight: 600;
-  color: #0077b3;
+  color: rgb(0, 119, 179);
   text-align: center;
   text-decoration: none;
-  background: white;
+  background: rgb(255, 255, 255);
   border-radius: 4px;
   opacity: 0;
 }
 .duet-header-skip:focus {
   outline: 0;
-  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3;
+  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px rgb(0, 119, 179);
 }
 .duet-theme-turva .duet-header-skip:focus, .duet-header-skip:focus.duet-theme-turva {
-  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a;
+  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px rgb(23, 28, 58);
 }
 .duet-theme-turva .duet-header-skip {
   min-width: 120px;
-  color: #171c3a;
+  color: rgb(23, 28, 58);
 }
 @media (min-width: 106.25em) {
   .duet-header-skip {
@@ -1059,7 +1059,7 @@ button {
   margin-left: 2rem;
 }
 .duet-header-multi-level .logo-and-segment .duet-header-dropdown .duet-header-dropdown-content {
-  background: #f3f9fc;
+  background: rgb(243, 249, 252);
 }
 .duet-header-multi-level .logo-and-segment button {
   align-items: flex-start;
@@ -1086,7 +1086,7 @@ button {
   font-weight: 600;
 }
 .duet-header-multi-level-nav .duet-header-dropdown .duet-header-dropdown-toggle.active {
-  color: #0077b3;
+  color: rgb(0, 119, 179);
 }
 .duet-header-multi-level-nav .duet-header-dropdown .duet-header-dropdown-toggle.active:not(.open) .duet-header-caret {
   transform: translateY(-50%) rotate(0deg);
@@ -1098,9 +1098,9 @@ button {
   width: 100%;
   height: 4.5rem;
   padding: 0;
-  background: #f3f9fc;
-  border-top: 1px solid #e1e3e6;
-  border-bottom: 1px solid #e1e3e6;
+  background: rgb(243, 249, 252);
+  border-top: 1px solid rgb(225, 227, 230);
+  border-bottom: 1px solid rgb(225, 227, 230);
   box-shadow: 0 2px 6px 0 rgba(0, 41, 77, 0.07);
   transition: none;
 }
@@ -1125,13 +1125,13 @@ button {
   width: 100%;
   height: 3px;
   content: "";
-  background: #0077b3;
+  background: rgb(0, 119, 179);
   transition: 300ms ease;
   transform: translateY(3px);
 }
 .duet-header-multi-level-nav .duet-header-dropdown .duet-header-dropdown-content a.active {
   font-weight: 600;
-  color: #0077b3;
+  color: rgb(0, 119, 179);
   background: none;
 }
 .duet-header-multi-level-nav .duet-header-dropdown .duet-header-dropdown-content a.active::after {
@@ -1167,7 +1167,7 @@ button {
   z-index: 400;
 }
 .duet-header-multi-level-utils .duet-header-dropdown .duet-header-dropdown-content {
-  background: #f3f9fc;
+  background: rgb(243, 249, 252);
 }
 .duet-header-multi-level-utils .duet-header-button-label,
 .duet-header-multi-level-utils .duet-header-dropdown-label {
@@ -1175,7 +1175,7 @@ button {
 }
 @media (min-width: 64.0625em) {
   .duet-header-multi-level-utils .duet-header-button-label,
-.duet-header-multi-level-utils .duet-header-dropdown-label {
+  .duet-header-multi-level-utils .duet-header-dropdown-label {
     display: initial;
   }
 }
@@ -1186,25 +1186,25 @@ button {
   padding-left: 0.5rem;
 }
 .duet-header-multi-level .duet-theme-turva .logo-and-segment .duet-header-dropdown .duet-header-dropdown-content {
-  background: #f5f5f7;
+  background: rgb(245, 245, 247);
 }
 .duet-header-multi-level .duet-theme-turva .duet-header-multi-level-utils > :nth-last-child(2).duet-header-dropdown .duet-header-button::before {
   display: none;
 }
 .duet-header-multi-level .duet-theme-turva .duet-header-multi-level-nav .duet-header-dropdown .duet-header-dropdown-toggle.active {
-  color: #c60c30;
+  color: rgb(198, 12, 48);
 }
 .duet-header-multi-level .duet-theme-turva .duet-header-multi-level-nav .duet-header-dropdown .duet-header-dropdown-content {
-  background: #f5f5f7;
-  border-color: #e4e4e6;
+  background: rgb(245, 245, 247);
+  border-color: rgb(228, 228, 230);
 }
 .duet-header-multi-level .duet-theme-turva .duet-header-multi-level-nav .duet-header-dropdown .duet-header-dropdown-content a::after {
-  background: #c60c30;
+  background: rgb(198, 12, 48);
 }
 .duet-header-multi-level .duet-theme-turva .duet-header-multi-level-nav .duet-header-dropdown .duet-header-dropdown-content a.active {
-  color: #c60c30;
+  color: rgb(198, 12, 48);
   background: none;
 }
 .duet-header-multi-level .duet-theme-turva .duet-header-multi-level-utils .duet-header-dropdown .duet-header-dropdown-content {
-  background: #f5f5f7;
+  background: rgb(245, 245, 247);
 }