@font-face {
  font-display: swap;
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: url("https://static.netcraft.com/fonts/montserrat/montserrat-v18-latin-ext_latin-regular.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

@font-face {
  font-display: swap;
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  src: url("https://static.netcraft.com/fonts/montserrat/montserrat-v18-latin-ext_latin-800.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

@font-face {
  font-display: swap;
  font-family: 'Netcraft Open Sans';
  font-stretch: 100%;
  font-style: normal;
  font-weight: 400;
  src: url("https://static.netcraft.com/fonts/open-sans/open-sans-v27-latin-ext_latin-regular.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

@font-face {
  font-display: swap;
  font-family: 'Netcraft Open Sans';
  font-stretch: 100%;
  font-style: normal;
  font-weight: 700;
  src: url("https://static.netcraft.com/fonts/open-sans/open-sans-v27-latin-ext_latin-700.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/*
 * When adding new colours use HSL if possible, as it helps to ensure different
 * shades of a colour work together, as the hue can remain constant. To name the
 * colours, convert the HSL to a hexcode, and look it up on
 * http://chir.ag/projects/name-that-color to find its unique name.
 * This prevents 'grey', 'darker-grey', 'darkest-grey' etc.
 */
/* Shades of grey */
/* Green shades */
/* Warning/yellow shades */
/* Danger/red shades */
/* Brand/blue shades */
/*
 * New Unified Brand Colours (DESIGN-55)
 * Not hsl as the conversion changes them slightly
 */
/* Brand colours */
/* Extended palette */
/* States */
html,
body {
  font-family: 'Netcraft Open Sans', 'Open Sans', sans-serif; }

.title {
  color: #474747;
  font-family: 'Montserrat', sans-serif;
  font-weight: 700; }

.help-box {
  background-color: #fafafa;
  border-left: 4px solid #e6e6e6;
  padding: 14px; }
  .help-box h2 {
    color: #474747;
    font-size: 15px;
    font-weight: bold;
    margin-bottom: 8px;
    margin-top: 0; }
  .help-box p {
    font-size: 14px;
    margin: 0; }
    .help-box p a {
      color: #448cca; }

/*
 * When adding new colours use HSL if possible, as it helps to ensure different
 * shades of a colour work together, as the hue can remain constant. To name the
 * colours, convert the HSL to a hexcode, and look it up on
 * http://chir.ag/projects/name-that-color to find its unique name.
 * This prevents 'grey', 'darker-grey', 'darkest-grey' etc.
 */
/* Shades of grey */
/* Green shades */
/* Warning/yellow shades */
/* Danger/red shades */
/* Brand/blue shades */
/*
 * New Unified Brand Colours (DESIGN-55)
 * Not hsl as the conversion changes them slightly
 */
/* Brand colours */
/* Extended palette */
/* States */
.button-primary, .button-primary-warning, .button-tertiary, .button-tertiary-light, .button-secondary {
  font-size: 14px;
  font-weight: 600; }
  .button-primary:hover:not([disabled]), .button-primary-warning:hover:not([disabled]), .button-tertiary:hover:not([disabled]), .button-tertiary-light:hover:not([disabled]), .button-secondary:hover:not([disabled]) {
    cursor: pointer; }

.button-primary, .button-primary-warning {
  background-color: white;
  border: 2px solid #448cca;
  border-radius: 3px;
  color: #448cca;
  padding: 11px 25px; }
  .button-primary.disabled, .disabled.button-primary-warning {
    background-color: white;
    border-color: #448cca;
    color: #448cca;
    opacity: 0.3; }

.button-primary-warning {
  background-color: transparent;
  border-color: #e0a210;
  color: #e0a210; }
  .button-primary-warning.disabled {
    background-color: white;
    border-color: #e0a210;
    color: #e0a210;
    opacity: 0.3; }

.button-tertiary, .button-tertiary-light {
  background-color: transparent;
  border: 0;
  color: #448cca;
  padding: 0;
  text-align: left; }
  .button-tertiary .fa, .button-tertiary-light .fa {
    margin-left: 6px; }
  .button-tertiary:focus, .button-tertiary-light:focus {
    box-shadow: none;
    outline: none; }
  .button-tertiary:hover, .button-tertiary-light:hover {
    background-color: transparent;
    color: #448cca;
    text-decoration: underline; }
  .button-tertiary:active, .button-tertiary-light:active {
    background-color: transparent;
    color: #448cca; }

.button-tertiary-light {
  font-weight: 300; }

.button-secondary {
  background: none;
  border: 0;
  color: #474747;
  padding: 11px 18px; }
  .button-secondary:focus {
    outline: none; }

/*
 * When adding new colours use HSL if possible, as it helps to ensure different
 * shades of a colour work together, as the hue can remain constant. To name the
 * colours, convert the HSL to a hexcode, and look it up on
 * http://chir.ag/projects/name-that-color to find its unique name.
 * This prevents 'grey', 'darker-grey', 'darkest-grey' etc.
 */
/* Shades of grey */
/* Green shades */
/* Warning/yellow shades */
/* Danger/red shades */
/* Brand/blue shades */
/*
 * New Unified Brand Colours (DESIGN-55)
 * Not hsl as the conversion changes them slightly
 */
/* Brand colours */
/* Extended palette */
/* States */
/*
 * When adding new colours use HSL if possible, as it helps to ensure different
 * shades of a colour work together, as the hue can remain constant. To name the
 * colours, convert the HSL to a hexcode, and look it up on
 * http://chir.ag/projects/name-that-color to find its unique name.
 * This prevents 'grey', 'darker-grey', 'darkest-grey' etc.
 */
/* Shades of grey */
/* Green shades */
/* Warning/yellow shades */
/* Danger/red shades */
/* Brand/blue shades */
/*
 * New Unified Brand Colours (DESIGN-55)
 * Not hsl as the conversion changes them slightly
 */
/* Brand colours */
/* Extended palette */
/* States */
/*
 * Styling for a 4 column footer
 *
 * The general use of this is 3 columns of links (with headers), and a 4th
 * column for the copyright.
 */
footer {
  color: #474747;
  display: grid;
  grid-template-columns: repeat(4, auto);
  grid-template-rows: auto;
  justify-content: space-between;
  padding-bottom: 30px; }
  @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    footer {
      grid-template-columns: repeat(4, 1fr); } }
  @media (max-width: 650px) {
    footer {
      grid-template-columns: auto;
      grid-template-rows: repeat(4, auto); } }
  footer div h6 {
    color: #474747;
    font-size: 14px;
    font-weight: 600;
    margin: 30px 0 6px; }
  footer div ul {
    font-size: 14px;
    list-style: none;
    margin-bottom: 0;
    padding-left: 0; }
    footer div ul li {
      padding: 1px 0; }
      footer div ul li a {
        color: #787878;
        text-decoration: none; }
        footer div ul li a:hover {
          text-decoration: underline; }

/*
 * When adding new colours use HSL if possible, as it helps to ensure different
 * shades of a colour work together, as the hue can remain constant. To name the
 * colours, convert the HSL to a hexcode, and look it up on
 * http://chir.ag/projects/name-that-color to find its unique name.
 * This prevents 'grey', 'darker-grey', 'darkest-grey' etc.
 */
/* Shades of grey */
/* Green shades */
/* Warning/yellow shades */
/* Danger/red shades */
/* Brand/blue shades */
/*
 * New Unified Brand Colours (DESIGN-55)
 * Not hsl as the conversion changes them slightly
 */
/* Brand colours */
/* Extended palette */
/* States */
.primary-icon, .danger-icon, .warning-icon {
  border: 5px solid;
  border-radius: 25px;
  font-weight: 900;
  height: 33px;
  text-align: center;
  width: 33px; }
  .primary-icon *, .danger-icon *, .warning-icon * {
    border: 2px solid;
    border-radius: 25px;
    display: block;
    font-size: 12px;
    font-weight: 900;
    height: 23px;
    line-height: 1.7;
    width: 23px; }
  .disabled.primary-icon, .disabled.danger-icon, .disabled.warning-icon {
    border-color: transparent; }
    .disabled.primary-icon *, .disabled.danger-icon *, .disabled.warning-icon * {
      border-color: #787878;
      color: #787878; }

.primary-icon {
  border-color: #afcee9; }
  .primary-icon * {
    border-color: #448cca;
    color: #085191; }

.danger-icon {
  border-color: #fecac8; }
  .danger-icon * {
    border-color: #d8544f;
    color: #6f0906; }

.warning-icon {
  border-color: #f9e6b9; }
  .warning-icon * {
    border-color: #f4c862;
    color: #6c5213; }

/*
 * When adding new colours use HSL if possible, as it helps to ensure different
 * shades of a colour work together, as the hue can remain constant. To name the
 * colours, convert the HSL to a hexcode, and look it up on
 * http://chir.ag/projects/name-that-color to find its unique name.
 * This prevents 'grey', 'darker-grey', 'darkest-grey' etc.
 */
/* Shades of grey */
/* Green shades */
/* Warning/yellow shades */
/* Danger/red shades */
/* Brand/blue shades */
/*
 * New Unified Brand Colours (DESIGN-55)
 * Not hsl as the conversion changes them slightly
 */
/* Brand colours */
/* Extended palette */
/* States */
.styled-input-label,
.styled-input,
.styled-input::placeholder {
  font-size: 14px; }

.styled-input {
  background-clip: padding-box;
  background-color: white;
  border: 1px solid #c2c2c2;
  border-radius: 0.25rem;
  box-shadow: #e6e6e6 0 1px 2px;
  color: #474747;
  display: block;
  line-height: 1.5;
  margin-top: 0.5rem;
  padding: 0.375rem 0.75rem;
  width: auto; }
  .styled-input:focus {
    outline: none; }
    .styled-input:focus::placeholder {
      opacity: 66%; }
  .styled-input:read-only {
    background-color: #fafafa;
    color: #787878; }

.input-group > .styled-input {
  flex: 1 1 auto;
  margin-bottom: 0;
  position: relative;
  width: 1%; }
  .input-group > .styled-input:not(:last-child) {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0; }

/* Define any numeric variables here, such
as breakpoints and dimensions */
/*
 * When adding new colours use HSL if possible, as it helps to ensure different
 * shades of a colour work together, as the hue can remain constant. To name the
 * colours, convert the HSL to a hexcode, and look it up on
 * http://chir.ag/projects/name-that-color to find its unique name.
 * This prevents 'grey', 'darker-grey', 'darkest-grey' etc.
 */
/* Shades of grey */
/* Green shades */
/* Warning/yellow shades */
/* Danger/red shades */
/* Brand/blue shades */
/*
 * New Unified Brand Colours (DESIGN-55)
 * Not hsl as the conversion changes them slightly
 */
/* Brand colours */
/* Extended palette */
/* States */
/*
 * When adding new colours use HSL if possible, as it helps to ensure different
 * shades of a colour work together, as the hue can remain constant. To name the
 * colours, convert the HSL to a hexcode, and look it up on
 * http://chir.ag/projects/name-that-color to find its unique name.
 * This prevents 'grey', 'darker-grey', 'darkest-grey' etc.
 */
/* Shades of grey */
/* Green shades */
/* Warning/yellow shades */
/* Danger/red shades */
/* Brand/blue shades */
/*
 * New Unified Brand Colours (DESIGN-55)
 * Not hsl as the conversion changes them slightly
 */
/* Brand colours */
/* Extended palette */
/* States */
.styled-input-label,
.styled-input,
.styled-input::placeholder {
  font-size: 14px; }

.styled-input {
  background-clip: padding-box;
  background-color: white;
  border: 1px solid #c2c2c2;
  border-radius: 0.25rem;
  box-shadow: #e6e6e6 0 1px 2px;
  color: #474747;
  display: block;
  line-height: 1.5;
  margin-top: 0.5rem;
  padding: 0.375rem 0.75rem;
  width: auto; }
  .styled-input:focus {
    outline: none; }
    .styled-input:focus::placeholder {
      opacity: 66%; }
  .styled-input:read-only {
    background-color: #fafafa;
    color: #787878; }

.input-group > .styled-input {
  flex: 1 1 auto;
  margin-bottom: 0;
  position: relative;
  width: 1%; }
  .input-group > .styled-input:not(:last-child) {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0; }

.nc-secondary-nav .chosen-container:not(.chosen-container-active):hover,
.nc-secondary-nav .chosen-container.chosen-container-active {
  background: #e5f1f2;
  cursor: pointer; }

.nc-secondary-nav .chosen-container:focus,
.nc-secondary-nav .chosen-container-active {
  outline: solid 2px #48a9c5; }

.nc-secondary-nav .chosen-container .chosen-results li {
  color: #424242;
  display: block;
  font-family: 'Open Sans', 'Netcraft Open Sans', sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  /* 171.429% */
  margin-bottom: 4px;
  padding: 8px 16px;
  text-decoration: none; }

.nc-secondary-nav .chosen-container {
  border-radius: 8px;
  color: #424242;
  font-family: 'Open Sans', 'Netcraft Open Sans', sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  text-decoration: none; }

/* White on blue */
.nc-secondary-nav .chosen-container .chosen-results li.result-selected,
.nc-secondary-nav .chosen-container .chosen-results li:active {
  background: #003e51;
  color: white;
  outline: none;
  text-decoration: none; }

.nc-secondary-nav .chosen-container {
  width: 30rem !important; }

.nc-secondary-nav .chosen-container .chosen-results {
  padding: 0; }

.nc-secondary-nav .chosen-container .chosen-results .highlighted,
.nc-secondary-nav .chosen-container .chosen-results li:hover {
  background: #e5f1f2;
  color: #1a1a1a; }

.nc-secondary-nav .chosen-container .chosen-results li.disabled-option {
  background: #d9d9d6;
  color: #424242cc; }

.nc-secondary-nav .chosen-container .chosen-single {
  background-color: rgba(0, 0, 0, 0);
  border: 0;
  border-radius: 0;
  box-shadow: none;
  box-shadow: none;
  color: #424242;
  display: flex;
  flex-direction: row;
  height: 40px;
  justify-content: space-between;
  padding: 3px 16px; }

.nc-secondary-nav .chosen-container-active.chosen-with-drop .chosen-single {
  background-color: rgba(0, 0, 0, 0);
  border: 0;
  border-radius: 0;
  box-shadow: none;
  height: 40px;
  padding: 3px 16px; }

.nc-secondary-nav .chosen-container .chosen-single div {
  height: 18px;
  position: relative !important;
  width: 18px; }

.nc-secondary-nav .chosen-container .chosen-single div b {
  background: url("https://static.netcraft.com/images/ChevronClosed.svg") no-repeat -7px !important;
  border: 0 !important;
  display: block !important; }

.nc-secondary-nav .chosen-container.chosen-with-drop .chosen-single div b {
  background: url("https://static.netcraft.com/images/ChevronOpen.svg") no-repeat -7px !important;
  border: 0 !important;
  display: block !important; }

.nc-secondary-nav .chosen-container .chosen-drop {
  border: 0;
  border-radius: 8px;
  box-shadow: 0 4px 6px 0 rgba(26, 26, 26, 0.1);
  display: inline-flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 6px; }

.nc-secondary-nav .chosen-container .chosen-drop .chosen-search {
  align-items: flex-start;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  padding: 8px 16px; }

.nc-secondary-nav .chosen-container .chosen-drop .chosen-search input {
  background: url("https://static.netcraft.com/images/Search.svg") no-repeat 16px calc(100% / 2) !important;
  background-size: 16px !important;
  border: 0;
  border-radius: 8px;
  font-family: 'Open Sans', 'Netcraft Open Sans', sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  outline: 1px solid #bcbcbc;
  padding: 8px 16px;
  padding: 8px 16px 8px 40px; }

.nc-secondary-nav .chosen-container .chosen-drop .chosen-search input:focus {
  outline: solid 2px #48a9c5; }

.nc-secondary-nav .chosen-container .chosen-drop .chosen-search span {
  align-items: flex-start;
  display: flex;
  height: 16px;
  width: 16px; }

.nc-secondary-nav .chosen-container .chosen-drop .chosen-results li {
  margin: 0;
  padding: 8px 16px; }

.nc-secondary-nav .chosen-container .chosen-drop .chosen-results li:last-child {
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px; }

.nc-secondary-nav .chosen-container .chosen-drop .chosen-results {
  border-radius: 0 0 8px 8px;
  margin-block-end: 0;
  margin-inline-end: 0; }

.nc-secondary-nav .chosen-container-single .chosen-single span {
  margin-right: 0 !important;
  width: 30rem !important; }

.nc-secondary-nav .chosen-container.chosen-with-drop .chosen-drop {
  left: auto !important;
  max-width: 40rem;
  min-width: 30rem; }

.nc-secondary-nav .chosen-container .chosen-results li.result-selected:hover {
  background: #003e51 !important;
  color: white !important; }

.nc-secondary-nav .chosen-container .chosen-results li em {
  background: inherit;
  font-weight: bold; }

/* TODO replace with mask-image */
.nc-secondary-nav .chosen-container-single .chosen-single div b {
  background: url("https://static.netcraft.com/images/ChevronClosed.svg") no-repeat -8px 7px;
  display: block;
  height: 100%;
  width: 100%; }

.nc-chosen-polyfill:not(.nc-chosen-polyfill + .chosen-container) {
  background-color: white;
  border: 0;
  border-radius: 8px;
  font-weight: 700;
  height: 40px;
  margin-right: 20px;
  outline: none;
  padding: 8px 16px;
  width: 15rem; }

/*
 * When adding new colours use HSL if possible, as it helps to ensure different
 * shades of a colour work together, as the hue can remain constant. To name the
 * colours, convert the HSL to a hexcode, and look it up on
 * http://chir.ag/projects/name-that-color to find its unique name.
 * This prevents 'grey', 'darker-grey', 'darkest-grey' etc.
 */
/* Shades of grey */
/* Green shades */
/* Warning/yellow shades */
/* Danger/red shades */
/* Brand/blue shades */
/*
 * New Unified Brand Colours (DESIGN-55)
 * Not hsl as the conversion changes them slightly
 */
/* Brand colours */
/* Extended palette */
/* States */
/*
 * When adding new colours use HSL if possible, as it helps to ensure different
 * shades of a colour work together, as the hue can remain constant. To name the
 * colours, convert the HSL to a hexcode, and look it up on
 * http://chir.ag/projects/name-that-color to find its unique name.
 * This prevents 'grey', 'darker-grey', 'darkest-grey' etc.
 */
/* Shades of grey */
/* Green shades */
/* Warning/yellow shades */
/* Danger/red shades */
/* Brand/blue shades */
/*
 * New Unified Brand Colours (DESIGN-55)
 * Not hsl as the conversion changes them slightly
 */
/* Brand colours */
/* Extended palette */
/* States */
.styled-input-label,
.styled-input,
.styled-input::placeholder {
  font-size: 14px; }

.styled-input {
  background-clip: padding-box;
  background-color: white;
  border: 1px solid #c2c2c2;
  border-radius: 0.25rem;
  box-shadow: #e6e6e6 0 1px 2px;
  color: #474747;
  display: block;
  line-height: 1.5;
  margin-top: 0.5rem;
  padding: 0.375rem 0.75rem;
  width: auto; }
  .styled-input:focus {
    outline: none; }
    .styled-input:focus::placeholder {
      opacity: 66%; }
  .styled-input:read-only {
    background-color: #fafafa;
    color: #787878; }

.input-group > .styled-input {
  flex: 1 1 auto;
  margin-bottom: 0;
  position: relative;
  width: 1%; }
  .input-group > .styled-input:not(:last-child) {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0; }

/* Define any numeric variables here, such
as breakpoints and dimensions */
.nc-nav a {
  color: #424242;
  font-family: 'Open Sans', 'Netcraft Open Sans', sans-serif;
  font-style: normal;
  line-height: 24px;
  /* 171.429% */
  text-decoration: none; }

.nc-nav a:focus,
.nc-nav a:hover {
  text-decoration: none; }

.nc-nav a:focus {
  outline-offset: -2px; }

.nc-dropdown > li > a {
  color: #424242;
  display: block;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  margin-bottom: 4px;
  padding: 8px 16px !important; }

.nc-secondary-nav > div > a,
.nc-secondary-nav > div > div > a,
.nc-nav-text-white,
.nc-dropdown > li > a.nc-active,
#nc-drawer-nav > div > a,
#nc-drawer-nav-toggle {
  border-radius: 8px;
  font-size: 14px;
  font-weight: 700; }

.nc-dropdown > li > a.nc-active {
  border-radius: 0; }

.nc-nav .main-nav-interactable,
.nc-nav .main-nav-interactable {
  background: #002c3a;
  border-radius: 8px;
  cursor: pointer; }
  .nc-nav .main-nav-interactable *,
  .nc-nav .main-nav-interactable * {
    color: white; }
  .nc-nav .main-nav-interactable:hover, .nc-nav .main-nav-interactable:focus,
  .nc-nav .main-nav-interactable:hover,
  .nc-nav .main-nav-interactable:focus {
    background: #e5f1f2; }
  .nc-nav .main-nav-interactable:focus,
  .nc-nav .main-nav-interactable:focus {
    outline: solid 2px #48a9c5; }
  .nc-nav .main-nav-interactable:hover *,
  .nc-nav .main-nav-interactable:focus *,
  .nc-nav .main-nav-interactable:hover *,
  .nc-nav .main-nav-interactable:focus * {
    color: #424242; }

.dropdown.open > .main-nav-interactable.dropdown-toggle:not(:focus):not(:hover), .dropdown.show > .main-nav-interactable.dropdown-toggle:not(:focus):not(:hover) {
  background: #003e51; }

.nc-main-nav {
  align-self: stretch;
  background: #002c3a;
  justify-content: space-between; }

.nc-main-nav {
  padding: 16px 24px;
  z-index: 10; }

.nc-secondary-nav {
  background: #f3f3f3;
  box-shadow: 0 1px 4px 0 rgba(47, 47, 47, 0.25);
  flex-shrink: 0;
  height: 56px;
  justify-content: space-between;
  margin-bottom: 40px;
  padding: 8px 24px;
  width: 100%; }

.nc-secondary-nav > div > a,
.nc-secondary-nav > div > div > a,
#nc-drawer-nav > div > a,
#nc-drawer-nav-toggle {
  align-items: center;
  display: flex;
  gap: 8px;
  padding: 8px 16px; }

.nc-secondary-nav > div > a:hover,
.nc-secondary-nav > div > div > a:hover,
#nc-drawer-nav > a:hover,
#nc-drawer-nav > div > a:hover,
#nc-drawer-nav-toggle:hover,
.nc-secondary-nav > div > .dropdown.open > a,
.nc-secondary-nav > div > .dropdown.show > a {
  background: #e5f1f2; }

.nc-secondary-nav > div > a:focus,
.nc-secondary-nav > div > div > a:focus,
#nc-drawer-nav > a:focus,
#nc-drawer-nav > div > a:focus,
#nc-drawer-nav-toggle:focus {
  background: #e5f1f2;
  outline: solid 2px #48a9c5; }

.nc-secondary-nav > div > a.nc-active,
.nc-secondary-nav > div > div > a.nc-active,
#nc-drawer-nav > a.nc-active,
#nc-drawer-nav > div > a.nc-active {
  background: #003e51 !important;
  color: white !important;
  outline: none; }

.nc-secondary-nav,
.nc-main-nav > div:nth-child(1),
.nc-main-nav > div > div,
.nc-secondary-nav > div,
#nc-service-picker {
  align-items: center;
  display: flex;
  gap: 8px; }

#nc-service-picker + ul.dropdown-menu {
  z-index: 10001; }

.nc-main-nav > div > div.nc-nav-left {
  gap: 24px; }

.nc-nav-center {
  flex: 1 0 0;
  justify-content: space-between; }

.nc-nav-right a {
  align-items: center;
  display: flex;
  gap: 8px;
  padding: 8px 16px; }

:not(.dropdown-submenu) > .nc-dropdown.dropdown-menu {
  margin: 0;
  top: calc(100% + 4px) !important;
  transform: none !important; }

.dropdown-submenu > .nc-dropdown.dropdown-menu {
  top: 4px; }

.nc-search-input {
  background: url("https://static.netcraft.com/images/Search.svg") no-repeat 16px calc(100% / 2) !important;
  background-size: 16px !important;
  border: 0;
  border-radius: 8px;
  font-family: 'Open Sans', 'Netcraft Open Sans', sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  outline: 1px solid #bcbcbc;
  padding: 8px 16px;
  padding: 8px 16px 8px 40px;
  background-color: white !important;
  width: 16rem; }

.nc-search-input:focus {
  outline: solid 2px #48a9c5; }

a.nc-admin-dropdown,
.nc-secondary-nav .nc-nav-right > * {
  background: white;
  border-radius: 8px;
  outline: 1px solid #bcbcbc; }

ul.nc-dropdown {
  background: white;
  border: 0;
  border-radius: 10px;
  /* slightly larger than the radius of the links, to prevent aliasing making the white visible */
  box-shadow: 0 4px 6px 0 rgba(26, 26, 26, 0.1);
  padding: 0; }

/* White on blue */
.nc-nav-text-white,
.nc-dropdown > li > a.nc-active {
  color: white;
  outline: none; }

.nc-dropdown > li > a:hover,
.nc-dropdown > li > a:focus {
  background: #e5f1f2;
  color: #424242; }

.nc-dropdown > li > a:focus {
  outline: solid 2px #48a9c5; }

.nc-dropdown a.nc-active {
  background: #003e51 !important;
  color: white !important; }

.nc-nav-text-white {
  margin: 0; }

ul.nc-dropdown > li:first-child > a {
  border-radius: 8px 8px 0 0; }

ul.nc-dropdown > li:last-child > a {
  border-radius: 0 0 8px 8px;
  margin-bottom: 0; }

.nc-dropdown .dropdown-submenu,
#nc-drawer-nav .dropdown-submenu {
  position: relative; }

.nc-dropdown .dropdown-submenu > .dropdown-menu,
#nc-drawer-nav .dropdown-submenu > .dropdown-menu {
  display: none; }

.nc-dropdown .dropdown-submenu:hover > .dropdown-menu,
#nc-drawer-nav .dropdown-submenu:hover > .dropdown-menu {
  display: block; }

.nc-dropdown .dropdown-submenu > .dropdown-menu,
#nc-drawer-nav .dropdown-submenu > .dropdown-menu {
  border-radius: 8px;
  left: 100%;
  top: 0; }

.nc-dropdown .dropdown-submenu > a,
#nc-drawer-nav .dropdown-submenu > a {
  display: flex;
  gap: 4px; }

.nc-dropdown .dropdown-submenu > a > span,
#nc-drawer-nav .dropdown-submenu > a > span {
  flex: 1; }

.nc-icon,
.nc-dropdown-caret::after {
  content: '';
  display: block;
  height: 24px;
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
  width: 24px; }

.main-nav-interactable:hover .nc-icon,
.main-nav-interactable:focus .nc-icon,
.main-nav-interactable.nc-dropdown-caret:hover::after,
.main-nav-interactable.nc-dropdown-caret:focus::after,
a:hover .nc-icon,
a:focus .nc-icon,
label:hover .nc-icon,
label:focus .nc-icon,
a:hover.nc-dropdown-caret::after,
a:focus.nc-dropdown-caret::after,
a .nc-icon,
label .nc-icon,
a.nc-dropdown-caret::after {
  background: #424242; }

a.nc-dropdown-caret.nc-active::after,
a.nc-active .nc-icon,
.main-nav-interactable .nc-icon,
.main-nav-interactable.nc-dropdown-caret::after {
  background: white; }

.nc-icon-avatar {
  -webkit-mask-image: url("https://static.netcraft.com/images/Avatar.svg");
  mask-image: url("https://static.netcraft.com/images/Avatar.svg"); }

.nc-icon-back {
  -webkit-mask-image: url("https://static.netcraft.com/images/Back.svg");
  mask-image: url("https://static.netcraft.com/images/Back.svg"); }

.nc-icon-chevron-closed,
.nc-dropdown-caret::after {
  -webkit-mask-image: url("https://static.netcraft.com/images/ChevronClosed.svg");
  mask-image: url("https://static.netcraft.com/images/ChevronClosed.svg"); }

.nc-icon-chevron-open {
  -webkit-mask-image: url("https://static.netcraft.com/images/ChevronOpen.svg");
  mask-image: url("https://static.netcraft.com/images/ChevronOpen.svg"); }

.nc-icon-logout {
  -webkit-mask-image: url("https://static.netcraft.com/images/Logout.svg");
  mask-image: url("https://static.netcraft.com/images/Logout.svg"); }

.nc-icon-profile {
  -webkit-mask-image: url("https://static.netcraft.com/images/Profile.svg");
  mask-image: url("https://static.netcraft.com/images/Profile.svg"); }

.nc-icon-menu {
  -webkit-mask-image: url("https://static.netcraft.com/images/Menu.svg");
  mask-image: url("https://static.netcraft.com/images/Menu.svg"); }

.nc-icon-navigation-arrow {
  -webkit-mask-image: url("https://static.netcraft.com/images/NavigationArrow.svg");
  mask-image: url("https://static.netcraft.com/images/NavigationArrow.svg"); }

.nc-icon-open-in-tab {
  -webkit-mask-image: url("https://static.netcraft.com/images/OpenInTab.svg");
  mask-image: url("https://static.netcraft.com/images/OpenInTab.svg"); }

.nc-icon-search {
  -webkit-mask-image: url("https://static.netcraft.com/images/Search.svg");
  mask-image: url("https://static.netcraft.com/images/Search.svg"); }

.nc-icon-services-menu {
  -webkit-mask-image: url("https://static.netcraft.com/images/ServicesMenu.svg");
  mask-image: url("https://static.netcraft.com/images/ServicesMenu.svg"); }

.nc-icon-settings {
  -webkit-mask-image: url("https://static.netcraft.com/images/Settings.svg");
  mask-image: url("https://static.netcraft.com/images/Settings.svg"); }

.nc-icon-tick {
  -webkit-mask-image: url("https://static.netcraft.com/images/Tick.svg");
  mask-image: url("https://static.netcraft.com/images/Tick.svg"); }

.nc-icon-user-preferences {
  -webkit-mask-image: url("https://static.netcraft.com/images/UserPreferences.svg");
  mask-image: url("https://static.netcraft.com/images/UserPreferences.svg"); }

.nc-nav a.nc-logo {
  font-size: 0; }

.nc-logo > img {
  height: 24px;
  width: 146px; }

#nc-service-picker {
  padding: 8px; }

/* Move the service name down slightly to match the offset in the Netcraft logo */
#nc-service-name,
.nc-service-name-mobile {
  color: white;
  cursor: pointer;
  font-size: 16px;
  font-weight: 700;
  position: relative; }

#nc-service-name {
  position: relative;
  top: 2px; }

.nc-service-name-mobile {
  display: none;
  margin-top: 8px; }

.nc-dropdown > * {
  padding: 0; }

.nc-dropdown.show {
  min-width: 160px; }

.nc-align-right {
  left: unset !important;
  right: 0 !important; }

.dropdown.open > .nc-dropdown-caret.vertical::after,
.dropdown.show > .nc-dropdown-caret.vertical::after,
.dropdown-submenu:hover > .nc-dropdown-caret.vertical::after {
  rotate: 180deg; }

.dropdown > .nc-dropdown-caret.horizontal::after,
.dropdown-submenu > .nc-dropdown-caret.horizontal::after {
  rotate: 270deg; }

.dropdown-toggle,
#nc-drawer-nav-toggle {
  cursor: pointer; }

#nc-service-picker.dropdown-toggle::after {
  display: none; }

#nc-account-menu + ul.dropdown-menu {
  width: 100%; }

/* Collapsed drawer nav-bar */
.nc-nav-left {
  position: relative; }

#nc-drawer-nav-trigger {
  position: absolute;
  visibility: hidden;
  width: 0; }

#nc-drawer-nav-toggle {
  display: none;
  margin: 0; }

#nc-drawer-nav {
  background: #f3f3f3;
  border-bottom-right-radius: 10px;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.25);
  display: none;
  flex-direction: column;
  gap: 8px;
  height: calc(100vh - 128px);
  left: -500px;
  padding: 24px 16px;
  position: absolute;
  top: 50px;
  transition-duration: 0.4s;
  transition-property: all;
  transition-timing-function: cubic-bezier(1, 0, 0.25, 1);
  white-space: nowrap;
  width: 250px;
  z-index: 10000; }

#nc-drawer-nav-trigger:checked ~ #nc-drawer-nav {
  left: -24px; }

/* Narrow Desktop */
@media (max-width: 1660px) {
  .nc-secondary-nav > div > a,
  .nc-secondary-nav > div > div > a,
  #nc-drawer-nav > div > a,
  #nc-drawer-nav-toggle {
    gap: 0;
    padding: 8px 16px; }
  #attack_id_search {
    width: 90px; }
  .nc-secondary-nav .chosen-container-single .chosen-single span,
  .nc-secondary-nav .chosen-container {
    width: 15rem !important; } }

/* Tablet */
@media (max-width: 1230px) {
  #nc-account-menu > div.nc-icon:nth-of-type(2) {
    display: none; }
  .nc-secondary-nav .nc-nav-left > * {
    display: none; }
  #nc-drawer-nav,
  #nc-drawer-nav-toggle {
    display: flex; } }

/* Mobile */
@media (max-width: 730px) {
  .nc-service-name-mobile {
    display: block; }
  #nc-service-name {
    display: none; }
  .nc-main-nav {
    padding: 8px 16px; }
  .nc-secondary-nav {
    padding: 8px 16px; }
  #nc-account-menu > h1 {
    display: none; }
  #nc-drawer-nav {
    height: calc(100vh - 144px); } }