@charset "UTF-8";
/************************/
/****** TYPOGRAPHY *******/
/************************/
@import url("https://fonts.cdnfonts.com/css/sansation?styles=169708,756,169707,755,169709,169710,754");
/* Sansation Normal 300 (latin-ext) */
@font-face {
  font-family: "Sansation";
  font-style: normal;
  font-weight: var(--fontWeightLight);
  font-display: swap;
  /* Local path for self-hosting */
  src: url("/sansation-300-latext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Sansation Normal 300 (latin) */
@font-face {
  font-family: "Sansation";
  font-style: normal;
  font-weight: var(--fontWeightLight);
  font-display: swap;
  /* Local path for self-hosting */
  src: url("/sansation-300-latin.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+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Sansation Normal 400 (latin-ext) */
@font-face {
  font-family: "Sansation";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  /* Local path for self-hosting */
  src: url("/sansation-400-latext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Sansation Normal 400 (latin) */
@font-face {
  font-family: "Sansation";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  /* Local path for self-hosting */
  src: url("/sansation-400-latin.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+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Sansation Normal 700 (latin-ext) */
@font-face {
  font-family: "Sansation";
  font-style: normal;
  font-weight: var(--fontWeightBold);
  font-display: swap;
  /* Local path for self-hosting */
  src: url("/sansation-700-latext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Sansation Normal 700 (latin) */
@font-face {
  font-family: "Sansation";
  font-style: normal;
  font-weight: var(--fontWeightBold);
  font-display: swap;
  /* Local path for self-hosting */
  src: url("/sansation-700-latin.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+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/************************/
/****** COLOURS *******/
/************************/
/********************/
/**** Fallback ******/
/**** To Do: To be removed once all inline styles are moved to sass ******/
/********************/
:root {
  --fontPrimary: Arial, sans-serif;
  --fontSecondary: Sansation, Arial, sans-serif;
  --fontRoboto: Arial, sans-serif;
  --fontQuickSand: Sansation, Arial, sans-serif;
  --colorTextPrimary: #292929;
  --colorPrimary100: #E6EDF8;
  --colorSecondary100: #E6F4F3;
  --bg-surface: #ffffff;
  --colorDark: #292929;
  --colorCoralSecondary: #E6EDF8;
  --colorNavyBluePrimary: #E6F4F3;
  --colorDisabled: #929292;
  --colorPrimary: #008576;
  --colorPrimaryHover: #00675c;
  --colorPrimaryActive: #005a50;
  --colorSecondary: #003784;
  --colorSecondaryHover: #003073;
  --colorSecondaryActive: #00204d;
  --colorHelpSearchHelpText: #505a5f;
  --colorHelpSearchHeading: #292929;
  --colorError: #c13515;
  --colorLight: #fafafa;
  --colorFocus: #009c9c;
  --colorDefaultLink: #1d70b8;
  --colorHoverLink: #003078;
  --colorSmCardHeading: #292929;
  --colorWhite: #fff;
  --colorHeroBtnText: #fdfdfd;
  --colorPrimary100: #e6edf8;
  --colorNavyBluePrimary: #e6edf8;
  --colorInputDefault: #b7b7b7;
  --colorInputPlaceholder: #767676;
  --colorInputFocus: #969696;
  --colorBlack: #000;
  --colorTextSecondary: #505a5f;
  --colorStatusError: #e5ac9f;
  --colorAccordianBorder: #cc4041;
  --colorLinkHover: #f3f2f1;
  --colorBorder: #e7e7e7;
  --colorButtonDisabled: #757575;
  --colorActive: #cce2d8;
  --colorActiveText: #005a30;
  --colorDeferred: #f4cdc6;
  --colorDeferredText: #2a0b06;
  --colorPartially: #e8f1f8;
  --colorPartiallyText: #0c2d4a;
  --colorPensioner: #efdfed;
  --colorPensionerText: #491644;
  --colorPartitionBorder: #d7d7d7;
  --colorBorderLightBlue: #d9e3f5;
  --colorWarningStatus: #f8eaa0;
  --colorBadge: #bbd4ea;
  --colorBadgeText: #0c2d4a;
  --font14: 0.875rem;
  --font16: 1rem;
  --font18: 1.125rem;
  --font19: 1.188rem;
  --font21: 1.313rem;
  --font22: 1.375rem;
  --font24: 1.5rem;
  --font27: 1.688rem;
  --font32: 2rem;
  --font36: 2.25rem;
  --font42: 2.625rem;
  --font48: 3rem;
  --font80: 5rem;
  --fontWeightLight: 300;
  --fontWeightRegular: 400;
  --fontWeightMedium: 500;
  --fontWeightSemiBold: 600;
  --fontWeightBold: 700;
  --fontWeightBlack: 900;
}

.govuk-heading-xl {
  color: var(--colorTextPrimary);
}

.govuk-heading-l {
  color: var(--colorTextPrimary);
}

.govuk-heading-m {
  color: var(--colorTextPrimary);
}

.govuk-heading-s {
  color: var(--colorTextPrimary);
}

.govuk-caption-xl {
  color: var(--colorTextSecondary);
}

.govuk-caption-l {
  color: var(--colorTextSecondary);
}

.govuk-caption-m {
  color: var(--colorTextSecondary);
}

.govuk-body-large {
  color: var(--colorTextPrimary);
}

.govuk-body {
  color: var(--colorTextPrimary);
}

.govuk-body-small {
  color: var(--colorTextPrimary);
}

.govuk-link {
  color: var(--colorDefaultLink);
}

.govuk-link-small {
  color: var(--colorDefaultLink);
}

.annual-benefit-statement .statement-list .statement-item {
  border-left: 6px solid var(--colorAccordianBorder);
}

.help-link a {
  color: var(--colorDefaultLink);
}

/********Knowledge Articles start**********/
.articles-page .page-heading .breadcrumb .breadcrumb-item,
.articles-page .page-heading .breadcrumb .breadcrumb-item a {
  color: var(--colorTextPrimary);
}

.articles-page #mainContent h1 {
  color: var(--colorTextPrimary);
}

#RelatedArticles {
  border: none;
  background-color: transparent;
}

#RelatedArticles > .card-header {
  background-color: transparent;
}

#RelatedArticles > .card-header > h4 {
  color: var(--colorTextPrimary);
}

#RelatedArticles .list-group {
  background-color: transparent;
}

#RelatedArticles .list-group .list-group-item {
  background-color: transparent;
  border: none;
  border-bottom: 1px solid var(--colorBorderLightBlue);
  color: var(--colorDefaultLink);
}

.feedback-vote {
  background-color: var(--colorSecondary100);
  border: 1px solid var(--colorBorderLightBlue);
}

.feedback-vote .govuk-button-group .govuk-link {
  border: none;
  color: var(--colorTextPrimary);
  background-color: transparent;
}

.feedback-vote .govuk-button-group .govuk-link:focus {
  box-shadow: none;
  background-color: transparent;
}

.need-more-help-section h2 {
  color: var(--colorTextPrimary);
}

.need-more-help-section .tabs-container .nav {
  border-bottom: 1px solid var(--colorInputDefault);
}

.need-more-help-section .tabs-container .nav .nav-item .nav-link {
  color: var(--colorTextPrimary);
  background-color: #f9f9f9;
  border-color: var(--colorInputDefault);
  border-bottom: none;
}

.need-more-help-section .tabs-container .nav .nav-item .nav-link.active {
  background-color: var(--colorLinkHover);
  box-shadow: inset 0px -4px 0px #000000;
}

.topic-subtopic-selection .selection-div {
  border-bottom: 1px solid var(--colorBorderLightBlue);
}

.topic-subtopic-selection .selection-div:last-child {
  border-bottom: none;
}

/********Knowledge Articles end**********/
.com-btn-white {
  border: 2px solid #2d325d;
  border-radius: 8px;
  cursor: pointer;
}

.com-cancel.com-btn-white {
  border-color: unset;
  background-color: unset;
}

.com-icon {
  background-repeat: no-repeat;
}

.com-btn-upload {
  background-image: url(/fileUpload.svg);
}

.com-btn-remove {
  background-image: url(/CrossIcon.svg);
}

.upload-label {
  cursor: pointer;
}

.file-info {
  color: #464646;
}

#exitButton {
  border: 3px solid var(--colorPrimary);
}

@media (min-width: 767px) {
  .com-cancel.com-btn-white {
    border-color: unset;
    background-color: unset;
  }
}
/************************************* Banner CSS ****************************************/
.member-hub .banner-content-box .common-button {
  background-color: var(--colorSecondary);
  color: var(--colorHeroBtnText);
}

.employer-hub .banner-content-box .common-button {
  background-color: var(--colorPrimary);
  color: var(--colorHeroBtnText);
}

.member-hub .banner-content-box .common-button:hover {
  background-color: var(--colorSecondaryHover);
}

.employer-hub .banner-content-box .common-button:hover {
  background-color: var(--colorPrimaryHover);
}

.member-hub .banner-content-box .common-button:active {
  background-color: var(--colorSecondaryActive);
}

.employer-hub .banner-content-box .common-button:active {
  background-color: var(--colorPrimaryActive);
}

.member-hub .banner-content-box .common-button:focus:not(:active):not(:hover) {
  background-color: var(--colorSecondary);
}

.employer-hub .banner-content-box .common-button:focus:not(:active):not(:hover) {
  background-color: var(--colorPrimary);
}

.banner-content-box {
  background-color: rgba(255, 255, 255, 0.9);
}

.banner-content-box h2 {
  color: var(--colorTextPrimary);
}

.banner-content-box p {
  color: var(--colorTextPrimary);
}

.notification-banner-section-wrapper .govuk-body a.govuk-notification-banner__link:focus {
  background-color: var(--colorStatusSuccess);
}

/********** button colour *************/
.primary-button {
  background: var(--colorPrimary);
  color: var(--colorWhite);
}

.primary-button:hover {
  background: var(--colorPrimaryHover);
  color: var(--colorWhite);
}

.common-button {
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightMedium);
}

/************************************* Card Section CSS ****************************************/
/* four column section styling starts here */
.four-column-section .govuk-grid-column-one-quarter .four-clmn-cnt-sec:hover a.entire-card {
  box-shadow: 0 12px 20px rgba(45, 50, 93, 0.06), 0px 20px 42.6358px rgba(0, 0, 0, 0.04);
}

.four-column-section .govuk-grid-column-one-quarter .four-clmn-cnt-sec a.entire-card {
  background: var(--colorWhite);
  box-shadow: 0 7px 5.32948px rgba(53, 29, 19, 0.05), 0px 16px 42.6358px rgba(0, 0, 0, 0.04);
}

.four-column-section .govuk-grid-column-one-quarter .four-clmn-cnt-sec h5 {
  color: var(--colorTextPrimary);
}

.four-column-section .govuk-grid-column-one-quarter .four-clmn-cnt-sec .entire-card-links,
.multistep-process .entire-card-links {
  color: var(--colorDefaultLink);
}

/* Card section styling starts here */
.card-section h2 {
  color: var(--colorTextPrimary);
}

.card-section .govuk-grid-column-one-third .three-column-area:hover a.over-area {
  box-shadow: 0 12px 20px rgba(45, 50, 93, 0.06), 0px 20px 42.6358px rgba(0, 0, 0, 0.04);
}

.card-section .govuk-grid-column-one-third .three-column-area a.over-area {
  background-color: var(--colorWhite);
  box-shadow: 0 7px 5.32948px rgba(53, 29, 19, 0.05), 0px 16px 42.6358px rgba(0, 0, 0, 0.04);
}

.card-section .govuk-grid-column-one-third .three-column-area .content-area h4 {
  color: var(--colorSmCardHeading);
}

.card-section .govuk-grid-column-one-third .three-column-area .content-area p {
  color: var(--colorTextSecondary);
}

.card-section .govuk-grid-column-one-third .three-column-area .content-area span {
  color: var(--colorDefaultLink);
}

/* employer page styling starts here */
.employer-hub .card-section .govuk-grid-column-one-third .three-column-area .content-area h4 {
  color: var(--colorPrimary);
}

/********Contact Us - Complaints Form start**********/
.multistep-process .checked-radio-field {
  border-left: 4px solid var(--colorInputDefault);
}

.multistep-process.complaint-step7 .control textarea {
  border: 1px solid var(--colorInputDefault);
  color: var(--colorTextPrimary);
  background-color: var(--colorWhite) !important;
}

.multistep-process.complaint-step7 .control textarea:focus {
  border-color: var(--colorTextPrimary) !important;
  box-shadow: 0px 0px 0px 2px var(--colorInputFocus) !important;
  outline: 0 !important;
}

.multistep-process.complaint-step7 fieldset .govuk-form-group--error textarea.form-control:focus {
  box-shadow: none !important;
}

.multistep-process.complaint-step7 fieldset .govuk-error-message + textarea.form-control {
  border: 1px solid var(--colorError) !important;
}

.multistep-process.complaint-step7 .description p {
  color: var(--colorInputPlaceholder);
}

/********Contact Us - Complaints Form end**********/
.amendcontact-final-page.multistep-process .confirm-container h1,
.amendcontact-final-page.multistep-process .confirm-container p {
  color: var(--colorWhite);
}

/**********Contact Us - Help & Support start***********/
.collapsible-item {
  border-bottom: 1px solid #b1b4b6;
}

.collapsible-set .collapsible-item:first-of-type {
  border-top: 1px solid #b1b4b6;
}

.collapsible-content {
  color: var(--colorTextPrimary);
}

.collapsible-item .collapsible-heading .collapsible-btn {
  color: var(--colorTextPrimary);
  border: none;
  background-color: transparent;
}

.collapsible-item .collapsible-heading .collapsible-btn .collapsibleShowHide {
  color: var(--colorDefaultLink);
  background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.08 7.59L10 10.67L6.92 7.59L5.5 9L10 13.5L14.5 9L13.08 7.59ZM10 0C4.48 0 0 4.48 0 10C0 15.52 4.48 20 10 20C15.52 20 20 15.52 20 10C20 4.48 15.52 0 10 0ZM10 18C5.58 18 2 14.42 2 10C2 5.58 5.58 2 10 2C14.42 2 18 5.58 18 10C18 14.42 14.42 18 10 18Z" fill="%23464646"/></svg>');
}

.collapsible-item .collapsible-heading .collapsible-btn:hover {
  background-color: #f3f2f1;
}

.collapsible-item .collapsible-heading .collapsible-btn:hover .collapsibleShowHide {
  color: var(--colorTextPrimary);
  background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_8132_18705)"><path d="M10 0C4.48 0 0 4.48 0 10C0 15.52 4.48 20 10 20C15.52 20 20 15.52 20 10C20 4.48 15.52 0 10 0ZM10 13.5L5.5 9L6.92 7.59L10 10.67L13.08 7.59L14.5 9L10 13.5Z" fill="%23464646"/></g><defs><clipPath id="clip0_8132_18705"><rect width="20" height="20" fill="white"/></clipPath></defs></svg>');
}

.collapsible-item .collapsible-heading .collapsible-btn .collapsibleShowHide:after {
  background-color: transparent;
}

.collapsible-item .collapsible-heading .collapsible-btn:focus {
  background-color: transparent;
}

.collapsible-item .collapsible-heading .collapsible-btn:hover:focus {
  background-color: #f3f2f1;
}

.collapsible-item .collapsible-heading .collapsible-btn:focus .collapsibleShowHide {
  color: var(--colorTextPrimary);
  background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_8132_18705)"><path d="M10 0C4.48 0 0 4.48 0 10C0 15.52 4.48 20 10 20C15.52 20 20 15.52 20 10C20 4.48 15.52 0 10 0ZM10 13.5L5.5 9L6.92 7.59L10 10.67L13.08 7.59L14.5 9L10 13.5Z" fill="%23464646"/></g><defs><clipPath id="clip0_8132_18705"><rect width="20" height="20" fill="white"/></clipPath></defs></svg>');
}

.collapsible-item .collapsible-heading .collapsible-btn:focus .collapsibleShowHide:after {
  background-color: var(--colorTextPrimary);
}

.collapsible-item.collapsible-active .collapsible-heading .collapsible-btn .collapsibleShowHide {
  background-image: url('data:image/svg+xml,<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_16431_2732)"><path d="M6.92 12.91L10 9.83L13.08 12.91L14.5 11.5L10 7L5.5 11.5L6.92 12.91ZM10 20.5C15.52 20.5 20 16.02 20 10.5C20 4.98 15.52 .5 10 .499999C4.48 .499999 1.3568e-06 4.98 8.74228e-07 10.5C3.91654e-07 16.02 4.48 20.5 10 20.5ZM10 2.5C14.42 2.5 18 6.08 18 10.5C18 14.92 14.42 18.5 10 18.5C5.58 18.5 2 14.92 2 10.5C2 6.08 5.58 2.5 10 2.5Z" fill="%23464646"/></g><defs><clipPath id="clip0_16431_2732"><rect width="20" height="20" fill="white" transform="translate(0 .5)"/></clipPath></defs></svg>');
}

.collapsible-item.collapsible-active .collapsible-heading .collapsible-btn:hover .collapsibleShowHide {
  background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10 20C15.52 20 20 15.52 20 10C20 4.48 15.52 -3.91654e-07 10 -8.74228e-07C4.48 -1.3568e-06 1.3568e-06 4.48 8.74228e-07 10C3.91654e-07 15.52 4.48 20 10 20ZM10 6.5L14.5 11L13.08 12.41L10 9.33L6.92 12.41L5.5 11L10 6.5Z" fill="%23464646"/></svg>');
}

.collapsible-item.collapsible-active .collapsible-heading .collapsible-btn:focus .collapsibleShowHide {
  background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10 20C15.52 20 20 15.52 20 10C20 4.48 15.52 -3.91654e-07 10 -8.74228e-07C4.48 -1.3568e-06 1.3568e-06 4.48 8.74228e-07 10C3.91654e-07 15.52 4.48 20 10 20ZM10 6.5L14.5 11L13.08 12.41L10 9.33L6.92 12.41L5.5 11L10 6.5Z" fill="%23464646"/></svg>');
}

.collapsible-set .collapsible-btn-all {
  color: var(--colorDefaultLink);
  border: none;
  background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.08 7.59L10 10.67L6.92 7.59L5.5 9L10 13.5L14.5 9L13.08 7.59ZM10 0C4.48 0 0 4.48 0 10C0 15.52 4.48 20 10 20C15.52 20 20 15.52 20 10C20 4.48 15.52 0 10 0ZM10 18C5.58 18 2 14.42 2 10C2 5.58 5.58 2 10 2C14.42 2 18 5.58 18 10C18 14.42 14.42 18 10 18Z" fill="%23464646"/></svg>');
  background-color: transparent;
}

.collapsible-set .collapsible-btn-all:hover {
  background-color: #f3f2f1;
  background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_8132_18705)"><path d="M10 0C4.48 0 0 4.48 0 10C0 15.52 4.48 20 10 20C15.52 20 20 15.52 20 10C20 4.48 15.52 0 10 0ZM10 13.5L5.5 9L6.92 7.59L10 10.67L13.08 7.59L14.5 9L10 13.5Z" fill="%23464646"/></g><defs><clipPath id="clip0_8132_18705"><rect width="20" height="20" fill="white"/></clipPath></defs></svg>');
}

.collapsible-set .collapsible-btn-all:focus {
  background-color: transparent;
  background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_8132_18705)"><path d="M10 0C4.48 0 0 4.48 0 10C0 15.52 4.48 20 10 20C15.52 20 20 15.52 20 10C20 4.48 15.52 0 10 0ZM10 13.5L5.5 9L6.92 7.59L10 10.67L13.08 7.59L14.5 9L10 13.5Z" fill="%23464646"/></g><defs><clipPath id="clip0_8132_18705"><rect width="20" height="20" fill="white"/></clipPath></defs></svg>');
}

.collapsible-set .collapsible-btn-all.collapsible-active-all {
  background-image: url('data:image/svg+xml,<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_16431_2732)"><path d="M6.92 12.91L10 9.83L13.08 12.91L14.5 11.5L10 7L5.5 11.5L6.92 12.91ZM10 20.5C15.52 20.5 20 16.02 20 10.5C20 4.98 15.52 .5 10 .499999C4.48 .499999 1.3568e-06 4.98 8.74228e-07 10.5C3.91654e-07 16.02 4.48 20.5 10 20.5ZM10 2.5C14.42 2.5 18 6.08 18 10.5C18 14.92 14.42 18.5 10 18.5C5.58 18.5 2 14.92 2 10.5C2 6.08 5.58 2.5 10 2.5Z" fill="%23464646"/></g><defs><clipPath id="clip0_16431_2732"><rect width="20" height="20" fill="white" transform="translate(0 .5)"/></clipPath></defs></svg>');
}

.collapsible-set .collapsible-btn-all.collapsible-active-all:hover {
  background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10 20C15.52 20 20 15.52 20 10C20 4.48 15.52 -3.91654e-07 10 -8.74228e-07C4.48 -1.3568e-06 1.3568e-06 4.48 8.74228e-07 10C3.91654e-07 15.52 4.48 20 10 20ZM10 6.5L14.5 11L13.08 12.41L10 9.33L6.92 12.41L5.5 11L10 6.5Z" fill="%23464646"/></svg>');
}

.collapsible-set .collapsible-btn-all.collapsible-active-all:focus {
  background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10 20C15.52 20 20 15.52 20 10C20 4.48 15.52 -3.91654e-07 10 -8.74228e-07C4.48 -1.3568e-06 1.3568e-06 4.48 8.74228e-07 10C3.91654e-07 15.52 4.48 20 10 20ZM10 6.5L14.5 11L13.08 12.41L10 9.33L6.92 12.41L5.5 11L10 6.5Z" fill="%23464646"/></svg>');
}

.signin-notification-banner {
  background-color: var(--colorSecondary100);
}

.signin-notification-banner h3 {
  color: var(--colorTextPrimary);
}

.signin-notification-banner a {
  color: inherit;
}

.contact-cards-section {
  background-color: var(--colorBorder);
}

.contact-cards-section h2 {
  color: var(--colorPrimary);
}

.faqs-section h3 {
  color: var(--colorTextPrimary);
}

/*********************************
  Mixins
  *******************************/
/*
  Usage:
    @include mq(md) { ... }            // min-width: md
    @include mq(md, down) { ... }     // max-width: md - 1px
    @include mq((sm, lg)) { ... }     // between sm and lg (pass a list)
    @include mq('(orientation: portrait)') { ... } // raw media query
*/
/******** Cookie start ********/
.cookie-buttons button {
  background-color: var(--colorPrimary);
}

.cookie-buttons button:focus,
.cookie-buttons button:hover,
.cookie-buttons .govuk-button:active,
.cookie-buttons .govuk-button:visited {
  background-color: var(--colorPrimaryHover);
}

.cookie-buttons button:focus,
.cookie-buttons button:hover,
.cookie-buttons .govuk-button:active,
.cookie-buttons .govuk-button:visited {
  border-color: transparent;
}

/******** Cookie end ********/
.govuk-table {
  background-color: var(--bgSurface);
}

.govuk-table .govuk-table__header {
  color: var(--colorTextPrimary);
}

.govuk-table .govuk-table__cell {
  color: var(--colorTextSecondary);
}

.govuk-table--simple .govuk-table__head .govuk-table__row::after,
.govuk-table--simple .govuk-table__body .govuk-table__row::after {
  background-color: var(--colorSecondary100);
}

.govuk-table--grouped .govuk-table__head .govuk-table__row::after {
  background-color: var(--colorSecondary100);
}

.govuk-table--grouped .govuk-table__body .govuk-table__cell,
.govuk-table--grouped .govuk-table__body .govuk-table__header {
  border-bottom: 1px solid var(--colorSecondary100);
  border-right: 1px solid var(--colorSecondary100);
}

a.govuk-link[href="#top"]::before {
  border-bottom: 0;
}

a.govuk-link[href="#top"]::after {
  color: var(--colorDefaultLink);
  -webkit-text-stroke: 0.5px currentColor;
}

@media (max-width: 575px) {
  .govuk-table--grouped .govuk-table__body .govuk-table__row {
    border: 1px solid var(--colorSecondary100);
  }
  .govuk-table--grouped .govuk-table__body .govuk-table__cell:first-child,
  .govuk-table--grouped .govuk-table__body .govuk-table__header:first-child {
    background: #f8f8f8;
  }
}
/********* create-portal-message STARTS *************/
.create-portal-message #Subgrid_Document .alert-warning {
  background: #f8eaa0;
}

.create-portal-message #Subgrid_Document tbody tr {
  border-color: var(--colorWhite);
}

.create-portal-message #Subgrid_Document tbody tr .file-rw {
  background: none;
  color: #1d70b8 !important;
}

.create-portal-message .create-message-form-wrap {
  background: var(--colorWhite);
}

.create-portal-message .create-message-form-wrap #WebFormPanel {
  background: var(--colorWhite);
}

.create-portal-message .create-message-form-wrap #com_body {
  background: var(--colorWhite) !important;
}

.create-portal-message .create-message-form-wrap #com_previousmessage {
  background: var(--colorWhite) !important;
}

.create-portal-message .create-message-form-wrap #com_previousmessage_label {
  color: var(--colorTextSecondary);
}

.create-portal-message .create-message-form-wrap .prev_msg {
  color: var(--colorTextSecondary);
}

.create-portal-message .create-message-form-wrap .bottom_line {
  border-bottom: 1px solid var(--colorSecondary100);
}

.file-modal #EntityFormPanel {
  background: var(--colorWhite);
}

.file-wrapper .modal-body {
  background: var(--colorWhite);
}

/********File Upload Employer start********/
.sidebar-container h3 {
  color: var(--colorTextPrimary);
}

.sidebar-nav li a {
  color: var(--colorDefaultLink);
}

.sidebar-nav li a.active {
  box-shadow: inset 4px 0px 0px #2d325d;
}

.custom-fileUpload-btn {
  border: 2px solid var(--colorPrimary);
  color: var(--colorPrimary);
}

.custom-fileUpload-btn[disabled],
.custom-fileUpload-btn:disabled {
  background-color: transparent;
  border: 2px solid var(--colorButtonDisabled);
  color: var(--colorButtonDisabled);
}

.custom-fileUpload-btn[disabled] + .noFileChosen,
.custom-fileUpload-btn:disabled + .noFileChosen {
  color: var(--colorTextPrimary);
}

.file-upload-employer #InsertButton {
  background-image: url(/tickWhite.svg);
}

.cancel-upload-btn {
  border: none;
  background-color: transparent;
  color: var(--colorPrimary);
}

.file-upload-employer .govuk-error-message p {
  color: var(--colorError);
}

.file-upload-employer .file-upload-success {
  background-color: var(--colorStatusSuccess);
}

.file-upload-employer .file-upload-success h3 {
  color: var(--colorTextPrimary);
}

.upload-success {
  background-color: var(--colorStatusSuccess);
}

.upload-success h3 {
  color: var(--colorTextPrimary);
}

/********File Upload Employer end********/
/************Employer Login**************/
.employer-hub.multistep-process #next {
  background-color: var(--colorPrimary);
}

/************Employer Registration**************/
.employer-hub .multistep-process .btn-primary.submit-btn,
.multistep-process.employer-hub .btn-primary.submit-btn {
  background-color: var(--colorPrimary);
}

.employer-hub .multistep-process .btn-primary.submit-btn:active,
.multistep-process.employer-hub .btn-primary.submit-btn:active {
  background-color: var(--colorPrimaryActive);
}

.employer-hub .multistep-process .btn-primary.submit-btn:hover {
  background-color: var(--colorPrimaryHover);
}

.employer-hub .multistep-process .entity-action-button .btn-secondary.submit-btn,
.multistep-process.employer-hub .btn-secondary.submit-btn {
  background-color: transparent;
}

.govuk-footer {
  background: var(--colorTextPrimary);
}

.govuk-footer .govuk-heading-m {
  color: var(--colorWhite);
  border-bottom: 1px solid var(--colorInputDefault);
}

.govuk-footer .govuk-footer__link {
  color: var(--colorWhite);
}

.govuk-footer .govuk-footer__link:focus {
  color: var(--colorWhite);
}

.govuk-footer .govuk-footer__section-break {
  border-bottom: 1px solid var(--colorInputDefault);
}

.govuk-footer .govuk-footer__inline-list-item {
  color: var(--colorWhite);
}

/**---Impact changes search---**/
.form-search input[type=text] {
  background-color: var(--colorWhite);
  color: var(--colorInputPlaceholder);
}

.form-search .deleteicon span.cross-icon-input {
  background-color: transparent;
  background-image: url('data:image/svg+xml,<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M25.3346 8.54675L23.4546 6.66675L16.0013 14.1201L8.54797 6.66675L6.66797 8.54675L14.1213 16.0001L6.66797 23.4534L8.54797 25.3334L16.0013 17.8801L23.4546 25.3334L25.3346 23.4534L17.8813 16.0001L25.3346 8.54675Z" fill="%23969696"/></svg>');
}

.form-search input[type=text]:focus,
.form-search input[type=text]:focus-visible {
  box-shadow: inset 0 0 0 2px var(--colorInputFocus);
}

.form-search .input-group-btn .btn {
  background-color: var(--colorSecondary);
}

.form-search .input-group-btn .btn:hover,
.form-search .input-group-btn .btn:active {
  background-color: var(--colorSecondaryHover) !important;
  color: inherit !important;
}

.form-search .input-group-btn .btn[type=submit]:disabled,
.form-search .input-group-btn .btn[disabled] {
  background-color: var(--colorDisabled);
}

.form-search .input-group-btn .btn .fa-search {
  color: var(--colorWhite);
}

.form-search .input-group-btn .btn#search-filter {
  color: var(--colorWhite);
}

.employer-hub .form-search .input-group-btn .btn {
  background-color: var(--colorPrimary);
}

.employer-hub .form-search .input-group-btn .btn:hover,
.employer-hub .form-search .input-group-btn .btn:active {
  background-color: var(--colorPrimaryHover) !important;
}

.govuk-warning-banner__content {
  background-color: #f8eaa0;
}

/* ************************************ Header CSS *************************************** */
header.govuk-header {
  background-color: var(--colorSecondary);
}

header .govuk-header__container {
  border-color: var(--colorPrimary);
}

header > .govuk-header__container:after,
.employer-login header > .govuk-header__container:after {
  background-color: var(--colorPrimary);
}

header .search-dropdown .govuk-header__container:after {
  background-color: var(--colorPrimary);
}

header .govuk-header__link--homepage:focus {
  color: inherit;
  background-color: transparent;
}

header .govuk-header__navigation .govuk-header__link {
  color: var(--colorWhite);
}

header .govuk-header__navigation-item .govuk-header__link::after {
  background-color: transparent;
}

header .govuk-header__navigation-item .govuk-header__link:hover::after {
  background-color: var(--colorWhite);
}

header .govuk-header__navigation .login-menu .govuk-header__link {
  border-left: 1px solid var(--colorBorder);
  border-right: 1px solid var(--colorBorder);
}

header .govuk-header__link:focus {
  background-color: transparent;
}

header .govuk-header__navigation-item--active a:hover,
header .govuk-header__navigation-item--active a:link,
header .govuk-header__navigation-item--active a:visited {
  color: var(--colorWhite);
}

header .govuk-header__navigation-item--active:not(.search-menu) .govuk-header__link::after {
  background-color: var(--colorPrimary);
}

.employer-hub header .govuk-header__navigation-item--active:not(.search-menu) .govuk-header__link::after {
  background-color: var(--colorSecondary);
}

header .govuk-header__navigation-item--active:not(.search-menu) .govuk-header__link:hover::after,
header .govuk-header__navigation-item--active:not(.search-menu) .govuk-header__link:link::after,
header .govuk-header__navigation-item--active:not(.search-menu) .govuk-header__link:visited::after {
  background-color: var(--colorPrimary);
}

.employer-hub header .govuk-header__navigation-item--active:not(.search-menu) .govuk-header__link:hover::after,
.employer-hub header .govuk-header__navigation-item--active:not(.search-menu) .govuk-header__link:link::after,
.employer-hub header .govuk-header__navigation-item--active:not(.search-menu) .govuk-header__link:visited::after {
  background-color: var(--colorSecondary);
}

#headerMenuToggle {
  background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12 8L6 14L7.41 15.41L12 10.83L16.59 15.41L18 14L12 8Z" fill="%232D325D"/></svg>');
  background-color: var(--colorWhite);
  color: var(--colorPrimary);
}

#headerMenuToggle.menuClosed {
  background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M16.59 8.59003L12 13.17L7.41 8.59003L6 10L12 16L18 10L16.59 8.59003Z" fill="%23F5F5F5"/></svg>');
  background-color: transparent;
  color: var(--colorWhite);
}

header #headerMenuToggle:not(.menuClosed)::after {
  background-color: var(--colorPrimary);
}

.employer-hub header #headerMenuToggle:not(.menuClosed)::after {
  background-color: var(--colorSecondary);
}

.header-dropdown {
  background-color: var(--colorSecondary100);
}

.header-dropdown .dropdown-heading {
  color: var(--colorTextPrimary);
  border-bottom: 1px solid var(--colorInputFocus);
}

.header-dropdown .govuk-header__link {
  color: var(--colorDefaultLink);
  text-decoration-color: initial;
}

.header-dropdown .govuk-header__link:hover {
  color: var(--colorHoverLink);
}

.header-dropdown .govuk-header__navigation-item--active .govuk-header__link {
  color: var(--colorTextPrimary);
  text-decoration-color: var(--colorSecondary);
}

/*Header Search Toggle*/
#headerSearchToggle:active,
#headerSearchToggle:visited {
  background-color: var(--colorWhite);
}

#headerSearchToggle.searchClosed {
  background-color: transparent;
}

#headerSearchToggle.searchClosed:active,
#headerSearchToggle.searchClosed:visited {
  background-color: var(--colorWhite);
}

#headerSearchToggle:active::after,
#headerSearchToggle:visited::after {
  background-color: var(--colorPrimary);
}

.employer-hub header #headerSearchToggle:active::after,
.employer-hub header #headerSearchToggle:visited::after {
  background-color: var(--colorSecondary);
}

#headerSearchToggle .searchOpen_icon path {
  fill: var(--colorWhite);
}

.employer-hub header #headerSearchToggle .searchOpen_icon path {
  fill: var(--colorWhite);
}

#headerSearchToggle:active .searchOpen_icon path,
#headerSearchToggle:visited .searchOpen_icon path {
  fill: var(--colorPrimary);
}

#headerSearchToggle.searchClosed:active .searchClosed_icon path,
#headerSearchToggle.searchClosed:visited .searchClosed_icon path {
  fill: var(--colorPrimary);
}

.employer-hub header #headerSearchToggle:active .searchOpen_icon path,
.employer-hub header #headerSearchToggle:visited .searchOpen_icon path {
  fill: var(--colorSecondary);
}

.employer-hub header #headerSearchToggle.searchClosed:active .searchClosed_icon path,
.employer-hub header #headerSearchToggle.searchClosed:visited .searchClosed_icon path {
  fill: var(--colorSecondary);
}

.search-dropdown {
  background-color: var(--colorSecondary100);
}

.search-dropdown .dropdown-heading {
  color: var(--colorPrimary);
}

.search-dropdown .form-search input[type=text] {
  background-color: var(--colorWhite);
  color: var(--colorInputPlaceholder);
}

.search-dropdown .form-search input[type=text]:focus,
.search-dropdown .form-search input[type=text]:focus-visible {
  box-shadow: inset 0 0 0 2px var(--colorInputFocus);
}

.search-dropdown .form-search .input-group-btn .btn {
  background-color: var(--colorSecondary);
}

.search-dropdown .form-search .input-group-btn .btn:hover,
.search-dropdown .form-search .input-group-btn .btn:active {
  background-color: var(--colorSecondaryHover) !important;
  color: inherit !important;
}

.search-dropdown .form-search .input-group-btn .btn[type=submit]:disabled,
.search-dropdown .form-search .input-group-btn .btn[type=submit][disabled] {
  background-color: var(--colorDisabled);
}

.search-dropdown .form-search .input-group-btn .btn .fa-search {
  color: var(--colorWhite);
}

.search-dropdown .form-search .input-group-btn .btn#search-filter {
  color: var(--colorWhite);
}

/*Header Employers Hub*/
.employer-hub header.govuk-header,
.employer-login header.govuk-header {
  background-color: var(--colorPrimary);
}

.employer-hub header .govuk-header__container,
.employer-login header .govuk-header__container {
  border-color: var(--colorSecondary);
}

.employer-hub header > .govuk-header__container:after {
  background-color: var(--colorSecondary);
}

.employer-hub header .search-dropdown .govuk-header__container:after {
  background-color: var(--colorSecondary);
}

.employer-hub .search-dropdown .form-search .input-group-btn .btn {
  background-color: var(--colorPrimary);
}

.employer-hub .search-dropdown .form-search .input-group-btn .btn:hover,
.employer-hub .search-dropdown .form-search .input-group-btn .btn:active {
  background-color: var(--colorPrimaryHover) !important;
}

@media only screen and (max-width: 767px) {
  #headerMenuToggle {
    border-left: 1px solid var(--colorBorder);
  }
}
/********Help Articles Start********/
.fullwidth-container-for-articles {
  background-color: var(--colorLight);
}

.fullwidth-container-for-faqs {
  background-color: var(--colorWhite);
}

.help-article-item {
  border-top: 1px solid var(--colorInputDefault);
  border-bottom: 1px solid var(--colorInputDefault);
}

.help-article-item .help-article-content-wrapper .help-article-description p {
  color: var(--colorPrimary) !important;
}

.help-articles-list-page .view-pagination .pagination .page-item .page-link {
  color: var(--colorDefaultLink);
}

.help-articles-list-page .view-pagination .pagination .page-item .page-link:focus {
  box-shadow: none;
}

.help-articles-list-page .view-pagination .pagination .page-item.active .page-link {
  color: var(--colorWhite);
}

.help-articles-list-page .view-pagination .pagination .page-item.active .page-link,
.help-articles-list-page .view-pagination .pagination .page-item.active .page-link:focus,
.help-articles-list-page .view-pagination .pagination .page-item.active .page-link:hover {
  background-color: var(--colorSecondary) !important;
}

.employer-hub .help-articles-list-page .view-pagination .pagination .page-item.active .page-link,
.employer-hub .help-articles-list-page .view-pagination .pagination .page-item.active .page-link:focus,
.employer-hub .help-articles-list-page .view-pagination .pagination .page-item.active .page-link:hover {
  background-color: var(--colorPrimary) !important;
}

.help-articles-list-page .view-pagination .pagination .page-item.active .page-link:focus {
  box-shadow: none;
}

.help-articles-list-page .view-pagination .pagination .page-item:first-child .page-link,
.help-articles-list-page .view-pagination .pagination .page-item:last-child .page-link {
  box-shadow: none;
}

.help-articles-list-page .view-pagination .pagination .page-item.disabled > .page-link,
.help-articles-list-page .view-pagination .pagination .page-item .page-link.disabled {
  background-color: transparent;
}

/********Help Articles End********/
/************************************* How can we help CSS ****************************************/
.member-hub .help-section-wrapper {
  background-color: var(--colorPrimary100);
}

.employer-hub .help-section-wrapper {
  background-color: var(--colorSecondary100);
}

.member-hub .help-search-wrap .govuk-button {
  background-color: var(--colorPrimary);
  color: var(--colorWhite);
  border: 1px solid var(--colorPrimary);
}

.employer-hub .help-search-wrap .govuk-button {
  background-color: var(--colorSecondary);
  color: var(--colorWhite);
  border: 1px solid var(--colorSecondary);
}

.member-hub .help-search-wrap .govuk-button:hover {
  background-color: var(--colorPrimaryHover);
}

.employer-hub .help-search-wrap .govuk-button:hover {
  background-color: var(--colorSecondaryHover);
}

.member-hub .help-search-wrap .govuk-button:active {
  background-color: var(--colorPrimaryActive);
}

.employer-hub .help-search-wrap .govuk-button:active {
  background-color: var(--colorSecondaryActive);
}

.member-hub .govuk-button:focus:not(:active):not(:hover) {
  background-color: var(--colorPrimary);
  color: var(--colorWhite);
  border: 1px solid var(--colorTextPrimary);
  box-shadow: none;
}

.employer-hub .govuk-button:focus:not(:active):not(:hover) {
  background-color: var(--colorSecondary);
  color: var(--colorWhite);
  border: 1px solid var(--colorSecondaryBorder);
  box-shadow: none;
}

.help-section-wrapper .govuk-input:focus {
  box-shadow: 0 0 0 2px var(--colorInputFocus);
  border: 1px solid var(--colorTextPrimary);
}

.help-section-wrapper .custom-card {
  background: transparent;
  box-shadow: none;
}

.help-section-wrapper .govuk-input {
  color: var(--colorInputPlaceholder);
  border: 1px solid var(--colorInputDefault);
}

.help-section-wrapper .govuk-input::-webkit-input-placeholder {
  color: var(--colorInputPlaceholder) !important;
}

.help-section-wrapper .govuk-input::-moz-placeholder {
  color: var(--colorInputPlaceholder) !important;
}

.help-section-wrapper .govuk-input:-ms-input-placeholder {
  color: var(--colorInputPlaceholder) !important;
}

.help-section-wrapper .govuk-input:-moz-placeholder {
  color: var(--colorInputPlaceholder) !important;
}

.help-section-wrapper .custom-card__content .govuk-hint {
  color: var(--colorTextPrimary);
}

.help-section-wrapper .custom-card__content .list-unstyled .list .govuk-link {
  color: var(--colorHelpSearchHelpText);
}

.help-section-wrapper .custom-card__content .list-unstyled .list .govuk-link:focus {
  background-color: transparent;
  box-shadow: none;
}

body, body.govuk-template__body {
  background: var(--colorLight);
}

.background-primary {
  background: var(--colorPrimary);
}

.change-link {
  color: var(--colorDefaultLink);
}

.info-text {
  color: var(--colorInputPlaceholder) !important;
}

.text-commoncolor {
  color: var(--colorTextPrimary);
}

.default-font {
  color: var(--colorTextPrimary) !important;
}

.default-heading {
  color: var(--colorTextPrimary) !important;
}

.paraColor {
  color: var(--colorInputPlaceholder) !important;
}

.textWhite {
  color: var(--colorWhite) !important;
}

.new-cards-block .collapsible {
  background-color: #ececec;
}

.logout-journey .messagebanner-content-box {
  background-color: var(--colorPrimary);
}

/********** Mailbox ******************/
.mailbox thead a {
  color: var(--colorTextPrimary);
}

.mailbox-sort-select {
  color: var(--colorTextPrimary);
}

.mailbox-page .modal-header,
.file-wrapper .modal-header {
  background: var(--colorWhite);
  border: none !important;
}

.mailbox-page .contact-us-container {
  background: var(--colorWhite);
}

.mailbox-replied-badge {
  background: #e8f1f8;
  color: #0c2d4a;
}

.mailbox table tr th {
  border-bottom-color: var(--colorInputDefault);
}

.mailbox-main-container .print-text,
.file-upload-link .print-text {
  color: var(--colorDefaultLink);
}

.mailbox #EntityFormPanel {
  background: var(--colorWhite);
  border: none;
}

.mailbox textarea#com_body {
  background: var(--colorWhite) !important;
}

/********* Member Landing starts *************/
.circular-bar {
  background: conic-gradient(var(--colorSecondary) 0deg, var(--colorPrimary100) 0deg);
}

.circular-percentage {
  color: var(--colorTextPrimary);
  background-color: var(--colorWhite);
}

.custom-badge.active-badge {
  background-color: var(--colorActive);
  color: var(--colorActiveText);
}

.custom-badge.deferred-badge {
  background-color: var(--colorDeferred);
  color: var(--colorDeferredText);
}

.custom-badge.partially-badge {
  background-color: var(--colorPartially);
  color: var(--colorPartiallyText);
}

.custom-badge.pensioner-badge {
  background-color: var(--colorPensioner);
  color: var(--colorPensionerText);
}

.profile-block p {
  color: var(--colorTextSecondary);
}

.profile-block p span {
  color: var(--colorTextPrimary);
}

ul.profile-lists.list-unstyled {
  border-left: 1px solid var(--colorPartitionBorder);
}

.member-profile-wrapper {
  background-color: var(--colorWhite);
  border-bottom: 1px solid var(--colorPartitionBorder);
}

.dashboard-card-body {
  background-color: var(--colorWhite);
  box-shadow: 0px 7px 5.32948px rgba(53, 29, 19, 0.05), 0px 16px 42.6358px rgba(0, 0, 0, 0.04);
  color: var(--colorTextPrimary);
}

.dashboard-card-body h4.subheading {
  color: var(--colorSecondary);
}

.dashboard-card-body .history {
  color: var(--colorTextPrimary);
}

.read-banner :before {
  background-color: var(--colorDefaultLink);
}

.dash-mailbox-lists-read li {
  border-bottom: 1px solid var(--colorBorderLightBlue);
}

.dash-mailbox-lists li {
  border-bottom: 1px solid var(--colorBorderLightBlue);
}

.dash-mailbox-lists li:before {
  background-color: var(--colorDefaultLink);
}

.abs-summary span {
  color: var(--colorTextPrimary);
}

.abs-summary {
  border-left: 1px solid var(--colorBorder);
}

.custom-message-banner {
  background-color: var(--colorWarningStatus);
}

.custom-message-banner .subheading {
  color: var(--colorTextPrimary);
}

.custom-message-banner .contactus {
  color: var(--colorTextPrimary);
}

.dashboard-card-link {
  color: var(--colorPrimary);
}

/********Members - Amend Personal Details start********/
.multistep-process.amend-personal-details .cancel-upload-btn {
  border: 2px solid var(--colorPrimary);
  border-radius: 8px;
}

/********Role matrix access levels starts********/
.access-levels th,
.access-levels td {
  border-bottom: 1px solid var(--colorSecondary100);
}

.access-levels th {
  color: black;
  text-align: left;
}

.backgroundtr {
  background-color: var(--colorBorder);
}

.default-font-bold {
  color: var(--colorTextPrimary) !important;
}

.super-user-details {
  box-shadow: 10px 0px 0px 0px var(--colorBorder) inset;
}

.information-verify .h2-medium {
  color: var(--colorTextPrimary);
}

.access-levels tbody tr td:not(:first-child),
.access-levels thead tr th:not(:first-child) {
  text-align: center;
}

@media (max-width: 768px) {
  .access-levels tr {
    border-bottom: 1px solid var(--colorSecondary100);
  }
  .select-box-mobile {
    border-radius: 8px;
  }
  .information-verify #access-level-label {
    color: var(--colorTextPrimary);
  }
}
/********Role matrix access levels ends********/
@media screen and (max-width: 767px) {
  .multistep-process.amend-personal-details .after-upload-div .selected-file-info {
    text-align: center;
  }
}
/********Members - Amend Personal Details end********/
/************** Registration Step Form **********/
.multistep-process .btn-primary.submit-btn,
#next,
#continue,
.custom-red-button {
  background-color: var(--colorSecondary);
  color: var(--colorWhite) !important;
}

.multistep-process .btn-primary.submit-btn:hover {
  background-color: var(--colorSecondaryHover);
}

.multistep-process .btn-primary.submit-btn:active {
  background-color: var(--colorSecondaryActive);
}

.multistep-process .description h2,
.multistep-process h2,
.multistep-process .show .modal-header h4 {
  color: var(--colorTextPrimary);
}

.multistep-process .description h3,
.multistep-process h3 {
  color: var(--colorTextPrimary);
}

.multistep-process fieldset .table-info .field-label,
.multistep-process.address-step fieldset .details-column label,
.multistep-process.mailbox-main-container .field-label {
  color: var(--colorTextPrimary);
}

.multistep-process fieldset input.form-control,
.multistep-process fieldset select.form-select,
.azure-fields,
.multistep-process input.form-control {
  border: 1px solid var(--colorInputDefault);
  color: var(--colorTextPrimary);
  background-color: var(--colorWhite) !important;
}

.create-password fieldset input.form-control,
.multistep-process fieldset select.form-select {
  border: 1px solid var(--colorInputDefault);
  color: var(--colorTextPrimary);
  background-color: var(--colorWhite) !important;
}

.show-btn {
  background: var(--colorTextPrimary);
  color: var(--colorLight);
  border: 1px solid var(--colorInputDefault);
}

.multistep-process fieldset input.form-control:focus,
.multistep-process fieldset select.form-select:focus,
.multistep-process input.form-control:focus,
.azure-fields:focus {
  border-color: var(--colorTextPrimary) !important;
  box-shadow: 0 0 0 2px var(--colorInputFocus) !important;
}

.multistep-process a.govuk-back-link,
.back-link {
  color: var(--colorTextPrimary);
}

.multistep-process a.govuk-back-link:focus,
.back-link:focus .multistep-process a.govuk-back-link:active,
.back-link:focus {
  border-bottom: 3px solid var(--colorTextPrimary);
}

.multistep-process a.govuk-back-link:hover,
.back-link:hover {
  text-decoration-color: var(--colorTextPrimary);
}

.multistep-process .crmEntityFormView .cell .picklist input[type=radio],
.multistep-process input[type=radio] {
  background-color: var(--colorWhite);
  border: 1px solid var(--colorInputDefault);
}

.multistep-process .crmEntityFormView .cell .picklist input[type=radio]:focus,
.multistep-process .crmEntityFormView .cell .picklist input[type=radio]:active,
.multistep-process input[type=radio]:focus,
.multistep-process input[type=radio]:active {
  box-shadow: 0 0 0 3px var(--colorInputFocus);
}

.multistep-process .crmEntityFormView .cell .picklist input[type=radio]:checked,
.multistep-process input[type=radio]:checked {
  border-color: var(--colorTextPrimary);
}

.multistep-process .crmEntityFormView .cell .picklist input[type=radio]:after,
.multistep-process input[type=radio]:after {
  background-color: var(--colorTextPrimary);
}

.multistep-process .crmEntityFormView .cell .picklist .forOr span {
  color: var(--colorTextPrimary);
}

html[dir=ltr] .multistep-process .crmEntityFormView .cell .picklist input[type=radio] + label,
.multistep-process input[type=radio] + label {
  color: var(--colorTextPrimary);
}

.multistep-process label.common-label,
.multistep-process .information-lists label,
.multistep-process h5 {
  color: var(--colorTextPrimary);
}

.national-insurance-page.multistep-process .description p {
  color: var(--colorInputPlaceholder);
}

.multistep-process.members-address .control .com_postalcode_wrapper .cross-icon-input {
  background-color: transparent;
}

#dd_addresses1 {
  border: 1px solid var(--colorBlack);
}

#dd_addresses1 .dd-address-div {
  border-bottom: 1px solid var(--colorBlack);
}

#dd_addresses1 .dd-address-div label {
  color: var(--colorTextPrimary);
  background-color: var(--colorWhite);
}

#dd_addresses1 .dd-address-div label:has(input[type=radio]:hover),
#dd_addresses1 .dd-address-div label:has(input[type=radio]:active),
#dd_addresses1 .dd-address-div label:has(input[type=radio]:focus),
#dd_addresses1 .dd-address-div label:has(input[type=radio]:checked) {
  background-color: var(--colorBorder);
}

.cancel.btn.btn-default,
.primary.btn.btn-primary,
.btn.btn-default.remove-value {
  background-color: var(--colorSecondary);
  color: var(--colorWhite) !important;
  border: 0;
}

.cancel.btn.btn-default:hover,
.primary.btn.btn-primary:hover,
.btn.btn-default.remove-value:hover {
  background-color: var(--colorSecondaryHover);
}

.cancel.btn.btn-default:active,
.primary.btn.btn-primary:active,
.btn.btn-default.remove-value:active {
  background-color: var(--colorSecondaryActive);
}

.employer-page .clearlookupfield,
.employer-page .launchentitylookup,
.employer-page .toolbar-actions .input-group-btn .btn {
  color: var(--colorSecondary);
  border-color: var(--colorSecondary);
}

.employer-page .clearlookupfield:hover,
.employer-page .clearlookupfield:active,
.employer-page .clearlookupfield:focus,
.employer-page .launchentitylookup:hover,
.employer-page .launchentitylookup:active,
.employer-page .launchentitylookup:focus,
.employer-page .toolbar-actions .input-group-btn .btn:hover,
.employer-page .toolbar-actions .input-group-btn .btn:active,
.employer-page .toolbar-actions .input-group-btn .btn:focus {
  background-color: var(--colorSecondary) !important;
  border-color: var(--colorSecondary) !important;
  color: #2a2c2e;
}

/************** Registration Step Form - Part B **********/
.multistep-process .description p,
.multistep-process .description ul li,
.multistep-process p,
.multistep-process ul li,
.multistep-process .govuk-details .govuk-details__summary,
.security-questions .common-checkbox label,
.description ol li {
  color: var(--colorTextPrimary);
}

.multistep-process .govuk-details .govuk-details__summary {
  color: var(--colorDefaultLink);
}

.multistep-process .govuk-details .govuk-details__summary:before {
  color: var(--colorPrimary);
}

.multistep-process .govuk-details__text {
  border-left: 5px solid var(--colorBorder);
  color: var(--colorTextPrimary);
}

.multistep-process .govuk-details__summary:focus {
  background: transparent;
  box-shadow: none;
  color: #0b0c0c;
}

.multistep-process .confirm-container {
  background: var(--colorPrimary);
}

.multistep-process .confirm-container h1,
.multistep-process .unsuccess-container h1 {
  color: var(--colorLight);
}

.multistep-process .confirm-container p,
.multistep-process .unsuccess-container p {
  color: var(--colorLight);
}

.multistep-process .unsuccess-container {
  background: var(--colorPrimary100);
}

.multistep-process .unsuccess-container h1 {
  color: var(--colorTextPrimary);
}

.multistep-process .unsuccess-container p {
  color: var(--colorTextPrimary);
}

.multistep-process .entity-action-button .btn-secondary.submit-btn,
.p60-details .btn-secondary.submit-btn,
.multistep-process .btn-secondary.submit-btn {
  background-color: transparent !important;
  color: var(--colorPrimary) !important;
  border: 3px solid var(--colorPrimary);
}

.multistep-process .entity-action-button .btn.btn-secondary.submit-btn:hover,
.multistep-process .btn-secondary.submit-btn:hover {
  background-color: transparent;
}

.multistep-process .entity-action-button .btn.btn-secondary.submit-btn:active,
.multistep-process .btn-secondary.submit-btn:active {
  background-color: transparent;
}

.multistep-process .access-code {
  border-left: 10px solid var(--colorBorder);
}

.multistep-process .common-checkbox input[type=checkbox],
.msos-checkbox {
  border: 2px solid var(--colorInputDefault);
  background: var(--colorWhite);
}

.multistep-process .common-checkbox input[type=checkbox]:checked,
.msos-checkbox:checked {
  border-color: var(--colorTextPrimary);
  box-shadow: 0 0 0 3px var(--colorInputFocus);
}

.multistep-process .common-checkbox label {
  color: var(--colorTextPrimary);
}

.multistep-process .checked-number-field {
  border-left: 4px solid var(--colorBorder);
}

.account-details td {
  border-bottom: 1px solid #d9e3f5;
}

.account-details fieldset input.form-control,
.account-details fieldset select.form-select,
.account-details fieldset textarea.form-control,
.account-details fieldset .input_text,
.multistep-process.address-step .details-column textarea.form-control {
  background-color: transparent !important;
  border: none !important;
  color: var(--colorTextPrimary);
}

.multistep-process.security-questions .msos-option-selected {
  background: transparent !important;
}

.multistep-process.security-questions .msos-option:hover,
.msos-option-selected:hover {
  background: none !important;
}

/************** NOD css **********/
.multistep-process input[type=text]::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: var(--colorTextPrimary) !important;
}

.multistep-process input[type=text]::-moz-placeholder {
  /* Firefox 19+*/
  color: var(--colorTextPrimary) !important;
}

.multistep-process input[type=text]:-ms-input-placeholder {
  /* IE 10+*/
  color: var(--colorTextPrimary) !important;
}

.multistep-process input[type=text]:-moz-placeholder {
  /* Firefox 18- */
  color: var(--colorTextPrimary) !important;
}

.multistep-process label.common-label-big,
.multistep-process h4.subheading,
legend.section-title h3,
.unsuccess-container h3 {
  color: var(--colorTextPrimary);
}

.tellus-member-page.multistep-process .description p,
.tellus-member-page.multistep-process .description ul li {
  color: var(--colorBlack);
}

.multistep-process.date-birth-death-page .description p {
  color: var(--colorInputPlaceholder);
}

.nonuk-mobileno-box::after {
  border-left: 4px solid #b1b4b6;
}

.multistep-process.personal-mobileno-page .common-checkbox label,
.multistep-process.personal-landline-page .common-checkbox label {
  color: var(--colorTextPrimary);
}

.multistep-process.personal-mobileno-page .checked-number-field p,
.multistep-process.personal-landline-page .checked-number-field p {
  color: var(--colorInputPlaceholder);
}

.your-address .address-section ul {
  border: 1px solid var(--colorBlack);
}

.your-address .address-section ul li {
  background-color: var(--colorWhite);
  border-bottom: 1px solid var(--colorBlack);
  color: var(--colorBlack);
}

.your-address .address-section ul li:hover {
  background-color: var(--colorBorder);
}

.multistep-process fieldset .govuk-error-message + input.form-control {
  border: 1px solid var(--colorError) !important;
}

span.govuk-error-message {
  color: var(--colorError);
}

.multistep-process .govuk-form-group--error {
  border-left: 5px solid var(--colorError);
}

.multistep-process label.govuk-date-input__label {
  color: var(--colorTextPrimary);
}

.multistep-process.psn-urn-page p {
  color: var(--colorTextSecondary);
}

.multistep-process.reset-pwd-success .messagebanner-content-box {
  background-color: var(--colorPrimary);
}

.multistep-process.reset-pwd-success .messagebanner-content-box h2 {
  color: var(--colorWhite);
}

.multistep-process.reset-pwd-fail .messagebanner-content-box {
  background-color: var(--colorStatusError);
}

.declaration-completed-page a {
  color: var(--colorTextPrimary);
}

.emp-container {
  background: var(--colorPrimary100) !important;
}

.btn-primary.submit-btn.benef-confirm-disabled {
  background-color: var(--colorButtonDisabled) !important;
}

.expression-wish-page p.paraColor + .access-code-border {
  border-bottom: 1px solid var(--colorInputDefault);
}

ul.pension-allocation-list li {
  border-bottom: 1px solid var(--colorInputDefault);
}

.distribute-evenly span {
  color: var(--colorTextPrimary);
}

.eow-nobeneficiary .govuk-notification-banner__content,
.view-beneficiary-page .govuk-notification-banner__content {
  background-color: var(--colorStatusSuccess);
}

.multistep-process.reset-pwd-fail .messagebanner-content-box {
  background-color: var(--colorStatusError);
}

/************************************* Notification Banner CSS ****************************************/
.notification-banner-section-wrapper {
  background-color: var(--colorLight);
}

.notification-banner-section-wrapper .govuk-notification-banner {
  background-color: transparent;
}

.notification-banner-section-wrapper .govuk-notification-banner__content,
.mailbox .govuk-notification-banner__content {
  background-color: var(--colorStatusSuccess);
}

.notification-banner-section-wrapper .govuk-notification-banner__heading,
.mailbox .govuk-notification-banner__heading {
  color: var(--colorTextPrimary);
}

.notification-banner-section-wrapper .govuk-body,
.notification-banner-section-wrapper .govuk-body * {
  color: var(--colorTextPrimary);
}

.notification-banner-section-wrapper .govuk-body a.govuk-notification-banner__link:focus {
  background-color: var(--colorStatusSuccess);
  box-shadow: none;
}

/********* P60 starts *****************/
.accordion-item.disable .accordion-header .collapsed {
  border-left: 6px solid var(--colorPrimary100);
}

.accordion-header .collapsed {
  border-left: 6px solid var(--colorAccordianBorder);
}

.accordion-header .accordion-button:not(.collapsed) {
  border-left: 6px solid transparent;
}

.accordion-button:not(.collapsed) {
  background: none !important;
}

.accordion-item .accordion-body {
  border-top: 1px solid var(--colorBorder);
}

.accordion-item .accordion-body .p60-certificate-container {
  background: var(--colorLight);
  border: 1px solid var(--colorBorder);
}

.p60-certificate-container span {
  background: var(--colorTextSecondary);
  color: var(--colorWhite);
}

.accordion-body {
  box-shadow: 0px 7px 5.32948px rgba(53, 29, 19, 0.05), 0px 16px 42.6358px rgba(0, 0, 0, 0.04);
}

.p60-subs {
  background: var(--colorTextSecondary);
  color: var(--colorWhite);
}

.p60-subs p {
  color: var(--colorWhite);
}

.p60-details .p60-link {
  color: var(--colorDefaultLink);
}

.p60-details .table-container {
  background: var(--colorLight);
  border: 1px solid var(--colorBorder);
}

.p60-details .table-container .table tr th,
.table-container .table tr td {
  color: var(--colorTextPrimary);
  border-bottom: 1px solid var(--colorSecondary100);
}

.p60-details .p60-badge {
  background-color: var(--colorActive) !important;
}

.p60-details .p60-badge p {
  color: var(--colorActiveText);
}

.p60-filter-dropdown {
  background: #fafafa;
  border: 1px solid var(--colorInputDefault);
}

/********* Payslip starts ***********/
.pagination-body .change-link:hover {
  color: var(--colorHoverLink);
}

.custom-pagination li a {
  color: var(--colorDefaultLink);
}

.custom-pagination li a:hover {
  color: var(--colorHoverLink);
  background-color: var(--colorLinkHover);
}

.custom-pagination li.active a,
.custom-pagination li.active a:hover,
.custom-pagination li.active a:focus {
  background-color: var(--colorPrimary) !important;
  color: var(--colorLight);
}

.custom-pagination li .previous-link:after {
  border: 1px solid var(--colorPartitionBorder);
}

.custom-pagination .pagination-dots a {
  color: #707070;
}

@media screen and (max-width: 767px) {
  /********* Member Landing starts *************/
  ul.profile-lists.list-unstyled {
    border-top: 1px solid var(--colorPartitionBorder);
    border-left: 0;
  }
  /********* Member Landing ends *************/
  /********* P60 start ***********/
  /* .p60-details .p60-help-and-download .print-link::before { display: none; } is in layout.css */
  /********* P60 ends ***********/
  .multistep-process.resetpwd-emailsent div.message.success {
    background-color: transparent;
    border: none;
    border-radius: 0;
    text-shadow: none;
  }
}
.securityquestion-failure {
  background-color: var(--colorFailureBg);
}

.securityquestion-failure p,
.securityquestion-failure p a {
  color: var(--colorError);
}

/******** Spinner start ****/
.spinner {
  color: blue;
}

/******** Spinner end ****/
/************ Super User-Contact - Start *************/
.keycontact-lists {
  background-color: var(--colorFailureBg);
}

.keycontact-lists ul li {
  color: var(--colorError);
}

.hideshow-icon {
  color: var(--colorTextPrimary);
  border: 2px solid var(--colorTextPrimary);
}

.smalllinks {
  color: var(--colorDefaultLink);
}

.remove-contact .smalllinks {
  color: var(--colorError);
}

.alternative-maincontact-block {
  border-top: 1px solid var(--colorTextPrimaryBorder);
}

.address-textarea {
  border: 0 !important;
  color: var(--colorTextPrimary);
}

.success-notificationbanner {
  background-color: var(--colorStatusSuccess);
}

/************ Super User-Contact - End *************/
/********* User Access Management STARTS **********/
.user-access-banner {
  background-color: var(--colorStatusSuccess);
}

.user-access-management .entitylist-search input.query {
  color: var(--colorInputPlaceholder);
}

.user-access-management .entitylist-search .input-group-btn .btn-default {
  background: var(--colorPrimary);
  color: #ffffff;
  border-color: transparent;
}

.remove-access .actions .description {
  color: var(--colorTextSecondary) !important;
}

.check-details td {
  border-bottom: 1px solid #e6e6e6;
}

#createAccessConfirmationModal .modal-title,
#createAccessConfirmationModal .modal-body p {
  color: #000000;
}

.error-color {
  color: var(--colorError) !important;
}

.default-link-color {
  color: var(--colorDefaultLink) !important;
}

.edit-link-disabled {
  color: var(--colorTextSecondary) !important;
}

/************************************* GOV.UK Typography Styles Overrides *******************************/
.govuk-heading-xl {
  font-size: 2rem;
  line-height: 2.1875rem;
}
@media (min-width: 768px) {
  .govuk-heading-xl {
    font-size: 3rem;
    line-height: 3.125rem;
  }
}
.govuk-heading-xl {
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
  font-style: normal;
}

.govuk-heading-l, .banner-content-box h2 {
  font-size: 1.5rem;
  line-height: 1.5625rem;
}
@media (min-width: 768px) {
  .govuk-heading-l, .banner-content-box h2 {
    font-size: 2.25rem;
    line-height: 2.5rem;
  }
}
.govuk-heading-l, .banner-content-box h2 {
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
  font-style: normal;
}

.govuk-heading-m, .modal-content h2 {
  font-size: 1.125rem;
  line-height: 1.25rem;
}
@media (min-width: 768px) {
  .govuk-heading-m, .modal-content h2 {
    font-size: 1.5rem;
    line-height: 1.875rem;
  }
}
.govuk-heading-m, .modal-content h2 {
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
  font-style: normal;
}

.govuk-heading-s {
  font-size: 1rem;
  line-height: 1.25rem;
}
@media (min-width: 768px) {
  .govuk-heading-s {
    font-size: 1.1875rem;
    line-height: 1.25rem;
  }
}
.govuk-heading-s {
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
  font-style: normal;
}

.govuk-caption-xl {
  font-size: 1.125rem;
  line-height: 1.25rem;
}
@media (min-width: 768px) {
  .govuk-caption-xl {
    font-size: 1.6875rem;
    line-height: 2.125rem;
  }
}
.govuk-caption-xl {
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightLight);
  font-style: normal;
}

.govuk-caption-l, .notification-banner-section-wrapper .govuk-notification-banner__heading,
.mailbox .govuk-notification-banner__heading {
  font-size: 1.125rem;
  line-height: 1.25rem;
}
@media (min-width: 768px) {
  .govuk-caption-l, .notification-banner-section-wrapper .govuk-notification-banner__heading,
  .mailbox .govuk-notification-banner__heading {
    font-size: 1.5rem;
    line-height: 1.875rem;
  }
}
.govuk-caption-l, .notification-banner-section-wrapper .govuk-notification-banner__heading,
.mailbox .govuk-notification-banner__heading {
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightLight);
  font-style: normal;
}

.govuk-caption-m {
  font-size: 1rem;
  line-height: 1.25rem;
}
@media (min-width: 768px) {
  .govuk-caption-m {
    font-size: 1.1875rem;
    line-height: 1.5rem;
  }
}
.govuk-caption-m {
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightLight);
  font-style: normal;
}

.govuk-body-large, .banner-content-box p {
  font-size: 1.125rem;
  line-height: 1.25rem;
}
@media (min-width: 768px) {
  .govuk-body-large, .banner-content-box p {
    font-size: 1.5rem;
    line-height: 2rem;
  }
}
.govuk-body-large, .banner-content-box p {
  font-family: var(--fontPrimary);
  font-weight: 400;
  font-style: normal;
}
.govuk-body-large-heavy {
  font-weight: var(--fontWeightBold);
}

.govuk-body, .sidebar-accordion .govuk-accordion__section-heading-text a, .sidebar-accordion .collapsible-content a, .notification-banner-section-wrapper .govuk-body,
.notification-banner-section-wrapper .govuk-body * {
  font-size: 1rem;
  line-height: 1.25rem;
}
@media (min-width: 768px) {
  .govuk-body, .sidebar-accordion .govuk-accordion__section-heading-text a, .sidebar-accordion .collapsible-content a, .notification-banner-section-wrapper .govuk-body,
  .notification-banner-section-wrapper .govuk-body * {
    font-size: 1.1875rem;
    line-height: 1.5625rem;
  }
}
.govuk-body, .sidebar-accordion .govuk-accordion__section-heading-text a, .sidebar-accordion .collapsible-content a, .notification-banner-section-wrapper .govuk-body,
.notification-banner-section-wrapper .govuk-body * {
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightLight);
  font-style: normal;
}

.govuk-body--bold {
  font-size: 1rem;
  line-height: 1.25rem;
}
@media (min-width: 768px) {
  .govuk-body--bold {
    font-size: 1.1875rem;
    line-height: 1.5625rem;
  }
}
.govuk-body--bold {
  font-weight: var(--fontWeightSemiBold);
}

.govuk-body--heavy {
  font-size: 1rem;
  line-height: 1.25rem;
}
@media (min-width: 768px) {
  .govuk-body--heavy {
    font-size: 1.1875rem;
    line-height: 1.5625rem;
  }
}
.govuk-body--heavy {
  font-weight: var(--fontWeightBold);
}

.govuk-body-small, .help-section-wrapper .custom-card__content .govuk-hint {
  font-size: 0.875rem;
  line-height: 1rem;
}
@media (min-width: 768px) {
  .govuk-body-small, .help-section-wrapper .custom-card__content .govuk-hint {
    font-size: 1rem;
    line-height: 1.25rem;
  }
}
.govuk-body-small, .help-section-wrapper .custom-card__content .govuk-hint {
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightLight);
  font-style: normal;
}

.govuk-body-small--bold, .four-column-section .govuk-grid-column-one-quarter .four-clmn-cnt-sec h5 {
  font-size: 0.875rem;
  line-height: 1rem;
}
@media (min-width: 768px) {
  .govuk-body-small--bold, .four-column-section .govuk-grid-column-one-quarter .four-clmn-cnt-sec h5 {
    font-size: 1rem;
    line-height: 1.25rem;
  }
}
.govuk-body-small--bold, .four-column-section .govuk-grid-column-one-quarter .four-clmn-cnt-sec h5 {
  font-weight: var(--fontWeightMedium);
}

.govuk-body-small--heavy {
  font-size: 0.875rem;
  line-height: 1rem;
}
@media (min-width: 768px) {
  .govuk-body-small--heavy {
    font-size: 1rem;
    line-height: 1.25rem;
  }
}
.govuk-body-small--heavy {
  font-weight: var(--fontWeight);
}

.govuk-link, .govuk-body .govuk-link, a.govuk-link[href="#top"]::before, a.govuk-link[href="#top"]::after {
  font-size: 1rem;
  line-height: 1.25rem;
}
@media (min-width: 768px) {
  .govuk-link, .govuk-body .govuk-link, a.govuk-link[href="#top"]::before, a.govuk-link[href="#top"]::after {
    font-size: 1.1875rem;
    line-height: 1.5625rem;
  }
}
.govuk-link, .govuk-body .govuk-link, a.govuk-link[href="#top"]::before, a.govuk-link[href="#top"]::after {
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightLight);
  font-style: normal;
  text-decoration: underline;
}

.govuk-link--bold {
  font-size: 1rem;
  line-height: 1.25rem;
}
@media (min-width: 768px) {
  .govuk-link--bold {
    font-size: 1.1875rem;
    line-height: 1.5625rem;
  }
}
.govuk-link--bold {
  font-family: var(--fontPrimary);
  font-weight: 500;
  font-style: normal;
  text-decoration: underline;
}

.govuk-link, .govuk-body .govuk-link, a.govuk-link[href="#top"]::before, a.govuk-link[href="#top"]::after {
  font-size: 1rem;
  line-height: 1.25rem;
}
@media (min-width: 768px) {
  .govuk-link, .govuk-body .govuk-link, a.govuk-link[href="#top"]::before, a.govuk-link[href="#top"]::after {
    font-size: 1.1875rem;
    line-height: 1.5625rem;
  }
}
.govuk-link, .govuk-body .govuk-link, a.govuk-link[href="#top"]::before, a.govuk-link[href="#top"]::after {
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightLight);
  font-style: normal;
  text-decoration: underline;
  font-weight: 500;
}

.govuk-link-small {
  font-size: 0.875rem;
  line-height: 1rem;
}
@media (min-width: 768px) {
  .govuk-link-small {
    font-size: 1rem;
    line-height: 1.25rem;
  }
}
.govuk-link-small {
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightLight);
  font-style: normal;
  text-decoration: underline;
}

.govuk-link-small-bold {
  font-size: 0.875rem;
  line-height: 1rem;
}
@media (min-width: 768px) {
  .govuk-link-small-bold {
    font-size: 1rem;
    line-height: 1.25rem;
  }
}
.govuk-link-small-bold {
  font-family: var(--fontPrimary);
  font-weight: 500;
  font-style: normal;
  text-decoration: underline;
}

.govuk-button {
  font-size: 1rem;
  line-height: 1.25rem;
}
@media (min-width: 768px) {
  .govuk-button {
    font-size: 1.1875rem;
    line-height: 1.5625rem;
  }
}
.govuk-button {
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightSemiBold);
  font-style: normal;
  text-decoration: none;
}

.govuk-button-small {
  font-size: 0.875rem;
  line-height: 1rem;
}
@media (min-width: 768px) {
  .govuk-button-small {
    font-size: 1rem;
    line-height: 1.25rem;
  }
}
.govuk-button-small {
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightSemiBold);
  font-style: normal;
  text-decoration: none;
}

.help-link a {
  font-family: inherit;
  font-weight: inherit;
  font-size: inherit;
}

/********Knowledge Articles start**********/
.articles-page .page-heading .back-link {
  text-decoration: none;
}

.articles-page .page-heading .back-link:hover {
  text-decoration: underline;
}

.articles-page .page-heading .breadcrumb .breadcrumb-item,
.articles-page .page-heading .breadcrumb .breadcrumb-item a {
  line-height: 20px;
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightLight);
  font-size: var(--font16);
  text-decoration: underline;
  text-underline-offset: 0.24em;
}

.articles-page #mainContent h1 {
  line-height: 35px;
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
  font-size: var(--font32);
}

#RelatedArticles > .card-header > h4 {
  line-height: 35px;
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
  font-size: var(--font32);
}

#RelatedArticles .list-group .list-group-item {
  line-height: 25px;
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
  font-size: var(--font19);
  text-decoration: none;
}

.feedback-vote {
  text-align: center;
}

.feedback-vote h2 {
  line-height: 30px;
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
  font-size: var(--font24);
}

.feedback-vote .govuk-button-group .govuk-link {
  line-height: 30px;
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
  font-size: var(--font24);
  text-align: center;
  text-decoration-thickness: 1.5px;
}

.feedback-vote .govuk-button-group .govuk-link:focus {
  text-decoration: underline;
}

.feedback-vote p {
  line-height: 30px;
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightRegular);
  font-size: 20px;
}

.need-more-help-section h2 {
  line-height: 35px;
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
  font-size: var(--font32);
  text-align: center;
}

.need-more-help-section .tabs-container .nav .nav-item .nav-link {
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightRegular);
  font-size: var(--font18);
  line-height: 20px;
  text-align: center;
}

.need-more-help-section .tabs-container .nav .nav-item .nav-link:hover {
  text-decoration: none;
}

.need-more-help-section .tabs-container .nav .nav-item .nav-link.active {
  font-weight: var(--fontWeightBold);
}

.need-more-help-section .tabs-container .tab-content-div h2 {
  text-align: left;
  font-size: var(--font36);
  line-height: 40px;
}

.need-more-help-section .tabs-container .tab-content-div h3 {
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
}

.topic-subtopic-selection .selection-div .title-div {
  font-weight: var(--fontWeightMedium);
}

@media screen and (max-width: 767px) {
  .articles-page .page-heading .breadcrumb .breadcrumb-item,
  .articles-page .page-heading .breadcrumb .breadcrumb-item a {
    line-height: 16px;
    font-size: var(--font14);
  }
}
/********Knowledge Articles end**********/
/************************************* Banner CSS ****************************************/
.banner-content-box .common-button span img {
  width: 7.41px;
  height: 12px;
  display: inline-block;
}

.banner-content-box .common-button span {
  text-align: center;
}

body {
  font-family: var(--fontPrimary) !important;
  font-size: var(--font16);
  font-weight: var(--fontWeightRegular);
  letter-spacing: normal;
}

.change-link {
  font-family: var(--fontPrimary);
  font-size: var(--font19);
  font-weight: var(--fontWeightLight);
  line-height: 25px;
  text-underline-offset: 0.24em;
  text-decoration: underline;
}

.default-font {
  font-size: var(--font19);
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightLight);
  line-height: 25px;
}

.default-heading {
  font-size: var(--font36) !important;
  font-family: var(--fontSecondary) !important;
  font-weight: var(--fontWeightBold) !important;
  color: var(--colorTextPrimary) !important;
  line-height: 40px !important;
}

.font-weight-medium {
  font-weight: 500 !important;
}

.font-family-roboto {
  font-family: var(--fontPrimary) !important;
}

.font-family-quicksand {
  font-family: var(--fontSecondary) !important;
}

/********** button typography *************/
.primary-button {
  font-size: 0.875rem;
  line-height: 1rem;
}
@media (min-width: 768px) {
  .primary-button {
    font-size: 1rem;
    line-height: 1.25rem;
  }
}
.primary-button {
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightMedium);
}

.common-button {
  font-size: 0.875rem;
  line-height: 1rem;
}
@media (min-width: 768px) {
  .common-button {
    font-size: 1rem;
    line-height: 1.25rem;
  }
}
.common-button {
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightMedium);
}

/********** Footer typography *************/
.govuk-footer .govuk-heading-m {
  font-family: var(--fontSecondary);
}

.govuk-footer .govuk-footer__link {
  font-size: 0.875rem;
  line-height: 1rem;
}
@media (min-width: 768px) {
  .govuk-footer .govuk-footer__link {
    font-size: 1rem;
    line-height: 1.25rem;
  }
}
.govuk-footer .govuk-footer__link {
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightLight);
}

/************************************* Card Section CSS ****************************************/
.four-column-section .govuk-grid-column-one-quarter .four-clmn-cnt-sec a.entire-card {
  text-decoration: none;
}

.four-column-section .govuk-grid-column-one-quarter .four-clmn-cnt-sec span {
  font-weight: var(--fontWeightLight);
}

.four-column-section .govuk-grid-column-one-quarter .four-clmn-cnt-sec .entire-card-links,
.multistep-process .entire-card-links {
  font-size: var(--font16);
  line-height: 20px;
  font-weight: var(--fontWeightMedium);
  font-family: var(--fontPrimary);
  text-decoration: underline;
}

.card-section .govuk-grid-column-one-third .three-column-area .content-area span small {
  font-size: var(--font16);
  font-weight: var(--fontWeightLight);
}

/* Card section styling starts here */
.card-section .govuk-grid-column-one-third .three-column-area a.over-area {
  text-decoration: none;
}

.card-section .govuk-grid-column-one-third .three-column-area .content-area h4 {
  font-size: 1rem;
  line-height: 1.25rem;
}
@media (min-width: 768px) {
  .card-section .govuk-grid-column-one-third .three-column-area .content-area h4 {
    font-size: 1.1875rem;
    line-height: 1.5625rem;
  }
}
.card-section .govuk-grid-column-one-third .three-column-area .content-area h4 {
  font-weight: var(--fontWeightBold);
  font-family: var(--fontSecondary);
}

.card-section .govuk-grid-column-one-third .three-column-area .content-area p {
  font-size: 0.875rem;
  line-height: 1rem;
}
@media (min-width: 768px) {
  .card-section .govuk-grid-column-one-third .three-column-area .content-area p {
    font-size: 1rem;
    line-height: 1.25rem;
  }
}
.card-section .govuk-grid-column-one-third .three-column-area .content-area p {
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightLight);
  font-style: normal;
}

.card-section .govuk-grid-column-one-third .three-column-area .content-area span {
  font-size: var(--font16);
  line-height: 20px;
  font-weight: var(--fontWeightMedium);
  font-family: var(--fontPrimary);
  text-decoration: underline;
}

/* Media query starts here */
@media only screen and (max-width: 767px) {
  .card-section .govuk-grid-column-one-third .three-column-area .content-area h4 {
    font-size: var(--font16);
    line-height: 20px;
  }
  .card-section .govuk-grid-column-one-third .three-column-area .content-area p {
    font-size: var(--font14);
    line-height: 16px;
  }
  .four-column-section .govuk-grid-column-one-quarter .four-clmn-cnt-sec h5 {
    font-size: var(--font14);
  }
}
/********Contact Us - Complaints Form start**********/
.multistep-process.complaint-step5 #com_email,
.multistep-process.complaint-step5 #com_confirmemail {
  text-decoration: none !important;
}

.multistep-process.complaint-step7 .control textarea {
  font-size: var(--font19);
  line-height: 25px;
}

.complaint-step8 .details-column #com_email {
  text-decoration: none !important;
}

.complaint-step8 .details-column .change-link {
  line-height: 20px;
  font-size: var(--font16);
}

@media only screen and (max-width: 767px) {
  .complaint-step8 .details-column .input_text {
    line-height: 20px;
    font-size: var(--font16);
  }
  .multistep-process.complaint-step10-success .confirm-container h1 {
    font-size: var(--font32);
    line-height: 35px;
  }
}
@media only screen and (max-width: 340px) {
  .multistep-process.complaint-step10-success .submit-btn {
    font-size: var(--font16);
  }
}
/********Contact Us - Complaints Form end**********/
/**********Contact Us - Help & Support start***********/
.collapsible-content {
  font-size: var(--font19);
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightLight);
  line-height: 25px;
}

.collapsible-item .collapsible-heading .collapsible-btn {
  font-size: var(--font24);
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
  line-height: 30px;
  text-align: left;
}

.collapsible-item .collapsible-heading .collapsible-btn .collapsibleShowHide {
  font-size: var(--font19);
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightLight);
  line-height: 25px;
}

.collapsible-item .collapsible-heading .collapsible-btn:focus {
  text-decoration: underline;
  text-decoration-thickness: 4px;
  text-underline-offset: 8px;
}

.collapsible-item .collapsible-heading .collapsible-btn:focus .collapsibleShowHide {
  text-decoration: none;
}

.collapsible-set .collapsible-btn-all {
  font-size: var(--font19);
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightLight);
  line-height: 25px;
  text-align: left;
}

.signin-notification-banner h3 {
  font-size: var(--font24);
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
  line-height: 30px;
}

.signin-notification-banner a {
  font-size: inherit;
  font-family: inherit;
  font-weight: inherit;
  line-height: inherit;
}

.help-support-section h2 {
  text-align: center;
}

.help-support-section .four-column-section .govuk-grid-column-one-quarter .four-clmn-cnt-sec .entire-card-links .article-count {
  font-weight: inherit;
}

.faqs-section h3 {
  text-align: center;
  font-size: var(--font24);
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
  line-height: 40px;
}

.recommended-topics-section.four-column-section .govuk-grid-column-one-quarter .four-clmn-cnt-sec .icon-sec {
  text-align: center;
}

.recommended-topics-section.four-column-section .govuk-grid-column-one-quarter .four-clmn-cnt-sec h3 {
  font-weight: var(--fontWeightSemiBold);
}

@media only screen and (max-width: 767px) {
  .signin-notification-banner h3 {
    font-size: var(--font18);
    line-height: 20px;
  }
  .help-support-section .four-column-section .govuk-grid-column-one-quarter .four-clmn-cnt-sec h5 {
    font-size: var(--font16);
    line-height: 20px;
    font-weight: var(--fontWeightBold);
  }
  .help-support-section .four-column-section .govuk-grid-column-one-quarter .four-clmn-cnt-sec .entire-card-links {
    font-size: var(--font14);
    line-height: 16px;
  }
  .faqs-section h3 {
    font-size: var(--font18);
    line-height: 20px;
  }
  .collapsible-set .collapsible-btn-all {
    font-size: var(--font16);
    line-height: 20px;
  }
  .collapsible-item .collapsible-heading .collapsible-btn {
    font-size: var(--font16);
    line-height: 20px;
  }
  .collapsible-item .collapsible-heading .collapsible-btn .collapsibleShowHide {
    font-size: var(--font16);
    line-height: 20px;
  }
  .collapsible-content {
    font-size: var(--font16);
    line-height: 20px;
  }
  .collapsible-item .collapsible-heading .collapsible-btn:focus {
    text-decoration-thickness: 2px;
    text-underline-offset: 4px;
  }
  .recommended-topics-section.four-column-section .govuk-grid-column-one-quarter .four-clmn-cnt-sec h3 {
    font-weight: var(--fontWeightBold);
    font-size: var(--font16);
    line-height: 20px;
  }
}
/******** Cookie start ********/
#cookieHeading {
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
}

.govuk-cookie-banner__content p {
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightLight);
}

/******** Cookie end ********/
.govuk-table {
  font-family: var(--fontPrimary);
}

.govuk-table .govuk-table__header {
  font-size: 1rem;
  line-height: 1.25rem;
}
@media (min-width: 768px) {
  .govuk-table .govuk-table__header {
    font-size: 1.1875rem;
    line-height: 1.5625rem;
  }
}
.govuk-table .govuk-table__header {
  font-family: var(--fontPrimary);
  font-style: normal;
  font-weight: var(--fontWeightSemiBold);
}

.govuk-table .govuk-table__cell {
  font-size: 1rem;
  line-height: 1.25rem;
}
@media (min-width: 768px) {
  .govuk-table .govuk-table__cell {
    font-size: 1.1875rem;
    line-height: 1.5625rem;
  }
}
.govuk-table .govuk-table__cell {
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightLight);
  font-style: normal;
}

.govuk-body .govuk-link, .govuk-body a.govuk-link[href="#top"]::after, .govuk-body a.govuk-link[href="#top"]::before {
  letter-spacing: 0px;
  text-decoration: underline;
}

.govuk-body .govuk-link:hover, .govuk-body a.govuk-link[href="#top"]:hover::after, .govuk-body a.govuk-link[href="#top"]:hover::before {
  text-decoration: underline;
}

a.govuk-link[href="#top"], a[href="#top"].govuk-link::after, a[href="#top"].govuk-link::before {
  text-decoration: none;
  font-size: 0;
}

a.govuk-link[href="#top"]::before {
  content: "Back to top";
}

a.govuk-link[href="#top"]::after {
  content: "↑";
  font-family: "Arial", sans-serif;
  font-weight: 900;
  text-decoration: none;
}

a.govuk-link[href="#top"]:hover, a[href="#top"].govuk-link:hover::before, a[href="#top"].govuk-link:hover::after {
  text-decoration: none;
}

a.govuk-link[href="#top"]:hover::before {
  text-decoration: none;
}

.modal-content {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}

.modal-content p {
  @xtend .govuk-body-small;
}

.cookie-toggle-container .toggle-option {
  @xtend .govuk-body-small--bold;
}

.govuk-table--simple th,
.govuk-table--simple td,
.govuk-table--grouped th,
.govuk-table--grouped td {
  @xtend .govuk-body-small;
}

@media (max-width: 575px) {
  .govuk-table--grouped .govuk-table__body .govuk-table__cell,
  .govuk-table--grouped .govuk-table__body .govuk-table__header {
    font-weight: var(--fontWeightLight);
  }
  .govuk-table--grouped .govuk-table__body .govuk-table__cell:first-child,
  .govuk-table--grouped .govuk-table__body .govuk-table__header:first-child {
    font-weight: 600;
  }
}
/********* create-portal-message STARTS *************/
.create-portal-message #Subgrid_Document tbody tr .file-rw {
  text-decoration: underline;
  text-underline-offset: 4px;
  font-weight: 300 !important;
}

.create-portal-message .create-message-form-wrap #com_subjectid,
.create-portal-message .create-message-form-wrap #com_casecategory,
.create-portal-message .create-message-form-wrap #com_topicid,
.create-portal-message .create-message-form-wrap #custom_recipient {
  font-weight: var(--fontWeightLight);
}

/********File Upload Employer start********/
.sidebar-container h3 {
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
  font-size: var(--font24);
  line-height: 30px;
}

.sidebar-nav li a {
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightLight);
  font-size: var(--font16);
  line-height: 20px;
  text-decoration: none;
}

.sidebar-nav li a:hover {
  text-decoration: underline;
  text-underline-offset: 0.24em;
}

.sidebar-nav li a.active {
  font-weight: var(--fontWeightMedium);
  text-decoration: underline;
  text-underline-offset: 0.24em;
}

.custom-fileUpload-btn {
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightMedium);
  font-size: var(--font19);
  line-height: 25px;
}

.cancel-upload-btn {
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightMedium);
  font-size: var(--font19);
  line-height: 25px;
}

.file-upload-employer .govuk-error-message p {
  font-size: var(--font19);
  line-height: 25px;
  font-weight: var(--fontWeightLight);
  font-family: var(--fontPrimary);
}

.file-upload-employer .file-upload-success h3 {
  font-size: var(--font24);
  line-height: 30px;
  font-weight: var(--fontWeightBold);
  font-family: var(--fontSecondary);
}

.upload-success h3 {
  font-weight: var(--fontWeightBold);
  font-family: var(--fontSecondary);
  font-size: var(--font24);
  line-height: 30px;
  letter-spacing: 0px;
}

/********File Upload Employer end********/
/**---Impact changes search---**/
.form-search input[type=text] {
  line-height: 25px !important;
  font-family: var(--fontPrimary) !important;
  font-weight: var(--fontWeightMedium);
  font-size: var(--font19) !important;
}

.form-search input[type=text]::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  font-weight: var(--fontWeightLight) !important;
}

.form-search input[type=text]::-moz-placeholder {
  /* Firefox 19+*/
  font-weight: var(--fontWeightLight) !important;
}

.form-search input[type=text]:-ms-input-placeholder {
  /* IE 10+*/
  font-weight: var(--fontWeightLight) !important;
}

.form-search input[type=text]:-moz-placeholder {
  /* Firefox 18- */
  font-weight: var(--fontWeightLight) !important;
}

.form-search input[type=text]::placeholder {
  /* Firefox 18- */
  font-weight: var(--fontWeightLight) !important;
}

.form-search .input-group-btn .btn .fa-search {
  font-size: 19px;
  line-height: 19px;
}

/* ************************************ Header CSS *************************************** */
header .govuk-header__link--homepage {
  font-size: 25px;
}

header .govuk-header__navigation-list {
  font-size: 0;
}

header .govuk-header__navigation .govuk-header__link {
  font-family: var(--fontPrimary);
  font-size: var(--font16);
  font-weight: var(--fontWeightBold);
  line-height: 20px;
}

.header-dropdown .dropdown-heading {
  font-family: var(--fontSecondary);
  font-size: var(--font24);
  font-weight: var(--fontWeightBold);
  line-height: 30px;
}

.header-dropdown .govuk-header__link {
  font-size: var(--font19);
  line-height: 25px;
  font-weight: var(--fontWeightLight);
  font-family: var(--fontPrimary);
}

.header-dropdown .govuk-header__navigation-item--active .govuk-header__link {
  font-weight: var(--fontWeightLight);
}

/*Header Search Toggle*/
.search-dropdown .dropdown-heading {
  font-family: var(--fontSecondary);
  font-size: var(--font18);
  font-weight: var(--fontWeightBold);
  line-height: 20px;
}

.search-dropdown .form-search input[type=text] {
  line-height: 25px !important;
  font-family: var(--fontPrimary) !important;
  font-weight: var(--fontWeightMedium);
  font-size: var(--font19) !important;
}

.search-dropdown .form-search input[type=text]::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  font-weight: var(--fontWeightLight) !important;
}

.search-dropdown .form-search input[type=text]::-moz-placeholder {
  /* Firefox 19+*/
  font-weight: var(--fontWeightLight) !important;
}

.search-dropdown .form-search input[type=text]:-ms-input-placeholder {
  /* IE 10+*/
  font-weight: var(--fontWeightLight) !important;
}

.search-dropdown .form-search input[type=text]:-moz-placeholder {
  /* Firefox 18- */
  font-weight: var(--fontWeightLight) !important;
}

.search-dropdown .form-search input[type=text]::placeholder {
  /* Firefox 18- */
  font-weight: var(--fontWeightLight) !important;
}

.search-dropdown .form-search .input-group-btn .btn .fa-search {
  font-size: 19px;
  line-height: 19px;
}

/*Header Employers Hub*/
@media only screen and (min-width: 768px) and (max-width: 875px) {
  header .govuk-header__navigation .govuk-header__link {
    font-size: var(--font14);
  }
}
@media only screen and (max-width: 767px) {
  .header-dropdown .dropdown-heading {
    font-size: var(--font18);
    line-height: 20px;
  }
  .search-dropdown .form-search input[type=text] {
    line-height: 20px !important;
    font-size: var(--font16) !important;
  }
}
/********Help Articles Start********/
.help-articles-list-section h3 {
  font-family: var(--fontSecondary);
  font-size: var(--font24);
  font-weight: var(--fontWeightBold);
  line-height: 30px;
}

.help-article-item > a {
  text-decoration: none !important;
}

.help-article-item .help-article-content-wrapper .help-article-heading .help-article-title {
  font-weight: var(--fontWeightBold) !important;
  font-family: var(--fontSecondary) !important;
}

.help-article-item .help-article-content-wrapper .help-article-heading .help-article-published-date {
  font-weight: var(--fontWeightRegular) !important;
}

.help-articles-list-page .view-pagination .pagination .page-item .page-link {
  line-height: 25px;
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightLight);
  font-size: var(--font19);
  text-underline-offset: 4px;
}

.help-articles-list-page .view-pagination .pagination .page-item.active .page-link {
  font-weight: var(--fontWeightSemiBold);
}

.help-articles-list-page .view-pagination .pagination .page-item:first-child .page-link,
.help-articles-list-page .view-pagination .pagination .page-item:last-child .page-link {
  font-weight: var(--fontWeightSemiBold);
}

@media (max-width: 767px) {
  .help-articles-list-section h3 {
    font-size: var(--font18);
    line-height: 20px;
  }
}
/********Help Articles End********/
/************************************* How can we help CSS ****************************************/
.help-section-wrapper .govuk-input {
  line-height: 25px !important;
  font-family: var(--fontPrimary) !important;
  font-weight: var(--fontWeightMedium);
  font-size: var(--font19) !important;
}

.help-section-wrapper .govuk-input::-webkit-input-placeholder {
  line-height: 25px !important;
  font-weight: var(--fontWeightLight) !important;
  font-size: var(--font19);
}

.help-section-wrapper .govuk-input::-moz-placeholder {
  line-height: 25px !important;
  font-weight: var(--fontWeightLight) !important;
  font-size: var(--font19);
}

.help-section-wrapper .govuk-input:-ms-input-placeholder {
  line-height: 25px !important;
  font-weight: var(--fontWeightLight) !important;
  font-size: var(--font19);
}

.help-section-wrapper .govuk-input:-moz-placeholder {
  line-height: 25px !important;
  font-weight: var(--fontWeightLight) !important;
  font-size: var(--font19);
}

.help-search-wrap .govuk-button {
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightMedium);
  line-height: 23px;
  font-size: var(--font19);
  text-align: left;
}

.help-section-wrapper .custom-card__content .govuk-hint {
  font-weight: var(--fontWeightMedium);
}

.help-section-wrapper .custom-card__content .list-unstyled .list .govuk-link {
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightLight);
  text-decoration-line: underline !important;
  text-underline-offset: 5.5px;
  text-decoration-thickness: 1.5px !important;
}

.help-section-wrapper .custom-card__content .list-unstyled .list .govuk-link:hover {
  text-underline-offset: 5.5px;
  text-decoration-thickness: 2.5px !important;
}

.help-section-wrapper .custom-card__content .list-unstyled .list .govuk-link:focus {
  text-underline-offset: 7.5px;
  text-decoration-thickness: 2.5px !important;
}

/****************** media query ************************/
@media (max-width: 767px) {
  .help-section-wrapper .custom-card__heading {
    font-size: var(--font24);
    line-height: 25px;
  }
  .help-search-wrap .govuk-button {
    text-align: center;
    font-size: var(--font16);
    line-height: 20px;
  }
  .help-section-wrapper .custom-card__content .govuk-hint {
    font-size: var(--font14);
    line-height: 16px;
  }
  .help-section-wrapper .custom-card__content .list-unstyled .list .govuk-link {
    line-height: 16px;
    font-size: var(--font14);
  }
  .help-section-wrapper .govuk-input {
    font-size: var(--font16) !important;
    line-height: 20px !important;
  }
  .help-section-wrapper .govuk-input::-webkit-input-placeholder {
    font-size: var(--font16);
    line-height: 20px !important;
  }
  .help-section-wrapper .govuk-input::-moz-placeholder {
    font-size: var(--font16);
    line-height: 20px !important;
  }
  .help-section-wrapper .govuk-input:-ms-input-placeholder {
    font-size: var(--font16);
    line-height: 20px !important;
  }
  .help-section-wrapper .govuk-input:-moz-placeholder {
    font-size: var(--font16);
    line-height: 20px !important;
  }
}
.upload-label {
  white-space: nowrap;
}

.file-info {
  font-family: "Roboto";
  font-style: normal;
  font-weight: var(--fontWeightLight);
  font-size: 19px;
  line-height: 25px;
}

#exitButton {
  font-weight: bold;
}

/************** Impact Changes css **********/
.body-wrapper {
  font-size: var(--font16);
}

.wrapper-content p {
  font-family: var(--fontPrimary);
  font-size: var(--font16);
}

.govuk-form-group--error {
  display: block;
}

.govuk-grid-row,
.govuk-footer__navigation {
  margin-right: -12px;
  margin-left: -12px;
}

.govuk-grid-column-one-third,
.govuk-grid-column-one-quarter {
  padding: 0 12px;
}

@media screen and (max-width: 767px) {
  .govuk-width-container {
    margin-right: 24px;
    margin-left: 24px;
  }
}
.govuk-warning-banner__content {
  padding: 24px;
  border-radius: 8px;
}

/********* Logout journey starts *****************/
.logout-journey .emp-container h2 {
  font-size: var(--font48);
  line-height: 50px;
}

.logout-journey .emp-container p {
  font-size: var(--font24);
  line-height: 32px;
}

/********* Logout journey ends *****************/
/********** Mailbox ******************/
.mailbox thead a {
  font-family: var(--fontPrimary);
  font-size: var(--font16);
  line-height: 20px;
  text-decoration: none !important;
  font-weight: 600;
}

.mailbox-sort-select {
  font-size: var(--font19);
  font-weight: var(--fontWeightLight);
  line-height: 25px;
}

.mailbox-replied-badge {
  font-weight: var(--fontWeightLight);
}

.mailbox-main-container .print-text,
.file-upload-link .print-text {
  border-bottom: 1px solid;
}

/********* Member Landing starts *************/
.profile-block h2 {
  font-size: var(--font22);
}

.circular-percentage {
  font-size: var(--font16);
  font-weight: var(--fontWeightMedium);
  line-height: 20px;
}

.custom-badge {
  font-size: var(--font19);
  line-height: 25px;
  font-weight: var(--fontWeightLight);
  font-family: var(--fontPrimary);
}

.profile-block p.mem-contact,
.profile-block p.mem-contact a.change-link {
  font-size: var(--font16);
  line-height: 20px;
}

.dashboard-card-body h5 {
  font-size: var(--font24);
  line-height: 32px;
}

.dashboard-card-body .history {
  font-size: var(--font42);
  line-height: 50px;
}

.dashboard-card-body .history small {
  font-size: var(--font24);
  line-height: 32px;
  margin-left: 5px;
}

.dash-mailbox-lists-read li * {
  font-size: var(--font16) !important;
  line-height: 20px !important;
}

.dash-mailbox-lists li * {
  font-size: var(--font16) !important;
  line-height: 20px !important;
}

.dashboard-card-body a.change-link {
  font-size: var(--font16);
  line-height: 20px;
}

.abs-summary span {
  font-size: var(--font16) !important;
  line-height: 20px !important;
  font-weight: var(--fontWeightLight);
}

.textual-card label,
.manage-pension-card p,
.beneficiary-detail h6,
.beneficiary-detail label,
.dashboard-card-body p {
  font-size: var(--font16);
  line-height: 20px;
}

.custom-message-banner .subheading {
  font-size: var(--font24);
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
  line-height: 30px;
}

.custom-message-banner .contactus {
  font-size: var(--font19);
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightLight);
  line-height: 25px;
}

.Mailbox-fail p {
  font-size: var(--font19);
  line-height: 25px;
}

.dashboard-card-link {
  font-size: var(--font24);
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
  line-height: 30px;
  text-decoration: none !important;
}

.dashboard-card-nav a.change-link {
  font-size: var(--font19);
  line-height: 25px;
}

/********Members - Amend Personal Details start********/
/********Role matrix access levels starts********/
.tdwithwitdh {
  font-weight: 600;
}

.access-levels th {
  font-weight: 600;
}

.default-font-bold {
  font-size: var(--font19);
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightBold) !important;
  text-decoration: none !important;
  line-height: 25px;
}

.super-user-details span.desc {
  font-weight: var(--fontWeightSemiBold);
}

.information-verify .h2-medium {
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
  font-size: var(--font24);
  line-height: 30px;
}

@media (max-width: 768px) {
  .default-font-bold {
    font-size: var(--font16);
    line-height: 20px;
  }
  .super-user-details span.desc {
    font-weight: var(--fontWeightBold);
  }
  .information-verify .h2-medium {
    font-size: var(--font18);
    line-height: 20px;
  }
  .information-verify #access-level-label {
    font-family: var(--fontSecondary);
    font-size: var(--font16);
    font-weight: var(--fontWeightBold);
    line-height: 20px;
  }
  .access-levels th,
  .access-levels td:first-child {
    font-weight: var(--fontWeightBold);
  }
}
/********Role matrix access levels ends********/
@media screen and (max-width: 767px) {
  .multistep-process.amend-personal-final-page .confirm-container h1 {
    font-size: var(--font32);
    line-height: 35px;
  }
}
/********Members - Amend Personal Details end********/
/************** Registration Step Form **********/
.multistep-process {
  font-family: var(--fontPrimary);
}

.multistep-process .btn-primary.submit-btn,
#next,
#continue,
.custom-red-button {
  font-size: var(--font19);
  line-height: 25px;
  font-family: var(--fontPrimary);
  text-decoration: none !important;
  font-weight: var(--fontWeightMedium);
}

.multistep-process .submit-btn-text-temp {
  font-size: var(--font19);
  font-weight: var(--fontWeightMedium);
  font-family: var(--fontPrimary);
}

.multistep-process .description h2,
.multistep-process h2,
.multistep-process .show .modal-header h4 {
  font-size: var(--font36);
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
  line-height: 40px;
}

.multistep-process .description h3,
.multistep-process h3 {
  font-size: var(--font19);
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightMedium);
  line-height: 25px;
}

.multistep-process fieldset .table-info .field-label,
.multistep-process.address-step fieldset .details-column label,
.multistep-process.mailbox-main-container .field-label {
  line-height: 25px;
  font-size: var(--font19);
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
  float: none !important;
}

.multistep-process fieldset input.form-control,
.multistep-process fieldset select.form-select,
.azure-fields,
.multistep-process input.form-control {
  font-size: var(--font19);
  line-height: 25px;
}

.create-password fieldset input.form-control,
.multistep-process fieldset select.form-select {
  font-size: var(--font19);
  line-height: 25px;
}

.show-btn {
  font-size: var(--font19);
}

.multistep-process a.govuk-back-link,
.back-link {
  text-decoration: none;
  font-size: var(--font16);
  line-height: 20px;
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightMedium);
}

.multistep-process a.govuk-back-link:focus,
.back-link:focus .multistep-process a.govuk-back-link:active,
.back-link:focus {
  text-decoration: none !important;
}

.multistep-process a.govuk-back-link:hover,
.back-link:hover {
  text-decoration: underline;
  text-underline-offset: 5.5px;
  text-decoration-thickness: 2px;
}

.multistep-process .crmEntityFormView .cell .picklist .forOr {
  line-height: 25px;
}

.multistep-process .crmEntityFormView .cell .picklist .forOr span {
  font-size: var(--font19);
  font-weight: var(--fontWeightLight);
  line-height: 25px;
}

html[dir=ltr] .multistep-process .crmEntityFormView .cell .picklist input[type=radio] + label,
.multistep-process input[type=radio] + label {
  font-size: var(--font19);
  font-weight: var(--fontWeightLight);
  line-height: 25px;
}

.multistep-process label.common-label,
.multistep-process .information-lists label,
.multistep-process h5 {
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
  font-size: var(--font19);
  line-height: 25px;
  float: none !important;
}

.national-insurance-page label.common-label,
.identify-number-page label.common-label {
  font-size: var(--font24);
  line-height: 30px;
}

.multistep-process.members-address .control input.uk-address-fields {
  font-weight: var(--fontWeightBold);
}

#dd_addresses1 .dd-address-div label {
  font-size: var(--font19);
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightRegular);
  line-height: 25px;
}

/*---------NOD- NON-UK Manual Address Step End---------*/
.cancel.btn.btn-default,
.primary.btn.btn-primary,
.btn.btn-default.remove-value {
  font-size: var(--font14);
  line-height: 25px;
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightMedium);
}

/************** Registration Step Form - Part B **********/
.multistep-process .description p,
.multistep-process .description ul li,
.multistep-process p,
.multistep-process ul li,
.multistep-process .govuk-details .govuk-details__summary,
.security-questions .common-checkbox label,
.description ol li {
  font-size: var(--font19);
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightLight);
  line-height: 25px;
}

.multistep-process .govuk-details {
  font-family: var(--fontPrimary);
}

.multistep-process .govuk-details__text {
  font-weight: var(--fontWeightLight);
  line-height: 25px;
}

.multistep-process .govuk-details__summary:focus .govuk-details__summary-text {
  text-decoration: underline;
  text-decoration-thickness: max(3px, 0.1875rem, 0.12em);
}

.multistep-process .govuk-details__summary-text {
  text-underline-offset: 5px;
}

.multistep-process .confirm-container h1,
.multistep-process .unsuccess-container h1 {
  font-family: var(--fontSecondary);
  font-size: var(--font48);
  font-weight: var(--fontWeightBold);
  line-height: 50px;
}

.multistep-process .confirm-container p,
.multistep-process .unsuccess-container p {
  font-family: var(--fontPrimary);
  font-size: var(--font24);
  font-weight: var(--fontWeightLight);
  line-height: 32px;
  text-align: center;
}

.multistep-process .entity-action-button .btn-secondary.submit-btn,
.p60-details .btn-secondary.submit-btn,
.multistep-process .btn-secondary.submit-btn {
  font-weight: bold;
}

.multistep-process .common-checkbox label {
  font-size: var(--font19);
  font-weight: var(--fontWeightLight);
  line-height: 25px;
}

.account-details fieldset input.form-control,
.account-details fieldset select.form-select,
.account-details fieldset textarea.form-control,
.account-details fieldset .input_text,
.multistep-process.address-step .details-column textarea.form-control {
  font-weight: var(--fontWeightLight);
  font-size: var(--font19);
  line-height: 25px;
}

.account-details fieldset .input_text {
  word-break: break-word;
}

.multistep-process.security-questions .msos-label .msos-label-text {
  font-weight: var(--fontWeightLight) !important;
}

/************** NOD css **********/
.multistep-process p b {
  font-weight: var(--fontWeightBold);
}

.multistep-process input[type=text]::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  font-weight: var(--fontWeightLight);
  font-size: var(--font19);
}

.multistep-process input[type=text]::-moz-placeholder {
  /* Firefox 19+*/
  font-weight: var(--fontWeightLight);
  font-size: var(--font19);
}

.multistep-process input[type=text]:-ms-input-placeholder {
  /* IE 10+*/
  font-weight: var(--fontWeightLight);
  font-size: var(--font19);
}

.multistep-process input[type=text]:-moz-placeholder {
  /* Firefox 18- */
  font-weight: var(--fontWeightLight);
  font-size: var(--font19);
}

.multistep-process label.common-label-big,
.multistep-process h4.subheading,
legend.section-title h3,
.unsuccess-container h3 {
  font-size: var(--font24);
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
  line-height: 30px;
}

.tellus-member-page .govuk-details__text p a {
  font-size: var(--font19);
}

.multistep-process.personal-mobileno-page .common-checkbox label,
.multistep-process.personal-landline-page .common-checkbox label {
  font-weight: var(--fontWeightLight);
  font-family: var(--fontPrimary);
  font-size: var(--font19);
  line-height: 25px;
}

.your-address .address-section ul li {
  font-size: var(--font19);
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightMedium);
  line-height: 25px;
}

.your-address .address-section ul li span {
  font-weight: var(--fontWeightBold);
}

span.govuk-error-message {
  font-size: var(--font19);
  line-height: 25px;
  font-weight: var(--fontWeightMedium);
  font-family: var(--fontPrimary);
}

.multistep-process.date-birth-death-page label.common-label-big {
  font-weight: var(--fontWeightMedium);
  line-height: 25px;
  font-family: var(--fontPrimary);
}

.multistep-process label.govuk-date-input__label {
  font-weight: var(--fontWeightMedium);
  line-height: 25px;
  font-family: var(--fontPrimary);
  font-size: var(--font19);
}

.yourdeclaration-page label.common-label-big + p {
  font-size: var(--font19);
  line-height: 25px;
}

.multistep-process.account-details fieldset .table-info .field-label,
.multistep-process.terms-conditions-page .common-checkbox label,
.multistep-process.address-step .details-column label {
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightMedium);
}

.multistep-process.terms-conditions-page .btn-primary.submit-btn.completenodbtn span {
  font-family: var(--fontPrimary);
}

.sessionmodal .modal-body h3.modal-title {
  font-size: var(--font24);
  font-weight: var(--fontWeightBold);
  line-height: 30px;
  font-family: var(--fontSecondary);
}

.multistep-process .modal-body .btn-primary.submit-btn {
  font-size: var(--font16);
  line-height: 20px;
}

.declaration-completed-page a {
  font-size: var(--font19);
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightLight);
  line-height: 25px;
}

.multistep-process.security-ques-page .securityQuestions {
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
  font-size: var(--font19);
  line-height: 25px;
  float: none !important;
}

.create-account-summary-link {
  font-weight: var(--fontWeightBold);
  text-decoration: none !important;
}

.multistep-process .messagebanner-content-box h2 {
  font-size: var(--font48);
  line-height: 50px;
}

.multistep-process .messagebanner-content-box p {
  font-size: var(--font24);
  line-height: 32px;
}

.multistep-process.reset-pwd-fail .messagebanner-content-box h2 {
  font-size: var(--font24);
  line-height: 30px;
}

.multistep-process.reset-pwd-fail .messagebanner-content-box p {
  font-size: var(--font19);
  line-height: 25px;
}

.unsuccess-container .broken-head {
  font-size: 48px !important;
  text-align: center;
}

.multistep-process .broken-para {
  font-size: 24px !important;
  text-align: center !important;
  line-height: 32px !important;
}

/********* EOW start ***********/
ul.pension-allocation-list li label {
  font-size: var(--font19);
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightLight);
  line-height: 25px;
}

.distribute-evenly span {
  font-size: var(--font24);
  font-weight: var(--fontWeightBold);
  font-family: var(--fontSecondary);
  line-height: 30px;
}

.distribute-evenly span.distribute-percentage-outof {
  font-size: var(--font19);
  line-height: 25px;
}

/************************************* Notification Banner CSS ****************************************/
.notification-banner-section-wrapper .govuk-notification-banner__heading,
.mailbox .govuk-notification-banner__heading {
  font-weight: var(--fontWeightBold);
}

.notification-banner-section-wrapper .govuk-body a.govuk-notification-banner__link {
  text-underline-offset: 5.5px;
  text-decoration-thickness: 1.5px;
}

.notification-banner-section-wrapper .govuk-body a.govuk-notification-banner__link:hover {
  text-underline-offset: 5.5px;
  text-decoration-thickness: 2.5px;
}

.notification-banner-section-wrapper .govuk-body a.govuk-notification-banner__link:focus {
  text-underline-offset: 8.5px;
  text-decoration-thickness: 2.5px;
  text-decoration-line: underline;
}

/****************** media query ************************/
@media (max-width: 767px) {
  .notification-banner-section-wrapper .govuk-body a.govuk-notification-banner__link {
    text-underline-offset: 4px;
    text-decoration-thickness: 1px;
  }
  .notification-banner-section-wrapper .govuk-body a.govuk-notification-banner__link:hover {
    text-underline-offset: 4.4px;
    text-decoration-thickness: 1.2px;
  }
  .notification-banner-section-wrapper .govuk-body a.govuk-notification-banner__link:focus {
    text-underline-offset: 5.5px;
    text-decoration-thickness: 1.2px;
  }
}
/********* P60 starts *****************/
.multistep-process p.p60-item-noData {
  font-size: var(--font24);
  line-height: 32px;
}

.p60-certificate-container span {
  font-size: var(--font24);
  line-height: 30px;
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
}

.p60-issuedby-container h3 {
  font-family: var(--fontSecondary);
  font-weight: var(--fontWeightBold);
}

.accordion-body h5 {
  font-size: 24px;
  line-height: 30px;
}

.p60-details .p60-link {
  font-size: var(--font19);
  line-height: 25px;
  font-weight: var(--fontWeightLight);
  font-family: var(--fontPrimary);
}

.p60-details .table-container .table tr th,
.table-container .table tr td {
  font-family: var(--fontPrimary);
  font-size: var(--font19);
  font-weight: var(--fontWeightLight);
  line-height: 25px;
}

.p60-details .table-container .table tr th,
.table-container .table tr td:first-child {
  font-weight: var(--fontWeightMedium);
}

/********* Payslip starts ***********/
.focusedtext {
  font-size: var(--font24);
}

.sortby-select-wrap h5 {
  min-width: 68px;
  font-size: var(--font19) !important;
  line-height: 25px !important;
}

.custom-pagination li a {
  font-size: var(--font19);
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightLight);
  line-height: 25px;
}

.custom-pagination li a:hover {
  text-decoration-thickness: 2px;
  text-underline-offset: 7px;
}

.payslip-page .p60-certificate-container h2 {
  line-height: 30px;
  font-size: var(--font24);
}

.custom-pagination li a.pagelink {
  font-weight: var(--fontWeightMedium);
  text-decoration: none;
}

@media screen and (max-width: 767px) {
  /************ Super User-Contact - Start *************/
  .multistep-process .keycontact-lists ~ .btn-primary.submit-btn {
    font-size: var(--font16);
    line-height: 20px;
  }
  textarea.address-textarea {
    font-size: var(--font16);
    line-height: 20px;
  }
  /************ Super User-Contact - End *************/
  /********* View/Amend Contact detail starts *************/
  .profile-settings fieldset input.form-control::placeholder {
    font-size: var(--font16);
  }
  .amendcontact-final-page.multistep-process .confirm-container h1 {
    font-size: var(--font32);
    line-height: 35px;
  }
  /********* View/Amend Contact detail ends *************/
  /**********mailbox**************/
  .mailbox table tr td,
  .mailbox table tr th {
    white-space: nowrap;
  }
  .file-wrapper .modal-header h1 {
    font-size: 24px;
  }
  .create-portal-message #Subgrid_Document #error-heading {
    word-wrap: break-word;
    white-space: normal;
  }
  .multistep-process .show .modal-header h4 {
    font-size: 24px;
    line-height: 25px;
  }
  /*********mailbox ends **************/
  .multistep-process label.common-label,
  .multistep-process .information-lists label,
  .multistep-process h5 {
    font-size: var(--font16);
    line-height: 20px;
  }
  .multistep-process .confirm-container h1,
  .multistep-process .unsuccess-container h1 {
    font-size: var(--font32);
    line-height: 35px;
  }
  .multistep-process .confirm-container p,
  .multistep-process .unsuccess-container p {
    font-size: var(--font18);
    line-height: 20px;
  }
  /********* Member Landing starts *************/
  .multistep-process .profile-block h2 {
    font-size: var(--font16);
  }
  .circular-percentage {
    font-size: var(--font14);
    line-height: 16px;
  }
  .member-landing-page .change-link {
    font-size: var(--font16);
    line-height: 20px;
  }
  .custom-badge {
    font-size: var(--font16);
    line-height: 20px;
  }
  .profile-block p:last-child,
  .profile-block p:last-child a,
  .dashboard-card-body a.change-link {
    font-size: var(--font14);
    line-height: 16px;
  }
  .dashboard-card-body .history small {
    font-size: var(--font18);
    line-height: 20px;
  }
  .dashboard-card-body .history {
    font-size: var(--font24);
    line-height: 25px;
  }
  .dash-mailbox-lists li * {
    font-size: var(--font14) !important;
    line-height: 16px !important;
  }
  .textual-card label,
  .manage-pension-card p,
  .abs-summary span,
  .beneficiary-detail h6,
  .beneficiary-detail label,
  .dashboard-card-body p {
    font-size: var(--font14) !important;
    line-height: 16px !important;
  }
  .profile-block p.mem-contact,
  .profile-block p.mem-contact a.change-link {
    font-size: var(--font14);
    line-height: 16px;
  }
  .Mailbox-fail p {
    font-size: var(--font18) !important;
    line-height: 20px !important;
  }
  /********* Member Landing ends *************/
  /********* P60 start ***********/
  .p60-details .table-container .table tr th,
  .table-container .table tr td {
    font-size: var(--font16);
    line-height: 20px;
  }
  .p60-certificate-container span {
    font-size: var(--font18);
    line-height: 20px;
  }
  .multistep-process .p60-subs p {
    font-size: var(--font14);
  }
  .multistep-process p.p60-item-noData {
    font-size: var(--font18);
    line-height: 20px;
  }
  .p60-header .change-link {
    font-size: var(--font16);
    line-height: 20px;
  }
  .multistep-process .p60-certificate-inner-container h2 {
    font-size: var(--font18);
    line-height: 20px;
  }
  /********* P60 ends ***********/
  .multistep-process .crmEntityFormView a.govuk-back-link {
    font-size: var(--font14);
    line-height: 16px;
  }
  .multistep-process .description h2,
  .multistep-process h2 {
    font-size: var(--font24);
    line-height: 25px;
  }
  .multistep-process h4.subheading,
  legend.section-title h3 {
    font-size: var(--font18);
    line-height: 20px;
  }
  .multistep-process .description p,
  .multistep-process .description ul li,
  .multistep-process p,
  .multistep-process ul li,
  .default-font {
    font-size: var(--font16);
    line-height: 20px;
  }
  .tellus-member-page .govuk-details__text p a {
    font-size: var(--font16);
  }
  .multistep-process label.common-label,
  .multistep-process label.govuk-date-input__label {
    font-size: var(--font16);
    line-height: 20px;
  }
  .multistep-process .crmEntityFormView .mail-archive,
  .multistep-process .crmEntityFormView .mail-send-reply,
  .multistep-process .crmEntityFormView .modal-cancel-button,
  .multistep-process .crmEntityFormView #cancel-link {
    font-size: var(--font16);
    line-height: 20px;
  }
  .multistep-process label.common-label-big {
    font-size: var(--font18);
    line-height: 20px;
  }
  html[dir=ltr] .multistep-process .crmEntityFormView .cell .picklist input[type=radio] + label,
  .multistep-process input[type=radio] + label {
    font-size: var(--font16);
    line-height: 20px;
  }
  .multistep-process.psn-urn-page label.common-label {
    font-size: var(--font19);
    line-height: 25px;
  }
  .multistep-process.psn-urn-page p {
    font-size: var(--font19);
    line-height: 25px;
  }
  .account-details fieldset input.form-control,
  .account-details fieldset select.form-select,
  .account-details fieldset textarea.form-control {
    line-height: 20px;
    font-size: var(--font16);
  }
  .account-details fieldset .details-column input.form-control,
  .account-details fieldset .details-column select.form-select,
  .account-details fieldset .details-column textarea.form-control,
  .account-details fieldset .input_text {
    font-size: var(--font16);
    line-height: 20px;
  }
  .multistep-process.account-details fieldset .table-info .field-label {
    line-height: 20px;
    font-size: var(--font16);
  }
  .details-column .change-link,
  .multistep-process.account-details .description h3 {
    line-height: 20px;
    font-size: var(--font16);
  }
  .sessionmodal .modal-body h3.modal-title {
    font-size: var(--font18);
    line-height: 20px;
  }
  .multistep-process .confirm-container h1 {
    font-size: var(--font36);
    line-height: 40px;
  }
  .multistep-process .messagebanner-content-box h2 {
    font-size: var(--font32);
    line-height: 35px;
  }
  .multistep-process .messagebanner-content-box p {
    font-size: var(--font18);
    line-height: 20px;
  }
  .account-logged p {
    font-size: var(--font14);
    line-height: 16px;
  }
  /************Employer Registration**************/
  .employerregisterpage.multistep-process .confirm-container h1 {
    font-size: var(--font32);
    line-height: 35px;
  }
  .employerregisterpage.multistep-process .confirm-container p {
    font-size: var(--font18);
    line-height: 20px;
  }
  /************Employer Registration**************/
  /********* EOW start ***********/
  ul.pension-allocation-list li label {
    font-size: var(--font16);
    line-height: 20px;
  }
  .expression-wish-page h4.subheading {
    font-size: var(--font24);
    line-height: 30px;
  }
  .multistep-process a.govuk-back-link.custom-back {
    font-size: var(--font14);
    line-height: 16px;
  }
  .multistep-process .eow-container .govuk-details .govuk-details__summary {
    font-size: var(--font16);
    line-height: 20px;
  }
  .eow-nobeneficiary .govuk-details__text p .change-link {
    font-size: var(--font16);
    line-height: 20px;
  }
  .expression-wish-page h4.subheading.mb-32.mt-32 {
    font-size: var(--font18);
    line-height: 20px;
  }
  /********* EOW end ***********/
  /********* Logout journey starts ***********/
  .logout-journey .emp-container h2 {
    font-size: var(--font32);
    line-height: 35px;
  }
  .logout-journey .emp-container p {
    font-size: var(--font18);
    line-height: 20px;
  }
  /********* Logout journey ends ***********/
  /********* Payslip starts ***********/
  .payslip-page .p60-certificate-container h2 {
    line-height: 20px;
    font-size: var(--font18);
  }
  .accordion-p60-heading h4.change-link {
    font-size: var(--font16);
    line-height: 20px;
  }
  /********* Payslip ends ***********/
  /********* create-portal-message  Media Query starts *************/
  .create-portal-message .create-message-form-wrap .prev_msg {
    word-wrap: break-word;
    white-space: normal;
  }
  .create-portal-message .create-message-form-wrap #EntityFormView .field-label,
  .create-portal-message .create-message-form-wrap span.govuk-error-message {
    font-size: var(--font16);
    line-height: 20px;
    white-space: normal;
  }
  .create-portal-message .create-message-form-wrap #com_subject {
    font-size: var(--font16);
    font-weight: var(--fontWeightLight);
    line-height: 20px;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  .create-portal-message .create-message-form-wrap .title-date-wrap .default-heading {
    font-size: var(--font24) !important;
    line-height: 25px !important;
  }
  .mailbox #Subgrid_Document thead th a {
    line-height: 16px;
    font-size: var(--font14);
    font-weight: var(--fontWeightBold);
  }
  .create-portal-message .create-message-form-wrap .cust-file-upload table.table td {
    white-space: normal;
  }
  /********* create-portal-message Media Query ENDS *************/
  /********* User Access Management Media Query STARTS *************/
  .amend-access .default-heading,
  .check-details .default-heading {
    font-size: var(--font24) !important;
    line-height: 25px !important;
  }
  .user-access-management .entitylist-search input.query {
    font-size: var(--font16) !important;
    line-height: 20px;
  }
  .user-access-management th a {
    font-weight: var(--fontWeightBold) !important;
  }
  .user-access-management th a,
  .user-access-management td a {
    white-space: nowrap;
  }
  .user-access-management .change-link,
  .amend-access .change-link,
  .information-verify .change-link,
  .check-details .change-link,
  .create-access-level .change-link,
  .create-access fieldset .table-info .field-label {
    font-size: var(--font16);
    line-height: 20px;
  }
  .check-details.multistep-process fieldset .table-info .field-label {
    font-weight: var(--fontWeightBold);
  }
  .remove-access label.govuk-date-input__label,
  .remove-access .tab-label {
    font-weight: var(--fontWeightBold);
  }
  .remove-access .summary-label {
    font-size: var(--font18);
    line-height: 20px;
  }
  /********* User Access Management Media Query ENDS *************/
}
@media screen and (max-width: 374px) {
  .multistep-process.terms-conditions-page .entity-action-button #NextButton {
    font-size: var(--font16);
  }
  .multistep-process.terms-conditions-page .entity-action-button .btn-secondary.submit-btn,
  .multistep-process.terms-conditions-page .btn-primary.submit-btn.completenodbtn {
    font-size: var(--font16);
  }
}
.securityquestion-failure p,
.securityquestion-failure p a {
  font-weight: var(--fontWeightMedium);
  font-size: var(--font19);
  font-family: var(--fontPrimary);
  line-height: 25px;
}

.sidebar-accordion .govuk-accordion__section-heading-text a {
  text-decoration: none;
  font-family: var(--fontSecondary);
}

.sidebar-accordion .collapsible-content a {
  text-decoration: none;
  font-family: var(--fontSecondary);
}

/******** Spinner start ****/
.hideElement {
  display: none;
}

#divSpinner {
  text-align: center;
}

.spinner {
  animation: spin 2s linear infinite;
  transform-origin: center;
  width: 50px;
  height: 50px;
  color: blue;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
/******** Spinner end ****/
/************ Super User-Contact - Start *************/
.keycontact-lists ul li {
  font-weight: var(--fontWeightSemiBold);
}

.hideshow-icon {
  font-size: 12px;
}

.smalllinks {
  font-weight: var(--fontWeightLight);
  font-size: var(--font19);
  line-height: 25px;
  font-family: var(--fontPrimary);
}

.address-textarea {
  font-size: var(--font19);
}

/************ Super User-Contact - End *************/
/********* User Access Management STARTS **********/
.user-access-management .entitylist-search input.query {
  font-family: var(--fontPrimary);
  font-weight: var(--fontWeightLight);
  line-height: 25px;
  font-size: var(--font19) !important;
}

.user-access-management .entitylist-search .input-group-btn .btn-default .fa-search {
  font-size: 23.43px;
}

.user-access-management #record-info {
  font-weight: var(--fontWeightSemiBold);
}

.check-details.multistep-process fieldset .table-info .field-label {
  font-weight: var(--fontWeightSemiBold);
}

.create-access #com_firstname,
.create-access #com_lastname {
  font-weight: var(--fontWeightLight);
}

.check-details .change-link {
  font-size: var(--font16);
  line-height: 20px;
}

.remove-access label.govuk-date-input__label,
.remove-access .tab-label {
  font-weight: var(--fontWeightSemiBold);
}

.remove-access .summary-label {
  font-family: var(--fontSecondary);
  font-size: var(--font24);
  line-height: 30px;
  font-weight: var(--fontWeightBold);
}

/**
 * CSPS specific overrides 
 * This file contains styles that are specific to the CSPS .
 */
header .govuk-header__logo img {
  width: 126px;
  height: auto;
}

.help-section-wrapper .custom-card__content .govuk-hint {
  font-weight: var(--fontWeightBold);
}