﻿@charset "UTF-8";
@import url(MyFontsWebfontsKit.css);
/*#region reset*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }
  
input:disabled {
	background-color: #ECECED; }

/*#endregion*/
/*#region Variables*/
/*#endregion*/
/*#region GLOBAL*/
* {
  padding: 0;
  margin: 0;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }
  *:active, *:focus, *:hover {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }

body {
  color: #40474F;
  font-size: 0.8em;
  font-family: "AvenirLTStd-Book", Helvetica, Arial, sans-serif;
  font-weight: normal;
  font-style: normal; }

/*#endregion*/
/*#region TOP BANNER*/
#bannerwrapper {
  margin-top: 10px;
  width: 100%;
  margin-bottom: 20px;
  display: inline-block;
  background: #fff;
  border-bottom: solid 1px #40474F; }
  #bannerwrapper img {
	float:left;
	width: 250px;
	margin: 10px 0;
	}
  #bannerwrapper .rightPanelBanner {
    margin-top: 10px;
    text-align: right;
    display: inline-block;
    float: right;	}
    #bannerwrapper .rightPanelBanner p {
      padding: 2px 0px;
      font-size: 1.2em; }
      #bannerwrapper .rightPanelBanner p em {
        font-size: 1.6em;
        font-style: normal;
        color: #003c65;
        font-weight: bold; }
      #bannerwrapper .rightPanelBanner p:first-of-type {
        color: #3ca7e3;
        border-bottom: 1px solid #e1e2e3;
		margin-bottom:10px;	 
        font-size: 1.3em; }
  #bannerwrapper #logoff {
    position: relative;
    background: #DCDCDC;
    width: 100%;
    line-height: 2em;
    margin: 20px 0 10px 0;
    display: table; }
    #bannerwrapper #logoff .logonHistory {
      display: inline-block;
      padding: 0;
      line-height: 2em;
      padding: 4px 10px;
      font-size: 1em;
      display: table-cell;
      vertical-align: middle; }
    #bannerwrapper #logoff .helpButton {
      background: #3ca7e3;
      border: 1px solid #434343;
      padding: 0 10px;
      border-radius: 2px;
      float: right;
      font-size: 1em;
      margin: 5px 0;
      -moz-transition: 0.3s background;
      -o-transition: 0.3s background;
      -webkit-transition: 0.3s background;
      transition: 0.3s background;
      color: #fff; }
      #bannerwrapper #logoff .helpButton:hover, #bannerwrapper #logoff .helpButton:focus {
        background: #009dd6; }
    #bannerwrapper #logoff .logoffButton {
      background: #fff;
      border: 1px solid #434343;
      padding: 0 10px;
      border-radius: 2px;
      float: right;
      font-size: 1em;
      margin: 5px 12px;
      -moz-transition: box-shadow .2s;
      -o-transition: box-shadow .2s;
      -webkit-transition: box-shadow .2s;
      transition: box-shadow .2s; }
      #bannerwrapper #logoff .logoffButton:hover {
        box-shadow: 0 0 7px #003c65; }

/*#endregion*/
/*#region PAGE LAYOUT */
#pagewrapper {
  width: 70%;
  min-width: 900px;
  text-align: left;
  margin-right: auto;
  margin-left: auto; }

#printfriendlypagewrapper {
  width: 800px;
  text-align: left;
  margin-right: auto;
  margin-left: auto; }

#printfriendlybanner {
  height: auto;
  width: 100%;
  float: right; }

.printfriendlyimage {
  float: right; }

#maincontent_2col {
  width: 75%;
  height: auto;
  float: right;
  margin-bottom: 3em; }

#maincontent_3col {
  width: 60%;
  margin: 0 auto;
  position: relative; }
  #maincontent_3col .logonHeader {
    margin-top: 40px;
    margin-bottom: 30px; }
  #maincontent_3col .logonP {
    background: #003c65;
    color: #fff;
    text-align: center;
    margin-bottom: 30px; }

#maincontent_transactionlisting {
  display: inline;
  float: left;
  width: auto;
  height: auto; }

.lblErrorMessage {
  color: #B93939;
  font-weight: bold;
}
.lblErrorMessage_1col,
.lblErrorMessage_2col,
.lblErrorMessage_3col{
	margin-bottom: 1em;
}

.lblColumnTitle {
  font-weight: bold;
  font-size: larger;
  margin-bottom: 10px; }

.lblPrintFriendlyHeader {
  font-weight: bold; }

/*#endregion*/
/*#region NAVIGATION */
.Navigation 
{
	color: #333333;
	margin: 0 5px;
	width: 22%;
	float: left;
}

.Navigation .menuBar 
{
	display: none; 
}
  
.Navigation ul 
{
	list-style-type: none;
	margin-left: 5px; 
}

.Navigation ul li 
{
	margin: 4px 0;
	color: white; 
}

.Navigation ul li.TopTier 
{
	font-size: 20px;
	font-size: 1.4em;
	line-height: 1.6em;
	background: #3ca7e3;
	background: linear-gradient(#3ca7e3, #008dbf);
	clear: both;
	padding-left: 4px;
	text-transform: lowercase;
}

.Navigation ul li.TopTier::first-letter 
{
	text-transform: capitalize; 
}

.Navigation ul li.TopTier a 
{
	color: #fff;
	clear: both;
	-moz-transition: color 0.3s;
	-o-transition: color 0.3s;
	-webkit-transition: color 0.3s;
	transition: color 0.3s;
}

.Navigation ul li.TopTier a:hover 
{
	font-weight: bold;
}

.Navigation ul li.TopTierSelected 
{
	background: #003c65;
	padding-left: 6px;
}

.Navigation ul li.TopTierSelected:hover 
{
	background: #003c65; 
}

.Navigation ul li.TopTierSelected ul 
{
	background: #DAEEFA;
	float: left;
	margin: 10px 0 10px -6px;
	width: inherit;
	width: calc(100% + 6px);
	padding: 6px 0;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

.Navigation ul li.TopTierSelected ul.secondTierSelected a 
{
	color: #434343;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	transition: all 0.3s; 
}

.Navigation ul li.TopTierSelected ul.secondTierSelected a:hover 
{
	font-weight: bold; 
}

.Navigation ul li.TopTierSelected ul.secondTierSelected a:hover, .Navigation ul li.TopTierSelected ul.secondTierSelected a:focus, .Navigation ul li.TopTierSelected ul.secondTierSelected a:active 
{
	text-decoration: none; 
}

.Navigation ul li.SecondTier 
{
	display: none;
	margin-left: 20px;
	font-weight: normal;
	margin-bottom: 6px;
	margin-top: 6px;
	font-size: 0.8em;
	line-height: 1.4em;
	color: #434343; 
	text-transform: none;
}
.Navigation ul li.SecondTier a 
{
	color: #434343; 
}

.Navigation ul li.SecondTier a:before 
{
	content: "• ";
	color: #3ca7e3; 
}

.Navigation ul li.TopTierDisabled 
{
	opacity: 0.3; 
}

.Navigation ul li.TopTierDisabled:hover, .Navigation ul li.TopTierDisabled:focus, .Navigation ul li.TopTierDisabled:active 
{
	color: #fff;
	text-decoration: none;
	cursor: default; 
}
		  
p.warningMessage{
	color: red;
	font-style: italic;
	font-weight: bold;
}

/*#endregion */
/*#region TABLES */
.GridView tr {
  font-size: 1.4em;
  line-height: 1.7em; }
  .GridView tr.selectedRow {
    background: #003c65;
    color: #fff; }
    .GridView tr.selectedRow:hover {
      background: #003c65; }
  .GridView tr th {
    vertical-align: middle;
    background-color: #3ca7e3;
    color: white; }
    .GridView tr th:first-of-type {
        padding-left: 0.3em; }
    .GridView tr th:last-of-type {
        padding-right: 0.3em;}
  .GridView tr td:first-of-type {
    padding-left: 0.3em; }
  .GridView tr td:last-of-type {
        padding-right: 0.3em;}
  .GridView tr td.docTableYearHdr {
    background: #003c65;
    text-align: center;
    font-size: 1.3em;
    line-height: 1.4em;
    color: white; }
    .GridView tr td.docTableYearHdr:hover {
      cursor: default;
      text-decoration: none; }
  .GridView tr td.docTableMonthHdr {
    background: #33BAEC;
    color: white;
    text-align: center;
    line-height: 1.5em;
    font-size: 1.4em; }
    .GridView tr td.docTableMonthHdr:hover {
      cursor: default;
      text-decoration: none; }
  .GridView tr.documentRow {
    font-size: 1.5em;
    line-height: 1.4em;
    background: #DAEEFA;
    -moz-transition: color 0.3s;
    -o-transition: color 0.3s;
    -webkit-transition: color 0.3s;
    transition: all 0.3s; }
    .GridView tr.documentRow:hover {
      text-decoration: none;
      cursor: pointer;
      background: #3878a0;
      color: #ccc; }
  .GridView tr.documentRowAlternating {
    background: #9fbfd3; }

.GridView .GridViewRowStyle {
  background-color: #E1E1E1;
  color: #40474F;
  -moz-transition: 0.3s background;
  -o-transition: 0.3s background;
  -webkit-transition: 0.3s background;
  transition: 0.3s background; }
  .GridView .GridViewRowStyle:hover {
    background: #a2cbd9; }

.GridView .GridViewAlternatingRowStyle {
  background-color: #F6F6F6;
  color: #40474F;
  -moz-transition: 0.3s background;
  -o-transition: 0.3s background;
  -webkit-transition: 0.3s background;
  transition: 0.3s background; }
  .GridView .GridViewAlternatingRowStyle:hover {
    background: #79c2dc; }

.thecustomerdetails {
  font-size: 1.2em; }
  .thecustomerdetails tr {
    padding: 0.3rem;
    color: #fff; }
    .thecustomerdetails tr th {
      background: #3ca7e3;
      color: #fff; }
    .thecustomerdetails tr td {
      padding: 0.3em;
      color: #434343; }
  .thecustomerdetails tr:first-of-type th:first-of-type {
    background: #003c65;
    color: #fff; }

.GridView,
.PendingGridView,
.tblPendingTransactions {
  width: 100%;
  max-width: 100%;
  border: none;
  font-size: 0.85em;
  margin: 1em 0;
  border-spacing: 0;
  border-collapse: collapse; }

.tblPendingTransactions {
  font-size: 10.8833px; }

.AutoSelect .GridViewRowStyleSelectable:hover,
.AutoSelect .GridViewRowStyleSelectable:active {
  cursor: pointer;
  color: #434343;
  text-decoration: underline; }

.GridView a:hover,
.GridView a:focus {
  color: #434343;
  text-decoration: underline; }

.GridView a {
  color: white; }

.selectedRow {
  background-color: #003c65;
  color: White; }

.selectedRow:hover {
  color: #fff; }

.AutoSelect .GridViewRowStyleSelectable:active,
.AutoSelect .GridViewRowStyleSelectable:focus {
  outline-width: medium;
  outline-style: solid;
  outline-color: #eab813; }

.GridView .closedAccount {
  color: red; }

.GridView .closedAccount:hover,
.GridView .closedAccount:active,
.GridView .closedAccount:focus {
  color: red; }

.GridView .pendingTransaction {
  color: red; }

.GridView .pendingTransaction:hover,
.GridView .pendingTransaction:active,
.GridView .pendingTransaction:focus {
  color: red; }

.GridView .pendingTransaction {
  color: red; }

.GridView .pendingTransaction:hover,
.GridView .pendingTransaction:active,
GridView .pendingTransaction:focus {
  color: red; }

.GroupHeader {
  background-color: #33BAEC;
  color: white; }

.GroupFooter {
    background-color: #3ca7e3;
    color: White;
}
  
.GroupFooter:last-of-type {
	text-align:right; }

.GrandTotalFooter {
  background-color: #3ca7e3;
  color: White; }

.jointAccountHeader {
  background: #6dd7ff;
  color: white; }

.Pager td {
  border: solid 1px transparent;
  text-decoration: none;
  font-weight: bold;
  padding: 5px;
  background-color: #40474F;
  color: White; }

.Pager a {
  border: solid 1px transparent;
  text-decoration: none;
  font-weight: normal;
  padding-left: .1em;
  padding-top: .1em; }
  
/* -- Password Reset -- */
.outer_information .informationbox .LoginFieldContainer label {
	text-transform:none;
}
  
/* -- Forgotten Username -- */
.ForgottenUsernameTitle h1 {
	text-transform: none;
}

.informationbox .LoginFieldContainer label {
	text-transform: lowercase;
}

.informationbox .LoginFieldContainer label::first-letter {
	text-transform: capitalize;
}
  
/* -- Application List -- */
.applicationsHeader h2 {
	font-weight:normal;
	font-size: 12.8px; }
  
/* -- Documents -- */
.documentsHeader h2 {
	font-weight:normal;
	font-size: 16px; }

/* -- Change Password -- */
.ChangePasswordBox .labelContainer p {	
	font-size: 1em; }
  
/* -- Nominated Account -- */
.NominatedAccountBox h4 {
  font-weight: bold;
  font-size: 16px;
  color: #40474F; }
    
/* -- Statement History -- */
.GroupDropDown .lblGroup {
	padding: 1em 0;
	color: #40474F;
	margin: 0;
	border: 0;
	font: inherit;
	vertical-align: baseline;
	text-align: left; }
	
.paperStatementBox h2 {
	font-size: 16px; }
 
.paperStatementBox p {
	padding: 0.25em 0;
	line-height: 1.2em; }
	
.paperStatementBox .blueButton {
	background: #eab813;}

.paperStatementBox .blueButton:hover {
	background-color: #FFA200}

.paperStatementBox .blueButton:focus {
	background-color: #FFA200}
  
/* -- Transaction Select -- */
.recentTransactionsBox h4 {
	padding: 1em 0;
	color: #40474F;
	margin: 0;
	border: 0;
	font: inherit;
	vertical-align: baseline;
	text-align: left;}
	  
/* -- PAC Reset -- */
.outer_information .informationbox h4 {
	color: #40474F; }
  
/* -- Close Account -- */
.closeAccountInformation .labelContainer {
	margin-bottom: 10px; }

.closeAccountInformation .labelContainer .MainLabel {
	margin-top: 10px;
	margin-right: 0px; }
	
.closeAccountInformation .labelContainer label {
	text-transform: lowercase; }
	
.closeAccountInformation .labelContainer label::first-letter {
	text-transform: capitalize; }
	
/* -- Secure Messaging -- */
 .SecureMessageBox label {
 	margin-bottom: 10px; 
 	font-weight: normal; }
 	
 .SecureMessagingNotificationBox p {
	line-height: 180%; }

/* -- Contact Details -- */
.ContactRegistrationBox span {
	margin-bottom: 10px;
	display: inline-block; }

.ContactRegistrationBox label {
	margin-top: 10px;
	margin-bottom: 10px; }
	
.ContactRegistrationBox input {
	margin-top: 10px;
	margin-bottom: 10px; }
	
.ContactRegistrationBox h4 {
  font-weight: bold;
  font-size: 16px;
  color: #40474F; }
	
.ContactRegistrationBox .cancelPhoneButton {
	background: #eab813;}

.ContactRegistrationBox .cancelPhoneButton:hover {
	background-color: #FFA200}

.ContactRegistrationBox .cancelPhoneButton:focus {
	background-color: #FFA200}

.ContactRegistrationBox .addPhoneButton {
	background: #eab813;}

.ContactRegistrationBox .addPhoneButton:hover {
	background-color: #FFA200}

.ContactRegistrationBox .addPhoneButton:focus {
	background-color: #FFA200}
	
.Buttons .ButtonsStyle Button { }
  
/* -- KYC / Personal Details -- */
.kycBox .personalDetails .inputLabel {
	width: 50%;
	min-width: 50%; }
	
.kycBox .personalDetails .selectLabel {
	width: 50%;
	min-width: 50%; }

.kycBox h4 {
  font-weight: bold;
  font-size: 16px;
  color: #40474F; }
  
.kycBox .labelContainer p {	
	font-size: 1em; }
	
.kycBox .kycContainer .labelContainer .blueButton {
	background: #eab813; }

.kycBox .kycContainer .labelContainer .blueButton:hover {
	background-color: #FFA200}

.kycBox .kycContainer .labelContainer .blueButton:focus {
	background-color: #FFA200}

	
/* -- Change FATCA / Tax Details -- */
.fatcaDetailsBox .OneColLabel {
	min-width: 15em !important; 
	margin: 0.5em;}
	
.fatcaDetailsBox .labelContainer {
	margin: 0.5em; }
  
/* -- TwoFactorAuthenticationNumbers -- */
.twoFactorAuthenticationBox .activePhones { 
	margin:10px; }
	
.twoFactorAuthenticationBox input[type="radio"] {
	margin-right:10px; }	
  
/* -- External Accounts -- */ 
.gvExternalAccountsType {
	text-align:left; }
.gvExternalAccountsTypeHeader {
	text-align:left; }
.gvExternalAccountsAccount {
	text-align:left; }
.gvExternalAccountsAccountHeader {
	text-align:left; }
.gvExternalAccountsRollNumber {
	text-align:left; }
.gvExternalAccountsRollNumberHeader {
	text-align:left; }
.gvExternalAccountsBank {
	text-align:left; }
.gvExternalAccountsBankHeader {
	text-align:left; }   
.gvExternalAccountsStartDate {
	text-align:left; }
.gvExternalAccountsStartDateHeader {
	text-align:left; }

.externalAccountBox .blueButton {
	line-height: 15px;
	margin-bottom: 0px;}

.externalAccountBox h4 {
  font-weight: bold;
  font-size: 16px;
  color: #40474F; }

.externalAccountBox .blueButton {
	background: #eab813;}

.externalAccountBox .blueButton:hover {
	background-color: #FFA200}

.externalAccountBox .blueButton:focus {
	background-color: #FFA200}

/* -- Change Interest Method -- */
.InterestMethodBox label {
	width:35% !important; }
	
.InterestMethodBox input:disabled {
	border-color: #F6F6F6;
	background-color: #F6F6F6; }

.InterestMethodBox .labelContainer p {	
	font-size: 1em; }

/* -- Account Listing -- */
.gvAccountListingAcctNumber,
.gvAccountListingAcctNumberHeader {
  overflow: hidden;
  -ms-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis; }

.gvAccountListingSortNumber,
.gvAccountListingSortNumberHeader {
  overflow: hidden;
  -ms-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis; }

.gvAccountListingAcctTitle,
.gvAccountListingAcctTitleHeader {
  overflow: hidden;
  -ms-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  max-width: 125px; }

.gvAccountListingProductNameHeader,
.gvAccountListingProductName {
  overflow: hidden;
  -ms-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  max-width: 125px; }

.gvAccountListingRateHeader,
.gvAccountListingRate {
  overflow: hidden;
  -ms-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  text-align: right; }

.gvAccountListingBalance,
.gvAccountListingBalanceHeader {
  overflow: hidden;
  -ms-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  text-align: right;
  max-width: 80px; }

.gvAccountListingBaseBalance,
.gvAccountListingBaseBalanceHeader {
  overflow: hidden;
  -ms-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  text-align: right;
  max-width: 70px; }

/*#endregion*/
/*#region *************** TYPOGRAPHY & TEXT *************** */
h1 {
  padding: 0 0 10px 0;
  margin: 0;
  color: #3ca7e3;
  width: auto;
  font-size: 30px;
  font-size: 2.4em;
  font-weight: bold;
  text-transform: lowercase; }
  
h1::first-letter {
	text-transform: capitalize;
}
  

h1 span {
  font-family: inherit; }

h2 {
  font-weight: bold;
  font-size: 22px;
  color: #40474F; }

h3 {
  font-size: 20px;
  color: #40474F; }

h4 {
  font-size: 18px;
  color: #40474F;
  color: #003c65;
  text-transform: lowercase; }
 
h4::first-letter {
	text-transform: capitalize;
}

p {
  padding: 1em 0;
  color: #40474F; }

a {
  color: #40474F;
  text-decoration: none; }

a:hover,
a:focus {
  color: #434343;
  text-decoration: underline; }
  

/*#endregion*/
/*#region *************** INPUTS & BUTTONS *************** */
input {
  margin-bottom: 3px;
  padding: 6px;
  font-size: 1em;
  display: inline-block;
  padding: .4em;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: 2px solid #ECECED;
  outline: none;
  outline-offset: 0; }

select {
  font-size: 0.9em;
  display: inline-block;
  padding: .4em;
  -moz-transition: .3s background;
  -o-transition: .3s background;
  -webkit-transition: .3s background;
  transition: .3s background;
  border: 2px solid #ECECED;
  outline: none;
  outline-offset: 0; }
  select.inputError {
    border: 2px solid tomato;
    outline: none;
    outline-offset: 0px; }
  select:focus, select:active {
    outline-width: thin;
    outline-style: solid;
    outline-color: #3ca7e3;
    outline-offset: 0px; }

input:focus,
input:active {
  outline-width: thin;
  outline-style: solid;
  outline-color: #3ca7e3;
  outline-offset: 0px; }

select:active,
select:focus {
  outline-offset: 0px; }

input[type=number] {
  -moz-appearance: textfield; }

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0; }

div:focus,
div:active {
  outline: none; }

label.selectLabel,
label.inputLabel{
  font-size: 1em;
  text-align: left;
  width: 25%;
  display: inline-block;
  height: 1.4em;
  line-height: 1.4em;
  padding: .5em; }

.RememberMe label,
.divRegistrationInfo label{
    text-align: left;
    width: 25%;
    display: inline-block;
    height: 1.4em;
    line-height: 1.4em;
    padding-left: 0.5em;
}

.outer_information .divRegistrationInfo a {
    text-align: left;
    display: inline;
}

textarea {
    font-family: "AvenirLTStd-Book", Helvetica, Arial, sans-serif;
}

/* ****** Error Validation & stuff */
select.selectInput {
  font-size: 0.9em;
  display: inline-block;
  padding: .4em;
  -moz-transition: .3s background;
  -o-transition: .3s background;
  -webkit-transition: .3s background;
  transition: .3s background;
  border: 2px solid #ECECED;
  outline: none;
  outline-offset: 0; }
  select.selectInput.inputError {
    border: 2px solid tomato;
    outline: none;
    outline-offset: 0px; }

select.centerSelect {
  display: block;
  margin-left: auto;
  margin-right: auto; }

input.inputField {
  /*font-size: 0.9em;*/
  width: calc(100% - 300px);;
  display: inline-block;
  padding: .4em;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: 2px solid #ECECED;
  outline: none;
  outline-offset: 0; }

  .labelContainer input.inputField {
   width: 250px;
 }
 
  input.inputField:disabled {
    background: white;
    color: graytext; }
  input.inputField.inputError {
    border: 2px solid tomato;
    outline: none;
    outline-offset: 0px; }

.inputErrorMessage {
  display: inline-block;
  color: red;
  margin: 0;
  margin-left: 10px;
  font-size: 1.3em;
  padding: 0; }

.FormHeaderError {
	color: red;
	margin-bottom: 20px;
}
  
input.textarea:disabled {
	background-color: #ECECED; }
  	

/* ----------------------------------------------- Buttons ------------------------------------- */
.Buttons{
	display:block;
	width:100%;
	height:45px;
	
}
.submitbutton {
  float: right;
  margin-top: 5px;
  margin-left: 5px;
  cursor: pointer;
  min-width: 150px;
  background-color: #eab813;
  color: #fff;
  border: none;
  font-size: 15px;
  line-height: 21px;
  -moz-transition: 0.5s background;
  -o-transition: 0.5s background;
  -webkit-transition: 0.5s background;
  transition: 0.5s background;
  padding: 6px;
  text-align: center; 
  font-family: "AvenirLTStd-Book", Helvetica, Arial, sans-serif; }

.outer_information .btnLogon {
  float: right;
  cursor: pointer;
  font-size: 15px;
  line-height: 23px;
  width: 150px;
  background-color: #eab813;
  color: #fff;
  border: 0;
  -moz-transition: 0.5s background;
  -o-transition: 0.5s background;
  -webkit-transition: 0.5s background;
  transition: 0.5s background; }

.Buttons .printbutton {
  float: right;
  margin-top: 5px;
  margin-bottom: 5px;
  text-decoration: none; }

a.timeoutContinue {
  float: right;
  cursor: pointer;
  height: 23px;
  width: 150px;
  font-size: 15px;
  background-color: #eab813;
  color: #40474F;
  display: inline-block;
  text-align: center;
  line-height: 23px; }

.Buttons .printbutton:hover,
.outer_information .btnLogon:hover,
.submitbutton:hover,
a.timeoutContinue:hover,
.Buttons .printbutton:focus,
.outer_information .btnLogon:focus,
.submitbutton:focus,
a.timeoutContinue:focus {
  background-color: #FFA200;
  text-decoration: none;
  color: white; }

/* ----------------------------- Secondary Buttons ---------------------------- */
.Buttons .cancelbutton {
  float: left;
  margin-top: 5px;
  cursor: pointer;
  width: 150px;
  font-size: 15px;
  background: #eab813;
  -moz-transition: 0.5s background;
  -o-transition: 0.5s background;
  -webkit-transition: 0.5s background;
  transition: 0.5s background;
  border: none;
  text-align: center;
  line-height: 23px;
  color: #fff;
  padding: 6px; }

.EmailReminderButton {
  margin-bottom: 0.75em;
  margin-top: 0.75em;
  margin-left: 500px;
  cursor: pointer;
  height: 23px;
  width: 150px;
  font-size: 15px;
  background-color: White;
  border: solid 1px #9FA3A7;
  text-align: center;
  line-height: 23px; }

.GroupDropDown {
  padding: 0.2em; }
  .GroupDropDown p {
    display: inline-block; }
  .GroupDropDown .submitbutton {
    float: none;
    margin-left: 10px; }

a.timeoutLogoff {
  cursor: pointer;
  height: 23px;
  width: 150px;
  font-size: 15px;
  background-color: White;
  border: solid 1px #9FA3A7;
  color: #40474F;
  display: inline-block;
  text-align: center;
  line-height: 23px; }

.Buttons .cancelbutton:hover,
.GroupDropDown .submitbutton:hover,
.EmailReminderButton:hover,
a.timeoutLogoff:hover,
.Buttons .cancelbutton:focus,
.GroupDropDown .submitbutton:focus .EmailReminderButton:focus,
a.timeoutLogoff:focus {
  background-color: #FFA200;
  color: White;
  text-decoration: none; }

.cancelPhoneButton {
	background-color: #3ca7e3;
	font-size: 15px;
	line-height: 16px;
	padding: 3px 10px;
	color: #fff;
	display: inline-block;
}

.cancelPhoneButton:hover,
.cancelPhoneButton:focus {
  text-decoration: none;
  background-color: #3ca7e3;
  color: #fff; }

.addPhoneButton {
  cursor: pointer;
  background-color: #3ca7e3;
  color: #fff;
  border: 0;
  font-size: 15px;
  padding: 3px 10px; }

.blueButton {
  display: inline-block;
  background: #3ca7e3;
  font-size: 15px;
  line-height: 16px;
  padding: 3px 10px !important;
  color: white;
  width: unset !important;
  min-width: 150px;
  border: none;
  -moz-transition: 0.3s background;
  -o-transition: 0.3s background;
  -webkit-transition: 0.3s background;
  transition: 0.3s background; }

.blueButton:hover,
.blueButton:focus {
  cursor: pointer;
  background: #3ca7e3; }

.pafButton {
  margin-left: 2em; }

/* ------------------------------------- Boxes ----------------------------------------*/
/*#endregion*/
.NoticeBoard,
.SelectTransactionsBox,
.SelectStatementBox,
.SystemErrorBox,
.informationbox,
.EmailRegistrationBox,
.AccountSearchBox,
.manageGroupsBox,
.SecureMessageBox,
.TransactionSummaryBox,
.SecureMessagingNotificationBox,
.SecureMessagingReadBox,
.ContactRegistrationBox,
.twoFactorAuthenticationBox,
.kycBox,
.NominatedAccountBox,
.paperStatementBox,
.externalAccountBox,
.fatcaDetailsBox,
.ApplicationTypeBox {
    background-color: #ECECED;
    padding: 20px 2.5%;
    margin-bottom: 1em;
    display: inline-block;
    width: 100%;
}
  
.paperStatementBox {
	margin-top:3em;
}
  
.EmailRegistrationBox #logon {
  clear: both;
  margin: 0 auto;
  font-size: .9em;
  text-align: center;
  width: 70%; }

.timeoutMessage {
  background-color: #ECECED;
  padding: 2px 2.5%;
  margin-bottom: 1em;
  display: inline-block;
  border: solid thin #575757;
  width: 95%; }

div.TimeoutWarning {
  background-color: white;
  position: relative;
  width: 500px;
  margin: 200px auto;
  padding: 20px; }

.TimeoutFloat {
  position: absolute;
  z-index: 200;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  display: none; }

p.timeoutMessage {
  background-color: #ECECED;
  padding: 20px 2.5%;
  margin-bottom: 1em;
  display: inline-block;
  border: solid thin #575757;
  width: 95%; }

div.TimeoutBackground {
  background-color: gray;
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
  z-index: 100;
  position: absolute;
  display: none;
  filter: alpha(opacity=70);
  opacity: 0.7; }

.PaymentDetailBox,
.AccountNameBox,
.StatementOrderBox,
.InternalTransferBox,
.NominatedAccountBox,
.InterestMethodBox {
  background: #DDDDDD;
  margin-bottom: 1em;
}

.PaymentDetailBox .labelContainer,
.AccountNameBox .labelContainer,
.StatementOrderBox .labelContainer,
.InternalTransferBox .labelContainer,
.InterestMethodBox .labelContainer
{
  margin: 0px 0;
  background-color: #F6F6F6; }

.PaymentDetailBox .labelContainer:nth-of-type(even),
.AccountNameBox .labelContainer:nth-of-type(even),
.StatementOrderBox .labelContainer:nth-of-type(even),
.InternalTransferBox .labelContainer:nth-of-type(even),
.InterestMethodBox .labelContainer:nth-of-type(even){
  background-color: #E1E1E1; }

.PaymentDetailBox .labelContainer:nth-of-type(odd),
.AccountNameBox .labelContainer:nth-of-type(odd),
.StatementOrderBox .labelContainer:nth-of-type(odd),
.InternalTransferBox .labelContainer:nth-of-type(odd),
.InterestMethodBox .labelContainer:nth-of-type(odd){
  background-color: #F6F6F6; }

.labelContainer {
  display: inline-block;
  width: 100%;
  padding: 6px 2.5%; }	

.labelContainerError input,
.labelContainerError select {
  outline-style: solid;
  outline-width: 3px;
  outline-color: #B93939; }

.MainLabel {
  width: 150px;
  display: inline-block;
  text-align: right;
  margin-right: 15px; }

.AccountSearchBox .labelContainer {
  padding: 0; }

.FormHeader {
  display: block;
  padding: 1em 0;
  color: #40474F;
  font-size: 12.8px; }

.FormHeader .headerStyle h4{
  display: block;
  padding: 1em 0;
  color: #40474F;
  font-size: 12.8px;}
/*------------------------------  Links ----------------------------------------------*/
a.DisabledLink {
  opacity: 0.30; }

a.DisabledLink:hover,
a.DisabledLink:focus,
a.DisabledLink:active {
  text-decoration: none;
  color: #40474F;
  cursor: default; }

a:active a:focus {
  text-decoration: underline;
  color: #8E9392; }

.MainLabelCalendarLink {
  font-size: 0.85em;
  margin-left: 290px; }

p.MainLabelCalendarLink {
  padding: 0;
  opacity: 0.30;
  cursor: default; }

/* ---------------------------------------------------------- Secure Messaging ----------------------------------------------- */
.secureMessageLabel {
  display: block;
  font-size: 1.2em; }

.secureMessageInput {
  width: 100%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 6px;
  font-size: 1.1em;
  margin-bottom: 1em; }

.txtSecureMessage {
  min-height: 150px;
  resize: vertical; }

.txtSecureMessageReply {
  width: 100%;
  height: 125px;
  resize: none;
  margin-bottom: 1em; }

.txtSecureMessageReplyTo {
  width: 100%;
  height: 125px;
  resize: none;
  margin-bottom: 1em; }

.txtSecureMessageReplyTo {
  font-size: 1em; }

.txtSecureMessageReply {
  font-size: 1em; }

.txtSecureMessageSubject {
  width: 100%;
  resize: none;
  margin-bottom: 1em; }

.secureMessageReplySubjectLabel,
.secureMessageReplyLabel,
.secureMessageLabel,
.secureMessageReplyToLabel {
  font-weight: bold; }

/*#region ************* COOKIE WARNING BANNER ************* */
.CookieBanner {
  width: 100%;
  top: 0;
  height: 6em;
  background-color: #575757; }

.CookieMessage {
  width: 900px;
  margin: 0 auto 0 auto; }

.CookieMessage p {
  color: White;
  padding-top: 1em;
  width: 700px;
  display: inline-block; }

.CookieMessage input {
  display: block;
  color: White;
  background: none;
  border: none;
  font-weight: bolder;
  cursor: pointer;
  margin-left: 840px;
  margin-top: -40px; }

.CookieMessage a {
  color: White; }

/*#endregion*/
/*#region DATE PICKER */
.datepickerstyle th {
  color: white;
  border: 0; }

.datepicker_todaydaystyle {
  color: #40474F;
  background-color: #FEBD11; }

.datepicker_selectorstyle {
  background-color: #FFCC66; }

.datepicker_nextprevstyle {
  background-color: #40474F;
  color: White; }

.datepicker_dayheaderstyle {
  height: 1px;
  background-color: #40474F; }

.datepicker_invaliddatestyle {
  color: GrayText; }

.datepicker_selecteddaystyle {
  background-color: #40474F; }

.datepicker_titlestyle {
  font-weight: bold;
  color: White;
  background-color: #40474F; }

.datepicker_othermonthdaystyle {
  background-color: #E1E1E1; }

.datepickerstyle {
  font-size: 1em; }

.datepickerstyle a:visited,
.datepickerstyle a:link {
  color: Black;
  text-decoration: none; }

.datepickerstyle a:hover,
.datepickerstyle a:active {
  color: #8E9392;
  text-decoration: none; }

/*#endregion*/
/* NAVIGATION BAR */
.demolink {
  margin-top: 10px;
  margin-bottom: 7px;
  margin-left: 5px;
  font-weight: normal;
  text-decoration: underline;
  float: none; }

.demolink a:visited,
.demolink a:link {
  color: White;
  text-decoration: none;
  background-color: #00CCEE; }

.applylink {
  margin-top: 3px;
  margin-bottom: 7px;
  margin-left: 5px;
  font-weight: normal;
  text-decoration: underline;
  float: none; }

.applylink a:visited,
.applylink a:link {
  color: White;
  text-decoration: none;
  background-color: #00CCEE; }

.helplink {
  margin-top: 3px;
  margin-bottom: 7px;
  margin-left: 5px;
  font-weight: normal;
  text-decoration: underline;
  float: none; }

.helplink a:visited,
.helplink a:link {
  color: White;
  text-decoration: none;
  background-color: #00CCEE; }

.faqslink {
  margin-top: 10px;
  margin-bottom: 7px;
  margin-left: 5px;
  font-weight: normal;
  text-decoration: underline;
  float: none; }

.faqslink a:visited,
.faqslink a:link {
  color: White;
  text-decoration: none;
  background-color: #00CCEE; }

.linkseparator {
  margin-top: 3px;
  margin-bottom: 7px;
  margin-left: 5px;
  font-weight: bold;
  float: none;
  color: White; }

.threecollinks {
  background-color: #385E9D;
  width: 155px;
  height: 20px;
  border-top-style: solid;
  border-top-color: #385E9D;
  border-top-width: 3px; }

.threecollinks2 {
  background-color: #385E9D;
  width: 155px;
  height: 20px;
  border-top-style: solid;
  border-top-color: #385E9D;
  border-top-width: 3px; }

.threecolseparator {
  background-color: White;
  height: 5px; }

.menuItem {
  background-color: #B7CFE9;
  color: black;
  padding: 2px;
  width: 200px;
  border-top: outset 1px #000066; }

#btn_submit {
  font-weight: bold; }

.RegisterEmailAddress {
  float: right;
  text-align: right;
  font-size: 1em;
  color: Black;
  margin-top: -35px; }

.CustomerDetailsLabel {
  width: 80px;
  font-weight: bold;
  color: Black;
  display: inline-block; }

.CustomerDetailsLabelRight {
  float: right;
  width: 60px;
  font-weight: bold;
  color: Black; }

.CustomerDetailsRight {
  color: Black;
  margin-right: 120px;
  float: right;
  width: 120px; }

.textBox {
  width: 150px;
  padding: 0 0 0 0;
  margin-top: -2px; }

.lblAuthority {
  text-align: left;
  font-weight: bold;
  color: #333333; }

img#banner_background {
  float: left; }

.outer_information_1col {
  margin: 0 0 0 0;
  height: 140px;
  width: auto; }

.outer_information {
  margin: 0 0 0 0; }

.outer_information .submitbutton {
  float: right; }

.divForgottenPassword {
  margin-top: 5px;
  display: inline-block;
  float: right;
  clear: both; }

.lnkForgottenPassword {
  clear: both; }

.informationHeader {
  color: #40474F; }

.informationbox label {
  float: left;
  width: 250px;
  margin-right: 10px;
  text-align: left;
  vertical-align: bottom;
  margin-left: 10px;
  color: #40474F; }

.informationbox h4 {	
	font-size: 1em;
	text-align: left;
	margin-left: 10px;
}

.informationbox .lblLogon1 {
  width: 180px; }

.labelContainer-3-col label.inputLabel {
  float: none;
  width: auto; }

input.inputField:active,
input.inputField:focus,
select.selectInput:active,
select.selectInput:focus {
  border: 2px solid #3ca7e3; }

.informationbox input[type=checkbox] {
  width: initial; }

.informationbox input.date_two_fig {
  width: 25px; }

.informationbox input.date_four_fig {
  width: 50px; }

.GridViewPrintFriendly {
  width: 800px;
  padding: 1px 0 1px 0;
  font-size: 0.85em; }

.PendingGridView td {
  border: none;
  white-space: nowrap;
  text-decoration: inherit;
  cursor: pointer; }

.PendingGridViewRowStyle {
  background-color: #EAEAEA;
  color: Black; }

.PendingGridViewAlternatingRowStyle {
  background-color: White;
  color: Black; }

.thecustomerdetails {
  border: solid 1px White;
  margin: 5px 0;
  padding: 5px 0; }

.thecustomerdetails th {
  padding: 3px 5px; }

.thecustomerdetails tr:first-of-type th:first-of-type {
  background: #003c65; }

.thecustomerdetails p {
  border: solid 1px White;
  margin: 5px 0;
  padding: 0;
  color: #40474F; }

/* CUSTOMER HEADER DETAILS*/
#lblcustdetail_Customer {
  margin-right: 10px;
  font-weight: bold; }

#idcustdetail_AccountDetail {
  margin-right: 10px;
  font-weight: bold; }

#lblledgerbalance_AccountDetail {
  margin-right: 10px;
  font-weight: bold; }

#lblavailablebalance_AccountDetail {
  margin-right: 10px;
  font-weight: bold; }

.lblGroup {
  margin-right: 10px;
  font-weight: bold;
  color: #40474F;
  font-size: 1.3em; }

#lblCustomerName {
  margin: 0 0 5px 0; }

#lblCustomer {
  margin-right: 40px;
  border: solid 1px black; }

/*START - Payment Box Details */
br {
  clear: left; }

.txtSortCode,
.txtSortCode2,
.txtSortCode3,
.txtPayEvery {
  width: 18px;
  margin-right: 0; }

.informationbox .txtPAC {
  margin-right: 0;
  width:50px;
  }

.txtAccountNo {
  width: 80px; }

.txttxnAmount {
  width: 120px; }

.txtBeneficiary .txtSerialNo .txtReference {
  width: 120px; }

.ddlFrequency {
  width: 82px;
  margin-bottom: 3px; }

.txtPayeeName {
  width: 250px; }

.txtDDReference {
  width: 250px; }

.lblAsterix {
  vertical-align: super; }

.txtDDAmount {
  width: 80px; }

.ButtonsHeader {
  width: auto;
  margin-bottom: 5px;
}

.Buttons_1col {
  width: auto; }

.lbl_logid {
  font-weight: bold; }

.outer_information a {
  text-align: right;
  display: block;
  margin-top: 7px; }

.TopPrinterFriendlyLinks {
	width: 100%;
	text-align: right;
	margin-bottom: 1em;
}

.TopPrinterFriendlyLinks .printbutton {
  text-decoration: none; }

.ASAPBorder {
  width: 140px;
  padding: 0;
  margin: 0; }

.PaymentDetailSubBox {
  width: 534px;
  background-color: #DDDDDD;
  vertical-align: middle; }

/* Payment - form layout */
.searchBox {
  width: 500px; }

.radioButtons {
  float: left;
  margin: 0 5px 5px 0;
  height: 22px;
  vertical-align: middle;
  line-height: 22px;
  clear: left;
  }

 .radioButtons:first-of-type {
 margin-top: 10px;
}
  

.radioButtons label {
  margin: 0;
  margin-left: 5px;
  vertical-align: middle;
  line-height: 22px;
  height: 22px;
  color: #40474F; }

input[type="radio"] {
  margin-top: 3px;
  vertical-align: middle; }
  
Span.YesSwitch input,
Span.NoSwitch input{
	position: absolute !important;
	clip: rect(0, 0, 0, 0);
	height: 1px;
	width: 1px;
	border: 0;
	overflow: hidden; 
 }
 
Span.YesSwitch label:hover,
Span.NoSwitch label:hover {
	cursor: pointer;
}
Span.YesSwitch input:disabled + label:hover,
Span.NoSwitch input:disabled + label:hover {
	cursor: default;
}
 
 Span.YesSwitch label,
 Span.NoSwitch label{
	display: inline-block;
	width: 60px;
	background-color: #e4e4e4;
	color: rgba(0, 0, 0, 0.6);
	font-size: 14px;
	font-weight: normal;
	text-align: center;
	text-shadow: none;
	padding: 6px 14px;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 0 4px 4px 0;
	border-radius: 0 4px 4px 0;
 }
Span.YesSwitch label{
	border-radius: 4px 0 0 4px;
}
Span.NoSwitch label{  
	border-radius: 0 4px 4px 0;  
}
 
Span.NoSwitch  input:checked + label,
Span.YesSwitch  input:checked + label{
  background-color: #3ca7e3;
  color:white;
}
 
.LeftLabel {
  float: left;
  width: 7.7em;
  text-align: right;
  clear: left;
  margin-right: 2px;
  vertical-align: text-bottom;
  color: Black;
  line-height: 30px; }

.RightLabel {
  float: left;
  width: 7em;
  text-align: right;
  clear: left;
  margin-right: 2px;
  vertical-align: bottom;
  color: Black;
  line-height: 30px; }

.LeftLabelFull {
  float: left;
  width: 9em;
  text-align: right;
  clear: left;
  margin-right: 7px;
  vertical-align: text-bottom;
  color: Black; }

.TransactionSummaryBox .LeftLabelFull {
  margin-top: 8px;
  margin-bottom: 2px; }

.LeftLabelFullTwo {
  float: left;
  width: 30%;
  text-align: right;
  clear: left;
  margin-right: 7px;
  vertical-align: text-bottom;
  color: #434343;
  margin-bottom: 3px;
  line-height: 30px; }

.OneColLabel {
  width: 10em;
  margin-top: 2px;
  float: left;
  clear: left;
  vertical-align: bottom;
  color: #FFFFFF;
  color: Black; }

.RightLabelNarrow {
  float: left;
  text-align: right;
  clear: left;
  margin-right: 15px;
  vertical-align: bottom;
  color: Black;
  line-height: 30px; 
}

.lblPaymentNotice {
  float: right; }

.ColWide {
  width: 60%;
  margin-bottom: 5px;
  margin-right: 15px; }

.ColWideNoBottom {
  width: 60%;
  margin-right: 15px; }

.Col1 {
  display: inline-block;
  padding-bottom: 0.75em;
  width: 50%; }

.UserLimitBox {
  width: 534px;
  background-color: #DDDDDD;
  padding: 20px 10px 20px 10px;
  height: 70px; }

.LeftColumn {
  width: 49%;
  height: auto;
  float: left; }

.RightColumn {
  width: 49%;
  height: auto;
  float: right; }

.UserLimitViewLeftColumn {
  width: 48%;
  height: auto;
  float: left; }

.UserLimitViewRightColumn {
  width: 46%;
  height: auto;
  float: right; }

.UserLimitViewLeftLabel {
  float: left;
  width: 9em;
  text-align: right;
  clear: left;
  margin-right: 2px;
  vertical-align: text-bottom;
  color: Black; }

.UserLimitViewRightLabel {
  float: left;
  width: 5em;
  text-align: right;
  clear: left;
  margin-right: 2px;
  vertical-align: bottom;
  color: Black; }

.ColumnRowDate {
  height: 37px; }

.Col2 {
  width: 50%;
  float: right; }

.Col1Wide {
  width: 60%; }

.Col2Wide {
  width: 60%;
  padding-bottom: 0.75em; }

.Col2Narrow {
  width: 38%;
  float: right; }

.ColFull {
  display: inline-block;
  width: 100%; }

#advOption1 {
  margin-left: 0%;
  float: left; }

#advOption2 {
  margin-left: 20%;
  float: left; }

#advOption3 {
  margin-left: 40%;
  float: left; }

#advOption4 {
  margin-left: 60%;
  float: left; }

#advOption5 {
  margin-left: 80%;
  float: left; }

/* Payment - END form layout */
.txtTrancode,
.txtReasonCode {
  width: 100px; }

.lblSortCode {
  margin: 0;
  padding: 0; }

.lblDateDivider,
.lblDivider {
  margin: 0;
  padding: 0; }

.ddlFrequency {
  margin-bottom: .2em;
  height: 1.5em; }

.txtStationeryNumber {
  width: 50px; }

.txtStationeryName {
  width: 300px; }

.ddlStationeryStyle {
  width: 175px; }

.ddlGroup {
  width: 150px; }

.lblSortCodeDivider {
  vertical-align: text-bottom; }

/* Manage Groups */
.txtNewGroup {
  width: 120px; }

.ddlRemoveGroup,
.ddlDefaultGroup,
.ddlRemoveAccount {
  /*width: 150px;*/ }

.txtGrpAccountNo {
  width: 60px; }

.txtGrpSortCode {
  width: 18px; }

.txtManageGroup {
  width: 175px; }

/*End Manage Groups */
.txtChequeNo {
  width: 65px; }

.txtPayee {
  width: 150px; }

.ddlAccountNo {
  width: 250px; }

.ddlEmailOption {
  width: 350px; }

.txtPendingTransactions {
  width: 40px; }

.divDownloadStatement {
  margin: 5px 0 5px 0;
  padding: 5px 0 5px 0;
  color: #000066;
  width: 555px; }

.txtPassword {
  width: 240px; }

.btnDownloadStatement {
  color: #000066;
  cursor: pointer;
  height: 23px;
  font-size: 1em;
  vertical-align: top;
  width: 30px;
  background-color: #385E9D;
  color: White;
  margin: 0px 1px 1px 1px;
  border-top: 0px;
  border-bottom: 0px;
  border-left: 0px;
  border-right: 0px; }

.divDownloadStatement {
  height: 20px;
  margin-bottom: 6px;
  width: 550px;
  vertical-align: top; }

.ddlDownloadStatementDesc {
  margin-bottom: 6px;
  width: 240px; }

.ddlDownloadStatementType {
  margin-bottom: 6px;
  width: 160px; }

.ddlStopReason {
  margin-bottom: 3px;
  width: 100px; }

.ddlTransactionPeriod, 
.ddlDownloadTransactions,
.ddlCloseReason {
  margin-bottom: 6px;
  width: 175px; }

.formElementTransSelect {
  margin-bottom: 6px; }

.Validate {
  width: 200px; }

.divCheckBox {
  padding: 5px 0 5px 0; }

.lblCheckBox {
  vertical-align: bottom;
  padding: 0 0 5px 0; }

.divPaymentCheckBox {
  margin-top: 3px; }

.tdErrorMessage {
  color: Black;
  font-weight: bold; }

.divRadioButtonsTextBox_Wrapper {
  float: left;
  width: 400;
  height: 25px; }

.divRadioButtonTextBox_Left {
  width: 170px;
  float: left; }

.divRadioButtonTextBox_Right {
  width: 230px;
  float: left; }

.NoTransactionText {
  color: Black; }

.AccountSearchTextBox {
  width: 100px; }

.DateAndTimeBanner {
  margin-top: 10px;
  font-size: 0.8em;
  font-style: italic;
  color: GrayText;
  float: right;
  text-align: right;
  width: 555px;
  clear: both; }

.PrintFriendlyDateAndTimeBanner {
  margin-top: 10px;
  font-size: 0.8em;
  font-style: italic;
  color: GrayText;
  float: right;
  text-align: right;
  width: 800px; }

.Col2NarrowCalendarLink {
  font-size: 0.85em;
  float: right;
  margin-right: 32px;
  text-decoration: none; }

.Col1WideCalendarLink {
  font-size: 0.85em;
  float: right;
  margin-right: 54px;
  text-decoration: none; }

.LeftLabelCalendarLink {
  font-size: 0.85em;
  float: right;
  margin-right: 268px;
  text-decoration: none; }

.RightLabelCalendarLink {
  font-size: 0.85em;
  float: right;
  margin-right: 5px;
  text-decoration: none; }

.Col1CalendarLink {
  font-size: 0.85em;
  float: right;
  margin-right: 28px;
  text-decoration: none; }

.Col2CalendarLink {
  font-size: 0.85em;
  float: right;
  margin-right: 6px;
  text-decoration: none; }

.lblGiveNotice {
  font-size: 0.85em;
  white-space: nowrap;
  margin-left: 170px;
  text-decoration: none;
  border: none;
  position: absolute; }

.lblGiveNotice:hover {
  color: #8E9392; }

#pagewrapper .statementcustname {
  display: none; }

#pagewrapper .statementaccountnumber {
  display: none; }

#printfriendlypagewrapper .statementcustname {
  font-weight: normal; }

#printfriendlypagewrapper .statementaccountnumber {
  font-weight: normal; }

.ddlStationeryQuantity {
  width: 50px; }

.chkLastDay input {
  margin-top: 3px; }

.divDownloadTransactions,
.divTxnType {
  margin-top: 17px; }

.advOptions {
  margin-top: 17px; }

.ddlDownloadStatement {
  float: right;
  display: block;
  margin-bottom: 1em; }

.ddlStatementCycle {
  float: right;
  width: 220px; }

.ddlApplicationType {
	width:301px;
}

.lblExistingEmail {
  font-weight: bold; }

.txtEmailAddress {
  width: 250px; }

.lblEmailAddress {
  float: left;
  text-align: right;
  margin-right: 7px;
  vertical-align: text-bottom; }

.typeAndNumber .txtCurrentPhone {
  width: 184px; }

.ContactRegistrationBox h4 {
  margin: 3px 0; }

.lblAdvOption {
  font-size: x-small; }

.contactGroup,
.phoneGroup {
  margin-bottom: 10px; }

#divAdvOptions {
  width: 92%;
  margin-bottom: 12px;
  float: right;
  text-align: center;
  padding-left: 8%; }

#lblAdvOptionTitme {
  text-align: right; }

.AdvSearchTextBox {
  width: 110px; }

.AdvSearchAmountBox {
  width: 60px; }

#AdvOptCheck {
  float: left; }

.customList {
  background-color: #98FB98;
  /*PaleGreen*/
  font-weight: bold; }

.customListAlt {
  background-color: #F0FFFF;
  /*Azure*/
  font-weight: bold; }

/* --------- Generic Tags ----------------- */
.txtGenericDate {
  width: 175px;
  margin-bottom: 3px; }
  
.txtGenericDateDay {
  width: 45px;
  margin-bottom: 3px; }

.txtGenericDateMonth {
  width: 53px; }

.txtGenericDateYear {
  width: 58px; }

.txtGenericTime {
  width: 54px;
  margin-bottom: 8px; }

.txtTransactiondesc {
  width: 350px; }

.txtGenericUser {
  width: 176px; }

.SelectBox {
  width: 39%;
  height: 300px;
  margin: 10px 0px;
  display: inline-block;
  position: relative; }

#SelectBoxCol3 {
  width: 20%;
  text-align: center;
  vertical-align: top;
  margin-top: 100px;
  display: inline-block;
  position: relative; }

.SelectButton {
  float: none;
  margin-top: 5px;
  color: White;
  cursor: pointer;
  padding: 1px 1px 1px 1px;
  height: 23px;
  width: 100px;
  font-size: 1em;
  background-color: #385E9D;
  border-top: 0px;
  border-bottom: 0px;
  border-left: 0px;
  border-right: 0px; }

.divCentre {
  display: block;
  margin-left: auto;
  margin-right: auto; }

.CustomFormat {
  width: 300px; }

.ui-tooltip {
  font-size: 0.8em;
  border-color: #40474F;
  box-shadow: none; }

.tooltip {
  display: none;
  position: absolute;
  border: 1px solid #333;
  background-color: #161616;
  padding: 10px;
  color: #fff;
  font-size: 12px Arial; }

.UserLimitsGridView,
.EmailReminderGridView {
  width: 555px;
  padding: 1px 0 1px 0;
  font-size: 1em; }

.UserLimitGridViewRowStyle,
.EmailReminderGridViewRowStyle {
  background-color: #EAEAEA;
  color: Black;
  height: 30px; }

.UserLimitGridViewAlternatingRowStyle,
.EmailReminderGridViewAlternatingRowStyle {
  background-color: White;
  color: Black;
  height: 30px; }

.tblUserLimits,
.tblEmailReminder {
  border-collapse: collapse;
  width: 555px;
  font-size: 1em; }

.tblUserLimits th,
.tblEmailReminder th {
  border: none;
  white-space: normal;
  font-size: 1em;
  height: 30px; }

.tblUserLimits tr,
.tblEmailReminder tr {
  border: none;
  font-size: 1em; }

.tblUserLimits td,
.tblEmailReminder td {
  border: none;
  white-space: normal;
  font-size: 1em;
  padding: 0 2px 0 2px; }

.ui-tooltip {
  background-color: #FFFFFF;
  border-width: 3px;
  border-color: #40474F;
  border-style: solid;
  font-size: 1em;
  padding: 8px;
  position: absolute;
  z-index: 9999;
  max-width: 300px; }

.ToolTipImage {
  text-align: center;
  margin: 0 auto;
  margin-left: 3px; }

.ToolTipImageColumnRow {
  text-align: center;
  margin: 0 auto;
  margin-left: 0px; }

.ToolTipImageLeft {
  text-align: center;
  margin: 0 auto;
  margin-left: 3px; }

.ToolTipImageLeftColumnRow {
  text-align: center;
  margin: 0 auto;
  margin-left: 0px; }

.ToolTipHeader {
  font-weight: bold;
  text-decoration: underline; }

.ToolTipTable {
  width: 100%; }

.ToolTipTableHeader {
  font-weight: bold;
  width: 150px; }

.ToolTipTableHeaderShort {
  font-weight: bold;
  width: 75px; }

.ToolTipTableHeaderLong {
  font-weight: bold;
  width: 200px; }

.formatListBox {
  height: 90%;
  width: 100%; }

.divFormatListForm_Wrapper {
  margin-bottom: 1em; }

.AdvSearchTextBoxLarge {
  width: 160px; }

.AdvancedFormatFields {
  margin: 2em 0;
  width: 534px;
  background-color: #DDDDDD;
  padding: 20px 10px 20px 10px; }

.AdvancedFormatFields .ColFull .Col2 {
  padding-bottom: .75em; }

.PasswordLink {
    text-decoration: underline;
    color: #3ca7e3;
}

/* --------- Generic Tags End ----------- */

/* --------- Calendar Styling ----------- */

.ui-widget-header 
{
	background-color: #3ca7e3;
	background: linear-gradient(#0083b2, #3ca7e3);
}

.ui-datepicker-title
{
	color: White;
}

.ui-widget-content .ui-state-default
{
	background-color: White;
	border:none;
}

.ui-datepicker tr{
	border-bottom-style:solid;
	border-bottom-color:#DAEEFA;
	border-bottom-width:2px;
	height:25px;
	vertical-align:middle;
}

.ui-widget-content .ui-state-default.ui-state-active
{
	background-color: #003c65;
	color: White;
	border:none;
}

.ui-datepicker th
{
	width:25px;
}



/* --------- Calendar Styling End ----------- */

.paperStatementBox ul{
	margin-top:1em;
}

.paperStatementBox li{
	margin-top:0.2em;
}

.UserLimitTransactionLimit {
  font-weight: bolder;
  text-decoration: underline; }

.EmailReminderDisclaimerList {
  width: 5%;
  vertical-align: top;
  padding-left: 10px;
  text-align: right; }

h2.small {
  font-size: 100%;
  font-weight: bold; }

table.ThreeColMasterText3 {
  float: right;
  margin-right: 25px;
  margin-top: 25px; }

h2.logonDetails {
  font-size: 100%;
  padding: 5px; }

div.HiddenSkipTo
{
	float: left;
	margin-top: -30px;
	margin-left: 20px;	
}


div.HiddenSkipTo a {
  margin: 0 5px;
  font-weight: bold;
  z-index: -100;
  position: absolute;
  color: black; }

div.HiddenSkipTo a:active,
div.HiddenSkipTo a:focus {
  z-index: 50;
  margin-top: 175px;
  color: black;
 }

p.paymentWarning {
  color: #B93939;
  margin-bottom: 1em; }

caption {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden; }

.hide {
  display: none; }

/* hiding content from users but not screen readers */
.offscreen {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden; }
  
/* hiding content from users but not screen readers */
.DualAuthority span.offscreen {
  position: relative;
  left: 0;
  top: auto;
  width: auto;
  height: auto;
  overflow: inherit;
  display:inline-block; }
  
/* hiding content from users but not screen readers */
.DualAuthority span {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden; }


.txtSortCode {
  width: 60px; }

.inputWarning {
  display: none;
  color: #B93939;
  width: 200px;
  padding: 0;
  margin-left: 440px;
  margin-top: -20px;
  margin-bottom: 3px; }

#email .inputWarning,
.phoneGroup .inputWarning {
  margin-left: 430px; }

label.formLowerLabel {
  padding: 10px 0px;
  display: block;
  font-weight: bold; }

.manageGroupsBox .labelContainer,
.AccountSearchBox .labelContainer {
  margin-left: 0px; }

.manageGroupsBox .labelContainer input {
  /*display: none;*/ }

.manageGroupsBox .labelContainer label {
  /*display: none;*/ }

.manageGroupsBox .labelContainer {
  margin-bottom: 0px;
  padding: 0px 2px; }

.TransactionSummaryGroup {
  display: block;
  margin-bottom: 1em; }

.lblFormattedDownload {
  width: 75px;
  display: inline-block;
  margin-right: 10px; }

.NestedMessage {
  margin-left: 50px;
  margin-top: 2em; }

.divLastDayNEW {
  display: inline-block;
  width: 100%; }

.LogonFAQ {
  margin-bottom: 2em;
  margin-top: 1em;
  width: 100%;
  display: inline-block; }

.LogonFAQ a {
  float: right;
  font-weight: bold;
  color: #385E9D; }

.sortColumnDropDown {
  width: 160px; }

.sortOrderDropDown {
  width: 100px;
  margin-bottom: 1em; }

.AccountSearchBox .labelContainer .ddlGroup {
  margin-bottom: 3px; }

.LoginFieldContainer,
.RememberMe,
.divRegistrationInfo {
    display: block;
    padding: 3px 0;
    margin-bottom: 2px;
    margin-top:10px;
}

div .divRegistrationInfo {
    margin-bottom: 20px;
}

.LoginFieldContainer .inputWarning {
    float: right;
    margin-top: -32px;
    width: 200px;
    margin-right: 50px;
}

/* ////////////////////////////////////////////
// /////// Loyalty ////////////////////////////
// //////////////////////////////////////////*/
.loyaltyMessage {
  max-width: 60%; }

.loyaltyButtons {
  float: right;
  margin-top: -50px; }

.addLoyalty {
  background: #3ca7e3;
  color: #fff;
  font-size: 20px;
  border: 1px solid white;
  padding: 5px 10px;
  cursor: pointer; }

.approveLoyalty {
  background: springgreen; }

.rejectLoyalty {
  background: tomato; }

#addLoyaltyFullContainer,
#loyaltyHelpFullContainer {
  position: absolute;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.7); }

#addLoyaltyContainer,
#loyaltyHelpContainer {
  position: absolute;
  top: 50%;
  left: 50%;
  -moz-transform: translate3d(-50%, -50%, 0);
  -ms-transform: translate3d(-50%, -50%, 0);
  -o-transform: translate3d(-50%, -50%, 0);
  -webkit-transform: translate3d(-50%, -50%, 0);
  transform: translate3d(-50%, -50%, 0);
  min-width: 30vw;
  min-height: 40vh;
  padding: 1% 3%;
  border-radius: 5px;
  background: white; }

.loyaltyButtonWrap {
    display:block;
    height:30px;
}

#addLoyaltyContainer .close {
    width: 50px;
    height: 50px;
    overflow: hidden;
}

#addLoyaltyContainer .close:hover {
  cursor: pointer; }

#addLoyaltyContainer .close::before,
#addLoyaltyContainer .close::after {
  content: '';
  position: absolute;
  height: 5px;
  width: 20px;
  top: -10px;
  right: 5px;
  margin-top: 25px;
  background: #000; }

#addLoyaltyContainer .close::before {
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg); }

#addLoyaltyContainer .close::after {
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg); }

#addLoyaltyContainer .close:hover::before,
#addLoyaltyContainer .close:hover::after {
  background: tomato; }

#addLoyaltyContainer .insertLoyalty,
#addLoyaltyContainer .cancelLoyalty {
  bottom: 20px;
  background: #3ca7e3;
  color: #fff;
  font-size: 20px;
  border: 1px solid white;
  padding: 5px 10px;
  cursor: pointer; }

#addLoyaltyContainer .remainderDesc {
  display: inline-block;
  font-size: 1.4em;
  font-weight:bold;
  margin-bottom:20px;
}

#addLoyaltyContainer .loyaltyHelp {
  font-size: 14px;
  color: #F07D00;
  text-align: center; }

#addLoyaltyContainer .insertLoyalty {
  right: 20px; 
  float:right;
}

#addLoyaltyContainer .cancelLoyalty {
  left: 20px;
  background: #3ca7e3;
  opacity: 0.7;
  -moz-transition: 0.3s opacity;
  -o-transition: 0.3s opacity;
  -webkit-transition: 0.3s opacity;
  transition: 0.3s opacity; }

#addLoyaltyContainer .cancelLoyalty:hover,
#addLoyaltyContainer .cancelLoyalty:focus {
  opacity: 1; }

#addLoyaltyContainer h2 {
  color: #3ca7e3;
  font-size: 30px;
  margin-top: 10px;
  margin-bottom: 20px; }

#addLoyaltyContainer .loyaltyError {
  text-align: center;
  color: tomato; }

#addLoyaltyContainer .loyaltyFieldContainer {
    margin: 12px auto;
    font-size: 16px;
    text-align: center;
    overflow: auto;
    margin-bottom: 20px;
    background-color: #ECECED;
    padding: 20px 2.5%;
    display: inline-block;
    width: 100%;
}

#addLoyaltyContainer .loyaltyFieldContainer .loyaltyLabel {
  float: left;
  line-height: 28px; }

#addLoyaltyContainer .loyaltyFieldContainer .loyaltyInput {
  font-size: 18px;
  border: 1px solid rgba(67, 67, 67, 0.9);
  float: right; }

#dibButtonContainer {
    position:fixed;
    padding:20px;
    height:70px;
    bottom:0;
    width:100%;
    left:0;
}

.pendingMatInsRow {
    font-style: italic;
    color: #B93939;
}

.pendingMatInsRow:hover {
  text-decoration: none;
  color: #B93939; }

.pendingApprovableMatInsRow {
  font-style: italic;
  color: darkgreen; }

.pendingApprovableMatInsRow:hover {
  text-decoration: none;
  color: darkgreen; }

.pendingCancellationMatInsRow {
  font-style: italic;
  color: orange; }

.pendingCancellationMatInsRow:hover {
  text-decoration: none;
  color: orange; }

.pendingCancellationStrikeMatInsRow {
  text-decoration: line-through; }

.pendingCancellationStrikeMatInsRow:hover {
  cursor: default;
  text-decoration: line-through; }

#addLoyaltyContainer .loyaltyInput option {
  color: white; }

#addLoyaltyContainer .loyaltyInput option:disabled {
  color: grey; }

#addLoyaltyFullContainer.hidden,
#addLoyaltyFullContainer .hidden,
#loyaltyHelpFullContainer.hidden,
#loyaltyHelpFullContainer .hidden {
  display: none; }

.PasswordStrength {
  display: block;
  width: 35%;
  height: 10px;
  margin-top: 5px;
  margin-left: 130px;
  background-color: RGB(245, 245, 245); }

.ProgressBar {
  position: relative;
  height: 100%;
  border-radius: 5px; }

.passwordWeak {
  background: red;
  background: linear-gradient(to right, red); }

.passwordOk {
  background: linear-gradient(to right, red, yellow); }

.passwordStrong {
  background: linear-gradient(to right, red, yellow, green); }

.paperStmtAddress {
  position: relative;
  left: 1em;
  margin-bottom: 1em; }
 
.kycBox .kycContainer .pafContainer span {
	margin-left: 30px; }

.customDialog {
  border-radius: 0; }

.customDialog .ui-dialog-titlebar-close {
  display: none; }

.customDialog .ui-dialog-titlebar {
  display: none; }

.customDialog .ui-dialog-content {
  text-align: center;
  font-size: 1.2em; }

.customDialog .ui-dialog-buttonpane .ui-dialog-buttonset {
  float: none; }

.customDialog .ui-dialog-buttonpane {
  padding: .3em 1em .5em 1em; }

.customDialog .ui-dialog-buttonset button {
  background: #FFA200;
  color: white;
  border-radius: 0; }

.customDialog .ui-dialog-buttonset button:first-of-type {
  float: right; }

.customDialog .ui-dialog-buttonset button:last-of-type {
  float: left; }

.GridView  tr.GridViewRowStyle.failure,
.GridView  tr.GridViewAlternatingRowStyle.failure {
  color: red; }

.hidden {
  display: none !important; }
  
.localisedHidden {
  display: none; }

.clearfix {
  clear: both; }

.loyaltyFullPageContainer {
    display:none;
}

.lineHeightIncreased {
	line-height: 1.4em;
}

.wid200 {
	width: 200px;
}

/*#region *************** MEDIUM PAGE LAYOUT ****************/
@media (max-width: 1400px) {
    #pagewrapper {
    width: 95%; } }

/*#region *************** SMALL PAGE LAYOUT ****************/
/*@media only (max-width: 600px), (-webkit-min-device-pixel-ratio: 2) {

	#bannerwrapper {
		display: none;
	}

	#pagewrapper {
		width: 100%;
		min-width: unset;
		margin-right: auto;
		margin-left: auto;
	}

	#maincontent_2col {
		width: 95%;
		height: auto;
		float: none;
		margin: 0 auto;
		position: relative;
		top: 8vh;
		z-index: 1;
	}

	.Navigation {
		width: 100%;
		float: none;
		margin: 0;

		.menuBar {
			display: block;
			position: absolute;
			top: 0;
			height: 8%;
			width: 100%;
			background: $stb-darkBlue;

			.logo {
				float: left;
				margin-left: 10px;
				content: 'Antioch Investment';
				h3 {
					color: white;
					font-size: 2em;
					line-height: 6vh;
				}
			}

			#mobileLogOff {
				float: right;
				a {
					color: $white;
					margin-right: 20px;
					font-size: 1.2em;
					line-height: 6vh;
				}

			}

			#menuIcon {
				float: right;
				width: 60px;
				height: 80%;
				-moz-transform: rotate(0deg);
				-ms-transform: rotate(0deg);
				-o-transform: rotate(0deg);
				-webkit-transform: rotate(0deg);
				transform: rotate(0deg);
				-moz-transition: .5s ease-in-out;
				-o-transition: .5s ease-in-out;
				-webkit-transition: .5s ease-in-out;
				transition: .5s ease-in-out;
				cursor: pointer;
				margin-top: .6vh;
				margin-right: .6vh;

				span {
					display: block;
					position: absolute;
					height: 20%;
					width: 100%;
					background: #fff;
					border-radius: 9px;
					opacity: 1;
					left: 0;
					-moz-transform: rotate(0deg);
					-ms-transform: rotate(0deg);
					-o-transform: rotate(0deg);
					-webkit-transform: rotate(0deg);
					transform: rotate(0deg);
					-moz-transition: .25s ease-in-out;
					-o-transition: .25s ease-in-out;
					-webkit-transition: .25s ease-in-out;
					transition: .25s ease-in-out;

					&:nth-child(1) {
						top: 0%;
					}

					&:nth-child(2) {
						top: 40%;
					}

					&:nth-child(3) {
						top: 80%;
					}
				}

				&.open {
					span:nth-child(1) {
						top: 18px;
						-moz-transform: rotate(135deg);
						-ms-transform: rotate(135deg);
						-o-transform: rotate(135deg);
						-webkit-transform: rotate(135deg);
						transform: rotate(135deg);
					}

					span:nth-child(2) {
						opacity: 0;
						left: -60px;
					}

					span:nth-child(3) {
						top: 18px;
						-moz-transform: rotate(-135deg);
						-ms-transform: rotate(-135deg);
						-o-transform: rotate(-135deg);
						-webkit-transform: rotate(-135deg);
						transform: rotate(-135deg);
					}
				}
			}

			.clearfix {
				clear: both;
			}
		}

		#LeftMenu {
			position: absolute;
			top: 6%;
			left: -100%;
			width: 100%;
			height: 94%;
			z-index: 99;
			background: $stb-darkBlue;
		}

		ul {
			position: relative;
			list-style-type: none;
			margin-left: 0;

			li {
				position: relative;
				margin: 0;
				color: rgb(255, 255, 255);

				&.TopTier {
					font-size: 30px;
					font-size: 2em;
					position: relative;
					line-height: 9rem;
					padding: 0;
					font-size: 3.5em;
					text-align: center;
					background-color: $stb-Blue;
					background: linear-gradient($stb-Blue, #0281ae);
					clear: both;
					margin: 0 !important;
					-moz-transition: background-color 0.3s;
					-o-transition: background-color 0.3s;
					-webkit-transition: background-color 0.3s;
					transition: background-color 0.3s;
					border-bottom: 2px solid $grey;

					&:last-of-type {
						border-bottom: none;
					}

					&:hover {
						background: #0078a3;
					}

					a {
						color: #fff;
						clear: both;
					}
				}

				&.TopTierSelected {
					background: #003c65;

					&:hover, &:active, &:focus {
						background: #003c65;
					}

					ul {
						background: #DAEEFA;
						float: none;
						margin: 0;
						width: inherit;
						width: 100%;
						padding: 6px 10px;
						-moz-box-sizing: border-box;
						-webkit-box-sizing: border-box;
						box-sizing: border-box;
						position: relative;

						&.secondTierSelected {
							margin: 0;

							a {
								color: $grey;

								&:hover {
									text-decoration: none !important;
								}
							}
						}
					}
				}

				&.SecondTier {
					display: none;
					margin-left: 20px;
					font-weight: normal;
					font-size: 0.8em;
					line-height: 1.4em;
					color: #434343;
					position: absolute;

					a {
						color: $grey;
					}

						a:before {
							content: "";
							color: $stb-Blue;
						}
				}

				&.TopTierDisabled {
					opacity: 0.3;

					&:hover,
					&:focus,
					&:active {
						color: #fff;
						text-decoration: none;
						cursor: default;
					}
				}
			}
		}
	}

	.thecustomerdetails {
		width: 80%;
		display: block;
		margin: 0 auto;

		tr {
			font-size: 1.4em;
			line-height: 1.6em;
		}
	}

	.GridView {

		tbody > tr {
			display: block;
			margin-bottom: 2rem;
		}

	tr {
		font-size: 1.4em;
		line-height: 1.7em;

		&.selectedRow {
			background: #003c65;
			color: #fff;

			&:hover {
				background: #003c65;
			}
		}

		th {
			display: none;
		}

		td {
			&:first-of-type {
				padding-left: 0.3em;
			}

			&:last-of-type {
				padding-right: 0.3em;
			}

			&.GroupHeader,
			&.GroupFooter,
			&.GrandTotalFooter {
				display: none;
			}

			font-size: 2em;
		}
	}

	.GridViewRowStyle {
		background-color: #E1E1E1;
		color: #40474F;
		-moz-transition: 0.3s background;
		-o-transition: 0.3s background;
		-webkit-transition: 0.3s background;
		transition: 0.3s background;

		&:hover {
			background: #a2cbd9;
		}
	}

	.GridViewAlternatingRowStyle {
		background-color: #F6F6F6;
		color: #40474F;
		-moz-transition: 0.3s background;
		-o-transition: 0.3s background;
		-webkit-transition: 0.3s background;
		transition: 0.3s background;

		&:hover {
			background: #79c2dc;
		}
	}
}
}*/
/*#endregion*/