/*================================================================================================== TABLE OF CONTENTS ==================================================================================================
    1. Variables
    2. Utility classes
    3. Global styles
        3a) Headings        3b) Links        3c) Buttons
        3d) Lists            3e) Popups        3f) Tab selectors
        3g) Accordions        3h) Info icons, slider toggles and label styling
        3i) Logo                3j) Site header
        3k) Site footer    3l) Datepickers
        3m) Inputs 3n) Tables
    4. Login page
    5. Home page
    6. Benefit overview
    7. Benefit statement
    8. Benefit matrix
    9. Benefit selection
    10. Profile
    11. App registration
    12. TRS
    13. Specific popups
        13a) Forgot password        13b) Modellers and tools    13c) Manage dependants
        13d) Follow up items        13e) Event T&Cs                13f) benefit selection election info collect
        13g) Beneficiaries
    14. Icons
        14a) Benefit icons        14b) Life event icons
    15. Claims
16. My Documents
17. Document Download
    18. Mobile
    19. Client specific styles
======================================================================================================================================================================================================================= */
/* font declaration for using OnlineTwoIconFont set
'inspiringbenefits' is the new UK only demo client */
/*Font changes for 2018 */

@font-face {
font-family: Source2SansPro_stdlight;
src: url(/Aviva/media/default/Fonts/SourceSansPro-LightIt.eot);
src: url(/Aviva/media/default/Fonts/SourceSansPro-LightIt.eot?#iefix) format('embedded-opentype'),
url(/Aviva/media/default/Fonts/SourceSansPro-LightIt-otf.woff2) format('woff2'),
url(/Aviva/media/default/Fonts/SourceSansPro-Light-otf.woff2) format('woff2'),
url(/Aviva/media/default/Fonts/SourceSansPro-LightItalic.ttf) format('truetype'),
url(/Aviva/media/default/Fonts/SourceSansPro-Light.ttf) format('truetype'),
url(/Aviva/media/default/Fonts/SourceSansPro-ExtraLight.ttf) format('truetype');
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: SourceSansPro_stdlight;
font-style: normal;
font-weight: 400;
src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'), url(https://fonts.gstatic.com/s/sourcesanspro/v11/6xK3dSBYKcSV-LCoeQqfX1RYOo3qOK7j.woff) format('woff');
}

@font-face {
font-family: SourceSansPro_stdbold;
src: url(/Aviva/media/default/Fonts/SourceSansPro-Bold.eot);
src: url(/Aviva/media/default/Fonts/SourceSansPro-Bold.eot?#iefix) format('embedded-opentype'),
url(/Aviva/media/default/Fonts/SourceSansPro-Bold-otf.woff2) format('woff2'),
url(/Aviva/media/default/Fonts/SourceSansPro-BoldIt-ttf.woff2) format('woff2'),
url(/Aviva/media/default/Fonts/SourceSansPro-BoldIt-ttf.woff2) format('truetype');
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: SourceSansPro_stdSemibold;
src: url(/Aviva/media/default/Fonts/SourceSansPro-Semibold.eot);
src: url(/Aviva/media/default/Fonts/SourceSansPro-Semibold.eot?#iefix) format('embedded-opentype'),
url(/Aviva/media/default/Fonts/SourceSansPro-SemiboldIt-ttf.woff2) format('woff2'),
url(/Aviva/media/default/Fonts/SourceSansPro-Semibold-ttf.woff2) format('woff2'),
url(/Aviva/media/default/Fonts/SourceSansPro-SemiboldIt-ttf.woff2) format('truetype'),
url(/Aviva/media/default/Fonts/SourceSansPro-Semibold.ttf) format('truetype');
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: SourceSansPro_ExtraLight;
src: url(/Aviva/media/default/Fonts/SourceSansPro-ExtraLightIt.eot);
src: url(/Aviva/media/default/Fonts/SourceSansPro-ExtraLight.eot?#iefix) format('embedded-opentype'),
url(/Aviva/media/default/Fonts/SourceSansPro-ExtraLightIt-ttf.woff2) format('woff2'),
url(/Aviva/media/default/Fonts/SourceSansPro-ExtraLight-ttf.woff2) format('woff2'),
url(/Aviva/media/default/Fonts/SourceSansPro-ExtraLight.ttf) format('truetype');
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: 'OnlineTwoIconFont';
src: url('/inspiringbenefits/media/default/fonts/OnlineTwoIconFont_v3.eot');
src: url('/inspiringbenefits/media/default/fonts/OnlineTwoIconFont_v3.eot?#iefix') format('embedded-opentype'),
url('/inspiringbenefits/media/default/fonts/OnlineTwoIconFont_v3.woff') format('woff'),
url('/inspiringbenefits/media/default/fonts/OnlineTwoIconFont_v3.ttf') format('truetype'),
url('/inspiringbenefits/media/default/fonts/OnlineTwoIconFont_v3.svg') format('svg');
font-weight: normal;
font-style: normal;
}
/* set font throughout the site */
.ui-widget,
.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button,
html,
button,
input,
select,
textarea,
.mfp-close,
.bootstrap-iso,
.bootstrap-iso .tooltip,
.bootstrap-iso .popover,
.ui-buttonset .ui-button,
body,
.page-title H1,
H1,
H2,
#links LI:first-child select#ddlLanguage,
.help-ico A,
.spanDivSlider,
.spanDivAmount,
#delegateDiv .ui-widget,
#delegateDiv .ui-widget input,
#delegateDiv .ui-widget select,
#delegateDiv .ui-widget textarea,
#delegateDiv .ui-widget button,
.online-two-iso body,
.online-two-iso .modal-large .modal-body,
.online-two-iso .modal-large .tab-header,
.benefitselect .in-Cart .you-pay H3 {
font-family: SourceSansPro_stdlight;
}
body{color: #000 !important;}

/*================================================================================================== 1. Variables ==================================================================================================*/
:root {
--accessibility-outline: #666;
--heading-color: #666;
--button-color: #4dfff3;
--button-color-alternate: #4dfff3;
--button-text-color: #000;
--button-hover-color: #52ffb8;
--button-hover-text-color: #000;
--button-click-color: #005A6C;
--button-click-text-color: #000;
--link-text-color: #525174;
--link-text-hover-color: #513b56;
--link-text-click-color: #005A6C;
--box-shadow: 5px 0 10px rgba(0,0,0,.2), -5px 0 10px rgba(0,0,0,.2);
--header-overlay: #525174;
--header-overlay-text-color: #fff;
--panel-color: #513b56;
--panel-text-color: #fff;
--info-icon-color: #525174;
--tab-selector-text-color: #513b56;
--tab-selector-border-color: #513b56;
--tab-selector-inactive-text-color: #666;
--progress-bar-color: #408391;
--success-icon-color: #408391;
--unordered-list-bullet-color: #525174;
--datepicker-today: #4dfff3;
--datepicker-clear: #4dfff3;
--datepicker-close: #4dfff3;
--slider-toggle-color: #539987;
--benefit-icon-color: #000;
--linegroup1-benefit-icon-color: #a9a9a9;
--linegroup2-benefit-icon-color: #a9a9a9;
--linegroup3-benefit-icon-color: #a9a9a9;
--life-event-background: #525174;
--logo: url(/Aviva/media/default/Aviva%202022/Login%20Page/Logo_horizontal.svg);
--login-image: url(/Aviva/media/default/Aviva%202022/Login%20Page/Aviva-loginpage-image.png);
--site-header-color: #525174;
--site-header-icon-color: #fff;
--site-footer-color: #513b56;
--site-footer-link-color: #fff;
--need-assistance-pull-down-menu: #513b56;
--homepage-module-background-color: #f2f2f2;
--homepage-module-enrolment-background-color: linear-gradient(to bottom right, #E7589A, #ED694D);
--homepage-module-benefit-statement-background-color: #3C3C3B;
--homepage-module-well-one-background-color: #3C3C3B;
--homepage-module-well-one-money-background-color: linear-gradient(to bottom right, #6BBFA7, #9DD1CC);
--homepage-heading-color: #666;
--homepage-module-icon-color: #525174;
--homepage-enrolment-days-left-color: #525174;
--carousel-heading-color: #fff;
--carousel-text-color: #fff;
--pulse-color-start: rgba(47, 79, 79, 0.5);
--pulse-color-end: rgba(47, 79, 79, 0);
--selected-email-color: #2f4f4f;
--benefit-selection-elected-box-highlight: #75bf71;
--benefit-selected-tick-mark: #fff;
--follow-up-panel-color: #539987;
--mobile-menu-icon-color: #fff;
--mobile-menu-link-color: #666;
}

@-webkit-keyframes shadow-pulse {
0% {
box-shadow: 0 0 0 0px rgba(47, 79, 79, 0.5);
}
100% {
box-shadow: 0 0 0 10px rgba(47, 79, 79, 0);
}
}

@keyframes shadow-pulse {
0% {
box-shadow: 0 0 0 0px rgba(47, 79, 79, 0.5);
}
100% {
box-shadow: 0 0 0 10px rgba(47, 79, 79, 0);
}
}
span.label, label {
font-size: 14px;
}
/*================================================================================================== 2. Utility classes ==================================================================================================*/
/* specific media query for IE10+ to handle responsive images */
@media screen and (-ms-high-contrast: active),
screen and (-ms-high-contrast: none) {
.bootstrap-iso .img-responsive {
width: 100%;
}
}
/* margin-top 0 */
.bootstrap-iso .mt-0 {
margin-top: 0;
}

/* allow use of OnlineTwoIconFont for anything with this class */
[class*='online-two-icon-']:before {
font-family: OnlineTwoIconFont;
}
/* icons on the benefit intro popups */
.benefit-information [class*='online-two-icon-']::before {
font-size: 15rem;
line-height: 1;
}

/* for adding full stop after resource string */
.full-stop:after {
content: '.';
position: relative;
left: -0.25em;
}
/* for adding comma after resource string */
.comma:after {
content: ',';
position: relative;
left: -0.25em;
}

/*================================================================================================== 3. Global styles ==================================================================================================*/
/* remove gradient background */
html {
background: none;
}
/* global font size */
.bootstrap-iso {
font-size: 1rem;
color: #000;
}
.bootstrap-iso p {
padding-bottom: 0;
}
/* remove text transform */
/* language selection */
#links LI:first-child select#ddlLanguage,
/* main navigation bar links */
#menu-no-dashboard li a,
#menu li a,
#menu-sub li a,
/* labels on Profile page */
html#profile body#profile .profile #profile-online-2 span.label,
html#profile body#profile .profile #profile-online-2 label:not(.ui-button),
/* labels */
span.label,
label,
/* benefit selection page items */
.in-Cart .cost P,
.in-Cart .funded P,
.your-beneficiaries .txt-beneficiaries H4,
/* footer links */
.online-two-iso #footer a {
text-transform: none;
}
.home-module-integrated .arrowright .right-icon, .home-module-integrated .arrowleft .left-icon {
top: 20px;
}
.benefitselect H1 {text-transform: capitalize;
}
.online-two-iso #footer div:not(:first-of-type) a {
border-left: 1px solid #fff;}
.online-two-iso #footer div a {
padding-right: 12px;
}
/* 3a) headings */
h1,
h2,
h3,
h4,
h5,
h6,
.online-two-iso h1,
.online-two-iso h2,
.online-two-iso h3,
.online-two-iso h4,
.online-two-iso h5,
.online-two-iso h6,
.bootstrap-iso h1,
.bootstrap-iso h2,
.bootstrap-iso h3,
.bootstrap-iso h4,
.bootstrap-iso h5,
.bootstrap-iso h6,
.bootstrap-iso .h1,
.bootstrap-iso .h2,
.bootstrap-iso .h3,
.bootstrap-iso .h4,
.bootstrap-iso .h5,
.bootstrap-iso .h6,
/* BENEFITS header on popup when removing dependants attached to cover */
.coverageHeader {
color: #000;
padding-left: 0;
}
/* 3b) links */
a,
.bootstrap-iso a,
.dependant-list a.dependant-confirm-delete,
.terms-conditions-cookies .cookie-policy-link,
.terms-conditions-cookies .term-condtion-link {
color: #000;
text-decoration: none;
font-weight: bold;
}
.modal-content .modal-body .tab-body a,.followup-item-collect .followup-item-coverage-heading span > a, .followup-content .followup-collect .followup-item-description > a, .litLegalContent a,
#HoverPageStyle a, #step2LinePage #content #linedata p a, #followup-items-overlay .followup-collect .followup-item-input label:not(.checkboxLabel) a, .followup-item-description.ng-binding a,
.followup-item-coverage-heading.ng-scope a {
text-decoration: underline;}
.followup-item-coverage-heading.ng-scope {
line-height: 1.3;
}
a:hover,
a:focus,
.bootstrap-iso a:hover,
.bootstrap-iso a:focus,
.dependant-list a.dependant-confirm-delete:hover,
.dependant-list a.dependant-confirm-delete:focus,
.terms-conditions-cookies .cookie-policy-link:hover,
.terms-conditions-cookies .cookie-policy-link:focus,
.terms-conditions-cookies .term-condtion-link:hover,
.terms-conditions-cookies .term-condtion-link:focus {
color: #000;
text-decoration: underline;
font-weight: bold;
}
.bootstrap-iso a:focus,
.dependant-list a.dependant-confirm-delete:focus,
.terms-conditions-cookies .cookie-policy-link:focus,
.terms-conditions-cookies .term-condtion-link:focus {
outline: 3px solid #666;
}
a:active,
a:active:hover,
a:active:focus,
.bootstrap-iso a:active,
.bootstrap-iso a:active:hover,
.bootstrap-iso a:active:focus,
.dependant-list a.dependant-confirm-delete:active,
.dependant-list a.dependant-confirm-delete:active:hover,
.dependant-list a.dependant-confirm-delete:active:focus,
.terms-conditions-cookies .cookie-policy-link:active,
.terms-conditions-cookies .cookie-policy-link:active:hover,
.terms-conditions-cookies .cookie-policy-link:active:focus,
.terms-conditions-cookies .term-condtion-link:active,
.terms-conditions-cookies .term-condtion-link:active:hover,
.terms-conditions-cookies .term-condtion-link:active:focus {
color: #000;
}

/* 3c) buttons */
/* default colour */
.bootstrap-iso .btn-primary,
.bootstrap-iso .btn-danger,
.bootstrap-iso .btn-info,
.bootstrap-iso .btn-warning,
.bootstrap-iso .btn-success,
.bootstrap-iso .btn-popup,
.online-two-iso A.button-style,
.online-two-iso #content #confirm-replacement.overlay .content-overlay .checkout-button A.button-style.blue,
.online-two-iso A.button-style.blue,
.online-two-iso #content #confirm-replacement.overlay .content-overlay .checkout-button A.button-style.gray,
.online-two-iso A.button-style.gray,
.benefitheader-fixed div#followup-items a.btn,
.benefitheader-fixed div#resettodefaults a.btn,
.benefit-matrix .confirm-checkout-button .btn-success,
.btn.btn-info.claim-acknowledgment-print {
background-color: #ffd900;
border-radius: 30px;
color: #1841a9;
overflow: hidden;
position: relative;
transition: all 0.25s;
border: 2px solid #ffd900;
width: 9rem;
font-family: SourceSansPro_stdbold;
}
bootstrap-iso .btn-default,
.btn.btn-default {
background-color: #ffd900;
border: 2px solid #ffd900;
border-radius: 30px;
color: #1841a9;
overflow: hidden;
position: relative;
transition: all 0.25s;
width: 90%;
font-family: SourceSansPro_stdbold;
}
/* secondary button */
#login-assistance .button-style.gray,
.active-benefits .btn-warning,
#exit-cancel A.button-style.blue,
#contactTabContactPreferences .button-style.gray,
.benefit-matrix #followup-items-overlay .followup-content .button-style.gray,
.benefit-matrix .coverage-pannel .btn-warning {
background-color: #fff;
color: #1841a9;
border: 2px solid #1841a9;
border-radius: 20px;
font-family: SourceSansPro_stdbold;
}
/* buttons */
#login-assistance .button-style.blue:hover,
#login-assistance .button-style.blue:focus,
#login-assistance .button-style.blue:active,
#login-assistance .button-style.blue:active:hover,
#login-assistance .button-style.blue:active:focus,
#login-assistance .button-style.gray:hover,
#login-assistance .button-style.gray:focus,
#login-assistance .button-style.gray:active,
#login-assistance .button-style.gray:active:hover,
#login-assistance .button-style.gray:active:focus,
.active-benefits .btn-success:hover,
.active-benefits .btn-success:focus,
.active-benefits .btn-success:active,
.active-benefits .btn-success:active:hover,
.active-benefits .btn-success:active:focus,
.active-benefits .btn-warning:hover,
.active-benefits .btn-warning:focus,
.active-benefits .btn-warning:active,
.active-benefits .btn-warning:active:hover,
.active-benefits .btn-warning:active:focus,
#exit-continue A.button-style.blue:hover,
#exit-cancel A.button-style.blue:hover,
#exit-cancel A.button-style.blue:focus,
#exit-cancel A.button-style.blue:active,
#exit-cancel A.button-style.blue:active:hover,
#exit-cancel A.button-style.blue:active:focus,
.btn.btn-warning.btn-print:hover,
.btn.btn-warning.btn-print:focus,
.btn.btn-warning.btn-print:active,
.btn.btn-warning.btn-print:active:hover,
.btn.btn-warning.btn-print:active:focus,
#contactTabContactPreferences .button-style.green:hover,
#contactTabContactPreferences .button-style.green:focus,
#contactTabContactPreferences .button-style.green:active,
#contactTabContactPreferences .button-style.green:active:hover,
#contactTabContactPreferences .button-style.green:active:focus,
#contactTabContactPreferences .button-style.gray:hover,
#contactTabContactPreferences .button-style.gray:focus,
#contactTabContactPreferences .button-style.gray:active,
#contactTabContactPreferences .button-style.gray:active:hover,
#contactTabContactPreferences .button-style.gray:active:focus,
.benefit-matrix #followup-items-overlay .followup-content .button-style.blue:hover,
.benefit-matrix #followup-items-overlay .followup-content .button-style.blue:focus,
.benefit-matrix #followup-items-overlay .followup-content .button-style.blue:active,
.benefit-matrix #followup-items-overlay .followup-content .button-style.blue:active:hover,
.benefit-matrix #followup-items-overlay .followup-content .button-style.blue:active:focus,
.benefit-matrix #followup-items-overlay .followup-content .button-style.gray:hover,
.benefit-matrix #followup-items-overlay .followup-content .button-style.gray:focus,
.benefit-matrix #followup-items-overlay .followup-content .button-style.gray:active,
.benefit-matrix #followup-items-overlay .followup-content .button-style.gray:active:hover,
.benefit-matrix #followup-items-overlay .followup-content .button-style.gray:active:focus,
.benefit-matrix .coverage-pannel .btn-warning:hover,
.benefit-matrix .coverage-pannel .btn-warning:focus,
.benefit-matrix .coverage-pannel .btn-warning:active,
.benefit-matrix .coverage-pannel .btn-warning:active:hover,
.benefit-matrix .coverage-pannel .btn-warning:active:focus,
.benefit-matrix .coverage-pannel .btn-success:hover,
.benefit-matrix .coverage-pannel .btn-success:focus,
.benefit-matrix .coverage-pannel .btn-success:active,
.benefit-matrix .coverage-pannel .btn-success:active:hover,
.benefit-matrix .coverage-pannel .btn-success:active:focus,
.benefit-matrix #followup-items-overlay .followup-content .button-style.blue#follow-up-previous-bttn:hover,
.benefit-matrix #followup-items-overlay .followup-content .button-style.blue#follow-up-previous-bttn:focus,
.benefit-matrix #followup-items-overlay .followup-content .button-style.blue#follow-up-previous-bttn:active,
.benefit-matrix #followup-items-overlay .followup-content .button-style.blue#follow-up-previous-bttn:active:hover,
.benefit-matrix #followup-items-overlay .followup-content .button-style.blue#follow-up-previous-bttn:active:focus {
background-color: #1841a9;
border: 2px solid #1841a9;
color: #fff;
border-radius: 30px;
width: 9rem;
}
/* hover colour */
.bootstrap-iso .btn-primary:hover,
.bootstrap-iso .btn-danger:hover,
.bootstrap-iso .btn-info:hover,
.bootstrap-iso .btn-warning:hover,
.bootstrap-iso .btn-success:hover,
.bootstrap-iso .btn-popup:hover,
.online-two-iso A.button-style:hover,
.online-two-iso #content #confirm-replacement.overlay .content-overlay .checkout-button A.button-style.blue:hover,
.online-two-iso A.button-style.blue:hover,
.online-two-iso #content #confirm-replacement.overlay .content-overlay .checkout-button A.button-style.gray:hover,
.online-two-iso A.button-style.gray:hover,
.benefit-matrix .row .btn-success:hover,
.benefitheader-fixed div#followup-items a.btn:hover,
.benefitheader-fixed div#resettodefaults a.btn:hover,
.benefit-matrix .confirm-checkout-button .btn-success:hover,
.btn.btn-info.claim-acknowledgment-print:hover {
background-color: #1841a9;
border-radius: 30px;
box-shadow: none;
color: #fff;
border: 2px solid #1841a9;
width: 9rem;
}
/* focus colour */
.bootstrap-iso .btn-primary:focus,
.bootstrap-iso .btn-danger:focus,
.bootstrap-iso .btn-info:focus,
.bootstrap-iso .btn-default:focus,
.bootstrap-iso .btn-warning:focus,
.bootstrap-iso .btn-success:focus,
.bootstrap-iso .btn-popup:focus,
.online-two-iso A.button-style:focus,
.online-two-iso #content #confirm-replacement.overlay .content-overlay .checkout-button A.button-style.blue:focus,
.online-two-iso A.button-style.blue:focus,
.online-two-iso #content #confirm-replacement.overlay .content-overlay .checkout-button A.button-style.gray:focus,
.online-two-iso A.button-style.gray:focus,
.benefitheader-fixed div#followup-items a.btn:focus,
.benefitheader-fixed div#resettodefaults a.btn:focus,
.benefit-matrix .confirm-checkout-button .btn-success:focus,
.btn.btn-info.claim-acknowledgment-print:focus {
background-color: #1841a9;
border-radius: 30px;
border: none;
box-shadow: none;
color: #fff;
outline: 2px solid #666;
width: 9rem;
border: 2px solid #1841a9;
}
/* when clicked colour */
.bootstrap-iso .btn-primary:active,
.bootstrap-iso .btn-primary:active:hover,
.bootstrap-iso .btn-primary:active:focus,
.bootstrap-iso .btn-danger:active,
.bootstrap-iso .btn-danger:active:hover,
.bootstrap-iso .btn-danger:active:focus,
.bootstrap-iso .btn-info:active,
.bootstrap-iso .btn-info:active:hover,
.bootstrap-iso .btn-info:active:focus,
.bootstrap-iso .btn-default:active,
.bootstrap-iso .btn-default:active:hover,
.bootstrap-iso .btn-default:active:focus,
.bootstrap-iso .btn-warning:active,
.bootstrap-iso .btn-warning:active:hover,
.bootstrap-iso .btn-warning:active:focus,
.bootstrap-iso .btn-success:active,
.bootstrap-iso .btn-success:active:hover,
.bootstrap-iso .btn-success:active:focus,
.bootstrap-iso .btn-popup:active,
.bootstrap-iso .btn-popup:active:hover,
.bootstrap-iso .btn-popup:active:focus,
.online-two-iso A.button-style:active,
.online-two-iso A.button-style:active:hover,
.online-two-iso A.button-style:active:focus,
.online-two-iso #content #confirm-replacement.overlay .content-overlay .checkout-button A.button-style.blue:active,
.online-two-iso #content #confirm-replacement.overlay .content-overlay .checkout-button A.button-style.blue:active:hover,
.online-two-iso #content #confirm-replacement.overlay .content-overlay .checkout-button A.button-style.blue:active:focus,
.online-two-iso A.button-style.blue:active,
.online-two-iso A.button-style.blue:active:hover,
.online-two-iso A.button-style.blue:active:focus,
.online-two-iso #content #confirm-replacement.overlay .content-overlay .checkout-button A.button-style.gray:active,
.online-two-iso #content #confirm-replacement.overlay .content-overlay .checkout-button A.button-style.gray:active:hover,
.online-two-iso #content #confirm-replacement.overlay .content-overlay .checkout-button A.button-style.gray:active:focus,
.online-two-iso A.button-style.gray:active,
.online-two-iso A.button-style.gray:active:hover,
.online-two-iso A.button-style.gray:active:focus,
.benefitheader-fixed div#followup-items a.btn:active,
.benefitheader-fixed div#followup-items a.btn:active:hover,
.benefitheader-fixed div#followup-items a.btn:active:focus,
.benefitheader-fixed div#resettodefaults a.btn:active,
.benefitheader-fixed div#resettodefaults a.btn:active:hover,
.benefitheader-fixed div#resettodefaults a.btn:active:focus,
.benefit-matrix .confirm-checkout-button .btn-success:active,
.benefit-matrix .confirm-checkout-button .btn-success:active:hover,
.benefit-matrix .confirm-checkout-button .btn-success:active:focus
.btn.btn-info.claim-acknowledgment-print:active,
.btn.btn-info.claim-acknowledgment-print:active:hover,
.btn.btn-info.claim-acknowledgment-print:active:focus {
background-color:#1841a9;
border-radius: 30px;
border: none;
box-shadow: none;
color: #fff;
outline: 2px solid #666;
border: 2px solid #1841a9;
width: 9rem;
}
/* for styling buttons that convey meaning of a negative action e.g. cancel/close/remove etc. */
.bootstrap-iso .modal-controls .btn-warning,
.online-two-iso A.button-style.gray,
.bootstrap-iso .modeller-footer .modeller-close-button.btn-warning,
.bootstrap-iso .btn-warning.dependant-cancel-btn {
color: #1841a9;
}
.content-overlay .cancel-button .button-style{
min-width: auto;
}
.online-two-iso #exit-cancel A.button-style.blue {
background-color: #fff;
}
.bootstrap-iso .modal-controls .btn-warning:hover,
.bootstrap-iso .modal-controls .btn-warning:focus,
.online-two-iso #exit-cancel A.button-style.blue:hover,
.online-two-iso #exit-cancel A.button-style.blue:focus,
.bootstrap-iso .modeller-footer .modeller-close-button.btn-warning:hover,
.bootstrap-iso .modeller-footer .modeller-close-button.btn-warning:focus,
.bootstrap-iso .btn-warning.dependant-cancel-btn:hover,
.bootstrap-iso .btn-warning.dependant-cancel-btn:focus {
background-color: #1841a9;
color: #fff;
}
.bootstrap-iso .modal-controls .btn-warning:active,
.bootstrap-iso .modal-controls .btn-warning:active:hover,
.bootstrap-iso .modal-controls .btn-warning:active:focus,
.online-two-iso #exit-cancel A.button-style.blue:active,
.online-two-iso #exit-cancel A.button-style.blue:active:hover,
.online-two-iso #exit-cancel A.button-style.blue:active:focus,
.bootstrap-iso .modeller-footer .modeller-close-button.btn-warning:active,
.bootstrap-iso .modeller-footer .modeller-close-button.btn-warning:active:hover,
.bootstrap-iso .modeller-footer .modeller-close-button.btn-warning:active:focus,
.bootstrap-iso .btn-warning.dependant-cancel-btn:active,
.bootstrap-iso .btn-warning.dependant-cancel-btn:active:hover,
.bootstrap-iso .btn-warning.dependant-cancel-btn:active:focus {
background-color: #1841a9;
color: #fff;
}

/* hover effects */
.bootstrap-iso *[class*='btn btn-']:before,
.bootstrap-iso *[class*='btn btn-']:before,
.bootstrap-iso *[class*='button-s']:before {
content: '';
width: 100%;
height: 4em;
background-color: #1841a9;
position: absolute;
top: 0;
left: 0;
transform: translate3d(-5em, -1em, 0) rotate3d(0, 0, 1, -45deg);
transform-origin: top left;
transition: all 0.25s;
z-index: -1;
}
.bootstrap-iso *[class*='btn btn-']:hover:before,
.bootstrap-iso *[class*='btn btn-']:hover:before,
.bootstrap-iso *[class*='button-s']:hover:before,
.bootstrap-iso *[class*='btn btn-']:focus:before,
.bootstrap-iso *[class*='btn btn-']:focus:before,
.bootstrap-iso *[class*='button-s']:focus:before {
opacity: 1;
/*transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0deg);*/
}

/* 3d) lists */
/* unordered lists */
.fa-ul {
margin-left: 0.84285714em;
}
.online-two-iso .modal-body#online2-global-benefit-overview-modaltemplate .tab-body UL {
padding-left: 0;
}
.bootstrap-iso ul.fa-ul li {
padding-left: 1em;
}
.bootstrap-iso ul.fa-ul li::before {
font-family: FontAwesome;
content: '\f111';
font-size: 0.5rem;
margin-left: -1em;
padding-right: 0.5em;
position: relative;
bottom: 3px;
color: #000;
}
.bootstrap-iso ul.fa-ul li ul.fa-ul li::before {
content: '\f10c';
}
/* ordered lists */
.bootstrap-iso ol {
padding-left: 0;
margin-left: 2.14285714em;
list-style-type: decimal;
}
#BenefitPage li {
margin-left: 40px;
list-style: disc;
}
/* 3e) popups */
/* header colour */
.online-two-iso .header-overlay,
.online-two-iso .tab-header,
.bootstrap-iso .modal-header {
background-color: #fff;
}
/* reset benefit intro popup to not have header overlay colour */
.online-two-iso [class*='LineDetail'] .tab-header {
background-color: #f2f2f2;
}
/* header title colour */
#login-assistance .header-overlay #TitleResetPassword,
.bootstrap-iso .modellersModalHeader,
.bootstrap-iso .dependantModalHeader,
#followup-items-overlay.online-followup-items #followup-items-title,
.benefit-matrix .benefitheader,
#exit-confirm h5,
.benefitselect #allocationDialog h5,
.active-benefits .header,
.benefit-matrix .modal .modal-header .header,
.online-two-iso .modal-normal .modal-header .header-text,
.terms-conditions-cookies .cookiepolicy-header,
.terms-conditions-cookies .terms-condtion-header {
color: #000;
}
/* close icon */
.online-two-iso .header-overlay A.close,
.online-two-iso .modal-large .close,
html#profile body#profile .profile #profile-online-2 .header-overlay A {
background: none;
visibility: hidden;
}
.online-two-iso .header-overlay A.close:after,
.online-two-iso .modal-large .close:after,
html#profile body#profile .profile #profile-online-2 .header-overlay A:after {
content: '\e014';
color: #000;
font-family: 'Glyphicons Halflings';
visibility: visible;
}
/* reset benefit intro close icon to be default colour after resetting header background colour */
.online-two-iso .modal-large [class*='LineDetail'] .close:after {
color: #666;
}

.bootstrap-iso .close,
.bootstrap-iso .close:hover,
.bootstrap-iso .close:focus,
.bootstrap-iso .close:active,
.bootstrap-iso .close:active:hover,
.bootstrap-iso .close:active:focus,
.online-two-iso .modal-normal .close {
color: #000;
}
.bootstrap-iso .close:focus {
outline: 3px solid #666;
}
/* position of close icon */
.online-two-iso .modal-large .close {
top: 0.5em;
right: 0.5em;
}
.header-overlay A {
padding: 4px 0.5em 0 0;
}

/* life event dependant add/remove popup */
.dependantContainer .event-step-nav {
text-align: right;
}
.bootstrap-iso .event-step-nav a.primary-link,
.bootstrap-iso .event-step-nav a.secondary-link {
margin: 0;
}
.dependantContainer .button-container > a:last-child {
margin-left: 0.5em;
}
.bootstrap-iso .event-step-nav a {
border-radius: 25px;
padding: 6px 12px;
text-transform: uppercase;
transition: background-color 0.25s, color 0.25s;
}
.bootstrap-iso .event-step-nav a.secondary-link {
background: #005A6C;
color: #000;
}
.bootstrap-iso .event-step-nav a.primary-link {
background: #005A6C;
color: #000;
}
.bootstrap-iso .event-step-nav a.secondary-link:hover,
.bootstrap-iso .event-step-nav a.secondary-link:focus,
.bootstrap-iso .event-step-nav a.primary-link:hover,
.bootstrap-iso .event-step-nav a.primary-link:focus {
background-color: #1841a9;
color: #000;
}
.bootstrap-iso .btn-warning:hover {
border-color: #1841a9;
}

/* 3f) tab selectors e.g. Manage dependants widget, benefit intro, profile etc. */
.online-two-iso [class*='modal'] a.tab-selector-link:hover,
.online-two-iso [class*='modal'] .tab-selector-link.active,
html#profile body#profile .profile #profile-online-2 #profilecontainer .htabs-container .tabs UL LI.sel A,
html#profile body#profile .profile #profile-online-2 .htabs-container .tabs UL LI A:hover {
color: #000;
border-bottom: 0.5em solid #000;
}
.online-two-iso .modal-normal .tab-selector-link,
.online-two-iso .modal-large .tab-selector-link,
.online-two-iso .modal-normal .tab-selector-link.inactive,
.online-two-iso .modal-large .tab-selector-link.inactive,
html#profile body#profile .profile #profile-online-2 .htabs-container .tabs UL LI A {
color: #000;
}

/* 3g) accordions */
/* background colour */
.benefit-matrix .benefit-category .panel-default > .panel-heading,
.trsdashboard .panel-default > .panel-heading {
background-color: #005A6C;
padding: 0;
}
.bootstrap-iso .panel-heading .panel-title .accordion-toggle {
display: block;
}
.bootstrap-iso .panel-heading .panel-title .accordion-toggle:hover,
.bootstrap-iso .panel-heading .panel-title .accordion-toggle:focus {
background-color: #fff;
color: #000;
}
#benefit-overview #overviewAccordion .panel-default > .panel-heading {
background-color: white;
padding: 0;
border: 1px solid #fff;
}
#benefit-overview #overviewAccordion .group-title {
color: #000;
}
#benefit-overview .group-header-graphicon.pull-right.glyphicon.glyphicon-menu-down {
color: #000;
}
.trsdashboard .panel-title {
padding: 0;
}
.trsdashboard .panel-title .accordion-toggle {
padding: 10px 15px;
}

/* expand/collapse icons */
.bootstrap-iso .glyphicon-menu-down,
.bootstrap-iso .glyphicon-menu-up {
transition: all 0.25s;
margin-right: 12px;
}
.bootstrap-iso .glyphicon-menu-up {
transform: rotate(-180deg);
}
.bootstrap-iso .glyphicon-menu-down:before,
.bootstrap-iso .glyphicon-menu-up:before {
font-family: 'Glyphicons Halflings';
content: '\e259';
}

/* 3h) Info icons, slider toggles and label styling */
/* info icon color **/
.benefit-matrix .row.title .glyphicon-info-sign-color {
color: #000;
}
.benefit-matrix .row.title .glyphicon-info-sign-color:hover,
.benefit-matrix .row.title .glyphicon-info-sign-color:focus {
color: #000;
}
.benefit-matrix .row.title .glyphicon-info-sign-color:focus {
outline: 3px solid #666;
}

/* slider toggle color */
.online-two-iso input:checked + .slider {
background-color: #1841a9;
}

/* label styling e.g. "Note:" labels */
.bootstrap-iso .label {
background-image: none;
}

/* 3i) logo */
#logo {
background-image: var(--logo);
background-size: contain;
background-position: center;
background-repeat: no-repeat;
margin-left: .4em;
}
/* centering logo on mobile view */
@media only screen and (max-width: 750px) {
#logo {
width: calc(100vw - 100px);
}
}

/* 3j) site header */
/* remove top margin in IE */
.lt-ie9 #header {
margin-top: 0;
}
/* header colour */
.online-two-iso #terminator #header.header-fullwidth {
background-color: #ffd900;
}
/* header icons profile, mailbox and logout, and main 'home' link */
@media only screen and (min-width: 751px) {
.online-two-iso #menu-container {
height: auto !important;
width: 95vw;
margin: 0 0 10px;
}
.online-two-iso #menu-no-dashboard {
display: flex;
flex-wrap: wrap;
margin: 0;
padding: 0;
}
.online-two-iso #menu-no-dashboard li {
padding: 0.5em;
}
#menu-container ul#menu-no-dashboard li a,
#user-div a {
color: #000;
}
}
@media (min-width: 767px) {
.online-two-iso #menu-container {
padding: 0;
}
}

/* need assistance pull down tab */
.help-ico .helptoggle,
.lt-ie9 .help-ico a {
background-image: none !important;
background-color: #1841a9;
}
#header .help-ico a.helptoggle {
color: white;
}
/* use font awesome play icon to repreent the expanded/collaped menu icon */
#header .help-ico a.helptoggle[aria-expanded='true']:after,
#header .help-ico a.helptoggle[aria-expanded='false']:after {
font-family: FontAwesome;
content: '\f04b';
color: white;
display: inline-block;
transform: rotate(90deg);
font-size: 0.75rem;
position: relative;
left: 1em;
top: -1px;
}
/* this ensures the icon faces up when the menu is expanded */
#header .help-ico a.helptoggle[aria-expanded='true']:after {
transform: rotate(-90deg);
}

/* remove search */
#floating-header-content .search {
display: none;
}
/*remove default icons */
#floating-header-content a {
background: none;
}
/*general styling for font icons to be used*/
#floating-header-content .chat a:before,
#floating-header-content .call a:before,
#floating-header-content .mail a:before {
font-family: FontAwesome;
margin-left: -1em;
padding-right: 0.25em;
font-size: 2rem;
vertical-align: middle;
}
/*call icon*/
#floating-header-content li.call a:before {
content: '\f10b';
color: #1841a9;
}
/*mail icon*/
#floating-header-content li.mail a:before {
content: '\f003';
}
#floating-header-content li.mail {
display: none;
}
#floating-header-content li.call {color: #000;}

@media only screen and (min-width: 768px) {
#header .help-ico .helptoggle:hover, #header .help-ico .helptoggle:focus {
background-color: #fff;
color: #1841a9;
border: 2px solid #1841a9;
}
#header .help-ico a.helptoggle[aria-expanded='true']:hover:after,
#header .help-ico a.helptoggle[aria-expanded='false']:hover:after,
#header .help-ico a.helptoggle[aria-expanded='true']:focus:after,
#header .help-ico a.helptoggle[aria-expanded='false']:focus:after {

color: #1841a9;
}
/* link color and width for phone and email links */
#floating-header-content a {
color: #000;
width: auto;
padding: 0 1em;
}
/* hover colour of links in floating header */
#header a:hover {
color: #000;
text-decoration: none;
}
/* focus colour of links in floating header */
#header a:focus {
color: #000;
outline: 3px solid #666;
}
}

/* 3k) site footer */
/* footer colour */
.online-two-iso #terminator #footer.footer-fullwidth {
background-color: #000;
}
.online-two-iso #footer a {
font-size: 14px;
}
/* footer link color */
.online-two-iso #footer a {
color: #fff;
}
/* copyright */
#footer-copyright {
color: #fff;
font-size: 0.75rem;
padding: 0 0 0 17px;
margin: 9px 0;
}
@media only screen and (min-width: 768px) {
/* display nav items in one line */
#footer.footer-fullwidth nav ul#footer-links li {
display: inline-block;
}
}
.form-data {
padding-top: 0px;
}
input, textarea {
border: 1px solid #000;
}
.QRCodeimage {
width: 370px;
}
/* 3l) datepickers */
/* button that launches datepicker */
.online-two-iso .datepicker-container .input-group-btn .btn,
/*datepicker on benefit statement */
.bootstrap-iso .btn.online-two-datepicker {
background-color: #1841a9;
border-color: #1841a9;
width: auto;
}
.online-two-iso .datepicker-container .input-group-btn .btn:active:hover,
.online-two-iso .datepicker-container .input-group-btn .btn:active:focus,
.bootstrap-iso .uib-datepicker .btn:hover,
.bootstrap-iso .uib-day .btn.btn-default:hover,
.bootstrap-iso .uib-datepicker-popup .btn-sm.btn-info,
.bootstrap-iso .uib-datepicker-popup .btn-sm.btn-success {
border-radius: 0;
}
.btn.btn-default.btn-sm.pull-left.uib-left .glyphicon.glyphicon-chevron-left::before {
content: "\e079";
}
/*carousel button*/
.sliderContainer .btn.btn-default {
width: 40%;
}
.home-module-integrated #slider .sliderContainer #reward .slide-content {
float: right;
    margin-right: 95px;
margin-top: 112px;
background: none;
}
.sliderContainer .btn.btn-default.buttonone,
.sliderContainer .btn.btn-default.buttonone:hover
.sliderContainer .btn.btn-default.buttonone:active,
.sliderContainer .btn.btn-default.buttonone:hover:active,
.carousel.btn.btn-default.buttontwo,
.carousel.btn.btn-default.buttontwo:hover,
.carousel.btn.btn-default.buttontwo:active,
.carousel.btn.btn-default.buttontwo:hover:active{
width: 135%;
}
/*Carousel policy*/
.carousel.btn.btn-default {
background-color: #fff;
color: #1841a9;
border: 2px solid #1841a9;
}
.carousel.btn.btn-default:hover, .bootstrap-iso .btn-default:hover, .bootstrap-iso .btn-default:active, .bootstrap-iso .btn-default:focus, .bootstrap-iso .btn-default:active:focus, .bootstrap-iso .btn-default:hover:active {
background-color: #1841a9;
color: #fff;
width:40%;
border: 2px solid #1841a9;
font-weight: normal;
}
/* today, clear and close buttons */
.bootstrap-iso .uib-datepicker-popup .btn-sm.btn-info,
.templates .uib-datepicker-popup .btn-sm.btn-info {
background-color: #fff;
border: none;
text-transform: uppercase;
}
.btn.btn-default.button-date-picker:hover:active {
width: auto;
}
.bootstrap-iso .uib-datepicker-popup .btn-sm.btn-danger,
.templates .uib-datepicker-popup .btn-sm.btn-danger {
background-color: #fff;
border: none;
text-transform: uppercase;
}
.bootstrap-iso .uib-datepicker-popup .btn-sm.btn-success,
.templates .uib-datepicker-popup .btn-sm.btn-success {
background-color: #fff;
border: none;
min-width: auto;
text-transform: uppercase;
}
.bootstrap-iso .uib-datepicker-popup .btn-sm.btn-info:hover,
.bootstrap-iso .uib-datepicker-popup .btn-sm.btn-info:focus,
.templates .uib-datepicker-popup .btn-sm.btn-info:hover,
.templates .uib-datepicker-popup .btn-sm.btn-info:focus,
.bootstrap-iso .uib-datepicker-popup .btn-sm.btn-danger:hover,
.bootstrap-iso .uib-datepicker-popup .btn-sm.btn-danger:focus,
.templates .uib-datepicker-popup .btn-sm.btn-danger:hover,
.templates .uib-datepicker-popup .btn-sm.btn-danger:focus,
.bootstrap-iso .uib-datepicker-popup .btn-sm.btn-success:hover,
.bootstrap-iso .uib-datepicker-popup .btn-sm.btn-success:focus,
.templates .uib-datepicker-popup .btn-sm.btn-success:hover,
.templates .uib-datepicker-popup .btn-sm.btn-success:focus {
background-color: #1841a9;
color: #fff;
text-transform: uppercase;
}
.bootstrap-iso .uib-datepicker-popup .btn-info.active,
.templates .uib-datepicker-popup .btn-info.active,
.bootstrap-iso .uib-datepicker-popup .btn-sm.btn-info:active,
.bootstrap-iso .uib-datepicker-popup .btn-sm.btn-info:active:hover,
.bootstrap-iso .uib-datepicker-popup .btn-sm.btn-info:active:focus,
.templates .uib-datepicker-popup .btn-sm.btn-info:active,
.templates .uib-datepicker-popup .btn-sm.btn-info:active:hover,
.templates .uib-datepicker-popup .btn-sm.btn-info:active:focus,
.bootstrap-iso .uib-datepicker-popup .btn-sm.btn-danger:active,
.bootstrap-iso .uib-datepicker-popup .btn-sm.btn-danger:active:hover,
.bootstrap-iso .uib-datepicker-popup .btn-sm.btn-danger:active:focus,
.templates .uib-datepicker-popup .btn-sm.btn-danger:active,
.templates .uib-datepicker-popup .btn-sm.btn-danger:active:hover,
.templates .uib-datepicker-popup .btn-sm.btn-danger:active:focus,
.bootstrap-iso .uib-datepicker-popup .btn-sm.btn-success:active,
.bootstrap-iso .uib-datepicker-popup .btn-sm.btn-success:active:hover,
.bootstrap-iso .uib-datepicker-popup .btn-sm.btn-success:active:focus,
.templates .uib-datepicker-popup .btn-sm.btn-success:active,
.templates .uib-datepicker-popup .btn-sm.btn-success:active:hover,
.templates .uib-datepicker-popup .btn-sm.btn-success:active:focus {
background-color: #1841a9;
color: #fff;
font-size: 0.75rem;
text-transform: uppercase;
}

/* hovering over day to be picked */
.bootstrap-iso .uib-day .btn.btn-default:hover,
.templates .uib-day .btn.btn-default:hover {
background-color: #1841a9;
border: 1px solid #ccc;
color: #fff;
}

/* previous, current month/year, and next buttons at top of datepicker */
.bootstrap-iso .uib-datepicker th .btn:hover,
.bootstrap-iso .uib-daypicker th .btn:hover,
.templates .uib-datepicker th .btn:hover,
.templates .uib-daypicker th .btn:hover {
background-color: #1841a9;
border: 1px solid #ccc;
}

/* 3m) Inputs */
input:focus,
.bootstrap-iso .form-control:focus {
border-color: #666;
box-shadow: none;
outline: 2px solid #666;
}

/* 3n) tables */
.bootstrap-iso .table > thead > tr > td.info,
.bootstrap-iso .table > tbody > tr > td.info,
.bootstrap-iso .table > tfoot > tr > td.info,
.bootstrap-iso .table > thead > tr > th.info,
.bootstrap-iso .table > tbody > tr > th.info,
.bootstrap-iso .table > tfoot > tr > th.info,
.bootstrap-iso .table > thead > tr.info > td,
.bootstrap-iso .table > tbody > tr.info > td,
.bootstrap-iso .table > tfoot > tr.info > td,
.bootstrap-iso .table > thead > tr.info > th,
.bootstrap-iso .table > tbody > tr.info > th,
.bootstrap-iso .table > tfoot > tr.info > th {
background-color: #fff;
color: #000;
}

/*================================================================================================== 4. Login page ==================================================================================================*/
/*Label color*/
.online-two-iso label, .online-two-iso input, .online-two-iso select, .online-two-iso .form-control, .online-two-iso .steps-header, .online-two-iso .input-caption {
color: #000;}
/*login page image*/
.online-two-iso .LoginPageContainer #logo {
background: url(/Aviva/media/default/Aviva%202022/Login%20Page/Aviva_logo_yellow.svg) no-repeat center/contain;
width: 18%;
height: 105px;
    }
.online-two-iso.login .LoginPageContainer #main {
margin-top: 1%;
}
/* login module font*/
.online-two-iso.login .LoginPageContainer .login-module-zone .login-modules,
.online-two-iso.login .LoginPageContainer .login-panel {
    font-family: SourceSansPro_stdlight;
}
/* forgot password link */
#wp-forgetPassword {
color: #000;}
#wp-forgetPassword > div:hover {
text-decoration: underline;
}
#wp-forgetPassword > div:focus {
outline: 3px solid #666;
}
/* module headings */
.online-two-iso.login .LoginPageContainer .login-module-zone .login-modules .module .module-title {
color: white;
font-size: 1.2rem;
}
.online-two-iso #login-module-login-page-welcome h2 {
display: none;
}
.online-two-iso.login .LoginPageContainer .login-module-zone .login-modules .module .module-text {
width: 100%;
}
#login-module-need-assistance .module-title {
font-family: SourceSansPro_stdbold;
}
.online-two-iso.login .LoginPageContainer .btn.btn-primary#login {
font-size: 17px;
padding: 2px 25px;
background-color: #ffd900;
border-radius: 20px;
border: none;
color: #1841a9;
}
.online-two-iso.login .LoginPageContainer .btn.btn-primary#login:hover,.online-two-iso.login .LoginPageContainer .btn.btn-primary#login:active, .online-two-iso.login .LoginPageContainer .btn.btn-primary#login:focus {
color: #fff;
background-color: #1841a9;
}
/* welcome module heading */
.online-two-iso #login-module-login-page-welcome h1 {
color: white;
font-size: 3vw;
text-align: center;
width: 100%;
}
/* Set font for icons in assistance module */
.bootstrap-iso #login-module-need-assistance span.glyph-icon:before {
width: 25px;
display: inline-block;
font-family: Glyphicons Halflings;
font-size: 0.875rem;
}
/* Apply icon for phone */
.bootstrap-iso #login-module-need-assistance span#glyph-phone:before {
content: '\e182';
}
/* Apply icon for email */
.bootstrap-iso #login-module-need-assistance span#glyph-mail:before {
content: '\2709';
}
/* module links */
#login-modules-container a {
color: white;
}
/* login image */
.online-two-iso.login body {
background-image: url(/Aviva/media/default/Aviva%202022/Login%20Page/Aviva-loginpage-image_new.png);
}
/* login module background colour */
.online-two-iso.login .LoginPageContainer .login-module-zone .login-modules {
background-color: #1841a9;
}
@media only screen and (min-width: 375px) and (max-width: 767px) {
/* centering logo */
#wrapper.isLoginPageWrapper #header #logo {
float: none;
margin: 0 auto;
}
/* margin between header and login box */
#wrapper.isLoginPageWrapper #header {
width: 100%;
margin: 20px 0;
}
.online-two-iso.login .LoginPageContainer .login-module-zone .login-modules {
background: none;
}
}
/* module widths */
@media only screen and (min-width: 1200px) {
.online-two-iso.login .LoginPageContainer .login-module-zone .login-modules .module#login-module-login-page-welcome {
width: calc(85% - 450px) !important;
}
.online-two-iso.login .LoginPageContainer .login-module-zone .login-modules .module#login-module-need-assistance {
padding-left: 10%;
width: calc(15% + 450px) !important;
}
}
/****************************************** first time user page styling ************************/
.online-two-iso .validation-caption {
color: #666;
}
/****************************************** Terms page (for agreeing to terms and cookie notice) *******************************************/
.terms-conditions-cookies .terms-conditions-cookies-header {
padding-left: 0;
}
.terms-conditions-cookies .term-condition-error,
.terms-conditions-cookies .cookie-notice,
.terms-conditions-cookies .term-enabled {
margin-left: 0;
}
.bootstrap-iso .cookie-notice.radio input,
.bootstrap-iso .term-enabled.radio input {
margin-top: 0;
}
.terms-conditions-cookies .term-condition-error {
background-color: #e52321;
color: white;
border: none;
}
/* hide page header when in the modal content so title isn't duplicated */
.terms-conditions-cookies #page-header {
display: none;
}
/* list styling for terms content for popup and for main terms page in footer */
/*.bootstrap-iso .main-list,
.bootstrap-iso .main-list ol {
margin: 0 0 0 1em;
padding: 0;
display: grid;
grid-gap: .5rem;
counter-reset: section;
}
.bootstrap-iso .main-list li > ol {
margin: .5em 0 1em 2em
}
.bootstrap-iso .main-list li {
padding-left: 0.5em;
}
.bootstrap-iso .main-list li::marker {
counter-increment: section;
content: counters(section, ".")
}
.bootstrap-iso .main-list > li::marker {
font-size: 24px;
font-weight: 500;
color: #000;
}
.bootstrap-iso .main-list ul li::marker {
display: none;
} */
/*================================================================================================== 5. Home page ==================================================================================================*/
/* restrict viewport to 1820px */
#home-online-three .modules-sleeve {
float: none;
max-width: 1820px;
margin: 0 auto;
}
#home-online-three #home-integrated .module-content-header-container {margin-bottom: -3px;}
#home,
.dashboard-page-container {
background: #e0e0e0;
}
/* margin between main element and footer */
#main.home {
margin-bottom: 1.5em;
}
/* general grid and module styling */
#home-online-three #home-integrated .modules-right-side.grid-container {
grid-gap: 10px;
}
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content {
border-radius: 8px;
padding: 0;
}
/*home page button styling*/
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .module-content .btn.btn-default:hover,
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .module-content .btn.btn-default:active,
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .module-content .btn.btn-default:focus,
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .module-content .btn.btn-default:active:focus
{width: 90%;}
/* enrolment module styling */
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content #enrolment.module-content {
    background: #fff;
    box-shadow: none;
}
.days-left {
font-family: SourceSansPro_stdbold;
color: #ffd900;
}
/*#home-online-three #home-integrated #enrolment .btn.btn-default {
background-color: #fff;
border: 1px solid #005A6C;
color: #005A6C;
}*/
#home-online-three #home-integrated #enrolment p,
#home-online-three #home-integrated #enrolment h3,
#home-online-three #home-integrated #enrolment h4{
color: #fff;}

#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content #enrolment.module-content {
background: #005A6C;
}
#home-online-three #home-integrated #enrolment h3.heading-text {
color: #ffd900;
}
/* benefit statement module */
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content #benefit-statement.module-content {
    background: #fff;
    box-shadow: none;
}
#benefit-statement .highcharts-background {
fill: transparent
}
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .module-content.white-outline-button .btn.btn-default {
background: transparent;
border: 1px solid #fff;
color: #fff;
}
/* homepage buttons */
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .module-content.outline-button .btn.btn-default {
background: transparent;
border: 1px solid #000;
color: #000;
}
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .module-content.outline-button .btn.btn-default:hover,
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .module-content.outline-button .btn.btn-default:focus {
color: #000;
}
.bootstrap-iso .outline-button [class*="btn btn-"]:hover:before {
background: #686868;
}
/* greeting, module and carousel heading colour */
#home-online-three .dashboard-controls #greeting-message,
#home-online-three #home-integrated .module-content-header-container h3.module-content-header {
color: #000;
}
#home-online-three .dashboard-controls {
height: 4.5rem;
margin: 0 0 1rem 0;
background-color: #fff;
padding-left: 1rem;
}
#home-online-three #home-integrated .module-content-header-container h3.module-content-header {
font-size: 1.3rem;
padding-left: 25px;
}
/*module text*/
.moduletext {
padding-right: 40px;
padding-left: 40px;
}
/*Module styling for two buttons*/
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .GenericMod.module-content .generic-buttons .btn.btn-default {
background: #fff;
color: #1841a9;
border-color: #1841a9;
width: 90%
}
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .GenericMod.module-content .generic-buttons .btn.btn-default:hover {
background: #1841a9;
color: #fff;
border-color: #1841a9;
width: 90%
}
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .GenericMod.module-content .generic-buttons .btn.btn-default:active {
background: #1841a9;
color: #fff;
border-color: #1841a9;
width: 90%
}
/* make background colour of grid container and modules the same */
#home-online-three #home-integrated .modules-right-side.grid-container,
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content {
background-color: #e0e0e0;
}
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content:focus {
outline: 1px solid #666;
}
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .module-content {
padding-top: 13px;
padding-bottom: 25px;
padding-right: 0px;
padding-left:0px;
}
/* modules styling */
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .module-content,
.bootstrap-iso .carousel.home-module-integrated {
background: white;
border: none;
border-radius: 0px;
}
/* hide module more info icon */
#home-online-three #home-integrated .module-content-header-container .online-three-module-popover-control {
display: none;
}
/* module content text colour */
#home-online-three #home-integrated p {
color: #000;
}
.event-summary,
#home-online-three #home-integrated .modules-mobile .module-mobile .module-panel .module-copy .event-content .text-light {
color: #fff;
}
/* ===========================================================================
BUTTON ALIGNMENT TO BOTTOM OF HOMEPAGE MODULE
============================================================================== */
@supports not (-ms-high-contrast: none) {
@media only screen and (min-width: 768px) {
/* make module items flex containers and set direction and size */
.module-content,
.module-content > div,
.module-content > div > div,
.module-content > div > div > div:last-child,
.module-content > div > div > div:last-child .module-copy,
.module-content > div > div > div:last-child .module-copy .content-text,
.module-content > div > div > div:last-child .module-copy > div:last-child,
.module-content > div > div > div:last-child .module-copy > div:last-child > div:last-child,
.module-content > div > div > div:last-child .module-copy > div:last-child > div:last-child #event-active,
.module-content > div > div > div:last-child .module-copy > div:last-child > div:last-child #event-inactive,
.module-content > div > div > div > div.module-copy > div:last-child div.event-content div.text-light,
.module-content > div > div .home-module-generic-content .generic-copy.module-copy .generic-buttons,
.module-content > div > div > div:last-child .module-copy > .trs-buttons,
.module-content > div > div > div:last-child .module-copy > div:last-child > div:last-child .tbs-module-pager,
.module-content > div > div > div:last-child .module-copy > div:last-child > div:last-child .tbs-module-pager .make-a-claim-buttons {
display: flex;
flex-direction: column;
flex: 1;
}
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .module-content .tbs-module-pager .tbs-pager {
position: static;
transform: none;
flex-direction: row;
justify-content: center;
align-items: flex-start;
padding-top: 0.5em;
}
/* align flex containers housing buttons to bottom of module */
#generic.module-content > div > div .home-module-generic-content .generic-copy.module-copy .generic-buttons,
.module-content > div > div > div:last-child .module-copy > div:last-child > div:last-child #event-active,
.module-content > div > div > div:last-child .module-copy > div:last-child > div:last-child #event-inactive,
.module-content > div > div > div:last-child .module-copy .benefit-statement-buttons,
.module-content > div > div > div:last-child .module-copy > .trs-buttons,
.module-content > div > div > div:last-child .module-copy > .account-buttons,
.module-content > div > div > div:last-child .module-copy > div:last-child > div:last-child .tbs-module-pager .make-a-claim-buttons {
justify-content: flex-end;
}
/* remove margin on certain containers to ensure buttons align at the bottom of module */
.module-content > div > div > div:last-child .module-copy .content-text,
.module-content > div > div > div:last-child .module-copy .content-text p:last-of-type:not(:first-of-type) {
margin: 0;
}
}
}
/* button max width 75% when on HD screens and above */
@media only screen and (min-width: 1921px) {
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .module-content#enrolment .btn.btn-default,
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .module-content .btn.btn-default {
max-width: 75%;
}
}
/*image width*/
.img-responsive {
width: 100%;
padding-bottom: 10px;
}
/* Module flex benefits image */
@media only screen and (max-width:1400px) {
#mobileview {
display: block;
}
#desktopview {
display: none;
}
}
@media only screen and (min-width:1400px) {
#mobileview {
display: none;
}
#desktopview {
display: block;
}
}
/* module icon styling*/
[class*='online-two-icon-']:before {
color: #525174;
font-family: OnlineTwoIconFont;
font-size: 7rem;
}
/*access the app icon */
.online-two-icon-31:before {
content: '\e91e';
}
/*benefit statement icon */
.online-two-icon-56:before {
content: '\e937';
}
/* benefit information icon */
.online-two-icon-136:before {
content: '\e987';
}
/* discounts icon*/
.online-two-icon-48:before {
content: '\e92f';
}
/* my benefits icon*/
.online-two-icon-63:before {
content: '\e93e';
}
/* my profile icon */
.online-two-icon-97:before {
content: '\e960';
}
/* company content icon */
.online-two-icon-121:before {
content: '\e978';
}

/*** carousel styling ***/
/* hide carousel hamburger menu */
.home-module-integrated .welcome-items {
display: none;
}
/* remove faded background on carousel content and increase indent */
.home-module-integrated #slider .sliderContainer .slide-content {
background: rgba(245,245,245,.6);
margin: 1rem;
max-width: 85%;
}
/* remove margin around carousel content and set colour */
#home-online-three #home-integrated .home-module-integrated .content p {
margin: 0;
color: #000;
font-size: 1.2em;
}
/* carousel slide content headings */
.home-module-integrated .content h2,
.home-module-integrated .content h3 {
margin-top: 0;
color: #000;
}
/* carousel content buttons */
.home-module-integrated #slider .sliderContainer .slide-content .content .btn {
font-size: 0.75rem;
}
/* adjust width of carousel thumbnails */
.home-module-integrated #slider .thumb .rect {
width: 190px;
}
/*Remove space below thumbnail*/
@media only screen and (min-width: 1400px){
#home-module-welcome #slider, .home-module-integrated #slider {
height: 649px!important;
}
}
@media only screen and (min-width: 1800px){
#home-module-welcome #slider, .home-module-integrated #slider {
height: 710px!important;
}
}
/* background of thumbnail container */
.home-module-integrated #slider .thumb {
background: #ededed;
}

@media only screen and (min-width: 768px) {
/* benefit statement payslip data item styling */
#item-0,
#item-1,
#item-2 {
width: calc(100% - 2em);
margin-left: 1em;
text-align: left;
font-weight: bold;
}
.payslip-item-amount {
float: right;
}
#item-1 {
border-bottom: 1px solid #333;
}
}
@media only screen and (min-width:768px){
.event-summary {
color: #fff;
}
/* enrolment and benefit statement button styling */
#home-online-three #home-integrated #benefit-statement .btn.btn-default{
background-color: #005A6C;
border: 1px solid #005A6C;
color: #fff;
}
/* enrolment and benefit statement button styling */
#home-online-three #home-integrated #enrolment .btn.btn-default:hover,
#home-online-three #home-integrated #benefit-statement .btn.btn-default:hover{
background-color: #1841a9;
border: 1px solid #1841a9;
color: #fff;
width: 90%;
}
/* enrolment and benefit statement button styling */
#home-online-three #home-integrated #enrolment .btn.btn-default:active,
#home-online-three #home-integrated #benefit-statement .btn.btn-default:active{
background-color: #1841a9;
border: 1px solid #1841a9;
color: #fff;
width: 90%;
}
/* text styling */
#home-online-three #home-integrated #benefit-statement,
#home-online-three #home-integrated #benefit-statement h3,
#home-online-three #home-integrated #benefit-statement p,
#home-online-three #home-integrated .well-one-money .module-content-header-container h3.module-content-header,
#home-online-three #home-integrated .well-one-money .content-text p,
#home-online-three #home-integrated .well-one-money .content-text .online-two-icon-32:before {
color: #000;
}
}
/* arranging open events horizontally in enrolment module */
@media only screen and (min-width: 1400px){
.event-summary {
justify-content: space-around;
}
}
/*================================================================================================== 6. Benefit overview ==================================================================================================*/
/* heading */
#benefit-overview .benefit-overview-title {
padding: 0;
}
#benefit-overview .benefit-overview-title H1 {
color: #000;
font-size: 2.25rem;
line-height: 1;
}
.btn.btn-info.know-more-link, .btn.btn-info.know-more-link:active:focus, .btn.btn-info.know-more-link:hover:active {
width: auto;
}
/* benefit filter dropdown */
.bootstrap-iso#benefit-overview #BenefitNameFilter {
background-color: #fff;
border: 1px solid rgba(0, 0, 0, 0.15);
border-radius: 0;
color: #333;
text-transform: none;
text-align: left;
width: 100%;
overflow: hidden;
}
/* clear filter button */
.bootstrap-iso#benefit-overview .clear-filter {
background-color: #000;
border: none;
color: #fff;
}
.bootstrap-iso#benefit-overview .clear-filter:hover,
.bootstrap-iso#benefit-overview .clear-filter:focus {
background-color: #686868;
color: #fff;
}
.bootstrap-iso#benefit-overview .clear-filter:active,
.bootstrap-iso#benefit-overview .clear-filter:active:hover,
.bootstrap-iso#benefit-overview .clear-filter:active:focus {
background-color: #686868;
color: #fff;
}
/* know more buttons */
#benefit-overview .know-more-link .aria {
display: none;
}
.bootstrap-iso#benefit-overview .btn.know-more-link {
background-color: #ffd900;
border: none;
color: #1841a9;
}
.bootstrap-iso#benefit-overview .know-more-link A {
color: #1841a9;
padding: 0;
text-transform: uppercase;
font-weight: normal;
}
.bootstrap-iso#benefit-overview .btn.know-more-link:hover,
.bootstrap-iso#benefit-overview .btn.know-more-link:focus {
background-color: #1841a9;
}
.bootstrap-iso#benefit-overview .know-more-link A:hover,
.bootstrap-iso#benefit-overview .know-more-link A:focus {
color: #fff;
font-weight: normal;
}
.bootstrap-iso#benefit-overview .btn.know-more-link:active,
.bootstrap-iso#benefit-overview .btn.know-more-link:active:hover,
.bootstrap-iso#benefit-overview .btn.know-more-link:active:focus {
background-color: #1841a9;
}
.bootstrap-iso#benefit-overview .know-more-link A:active,
.bootstrap-iso#benefit-overview .know-more-link A:active:hover,
.bootstrap-iso#benefit-overview .know-more-link A:active:focus {
color: #fff;
font-weight: normal;
}
/*================================================================================================== 7. Benefit statement ==================================================================================================*/
.benefit-matrix .benefitdate .data-addon {
color: #000;
}
.benefit-matrix .benefitdate {text-transform: none;}
/* view follow up container colour */
.bootstrap-iso .alert-info.hdf-followup {
background-color: #539987;
color: white;
width: 1060px;
}
/****************************************** benefit statement view follow up popup *******************************************/
.benefit-matrix .modal .hdf-followup {
padding: 0;
}
/* overlay header */
.benefit-matrix .modal .modal-header .header {
text-transform: uppercase;
}
.benefit-matrix .modal .hdffollowup-intro {
color: #000;
}
.benefit-matrix .benefitdate {border: 1px solid black;}
.bootstrap-iso .form-control {border: 1px solid #000;}

/*================================================================================================== 8. Benefit matrix ==================================================================================================*/
/* all numerical values */
.benefit-matrix .font-youpay-color,
.benefit-matrix .glyphicon-play-color {
color: #000;
}
.followup-item-collect .followup-item-coverage-heading span > a, .followup-content .followup-collect .followup-item-description > a {
text-decoration: underline;
}
/* modellers and tools section */
.benefit-matrix .benefitheader.benefitheader-border {
border-color: #1841a9;
color: #1841a9;
}
.benefit-matrix .benefitheader.benefitheader-border:hover,
.benefit-matrix .benefitheader.benefitheader-border:focus {
background-color: #1841a9;
color: #fff;
}
.benefit-matrix .totalcostLable {
padding-left: 0px;
}
.col-md-10.col-sm-10.totalcost .col-md-4.col-sm-4, .col-md-10.totalcost .row {
text-align: center;
}
/* change icon font family that's used */
.bootstrap-iso.benefit-matrix .glyphicon-gift:before,
.bootstrap-iso.benefit-matrix .glyphicon-cog:before,
.bootstrap-iso.benefit-matrix .glyphicon-refresh:before {
font-family: FontAwesome;
}
/* modellers and tools widget */
.bootstrap-iso.benefit-matrix .glyphicon-cog:before {
content: '\f085';
}
/* manage dependants widget */
.bootstrap-iso.benefit-matrix .glyphicon-gift:before {
content: '\f0c0';
}
/* adding it up widget */
.bootstrap-iso.benefit-matrix .glyphicon-refresh:before {
content: '\f1ec';
}
/* confirm choices button */
.benefitheader-fixed div#followup-items a.btn {
-webkit-animation: shadow-pulse 2s infinite;
animation: shadow-pulse 2s infinite;
border-radius: 0;
}
.benefitheader-fixed div#followup-items a.btn:hover {
border-radius: 0px;
}
.benefitheader-fixed div#followup-items a.btn:focus {
border-radius: 0px;
}
.benefitheader-fixed div#followup-items a.btn:active,
.benefitheader-fixed div#followup-items a.btn:active:hover,
.benefitheader-fixed div#followup-items a.btn:active:focus {
border-radius: 0px;
}
/* hide reset to default button */
.benefitheader-fixed div#resettodefaults a.btn {
display: none;
}
/* monthly annual pay toggle styling
monthly button active */
.bootstrap-iso .btn-warning.active.btn-perpay {
background-color: #539987;
border-color: #539987;
color: #000;
}
/* annual button active */
.bootstrap-iso .btn-warning.active.btn-peranual {
background-color: #539987;
border-color: #539987;
}
/*monthly button inactive */
.bootstrap-iso .btn-group > .btn.btn-perpay:first-child:not(:last-child):not(.dropdown-toggle) {
border-color: #539987;
}
/*annual button inactive */
.bootstrap-iso .btn-group > .btn.btn-peranual:last-child:not(:first-child) {
border-color: #539987;
}
/* hover and focus states of toggle */
.bootstrap-iso .btn-warning.active.btn-perpay:hover,
.bootstrap-iso .btn-group > .btn.btn-perpay:first-child:not(:last-child):not(.dropdown-toggle):hover,
.bootstrap-iso .btn-group > .btn.btn-perpay:first-child:not(:last-child):not(.dropdown-toggle):focus,
.bootstrap-iso .btn-group > .btn.btn-peranual:last-child:not(:first-child):hover,
.bootstrap-iso .btn-group > .btn.btn-peranual:last-child:not(:first-child):focus {
border: 1px solid #539987;
border-radius: 0;
}
/* accordions */
.benefit-matrix .benefit-category .panel-default > .panel-heading,
.benefit-matrix .benefit-category .panel-title {
padding: 0;
}
.benefit-matrix .benefit-category .panel-title .accordion-toggle {
display: block;
padding: 10px;
}
.benefit-matrix .benefit-category .panel-title .accordion-toggle:focus {
outline: 3px solid #666;
}
/* benefits you can choose*/
.benefit-matrix .containers > div > div.benefit-category:first-child .panel-default > .panel-heading .panel-title .accordion-toggle {
background: #1841a9;
}
.benefit-matrix .containers > div > div.benefit-category:first-child .panel-default > .panel-heading .panel-title .accordion-toggle:hover,
.benefit-matrix .containers > div > div.benefit-category:first-child .panel-default > .panel-heading .panel-title .accordion-toggle:focus {
background-color: background-color: #1841a9;
color: #fff;
}
/* benefits you many be able to choose */
.benefit-matrix .containers > div > div.benefit-category:nth-child(2) .panel-default > .panel-heading .panel-title .accordion-toggle {
background: #1841a9;
}
.benefit-matrix .containers > div > div.benefit-category:nth-child(2) .panel-default > .panel-heading .panel-title .accordion-toggle:hover,
.benefit-matrix .containers > div > div.benefit-category:nth-child(2) .panel-default > .panel-heading .panel-title .accordion-toggle:focus {
background-color: background-color: #1841a9;
color: #fff;
}
/* benefits you cannot choose */
.benefit-matrix .containers > div > div.benefit-category:nth-last-child(2):not(:first-child) .panel-default > .panel-heading .panel-title .accordion-toggle {
background: #1841a9;
}
.benefit-matrix .containers > div > div.benefit-category:nth-last-child(2):not(:first-child) .panel-default > .panel-heading .panel-title .accordion-toggle:hover,
.benefit-matrix .containers > div > div.benefit-category:nth-last-child(2):not(:first-child) .panel-default > .panel-heading .panel-title .accordion-toggle:focus {
background-color:background-color: #1841a9;
color: #fff;
}
/* preventing default link hover stlying for expanding/collapsing accordions */
a.accordion-toggle:hover,
a.accordion-toggle:focus,
a.accordion-toggle:active,
a.accordion-toggle:active:hover,
a.accordion-toggle:active:focus {
color: white;
}
/* selected benefit tick mark styling */
.benefit-selected-box {
/*this position of the parent is important to the position of the child*/
position: relative;
transition: all 0.5s ease;
}
.benefit-selected-box .benefitline {
border: 2px solid #000;
}
.benefit-selected-box .benefitline::before {
/*checkbox container styling*/
height: 30px;
width: 30px;
display: -ms-flexbox;
display: flex;
justify-content: center;
align-items: center;
background: #000;
font-family: FontAwesome;
content: '\f00c';
font-size: inherit;
color: #fff;
/*position of the checkbox to the relative container*/
position: absolute;
top: 0px;
/*change position to left or right and specify offset*/
right: 5px;
}
/*Offset the line name from the left*/
@media(max-width:767px) {
.benefit-selected-box [class*="BenefitIntro"] {
padding-left: 40px;
}
.benefit-selected-box .benefitline::before {
/*On mobile this position could be left or right*/
right: 0;
}
}
@media(min-width:992px) {
.benefit-selected-box .benefitline::before {
height: 100%;
}
}
/* line group text colour */
.benefit-matrix .group-default {
color: #000;
}
/* line name */
.benefit-matrix .lineheader > a:link {
color: #000;
}
.benefit-matrix .lineheader > a:link:hover,
.benefit-matrix .lineheader > a:link:focus {
color: #000;
}
.benefit-matrix .lineheader > a:link:active,
.benefit-matrix .lineheader > a:link:active:hover,
.benefit-matrix .lineheader > a:link:active:focus {
color: #000;
}
.benefit-matrix .lineheader > a:link:focus,
.benefit-matrix .lineheader > a:link:active:focus {
outline: 3px solid #666;
}
/* Line sets - add spacing between lines in the line set
display the line name on a separate line to the plan/coverage */
.benefit-matrix .lineset-linename + span {
display: block;
padding-left: .65em
}
.row.title + .row > div > div:not(:last-child) {
margin-bottom: 1em
}
/* change play icon next to selected benefit option */
.benefit-matrix .glyphicon-play::before {
font-family: 'Glyphicons Halflings';
content: "\e072";
font-size: 1em;
font-weight: bold;
color: #000
}
/* select buttons */
.benefit-matrix .row .btn-success,
.benefit-matrix .row .btn-success:hover,
.benefit-matrix .row .btn-success:focus,
.benefit-matrix .row .btn-success:active:hover {
width: 100%;
}
.bootstrap-iso .uib-datepicker-popup .btn-sm.btn-danger, .templates .uib-datepicker-popup .btn-sm.btn-danger, .btn.btn-sm.btn-success.pull-right.uib-close.ng-binding, .bootstrap-iso .uib-datepicker-popup .btn-sm.btn-info, .templates .uib-datepicker-popup .btn-sm.btn-info {
border: 2px solid #1841a9;
width: auto;
}
/* approved dependant and beneficiary listing text colour */
.benefit-matrix h4[tbs-translate='Enrollment.Step3.WhoIsCovered'],
.benefit-matrix h5[tbs-translate='Enrollment.Online2.BeneficiaryAllocations'] {
color: #000;
}
.benefit-matrix h5[tbs-translate='Enrollment.Online2.BeneficiaryAllocations'] {
font-size: 1.125rem;
}
.dependent-approved {
color: #000;
}
/* new and changed labels */
.benefit-matrix .newbenefit,
.benefit-matrix .changebenefit {
background-color: #005A6C;
position: relative;
}
/* unlocked label */
.benefit-matrix .glyphicon-record,
.benefit-matrix .acitve-text {
background-color: #005A6C;
color: #fff;
visibility: hidden;
}
.benefit-matrix .glyphicon-record:before {
content: '';
}
.benefit-matrix .glyphicon-record .acitve-text {
font-family: 'Open Sans';
font-weight: 500;
padding: 2px 6px 3px 6px;
text-transform: lowercase;
top: -5px;
visibility: visible;
}
/* remove active with data more info icon */
.benefit-matrix .panel-title .glyphicon-info-sign-color {
display: none;
}
/* active with data intro text */
.benefit-matrix .benefit-active-benefits {
padding-bottom: 20px;
}
.benefit-matrix .benefit-active-benefits .active-intro {
display: none;
}
/*================================================================================================== 9. Benefit selection ==================================================================================================*/
/* continue button */
.benefitselect .continue,
.benefitselect .continue:hover,
.benefitselect .continue:focus,
.benefitselect .continue:active,
.benefitselect .continue:active:hover,
.benefitselect .continue:active:focus {
border-radius: 30px;
}
/* line name */
.benefitselect .line-name {
color: #000;
}
/* more info icon */
.benefitselect .line-benefit-intro .glyphicon-info-sign-color {
color: #000;
}
.box-border {
border-color: #000;
}
#products .box-border-bg {
margin-top: 20px;
}
/* 'Currently Selected' heading */
.benefitselect .header-selected {
color: #000;
}
/* currently selected box */
.benefitselect .in-Cart .you-pay > p:nth-of-type(2) {
display: none;
}
/* select buttons */
.online-two-iso .benefitselect A.button-style.green {
background-color: #ffd900;
border-radius: 20px;
color: #1841a9;
border: 2px solid #ffd900;
}
.online-two-iso .benefitselect A.button-style.green:hover {
background-color: #1841a9;
box-shadow: none;
color: #fff;
width: 150px;
border: 2px solid #1841a9;
}
.online-two-iso .benefitselect A.button-style.green:focus {
background-color: #1841a9;
box-shadow: none;
color: #fff;
width: 150px;
border: 2px solid #1841a9;
}
.online-two-iso .benefitselect A.button-style.green:active,
.online-two-iso .benefitselect A.button-style.green:active:hover,
.online-two-iso .benefitselect A.button-style.green:active:focus {
background-color: #1841a9;
color: #fff;
width: 150px;
border: 2px solid #1841a9;
}
/* remove division elements between benefits */
.division {
display: none;
}
/* benefit description row colour */
.benefitselect .line-benefit-intro .line-description .row {
background: white;
}
/* remove full benefit details link */
.bootstrap-iso.benefitselect .more-info {
display: none;
}
/* remove background image shadow */
.box-border-bg {
background: none;
}
/*currently selected box text colour */
.benefitselect .content-you-chose,
.benefitselect .content-you-chose p,
.in-Cart .you-chose .selected-plan,
SPAN.green-number,
.benefitselect .in-Cart .you-pay H3,
.benefitselect .in-Cart .you-pay P SPAN.green-number {
color: #000;
}
.content-you-chose-no-shop-more {width: 100% !important;}
/* EOI pending asterisk */
.benefitselect .alignleft .pending-note {
display: inline;
float: none;
}
/* available products heading */
.benefitselect .products-header H4 {
color: #000;
}
/* selected plan border box */
.benefitselect .products .box-border.sel,
.benefitselect .products .box-border.sel .header {
background: #000;
}
.benefitselect .products .box-border.sel .header {
padding-left: 0;
}
/* hide provider finder and prescription finder */
.available-options .links-group.four-links {
display: none;
}
/* selected coverage text colour */
.option-credit-health .option.sel {
color: #666;
}
/* see also link colour */
.benefitselect .linename > a:link {
color: #000;
}
.benefitselect .linename > a:hover {
color: #000;
}
.benefitselect .linename > a:focus {
color: #000;
}
.benefitselect .linename > a:active,
.benefitselect .linename > a:active:hover,
.benefitselect .linename > a:active:focus {
color: #000;
}
/*currently selected section*/
.benefitselect .selected-coverage strong, .benefitselect #content-you-chose-summary .green-number {
font-weight: bold;
}
.benefitselect .you-pay h3 {
font-weight: normal;
}
/*================================================================================================== 10. Profile ==================================================================================================*/
/* headings */
.online-two-iso P.sectionTitle,
html#profile body#profile .profile #profile-online-2 #dependantsTab P.full-name,
html#profile body#profile .profile #profile-online-2 #beneficiariesTab P.full-name {
color: #004fb6;
}
/*instruction*/
.online-two-iso .validation-rules li.failed {
color: #1841a9;
}
.form-data .save-button .button-style:hover, .form-data .save-button .button-style:active, .form-data .save-button .button-style:focus, .form-data .save-button .button-style:hover:active {width: 100%;}
/* buttons */
html#profile body#profile #profile-online-2 .button-style.green,
html#profile body#profile #profile-online-2 .button-style.orange,
html#profile body#profile #profile-online-2 .button-style.blue {
background-color: #ffd900;
border-radius: 20px;
color: #1841a9;
border: 2px solid #ffd900;
}
html#profile body#profile #profile-online-2 .button-style.green:hover,
html#profile body#profile #profile-online-2 .button-style.green:focus,
html#profile body#profile #profile-online-2 .button-style.orange:hover,
html#profile body#profile #profile-online-2 .button-style.orange:focus,
html#profile body#profile #profile-online-2 .button-style.blue:hover,
html#profile body#profile #profile-online-2 .button-style.blue:focus {
background-color: #1841a9;
box-shadow: none;
color: #fff;
border: 2px solid #1841a9;
}
html#profile body#profile #profile-online-2 .button-style.green:active,
html#profile body#profile #profile-online-2 .button-style.green:active:hover,
html#profile body#profile #profile-online-2 .button-style.green:active:focus,
html#profile body#profile #profile-online-2 .button-style.orange:active,
html#profile body#profile #profile-online-2 .button-style.orange:active:hover,
html#profile body#profile #profile-online-2 .button-style.orange:active:focus,
html#profile body#profile #profile-online-2 .button-style.blue:active,
html#profile body#profile #profile-online-2 .button-style.blue:active:hover,
html#profile body#profile #profile-online-2 .button-style.blue:active:focus {
background-color: #1841a9;
color: #fff;
border: 2px solid #1841a9;
}
/* resetting the country selector dropdown when editing address info */
.bootstrap-iso .dropdown-toggle:before {
background-color: transparent;
}
.bootstrap-iso .dropdown-toggle,
.bootstrap-iso .dropdown-toggle:hover,
.bootstrap-iso .dropdown-toggle:focus {
background-color: #fff;
border: 1px solid rgba(0, 0, 0, 0.15);
border-radius: 0;
color: #333;
text-transform: none;
text-align: left;
}
.bootstrap-iso .dropdown-toggle:focus {
outline: none;
box-shadow: 0 0 6px #666;
}
/* header overlay for adding/editing/deleting dependants/beneficiaries */
html#profile body#profile .profile #profile-online-2 .header-overlay H5 {
font-weight: 500;
}
/* dependants tab styling */
html#profile body#profile #profile-online-2 #dependantsTab .left-taboff .sectionTitledimmedLeft,
html#profile body#profile #profile-online-2 #dependantsTab .right-taboff .sectionTitledimmed {
color: #000;
}
html#profile body#profile #profile-online-2 #dependantsTab .left-tabon .sectionTitle {
color: #000;
border-bottom: 0.5em solid #000;
padding-bottom: 0.25em;
}
html#profile body#profile #profile-online-2 #dependantsTab .right-tabon {
border-bottom: 0.5em solid #000;
}
html#profile body#profile #profile-online-2 #dependantsTab .right-tabon .sectionTitledimmed {
color: #000;
}
/* beneficiaries tab styling */
html#profile body#profile #profile-online-2 #beneficiariesTab .left-taboff .sectionTitledimmedLeft,
html#profile body#profile #profile-online-2 #beneficiariesTab .right-taboff .sectionTitledimmed {
color: #000;
}
html#profile body#profile #profile-online-2 #beneficiariesTab .left-tabon .sectionTitle,
html#profile body#profile #profile-online-2 #beneficiariesTab .right-tabon .sectionTitle {
color: #000;
border-bottom: 0.5em solid #000;
padding-bottom: 0.25em;
}
/* beneficiaries edit allocation popup */
html#profile body#profile .profile #profile-online-2 #allocationDialog .btn-group label {
background-color: #005A6C;
border: 1px solid white;
border-radius: 0;
color: #000;
font-size: 1rem;
font-weight: normal;
padding: 6px 12px;
text-transform: uppercase;
}
html#profile body#profile .profile #profile-online-2 #allocationDialog .btn-group label.active {
background-color: #005A6C;
box-shadow: none;
color: #000;
}
html#profile body#profile .profile #profile-online-2 #allocationDialog .btn-group label:hover,
html#profile body#profile .profile #profile-online-2 #allocationDialog .btn-group label:focus {
background-color: #686868;
color: #000;
}
/* security tab styling */
.left-taboff,
.right-taboff {
background: none;
}
html#profile body#profile #profile-online-2 #securityTab .left-taboff .sectionTitledimmedLeft,
html#profile body#profile #profile-online-2 #securityTab .right-taboff .sectionTitledimmed {
color: #000;
}
html#profile body#profile #profile-online-2 #securityTab .left-tabon .sectionTitle,
html#profile body#profile #profile-online-2 #securityTab .right-tabon .sectionTitle {
color: #000;
border-bottom: 0.5em solid #000;
padding-bottom: 0.25em;
width: 50%;
}
/* preferences toggle button */
#communicationPreferencesTab .ui-buttonset label {
border: 1px solid #ccc;
}
#communicationPreferencesTab .ui-buttonset .ui-button.ui-state-active .ui-button-text {
background-color: #ffd900;
background-image: none;
}
#communicationPreferencesTab .ui-buttonset .ui-button.ui-state-active .ui-button-text:before {
font-family: FontAwesome;
content: '\f00c';
position: relative;
left: -0.5em;
}
.bootstrap-iso .glyphicon-chevron-left::before {
content: none;
}
/* ensuring that the marketing preferences toggles are in alignment */
@media only screen and (min-width: 992px) {
#communicationPreferencesTab p#marketingHeader + div.row {
display: flex;
}
html#profile body#profile .profile #profile-online-2 #profilecontainer #communicationPreferencesTab .content-box-border .row .grid-cell {
display: flex;
flex-wrap: wrap;
}
html#profile body#profile .profile #profile-online-2 #profilecontainer #communicationPreferencesTab .content-box-border .row .grid-cell .ui-buttonset {
align-self: flex-end;
}
}
/*================================================================================================== Mailbox ==================================================================================================*/
.k-state-selected {
background-color: #2f4f4f !important;
}
/* save/delete popup modal */
div.tbs-modal h2 {
color: white;
text-transform: uppercase;
}
/*================================================================================================== 11. App registration ==================================================================================================*/
#mobileRegistration .box-border {
border: none;
}
#mobileRegistration .box-left-bg,
#mobileRegistration .box-border-bg {
background: none;
}
#mobileRegistration #CMSEditableRegionDiv {
padding: 1em;
}
#mobileRegistration .mobile-registration-fullwidth > .mobile-registration-left,
#mobileRegistration .mobile-registration-app-download {
display: none;
}
#mobileRegistration .d-block {
display: block;
}
#mobileRegistration .qr-background {
background: #686868;
}
#mobileRegistration p.lead {
font-size: 1.25rem;
}
#mobileRegistration p {
font-size: 1rem;
font-weight: 300;
padding-left: 0;
}
#mobileRegistration ol {
margin: 0.5em 1em;
list-style: decimal;
}
#mobileRegistration-Content {
font-size: 1rem;
}
#mobileRegistration .bootstrap-iso label {
color: #000;
font-size: 1rem;
}
#mobileRegistration .bootstrap-iso input {
display: block;
}
#mobileRegistration .bootstrap-iso #pwdMeter {
margin-left: 0;
margin-top: 0.5em;
margin-bottom: 0.5em;
}
#mobileRegistration .bootstrap-iso #newPasswordSave {
float: none !important;
}

#mobileRegistration .well-lg {
padding: 18px 9px;
}
#mobileRegistration .fa span {
font-family: Arial;
padding-left: 0.5em;
font-size: 0.875rem;
vertical-align: middle;
}
@media only screen and (max-width: 991px) {
#mobileRegistration .download-section p {
padding-top: 1em;
}
}
@media only screen and (max-width: 769px) {
#CMSEditableRegionDiv img {
display: block;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.online-two-iso #MobileRegistation .page-content {
width: 100vw;
}
#MobileRegistation .form-data .box-border-bg {
padding-right: 0;
}
}
#navtablist1 a {
border-left: 2px solid #000;
padding-left: 16px;
height: 18px;
}
/*================================================================================================== 12. TRS ==================================================================================================*/
/* homepage module styling */
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .module-content.TRS p {
margin-bottom: -70px
}
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .highcharts-background {
fill: transparent;
}
.trsdashboard .summary-myreward {
visibility: hidden;
}
.trsdashboard .summarystatementdate {
color: #666;
text-align: center;
font-size: 2rem;
}
/* alignment of data group chart total between pre and post text */
.textareaChartTab .LineGroupTotal {
display: inline-block;
}
/* vertical table styling */
.trsdashboard .table,
.trsdashboard .table > thead > tr > th,
.trsdashboard .table tbody tr td {
border: none;
}
.trsdashboard .table {
border: 1px solid #ccc
}
.trsdashboard .table > thead > tr > th {
background-color: #005A6C;
color: #fff;
}
.trsdashboard .table > thead > tr > th,
.trsdashboard .table tbody tr:not(:last-child) td {
border-bottom: 1px solid #ccc
}
/* consistent font-size as rest of the TRS */
.trsdashboard .table,
.trsdashboard .table tbody tr td {
font-size: 1rem;
}
/* ensuring that Default components and those with Vertical Tables are aligned on the left and right consistently */
@media only screen and (min-width: 768px){
.chart_line.row {
margin-left: 0px;
width: calc(60% - 30px)
}
/*.content-name {
padding-left: 15px
}*/
.tab-pane .table-responsive {
padding: 0 15px
}
}

/*second renewal changes*/
.trsdashboard .col-md-5 tbs-highchart {
    display: none;
}

/*================================================================================================== 13. Specific popups ==================================================================================================*/
/* 13a) forgot password */
/* progress bar colour */
.bootstrap-iso .progress-bar-success {
background-color: #408391;
}
/* 13b) modellers and tools */
/* overlay header */
.bootstrap-iso .modellersModalHeader {
margin-top: 7px;
}
.modal-normal ul.modeller-links {
padding-left: 1.25em;
width: 100%;
}
.modeller-close-button.btn-warning.btn.ng-isolate-scope {
width: 20%;
background-color: #ffd900;
}
/* selected tab*/
.modeller-links li a.checked,
.modeller-links li a.unchecked:hover {
background-color: transparent;
border-bottom: 0.5em solid #000;
color: #000;
}
/* unselected tab */
.modeller-links li a.unchecked {
background-color: transparent;
color: #000;
}
/* text color */
.modeller-container .row-header,
.modeller-container .row-summary {
color: #666;
}
/* tax code input */
/* model button */
input.modeller-line-bottom {
background-color: #ffd900;
border-radius: 20px;
color: #1841a9;
text-transform: uppercase;
}
input.modeller-line-bottom:hover {
background-color: #1841a9;
color: #fff;
}
input.modeller-line-bottom:focus {
background-color: #1841a9;
box-shadow: none;
color: #fff;
}
input.modeller-line-bottom:active,
input.modeller-line-bottom:active:hover,
input.modeller-line-bottom:active:focus {
background-color: #1841a9;
box-shadow: none;
color: #fff;
}
/* 13c) manage dependants */
/* overlay header */
.bootstrap-iso .dependantModalHeader {
margin-top: 7px;
}
.bootstrap-iso .dependantContainer .tab-header {
background-color: white;
}
/* remove intro text created from resource string */
.dependantIntroText {
display: none;
}

#allocationDialog .add-beneficiary {
color: #000;
}
#allocationDialog .add-beneficiary:hover {
color: #000;
}
#allocationDialog .add-beneficiary:focus {
color: #000;
}
#allocationDialog .add-beneficiary:active,
#allocationDialog .add-beneficiary:active:hover,
#allocationDialog .add-beneficiary:active:focus {
color: #000;
}
/* add, edit and remove links */
.dependant-list-top a.dependant-add-link,
.dependant-list a.dependant-edit,
.dependant-list a.dependant-remove {
color: #000;
}
.dependant-list .caption {
color: #000;
}
.dependant-list .dependant-add-item a.dependant-edit,
.dependant-list .dependant-add-item a.dependant-remove {
color: #000;
padding: 6px 12px;
}
.dependant-list .dependant-add-item a.dependant-edit {
background-color: #005A6C;
}
.dependant-list .dependant-add-item a.dependant-remove {
background-color: #fff;
}
.dependant-list-top a.dependant-add-link:hover,
.dependant-list a.dependant-edit:hover,
.dependant-list a.dependant-remove:hover {
color: #000;
}
.dependant-list .dependant-add-item a.dependant-edit:hover,
.dependant-list .dependant-add-item a.dependant-remove:hover {
background-color: #fff;
color: #000;
}
.dependant-list-top a.dependant-add-link:focus,
.dependant-list a.dependant-edit:focus,
.dependant-list a.dependant-remove:focus {
color: #000;
}
.dependant-list .dependant-add-item a.dependant-edit:focus,
.dependant-list .dependant-add-item a.dependant-remove:focus {
background-color: #686868;
color: #000;
}
.dependant-list-top a.dependant-add-link:active,
.dependant-list-top a.dependant-add-link:active:hover,
.dependant-list-top a.dependant-add-link:active:focus,
.dependant-list a.dependant-edit:active,
.dependant-list a.dependant-edit:active:hover,
.dependant-list a.dependant-edit:active:focus,
.dependant-list a.dependant-remove:active,
.dependant-list a.dependant-remove:active:hover,
.dependant-list a.dependant-remove:active:focus {
color: #000;
}
.dependant-list .dependant-add-item a.dependant-edit:active,
.dependant-list .dependant-add-item a.dependant-edit:active:hover,
.dependant-list .dependant-add-item a.dependant-edit:active:focus,
.dependant-list .dependant-add-item a.dependant-remove:active,
.dependant-list .dependant-add-item a.dependant-remove:active:hover,
.dependant-list .dependant-add-item a.dependant-remove:active:focus {
background-color: #fff;
color: #000;
}
/* costs displayed on Dependants Covered tab */
.benefit-matrix .employee-cost .cost-number {
color: #666;
}

/* table header colour when removing dependants that are attached to cover */
.table.reverse-header thead > tr > th {
background-color: #005A6C;
}
.btn.btn-warning.dependant-cancel-btn {
width: 9rem;
}
.coverage-pannel .btn.btn-warning.dependant-cancel-btn:hover, .coverage-pannel .btn.btn-warning.dependant-cancel-btn:active,
.coverage-pannel .btn.btn-warning.dependant-cancel-btn:hover:active:focus, .coverage-pannel .btn.btn-warning.dependant-cancel-btn:focus{
color: #fff;
}
.btn.btn-warning.dependant-cancel-btn:hover,
.btn.btn-warning.dependant-cancel-btn:active {
color: white;
}
.btn.btn-warning.dependant-editing-btn,
.btn.btn-success.dependant-accept-btn,
.btn.btn-warning.dependant-adding-btn{
width: 9rem;
}
.dependant-pannel .btn.btn-warning.dependant-cancel-btn {
background-color: #fff;
border: 2px solid #1841a9;
}
.dependant-pannel .btn.btn-warning.dependant-cancel-btn:hover, .btn.btn-warning.dependant-cancel-btn:active {
background-color: #1841a9;
}
/* 13d) benefit matrix follow up items */
/* overlay header */
#followup-items-overlay.online-followup-items #followup-items-title {
background-color: #fff;
font-weight: normal;
text-align: left;
text-transform: uppercase;
width: 100%;
}
/* close icon */
#followup-items-overlay a.close {
top: 2px;
}
/* oustanding items complete icon */
.online-two-iso .success-icon {
color: #408391;
}
/* completed items dot indicator color */
.followup-content .progress-indicator .step-finished {
background-color: #408391;
}
/* 13e) benefit matrix T&Cs */
/* overlay header */
.benefit-matrix .benefitheader {
text-transform: uppercase;
}
/* terms and conditions main text elements */
#main.matrix .modal-dialog .confirmchoice ul li {
list-style: none;
margin: 0;
}
@media only screen and (min-width: 768px) {
.bootstrap-iso .confirmchoice .dl-horizontal dt {
text-align: left;
}
}
.benefit-matrix .modal-footer #confirmation-buttons .confirm_agreement label.btn.btn-default {width: auto; border-radius: 0px;}
.benefit-matrix .modal-footer #confirmation-buttons .btn-default.active {
background-color: #1841a9;
width: auto;
color: #fff;
}
.benefit-matrix .modal-footer #confirmation-buttons .btn-default:hover {
border: 1px solid #ccc;
border-radius: 0;
width: auto;
}
/* 13f) benefit selection election info collect */
/* header overlay */
.online-two-iso .modal-normal .modal-header .header-text {
padding-left: 1em;
}
.election-info-collect .dependant-board .expand-sign {
color: #666;
}
.election-info-collect .dependant-board .icon {
background-image: none;
width: 0;
}
.election-info-collect .dependant-board .icon:before {
color: #000;
content: '\f0c0';
font-family: 'FontAwesome';
font-size: 3rem;
padding-right: 0.25em;
}
.election-info-collect .btn.btn-warning.dependant-cancel-btn {
background-color: white;
border: 2px solid #1841a9;
}
.election-info-collect .btn.btn-warning.dependant-cancel-btn:hover, .btn.btn-warning.dependant-cancel-btn:active,
.election-info-collect .btn.btn-warning.dependant-cancel-btn:hover:active {
background-color: #1841a9;
}
.dependant-list .dependant-name span {
color: #000;
    font-weight: normal;
}
.static-list-item {
margin-top: 6px;
    }
/* 13g) benefit selection beneficiaries */
/* primary, contingent, none button group */
.benefitselect #allocationDialog .btn-group label:first-of-type {
border-radius: 0;
}
.benefitselect #allocationDialog .btn-group label {
border: 1px solid white;
}
.benefitselect #allocationDialog .btn-group .active {
background-color: #ffd900;
}
#allocationDialog .edit-beneficiary,
#allocationDialog .delete-beneficiary {
color: #000;
}
#allocationDialog .edit-beneficiary:hover,
#allocationDialog .edit-beneficiary:focus,
#allocationDialog .delete-beneficiary:hover,
#allocationDialog .delete-beneficiary:focus {
color: #000;
}
#allocationDialog .edit-beneficiary:active,
#allocationDialog .edit-beneficiary:active:hover,
#allocationDialog .edit-beneficiary:active:focus,
#allocationDialog .delete-beneficiary:active,
#allocationDialog .delete-beneficiary:active:hover,
#allocationDialog .delete-beneficiary:active:focus {
color: #000;
}
/****************************************** benefit intro popup **************************************/
.faq-answer {
padding-bottom: 1em;
}
/*================================================================================================== 14. Icons ==================================================================================================*/
/* general styling for using icons for benefits */
/*.benefit-matrix .benefitline .benefit-menu .img:before,
div.see-also .img:before,
#benefit-overview .summaryImage .img:before {
font-family: OnlineTwoIconFont;
font-size: 8rem;
position: relative;
top: -0.1em;
color: #000;
}*/
/* icon size for 'see also' section of benefit selection page */
div.see-also .img:before {
font-size: 3.5rem;
top: -0.25em;
}

/* 14b) life event icon general coding */
/* background of image placeholder */
.benefit-matrix .active-benefits .img {
width: 100%;
height: 100%;
margin: 0;
}
.active-benefits .img.E2e6d3845-7d6b-4929-95cc-d2ada198a865 {background: url( /Aviva/media/default/Aviva%202022/Life%20events/Aviva-lifeevent-icon_3.png) no-repeat center/cover;}
.active-benefits .img.Ed5bfd4d0-4364-4cc8-a7a8-dae601745a63 {background: url( /Aviva/media/default/Aviva%202022/Life%20events/Aviva-lifeevent-icon_1.png) no-repeat center/cover;}
.active-benefits .img.E82cefe73-e6c2-4a46-ac3c-2eb8b5819fda {background: url( /Aviva/media/default/Aviva%202022/Life%20events/Aviva-lifeevent-icon_4.png) no-repeat center/cover;}
.active-benefits .img.E9103af1e-d949-4efd-a484-b3de50ee89f1 {background: url( /Aviva/media/default/Aviva%202022/Life%20events/Aviva-lifeevent-icon_2.png) no-repeat center/cover;}

/* general styling for using icons for events */
/*.benefit-matrix .active-benefits .img:before {
font-size: 6rem;
color: white;
}*/

/*================================================================================================== 15. Claims ==================================================================================================*/
/* make a claim styling */
body#claim {
padding-top: 0;
}
/* spacing and padding */
div#claimDetail.row,
div#receiptDetail.row,
div#Attachment.row,
#claimItemBreakdownDetail {
padding-bottom: 0px;
}
/* remove additional details section as not relevant */
#AdditionalDetail,
.claim-additional-info {
display: none;
}
#Attachment > .grid-cell,
#ajax-uploader-group,
#ajax-uploader-group p:nth-of-type(2),
#tblFiles {
margin-bottom: 0;
}
/* page title and headings */
.online-two-iso .fsaClaimSubmitContainer .webpartTitle {
background-color: #fff;
}
.fsaClaimSubmitContainer #flexClaimTitle h1,
.online-two-iso .fsaClaimSubmitContainer h3 {
color: #000;
font-weight: bold;
margin-bottom: 0;
margin-top: 0;
}
/* horizontal rules */
.fsaClaimSubmitContainer hr {
margin: 0;
padding: 5px 0;
background-color: #fff;
}
/* label colour */
.online-two-iso .fsaClaimSubmitContainer label {
color: var(--primary-text-color);
}

/* attach, cancel and submit buttons */
.online-two-iso .fsaClaimSubmitContainer .btn-success,
.online-two-iso .fsaClaimSubmitContainer .btn-default,
.online-two-iso .fsaClaimSubmitContainer .btn-primary {
background-color: #005A6C;
border: none;
border-radius: 20px;
color: #fff;
font-weight: bold;
transition: all 0.25s;
}
.online-two-iso .fsaClaimSubmitContainer .btn-success:hover,
.online-two-iso .fsaClaimSubmitContainer .btn-success:focus,
.online-two-iso .fsaClaimSubmitContainer .btn-success:active,
.online-two-iso .fsaClaimSubmitContainer .btn-success:active:hover,
.online-two-iso .fsaClaimSubmitContainer .btn-success:active:focus,
.online-two-iso .fsaClaimSubmitContainer .btn-default:hover,
.online-two-iso .fsaClaimSubmitContainer .btn-default:focus,
.online-two-iso .fsaClaimSubmitContainer .btn-default:active,
.online-two-iso .fsaClaimSubmitContainer .btn-default:active:hover,
.online-two-iso .fsaClaimSubmitContainer .btn-default:active:focus,
.online-two-iso .fsaClaimSubmitContainer .btn-primary:hover,
.online-two-iso .fsaClaimSubmitContainer .btn-primary:focus,
.online-two-iso .fsaClaimSubmitContainer .btn-primary:active,
.online-two-iso .fsaClaimSubmitContainer .btn-primary:active:hover,
.online-two-iso .fsaClaimSubmitContainer .btn-primary:active:focus {
background-color: #686868;
}

/* datepicker styling */
/* left, right and year/month/day selection buttons in header of datepicker */
.fsaClaimSubmitContainer table.uib-yearpicker thead th button.btn-default,
.fsaClaimSubmitContainer table.uib-monthpicker thead th button.btn-default,
.fsaClaimSubmitContainer table.uib-daypicker thead th button.btn-default {
border-radius: 0;
}
.fsaClaimSubmitContainer table.uib-yearpicker thead tr:first-of-type th:nth-of-type(2),
.fsaClaimSubmitContainer table.uib-monthpicker thead tr:first-of-type th:nth-of-type(2),
.fsaClaimSubmitContainer table.uib-daypicker thead tr:first-of-type th:nth-of-type(2) {
border-left: 1px solid #fff;
border-right: 1px solid #fff;
}
/* day/month/year buttons of datepicker */
.fsaClaimSubmitContainer table.uib-yearpicker tbody td .btn-default,
.fsaClaimSubmitContainer table.uib-monthpicker tbody td .btn-default,
.fsaClaimSubmitContainer table.uib-daypicker tbody td .btn-default {
background-color: transparent;
border: 1px solid #ccc;
border-radius: 3px;
color: #333;
}

/* today and clear button group */
.fsaClaimSubmitContainer .uib-datepicker-popup .btn-group .btn {
background-color: #005A6C;
border: none;
transition: background-color 0.25s;
}
.fsaClaimSubmitContainer .uib-datepicker-popup .btn-group button:first-of-type {
border-top-left-radius: 20px;
border-bottom-left-radius: 20px;
border-right: 1px solid #fff;
}
.fsaClaimSubmitContainer .uib-datepicker-popup .btn-group button:last-of-type {
border-top-right-radius: 20px;
border-bottom-right-radius: 20px;
border-left: 1px solid #fff;
}
/* selected year/month/day and hover styling */
.fsaClaimSubmitContainer .uib-datepicker-popup .btn.btn-default.active,
.fsaClaimSubmitContainer .uib-datepicker-popup .btn-group .btn:hover {
background-color: #686868;
}
.fsaClaimSubmitContainer .uib-datepicker-popup .btn.btn-default.active
.text-info {
color: #000;
}

/* claim submitted table header styling */
.claimSubmittedHeader {
background-color: var(--primary-text-color);
}
.online-two-iso .claimSubmittedHeader h3 {
color: #fff;
}

/* claim overview */
/* links */
body#StatementAndClaimSubmit #wrapper a {
color: #000;
}
body#StatementAndClaimSubmit #wrapper a:hover,
body#StatementAndClaimSubmit #wrapper a:focus {
color: #000;
text-decoration: none;
}
body#StatementAndClaimSubmit #wrapper a:active,
body#StatementAndClaimSubmit #wrapper a:active:hover,
body#StatementAndClaimSubmit #wrapper a:active:focus {
color: #000;
}
/* navigation tabs */
.FSAStatementAndHistoryContainer .htabs-container .tabs UL LI A {
text-transform: none;
}
.FSAStatementAndHistoryContainer .htabs-container,
.FSAStatementAndHistoryContainer .htabs-container .tabs-bg,
.FSAStatementAndHistoryContainer .htabs-container .tabs UL LI,
.FSAStatementAndHistoryContainer .htabs-container .tabs UL LI.sel,
.FSAStatementAndHistoryContainer .htabs-container .tabs UL LI.sel STRONG,
.FSAStatementAndHistoryContainer .htabs-container .tabs UL LI A,
.FSAStatementAndHistoryContainer .htabs-container .tabs UL LI.sel A {
background: none;
}
.FSAStatementAndHistoryContainer .htabs-container .tabs-bg {
background: linear-gradient(to bottom, #fff, #ededed);
}
.FSAStatementAndHistoryContainer .htabs-container .tabs UL LI {
background-color: transparent !important;
background: url(/smartrewardNL/media/Images/Misc%20Icons/Aon_TBS-lite_Icons-9_off.png)
no-repeat 50% 20%;
}
.FSAStatementAndHistoryContainer .htabs-container .tabs UL LI.sel,
.FSAStatementAndHistoryContainer .htabs-container .tabs UL LI:hover {
background-color: transparent !important;
background: url(/smartrewardNL/media/Images/Misc%20Icons/Aon_TBS-lite_Icons-9.png)
no-repeat 50% 20%;
}
.FSAStatementAndHistoryContainer .htabs-container .tabs UL LI A,
.FSAStatementAndHistoryContainer .htabs-container .tabs UL LI.sel A {
font-size: 1rem;
}
#StatementAndClaimSubmit .FSAStatementAndHistoryContainer .htabs-container .tabs UL LI.sel A,
.FSAStatementAndHistoryContainer .htabs-container .tabs UL LI A:hover {
border-bottom: 0.5em solid var(--primary-text-color);
color: var(--primary-text-color);
font-weight: bold;
padding-bottom: 20px;
}

/* calim number column of calim data tables */
.FSAStatementAndHistoryContainer .claim-number {
width: 125px;
}

/* headings */
.online-two-iso .FSAStatementAndHistoryContainer h1 {
color: #000;
margin-bottom: 0;
}
.online-two-iso .claim-history h2 {
color: var(--primary-text-color);
}

/* hover effect for the tables */
.claim-history .claim-table > tbody > tr:hover {
background-color: #f5f5f5;
}

/* Pending, Approved and Rejected icons */
.claim-approved img {
display: none;
}
.claim-approved a:before {
font-family: FontAwesome;
font-size: 1.75rem;
width: 20px;
height: 20px;
display: inline-block;
transition: transform .1s;
}
.claim-approved a:hover {
text-decoration: none;
}
.claim-approved a:hover:before,
.claim-approved a:focus:before {
transform: scale(1.3);
}
.claim-approved a[title='Approved']:before,
.claim-approved a[title='Goedgekeurd']:before {
content: '\f00c';
color: #75bf71;
}
.claim-approved a[title='Rejected']:before,
.claim-approved a[title='Geweigerd']:before {
content: '\f00d';
color: var(--secondary-text-color);
}
.claim-approved a[title='Pending']:before,
.claim-approved a[title='Afwachting']:before {
content: '\f0ec';
color: var(--primary-text-color);
}

/* buttons in popup modal */
.claim-edit-link .btn.btn-primary,
.claim-edit-link .btn.btn-info {
background-color: #005A6C;
color: #fff;
border: none;
border-radius: 25px;
transition: background-color 0.25s;
}
body#StatementAndClaimSubmit .btn-default {
background-color: #fff;
color: #fff;
border: none;
border-radius: 25px;
transition: background-color 0.25s;
}
.claim-edit-link .btn.btn-primary:hover,
.claim-edit-link .btn.btn-primary:focus,
.claim-edit-link .btn.btn-primary:active,
.claim-edit-link .btn.btn-primary:active:hover,
.claim-edit-link .btn.btn-primary:active:focus,
.claim-edit-link .btn.btn-info:hover,
.claim-edit-link .btn.btn-info:focus,
.claim-edit-link .btn.btn-info:active,
.claim-edit-link .btn.btn-info:active:hover,
.claim-edit-link .btn.btn-info:active:focus,
body#StatementAndClaimSubmit .btn-default:hover,
body#StatementAndClaimSubmit .btn-default:focus,
body#StatementAndClaimSubmit .btn-default:active,
body#StatementAndClaimSubmit .btn-default:active:hover,
body#StatementAndClaimSubmit .btn-default:active:focus {
background-color: #686868;
}

/* selected tab styling on FSA statement tab */
body#StatementAndClaimSubmit #wrapper .spendingaccountsTab-container .tabs UL LI.sel A,
body#StatementAndClaimSubmit #wrapper .spendingaccountsTab-container .tabs UL LI A:hover {
background-color: var(--primary-text-color);
color: #fff;
font-weight: bold;
}
/* table headings on FSA statement tab */
.fsa-table-caption .section_title,
.subtitle-claims .section_title {
color: var(--primary-text-color);
}

/*================================================================================================== 16. My Documents ==================================================================================================*/
/* make table of documents responsive */
#tabledocuments {
display: block !important;
width: 100%;
margin-bottom: 15px;
overflow-y: hidden;
-ms-overflow-style: -ms-autohiding-scrollbar;
}
#tabledocuments th,
#tabledocuments td {
padding: 5px;
}
#tabledocuments > thead > tr > th {
background-color: var(--tertiary-text-color);
}
a#btnNewDocument {
color: #000 !important;
}
a#btnNewDocument:hover {
color: #000 !important;
text-decoration: none;
}
#dlguploadDocument #btn-upload-document-save,
#deleteDocumentDialog #dspdeleteDocument {
background-color: #005A6C;
border-radius: 25px;
font-weight: bold;
transition: background-color 0.25s;
}
#dlguploadDocument #btn-upload-document-cancel,
#deleteDocumentDialog #btnCancelDocument .gray {
background-color: #fff;
transition: background-color 0.25s;
}
#dlguploadDocument #btn-upload-document-save:hover,
#dlguploadDocument #btn-upload-document-save:focus,
#dlguploadDocument #btn-upload-document-cancel:hover,
#dlguploadDocument #btn-upload-document-cancel:focus,
#deleteDocumentDialog #dspdeleteDocument:hover,
#deleteDocumentDialog #dspdeleteDocument:focus,
#deleteDocumentDialog #btnCancelDocument .gray:hover,
#deleteDocumentDialog #btnCancelDocument .gray:focus {
background-color: #686868;
}
#dlguploadDocument #btn-upload-document-save:active,
#dlguploadDocument #btn-upload-document-save:active:hover,
#dlguploadDocument #btn-upload-document-save:active:focus,
#dlguploadDocument #btn-upload-document-cancel:active,
#dlguploadDocument #btn-upload-document-cancel:active:hover,
#dlguploadDocument #btn-upload-document-cancel:active:focus,
#deleteDocumentDialog #dspdeleteDocument:active,
#deleteDocumentDialog #dspdeleteDocument:active:hover,
#deleteDocumentDialog #dspdeleteDocument:active:focus,
#deleteDocumentDialog #btnCancelDocument .gray:active,
#deleteDocumentDialog #btnCancelDocument .gray:active:hover,
#deleteDocumentDialog #btnCancelDocument .gray:active:focus {
background-color: #408391;
}

/* overlay styling */
#dlguploadDocument.overlay-no-height-limit,
#dlguploadDocument textarea {
width: 100%;
}
@media only screen and (max-width: 750px) {
#dlguploadDocument .column-left {
width: 100%;
text-align: left;
}
}

/*================================================================================================== 17. Document Download ==================================================================================================*/
.interactive-TRS ul {
display: grid;
display: -ms-grid;
grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
-ms-grid-columns: 1fr 1fr 1fr;
padding-bottom: 1em;
}
.interactive-TRS ul > li:first-child {
-ms-grid-column: 1;
-ms-grid-row: 1
}
.interactive-TRS ul > li:nth-child(2) {
-ms-grid-column: 2;
-ms-grid-row: 1
}
.interactive-TRS ul > li:last-child {
-ms-grid-column: 3;
-ms-grid-row: 1
}
.interactive-TRS .h1 {
color: #000;
font-size: 5rem;
font-weight: 700
}
#statements_selector:focus {
outline: 3px solid #666;
background-color: #686868;
color: #000;
}
#download_statement {
transform: translate3d(1em, -.25em, 0);
}
#download_statement:after {
content: '\f0ed';
font-family: FontAwesome;
padding-left: .5em;
}

/*================================================================================================== 18. Mobile ==================================================================================================*/
/* login module buttons */
.online-two-iso.login .LoginPageContainer .login-module-zone .login-modules .mobile-buttons .btn {
background-color: #ffd900 !important;
}
@media only screen and (max-width: 750px) {
/* menu icon colour */
.fa.fa-bars,
.fa.fa-gear {
color: #1841a9;
}
/* links in mobile hamburger menu */
.online-two-iso #menu-no-dashboard li a,
.online-two-iso #menu-no-dashboard li a.selected {
color: #000;
}
/* mobile menu icons (hamburger and cog) */
#header .main-menu-toogle:hover,
#header .main-menu-toogle:focus,
#header .user-toogle:hover,
#header .user-toogle:focus {
color: #686868;
}
/* make height of greeting container auto to give proper spacing around the greeting */
#home-online-three .dashboard-controls {
height: auto;
}
.bootstrap-iso .input-group .form-control {
width: 80%;
}
.bootstrap-iso .input-group .form-control {
display: block;
}
.benefit-category-mobile-view, .benefit-category.benefit-category-mobile-view {
width: 100%;
}
.online-two-iso.login body {
background-image: none;
background-color: #ffd900;
}
.online-two-iso.login .LoginPageContainer .panel.panel-default {
background-color: transparent;
}
.bootstrap-iso .panel-default {
border-color: transparent;
}
.home-module-integrated #slider {
border-radius: 0px;
}
.online-two-iso #footer div:not(:first-of-type) a {
border-left: none;
}
/*login button*/
.online-two-iso.login .LoginPageContainer .btn.btn-primary#login {
background-color: #1841a9;
border-radius: 0px;
color: #fff;
}
.modeller-close-button.btn-warning.btn {
width: auto;
}
}
/* remove default icons applied to modules on homepage */
#home-online-three #home-integrated .modules-mobile .module-mobile i[class*='icon-'] {
display: none;
}
/* remove duplicate module header */
#home-online-three #home-integrated .modules-mobile .module-content-header-container {
display: none;
}
/* remove margin applied to module title */
#home-online-three #home-integrated .modules-mobile .module-mobile span.module-label {
margin-left: 10px;
}
/* centre homepage module icons */
#home-online-three #home-integrated .modules-mobile .module-mobile .module-panel div[class*='online-two-icon-'] {
text-align: center;
}
/* homepage buttons */
#home-online-three #home-integrated .modules-mobile .module-mobile .module-panel .module-copy
button.btn.btn-default {
background-color: #ffd900;
border-radius: 30px;
color: #1841a9;
}
#home-online-three #home-integrated .modules-mobile .module-mobile .module-panel .GenericMod .module-copy .generic-buttons .btn.btn-default {background-color: #fff;
color: #1841a9;
border:2px solid #1841a9;
}
#home-online-three #home-integrated .modules-mobile .module-mobile .module-panel .module-copy a.btn.btn-default,
#home-online-three #home-integrated .modules-mobile .module-mobile .module-panel button.btn.btn-default {
padding: 12px 20px;
width: 100%;
}
#home-online-three #home-integrated .modules-mobile .module-mobile .module-panel .generic-copy,
#home-online-three #home-integrated .modules-mobile .module-mobile .module-panel .account-copy {
margin-top: 0;
}
#home-online-three #home-integrated .modules-mobile .module-mobile .module-panel .module-copy .event-content .text-light .days-left {
color: #fff;
}
#home-module-enrolment .module-label {
color: #fff;
}
#home-module-enrolment.module-mobile {
background: #005A6C;
    margin-top: 17px;
}
/*================================================================================================== 19. Client specific styles ==================================================================================================*/
/* homepage module layouts */
@media only screen and (min-width: 768px){
#home-online-three #home-integrated .modules-right-side.grid-container {
grid-template-columns:repeat(2,1fr);
-ms-grid-columns:1fr 1fr;
grid-template-areas:
"module-2 module-2"
"module-1 module-3"
"module-4 module-5"
"module-6 module-7"
"module-8 module-9"
"module-10 module-11"
}

#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-1 {
-ms-grid-column:1;
-ms-grid-column-span:2;
-ms-grid-row-span:1;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-0 {
-ms-grid-column:1;
-ms-grid-column-span:1;
-ms-grid-row:2;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-2 {
-ms-grid-column:2;
-ms-grid-column-span:1;
-ms-grid-row:2;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-3 {
-ms-grid-column:1;
-ms-grid-column-span:1;
-ms-grid-row:3;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-4 {
-ms-grid-column:2;
-ms-grid-column-span:1;
-ms-grid-row:3;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-5 {
-ms-grid-column:1;
-ms-grid-column-span:1;
-ms-grid-row:4;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-6 {
-ms-grid-column:2;
-ms-grid-column-span:1;
-ms-grid-row:4;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-7 {
-ms-grid-column:1;
-ms-grid-column-span:1;
-ms-grid-row:5;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-8 {
-ms-grid-column:2;
-ms-grid-column-span:1;
-ms-grid-row:5;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-9 {
-ms-grid-column:1;
-ms-grid-column-span:1;
-ms-grid-row:6;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-10 {
-ms-grid-column:2;
-ms-grid-column-span:1;
-ms-grid-row:6;
}
}

@media only screen and (min-width: 1024px){
#home-online-three #home-integrated .modules-right-side.grid-container {
grid-template-columns:repeat(3,1fr);
-ms-grid-columns:1fr 1fr 1fr;
grid-template-areas:
"module-1 module-2 module-2"
"module-3 module-4 module-5"
"module-6 module-7 module-8"
"module-9 module-10 module-11"
}

#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-0 {
-ms-grid-column:1;
-ms-grid-column-span:1;
-ms-grid-row:1;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-1 {
-ms-grid-column:2;
-ms-grid-column-span:2;
-ms-grid-row:1;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-2 {
-ms-grid-column:1;
-ms-grid-row:2;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-3 {
-ms-grid-column:2;
-ms-grid-row:2;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-4 {
-ms-grid-column:3;
-ms-grid-column-span:1;
-ms-grid-row:2;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-5 {
-ms-grid-column:1;
-ms-grid-column-span:1;
-ms-grid-row:3;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-6 {
-ms-grid-column:2;
-ms-grid-column-span:1;
-ms-grid-row:3;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-7 {
-ms-grid-column:3;
-ms-grid-column-span:1;
-ms-grid-row:3;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-8 {
-ms-grid-column:1;
-ms-grid-column-span:1;
-ms-grid-row:4;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-9 {
-ms-grid-column:2;
-ms-grid-column-span:1;
-ms-grid-row:4;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-10 {
-ms-grid-column:3;
-ms-grid-column-span:1;
-ms-grid-row:4;
}
}

@media only screen and (min-width: 1400px){
#home-online-three #home-integrated .modules-right-side.grid-container {
grid-template-columns:repeat(4,1fr);
-ms-grid-columns:1fr 1fr 1fr 1fr;
grid-template-areas:
"module-1 module-1 module-2 module-2"
"module-3 module-3 module-2 module-2"
"module-4 module-5 module-6 module-7"
"module-8 module-9 module-10 module-11"
}

#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-0 {
-ms-grid-column:1;
-ms-grid-column-span:2;
-ms-grid-row:1;
-ms-grid-row-span:1;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-1 {
-ms-grid-column:3;
-ms-grid-column-span:2;
-ms-grid-row:1;
-ms-grid-row-span:2;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-2 {
-ms-grid-column:1;
-ms-grid-column-span:2;
-ms-grid-row:2;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-3 {
-ms-grid-column:1;
-ms-grid-column-span:1;
-ms-grid-row:3;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-4 {
-ms-grid-column:2;
-ms-grid-column-span:1;
-ms-grid-row:3;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-5 {
-ms-grid-column:3;
-ms-grid-column-span:1;
-ms-grid-row:3;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-6 {
-ms-grid-column:4;
-ms-grid-column-span:1;
-ms-grid-row:3;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-7 {
-ms-grid-column:1;
-ms-grid-column-span:1;
-ms-grid-row:4;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-8 {
-ms-grid-column:2;
-ms-grid-column-span:1;
-ms-grid-row:4;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-9 {
-ms-grid-column:3;
-ms-grid-column-span:1;
-ms-grid-row:4;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-10 {
-ms-grid-column:4;
-ms-grid-column-span:1;
-ms-grid-row:4;
}
}
@media only screen and (min-width: 1920px){
#home-online-three #home-integrated .modules-right-side.grid-container {
grid-template-columns:repeat(4,1fr);
-ms-grid-columns:1fr 1fr 1fr 1fr;
grid-template-areas:
"module-1 module-1 module-2 module-2"
"module-3 module-3 module-2 module-2"
"module-4 module-5 module-6 module-7"
"module-8 module-9 module-10 module-11"
}

#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-0 {
-ms-grid-column:1;
-ms-grid-column-span:2;
-ms-grid-row:1;
-ms-grid-row-span:1;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-1 {
-ms-grid-column:3;
-ms-grid-column-span:2;
-ms-grid-row:1;
-ms-grid-row-span:2;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-2 {
-ms-grid-column:1;
-ms-grid-column-span:2;
-ms-grid-row:2;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-3 {
-ms-grid-column:1;
-ms-grid-column-span:1;
-ms-grid-row:3;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-4 {
-ms-grid-column:2;
-ms-grid-column-span:1;
-ms-grid-row:3;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-5 {
-ms-grid-column:3;
-ms-grid-column-span:1;
-ms-grid-row:3;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-6 {
-ms-grid-column:4;
-ms-grid-column-span:1;
-ms-grid-row:3;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-7 {
-ms-grid-column:1;
-ms-grid-column-span:1;
-ms-grid-row:4;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-8 {
-ms-grid-column:2;
-ms-grid-column-span:1;
-ms-grid-row:4;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-9 {
-ms-grid-column:3;
-ms-grid-column-span:1;
-ms-grid-row:4;
}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-10 {
-ms-grid-column:4;
-ms-grid-column-span:1;
-ms-grid-row:4;
}
}
/****************************************** Using icons for benefits/events *******************************************/
/* if wanting icons to be colour coded to benefit groups */
/* replace LINEGROUP1/LINEGROUP2/LINEGROUP3 with relevant classes */
.benefit-matrix .LINEGROUP1 .benefitline .img:before,
#benefit-overview .LINEGROUP1 .summaryImage .img:before {
color: #a9a9a9;
}
.benefit-matrix .LINEGROUP2 .benefitline .img:before,
#benefit-overview .LINEGROUP2 .summaryImage .img:before {
color: #a9a9a9;
}
.benefit-matrix .LINEGROUP3 .benefitline .img:before,
#benefit-overview .LINEGROUP3 .summaryImage .img:before {
color: #a9a9a9;
}
/****************************************** Using icons for homepage/elsewhere on the site *******************************************/
/* add any additional icons from the OnlineTwoIconFont that are required */
/* Benefit Icons: Aviva Staff Pension Scheme (Line Set) */
#benefit-overview .img.BenefitImage_fce1a577-3b42-43ec-bd34-80c5bd42011a,
.img.Lfce1a577-3b42-43ec-bd34-80c5bd42011a, .img.L76653265-4e71-405f-81bf-1ab5b638823d, .img.L88c216ab-61c5-4c37-b8fe-6bde6243df47,
div.see-also .img.Lfce1a577-3b42-43ec-bd34-80c5bd42011a, .img.L1454c9b4-1229-4bd3-9a6d-122b2bd31828, .img.La42ccf27-1ab8-4aa8-a76c-012b8a0b952d, .img.Lf5b4876a-eac0-4973-8640-f39763d7e08a, .img.L76653265-4e71-405f-81bf-1ab5b638823d, .img.Le2f545e2-ca78-4fa7-bc0c-ecab3c5dc175 , .img.Lea841cd3-3b25-49fc-bc6f-01d7751d60da, .img.L5c0394c3-8049-419f-813f-46a0d06ded46, .img.L83dc805a-c3a1-4690-9c90-5052c94bb7cf{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Pension%20Insurance%20Badge%20175px.svg") no-repeat center/contain;
}
/* Benefit Icons: Asprea Group Personal Pension */
#benefit-overview .img.BenefitImage_47b4de98-1453-4c2d-a557-4731d15ec7e3,
.img.L47b4de98-1453-4c2d-a557-4731d15ec7e3,
div.see-also .img.L47b4de98-1453-4c2d-a557-4731d15ec7e3{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Pension%20Insurance%20Badge%20175px.svg") no-repeat center/contain;
}
/* Benefit Icons: Life Insurance - Self (Line Set) */
#benefit-overview .img.BenefitImage_8ed771b4-d394-4f7b-96b2-df9dcded5f31,
.img.L8ed771b4-d394-4f7b-96b2-df9dcded5f31,
div.see-also .img.L8ed771b4-d394-4f7b-96b2-df9dcded5f31{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Aviva_Life_Insurance_Badge_Icon_May_2022.svg") no-repeat center/contain;
}
/* Benefit Icons: Life insurance - partner */
#benefit-overview .img.BenefitImage_ec2f0beb-a8f6-4ad3-b679-5688d394bd90,
.img.Lec2f0beb-a8f6-4ad3-b679-5688d394bd90, .img.Lde086ff8-60f2-4492-bfc4-6442670b47da,
div.see-also .img.Lec2f0beb-a8f6-4ad3-b679-5688d394bd90, .img.L21501dfc-0d78-42ac-a25e-a0bb1ebb5c47{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Aviva_Life_Insurance_Badge_Icon_May_2022.svg") no-repeat center/contain;
}
/* Benefit Icons: Childcare (Line Set) */
#benefit-overview .img.BenefitImage_569cb025-31b0-47b7-90e5-8795efbaa179,
.img.L569cb025-31b0-47b7-90e5-8795efbaa179,
div.see-also .img.L569cb025-31b0-47b7-90e5-8795efbaa179, .img.Lc32df716-86c8-4fc5-83bf-04fefa608168{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Aviva_Childcare_Vouchers_Badge_Icon_May_2022.svg") no-repeat center/contain;
}
/* Benefit Icons: Gourmet Society (Line Set) */
#benefit-overview .img.BenefitImage_391a53b6-2b67-43b3-bf84-03362a7ba123,
.img.L391a53b6-2b67-43b3-bf84-03362a7ba123,
div.see-also .img.L391a53b6-2b67-43b3-bf84-03362a7ba123,
#benefit-overview .img.BenefitImage_f7cc9b09-21db-4ae9-b4b2-91db403035e6,
.img.Lf7cc9b09-21db-4ae9-b4b2-91db403035e6,
div.see-also .img.Lf7cc9b09-21db-4ae9-b4b2-91db403035e6{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Aviva_Dining_Cards_Badge_Icon_May_2022.svg") no-repeat center/contain;
}
/* Benefit Icons: Electric Car Scheme */
#benefit-overview .img.BenefitImage_4d8ce824-9c51-448a-a38a-d504fb1b02ab,
.img.L4d8ce824-9c51-448a-a38a-d504fb1b02ab,
div.see-also .img.L4d8ce824-9c51-448a-a38a-d504fb1b02ab{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Aviva_Electric_Car_Scheme_Badge_Icon_May%202022.svg") no-repeat center/contain;
}
/* Benefit Icons: Carbon Footprint */
#benefit-overview .img.BenefitImage_75fe55f3-5ee5-4aff-bf07-810a8ff618ef,
.img.L75fe55f3-5ee5-4aff-bf07-810a8ff618ef,
div.see-also .img.L75fe55f3-5ee5-4aff-bf07-810a8ff618ef{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Aviva_Carbon_Footprint_Badge_Icon_May_2022.svg") no-repeat center/contain;
}
/* Benefit Icons: Dental Insurance */
#benefit-overview .img.BenefitImage_90074c21-8213-4994-a469-a734f9fd3003,
.img.L90074c21-8213-4994-a469-a734f9fd3003,
div.see-also .img.L90074c21-8213-4994-a469-a734f9fd3003{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Aviva_Dental_Insurance_Badge_Icon_May_2022.svg") no-repeat center/contain;
}
/* Benefit Icons: Private medical benefit (Line Set) */
#benefit-overview .img.BenefitImage_7c907c9e-e290-4741-a4f1-003a375f9a78,
.img.L7c907c9e-e290-4741-a4f1-003a375f9a78, .img.Lcb291ab2-4f57-4878-81e0-5f3c3a41d80e,
div.see-also .img.L7c907c9e-e290-4741-a4f1-003a375f9a78, .img.L597dcf62-909e-4849-a1d7-52d70af1829b, .img.L9b2ae6f9-aa9b-4603-a263-f6550eb78120{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Aviva_Private_Medical_Benefit_Essentials_Badge_Icon_May_2022.svg") no-repeat center/contain;
}
/* Benefit Icons: Health Assessment Self */
#benefit-overview .img.BenefitImage_bedc4590-548d-452f-b9ed-41fd940b2576,
.img.Lbedc4590-548d-452f-b9ed-41fd940b2576,
div.see-also .img.Lbedc4590-548d-452f-b9ed-41fd940b2576{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Aviva_Health_Assessment_Badge_Icon_May_2022.svg") no-repeat center/contain;
}
/* Benefit Icons: Health Assessment Partner */
#benefit-overview .img.BenefitImage_08aaf7c5-a5a6-40c7-96f8-e1d984a86286,
.img.L08aaf7c5-a5a6-40c7-96f8-e1d984a86286,
div.see-also .img.L08aaf7c5-a5a6-40c7-96f8-e1d984a86286{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Aviva_Health_Assessment_Badge_Icon_May_2022.svg") no-repeat center/contain;
}
/* Benefit Icons: Online Health Assessment Self */
#benefit-overview .img.BenefitImage_3b23d854-491f-49f5-8234-767869fbf8cf,
.img.L3b23d854-491f-49f5-8234-767869fbf8cf,
div.see-also .img.L3b23d854-491f-49f5-8234-767869fbf8cf{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Aviva_Health_Assessment_Badge_Icon_May_2022.svg") no-repeat center/contain;
}
/* Benefit Icons: Online Health Assessment Partner */
#benefit-overview .img.BenefitImage_049d5bd6-97d1-43f3-9bbc-8bcacae90ff9,
.img.L049d5bd6-97d1-43f3-9bbc-8bcacae90ff9,
div.see-also .img.L049d5bd6-97d1-43f3-9bbc-8bcacae90ff9{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Aviva_Health_Assessment_Badge_Icon_May_2022.svg") no-repeat center/contain;
}
/* Benefit Icons: Critical Illness Self */
#benefit-overview .img.BenefitImage_9abeed3c-5cd7-440d-9092-1add66526fed, #benefit-overview .img.BenefitImage_bfb4d43d-cbb3-4692-abab-a03d430d0da0,
.img.L9abeed3c-5cd7-440d-9092-1add66526fed, .img.Lbfb4d43d-cbb3-4692-abab-a03d430d0da0,
div.see-also .img.L9abeed3c-5cd7-440d-9092-1add66526fed, .img.Lbfb4d43d-cbb3-4692-abab-a03d430d0da0 {
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Aviva_Critical_Illness_Insurance_Badge_Icon_May_2022.svg") no-repeat center/contain;
}
/* Benefit Icons: Critical Illness-partner */
#benefit-overview .img.BenefitImage_106bd0d0-d867-4ef2-ae32-8e8488c57570,
.img.L106bd0d0-d867-4ef2-ae32-8e8488c57570,
div.see-also .img.L106bd0d0-d867-4ef2-ae32-8e8488c57570{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Aviva_Critical_Illness_Insurance_Badge_Icon_May_2022.svg") no-repeat center/contain;
}
/* Benefit Icons: Travel Insurance */
#benefit-overview .img.BenefitImage_1f5692a5-403e-4708-ac5e-3f7302c77399,
.img.L1f5692a5-403e-4708-ac5e-3f7302c77399,
div.see-also .img.L1f5692a5-403e-4708-ac5e-3f7302c77399{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Aviva_Travel_Insurance_Badge_Icon_May_2022.svg") no-repeat center/contain;
}
/* Benefit Icons: Travel Insurance */
#benefit-overview .img.BenefitImage_193c112f-a6fa-4b38-8bd2-e526575cb0cc,
.img.L193c112f-a6fa-4b38-8bd2-e526575cb0cc,
div.see-also .img.L193c112f-a6fa-4b38-8bd2-e526575cb0cc{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Aviva_Travel_Insurance_Badge_Icon_May_2022.svg") no-repeat center/contain;
}
/*Benefit Icons: Cycle2work*/
#benefit-overview .img.BenefitImage_18aefb0b-8374-4b57-888b-616de1b85032,
.img.L18aefb0b-8374-4b57-888b-616de1b85032,
div.see-also .img.L18aefb0b-8374-4b57-888b-616de1b85032{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Aviva_Cycle2Work_Badge_Icon_May_2022.svg") no-repeat center/contain;
}
/*Benefit Icons: Holiday buy/sell*/
#benefit-overview .img.BenefitImage_0e10dd23-3bdb-4f34-a36a-5c460a88b1bb,
.img.L0e10dd23-3bdb-4f34-a36a-5c460a88b1bb,
div.see-also .img.L0e10dd23-3bdb-4f34-a36a-5c460a88b1bb, .img.L8d6f3a83-7e7f-4c1d-9310-61c56bd68ee6{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Aviva_Holidays_Badge_Icon_May_2022.svg") no-repeat center/contain;
}
/*Benefit Icons: Alternate Bonus Sacrifice*/
#benefit-overview .img.BenefitImage_039c12cc-74ff-4faa-a6f4-4405a21d55a6,
.img.L039c12cc-74ff-4faa-a6f4-4405a21d55a6,
div.see-also .img.L039c12cc-74ff-4faa-a6f4-4405a21d55a6{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Pension%20Insurance%20Badge%20175px.svg") no-repeat center/contain;
}
/*Benefit Icons: Bonus Sacrifice*/
#benefit-overview .img.BenefitImage_75660656-c07f-46dc-b4d5-89ba53bda4b9,
.img.L75660656-c07f-46dc-b4d5-89ba53bda4b9,
div.see-also .img.L75660656-c07f-46dc-b4d5-89ba53bda4b9{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Pension%20Insurance%20Badge%20175px.svg") no-repeat center/contain;
}
/*Benefit Icons: Life assuranace*/
#benefit-overview .img.BenefitImage_4bb9e724-58d7-4f8d-8f72-ddf876c082c9,
.img.L4bb9e724-58d7-4f8d-8f72-ddf876c082c9,
div.see-also .img.L4bb9e724-58d7-4f8d-8f72-ddf876c082c9, .img.L0a0d9559-961f-4ff1-b5ed-3489a72c998c, .img.Ldf091035-c776-44fb-a5cc-17c659c482a0{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Aviva_Life_Insurance_Badge_Icon_May_2022.svg") no-repeat center/contain;
}
/*Benefit Icons: Payroll giving*/
#benefit-overview .img.BenefitImage_adcfaad3-db82-463c-908f-1dcd8a760d3c,
.img.Ladcfaad3-db82-463c-908f-1dcd8a760d3c,
div.see-also .img.Ladcfaad3-db82-463c-908f-1dcd8a760d3c,
#benefit-overview .img.BenefitImage_bf3e1037-7c2e-4936-b52f-9b9ea635c3a4,
.img.Lbf3e1037-7c2e-4936-b52f-9b9ea635c3a4,
div.see-also .img.Lbf3e1037-7c2e-4936-b52f-9b9ea635c3a4{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Aviva_Payroll_Giving_Pennies_for_Good_Badge_Icon_May_2022.svg") no-repeat center/contain;
}
/*Benefit Icons: Pennis*/
#benefit-overview .img.BenefitImage_ad66c4b0-4bc7-4f30-90c5-aeb2b43c330e,
.img.Lad66c4b0-4bc7-4f30-90c5-aeb2b43c330e,
div.see-also .img.Lad66c4b0-4bc7-4f30-90c5-aeb2b43c330e{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Aviva_Payroll_Giving_Pennies_for_Good_Badge_Icon_May_2022.svg") no-repeat center/contain;
}
/*Benefit Icons: Salary Finance*/
#benefit-overview .img.BenefitImage_9dc5fe63-2dfe-4c26-82cb-b47040a32390,
.img.L9dc5fe63-2dfe-4c26-82cb-b47040a32390,
div.see-also .img.L9dc5fe63-2dfe-4c26-82cb-b47040a32390, .img.Le2f545e2-ca78-4fa7-bc0c-ecab3c5dc175{
    background: url("/Aviva/media/default/Aviva%202022/Benefit%20Images/Pension%20Insurance%20Badge%20175px.svg") no-repeat center/contain;
}
/*see also section*/
.benefitselect .benefit-menu .img {width: 200px;
height: 130px;
}
.benefitselect .linename {margin-top: 50px;
}
/*color for icons profile/messages/logout*/
.fa.fa-user,
.fa.fa-envelope,
.fa.fa-sign-out {
color: #1841a9;
font-size: 20px;
}
/*Toggle button*/
.online-two-iso .slider {
background-color: #000;
margin-top: 3px;}
/*Matrix page*/
.bootstrap-iso .panel-default > .panel-heading + .panel-collapse > .panel-body, .benefit-matrix .benefit-active-benefits, .benefit-matrix .group-default, .benefit-matrix .benefit-category .panel-body {
background-color: #e0e0e0;}
.row.totalcostsection .font-youpay-color {
font-weight: bold;
}
.line-group {padding: 0px;
}
.benefit-matrix .totalcost-section-row .totalcostsection {
width: 90%;
}
.benefit-matrix .row.margin-left-0 {
margin-left: 0;
}
.benefit-matrix .font-youpay-color {
font-weight: normal;
}
.benefit-matrix .benefit-category .benefitline {
padding-bottom: 17px;
}
.benefit-matrix .group-default {
text-transform: none;
}
.benefit-matrix .title {
font-weight: normal;
}
.benefit-matrix .lineheader, .benefit-matrix .lineheader a {
font-size: 25px;
font-weight: normal;
}
/*Tab selector*/
.online-two-iso .modal-large .tab-selector-link {
font-weight: normal;
}
/*how flex works*/
.howflexworksnew a {
text-decoration: underline;
}
.howflexworksnew h3, .howflexworksnew h1, .howflexworksnew h4 {
color: #1841a9;
}
#howflwxworksimage {
padding-top: 30px;
}
/* display nav items in one line */
#footer a.optanon-toggle-display.EUFooterLink{
display: inline-block !important;
}
/*Lifestyle events popup*/
@media only screen and (min-width: 768px){
.active-benefits .event-img {
    height: 70%;
}
.active-benefits .events {
width: 42%;
height: 178px;
display: inline-block;
margin: 10px 10px 10px 10px;
background-color: #fff;
float: none;
}
}
/*Benefit intro image*/
.Benefitintroimage img {Float: Right;
Height: 260px;
margin-top: -25px;}
/*Follow up alert*/
.benefitselect .followup-required.alert.alert-warning, .followup-collect-info {
display: none;
}
/*SPLA Yes/No styling*/
.benefitselect #content-you-chose-summary #lineid_21501dfc-0d78-42ac-a25e-a0bb1ebb5c47,
.benefitselect #content-you-chose-summary #lineid_de086ff8-60f2-4492-bfc4-6442670b47da,
.benefitselect #content-you-chose-summary #lineid_ba65ecbf-78c6-4be1-bd80-41db99661eee,
.benefitselect #content-you-chose-summary #lineid_d52dd0c8-a1d1-4657-b0f8-cc48d0d14bf4{
display: none;
}
/*Confirmation pop up text*/
.confirm_agreement label {
font-size: 18px;
}
/*Blackened out background*/
#exposeMask {
height: 8000px !important;
}
/*Add beneficiary section full width*/
.your-beneficiaries .txt-beneficiaries {
    width: 100%;
}
/*Future date buttons on Benefit statement*/
.benefit-matrix .matrixpop a.btn {
color: #1841a9;
}
/*Followup items modal scrollable*/
#followup-items-overlay.online-followup-items .followup-collect {
    overflow-y: scroll;
    max-height: 375px;
}
/*Confirm choice button*/
.confirm-checkout-button.text-right .btn.btn-success.btn-lg {padding-left: 13px;}

/*TRS Changes 2022*/
.trsdashboard .dashboardtitle {
    margin-left: 0px;
    font-weight: bold;
    font-size: 15px;
    float: left;
    width: 60%;
padding-right: 20px;
}
.trsdashboard .dashboardtext {
    margin-left: -30px;
    float: left;
    width: 40%;
}
.secondpara {
    text-align: center;
}
.secondpara .btn.btn-button {
    background-color: #ffd900;
    border: 2px solid #ffd900;
    border-radius: 10px;
    color: #1841a9;
    overflow: hidden;
    position: relative;
    transition: all 0.25s;
    width: auto;
padding: 10px 20px;
font-weight: bold;
}
#dashboardContainer .panel-body {
    background-color: #ffffff;
}
.dashboardtitle .firstpara {
    font-weight: normal;
}
#dashboardContainer .col-md-5 {
    padding: 50px 70px 0px 80px;
}
.chart_line_title.col-xs-7 {
    margin-left: -13px;
}
/*.icon-two-point-o-trs-module-tab-0*/
.Reacutemuneacuterationetallocations.icon-two-point-o-trs-module-tab-Reacutemuneacuterationetallocations::before,
.SalaryAllowances.icon-two-point-o-trs-module-tab-SalaryAllowances::before {
    content: ' ';
    background-image: url('https://myavivabenefits-imp.tbs.aon.com/Aviva/media/default/TRS%20Icons/Salary%20-%20Allowances%20Badge%20Icon.svg');
    height: 80px;
    width: 100%;
    background-repeat: no-repeat;
    background-position: center;
}
/*.icon-two-point-o-trs-module-tab-1*/
.Primesetreacutecompenses.icon-two-point-o-trs-module-tab-Primesetreacutecompenses::before,
.BonusVariableReward.icon-two-point-o-trs-module-tab-BonusVariableReward::before {
    content: ' ';
    background-image: url('https://myavivabenefits-imp.tbs.aon.com/Aviva/media/default/TRS%20Icons/Bonus%20-%20Variable%20Reward%20Badge%20Icon.svg');
    height: 80px;
    width: 100%;
    background-repeat: no-repeat;
    background-position: center;
}
/*.icon-two-point-o-trs-module-tab-2*/
.Produitsderetraiteetplansdeprotection.icon-two-point-o-trs-module-tab-Produitsderetraiteetplansdeprotection::before,
.PensionIncomeProtection.icon-two-point-o-trs-module-tab-PensionIncomeProtection::before,
.PensionProtection.icon-two-point-o-trs-module-tab-PensionProtection::before{
    content: ' ';
    background-image: url('https://myavivabenefits-imp.tbs.aon.com/Aviva/media/default/TRS%20Icons/Pension%20-%20Protection%20Badge%20Icon.svg');
    height: 80px;
    width: 100%;
    background-repeat: no-repeat;
    background-position: center;
}
.PensionIncomeProtection.icon-two-point-o-trs-module-tab-PensionIncomeProtection::before {
    content: ' ';
    background-image: url('/Aviva/media/default/TRS%20Icons/Canada_Pension.png');
    height: 80px;
    width: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}
/*.icon-two-point-o-trs-module-tab-3*/
.Reacutegimesdrsquoactionnariatagraveparticipationvolontaire.icon-two-point-o-trs-module-tab-Reacutegimesdrsquoactionnariatagraveparticipationvolontaire::before, 
.VoluntaryShareSchemes.icon-two-point-o-trs-module-tab-VoluntaryShareSchemes::before {
    content: ' ';
    background-image: url('https://myavivabenefits-imp.tbs.aon.com/Aviva/media/default/TRS%20Icons/Voluntary%20Share%20Plans%20Badge%20Icon.svg');
    height: 80px;
    width: 100%;
    background-repeat: no-repeat;
    background-position: center;
}
/*.icon-two-point-o-trs-module-tab-4*/
.AvantagesSociauxetbienecirctre.icon-two-point-o-trs-module-tab-AvantagesSociauxetbienecirctre::before,
.Wellbeing.icon-two-point-o-trs-module-tab-Wellbeing::before,
.BenefitsWellness.icon-two-point-o-trs-module-tab-BenefitsWellness::before {
    content: ' ';
    background-image: url('https://myavivabenefits-imp.tbs.aon.com/Aviva/media/default/TRS%20Icons/Wellbeing%20Badge%20Icon%20(1).svg');
    height: 80px;
    width: 100%;
    background-repeat: no-repeat;
    background-position: center;
}
/*.icon-two-point-o-trs-module-tab-5*/
.DurabiliteacuteetCollectiviteacutes.icon-two-point-o-trs-module-tab-DurabiliteacuteetCollectiviteacutes::before,
.SustainabilityCommunity.icon-two-point-o-trs-module-tab-SustainabilityCommunity::before {
    content: ' ';
    background-image: url('https://myavivabenefits-imp.tbs.aon.com/Aviva/media/default/TRS%20Icons/Sustainability%20-%20Community%20Badge%20Icon.svg');
    height: 80px;
    width: 100%;
    background-repeat: no-repeat;
    background-position: center;
}

.Lifestyle.icon-two-point-o-trs-module-tab-Lifestyle::before {
content: ' ';
    background-image: url('https://myavivabenefits-imp.tbs.aon.com/Aviva/media/default/TRS%20Icons/Lifestyle%20Badge%20Icon%20(Yoga).svg');
    height: 80px;
    width: 100%;
    background-repeat: no-repeat;
    background-position: center;
}
.Apprentissageetperfectionnement.icon-two-point-o-trs-module-tab-Apprentissageetperfectionnement::before,
.CareerLearning.icon-two-point-o-trs-module-tab-CareerLearning::before{
content: ' ';
    background-image: url('/Aviva/media/default/Images/Career-Learning-Badge.svg');
    height: 80px;
    width: 100%;
    background-repeat: no-repeat;
    background-position: center;
}
.chart_line_amount.col-xs-5 {
    padding-left: 20px;
}
.trsdashboard .chart_line {
    border-bottom: 1px solid #000;
margin-top: 25px;
}
#dashboardContainer hr {
    border-top: 1px solid #000;
}
.protectionfooter {
    width: 57%;
}
.wellbeingbutton {
    background-color: #ffd900;
    border: 2px solid #ffd900;
    border-radius: 10px;
    color: #1841a9 !important;
    overflow: hidden !important;
    position: relative;
    transition: all 0.25s;
    width: auto;
    padding: 10px 20px;
    font-weight: bold !important;
}
#dashboardContainer .tab-content {
    margin-top: 40px;
}
/*TRS Styling*/
.TRSstyling {
padding-left: 20px;
list-style: disc;
}
.highcharts-title {
    font-weight: bold;
}
/*Homepage labels color and font size*/
.highcharts-label.highcharts-data-label.highcharts-data-label-color-1 tspan, .highcharts-label.highcharts-data-label.highcharts-data-label-color-0 tspan,
.highcharts-label.highcharts-data-label.highcharts-data-label-color-2 tspan, .highcharts-label.highcharts-data-label.highcharts-data-label-color-3 tspan,
.highcharts-label.highcharts-data-label.highcharts-data-label-color-4 tspan, .highcharts-label.highcharts-data-label.highcharts-data-label-color-5 tspan,
.highcharts-label.highcharts-data-label.highcharts-data-label-color-6 tspan {
    font-size: 13px !important;
    fill: #000 !important;
}

.trsdashboard .printbtn {
    display: none;
}
#dashboardContainer .tab-content a {
color: #337ab7;
}
#dashboardContainer .dashboardtitle a {
color: #337ab7;
}
.highcharts-legend-item text {
font-size: 14px !important;
}
.trsdashboard .content-name {
    padding-top: 0px;
}
.chart_line.chart_line_total.row.ng-scope {
display: none;
}
.div-trs-component-info-type .chart_line.chart_line_total.row.ng-scope {
display: block;
}


/*Bonus See also*/
.see-also .benefit-menu .img.Lea841cd3-3b25-49fc-bc6f-01d7751d60da, .img.L5c0394c3-8049-419f-813f-46a0d06ded46, .img.L83dc805a-c3a1-4690-9c90-5052c94bb7cf, .img.L42ccf27-1ab8-4aa8-a76c-012b8a0b952d,
.benefit-menu #line-83dc805a-c3a1-4690-9c90-5052c94bb7cf,
.benefit-menu #line-5c0394c3-8049-419f-813f-46a0d06ded46,
.benefit-menu #line-ea841cd3-3b25-49fc-bc6f-01d7751d60da,
.benefit-menu #line-a42ccf27-1ab8-4aa8-a76c-012b8a0b952d{
display:none;}

.isLoginPageWrapper select#ddlLanguage {
    display: none;
}

/*LA Followup*/
.followup-item-description .LAFU {
    text-align: left;
}


/* Minification failed (line 3236, error number 1039): Token not allowed after unary operator: '-tertiary-text-color' */