/*!
 * Copyright (c) 2016-present, Skillsoft, Inc - All Rights Reserved.
 * Unauthorized copying of this file, via any medium is strictly prohibited.
 * Proprietary and confidential.
 */
.NavBarContainer---root---UgLTc {
  position: fixed;
  z-index: 9999;
  z-index: var(--zAboveAll);
  width: 100%;
  min-width: 820px;
  -webkit-box-shadow: 0 2px 7px 0 rgba(0, 0, 0, .2), 0 1px 4px 0 rgba(0, 0, 0, .13);
          box-shadow: 0 2px 7px 0 rgba(0, 0, 0, .2), 0 1px 4px 0 rgba(0, 0, 0, .13);
  -webkit-box-shadow: var(--deepShadow);
          box-shadow: var(--deepShadow);
}

.NavBarContainer---root---UgLTc.NavBarContainer---preview---adkQP {
  position: static;
  z-index: auto;
}

.NavBarContainer---logo---JagQK {
  width: 160px;
  height: 40px;
}

.NavBarContainer---secondaryBar---CdL_f {
  position: relative;
  border-top: 1px solid #e0e0e0;
  border-top: 1px solid var(--tableLine);
}

.NavBarContainer---preview---adkQP .NavBarContainer---secondaryBar---CdL_f {
  position: static;
}

.NavBarContainer---hidden---XWHki {
  top: 0;
}

.NavBarContainer---root---UgLTc:not(.NavBarContainer---preview---adkQP) .NavBarContainer---headerWidth---SpB2x {
  width: 100vw;
}

.NavBarContainer---userName---Eok4u {
  text-transform: capitalize;
}

.NavBarContainer---userNameInMenu---JvRx3 {
  padding: 16px 16px 12px;
  padding: 1rem 1rem 0.75rem;
  padding: var(--space16) var(--space16) var(--space12);
  font-size: 14px;
  font-size: 0.875rem;
  font-size: var(--font14);
  font-weight: bold;
  color: #6a6e75;
  color: var(--lightNeutralColor);
  word-break: break-word;
  border-bottom: 1px solid #afb6c2;
  border-bottom: 1px solid var(--lighterNeutralColor);
}

.NavBarContainer---profileIconWrapper---TVjgt,
.NavBarContainer---nineDotMenuIcon---teUQQ,
.NavBarContainer---messageCenterLogo---VRHpq {
  padding: 0 !important;
}

.NavBarContainer---navItemIcon---E9ooi svg {
  width: 32px;
  height: 32px;
}

.NavBarContainer---mediumOrBelow---UMbG_ .NavBarContainer---navItemIcon---E9ooi svg {
  width: 24px;
  height: 24px;
}
.NavBar---root---qAj2z {
  width: 100%;
}

.NavBar---root---qAj2z.NavBar---primary---z85TZ {
  position: relative;
  z-index: 9999;
  z-index: var(--zAboveAll);
  padding: 4px 0;
  padding: 0.25rem 0;
  padding: var(--space4) 0;
  background-color: #f7fcf8;
  background-color: var(--header_backgroundColor);
}

.NavBar---root---qAj2z.NavBar---primary---z85TZ.NavBar---preview---wXh1h {
  z-index: 0;
  background-color: var(--preview_header_backgroundColor);
  background-color: var(--preview_header_backgroundColor);
}

.NavBar---channel---XQ9pW {
  background: white;
  background: var(--reverseColor);
}

.NavBar---secondary---YpO6z.NavBar---light---M5E2T {
  background: white;
  background: var(--reverseColor);
}

.NavBar---secondary---YpO6z.NavBar---dark---dBqfu {
  background: #222325;
  background: var(--darkNeutralColor);
}

.NavBar---primary---z85TZ.NavBar---fullLength---v3QGQ {
  max-width: none;
}

.NavBar---bar---hHBGJ {
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 0 auto;
  list-style: none;
}

.NavBar---bar---hHBGJ.NavBar---primary---z85TZ {
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  width: 100%;
  height: 62px;
  padding: 0;
  color: #0073c4;
  color: var(--lightPrimaryColor);
}

.NavBar---bar---hHBGJ.NavBar---secondary---YpO6z,
.NavBar---bar---hHBGJ.NavBar---channel---XQ9pW {
  padding: 0;
  color: #6a6e75;
  color: var(--lightNeutralColor);
  text-align: center;
}

.NavBar---bar---hHBGJ.NavBar---secondary---YpO6z {
  height: 48px;
}

@media (max-width: 920px) {
  .NavBar---bar---hHBGJ.NavBar---primary---z85TZ,
  .NavBar---bar---hHBGJ.NavBar---secondary---YpO6z {
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
}

.NavBar---bar---hHBGJ.NavBar---channel---XQ9pW {
  max-width: 1232px;
  height: 56px;
}

.NavBar---left---I7LUt {
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}

.NavBar---center---IA7Oo {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.NavBar---right---H_0Hy {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.NavBar---header---Rlzny {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  border: 0;
}

/* From Tabs */

.NavBar---li---DenF7 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 100%;
  margin: 0 0.5px;
  letter-spacing: 0.5px;
  cursor: pointer;
}

.NavBar---secondary---YpO6z .NavBar---li---DenF7 {
  position: relative;
}

.NavBar---li---DenF7 > div {
  position: relative;
  height: 100%;
  cursor: pointer;
}

/* Children should have a position relative to adapt to the size of the parent
** In the case of primary on navbar the second child we want it to behave differently **
* The above issue UI doesn't exists anymore but the original code was affecting other elements 
* as its targeted using the elements order, order may not be same we keep on introducing different items
* Library doesn't need the position relative, using .library class as its exists, solution can be improved. 
*/

.NavBar---primary---z85TZ .NavBar---library---OPtFe > div,
.NavBar---primary---z85TZ .NavBar---library---OPtFe > div {
  position: inherit;
}

/* Tab items */

.NavBar---tabItem---phpgz {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  height: 100%;
  font-weight: bold;
  color: #6a6e75;
  color: var(--lightNeutralColor);
  text-decoration: none;
  letter-spacing: 0.5px;
  white-space: nowrap;
  cursor: pointer;
  background: transparent;
  border: 2px solid transparent;
  outline: none;
}

.NavBar---customColor---Dkh9b {
  color: #0073c4 !important;
  color: var(--interactions_backgroundColor) !important;
}

.NavBar---tabItem---phpgz > div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.NavBar---primary---z85TZ .NavBar---tabItem---phpgz {
  padding: 0 12px;
  font-size: 16px;
  font-size: 1rem;
  font-size: var(--font16);
  color: #151c36;
  color: var(--header_textColor);
}

.NavBar---logo---W_Jy3 h1 {
  height: 100%;
}

.NavBar---logo---W_Jy3 {
  min-width: 100px;
  max-width: 188px;
}

.NavBar---primary---z85TZ.NavBar---preview---wXh1h .NavBar---tabItem---phpgz {
  color: var(--preview_header_textColor);
  color: var(--preview_header_textColor);
}

.NavBar---secondary---YpO6z .NavBar---tabItem---phpgz,
.NavBar---channel---XQ9pW .NavBar---tabItem---phpgz {
  padding: 0 20px;
  font-size: 12px;
  font-size: 0.75rem;
  font-size: var(--font12);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.NavBar---secondary---YpO6z .NavBar---font---ZpBHu .NavBar---tabItem---phpgz {
  font-size: 14px;
  font-size: 0.875rem;
  font-size: var(--font14);
}

.NavBar---secondary---YpO6z.NavBar---dark---dBqfu .NavBar---tabItem---phpgz {
  color: white;
  color: var(--reverseColor);
}

.NavBar---channel---XQ9pW .NavBar---tabItem---phpgz {
  font-size: 18px;
  font-size: 1.125rem;
  font-size: var(--font18);
}

.NavBar---profile---k4frS {
  margin-right: 24px;
  margin-right: 1.5rem;
  margin-right: var(--space24);
}

@media screen and (max-width: 768px) {
  .NavBar---profile---k4frS {
    margin-right: 0;
  }
}

.NavBar---profilePicture---ePTCI {
  width: 32px !important;
  height: 32px !important;
  font-size: 14px !important;
  font-size: 0.875rem !important;
  font-size: var(--font14) !important;
}

/* Active states */

.NavBar---root---qAj2z .NavBar---selectedMenuOption---HdzM_ {
  color: #151c36;
  color: var(--darkPrimaryColor);
}

.NavBar---primary---z85TZ .NavBar---active---cYlxt {
  -webkit-box-shadow: inset 0 -3px 0 0 var(--header_textHighlightColor);
          box-shadow: inset 0 -3px 0 0 var(--header_textHighlightColor);
  box-shadow: inset 0 -3px 0 0 var(--header_textHighlightColor);
}

.NavBar---primary---z85TZ .NavBar---active---cYlxt.NavBar---tabItem---phpgz,
.NavBar---primary---z85TZ .NavBar---active---cYlxt .NavBar---tabItem---phpgz {
  color: var(--header_textHighlightColor);
  color: var(--header_textHighlightColor);
}

.NavBar---secondary---YpO6z .NavBar---active---cYlxt {
  -webkit-box-shadow: inset 0 -4px 0 0 #151c36;
          box-shadow: inset 0 -4px 0 0 #151c36;
  -webkit-box-shadow: inset 0 -4px 0 0 var(--darkPrimaryColor);
          box-shadow: inset 0 -4px 0 0 var(--darkPrimaryColor);
}

.NavBar---secondary---YpO6z .NavBar---active---cYlxt .NavBar---tabItem---phpgz,
.NavBar---secondary---YpO6z .NavBar---tabItem---phpgz[aria-expanded='true'] {
  color: #151c36;
  color: var(--darkPrimaryColor);
}

.NavBar---secondary---YpO6z.NavBar---dark---dBqfu .NavBar---active---cYlxt {
  -webkit-box-shadow: inset 0 -4px 0 0 white;
          box-shadow: inset 0 -4px 0 0 white;
  -webkit-box-shadow: inset 0 -4px 0 0 var(--reverseColor);
          box-shadow: inset 0 -4px 0 0 var(--reverseColor);
}

.NavBar---secondary---YpO6z.NavBar---dark---dBqfu .NavBar---active---cYlxt .NavBar---tabItem---phpgz,
.NavBar---secondary---YpO6z.NavBar---dark---dBqfu .NavBar---tabItem---phpgz[aria-expanded='true'] {
  color: white;
  color: var(--reverseColor);
}

.NavBar---channel---XQ9pW .NavBar---active---cYlxt {
  border-bottom: 5px solid transparent;
  -webkit-box-shadow: inset 0 -5px 0 0 #0073c4;
          box-shadow: inset 0 -5px 0 0 #0073c4;
  -webkit-box-shadow: inset 0 -5px 0 0 var(--lightPrimaryColor);
          box-shadow: inset 0 -5px 0 0 var(--lightPrimaryColor);
}

.NavBar---channel---XQ9pW .NavBar---active---cYlxt .NavBar---tabItem---phpgz,
.NavBar---channel---XQ9pW .NavBar---selectedMenuOption---HdzM_ {
  color: #0073c4;
  color: var(--lightPrimaryColor);
}

/* Hover states */

.NavBar---allowActive---i8Upy .NavBar---tabItem---phpgz:hover {
  color: #151c36;
  color: var(--darkPrimaryColor);
}

.NavBar---primary---z85TZ .NavBar---allowActive---i8Upy .NavBar---tabItem---phpgz:active,
.NavBar---primary---z85TZ .NavBar---allowActive---i8Upy .NavBar---tabItem---phpgz:hover {
  color: var(--header_textHighlightColor);
  color: var(--header_textHighlightColor);
}

.NavBar---primary---z85TZ .NavBar---allowActive---i8Upy .NavBar---tabItem---phpgz .NavBar---profilePicture---ePTCI {
  color: #151c36;
  color: var(--header_textColor);
  border-color: #151c36;
  border-color: var(--header_textColor);
}

.NavBar---primary---z85TZ .NavBar---allowActive---i8Upy .NavBar---tabItem---phpgz:active .NavBar---profilePicture---ePTCI,
.NavBar---primary---z85TZ .NavBar---allowActive---i8Upy .NavBar---tabItem---phpgz:hover .NavBar---profilePicture---ePTCI {
  color: var(--header_textHighlightColor);
  color: var(--header_textHighlightColor);
  border-color: var(--header_textHighlightColor);
  border-color: var(--header_textHighlightColor);
}

.NavBar---secondary---YpO6z.NavBar---dark---dBqfu .NavBar---allowActive---i8Upy .NavBar---tabItem---phpgz:active,
.NavBar---secondary---YpO6z.NavBar---dark---dBqfu .NavBar---allowActive---i8Upy .NavBar---tabItem---phpgz:hover {
  color: #afb6c2;
  color: var(--lighterNeutralColor);
}

.NavBar---channel---XQ9pW .NavBar---allowActive---i8Upy .NavBar---tabItem---phpgz:hover,
.NavBar---channel---XQ9pW .NavBar---allowActive---i8Upy .NavBar---tabItem---phpgz:active {
  color: #0073c4;
  color: var(--lightPrimaryColor);
}

.NavBar---primary---z85TZ .NavBar---disabled---OdHFN.NavBar---tabItem---phpgz:hover,
.NavBar---primary---z85TZ .NavBar---disabled---OdHFN.NavBar---tabItem---phpgz {
  color: #151c36 !important;
  color: var(--header_textColor) !important;
  cursor: default;
  opacity: 0.5;
}

/* Misc */

.NavBar---channel---XQ9pW .NavBar---tabItem---phpgz h2 {
  font-size: 18px;
  font-size: 1.125rem;
  font-size: var(--font18);
  font-weight: bold;
}

.NavBar---li---DenF7[role='tab']:focus {
  outline: 0 !important;
}

.NavBar---secondary---YpO6z .NavBar---link---DbkiR,
.NavBar---channel---XQ9pW .NavBar---link---DbkiR {
  padding: 16px 20px;
}

.NavBar---buttonInner---_RZuz {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.NavBar---iconBefore---czMaB {
  padding-right: 8px;
  padding-right: 0.5rem;
  padding-right: var(--space8);
  font-size: 18px;
  font-size: 1.125rem;
  font-size: var(--font18);
  line-height: 0;
}

.NavBar---iconDropdown---XV9hL {
  padding-left: 8px;
  padding-left: 0.5rem;
  padding-left: var(--space8);
  font-size: 10px;
  font-size: 0.625rem;
  font-size: var(--font10);
  line-height: 0;
}

.NavBar---dropdownItem---Rno8C {
  position: absolute;
  right: 0;
  left: 0;
  z-index: 100;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  max-width: 1280px;
  margin: 0 auto;
  background-color: #f9fafb;
  background-color: var(--veryLightGrey);
  -webkit-box-shadow: 0 2px 7px 0 rgba(0, 0, 0, .2), 0 1px 4px 0 rgba(0, 0, 0, .13);
          box-shadow: 0 2px 7px 0 rgba(0, 0, 0, .2), 0 1px 4px 0 rgba(0, 0, 0, .13);
  -webkit-box-shadow: var(--deepShadow);
          box-shadow: var(--deepShadow);
}

.NavBar---expanded---umEdu {
  display: block;
}

.NavBar---spacer---Rkb6K {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;

  /* Fix for Safari */
  height: 100%;
  text-align: center;
}

.NavBar---disabled---OdHFN {
  cursor: not-allowed;
}

.NavBar---mobileSearchBox---soYMp {
  padding: 0 6px 0 0;
  padding: 0 0.375rem 0 0;
  padding: 0 var(--space6) 0 0;
}

.NavBar---mobileSearchBox---soYMp button {
  width: auto !important;
  border-radius: 0;
}

.NavBar---libraryClass---V1SWQ {
  padding-top: 10px;
  padding-top: 0.625rem;
  padding-top: var(--space10);
}

@media screen and (max-width: 1279px) {
  .NavBar---iconBefore---czMaB {
    padding: 0 0.25rem;
    padding: 0 var(--space4);
  }

  .NavBar---searchIcon---jzONP {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    margin-left: 0;
    background: none;
  }

  .NavBar---searchIcon---jzONP .NavBar---searchButton---OCYpi {
    background-color: transparent;
    border: 0;
  }

  .NavBar---searchIcon---jzONP .NavBar---searchButton---OCYpi:hover {
    color: var(--header_textHighlightColor);
    color: var(--header_textHighlightColor);
    background-color: transparent;
    -webkit-box-shadow: none;
            box-shadow: none;
  }

  .NavBar---searchIcon---jzONP .NavBar---searchButton---OCYpi:hover > span {
    color: var(--header_textHighlightColor);
    color: var(--header_textHighlightColor);
  }

  .NavBar---searchIcon---jzONP .NavBar---searchButton---OCYpi:focus {
    background-color: transparent;
    -webkit-box-shadow: none;
            box-shadow: none;
  }

  .NavBar---searchIcon---jzONP button > span {
    font-size: 1.125rem;
    font-size: var(--font18);
    color: #151c36;
    color: var(--header_textColor);
  }

  .NavBar---searchIcon---jzONP.NavBar---searchIconFocus---U6VVS > button {
    color: var(--header_textHighlightColor);
    color: var(--header_textHighlightColor);
    background-color: transparent;
    -webkit-box-shadow: none;
            box-shadow: none;
  }

  .NavBar---searchIcon---jzONP.NavBar---searchIconFocus---U6VVS > button [class='filled'] {
    fill: var(--header_textHighlightColor);
    fill: var(--header_textHighlightColor);
  }


  .NavBar---li---DenF7,
  .NavBar---languageSelector---wAa9K {
    -webkit-tap-highlight-color: transparent;
  }
}

@media screen and (max-width: 1023px) {
  .NavBar---primary---z85TZ .NavBar---tabItem---phpgz,
  .NavBar---mobileSearchBox---soYMp button {
    padding: 0 0.375rem !important;
    padding: 0 var(--space6) !important;
  }

  .NavBar---mobileSearchBox---soYMp {
    padding-right: 1.5rem;
    padding-right: var(--space24);
  }

  .NavBar---logo---W_Jy3 {
    min-width: auto;
  }

  .NavBar---languageSelector---wAa9K {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }

  .NavBar---profile---k4frS {
    padding-right: 0;
  }
}

@media screen and (min-width: 768px) {
  .NavBar---library---OPtFe {
    position: relative;
  }
}

@media screen and (max-width: 480px) {
  .NavBar---iconBefore---czMaB {
    padding: 0;
  }
}

.NavBar---rightBorder---gYNin {
  border-right: 1px solid rgb(192, 192, 192);
}

.NavBar---leftBorder---OzwLH {
  border-left: 1px solid rgb(192, 192, 192);
}

.NavBar---notificationDot---bxoEP {
  width: 12px;
  height: 12px;
  position: absolute;
  right: 20%;
  top: 20%;
  background-color: #FF375A;
  background-color: var(--amaranth);
  border-radius: 50%;
}

.NavBar---aiAssistantNavIcon---rIjmB {
  padding: 0;
}

.NavBar---aiAssistantNavIcon---rIjmB button {
  width: auto !important;
  border-radius: 0;
}