@duetds/components 10.2.3 → 10.3.0

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

@@ -74,15 +74,6 @@
   color: rgb(8, 42, 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: rgb(23, 28, 58);
-}
-@media (min-width: 62em) {
-  .duet-header.duet-theme-turva {
-    box-shadow: 0 2px 6px 0 rgba(117, 117, 117, 0.13);
-  }
-}
 @media (min-width: 62em) {
   .duet-header {
     position: absolute;
@@ -124,19 +115,6 @@
     padding: 0 48px;
   }
 }
-.duet-theme-turva .duet-header-top {
-  border-color: rgb(222, 224, 228);
-  box-shadow: 0 2px 6px 0 rgba(117, 117, 117, 0.13);
-}
-@media (min-width: 62em) {
-  .duet-theme-turva .duet-header-top {
-    box-shadow: none;
-  }
-}
-.duet-theme-turva .duet-header-top duet-logo {
-  left: -80px !important;
-  margin-top: -8px !important;
-}
 .duet-header-top .duet-header-region {
   max-width: 200px;
   padding-left: 16px;
@@ -147,9 +125,6 @@
   white-space: nowrap;
   border-left: 1px solid rgb(181, 198, 208);
 }
-.duet-theme-turva .duet-header-top .duet-header-region {
-  border-color: rgb(199, 202, 207);
-}
 @media (max-width: 35.9375em) {
   .duet-header-top .duet-header-region {
     display: none;
@@ -176,9 +151,6 @@
   opacity: 0;
   -webkit-overflow-scrolling: touch;
 }
-.duet-theme-turva .duet-header-bottom {
-  background: rgb(245, 247, 250);
-}
 @media (min-width: 62em) {
   .duet-header-bottom {
     position: relative;
@@ -307,7 +279,7 @@
   outline-offset: 2px;
   outline-color: rgba(0, 119, 179, 0.8);
 }
-.duet-theme-turva :host(.user-is-tabbing) .duet-header-items .duet-header-item:focus, :host(.user-is-tabbing) .duet-header-items .duet-header-item:focus.duet-theme-turva, .duet-theme-turva2 :host(.user-is-tabbing) .duet-header-items .duet-header-item:focus, :host(.user-is-tabbing) .duet-header-items .duet-header-item:focus.duet-theme-turva2 {
+.duet-theme-turva :host(.user-is-tabbing) .duet-header-items .duet-header-item:focus, :host(.user-is-tabbing) .duet-header-items .duet-header-item:focus.duet-theme-turva, .duet-theme-turva :host(.user-is-tabbing) .duet-header-items .duet-header-item:focus, :host(.user-is-tabbing) .duet-header-items .duet-header-item:focus.duet-theme-turva {
   outline-color: rgba(53, 79, 101, 0.8);
 }
 @media (min-width: 62em) {
@@ -316,24 +288,9 @@
     border-radius: 4px;
   }
 }
-.duet-theme-turva .duet-header-items .duet-header-item {
-  color: rgb(23, 28, 58);
-  border-color: rgb(212, 223, 229);
-}
-.duet-theme-turva .duet-header-items .duet-header-item:focus {
-  outline: 0;
-}
-:host(.user-is-tabbing) .duet-theme-turva .duet-header-items .duet-header-item:focus {
-  outline: 2px solid;
-  outline-offset: 2px;
-  outline-color: rgba(53, 79, 101, 0.8);
-}
 .duet-header-items .duet-header-item:hover {
   color: rgb(0, 75, 129);
 }
-.duet-theme-turva .duet-header-items .duet-header-item:hover {
-  color: rgb(113, 118, 132);
-}
 @media (min-width: 62em) {
   .duet-header-items .duet-header-item {
     width: auto;
@@ -348,15 +305,9 @@
 .duet-header-items .duet-header-item.active {
   color: rgb(0, 119, 179);
 }
-.duet-theme-turva .duet-header-items .duet-header-item.active {
-  color: rgb(198, 12, 48);
-}
 .duet-header-items .duet-header-item.active:hover {
   color: rgb(0, 119, 179);
 }
-.duet-theme-turva .duet-header-items .duet-header-item.active:hover {
-  color: rgb(198, 12, 48);
-}
 .duet-header-items .duet-header-item.active::after {
   position: absolute;
   top: 0;
@@ -366,9 +317,6 @@
   content: "";
   background: rgb(0, 119, 179);
 }
-.duet-theme-turva .duet-header-items .duet-header-item.active::after {
-  background: rgb(198, 12, 48);
-}
 @media (min-width: 62em) {
   .duet-header-items .duet-header-item.active::after {
     top: auto;
@@ -399,7 +347,7 @@
   outline-offset: 2px;
   outline-color: rgba(0, 119, 179, 0.8);
 }
-.duet-theme-turva :host(.user-is-tabbing) .duet-header-toggle:focus, :host(.user-is-tabbing) .duet-header-toggle:focus.duet-theme-turva, .duet-theme-turva2 :host(.user-is-tabbing) .duet-header-toggle:focus, :host(.user-is-tabbing) .duet-header-toggle:focus.duet-theme-turva2 {
+.duet-theme-turva :host(.user-is-tabbing) .duet-header-toggle:focus, :host(.user-is-tabbing) .duet-header-toggle:focus.duet-theme-turva, .duet-theme-turva :host(.user-is-tabbing) .duet-header-toggle:focus, :host(.user-is-tabbing) .duet-header-toggle:focus.duet-theme-turva {
   outline-color: rgba(53, 79, 101, 0.8);
 }
 @media (min-width: 62em) {
@@ -429,9 +377,6 @@
   transform: rotate(0deg) scale(0.98);
   transition: 0.25s ease-in-out;
 }
-.duet-theme-turva .duet-header-hamburger .duet-header-bar {
-  background: rgb(23, 28, 58);
-}
 .duet-header-hamburger .duet-header-bar:nth-child(1) {
   top: 0;
 }
@@ -500,9 +445,6 @@ button.active .duet-header-hamburger .duet-header-bar:nth-child(4) {
 button {
   font-family: "localtapiola-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
 }
-.duet-theme-turva button {
-  font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-}
 
 .duet-header-button {
   position: relative;
@@ -534,27 +476,12 @@ button {
   outline-offset: 2px;
   outline-color: rgba(0, 119, 179, 0.8);
 }
-.duet-theme-turva :host(.user-is-tabbing) .duet-header-button:focus, :host(.user-is-tabbing) .duet-header-button:focus.duet-theme-turva, .duet-theme-turva2 :host(.user-is-tabbing) .duet-header-button:focus, :host(.user-is-tabbing) .duet-header-button:focus.duet-theme-turva2 {
-  outline-color: rgba(53, 79, 101, 0.8);
-}
-.duet-theme-turva .duet-header-button {
-  color: rgb(23, 28, 58);
-  border-color: rgb(222, 224, 228);
-}
-.duet-theme-turva .duet-header-button:focus {
-  outline: 0;
-}
-:host(.user-is-tabbing) .duet-theme-turva .duet-header-button:focus {
-  outline: 2px solid;
-  outline-offset: 2px;
+.duet-theme-turva :host(.user-is-tabbing) .duet-header-button:focus, :host(.user-is-tabbing) .duet-header-button:focus.duet-theme-turva, .duet-theme-turva :host(.user-is-tabbing) .duet-header-button:focus, :host(.user-is-tabbing) .duet-header-button:focus.duet-theme-turva {
   outline-color: rgba(53, 79, 101, 0.8);
 }
 .duet-header-button:hover {
   color: rgb(0, 75, 129);
 }
-.duet-theme-turva .duet-header-button:hover {
-  color: rgb(126, 2, 35);
-}
 .duet-header-button:active {
   opacity: 0.75;
 }
@@ -578,23 +505,14 @@ button {
     background: rgb(181, 198, 208);
     transform: translateY(-50%);
   }
-  .duet-theme-turva .duet-header-button::before {
-    background: rgb(199, 202, 207);
-  }
 }
 .duet-header-button.active {
   color: rgb(0, 119, 179);
   border-radius: 0;
 }
-.duet-theme-turva .duet-header-button.active {
-  color: rgb(198, 12, 48);
-}
 .duet-header-button.active:hover {
   color: rgb(0, 119, 179);
 }
-.duet-theme-turva .duet-header-button.active:hover {
-  color: rgb(198, 12, 48);
-}
 @media (min-width: 62em) {
   .duet-header-button.active::after {
     position: absolute;
@@ -605,9 +523,6 @@ button {
     content: "";
     background: rgb(0, 119, 179);
   }
-  .duet-theme-turva .duet-header-button.active::after {
-    color: rgb(198, 12, 48);
-  }
 }
 .duet-header-button.duet-header-logout .duet-header-icon.mobile {
   display: block;
@@ -633,9 +548,6 @@ button {
   border: 2px solid rgb(8, 42, 77);
   border-radius: 20rem;
 }
-.duet-theme-turva .duet-header-utils .duet-header-button.duet-header-logout {
-  border-color: rgb(23, 28, 58);
-}
 .duet-header-utils .duet-header-button.duet-header-logout .duet-header-icon {
   margin-right: 0.5rem;
 }
@@ -688,11 +600,6 @@ button {
 .duet-header-contact.active:hover {
   color: inherit;
 }
-.duet-theme-turva .duet-header-language.active, .duet-theme-turva .duet-header-language.active:hover,
-.duet-theme-turva .duet-header-contact.active,
-.duet-theme-turva .duet-header-contact.active:hover {
-  color: inherit;
-}
 .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 {
@@ -755,7 +662,7 @@ button {
   outline-offset: 2px;
   outline-color: rgba(0, 119, 179, 0.8);
 }
-.duet-theme-turva :host(.user-is-tabbing) .duet-header-dropdown-toggle:focus, :host(.user-is-tabbing) .duet-header-dropdown-toggle:focus.duet-theme-turva, .duet-theme-turva2 :host(.user-is-tabbing) .duet-header-dropdown-toggle:focus, :host(.user-is-tabbing) .duet-header-dropdown-toggle:focus.duet-theme-turva2 {
+.duet-theme-turva :host(.user-is-tabbing) .duet-header-dropdown-toggle:focus, :host(.user-is-tabbing) .duet-header-dropdown-toggle:focus.duet-theme-turva, .duet-theme-turva :host(.user-is-tabbing) .duet-header-dropdown-toggle:focus, :host(.user-is-tabbing) .duet-header-dropdown-toggle:focus.duet-theme-turva {
   outline-color: rgba(53, 79, 101, 0.8);
 }
 .duet-header-dropdown-toggle:active {
@@ -773,9 +680,6 @@ button {
   border-radius: 50%;
   box-shadow: 0 0 0 1px #c18b1f;
 }
-.duet-theme-turva .duet-header-badge {
-  background: rgb(247, 178, 40);
-}
 
 .active-bar {
   color: rgb(0, 119, 179);
@@ -789,9 +693,6 @@ button {
   content: "";
   background: rgb(0, 119, 179);
 }
-.duet-theme-turva .active-bar::after {
-  background: rgb(198, 12, 48);
-}
 
 .duet-header-dropdown {
   position: relative;
@@ -818,9 +719,6 @@ button {
     transform: translateY(3px);
     transition: 300ms ease;
   }
-  .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle::after {
-    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 rgb(245, 248, 250);
@@ -834,12 +732,6 @@ button {
   content: "";
   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: 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: rgb(245, 247, 250);
-}
 @media (min-width: 62em) {
   .duet-header-dropdown .duet-header-dropdown-toggle.active, .duet-header-dropdown .duet-header-dropdown-toggle.active:hover {
     color: rgb(0, 75, 129);
@@ -854,20 +746,6 @@ button {
     height: 3px;
     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: rgb(126, 2, 35);
-  }
-}
-@media (min-width: 62em) {
-  .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.duet-header-session {
-    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: rgb(255, 255, 255);
-    background: rgb(126, 2, 35);
-  }
 }
 .duet-header-dropdown .duet-header-dropdown-content {
   display: none;
@@ -875,10 +753,6 @@ button {
   background: rgb(240, 247, 250);
   border-bottom: 1px solid rgb(212, 223, 229);
 }
-.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content {
-  background: rgb(245, 247, 250);
-  border-color: rgb(212, 223, 229);
-}
 @media (min-width: 62em) {
   .duet-header-dropdown .duet-header-dropdown-content {
     position: absolute;
@@ -953,12 +827,9 @@ button {
   outline-offset: 2px;
   outline-color: rgba(0, 119, 179, 0.8);
 }
-.duet-theme-turva :host(.user-is-tabbing) .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):focus, :host(.user-is-tabbing) .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):focus.duet-theme-turva, .duet-theme-turva2 :host(.user-is-tabbing) .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):focus, :host(.user-is-tabbing) .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):focus.duet-theme-turva2 {
+.duet-theme-turva :host(.user-is-tabbing) .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):focus, :host(.user-is-tabbing) .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):focus.duet-theme-turva, .duet-theme-turva :host(.user-is-tabbing) .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):focus, :host(.user-is-tabbing) .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):focus.duet-theme-turva {
   outline-color: rgba(53, 79, 101, 0.8);
 }
-.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item) {
-  color: rgb(23, 28, 58);
-}
 @media (min-width: 62em) {
   .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item) {
     padding-right: 20px !important;
@@ -969,26 +840,17 @@ button {
   .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):hover {
     background: rgb(228, 241, 247);
   }
-  .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):hover {
-    background: rgb(222, 224, 228);
-  }
 }
 .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item).active {
   padding-right: 36px;
   font-weight: 600;
   vertical-align: baseline;
 }
-.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item).active {
-  font-weight: 700;
-}
 @media (min-width: 62em) {
   .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item).active {
     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: rgb(198, 12, 48);
-  }
 }
 .duet-header-dropdown .duet-header-dropdown-content .duet-header-link-external {
   margin-left: 4px;
@@ -1040,15 +902,11 @@ button {
   outline-offset: 2px;
   outline-color: rgba(0, 119, 179, 0.8);
 }
-.duet-theme-turva .duet-header-skip:focus, .duet-header-skip:focus.duet-theme-turva, .duet-theme-turva2 .duet-header-skip:focus, .duet-header-skip:focus.duet-theme-turva2 {
+.duet-theme-turva .duet-header-skip:focus, .duet-header-skip:focus.duet-theme-turva, .duet-theme-turva .duet-header-skip:focus, .duet-header-skip:focus.duet-theme-turva {
   outline: 2px solid;
   outline-offset: 2px;
   outline-color: rgba(53, 79, 101, 0.8);
 }
-.duet-theme-turva .duet-header-skip {
-  min-width: 120px;
-  color: rgb(23, 28, 58);
-}
 @media (min-width: 106.25em) {
   .duet-header-skip {
     margin-left: 20px;
@@ -1216,104 +1074,233 @@ button {
     display: initial;
   }
 }
-.duet-header-multi-level .duet-theme-turva .logo-and-segment .duet-header-dropdown {
-  margin-left: 0;
-}
-.duet-header-multi-level .duet-theme-turva .logo-and-segment .duet-header-dropdown-toggle {
-  padding-left: 0.5rem;
+
+.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: rgb(23, 42, 59);
 }
-.duet-header-multi-level .duet-theme-turva .logo-and-segment .duet-header-dropdown .duet-header-dropdown-content {
-  background: rgb(245, 247, 250);
+@media (min-width: 62em) {
+  .duet-header.duet-theme-turva {
+    box-shadow: 0 2px 6px 0 rgba(117, 117, 117, 0.13);
+  }
 }
-.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-theme-turva .duet-header-top {
+  border-color: rgb(212, 221, 226);
+  box-shadow: 0 2px 6px 0 rgba(117, 117, 117, 0.13);
 }
-.duet-header-multi-level .duet-theme-turva .duet-header-multi-level-nav .duet-header-dropdown .duet-header-dropdown-toggle.active {
-  color: rgb(198, 12, 48);
+@media (min-width: 62em) {
+  .duet-theme-turva .duet-header-top {
+    box-shadow: none;
+  }
 }
-.duet-header-multi-level .duet-theme-turva .duet-header-multi-level-nav .duet-header-dropdown .duet-header-dropdown-content {
-  background: rgb(245, 247, 250);
-  border-color: rgb(222, 224, 228);
+.duet-theme-turva .duet-header-top duet-logo {
+  left: -80px !important;
+  margin-top: -8px !important;
 }
-.duet-header-multi-level .duet-theme-turva .duet-header-multi-level-nav .duet-header-dropdown .duet-header-dropdown-content a::after {
-  background: rgb(198, 12, 48);
+
+.duet-theme-turva .duet-header-top .duet-header-region {
+  border-color: rgb(178, 194, 205);
 }
-.duet-header-multi-level .duet-theme-turva .duet-header-multi-level-nav .duet-header-dropdown .duet-header-dropdown-content a.active {
-  color: rgb(198, 12, 48);
-  background: none;
+
+.duet-theme-turva .duet-header-top duet-logo {
+  margin-top: 0 !important;
 }
-.duet-header-multi-level .duet-theme-turva .duet-header-multi-level-utils .duet-header-dropdown .duet-header-dropdown-content {
-  background: rgb(245, 247, 250);
+
+.duet-theme-turva .duet-header-bottom {
+  background: rgb(253, 247, 242);
 }
 
-:host(.duet-theme-turva2) .duet-header.duet-theme-turva {
+.duet-theme-turva .duet-header-button:not(:hover) {
   color: rgb(23, 42, 59);
-}
-:host(.duet-theme-turva2) .duet-theme-turva .duet-header-top {
   border-color: rgb(212, 221, 226);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-header-top .duet-header-region {
-  border-color: rgb(178, 194, 205);
+.duet-theme-turva .duet-header-button:not(:hover):focus {
+  outline: 0;
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-header-top duet-logo {
-  margin-top: 0 !important;
+:host(.user-is-tabbing) .duet-theme-turva .duet-header-button:not(:hover):focus {
+  outline: 2px solid;
+  outline-offset: 2px;
+  outline-color: rgba(53, 79, 101, 0.8);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-header-bottom {
-  background: rgb(253, 247, 242);
+
+.duet-theme-turva .duet-header-button:hover {
+  color: rgb(140, 0, 30);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-header-button:not(:hover) {
-  color: rgb(23, 42, 59);
+
+@media (min-width: 62em) {
+  .duet-theme-turva .duet-header-button::before {
+    background: rgb(178, 194, 205);
+  }
+}
+
+.duet-theme-turva .duet-header-button.active {
+  color: rgb(230, 23, 64);
+}
+
+.duet-theme-turva .duet-header-button.active:hover {
+  color: rgb(230, 23, 64);
+}
+
+@media (min-width: 62em) {
+  .duet-theme-turva .duet-header-button.active::after {
+    color: rgb(230, 23, 64);
+  }
+}
+
+.duet-header-utils .duet-header-button.duet-header-logout {
+  border-color: rgb(23, 42, 59);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-header-items .duet-header-item:not(:hover) {
+
+.duet-theme-turva .duet-header-items .duet-header-item:not(:hover) {
   color: rgb(23, 42, 59);
+  border-color: rgb(212, 223, 229);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-header-items .duet-header-item.active {
+.duet-theme-turva .duet-header-items .duet-header-item:not(:hover):focus {
+  outline: 0;
+}
+:host(.user-is-tabbing) .duet-theme-turva .duet-header-items .duet-header-item:not(:hover):focus {
+  outline: 2px solid;
+  outline-offset: 2px;
+  outline-color: rgba(53, 79, 101, 0.8);
+}
+
+.duet-theme-turva .duet-header-items .duet-header-item:hover {
+  color: rgb(95, 122, 143);
+}
+
+.duet-theme-turva .duet-header-items .duet-header-item.active {
+  color: rgb(230, 23, 64);
+}
+
+.duet-theme-turva .duet-header-items .duet-header-item.active:hover {
   color: rgb(230, 23, 64);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-header-items .duet-header-item.active::after {
+
+.duet-theme-turva .duet-header-items .duet-header-item.active::after {
   background: rgb(230, 23, 64);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-header-hamburger .duet-header-bar {
+
+.duet-theme-turva .duet-header-hamburger .duet-header-bar {
   background: rgb(23, 42, 59);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle::after {
+
+.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle::after {
   background: rgb(230, 23, 64);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.active,
-:host(.duet-theme-turva2) .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.active:hover {
+
+.duet-theme-turva button {
+  font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+}
+
+.duet-theme-turva .duet-header-language.active, .duet-theme-turva .duet-header-language.active:hover,
+.duet-theme-turva .duet-header-contact.active,
+.duet-theme-turva .duet-header-contact.active:hover {
+  color: inherit;
+}
+
+.duet-theme-turva .duet-header-badge {
+  background: rgb(247, 178, 40);
+}
+
+.duet-theme-turva .active-bar {
+  color: rgb(230, 23, 64);
+}
+.duet-theme-turva .active-bar::after {
+  background: rgb(230, 23, 64);
+}
+
+@media (min-width: 62em) {
+  .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle::after {
+    background: rgb(230, 23, 64);
+  }
+}
+
+.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.active,
+.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.active:hover {
   border-bottom-color: rgb(245, 246, 247);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content {
+.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: rgb(230, 23, 64);
+}
+@media (min-width: 62em) {
+  .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 {
+    color: rgb(140, 0, 30);
+  }
+}
+
+@media (min-width: 62em) {
+  .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.duet-header-session {
+    color: rgb(255, 255, 255);
+    background: rgb(230, 23, 64);
+    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: rgb(255, 255, 255);
+    background: rgb(140, 0, 30);
+  }
+}
+
+.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content {
   background: rgb(253, 247, 242);
+  border-color: rgb(212, 223, 229);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item) {
+
+.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item) {
   color: rgb(23, 42, 59);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):hover {
-  background: rgb(241, 202, 178);
+
+@media (min-width: 62em) {
+  .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item):hover {
+    background: rgb(241, 202, 178);
+  }
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item).active {
+
+.duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item).active {
+  font-weight: 700;
   background: rgb(241, 202, 178);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-header-skip {
+@media (min-width: 62em) {
+  .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a:not(.duet-header-item).active {
+    background: rgb(230, 23, 64);
+  }
+}
+
+.duet-theme-turva .duet-header-skip {
+  min-width: 120px;
   color: rgb(23, 42, 59);
 }
-:host(.duet-theme-turva2) .duet-header-multi-level .duet-theme-turva .logo-and-segment .duet-header-dropdown .duet-header-dropdown-content {
+
+.duet-header-multi-level .duet-theme-turva .logo-and-segment .duet-header-dropdown {
+  margin-left: 0;
+}
+.duet-header-multi-level .duet-theme-turva .logo-and-segment .duet-header-dropdown-toggle {
+  padding-left: 0.5rem;
+}
+.duet-header-multi-level .duet-theme-turva .logo-and-segment .duet-header-dropdown .duet-header-dropdown-content {
   background: rgb(253, 247, 242);
 }
-:host(.duet-theme-turva2) .duet-header-multi-level-nav .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content {
+.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-theme-turva .duet-header-multi-level-nav .duet-header-dropdown .duet-header-dropdown-toggle.active {
+  color: rgb(230, 23, 64);
+}
+.duet-theme-turva .duet-header-multi-level-nav .duet-header-dropdown .duet-header-dropdown-content {
   background: rgb(245, 246, 247);
   border-color: rgb(212, 221, 226);
 }
-:host(.duet-theme-turva2) .duet-header-multi-level-nav .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-toggle.active {
+.duet-theme-turva .duet-header-multi-level-nav .duet-header-dropdown .duet-header-dropdown-content a::after {
   color: rgb(230, 23, 64);
 }
-:host(.duet-theme-turva2) .duet-header-multi-level-nav .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a::after {
-  background: rgb(230, 23, 64);
-}
-:host(.duet-theme-turva2) .duet-header-multi-level-nav .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content a.active {
+.duet-theme-turva .duet-header-multi-level-nav .duet-header-dropdown .duet-header-dropdown-content a.active {
   color: rgb(230, 23, 64);
+  background: none;
 }
-:host(.duet-theme-turva2) .duet-header-multi-level-utils .duet-theme-turva .duet-header-dropdown .duet-header-dropdown-content {
+
+.duet-theme-turva .duet-header-multi-level-utils .duet-header-dropdown .duet-header-dropdown-content {
   background: rgb(245, 246, 247);
 }

package/lib/collection/components/duet-heading/duet-heading.css

@@ -48,7 +48,7 @@
   font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
   font-style: italic;
   font-weight: 700;
-  color: rgb(23, 28, 58);
+  color: rgb(23, 42, 59);
 }
 .duet-heading.duet-heading-border {
   padding-bottom: 20px;
@@ -268,7 +268,7 @@
   font-weight: 600 !important;
 }
 
-:host(.duet-theme-turva2) .duet-heading.duet-theme-turva {
+.duet-heading.duet-theme-turva {
   font-style: normal !important;
   color: rgb(23, 42, 59);
 }