/* APAC Standard CSS */
/*Index
 1. Login
 2. Dashboard -- Includes logo, home Page Modules like benefit statement, benefit enrollment, Need assitance, navigation tabs etc.
 3. Profile Page
 4. Cosmetic Changes -- Includes Colors, Branding customization, Icon, Buttons.
 5. Benefit Enrollment/Matrix
 6. Benefit Statement
 7. Benefit Overview
 8. Claim Submission Page
 9. Manage My Claim/Account Summary
 10. Font Family
 */
 
 
 /* ~~~~~~~~~~~~~~~~~~~ 10. Font family ~~~~~~~~~~~~~~~~~~~~~ */ 
@font-face {
    font-family: 'NotoSans';
    src: url('/uobgroup/media/default/Fonts/NotoSans-Black.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-BlackItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-Bold.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-BoldItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-Condensed.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-CondensedBlack.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-CondensedBlackItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-CondensedBold.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-CondensedBoldItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-CondensedExtraBold.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-CondensedExtraBoldItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-CondensedExtraLight.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-CondensedExtraLightItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-CondensedItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-CondensedLight.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-CondensedLightItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-CondensedMedium.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-CondensedMediumItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-CondensedSemiBold.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-CondensedSemiBoldItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-CondensedThin.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-CondensedThinItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-ExtraBold.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-ExtraBoldItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-ExtraCondensed.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-ExtraCondensedBlack.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-ExtraCondensedBlackItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-ExtraCondensedBold.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-ExtraCondensedBoldItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-ExtraCondensedExtraBold.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-ExtraCondensedExtraBoldItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-ExtraCondensedExtraLight.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-ExtraCondensedExtraLightItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-ExtraCondensedItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-ExtraCondensedLight.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-ExtraCondensedLightItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-ExtraCondensedMedium.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-ExtraCondensedMediumItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-ExtraCondensedSemiBold.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-ExtraCondensedSemiBoldItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-ExtraCondensedThin.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-ExtraCondensedThinItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-ExtraLight.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-ExtraLightItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-Italic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-Light.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-LightItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-Medium.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-MediumItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-Regular.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-SemiBold.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-SemiBoldItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-SemiCondensed.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-SemiCondensedBlack.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-SemiCondensedBlackItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-SemiCondensedBold.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-SemiCondensedBoldItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-SemiCondensedExtraBold.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-SemiCondensedExtraBoldItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-SemiCondensedExtraLight.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-SemiCondensedExtraLightItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-SemiCondensedItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-SemiCondensedLight.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-SemiCondensedLightItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-SemiCondensedMedium.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-SemiCondensedMediumItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-SemiCondensedSemiBold.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-SemiCondensedSemiBoldItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-SemiCondensedThin.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-SemiCondensedThinItalic.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-Thin.ttf') format('truetype'),
		 url('/uobgroup/media/default/Fonts/NotoSans-ThinItalic.ttf') format('truetype');
}
		.bootstrap-iso,.ng-scope{
font-family: 'Noto Sans', sans-serif !important;
}



 /*~~~~~~~~~~~~~~~~~~~~ 1. Login ~~~~~~~~~~~~~~~~~~~~~~~*/
 .LoginPageContainer #terminator {    background: transparent ; }
@media only screen and (min-width:768px){
  /* login image */
  .online-two-iso.login body {
    background-image: url(/apacsingapore/media/Media/welder.jpg);    
  }
  /* login module background colour */
  .online-two-iso.login .LoginPageContainer .login-module-zone .login-modules {
    background-color: rgba(0,0,0,0.5);
  }
}
@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;
  }
}

/*Login button hover*/
.bootstrap-iso .btn-primary:hover {
  color: #fff;
  background-color: #FB002C;
  border-color: #fff;}
  
/* Login Page styling end */

/*~~~~~~~~~ 2. Dashboard -- Includes logo, home Page Modules like benefit statement, benefit enrollment, Need assitance, navigation tabs etc.~~~~~~*/
/**************** logo ****************/
#logo {
    background-image: url(/uobgroup/media/default/logo/FC_CMYK_UOB.jpg);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    margin-bottom: 30px;
    }
    /* centering logo on mobile view */
    @media only screen and (max-width: 767px) {
    #logo {
    width: calc(100vw - 100px);
    }
}
/* Home page Grid Layout arrangement for different screens */
 @media only screen and (max-width:768px) {
#home-online-three #right-side .modules-right-side.grid-container,
#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-3" "module-4 module-5 module-6 module-7 ";} 
}
 @media only screen and (min-width:768px) {
#home-online-three #right-side .modules-right-side.grid-container,
#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-3" "module-4 module-5 module-6 module-7 ";}
/* For IE */
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-0 {-ms-grid-column: 1;-ms-grid-row: 1;-ms-grid-column-span: 2;}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-1 { -ms-grid-column: 3; -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-row: 2;}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-5 { -ms-grid-column: 1; -ms-grid-row: 3;}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-6 { -ms-grid-column: 2; -ms-grid-row: 3;}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-7 { -ms-grid-column: 3; -ms-grid-row: 3;}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-8 { -ms-grid-column: 1; -ms-grid-row: 4;}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-9 { -ms-grid-column: 2; -ms-grid-row: 4;}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-10 { -ms-grid-column: 3; -ms-grid-row: 4;}
}
@media only screen and (min-width:1400px){
#home-online-three #right-side .modules-right-side.grid-container,
#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-3" "module-4 module-5 module-6 module-7 ";} 
/* For IE */
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-0 {-ms-grid-column: 1;-ms-grid-row: 1;-ms-grid-column-span: 2;}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-1 { -ms-grid-column: 3; -ms-grid-row: 1; -ms-grid-column-span: 2;}
#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-row: 2;}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-5 { -ms-grid-column: 4; -ms-grid-row: 2;}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-6 { -ms-grid-column: 1; -ms-grid-row: 3; -ms-grid-column-span: 2;}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-7 { -ms-grid-column: 3; -ms-grid-row: 3; -ms-grid-column-span: 2;}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-8 { -ms-grid-column: 3; -ms-grid-row: 3;}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-9 { -ms-grid-column: 4; -ms-grid-row: 3;}
}
@media only screen and (min-width:1920px){
#home-online-three #right-side .modules-right-side.grid-container,
#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-3" "module-4 module-5 module-6 module-7 ";}
/* For IE */
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-0 {-ms-grid-column: 1;-ms-grid-row: 1;-ms-grid-column-span: 2;}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-1 { -ms-grid-column: 3; -ms-grid-row: 1; -ms-grid-column-span: 2;}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-2 { -ms-grid-column: 5; -ms-grid-row: 1;}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-3 { -ms-grid-column: 6; -ms-grid-row: 1;}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-4 { -ms-grid-column: 1; -ms-grid-row: 2;}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-5 { -ms-grid-column: 2; -ms-grid-row: 2;}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-6 { -ms-grid-column: 3; -ms-grid-row: 2; -ms-grid-column-span: 2;}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-7 { -ms-grid-column: 5; -ms-grid-row: 2; -ms-grid-column-span: 2;}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-8 { -ms-grid-column: 5; -ms-grid-row: 2;}
#home-online-three #home-integrated .grid-container.modules-right-side .grid-item-9 { -ms-grid-column: 6; -ms-grid-row: 2;}
}

/*To Hide Menu button above carousal*/
.home-module-integrated .welcome-items {Display: none;}

/* Claim modules - Arrows Color */
#home-online-three #right-side .modules-right-side.grid-container .grid-item-content .module-content .tbs-module-pager .tbs-pager button::after, #home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .module-content .tbs-module-pager .tbs-pager button::after
{color: #005EB8;}

/* Module Buttons text color on hover */
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .module-content .btn.btn-default:hover {color: #fff;}

/* Module text centered */
#home-online-three #home-integrated .module-content-header-container h3.module-content-header{
width: 100%;
}
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .module-content#make-a-claim .make-a-claim-copy .account-details {
text-align: center;
}
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .module-content .tbs-module-pager .tbs-pager-content .title {font-size: 20px;}

/* To aling module buttons to the bottom */
@media (min-width: 768px){.home-module-make-a-claim-content .make-a-claim-information .tbs-module-pager, .home-module-manage-claims-content .manage-claims-copy.module-copy .tbs-module-pager { padding-bottom: 50px;}
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .module-content {padding-bottom: 45px;}
#home-online-three #right-side .modules-right-side.grid-container .grid-item-content .module-content .tbs-module-pager .tbs-pager, #home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .module-content .tbs-module-pager .tbs-pager { bottom: 3.5em !important;}
#generic .generic-buttons .btn.btn-default , #home-integrated .benefit-statement-buttons .btn.btn-default, #home-integrated .make-a-claim-buttons .btn.btn-default, #home-integrated .manage-claims-buttons .btn.btn-default, #home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .module-content .btn.btn-default {
    position: absolute; 
    bottom: 1.5em; 
    left: 50%; 
    transform: translateX(-50%);
    width: 70%;
  }
}
/* To adjust the width of the block present in carousel module */
#home-module-welcome #slider .sliderContainer .slide-content, .home-module-integrated #slider .sliderContainer .slide-content{
    width: 50%;
}

/* To adjust the empty space below carousel */
#slider{
	height: 420px !important;
}

/* To adjust the module button */
.event-summary{
  padding-bottom: 10px;
}

/* To adjust slide-content of carousel-1 */
div#slide-0 div.slide-content.advanced.ng-scope[ng-if="slide.externaleditor == 'false'"]{
  float: none;
  margin-left: 40%;
  text-align: right;
}

/* To adjust slide-content of carousel-2 */
div#slide-1 div.slide-content.advanced.ng-scope[ng-if="slide.externaleditor == 'false'"]{
  float: none;
  margin-left: 40%;
  text-align: right;
}

/* To adjust slide-content of carousel-3 */
div#slide-2 div.slide-content.advanced.ng-scope[ng-if="slide.externaleditor == 'false'"]{
  margin-left: 70px;
}

/* To adjust the slider content */
#home-module-welcome #slider .sliderContainer .slide-content, .home-module-integrated #slider .sliderContainer .slide-content{ 
  float: none;
  color: #fff;
}

/* To fix the border of caraousel button */
#slider a.btn-default{
  border-color: #005EB8;
}

/* To adjust module content alignment */
.module-content-header-container h3.module-content-header{
  height:45px
}

/* To adjust height of module on dashboard */
#enrolment.module-content{
  height: 400px;
}

/* To change the tooltip color (Profile, Messages & Logout Button) */
.ui-tooltip{
  background-color:white; 
  padding: 8px; 
  position: absolute; 
  z-index: 1; 
  top:100%; 
  left: 100%; 
  margin-bottom: 20px; 
  margin-left: -20px; 
  max-width: 300px; 
  -webkit-box-shadow: 0 0 5px #aaa; 
  box-shadow: 0 0 5px #aaa; 
  color:#000000; 
  opacity: 7;
}

/* To hide Need Assistance tab */
.helptoggle{
  display: none;
}

/* To adjust font size of claim account name */
.make-a-claim-account-name{
  font-size: 14px;
}

/* To adjust font of claim summary page module content */
#manage-claims .ng-scope span{
  font-size: 14px;
}
#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .module-content .tbs-module-pager .tbs-pager-content .title{
  font-size: 14px;
}
.tbs-pager-content .show-sensitive{
  margin-left: 4px
}


/* ~~~~~~~~~~~~~~~~~~ End DASHBOARD (Online 2.2)~~~~~~~~~~~~~~~~~~~ */


/* ~~~~~~~~~~~~~~~~~~~ 3. Profile Page ~~~~~~~~~~~~~~~~~~~~~ */
html#profile body#profile .profile #profile-online-2 #profilecontainer .htabs-container .tabs UL LI.sel A {background: none;padding-right: 6px;color: #005EB8;
border-bottom: solid .5em #005EB8 ;}
.online-two-iso A.button-style.green {background-color: #005EB8;}

/* Headings on profile page under different tabs*/
html#profile body#profile .profile #profile-online-2 P.sectionTitle{color: #005EB8;}

.online-two-iso .validation-caption {color: #005EB8;}
/* To hide preference tab under my profile tab */
li.preference.ng-scope  {display: none;}

/*To hide extra spaces in different tabs */
p.sectionTitle.ng-binding, hr.space-bar, div.space-bar{
  display: none !important;
}
/* ~~~~~~~~~~~~~~~~~~~ End Profile Page ~~~~~~~~~~~~~~~~~~~~~ */
 
/* ~~~~~~~~~~~~~~~~~~~~~~ 4. COSMETIC CHANGES ~~~~~~~~~~~~~~~~~~~~*/


/* To change the background color */
.online-two-iso body{
  background-color:#fff;
}

/*to change the colours of profile, message, logout */
.fa-user,.fa-envelope,.fa-sign-out{color: #005EB8;}
.fa-user:hover,.fa-envelope:hover,.fa-sign-out:hover{color: #005EB8;}

#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content .module-content {
  background-color: #fff;
  border: none;
  }

#home-online-three #home-integrated .modules-right-side.grid-container .grid-item-content {
  Height: 100%;
  background-color: #f0f0f0;
  padding: 0.2rem;
  }
/* Module Header center align*/
#home-online-three #home-integrated .module-content-header-container h3.module-content-header{text-align: center;}
#navtablist2, #navtablist3, #navtablist4, #navtablist5, #navtablist6, #navtablist1 {display: none !important;}


/* To transform the text under Mobile registration page */
#passwordDiv label,#passwordConfirmationDiv label{
  text-transform: none;
}
#newPasswordSave{
  text-transform: none;
}

/* To bold the menu-list item */
#menu0{
  font-weight: bold !important;;
}

/* Capitalize Tabs */
#menu-no-dashboard li a{text-transform: none;} #menu li a, #menu-sub li a, .online-two-iso A.button-style.gray, .header-overlay A {text-transform: capitalize;}

/* Footer background - White */
.online-two-iso #terminator #footer.footer-fullwidth {background: white;}

/* header background - */
.online-two-iso #terminator #header.header-fullwidth {background-color: #fff;}

/* Glyphicon Hide on Dashboard*/
a.online-three-module-popover-control span.glyphicon.glyphicon-info-sign {display: none;}

/* Round Button */
.bootstrap-iso .btn {border-radius: 20px; background-color: #005EB8; }

/* Hover color for buttons */
.bootstrap-iso .btn-default:hover {background-color:#FB002C  !important;}

/* Text Colour of Module headers & Greeting Message */
#home-online-three #home-integrated .module-content-header-container h3.module-content-header, div.dashboard-page-container div.dashboard-controls div#greeting-message.ng-binding {color: #005EB8 !important; }

/* Need Assistance Bar - Search Button */
#floating-header-content .search-btn {background-color: #005EB8;}
#floating-header-content .search-btn:hover {background-color: #FB002C !important;}

#floating-header-content .search{
	display: none;
}

/* To hide "i" Glyphicon " */
.glyphicon.glyphicon-info-sign{
  display: none;
}



/* ~~~~~~~~~~~~~~~~~~~~~~ End COSMETIC CHANGES ~~~~~~~~~~~~~~~~~~~~*/

/* ~~~~~~~~~~~~~~~~~~~ 5. BENEFIT ENROLLMENT/MATRIX ~~~~~~~~~~~~~~~~~~~~~ */

/*Benefit Matrix Page Line Images*/
/* Annual Leave HEAL$ */
.img.Lcaa2c9f6-03fb-4464-a185-93d375d1cd34 {
background-image:url(/uobgroup/media/default/line%20Images/moneyHand.png)!important;
background-size: 100% 100% !important;
margin-top: 25px;
}

/* Insurance Plans */
.img.L117b1ca6-0722-4a3d-bb80-961a7b01a21a {
background-image:url(/uobgroup/media/default/line%20Images/heart.png)!important;
background-size: 100% 100% !important;
margin-top: 25px;

}


/*End of Benefit Line Images */

/* To hide available options in Step 2 */
.available-options .links-group.four-links {display: none;}

/* To shift confirm choices button to right */
.col-md-8.col-sm-8.btngroup {Width: 83%;}

/* To hide extra spacing below header */
.benefit-matrix .row.margin-left-0 { display: none; }

/* To hide reset to default button */
.benefitheader-fixed div#resettodefaults {display: none;}

/* Confirm Choice and header color*/
a.btn.btn-success.btn-confirmchoice, .panel-heading {  background-color:  #005EB8!important;}

/* To change the colour of the line name */
.benefit-matrix .lineheader > a:link { color: #005EB8;}

/* To change the colour of Glyphicon */
.benefit-matrix .font-youpay-color, span.glyphicon.glyphicon.glyphicon.glyphicon { color: #005EB8;  }

/* TO keep the select button same as normal on hover */
.benefit-matrix .row .btn-success:hover,.benefit-matrix .row .btn-success:after {  border-radius: 20px;  background-color: #FB002C;  color: #fff;  border-color: #fff;}

/*To change the colour of drop down tab on benefit matrix */
.benefit-matrix .benefit-category .panel-title:hover {color: #fff;}

/* Confirm choices Yes/No button */

.benefit-matrix .modal-footer #confirmation-buttons .btn-default.active {background-color: #005EB8;color: #fff;}

/* Confirm button */
.benefit-matrix .confirm-checkout-button .btn-success {background-color: #005EB8;color: #fff;}

.benefit-matrix .confirm-checkout-button .btn-success:hover {background-color: #FB002C;color: #fff;}

/* Pop up after clicking on my dashboard on benefit matrix */
.online-two-iso .header-overlay {background-color: #005EB8;}

.online-two-iso A.button-style.blue {background-color: #005EB8;color: #fff;}

.online-two-iso A.button-style.blue:hover {background-color: #FB002C;}

/* Manage dependents Start */
h3.dependantModalHeader {color: #005EB8;} /* heading */

.online-two-iso .modal-normal a.tab-selector-link:hover, .online-two-iso .modal-normal .tab-selector-link.active {color: #005EB8;border-bottom: solid .5em #005EB8; } /* Tab selector */

.dependant-list-top a.dependant-add-link {color: #005EB8;} 
.dependant-list-top a.dependant-add-link:hover {color: black;} /* Add dependent */

button.btn.btn-warning.dependant-cancel-btn:hover {color: #fff;background-color: #FB002C;border-color: #FB002C;} /* Close button on Manage dependent */
/* Manage dependents close */

h3.modellersModalHeader {
  color: #005EB8;
  }
  
  /* Tab selector */
  .modeller-links li a.checked {  color: #fff;  background-color: #005EB8;  }
  .modeller-links li a.checked:hover {  color: #fff;  background-color: #FB002C;  }
  
  button.modeller-close-button.btn-warning:hover {  color: #fff;  background-color: #FB002C;  border-color: #FB002C;  }
  
  /* sub-headers - Security, Medical */
  .modeller-container .row-header {  color: #005EB8;  }
  
  /* Manage Dep > Dep coverage summary > save button */
  button.btn.btn-success.dependant-accept-btn:hover {  border-radius: 20px;  background-color: #FB002C;  color: #fff;  }
  
  /* Glyph Icon - Benefit overview details */
  .online-two-iso .modal-large a.tab-selector-link:hover, .online-two-iso .modal-large .tab-selector-link.active {  color: #005EB8;  border-bottom: solid .5em #005EB8;  }
  .online-two-iso .modal-large .tab-selector-link {  color: #005EB8;  }
  /* Close button */
  .bootstrap-iso .btn-warning:hover{  color: #fff;  background-color: #FB002C;  border-color: #FB002C;  }
  
  /* Benefit selection page > Continue button */
  .bootstrap-iso .btn-warning:hover {  color: #fff;  background-color: #FB002C;  border-color: #FB002C;  }

/* To centre align the text */
span.glyphicon.glyphicon-ok{
  color: #fff !important;
}
/* To lowercase the text of button */
a.btn.btn-success.btn-option-elect.ng-isolate-scope, a.btn.btn-warning.continue{
text-transform: none !important;
}
  
/* Text transform for Continue/Cancel button */
a.button-style.blue{
  text-transform: none !important;
}

/* To display the Continue button after selection */
.btn.btn-warning.continue{
  display: block;
}

/* To show Close button under FSA widget */
.modeller-close-button{
  display: inline-block !important;
}

/* To hide "click here for all benefits" */
#Line_caa2c9f6-03fb-4464-a185-93d375d1cd34{
  display: none;
}

/* To hide white space on benefitSelection page */
div.row.totalcost-section-row{
display: none;
}

/* To increase the font-size of text after confirmChoices */
.confirm_agreement{
  font-size: 20px;
}

/* To adjust the width of specific line heading on selection page */
#product-info75f35f6e-ebfb-42c0-b261-156d04412e21{
  width:330px;
}

/* To adjust the text of line after confirm choices */
.containers.ng-scope[ng-include=""] div.row.line.ng-scope div.col-md-4[tabindex="0"]{
  width: 500px !important;
}
  

/* ~~~~~~~~~~~~~~~~~~~ END BENEFIT ENROLLMENT/MATRIX ~~~~~~~~~~~~~~~~~~~~~ */

/* ~~~~~~~~~~~~~~~~~~~ 6. Benefit Statement ~~~~~~~~~~~~~~~~~~~~~ */ 
.bootstrap-iso .btn.online-two-datepicker {
background-color: #005EB8;
border-color: #005EB8;
}

/* To hide the Print button */
a.btn.btn-warning.btn-print.ng-scope{
  display: none;
}

span.glyphicon.glyphicon-print { color: #fff!important;}
/* To change the color of button */
.benefitselect .products .box-border.sel .header {
background-color: #005EB8 ;
}

/* To hide the date picker */
#dateFormat{
  display: none;
}
/* To hide the continue button */
.pull-right.ng-scope{
  display: none;
}


/* ~~~~~~~~~~~~~~~~~~~ End of Benefit Statement ~~~~~~~~~~~~~~~~~~~~~ */ 

/* ~~~~~~~~~~~~~~~~~~~ 7. Benefit overview ~~~~~~~~~~~~~~~~~~~~~ */ 

/*Benefit Overview Line Images*/

/*Group Term Life*/
#overview-item-/*Insert Line record ID here*/ .benefitIntroSummary .summaryImage .img{
background: url(/*Insert image direct path here*/) no-repeat !important;
background-size: 100% 100% !important;
margin-top: 20px;
}
/*Group Personal Accident*/
#overview-item-/*Insert Line record ID here*/ .benefitIntroSummary .summaryImage .img{
background: url(/*Insert image direct path here*/) no-repeat !important;
background-size: 100% 100% !important;
margin-top: 20px;
}
/*Group Hospital & Surgical*/
#overview-item-/*Insert Line record ID here*/ .benefitIntroSummary .summaryImage .img{
background: url(/*Insert image direct path here*/) no-repeat !important;
background-size: 100% 100% !important;
margin-top: 20px;
}

/*End of Benefit Overview Line Images*/

#benefit-overview .know-more-link:hover
{background-color: #FB002C;
 border-color: #fff;
}
span.glyphicon.glyphicon-chevron-right.aria {color: #fff!important;}

/* ~~~~~~~~~~~~~~~~~~~ End Benefit overview ~~~~~~~~~~~~~~~~~~~~~ */ 

/* ~~~~~~~~~~~~~~~~~~~ 8. Claim Submission Page ~~~~~~~~~~~~~~~~~~~~~ */ 
/* Header color */
.online-two-iso .webpartTitle {background-color: #005EB8;}

/* Submit Button */
.fsaClaimSubmitContainer .btn-primary {
color: #fff;
background-color: #005EB8;
border-color: #005EB8;
}
.fsaClaimSubmitContainer .btn-primary:hover {background-color: #FB002C;}

/* Calendar - Receipt Date */
.online-two-iso .datepicker-container .input-group-btn .btn {
background-color: #005EB8;
border-color: #005EB8;
}

/* To hide the Print button after submitting the claim */
#btnPrintClaim{
  display: none;
}

/* ~~~~~~~~~~~~~~~~~~~ End of Claim Submission Page ~~~~~~~~~~~~~~~~~~~~~ */ 

/* ~~~~~~~~~~~~~~~~~~~ 9. Manage My Claim/Account Summary ~~~~~~~~~~~~~~~~~~~~~ */ 


.spendingaccountsTab-container .tabs UL LI.sel A {background-color: #005EB8;}

/* ~~~~~~~~~~~~~~~~~~~ End of Manage My Claim/Account Summary ~~~~~~~~~~~~~~~~~~~~~ */
/* Text transform for My profile page */
.ng-binding,.ng-scope{
  text-transform: none !important;
}
/* Text transform for submit my claim page */
.ng-isolate-scope{
  text-transform: none;
}

/* Claim item bar size on Claim Submission page*/

Select#ClaimItemSelect.form-control.autoAdjustWidth
{
width: 100px !important;
}

/* To hide the print button on claim summary page */
.btn-info.claim-detais-print{
  display: none;
}

/* To hide print button on claim Acknowledgement Slip after clicking on claim number */
.claim-acknowledgment-print{
  display: none !important;
}




/* Minification failed (line 636, error number 1062): Expected semicolon or closing curly-brace, found '*' */