drop 
/* JQuery bound on styleclass */ 
.myOnlineBankingClick {}
.cd-panel.from-left .myOnlineBankingClick{cursor: pointer;}

body {height: auto !important; margin: auto; min-height: 100%; min-width: 100%; overflow: hidden; padding:0; position: relative;}
html {height: 100%; max-width: 100%; overflow-x: hidden; overflow-y: auto; padding: 0;}
/*
body {	height: auto !important;
		margin: auto;
		min-height: 100%;
		min-width: 100%;
		position: relative;}

html, body {
	font-family: Verdana, Arial;
	font-size: 12px;
	height: 100%;
	padding: 0;
	max-width: 100%;
	overflow-x: hidden;
	overflow-y: scroll;}

body {overflow-y: hidden !important;height: auto !important;}*/

/* -----------------------------------------
   Layout
----------------------------------------- */
* {	font-family: Verdana, Geneva, sans-serif;font-size: 13px;}

.web-theme{margin:0px; background-color: #fbfbfb;}
.template-form{background-color: #fbfbfb;}
.web-theme .app-balance{display: none;}

input, button, .ui-selectonemenu, textarea, select {font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;}

img {border: none;}

.root {	display: block;}
.centering {margin: auto;padding: 0px;width: 1145px;}
.pageMainGp {font-family: Verdana;width: 100%;	padding:0px;border: none;background-color: #fbfbfb; margin-top: -10px;}
.pageMainGp.security-level, .pageMainGp.security-level .grayBorder, .pageMainGp.security-level .customDatagrid{margin: 0px; border-spacing: 0px; padding:0px;}
.pageMainGp.security-level .customDatagrid > .ui-widget-content{background: transparent;}
.pageMainGp.security-level .customDatagrid {}
.pageMainGp.security-level table{border-spacing: 0px;}
#tokenPgId{border-spacing: 0px;}


.centerMain {float: left}
.mainPanel {height: 100%;margin-top: 10px;}

.contentPg {width: 100%;padding-top: 10px}
.contentPg:first-child {width: 100%;padding: 0}

.contentPg>thead {
	text-align: left;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 13px;
	color: #5d6267;
	font-weight: bold;
	margin-top: 10px}

.width100 {	width: 100%}
.topPosit {	vertical-align: top;}
.middlePosit {vertical-align: middle;}
.bottomPosit {vertical-align: bottom}
.baseLinePosit {vertical-align: baseline;}
.sideBarW {width: 230px; padding-bottom: 60px;}

.bigChartColumn{text-align: center;vertical-align: middle;width:33%}
.smallChart{text-align: center;vertical-align: baseline;width:18%}

.labelChart{color: #4f4f4f;font-weight:bold;font-size: 11px;}

.centerPosit, .reflowColumn {text-align: center;}
.rightPosit {text-align: right;}
.rightPositCells td {text-align: right;}
.leftPosit {text-align: left;}
.leftPositBig {	width: 80%;	text-align: left;}
.dialogRight {text-align: right;	width: 159px;}
.dialogLeft {text-align: right;	width: 77px;}
.dialogLeftColumn {text-align: right;	width: 100px;}

.columnSelect {width: 26%}
.columnLeft {width: 50%;color: #4f4f4f;}
.columnRight {	width: 50%;	color: #5d6267;	font-weight: bold}
.smallerColumnLeft {width: 45%;	color: #4f4f4f;}
.columnFifty {width: 50%}
.columnRightBorder {border-right: 4px #c9c9c9;	border-right-style: double;}

.oneQuarter {width: 25%;vertical-align: top;}
.reflowRowExpansion {width: 20%;padding-left: 34px;}
.oneThird {width: 33.3%;text-align: center;}

.labelsSt {	color: #5d6267;	width: 35%;}
.labelsStCells td {	color: #5d6267;	width: 35%}
.dataSt {width: 65%; font-weight: bold;  color: #58595D; word-break: break-all;}
.break-all{word-break: break-all;}
.infoTableHead{width:100%; background-color:#fbfbfb; border:solid 1px #DFDFDF; border-bottom:none; box-sizing:border-box; font-weight:bold; text-align: center;padding: 8px 0px 8px 0px;}
.infoTableBody{width:100%; color:#58595D; text-align:right; border:solid 1px #DFDFDF; border-bottom:none;margin-top: -4px;}
.infoTableBody:last-child{margin-bottom: 10px}
.infoColumnLeft{width:35%;border-right:1px solid #DFDFDF;text-align: right;color: #58595D;}
.infoColumnRight{width:65%; font-weight:bold;text-align: left;color: #58595D;}

.rowWhite {background-color:white; height: 34px;}
.rowWhite td{border-bottom:solid 1px #DFDFDF;}
.rowGrey {background-color:#fbfbfb; height: 34px;}
.rowGrey td{border-bottom:solid 1px #DFDFDF;}

.ui-selectmanymenu.ui-inputfield {box-shadow: none;	border: 1px solid #E6E6E6;}
.ui-selectmanymenu, .ui-selectmanymenu table.ui-selectlistbox-list {width: 300px;overflow-x: auto;}


.amountFilter {width: 154px !important;}
.amountRight {text-align: right}
.widgetTextS {color: #5d6267;font-size: 11px !important}
.tableDropdown {width: 190px}

input[type="text"].required, input[type="number"].required, input[type="password"].required, .ui-tabs input[type="text"].required, .ui-accordion-content input[type="text"].required,.ui-inputfield.ui-inputtextarea.required, .input[type="tel"].required {border-left: 2px solid #c60d0d !important;}
input[type="text"].required, input[type="tel"].required {width: 216px;}
input[type="text"], input[type="number"], input[type="password"], input[type="tel"]	{width: 218px}

.amountInput{width:145px !important;text-align:right;margin-right: 5px;}

input[type="number"], input[type="password"], input[type="tel"], .ui-accordion input[type="text"], input[type="text"], .ui-accordion input[type="number"], .ui-accordion input[type="password"], .ui-widget-header .ui-inputfield input[type="text"], .ui-overlaypanel input[type="text"] .ui-accordion input[type="text"].ui-state-focus, .accountTable input[type="text"],
input[type="text"].ui-inputfield, .ui-widget-content input[type="text"].ui-inputfield, .datepicker-device{
    height: 33px;
    font-size: 14px;
    border-radius: 5px !important;
    padding: 3px 10px;
    box-sizing: border-box;
	color: #555555;
	border: 1px solid #E6E6E6;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	-o-border-radius: 2px;
/*	-webkit-transition: all 0.7s ease 0s;
	-moz-transition: all 0.7s ease 0s;
	-o-transition: all 0.7s ease 0s;
	transition: all 0.7s ease 0s;*/
	background-color: white;
	background-image: none;
	outline-color: transparent;
	box-shadow: none;
	text-shadow: none;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}


.calendar-st input, .calendar-st input[type="text"].ui-inputfield{width: 185px;border-top-right-radius: 0px !important;border-bottom-right-radius: 0px !important;}
input.datepicker-device{width: 218px;font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;}
.datepicker-device::-webkit-clear-button{display: none; -webkit-appearance: none;}

.ui-inputfield {box-sizing:border-box;}
.ui-inputfield:focus {box-shadow: none !important;-moz-box-shadow: none;-webkit-box-shadow: none;}

.ui-inputfield.ui-inputtextarea {
	width: 218px;
	font-size: 14px;
	background: none;
	background-color: white;
	border-radius: 4px;
	box-shadow: none;
	resize: none;
	border: 1px solid #E6E6E6;}

.ui-accordion-content input, .ui-accordion-content button,	.ui-accordion-content .ui-selectonemenu, .ui-accordion-content textarea	{font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;}

.wid10 {width: 10%}
.float-R{float: right;}
.float-L{float: left;}

/* -----------------------------------------
 	Login Page Mobile
----------------------------------------- */
.welcomeMsg{font-size:20px;}
.loginPanel {height: 100%; width: 100%; background-color: rgba(255, 255, 255, 0.55); padding:20px; border-radius: 3px;  border:1px solid #aeafb0;}
.login-panel{background-color: rgba(255, 255, 255, 0.85);
             border-radius: 8px;
             padding: 15px;
             width: 540px;}

.login-panel td.info {height: 22px; vertical-align: bottom;}

.login-panel a{color: #464646;text-decoration: none;font-size:13px;line-height: 19px;}
.login-panel a:hover{text-decoration:underline;color:#464646;}
.login-logo{width: 300px; vertical-align: top;}
.loginWhitePanel{padding: 20px; border-radius: 3px;}

/* -----------------------------------------
   Login Page
----------------------------------------- */
.formLogin {padding-bottom: 10px;width: 540px}
.formLoginPG {padding: 0px;padding-bottom:60px;}

.loginWhitePanel {width: 100%;	background-color: rgba(255, 255, 255, 0.65);padding: 30px 15px;	border-radius: 8px 8px 0px 0px;	text-align: left;}
.loginBluePanel {width: 540px;	background-color: rgba(0, 99, 167, 0.65);margin-top: -4px;	border-radius: 0px 0px 8px 8px;	padding: 10px 10px 18px 15px;}

.formLoginPinPG {padding: 32px 15px;}

.loginH1 {color: white;	width: 100%;background: black;height: 42px;}
.loginH2 {width: 100%;	background-color: white;}

.loginPG {	min-width: 100%;
			height: 100%;
			background-position:75% 0%, center;/*  75% 0px; */
			background-size: cover;
			background-repeat: no-repeat;
			width: 100%;}

.loginColumnLeft {color: #5d6267;width: 22%;text-align: right}

.loginLinks td:FIRST-CHILD {border-right: 1px solid #666c71;}
.loginLinks a {text-decoration: none;color: #5d6267;font-size: 12px;}
.loginLinks a:hover {text-decoration: underline;}

.googlePlay{background-image: url('../../resources/images/googleStore.png'); background-repeat: no-repeat; outline: 0;}
.appStore{background-image: url('../../resources/images/appStore.png'); background-repeat: no-repeat; outline: 0;}
 
/* -----------------------------------------
  	Footer Links
----------------------------------------- */
.main-panel {padding-bottom: 60px;}
.menuBottomLogin{background-color:#0063a7;}
.menuBottomLogin span {Font-size: 14px}

.menuBottomTemplate{
	width: 100%;
    margin-top: 0px;
    position: absolute;
    height: 35px;
    bottom: 0;
    min-width: 270px;
}
.menuBottomTemplate span {Font-size: 14px}

.footerLinks {text-align: center;width: 100%}
.footerLinks td {color: #1c75bc;}

.loginFooterLinks {	width: 100%}
.loginFooterLinks a {color: white;text-decoration: none;font-size: 13px;padding: 0 10px 0 10px;	border-left: 1px solid white;}
.loginFooterLinks a.noBorder {border-left: none;}

/* -----------------------------------------
  	Page Template
----------------------------------------- */
.header1Pg .user {float: right;	text-align: right; margin-right: -16px;}

.user {	color: rgb(99, 100, 102);font-weight: bold;}

.user span.num {
	background-color: #DC1E3A;
	color: #FFFFFF;
	font-size: 8px;
	padding: 0 0.3em;
	position: relative;
	width: 0;
	top: -8px;
	left: -4px}

.user span.null {
	background-color: transparent;
	color: transparent;
	font-size: 8px;
	padding: 0 0.3em;
	position: relative;
	width: 0;
	top: 0px;
	left: 0px}

.personalImg {width: 55px;	height: 55px;border-radius: 7px;}

.personalImgSmall {
	width: 37px;
	height: 37px;
	border-radius: 7px;
	 box-shadow: -5px 3px 12px -3px #4f4f4f; 
	margin-right: -5px;}

.ui-overlaypanel.user-pop-up {border-radius: 0px;background: white;box-shadow:none;}

.user-pop-up .label {font-weight: normal;font-size: 12px;color: #636466;}
.user-pop-up .info {font-size: 12px;font-weight: bold;}
.user .ui-icon {border-radius: 0;height: 19px;width: 19px;}

.userInfo{color:#0063a7;margin-right: -5px;}
.userInfo .ui-icon.fa.fa-angle-down {margin-top: -11px;}

.userLogout{color:#0063a7;  margin-left: -5px;}
.userLogout .ui-icon.fa.fa-sign-out {margin-top: -11px;  margin-right: -2px;}
.userLogout .ui-button-text:hover{ text-decoration: underline;} 

.header1Pg .user tbody tr td div { /* background: linear-gradient(to bottom, rgba(88, 187, 255, 1) -10%, rgba(0, 99, 167,1) 96%); */
						background: rgba(0, 99, 167,1);
						border-radius: 6px;
						box-shadow: none;
						text-shadow: none;}
.user td{padding:3px}

.user td:last-of-type{padding:0px}

.user .ui-state-default.ui-button .ui-icon.icon-messages, .user .ui-state-default.ui-button .ui-icon.icon-pending, .user .ui-state-default.ui-button .ui-icon.icon-batch {
	background-image: url('../images/buttons.png');}

.user .ui-state-default .ui-icon.icon-logout {
	margin-right: -5px;
	background-image: url('../images/logout.png');
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;}
	
/* .user.logoutBtn{background-color:red} */

.user .ui-button.ui-state-default {
	background: none transparent;
	box-shadow: none;
	border-radius: 0;
	border: medium none;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff',endColorstr='#00ffffff', GradientType=0);
	outline: none;
	left: 0px;
	position: relative;
	text-shadow: none;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;}


.infoBox{border:1px solid #d7e2eb; border-radius:6px;color:white; padding-right: 5px;  min-width: 141px;  max-width: 151px;}

.lastLoginInfoBtn.ui-button {background: none;border: none;	outline: none;	opacity: 1;	width: 30px;}
.lastLoginInfoBtn .ui-button-icon-left.ui-icon.fa {	width: 16px;height: 20px;border-radius: 0px;}

/* -----------------------------------------
  	Carousel -  Accounts Balances
----------------------------------------- */
.settingsTopBanner.ui-button {background: none;	border: none;outline: none; width: 20px; padding: 0px;}
.settingsTopBanner .ui-button-icon-left.ui-icon.fa { width: 22px;height: 22px;}

.accountsCarousel {	width: 100% !important; background: none; border: none;}
.accountsCarousel .ui-carousel-header {width: 58px;height: 65px;position: absolute; right: 0px; border: none;background: none;padding: 0px;}
.accountsCarousel .ui-carousel-header .ui-carousel-dropdown {display: none}
.accountsCarousel .ui-carousel-viewport {width: 900px !important; position: relative;}
.accountsCarousel .ui-carousel-viewport ul li {	background: none;border: none; margin:0px}
.accountsCarousel .ui-carousel-item.ui-widget-content table {margin-left: 10px}
.ui-carousel .ui-carousel-header .ui-carousel-header-title, .ui-carousel .ui-carousel-page-link{display: none;}

.accountsCarousel .ui-carousel-button.ui-carousel-next-button.ui-icon{ background: url('../images/arrowRight.png'); background-repeat:no-repeat; background-position: center; height: 100%; width: 24px}
.accountsCarousel .ui-carousel-button.ui-carousel-prev-button.ui-icon{ background: url('../images/arrowLeft.png'); background-repeat:no-repeat; background-position: center;  height: 100%; width: 24px}
  
.accName {color: white; width: 60px; max-width: 60px; text-align: left; overflow: hidden !important; text-overflow: ellipsis;}
.accBalance{text-align:right;border-right:1px solid white; width:100%; vertical-align: top; cursor:pointer;}
.accBalance table{ float: right;}
.accBalance span {font-size: 22px;}
.accBalance td {color: white} 


/* -----------------------------------------
  Title and Help Icons
----------------------------------------- */
.title .headerBlue {float: left}

.title .helpLinksPG {float: right;  margin-right: -1px;}

.helpLinksPG .ui-button {
	/* background:linear-gradient(to bottom, rgba(88, 187, 255, 1) -10%, rgba(0, 99, 167,1) 96%); */
	background:rgba(0, 99, 167,1);
	box-shadow: none;
	border-radius: 5px;
	border: 1px solid rgba(0, 99, 167, 0.5);
	text-shadow: none;
	outline: none;
	margin-right: -3px;
	width: 25px;
  	height: 25px;}

.helpLinksPG .ui-button-text-icon-left .ui-icon {margin-top: -10px;}
.helpLinksPG .ui-button-text-icon-left .ui-button-text {padding: 0px;padding-left: 38px;}
.helpLinksPG .ui-button .ui-icon { width: 15px;  height:20px;  border-radius: 0px;}

/* .helpTooltip {font-size: 11px;color: #666C71;background-color: #f6f4f3} */

/* Tooltip */
.ui-tooltip{background-image: none;
    background-color: #F1F5F8;
    box-shadow: none;
    border-radius:0;font-size:11px}
.ui-tooltip.selectCustomerTooltip{font-size:14px;}

/* -----------------------------------------
   Menu
----------------------------------------- */
.mainMenu {
	margin: -6px;
	text-decoration: none;
	text-shadow: none;
	background-image: none;
	background: none;
	border: none;
	border-radius: 0px; } /*width: 958px;text-shadow: 0 1px 0 #00728F*/

.mainMenu .ui-menuitem-text {color: #16609a;}
.mainMenu .ui-menuitem-text:hover {	color: #1c75bc;}

.ui-menu .ui-menu-list {padding-top: 6px;line-height: 10px}
.mainMenu .ui-menu {color: #b7dfe7;	background-color: #ffffff;	background-image: none}

.mainMenu .ui-menu-child {
	background-color: #ffffff;
	text-shadow: none;
	background-image: none;
	min-width: 250px;
	border:1px solid #c9c9c9;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); } /*min-width:280px*/

.mainMenu .ui-menu-parent a {height: 20px;	
							 background-color: transparent;
							 -webkit-transition: all 0.3s ease-out;
							 -moz-transition: all 0.3s ease-out;
							 -o-transition: all 0.3s ease-out;}

.mainMenu .ui-menu-parent.ui-menuitem-active {color: #1c75bc;border-radius: 0px;background-color: white}
/* .mainMenu .ui-menu-parent a .ui-menuitem-icon.ui-icon{-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;} */

.mainMenu .ui-menu-parent a {
	line-height: 30px;
	height: auto;
	padding-right: 9px;
	padding-left: 9px;
	background-image: none;
	box-shadow: none;
	border: none;
	border-radius: 0px;
	border-bottom: 2px solid transparent;
	border-left: 1px solid #c9c9c9;}

.mainMenu .ui-menu-parent.myOnlineBankingClick a {border-left: none;}

.mainMenu .ui-menu-parent a:hover{border-bottom: 2px solid #fdcd07;background-color: white;}
.mainMenu .ui-menu-child .ui-menuitem-text {line-height: 16px;color: rgb(102, 102, 102);-webkit-transition: 0.3s ease-out;-moz-transition: 0.3s ease-out;-o-transition: 0.3s ease-out;}
.mainMenu .ui-menu-child .ui-menuitem-text:hover {color: #0065A5;}
.mainMenu .ui-menu-child a{border: none;background-color: transparent;}
.mainMenu .ui-menu-child a:hover{background-color: #f5f5f5;border-radius: 4px;border:none}
.ui-menu .ui-menu-list.ui-menu-child {padding: 10px 5px}

.ui-menuitem-icon.ui-icon {	height: 25px;border-radius: 0;	height: 25px;width: 33px;margin-right: 5px;}

/* .ui-widget-content .ui-menuitem-icon.ui-icon {background-image: url('../../../resources/images/menu_hover_effect.png')} */

/* -----------------------------------------
   Menu icons
	----------------------------------------- 
.mainMenu .ui-menu-parent a .ui-menuitem-icon.ui-icon.icon-menu-home {background-position: 6px -25px}
.mainMenu .ui-menu-parent a:hover .ui-menuitem-icon.ui-icon.icon-menu-home{	background-position: 6px 0}
.mainMenu .ui-menu-parent a .ui-menuitem-icon.ui-icon.icon-menu-accounts{background-position: -30px -25px}
.mainMenu .ui-menu-parent a:hover .ui-menuitem-icon.ui-icon.icon-menu-accounts{	background-position: -30px 0}
.mainMenu .ui-menu-parent.ui-menuitem-active a .ui-menuitem-icon.ui-icon.icon-menu-accounts{background-position:-30px -25px} use this example to let the hover image stick when going down the sub menus
.mainMenu .ui-menu-parent a .ui-menuitem-icon.ui-icon.icon-menu-payments{background-position: -100px -25px}
.mainMenu .ui-menu-parent a:hover .ui-menuitem-icon.ui-icon.icon-menu-payments{	background-position: -100px 0}
.mainMenu .ui-menu-parent a .ui-menuitem-icon.ui-icon.icon-menu-personalisation	{background-position: -135px -25px}
.mainMenu .ui-menu-parent a:hover .ui-menuitem-icon.ui-icon.icon-menu-personalisation{	background-position: -135px 0}
.mainMenu .ui-menu-parent a .ui-menuitem-icon.ui-icon.icon-menu-services{background-position: -65px -25px}
.mainMenu .ui-menu-parent a:hover .ui-menuitem-icon.ui-icon.icon-menu-services	{background-position: -65px 0}
.mainMenu .ui-menu-parent a .ui-menuitem-icon.ui-icon.icon-menu-user-options{background-position: -166px -25px}
.mainMenu .ui-menu-parent a:hover .ui-menuitem-icon.ui-icon.icon-menu-user-options	{background-position: -165px 0}
.mainMenu .ui-menu-parent a .ui-menuitem-icon.ui-icon.icon-menu-bank-administration	{background-position: -198px -25px}
.mainMenu .ui-menu-parent a:hover .ui-menuitem-icon.ui-icon.icon-menu-bank-administration{background-position: -198px 0}
 	---------------------------------------- */
.ui-menuitem-link .ui-icon.ui-icon-triangle-1-s {display: none;}

.menuSt {background-color: white;width: 100%;}

.ui-menu .ui-menu-child:before {
	position: absolute;
	top: -1px;
	left: 10%;
	display: inline-block;
	border-right: 7px solid transparent;
	border-top: 7px solid #fdcd07;
	border-left: 7px solid transparent;
	border-top-color: #fdcd07;
	content: '';}

/* -----------------------------------------
   Left Sidebar
----------------------------------------- */
.sideBar {border: none;	background-color: #fbfbfb;	padding: 10px;	width: 220px;padding-left: 0px;}
.sideBar .ui-menuitem:hover {color: #004c7a;}
.sideBar .ui-menuitem {	width: 180px;-webkit-transition: all 0.3s ease-out;		-moz-transition: all 0.3s ease-out;	-o-transition: all 0.3s ease-out;}

.sideBar .ui-menuitem-link {
	font-size: 12px;
	color: #1c75bc;
	border: none;
	box-shadow: none;
	width: 100%;
	-webkit-transition: 0.3s ease-out;
	-moz-transition: 0.3s ease-out;
	-o-transition: 0.3s ease-out;
	transition-property: background-color, color;}

.sideBar .ui-menuitem-link:hover {color: #16609a;background: none}
.sideBar .ui-menuitem-text:hover {text-decoration: underline;}
/* .sideBar .ui-menuitem-link .ui-state-active {background-position: 0 -114px;	font-weight: bolder;color: #00728e;} */
.sideBar .ui-helper-clearfix {border: none;	background-color: transparent;	background: none;  padding: 2px;}
.sideBar tr:first-child td {border-bottom: 1px solid #c9c9c9}

.advLink {  box-shadow: none;
			border: none;
			height: 230px;
			width: 204px;
			border-radius: 0px;
			background-color: #fbfbfb;
			outline: 0;}

.favSettingsIcon { margin-top: -4px;
				  background: none transparent;
				  box-shadow: none;
				  border:none;
				  border-radius: 0;
				  outline: none;}

.favSettingsIcon .ui-icon.fa {width: 23px;height: 23px;margin-top: -11px;	margin-right: -5px;}

.ui-panel-titlebar-icon {display: none}
/* -----------------------------------------
   Widgets - Dashboard
----------------------------------------- */
.nettellerDashboardPanel .contentSt{height: 270px;vertical-align: top;}
.nettellerDashboardPanel .buttonSt{height: 50px;vertical-align: top;}

.nettellerDashboard .ui-panel {height: 360px; width: 100% !important; max-width: 500px;}
.nettellerDashboardPanel .ui-widget-content {background-color: #fbfbfb;	border: none; /*height: 294px;*/height: 86px;padding: 0px 7px;}
.nettellerDashboardPanel .ui-panel-titlebar {background-color: #fbfbfb;	border: none;	padding: 12px 12px 0px 10px;cursor: move;}
.nettellerDashboardPanel .ui-panel-titlebar .ui-panel-title {font-weight: normal;color: #4f4f4f;font-size: 19px;text-shadow: none;}

.nettellerDashboard .ui-dashboard-column {width: 50%; min-height: 200px; padding-bottom: 0px; margin-top: 0px; border-width: 10px}
.nettellerDashboard .ui-dashboard-column:first-child {padding-right: 1%; box-sizing: border-box;}
.nettellerDashboard .ui-dashboard-column:last-child {padding-left: 1%; box-sizing: border-box;}

.nettellerDashboard .ui-widget {background-color: #fbfbfb; border-radius: 6px; border: 1px double #c9c9c9; box-sizing: border-box; box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.2)}

.nettellerDashboardPanel .ui-widget {-webkit-box-shadow: none;-moz-box-shadow: none;box-shadow: none;}

.nettellerDashboard .contents-table {height: 100%;width: 100%;}

.nettellerDashboard .ui-datatable tbody tr, .nettellerDashboard .ui-datatable thead tr	{height: 7px; /*height:100%*/}
.nettellerDashboardPanel .ui-datatable .ui-datatable-even,	.nettellerDashboardPanel .ui-datatable .ui-datatable-odd {	border-bottom: solid 1px #dddddd;	background: transparent;}
.nettellerDashboardPanel .ui-datatable, .nettellerDashboardPanel .ui-datatable tbody tr,.nettellerDashboardPanel .ui-datatable thead th,.nettellerDashboardPanel .ui-datatable tbody, .nettellerDashboardPanel .ui-datatable .ui-paginator
	{border: none;}
.nettellerDashboardPanel .ui-datatable thead th,.nettellerDashboardPanel .ui-datatable thead th:hover {	background: transparent;padding: 5px 0px;font-weight: bold;	text-shadow: none;}
.nettellerDashboardPanel .ui-datatable thead th span {font-size: 13px;}
.ui-datatable thead span table tbody tr td {font-size: 11px;background: #e7e7e7;}

.nettellerDashboard .ui-datatable tbody td {padding: 1px 0px;}
.nettellerDashboardPanel .ui-datatable tbody * {font-size: 13px;}
.nettellerDashboardPanel .ui-datatable-tablewrapper {border: none;}
.nettellerDashboardPanel .ui-datatable tbody .amountGreen {font-size: 12px}
.nettellerDashboardPanel .ui-datatable tbody .greyLabel {font-size: 12px}

.ui-datatable .input[type="number"], .ui-datatable input[type="password"], .ui-datatable input[type="text"], .ui-datatable .mobile-table-data,  .ui-datatable-reflow .ui-selectonemenu, .ui-datatable-reflow select {width:100% !important;}

/* ----Widgets - Datatable & Paginator ---- */
.ui-paginator.ui-paginator-bottom.ui-widget-header {float: left;}
.ui-datatable-footer.ui-widget-header.ui-corner-bottom {float: right;border: none;margin-top: 0px;background: transparent;}

/*-----Widgets - Select-Dropdown ---------- */

.nettellerDashboardPanel .ui-selectonemenu {border: 1px solid #E6E6E6}
.nettellerDashboardPanel .ui-selectonemenu.ui-state-hover {box-shadow: 0px 0px 8px #85b2cb}
.nettellerDashboardPanel .ui-selectonemenu.requiredDropdown {border-left: 2px solid #c60d0d !important;	border-radius: 3px 4px 4px 3px;}

.nettellerDashboardPanel select {border: 1px solid #E6E6E6}
.nettellerDashboardPanel select.ui-state-hover {box-shadow: 0px 0px 8px #85b2cb}
.nettellerDashboardPanel .select.requiredDropdown {border-left: 2px solid #c60d0d !important;border-radius: 3px 4px 4px 3px;}

/* ----  TransferMoney Widget -------------- */
.widgetTransferMoney .contentSt td {line-height: 22px}
.widgetTransferMoney .dropdownWidget , .widgetCardPayment .dropdownWidget  {width: 100% !important;}
.widgetTransferMoney .amountInput {width: 142px !important;}
.widgetCardPayment .amountInput {width: 175px !important;}
.widgetTransferMoney .dataSt , .widgetCardPayment .dataSt{width: 65%}


/* ---- Widgets - Icons------------------- */
.widgetSettingsBtn{float: right;margin-top: -27px;}
.nettellerDashboard .widgetSettingsBtn .ui-button{border:none!important;background-image: none;width: 24px;top: 5px;outline:none}
.nettellerDashboard .widgetSettingsBtn .ui-button-icon-left{border-radius:0px;width: 21px;height: 22px;}

/* .ui-widget-content .widgetIcons {background-image: url("./images/buttons.png");opacity: 10;outline: none;width: 30px;height: 30px;width: 20px;height: 20px;border: none;cursor: default;}

.ui-widget-content .tickIcon {background-position: -6px -70px;	margin-top: -4px}
.ui-widget-content .cancelIcon {background-position: -42px -70px;margin-top: -4px}
.ui-widget-content .pendingIcon {background-position: -159px -37px;	margin-top: -4px}
.ui-widget-content .arrowDown {	background-position: -76px -66px;transform: rotate(-90deg);}
.ui-widget-content .arrowUp {background-position: -116px -66px;	transform: rotate(-90deg);} */

.widgetIcons.ui-button{border: none!important; opacity: 1;  height: 25px;  width: 32px;}
.widgetIcons .ui-button-icon-left{width: 30px;height: 21px;}

/* -----------------------------------------
   Messages
----------------------------------------- */
.dashboardMessages {margin: -17px 0px 19px -7px}

.customPassword {width: 154px;margin-left: 1px;}

.ui-messages-info, .ui-messages-warn, .ui-messages-error,.ui-messages-fatal {padding: 5px 0px 5px 0px; box-sizing: border-box;}
.ui-messages-info-icon, .ui-messages-warn-icon, .ui-messages-error-icon,.ui-messages-fatal-icon {display: none;}
.ui-messages-info-summary, .ui-messages-warn-summary,.ui-messages-error-summary, .ui-messages-fatal-summary,.ui-message-info-summary, .ui-message-warn-summary,	.ui-message-error-summary, .ui-message-fatal-summary {margin: 0px;}

/* -----------------------------------------
    Datatable
----------------------------------------- */
.ui-datatable tbody > tr > td > table{border-collapse: separate;}
.ui-datatable .innerTbl table{border-spacing: 0px;}
.ui-datatable {border: solid 1px #C9C9C9; margin-bottom: 11px;}
.ui-datatable tbody * {	font-size: 12px;}
.ui-datatable-header.ui-corner-top {border: none;border-radius: 0px;padding: 0px}
.ui-datatable-header, .ui-datatable-header div {background-color: #dadada;}
.ui-datatable .ui-datatable-header tbody tr {border-bottom: 1px solid transparent}
.ui-datatable, .ui-datatable-even, .ui-datatable-odd {background: transparent;}

.ui-datatable tbody tr, .ui-datatable thead th, .ui-datatable tbody, .ui-datatable .ui-paginator,  .ui-tabs .ui-datatable tbody tr{color: #4f4f4f; border-color: transparent; border-bottom:solid 1px #e6e6e6 !important; background: #fbfbfb;}
.ui-datatable tbody tr.ui-datatable-empty-message, .ui-datatable .ui-paginator, .ui-datatable tbody tr:last-child{border-bottom: solid 1px #C9C9C9 !important;}
.ui-datatable tbody td {border: none;padding: 4px;border-width: 0px;}

.ui-accordion-content .ui-datatable thead th, 	.ui-accordion-content .ui-datatable tbody,  .ui-tabs .ui-datatable tbody tr, .ui-tabs .ui-datatable thead th, .ui-tabs .ui-datatable tbody, .ui-tabs .ui-datatable .ui-paginator{border: none;}

.ui-datatable thead th, .ui-tabs .ui-datatable thead th, .ui-dialog .ui-datatable thead th,	.ui-accordion-content .ui-datatable thead th,  .ui-datatable .ui-widget-header thead th {
	font-weight: bold;
	height: 26px;
	border-spacing: 0px;
	background: #e7e7e7;
	box-shadow: none;
	border-width: 0px;
	text-shadow: none;
	word-break: break-word;}


.ui-datatable thead th:hover {
	background-image: none;
	box-shadow: none;
	background-color: transparent;
	background: #e7e7e7;}

.ui-datatable tr:hover {background: none;background-color: transparent;}
.ui-datatable thead .ui-icon {display: none;}
.ui-datatable thead th span {font-size: 11px}/*85%*/
.ui-datatable thead tr, .ui-dialog .ui-datatable thead tr {	height: 20px;border: 0px}
.ui-datatable thead tbody {	border: none;}

.ui-datatable .ui-expanded-row-content tbody, .ui-datatable .ui-expanded-row-content tr{border: none !important;}


.ui-datatable tbody a{ color: #1c75bc;}
.ui-datatable tbody a:hover{text-decoration: underline!important; color: #16609a; }

/* -----------------------------------------
       Datatable paginator
----------------------------------------- */
.ui-paginator .ui-corner-all {border-radius: 0px;}

.ui-paginator-current {	border: 1px solid #0063a7;	color: #0063a7;}

.ui-paginator .ui-paginator-page, .ui-paginator .ui-paginator-next,	.ui-paginator .ui-paginator-last, .ui-paginator .ui-paginator-first,.ui-paginator .ui-paginator-prev, .ui-paginator .ui-paginator-current {
	color: #0063a7;
	background-color: #f5f5f5}

.ui-paginator .ui-paginator-page:hover, .ui-paginator .ui-paginator-next:hover, .ui-paginator .ui-paginator-last:hover, .ui-paginator .ui-paginator-first:hover,.ui-paginator .ui-paginator-prev:hover, .ui-paginator .ui-paginator-current:hover
	{background-image: none;
	background-color: transparent;
	box-shadow: none;}

.ui-paginator .ui-paginator-page.ui-state-active {background: #0063a7;box-shadow: none;	color: white;}

.ui-paginator-rpp-options.ui-widget.ui-state-default.ui-corner-left {
	width: 55px !important;
	height: 22px;
	background: none;
	margin-left: 5px;
	border-radius: 0px;
	box-shadow: none;
	color: #0063a7;}

.ui-datatable .ui-paginator, .ui-tabs .ui-datatable .ui-paginator {
	text-align: left;
	border: solid 1px #C9C9C9;
	border-top:none;
	padding: 4px 0px;
	width: 100%;
	border-radius: 0px;
	margin-bottom: 11px;
	margin-left: -1px;
	margin-top: 0px;
	background: #f5f5f5;}

.ui-dialog .ui-datatable {width: 734px}

/*.ui-paginator .ui-paginator-last{margin-left:5px; margin-right: 1em;}*/

/* -----------------------------------------
    Datatable RowsHeight
----------------------------------------- */
.datableRowsHeight {height: 37px;}
.shortRowsHeight {height: 27px;}
.tallRowsHeight {height: 43px;}

/* -----------------------------------------
    Datatable Styles
----------------------------------------- */
.dataTableNoHeader thead {display: none;}
.noHighlightTable .ui-state-hover, .noHighlightTable  .ui-state-highlight{	background-image: none;	background: none}
.datatableNoPaginator tbody tr:last-child {	border-bottom: 1px solid transparent;} 
.datatableNoPaginator {	margin-bottom: 11px}
.datatableNoBorder tbody tr, .datatableNoBorder, .datatableNoBorder tbody{border: none;	border-bottom: none !important;}

/* -----------------------------------------
    Datatable expandable Row
----------------------------------------- */
.expandableRowHeader, .expandableRowHeader span {font-weight: bold;	font-size: 11px !important;	color: #555555;	width: 35%;}
.expandableRowLabel {font-size: 11px !important;}

/* -----------------------------------------
   Datatable Footer
----------------------------------------- */
.footer	td, .footer td a {color: black;	font-family: Verdana, Geneva, sans-serif;font-size: 10px;line-height: 15px;	text-decoration: none;}
.footer td a:hover {text-decoration: underline;}
.footer tbody tr {padding-top: 100px}
.footerImageLinks a {color: white;	text-decoration: none;	font-size: 13px;padding: 0 15px 0 25px;}

/* -----------------------------------------
  BalanceOverview  table
----------------------------------------- */
.boTable tbody tr, .ui-dialog .ui-datatable tbody tr {height: 25px;}
.boTable tbody td {	padding: 0px 4px;}


/* -----------------------------------------
  BalanceOverviewMobile  app
----------------------------------------- */


/*.bo-app .ui-datatable {margin-bottom: 11px;}
.bo-app .ui-datatable thead th, .ui-datatable tbody, .bo-app .ui-datatable .ui-paginator {border-top:1px solid #e6e6e6;border-bottom:none;}
.bo-app .ui-datatable > div:last-child{border:none;}
.bo-app .ui-datatable .ui-paginator.ui-paginator-bottom.ui-widget-header{margin-top:5px;}
*/

.bo-app {padding: 5px 0px;width: 100%;}
.bo-app .ui-datatable{border:none;}
/*.bo-app .ui-datatable table{margin-top:-5px;}*/
.bo-app .ui-datatable .mobile-table-label{line-height: 23px;}
.bo-app .ui-datatable table > tbody > tr > td:first-child .mobile-table-label{display: none;}
.bo-app .hidden-col{display: none !important;}
.bo-app .ui-selectonebutton{display:inline-block;}
.bo-app .ui-selectonebutton .ui-button-text-only .ui-button-text{padding:10px 0px;}
.bo-app .ui-datatable tbody table tr, .bo-app .ui-datatable tbody table tbody{border: none !important}

.bo-app .ui-paginator.ui-paginator-bottom.ui-widget-header{text-align:center;background: #f5f5f5;border: 1px solid #c9c9c9;}
.bo-app .ui-datatable thead th, .ui-datatable tbody{border-bottom: 1px solid #e6e6e6}

.bo-app .bo-innerTable tbody > tr {display: inline-flex;}
.bo-app .bo-innerTable tbody > tr > td{font-size:16px; font-weight: bold; padding-right:0px; box-sizing:border-box;}
.bo-app .blueLabel{font-weight: normal; font-size: 18px;}

.ui-datatable[id*='currentAccountsTable'] .ui-datatable-data tr.ui-state-hover{cursor:default; background: #fbfbfb;}
.ui-datatable[id*='savingAccountsTable'] .ui-datatable-data tr.ui-state-hover{cursor:default; background: #fbfbfb;}
.ui-datatable[id*='creditCardsTable'] .ui-datatable-data tr.ui-state-hover{cursor:default; background: #fbfbfb;}
.ui-datatable[id*='creditCardsTable'] tbody td{padding:2px;}
.ui-datatable[id*='loansTable'] .ui-datatable-data tr.ui-state-hover{cursor:default; background: #fbfbfb;}
.ui-datatable[id*='fixedDepositsTable'] .ui-datatable-data tr.ui-state-hover{cursor:default; background: #fbfbfb;}



/* -----------------------------------------
   Footer SubTotal - Balance Overview page
----------------------------------------- */
.footerBO {float: right;padding:2px;}

.subTotalHead {font-size: 11px;  text-shadow: none;  display: inline-table; font-weight: bold;  margin-right: 10px;}
.subTotalAmount {font-size: 11px;font-weight: normal;text-shadow: none;padding-right:3px}

.boTable tfoot tr td {border: none !important;background:#f5f5f5 !important;}

/* -----------------------------------------
  PendingAuthorisation  table
----------------------------------------- */
.pendingTable thead tr {line-height: 30px;}

/* -----------------------------------------
   Buttons
----------------------------------------- */
.onlineBankingPg {float: right;}

.onlineBankingPg .ui-commandlink {
	font-size: 12px;
	color: black;
	text-decoration: none;
	float: right;}
	
.onlineBankingPg .ui-button {height: 20px;width: 20px;	float: right;}

.logoutBtn {
	margin-top: 6px;
	padding-top: 3px;
	color: white;
	padding-right: 11px;
	width: 89px;
	height: 21px;
	box-shadow: none;
	border: none;
	outline: 0;
	text-shadow: none;
	background: url('../images/logout.png') right no-repeat;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
	background-position: right 3px;}

.blueBtn, .ui-accordion .blueBtn, .nettellerDashboard .blueBtn, .ui-dialog .blueBtn, .ui-button.blueBtn{
	color: white;
	width: 135px;
	background: linear-gradient(to bottom, rgba(88, 187, 255, 0.95) 8%,
		rgba(0, 99, 167, 0.9) 90%);
	box-shadow: none;
	outline: 0;
	border: none;
	text-shadow: none;
	/*-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;*/
	border-radius: 5px;
	height: 30px;}
.ui-button.blueBtn span{font-size:13px}

.greyBtn, .ui-accordion .greyBtn, .ui-dialog .greyBtn {
	color: white;
	width: 135px;
	background: linear-gradient(to bottom, rgba(201, 201, 201, 0.9) 17%, rgba(79, 79, 79, 0.7) 98%);
	box-shadow: none;
	outline: 0;
	border: none;
	text-shadow: none;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	border-radius: 5px;
	height: 30px;
	text-shadow: none;}
	
.ui-dialog .dialogSmallBtn{ width: 60px; height: 26px;}
.smallBtn.blueBtn{width: 65px;text-shadow: none;}

.loginBtn .ui-button-text {	font-size: 14px}

.loginBtn span:FIRST-CHILD {border-right: 1px solid white;	border-radius: 0px;	padding-right: 7px;}
.loginBtn {width: 143px;height: 33px;}

.blueBtnSmall, .blueBtnSmall .ui-state-hover {
  background-color:rgba(0, 99, 167,1)!important;
  box-shadow: none;
  border-radius: 5px;
  border: 1px solid rgba(0, 99, 167, 0.5)!important;
  text-shadow: none;
  outline: none;
  width: 28px; height: 28px;}

.blueBtnSmall .ui-button-icon-left{ margin-left: -2px;  height: 20px;}
.blueBtnSmall .ui-button-icon-left.fa.fa-reply { margin-left: -3px;  margin-top: -8px;}
.blueBtnSmall .ui-button-icon-left.fa.fa-plus{  margin-top: -7px;}

.tableBtn {height: 24px !important;width: 24px !important;}  
.tableBtn .ui-button-icon-left{margin-top: -9px;height: 21px;}

.datatableBtn{height: 24px;
			  width: 24px;
			  outline: none;
			  box-shadow: none;
			  background:#f5f5f5;}
  			  
.datatableBtn:hover{ background: #e7e7e7}
.datatableBtn .ui-icon.fa.fa-search{ margin-left: -4px; }
.datatableBtn .ui-icon.fa{margin-left: -3px;height: 22px; margin-top: -9px; }

.buttonsPG {float: right;}
/*.three-btns td{width: 50%;}*/

/* -----------------------------------------
  		BORDERS
----------------------------------------- */
.grayBorder {border: solid 1px #C9C9C9;
			width: 100%;
			border-spacing: 5px;
			margin-bottom: 11px;
			line-height: 20px;
			/* box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.2); */
			border-radius: 5px;
			padding: 0px}


.grayBorder.threeColumns {border: none;	width: 90%;	float: left}
.grayBorder.threeColumns td:FIRST-CHILD {width: 20%}
.grayBorder.threeColumns td {width: 40%}

.threeColumns .calendar-pg{float:left;margin-right:-10px;}
.threeColumns .calendar-pg .ui-inputfield.ui-state-disabled, .threeColumns .calendar-pg input.datepicker-device{width:180px;}
.threeColumns .calendar-pg .calendar-st input{width:147px;}


.two-columns{width: 100%;}
/* -----------------------------------------
  	Change Security Questions DataGrid
----------------------------------------- */
.customDatagrid{margin-bottom: 11px;}
.customDatagrid .grayBorder.threeColumns td:FIRST-CHILD {width: 1%;}
.customDatagrid .grayBorder.threeColumns td:LAST-CHILD {width: 30%;}
.customDatagrid .ui-datagrid-content.ui-widget-content{border-radius: 5px;}

.customDatagrid .ui-datagrid-row:nth-child(even) {background-color: #f7f7f7;}
.customDatagridColumn {width: 70%}
.customDatagrid .ui-selectonemenu {	width: 400px !important;}

.customDatagrid select {width: 400px !important;}

.ui-datagrid.customDatagrid .ui-datagrid-row .ui-datagrid-column .blueBtnSmall{height:29px;width:29px;  top: 9px;}
.ui-datagrid.customDatagrid .ui-datagrid-row .ui-datagrid-column .blueBtnSmall .ui-icon{margin-top: -7px;}

/* .ui-datagrid-data tr:nth-child(1) .grayBorder.threeColumns td:FIRST-CHILD:after{content: '1'} */

/* -----------------------------------------
   Labels & Headers
----------------------------------------- */
.grayBorder>thead tr th, .contentPg>thead tr th{font-weight: normal;
						color: #4f4f4f;
						font-size: 17px;
                        text-align: left;
                        -webkit-transition: all 0.3s ease-out;
                        -moz-transition: all 0.3s ease-out;
                        -o-transition: all 0.3s ease-out;
                        text-shadow:none;
                        padding-left: 3px;
  						padding-top: 2px;
                        /* border-bottom:solid 1px #C9C9C9; */}

.logoHeader {font-weight: bold;	font-size: 25px;color: #1c75bc;	font-style: italic;}

.blueLabel{-webkit-transition: all 0.3s ease-out;
			-moz-transition: all 0.3s ease-out;
			-o-transition: all 0.3s ease-out;
			color: #16609a;
			text-shadow: none; text-decoration : none;
			font-weight: bold;
			text-decoration: none;}
	
.greyLabel {color: #676C71;	font-weight: bold}
.amountRed {color: #c60d0d;	font-weight: bold;}
.amountGreen {color: #49993d;	font-weight: bold;}
.amountGreenLighter{color:#84d317;text-shadow: 0px 0px 10px #00365b;}
.amountRedLighter{color: #f76c6c;text-shadow:0px 0px 10px #00365b}

.headerBlue{font-weight: normal;color: #1c75bc;	font-size: 21px;text-shadow:none}
.labelBlack {font-weight: normal;color: #4f4f4f;font-size: 17px;}
a.labelBlack {text-decoration: none}

a.labelBlack:hover {text-decoration: underline} /*font-size:19px*/
a.labelBlack.last {	text-decoration: none}
.labelBlack.last:hover {cursor: default}

.dialogLabel {font-weight: normal;color: #4f4f4f;font-size: 15px;}

.smallLabelBlack {font-weight: normal;	color: black;	font-size: 14px}
.disclaimer {font-family: Verdana, Geneva, sans-serif;	font-size: 11px;line-height: 17px;	color: #5d6267;}
.note {	font-style: italic;	font-size: 11px;color: #5d6267;}

/* -----------------------------------------
   Links
----------------------------------------- */
/*.commandLinkNoUnderline {text-decoration: none;	color: #004c7a !important;	font-size: 12px;}
.commandLinkNoUnderline .ui-button-text{font-size:12px}
.commandLinkNoUnderline:hover {	text-decoration: underline;}*/

.italicLink{text-decoration: none;color: #16609a !important;font-size: 12px;font-style: italic;}
.italicLink:hover {text-decoration: underline;}

.editLink{text-decoration: none;color: #16609a !important;font-size: 12px;}
.editLink:hover {text-decoration: underline;}


.disclaimerLink a {color: white}

/* -----------------------------------------
   Buttons as a link (ChequeImage - EVoucher pages)
----------------------------------------- */
.ui-datatable .buttonAsLink{border: none; outline: none; background: none;}
.buttonAsLink span{color: #16609a}
.buttonAsLink span:hover{text-decoration:underline}

/* -----------------------------------------
   OverlayPanel - Balance Overview page
----------------------------------------- */
.overlayPanel {width: 230px;text-align: left;  box-shadow:-1px 0px 18px -4px rgba(0, 0, 0, 0.2);border:1px solid #c9c9c9;border-radius:0px}
.overlayPanel a{color:#16609a;	font-size: 12px;}
.overlayPanel a:hover{text-decoration:underline}

.ui-overlaypanel {position: absolute;}

/* -----------------------------------------
   Dropdown 
-----------------------------------------*/
select {width: 218px;
		height: 33px;
		background-color: #ffffff;
		border-radius: 5px;
		border: 1px solid #E6E6E6;
		outline: none;
		color: black;}

.requiredDropdown {	border-left: 2px solid #c60d0d}
.smallDropdown, input[type="text"].amount-currency{width: 65px;}
.amount-currency{padding-left: 5px;box-sizing: border-box;}

.balance-pg{line-height:11px;border-spacing: 0px;}
.balance-pg td, .balance-pg span, .balance-pg .amountGreen, .balance-pg .amountRed{font-size:11px;}

/* -----------------------------------------
   SelectOneMenu(Dropdown - primefaces)
----------------------------------------- */
 .ui-selectonemenu{width: 216px !important;height: 33px; border: 1px solid #E6E6E6 !important;display: inline-flex;}
 .ui-selectonemenu .ui-selectonemenu-label.ui-inputfield{box-shadow:none; 
                                                        padding: 7px 0px 6px 3px; 
                                                        font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
                                                        color: black;
                                                        line-height: 20px;}
                                                        
.ui-selectonemenu .ui-selectonemenu-label.ui-inputfield {
	padding: 7px 0px 0px 8px;
    width: 100% !important;
    padding: 0px 30px 0px 10px;
    box-sizing: border-box;
    line-height: 33px;
    white-space: normal;
    word-break: break-all;
}
.ui-selectonemenu .ui-icon.ui-icon-triangle-1-s{display: list-item;background-position: -64px -13px;}
 
 .ui-selectonemenu .ui-selectonemenu-trigger.ui-state-default.ui-corner-right,.ui-selectonemenu .ui-selectonemenu-trigger.ui-state-default.ui-corner-right:hover{
    background-color:#ffffff;
    background-image:none;
    border-left:none;
    box-shadow: none}

.ui-selectonemenu-panel.ui-shadow{box-shadow:none; border-radius:0;}
.ui-selectonemenu-panel .ui-selectonemenu-filter{width:100%;box-sizing:border-box;height:33px;}
.ui-selectonemenu-panel .ui-selectonemenu-filter-container .ui-icon {position: absolute;top: 13px;right: 10px;}
.ui-selectonemenu-filter-container{width:100%;}
.ui-selectonemenu-panel .ui-selectonemenu-filter-container {box-sizing: border-box;}

select.smallDropdown[disabled="disabled"]{border:none;background-color: transparent;-webkit-appearance: none;-moz-appearance: none;width: 68px;}

/* -----------------------------------------
   SelectOneMenu(Dropdown - primefaces)
----------------------------------------- */
/* .ui-selectonemenu , .ui-accordion .ui-accordion-content .ui-selectonemenu{width: 216px !important;height: 33px; border: 1px solid #E6E6E6 !important;display: inline-flex;}
.ui-selectonemenu .ui-selectonemenu-label.ui-inputfield{box-shadow:none; 
                                                        padding: 7px 0px 6px 3px; 
                                                        font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
                                                        color: black;
                                                        line-height: 20px;}
.ui-datatable thead .ui-selectonemenu .ui-selectonemenu-label.ui-inputfield {padding: 1px 0px 0px 5px;}
.ui-datatable thead .ui-selectonemenu .ui-icon.ui-icon-triangle-1-s{display: list-item;background-position: -64px -20px;}
.ui-selectonemenu .ui-selectonemenu-label.ui-inputfield.ui-state-focus{box-shadow:none;}
.ui-selectonemenu .ui-selectonemenu-trigger.ui-state-default.ui-corner-right,.ui-selectonemenu .ui-selectonemenu-trigger.ui-state-default.ui-corner-right:hover{
    background-color:#ffffff;
    background-image:none;
    border-left:none;
    box-shadow: none}
.ui-selectonemenu .ui-selectonemenu-trigger .ui-icon, .ui-accordion .ui-accordion-content .ui-selectonemenu .ui-selectonemenu-trigger .ui-icon{margin-top: 6px;}
.ui-accordion .ui-selectonemenu .ui-icon.ui-icon-triangle-1-s{background-position: -64px -15px}
.ui-selectonemenu-filter.ui-inputfield.ui-state-default{background-color:#ffffff; background-image:none}
.ui-selectonemenu-filter.ui-inputfield.ui-state-active{background-color:#ffffff !important; box-shadow:none; background-image:none}
.ui-selectonemenu-panel .ui-selectonemenu-list-item:hover{background-image:none;background-color:#fff7d0;box-shadow:none;}
.ui-selectonemenu-panel .ui-selectonemenu-list-item.ui-state-highlight{box-shadow:none;background:none;color: #0065A5;}
.ui-selectonemenu-panel .ui-selectonemenu-list-item.ui-state-highlight:hover{background-color: #FFF7D0;}
.smallDropdown , .ui-accordion .ui-accordion-content .smallDropdown{width: 55px !important}
.ui-selectonemenu.requiredDropdown , .ui-accordion .ui-accordion-content .ui-selectonemenu.requiredDropdown{border-left:2px solid red !important;border-radius: 3px 4px 4px 3px;}
 */

/* ----------------------------------------
   Accordion
----------------------------------------- */

.ui-accordion .ui-icon.ui-icon-triangle-1-e {background-position: -16px -129px;	margin-top: -8px;}
.ui-accordion .ui-icon.ui-icon-triangle-1-s {background-position: -48px -129px;	margin-top: -8px;}

.accordionFilterPG {font-weight: normal;color: #4f4f4f;font-size: 19px;}

.accordionPanel {font-weight: normal;
				color: #4f4f4f;
				font-size: 19px; 
				/* box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.2); */
				border: solid 1px #C9C9C9;
				width: 100%;
				border-spacing: 8px;
				margin-bottom: 11px;
				line-height: 20px;
				border-radius: 5px;}
 	
.accordionFilterPG .ui-accordion-header {padding: 3px 0px 3px 30px;	font-size: 14px;}

.accordionPanel .ui-accordion-header {padding: 8px 0px 8px 30px;font-size: 17px;}
.accordionPanel .ui-accordion-header:not(:first-of-type) {border-top: solid 1px #C9C9C9;}
.accordionPanel .ui-accordion-content {	padding: 5px; overflow: hidden;	background: #fbfbfb; border-radius: 6px;} /*padding:12px 12px*/

/* -----------------------------------------
   Accordion - OLD MyAccounts

.accordionBasic{border:solid 1px #C9C9C9;font-weight:normal;color:black;font-size:19px;margin-bottom:10px; }
.accordionBasic .ui-accordion-header .ui-icon{right: 18px; top: 50%; margin-top: -8px; left: inherit;}
.accordionBasic .ui-accordion-content {padding: 12px 17px;}
.accordionBasic .ui-accordion-header {cursor: pointer; position: relative; margin-top: 0px; padding: 12px 0px 12px 12px;color: black;border:none; box-shadow:none;background-color: #DADADA; text-shadow: none;}
----------------------------------------- */
.accordionTable .ui-accordion-content {	padding: 0px;}

.accordionTable .ui-datatable-tablewrapper, .accordionTable .ui-datatable,	.accordionTable .ui-datatable tbody tbody tr, .accordionTable .ui-datatable tbody tbody	{border: none;}

/* -----------------------------------------
   Select One Button
----------------------------------------- */
.ui-selectonebutton .ui-button{margin: 0px;padding:0px;background-color: #f5f5f5; color: #16609A; border-radius: 0px;  border: 1px solid #c9c9c9;}
.ui-selectonebutton .ui-button.ui-state-active{text-shadow: none; background: #16609A; box-shadow: none; color: white;}
.ui-selectonebutton .ui-button.ui-state-hover{box-shadow: none; background-image: none;}
.ui-selectonebutton .ui-button.ui-state-disabled{opacity:0.78}

.ui-selectonebutton .ui-button-text-only .ui-button-text { padding: .4em 0.65em;}

.ui-selectonebutton.bo-buttons-app{width:100%; display:inline-table;border-spacing: 0px;padding: 0px;}
.ui-selectonebutton.bo-buttons-app .ui-button{width: 20%;display:table-cell;box-sizing: border-box;vertical-align: middle;}
/* -------------------------------------- */

.ui-chkbox {display: block}

.panelGridNoBorder td {	border: none;}

.recaptcha_only_if_privacy {display: none;}

/*make password like inputText*/
@font-face {
	font-family: 'dotsfont';
	src: url('dotsfont.eot');
	src: url('dotsfont.eot?#iefix') format('embedded-opentype'),
		url('dotsfont.svg#font') format('svg'), url('dotsfont.woff')
		format('woff'), url('dotsfont.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;}

.drop-shadow {
	float: left;
	width: 40%;
	padding: 1em;
	margin: 2em 10px 4em;
	background: #fff;
	-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1)inset; }

.drop-shadow:before, .drop-shadow:after {content: "";position: absolute;z-index: -2;}
.drop-shadow p {font-size: 16px;font-weight: bold;}

/* -----------------------------------------
  Lifted corners
----------------------------------------- */
.lifted {-moz-border-radius: 0px;border-radius: 0px;}

.lifted:before, .lifted:after {
	bottom: 15px;
	left: 10px;
	width: 50%;
	height: 20%;
	max-width: 300px;
	-webkit-box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);
	-moz-box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);
	box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);
	-webkit-transform: rotate(-3deg);
	-moz-transform: rotate(-3deg);
	-ms-transform: rotate(-3deg);
	-o-transform: rotate(-3deg);
	transform: rotate(-3deg);}

.lifted:after {
	right: 10px;
	left: auto;
	-webkit-transform: rotate(3deg);
	-moz-transform: rotate(3deg);
	-ms-transform: rotate(3deg);
	-o-transform: rotate(3deg);
	transform: rotate(3deg);}

/* -----------------------------------------
  Tabs
----------------------------------------- */
.tabsBorderPG {	border: solid 1px #c9c9c9;	border-spacing: 0px;width: 100%;}

.tabsBorder {border-top: solid 1px #dddddd;	width: 100%;border-spacing: 10px;}

#loadOverlay {display: none;}

/* -----------------------------------------
       File Upload
----------------------------------------- */
.ui-fileupload-buttonbar.ui-widget-header.ui-corner-top,.ui-fileupload-content.ui-widget-content.ui-corner-bottom {	border: none;background: #fbfbfb;}
.ui-fileupload-buttonbar .ui-fileupload-choose input {transform: none;font-size: 11px;	width: 100%;height: 100%;}

.ui-fileupload-files .ui-fileupload-cancel.ui-button {width: 23px;height: 22px;}
.ui-fileupload-files td {padding: 4px 3px;}

.ui-fileupload-content .ui-progressbar {width: 75px;}

.iconUpload .ui-fileupload-buttonbar {	padding: 0px;background-color: transparent;}
.iconUpload .ui-fileupload-buttonbar .ui-fileupload-choose input {transform: initial;width: auto;height: auto;}
.iconUpload .ui-fileupload-buttonbar .ui-button:hover{text-decoration:underline!important;color: #16609a}
.iconUpload .ui-fileupload-buttonbar .ui-button	{
	border: none;
	text-decoration: none;
	color: #1c75bc;
	background: none;
	font-weight: normal;
	box-shadow: none;
	text-shadow: none;}


.iconUpload .ui-widget-content, .iconUpload .ui-fileupload-buttonbar .ui-button .ui-button-icon-left{display: none;}
.iconUpload .ui-button-text-icon-left .ui-button-text {	padding: 0px}

/*.fileUpAboutU .ui-fileupload-buttonbar .ui-button-text{display:none}
.fileUpAboutU .ui-fileupload-buttonbar .ui-fileupload-choose{height: 24px;width: 24px;background-image: url('../../../resources/images/upload.png');background-repeat: no-repeat;}
.fileUpAboutU .ui-fileupload-buttonbar .ui-fileupload-choose .ui-icon-plusthick{ display: none !important;}*/

/* -----------------------------------------
     Calendar
----------------------------------------- */
/*.calendarSt>input {	width: 206px !important;}

.calendarStReq>input, .ui-tabs .calendarStReq>input, .ui-tabs .calendarStReq>input.ui-state-focus,.ui-accordion .calendarStReq>input, .ui-accordion .calendarStReq>input.ui-state-focus
	{border-left: 2px solid #c60d0d;width: 172px;}*/
	
.calendarFilters>input {width: 124px;}

.calendarFilters .ui-inputfield.ui-state-disabled {	width: 161px;}

/* .settingsIcon, .settingsIcon:hover, .ui-dashboard .settingsIcon, .ui-dashboard  .settingsIcon:hover {
	background-image: url('./images/settings.png');
	width: 26px;
	height: 27px;
	box-shadow: none;
	border: none;
	outline: none;
	background-color: transparent;
	top: 7px;
	float: right;} */
	


.stepsImg {margin-bottom: -7px;	width: 100%;max-width: 700px;}

/* -----------------------------------------
     Radio Button-Calculators
----------------------------------------- */

.ui-selectoneradio label {display: block;margin-top: 0px;font-weight:normal;margin-right:10px;}

/* -----------------------------------------
     Radio Button-Cheque Image
----------------------------------------- */
.chequeRadioBtn{margin-left:-3px}
/* -----------------------------------------
     Icons
----------------------------------------- */
.ui-icon-custom {height: 15px;	width: 20px;}
.icon-print {background-position: -5px -2px;}
.icon-export {background-position: -37px -2px;}
.icon-details-arrow {background-position: -41px -98px;}
.icon-messages {background-position: -115px -153px;}
.icon-notifications {background-position: -171px -153px;}
.icon-pending {	background-position: -143px -153px;}
.icon-batch {background-position: -9px -178px;}
/*
.icon-messages{background-position: -78px -100px}
.icon-notifications{background-position: -143px -98px}
.icon-pending{background-position: -8px -98px}
.icon-pending_mass{background-position: -147px -154px}*/
/*.icon-logout{background-position: -174px -97px;}*/
.icon-logout {background-position: 0 0}
.icon-doll {background-position: -112px -95px}
.icon-settings {background-position: 0px -35px}
.icon-settings-menu {background-position: 0 -6px;}
.icon-accounts {background-position: -65px -6px}
.icon-applications {background-position: -242px -6px}
.icon-payments {background-position: -183px -6px}
.icon-menu-transfer {background-position: -127px -6px;}
.icon-user-options {background-position: -305px -6px}
.icon-find {background-position: -158px -70px}
.icon-calendar {background-position: -38px -33px}
.icon-chart {background-position: -77px -1px}
.icon-list {background-position: -116px 0;}
.icon-card {background-position: -76px -36px;}
.icon-tick {background-position: -120px -36px;}
.icon-question-mark {background-position: -157px -4px;}
.icon-print {background-position: -5px -2px;}
.icon-dashboard {background-position: -5px -2px;}
.icon-close {background-position: -135px -123px}
.icon-phone {background-position: -4px -153px}
.icon-message-white {background-position: -166px -127px}
.ui-icon-custom.positive-amount {background-position: -115px -72px}
.ui-icon-custom.negative-amount {background-position: -76px -72px}
.icon-plus {background-position: -10px -126px;}
.icon-minus {background-position: -41px -126px;}
.icon-plus, .icon-minus {height: 16px;position: absolute;width: 16px;}

.ui-button-icon-left.ui-icon.ui-c.icon-doll {margin-left: -14px;width: 22px;}

.user button.ui-button-icon-only {width: 1.6em}

.boxShadow {
	-webkit-box-shadow: 0 15px 8px rgba(0, 0, 0, 0.7);
	-moz-box-shadow: 0 15px 8px rgba(0, 0, 0, 0.7);
	box-shadow: 0 15px 8px rgba(184, 171, 171, 0.7);}

/* -----------------------------------------
     Effect 2
----------------------------------------- */
.effect2 {	position: relative;}

.effect2:before, .effect2:after {
	height: 12%;
	z-index: -1;
	position: absolute;
	content: "";
	bottom: 25px;
	left: 12px;
	width: 50%;
	top: 80%;
	max-width: 300px;
	background: #777;
	-webkit-box-shadow: 0 15px 10px #777;
	-moz-box-shadow: 0 15px 10px #777;
	box-shadow: 0 15px 10px #777;
	-webkit-transform: rotate(-4deg);
	-moz-transform: rotate(-4deg);
	-o-transform: rotate(-4deg);
	-ms-transform: rotate(-4deg);
	transform: rotate(-4deg);}

.effect2:after {
	-webkit-transform: rotate(4deg);
	-moz-transform: rotate(4deg);
	-o-transform: rotate(4deg);
	-ms-transform: rotate(4deg);
	transform: rotate(4deg);
	right: 12px;
	left: auto;}

.box.effect2:before, .box.effect2:after {height: 15%;}

/* -----------------------------------------
     Effect 3
----------------------------------------- */
.effect3 {	position: relative;}

.effect3:before, .effect3:after {
	height: 12%;
	z-index: -1;
	position: absolute;
	content: "";
	bottom: 25px;
	left: 12px;
	width: 50%;
	top: 80%;
	max-width: 300px;
	background: #777;
	-webkit-box-shadow: 0 15px 10px #777;
	-moz-box-shadow: 0 15px 10px #777;
	box-shadow: 0 15px 10px #777;
	-webkit-transform: rotate(-4deg);
	-moz-transform: rotate(-4deg);
	-o-transform: rotate(-4deg);
	-ms-transform: rotate(-4deg);
	transform: rotate(-4deg);}

.effect3:after {
	-webkit-transform: rotate(4deg);
	-moz-transform: rotate(4deg);
	-o-transform: rotate(4deg);
	-ms-transform: rotate(4deg);
	transform: rotate(4deg);
	right: 12px;
	left: auto;}

.box.effect3:before, .box.effect3:after {height: 15%;}

/* -----------------------------------------
     Effect 8
----------------------------------------- */
.effect8 {
	position: relative;
	-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px
		rgba(0, 0, 0, 0.1) inset;
	-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px
		rgba(0, 0, 0, 0.1) inset;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1)
		inset;}

.effect8:before, .effect8:after {
	content: "";
	position: absolute;
	z-index: -1;
	-webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
	-moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
	top: 10px;
	bottom: 10px;
	left: 0;
	right: 0;
	-moz-border-radius: 100px/10px;
	border-radius: 100px/10px;}

.effect8:after {
	right: 10px;
	left: auto;
	-webkit-transform: skew(8deg) rotate(3deg);
	-moz-transform: skew(8deg) rotate(3deg);
	-ms-transform: skew(8deg) rotate(3deg);
	-o-transform: skew(8deg) rotate(3deg);
	transform: skew(8deg) rotate(3deg);}

/* -----------------------------------------
   PendingAuthorisation - Select All(chkbox)
----------------------------------------- */
.selectAll thead .ui-chkbox-box.ui-widget.ui-corner-all.ui-state-default{
	box-shadow: none;
	outline: none;
	background: url('../images/tickAll.png') right center no-repeat;
	background-repeat: no-repeat;
	background-color: #f5f5f5;
	border: 1px solid #c9c9c9;;
	width: 22px;
	height: 20px;
	margin-left: -4px;
	margin-top: -6px;
	background-position: 2px 4px;
	border-radius: 3px;}

.selectAll thead .ui-chkbox-box.ui-widget.ui-corner-all.ui-state-default.ui-state-hover	{
	/*    border: 1px solid #c9c9c9;*/
	cursor: pointer;
	box-shadow: none;
	outline: none;}

.selectAll thead .ui-chkbox-icon.ui-c.ui-chkbox-icon.ui-icon.ui-icon-check.ui-c	{display: none;}

/* -----------------------------------------
      Select Many Menu - Checkbox
----------------------------------------- */
.ui-selectmanycheckbox label {margin-top: 1px}
.ui-selectmanycheckbox:first-child {width: 74%}

/* -----------------------------------------
      Select Many Menu - Messages
----------------------------------------- */
.manyMenuMsgs .ui-selectlistbox-listcontainer {	height: 115px !important}
.manyMenuMsgs {	width: 300px;box-shadow: none !important;border: 1px solid #E6E6E6;}

/* -----------------------------------------
      Select Many Menu - ElectronicStatements
----------------------------------------- */
.manyMenuStatements .ui-selectlistbox-listcontainer {height: 225px !important}
.manyMenuStatements {width: 212px;	box-shadow: none;	border: 1px solid #E6E6E6;}


/*---------------------------------------- */
.payeesTabs .ui-tabs-panels {height: 241px}
.borderBottom table tbody, .borderBottom table tbody:hover {border-bottom: 1px solid #c9c9c9}
/*.ui-accordion-content input[type="text"] .placeHolder.ui-placeholder{font-size:10px}*/

/* -----------------------------------------
    AboutYou - Watermark
----------------------------------------- */
.placeHolder::-webkit-input-placeholder {
	padding: 0px !important;
	font-size: 11px;
	color: #555555;}

.placeHolder::-moz-placeholder {
	padding: 0px !important;
	font-size: 11px;
	color: #555555;}

.placeHolder:-ms-input-placeholder {
	padding: 0px !important;
	font-size: 11px;
	color: #555555;}

.placeHolder:-moz-placeholder {
	padding: 0px !important;
	font-size: 11px;
	color: #555555;}
/*--------------------------------- */

.clickOnEnter {}

.labelSmallGp {
	width: 125px;
	height: 20px;
	color: #414852;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	font-size: 13px;}

.staticTextGp {
	width: 159px;
	height: 20px;
	color: #414852;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	font-size: 12px;
	font-family: Verdana;}


.changedLabelSmallGp {
	width: 125px;
	height: 20px;
	color: #0000ff;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	font-size: 13px;}

.accountsTab .ui-panelgrid .ui-panelgrid-cell {	border: none;padding: 0px;}
.changedTableSmallGp {color: #0000ff;	font-weight: bolder;}
.addedTableSmallGp {color: #008000;	font-weight: bolder;}
.deletedTableSmallGp {color: #ff0000;font-weight: bolder;}
.nonChangedTableSmallGp {color: #000000;}


/* -----------------------------------------
   Widget DonutChart Legend
----------------------------------------- */
.pfmDonutWidget  {width: 392px; height: 230px;}

.pfmDonutWidget table.jqplot-table-legend{background-color: transparent; border:none; position: absolute;left:3px!important}
.pfmDonutWidget table.jqplot-table-legend tbody tr td{ font-size: 11px;}

/* -----------------------------------------
   DonutChart Legend
----------------------------------------- */
.pfmDonutChart .jqplot-table-legend{padding: 4px;background-color: transparent; border:none;}

.legent-out table.jqplot-table-legend{left: -184px !important; top: -3px !important;border:none}


.sliderSt{width:210px;float: left;box-shadow: inset 0px 1px 1px #8f8f8f;}

.ui-separator{font-size: 0px;}

.bold-txt span{font-weight:bold;}

.mobile-field{max-width: 218px; border-spacing: 0px;}
.mobile-field tbody tr td:first-child{width: 10%;}
.mobile-field tbody tr td:last-child{width: 90%;}
.mobile-field input{width: 100% !important;}

.text-ellipsis, .text-ellipsis-300{display: inline-block; white-space: nowrap; overflow: hidden !important; text-overflow: ellipsis;}
.text-ellipsis-300{max-width: 300px;}


.scrollable-dt .ui-datatable-scrollable-body > table{table-layout: auto;}
.scrollable-dt td.reflowColumn {
    word-break: break-all;
}
.transactionHistoryDialog .ui-dialog {
	position:relative;
}


.leftColumnTH{width:100px;text-align: right;padding-right: 5px;}

.dialogHeader{clear: both; padding: 5px 0px 5px 0px;}

.dialogHeader td{color: #5d6267; font-size:14px; font-weight:bold;}

.ui-dialog.customDialog{height: 100%; -webkit-overflow-scrolling: touch;box-sizing: border-box; top:0px !important; bottom: 0px !important; left:0px !important; width:100% !important; overflow: scroll; overflow-x:hidden; border-radius: 0;
-webkit-transform: none !important; -moz-transform: none !important; -ms-transform: none !important; -o-transform: none !important; transform: none !important;}
.ui-dialog.customDialog .ui-dialog-content.ui-widget-content{box-sizing: border-box;overflow:hidden;overflow-x:hidden;}
.ui-dialog.customDialog .ui-dialog-titlebar-close, .ui-dialog.customDialog .ui-dialog-titlebar-close:hover{padding:2px;box-shadow:none;border:none;margin: -11px 0 0 0;height: 19px;right: 10px;}
.ui-dialog.customDialog .ui-dialog-titlebar{height: 25px; box-sizing: border-box; padding: 0px;}
.ui-dialog.customDialog .ui-dialog-title {font-size: 15px;}

.ui-dialog.fixed-width {width: 600px !important;}
.ui-dialog.fixed-width .labelsSt {width: 20%;}

.ui-state-default.ui-button.icon-only-btn{border: none;width: 30px;height: 30px;background: transparent;outline: none;border-radius: 0px;}
.ui-state-default.ui-button .ui-icon.icon-trans-details{width: 25px; height: 27px; border-radius: 0px; margin: auto; top: 0; bottom: 0; right: 0; left: 0px; background-image: url(../images/transaction_history.png);}

.scrollable-dt td.reflowColumn {word-break: break-all;}

.scrollable-dt .ui-datatable-scrollable-header, .scrollable-dt .ui-datatable-scrollable-body, .scrollable-dt .ui-datatable-scrollable-footer{width: 900px !important;}

/*Card Management*/
.ui-selectmanybutton .ui-button.ui-state-default.ui-state-active {background: linear-gradient(to bottom, rgba(88, 187, 255, 0.95) 8%,rgba(0, 99, 167, 0.9) 90%); color: white}
.countryDateGrid .ui-datagrid-content.ui-widget-content {border:none;}

.cardNumberCM{  position: absolute; margin: 0; top: 87px; color: white; left: 38px; font-size: 18px; }

.cardHolderNameCM{position: absolute; margin: 0; top: 135px; color: white; left: 38px; font-size: 14px; }

.masterCardDet > tbody > tr > td:nth-child(1){vertical-align: top; width: 30%; border-right: 1px solid lightgray;}
.masterCardDet > tbody > tr > td > table > tbody > tr:nth-child(2){text-align: center;}

.cardActBtn {background: none; background-color: transparent; border: none; text-align: left; width: 100%; border-bottom: 1px solid #e4e4e4; border-radius: 0; color: red; height: 50px; outline: none;}
.cardActions > tbody > tr:first-child .cardActBtn {border-top: 1px solid #e4e4e4; color:#1c75bc;}
.cardActBtn.ui-button .ui-button-text {padding-left: 0; font-size:14px;}
.cardActBtn span.ui-icon{color: #707272;}
.cardActBtn .ui-button-icon-right.ui-icon.ui-c.fa.fa-angle-right{font-size: 25px; height: 25px; width: 12px; margin: auto; top: 0px; bottom: 0px; right: 0px;}

.limitLink{font-size: 16px; font-weight: 600; text-align: left; text-decoration: none; height: 60px; color: #1c75bc;}
.limitLinkDetails{color: #848484;}

table.controlPG > tbody > tr > td > a {text-decoration:none; border-radius: 0px; height: 60px; width: 100%; border: none; box-shadow: 1px 1px 1px rgba(201, 201, 201, 0.5); color: #1c75bc; background-color: #FFFFFF; padding: 0px 10px; box-sizing: border-box; display: block;}
table.controlPG > tbody > tr > td > a > table {border-spacing: 0px; width: 100%;}
table.controlPG > tbody > tr > td > a > table > tbody > tr {height: 60px;}
table.controlPG > tbody > tr > td {padding: 8px 5px; box-sizing: border-box;}
table.controlPG > tbody > tr > td > a > table > tbody > tr > td:first-child {width: 90%; white-space: nowrap; text-overflow:ellipsis; overflow: hidden; max-width:1px;}

.ui-button.active, .ui-button.inactive {border: none; background-color: transparent;}
.ui-button.active .ui-button-text, .ui-button.inactive .ui-button-text {font-size: 14px; text-transform: uppercase; white-space: nowrap;}
.ui-button.active {color: #1c75bc;}
.ui-button.inactive {color: #c8c8c8;}
.ui-icon.active, .ui-icon.inactive {background-repeat: no-repeat; background-position: center; height: 100%; width: 24px; top: 0px; bottom: 0px; right: 0px; margin: auto;}
.ui-icon.active  {background-image: url('../images/active.png'); }
.ui-icon.inactive  {background-image: url('../images/inactive.png');}

/* Switch checkbox */
.switch {
  position: relative;
  display: inline-block;
  width: 45px;
  height: 28px;
}

.switch input {display:none;}

.switch .ui-chkbox-box, .switch.ui-widget .ui-widget.ui-chkbox-box {
  border-radius: 34px;
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: none;
  background-color: #C9C9C9;
  -webkit-transition: .4s;
  transition: .4s;
  width: 100%;
  height: 100%;
  border: none;
}

.switch .ui-chkbox-box:before {
  border-radius: 50%;
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 4px;
  bottom: 4px;
  background: none;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

.switch .ui-chkbox-box.ui-state-active, .switch.ui-widget .ui-widget.ui-chkbox-box.ui-state-active {
  background-color: #1c75bc;
}

.switch:focus .ui-chkbox-box {
  box-shadow: 0 0 1px #1c75bc;
}

.switch .ui-chkbox-box.ui-state-active:before {
  -webkit-transform: translateX(17px);
  -ms-transform: translateX(17px);
  transform: translateX(17px);
}

.switch .ui-chkbox-box.ui-state-active .ui-icon {display: none;}

.ui-picklist .ui-picklist-filter-container input {
    width: 200px;
    margin-bottom: 5px;
}

li.ui-picklist-item.ui-corner-all > table > tbody > tr >td:nth-child(1) {width: 10%;}

li.ui-picklist-item.ui-corner-all > table > tbody > tr >td:nth-child(2) {width: 15%;}

li.ui-picklist-item.ui-corner-all > table > tbody > tr >td:nth-child(3) {width: 75%; text-align: left;}

.countryPickList > tbody:nth-child(1) > tr > td:nth-child(3) {vertical-align: bottom;}


/* Card Details */
.cardNumber{  position: absolute; margin: 0; top: 85px; color: white; left: 25px; font-size: 18px; }

.cardHolderName{position: absolute; margin: 0; top: 133px; color: white; left: 25px; font-size: 14px; }
