
/**
 *
 *	Branding For COSAP Hybrid
 *
 */ 


 	@font-face {
		 font-family: 'Open Sans';
		 font-style: normal;
		 font-weight: 300;
		 src: url('/hybrid/cosap/fonts/Open_Sans/OpenSans-Light.woff');
	 }
	 
	 @font-face {
		 font-family: 'Open Sans';
		 font-style: normal;
		 font-weight: 400;
		 src: url('/hybrid/cosap/fonts/Open_Sans/OpenSans-Regular.woff');
	 }

	 @font-face {
		 font-family: 'Open Sans';
		 font-style: normal;
		 font-weight: 600;
		 src: url('/hybrid/cosap/fonts/Open_Sans/OpenSans-Semibold.woff');
	 }

	 @font-face {
		 font-family: 'Open Sans';
		 font-style: normal;
		 font-weight: 700;
		 src: url('/hybrid/cosap/fonts/Open_Sans/OpenSans-Bold.woff');
	 }

	 @font-face {
		 font-family: 'Istok Web';
		 font-style: normal;
		 font-weight: 400;
		 src: url('/hybrid/cosap/fonts/IstokWeb/IstokWeb-Regular.woff');
	 }
@font-face {
		 font-family: 'Material Icons';
		 font-style: normal;
		 font-weight: 400;
		 src: url('/hybrid/cosap/fonts/coasp_fonts/MaterialIcons-Regular.woff');
	 }
	 @font-face {
		 font-family: 'Istok Web';
		 font-style: normal;
		 font-weight: 700;
		 src: url('/hybrid/cosap/fonts/IstokWeb/IstokWeb-Bold.woff');
	 }

	 @font-face {
		 font-family: 'Istok Web';
		 font-style: italic;
		 font-weight: 400;
		 src: url('/hybrid/cosap/fonts/IstokWeb/IstokWeb-Italic.woff');
	 }

	html {
   	
    	height:100%;
    
    }
    
    a {
    	text-decoration: underline;
    }

	body {
    	font-family:'Open Sans',tahoma,sans-serif;
		padding:0px;
		margin:0px;
		color: #666;
		font-size: 14px;
        background:#EEEEEE;
        background-color:#EEEEEE;
		    }

	.custom-select-open {
		height: 100%;
		overflow: hidden;
	}

	.no-overflow {
		overflow: hidden;
	}

	.container-fluid, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
		padding: 0px;
	}

	.row {
		margin: 0px;
	}
    
    .iconView {
        cursor:pointer;
        cursor:hand;
        position:relative;
        z-index:501;
    }
    
    .ui-widget-content {
    	width: initial;
		width: auto;
    }

	.default-hidden, .closeDropdownbutton.fa.default-hidden {
		display: none;
	}

	body > .customSelectDropdownWrapper {
		display: none;
	}

/**
 *
 *	Header
 *
 */

	.header {
		 background:#CCCCCC;
         padding: 20px 0px;
															
	}

	body > .header > .content img {
		max-height: 80px;
		max-width: 450px;
	}

	.header > .content, .footer, .nav > ul {
		width:960px;
		margin:auto;
		position: relative;
	}
	
	.header > .content > ul, .nav > ul, .nav > ul, #headerNav > ul {
		list-style-type:none;
		padding:0px;
		display: inline-block;
		margin-bottom: 0px;
	}
	
	#headerNav {
		width: 70%;
		text-align: right;
		vertical-align: bottom;
	}
	
    .content-iframe {
    	min-width: 1010px;
		max-width: 1040px;
		min-height: 720px;
    }
    
	#headerNav * a {
        color:#333333;
        position:relative;
        z-index:501; 
	}
	
	.nav > ul > li {
		float:left;
		margin-right:10px;
		display:inline;
	}

	.header > .content > #headerNav > ul > li {
		display: inline-block;
		margin-right: 10px;
		vertical-align: middle;
		line-height: 13px;
		color: rgb(100,100,100);
		margin-bottom: 5px;
	}

	.header > .content > #headerNav > ul:first-child > li:not(#hintView_messageCenter) {
		border-right: 1px solid rgb(50,50,50);
		padding-right: 10px;
	}
	
	.header > .content {
		display: table;
		height: 100%;
	}

	.header > .content > *:not(i) {
		display: table-cell;
	}

/**
 *
 *	Navigation
 *
 */
	
    .nav {
    	background:#FF6600; 
		min-height:2px;
        height: 40px;
	}
    
	.nav > ul > li {
		margin-right:20px;
	}

	.ssoNav > ul > li {
		margin-left: 10px;
	}
	
	.nav > ul {
		height:38px;
		display: block;
	}

	.nav > ul > li > a {
		padding:10px;
        color:#FFFFFF; 
		text-decoration:none;
		display:block;
        font-weight: 600;
		font-size: 18px;
		line-height: 20px;
	}
		.nav > ul > li:hover > a {
    	color:#333333; 
	}

	.rightWedge {
		width:0px;
		height:0px;
		border-top: 5px solid transparent;
		border-left: 5px solid #FFFFFF;
		border-bottom: 5px solid transparent;
		float: right;
		position: relative;
		top: -24px;
		left: 3px;
	}

	.nav > ul > li:hover > .rightWedge {
		border-left: 5px solid #333333; 
	}

	.arrow {
		position:relative;
		z-index:9;
		margin:auto;
		width:0px;
		height:0px;
		border-top:10px solid #313133;
		border-left:10px solid transparent;
		border-right:10px solid transparent;
		display:none;
	}
	
	.nav > ul > li.navSelectedButton > a {
		background:#313133;
				color:#BBBBBB;
	}

	.nav > ul > li.navSelectedButton:hover > a {
		color:#BBBBBB;
	}

	.navSelectedButton > .arrow {
		display:block;
	}
    
    .icon-message-center {
    	position: relative;
    }
    
    .icon-message-center:after {
    	content: "1";
        background-color: #047EBD;
        color: white;
        padding: 2px 6px;
        border-radius: 5px;
        position: absolute;
        top: -5px;
        right: -5px;  
        font-size: 11px;
        font-family: sans-serif;      
    }
    


/**
 *
 *	Page
 *
 */

 	.skinny-details-row {
		margin-top: 5px;
	}

	div#transfersTable table tr > * {
		vertical-align: top;
	}

	.skinny-balance-label {
		font-weight: bold;
		font-size: 12px;
	}

	.skinny-balance-value {
		font-size: 15px;
		margin-left: 5px;
	}

 	.account-tiles > * {
		padding: 0px;
		width: calc(33.33% - 20px);
		border-radius:7px;
	}

.processingTransactions .credit, .pastTransactions .credit, #recipients-table .credit{
 color:#1E8A49;
}
	.adSpace, .account-info {
		margin-top: 30px;
	}

	.adSpace > img {
		max-width: 100%;
	}

	.account-tiles > *:nth-child(n+4) {
		margin-top: 30px;
	}

	.account-tiles > *:not(:last-child):not(:nth-child(3)) {
		margin-right: 15px;
	}

	.account-tiles > *:not(:first-child):not(:nth-child(4)) {
		margin-left: 15px;
	}

	.main > .content {
		-webkit-overflow-scrolling: touch;
		padding:30px 40px;
		width: 960px;
		margin: auto;
		background-color: white;
		position: relative;
	}

	.main {
		font-size:13px;
		width: initial;
		width: auto;
		position: relative;
	}
	
	.columnHeader {
		font-family: inherit;
		font-size:30px;
		font-weight: 300;
		margin:20px 0px 30px 0px;
		color:#333333;
	}

	.billsTable {
		width:100%;
		margin-top:10px;
		border-collapse:collapse;
	}

	.billsTable * td {
		padding:5px;
	}

	.billsTable * th {
		padding:5px;
		margin:0px;
		font-size:13px;
		color:#333333;
	}

	.billsTable * th:not(.right-column) {
		text-align:left;
	}

	.accounts-table-view tbody tr:nth-child(odd), .billsTable tbody tr:nth-child(odd), .pastTransactions tr:nth-child(even), .processingTransactions tr:nth-child(even), #phone-table tbody tr:nth-child(odd), #active-alerts-table tbody tr:nth-child(odd) {
		background:#F7F7F7;
	}

	.striped-table tr.striped-row {
		background:#F7F7F7 !important;
	}

	.striped-table tr:not(.striped-row) {
		background:white !important;
	}

	.billsTable tr:nth-child(even) {
		background:transparent;
	}

	.accountDisplay {
		display: inline-block;
		width: 100%;
        position: relative;
		border-radius:7px;
		background:#CCCCCC;
		border:1px solid #CCCCCC;
		background: linear-gradient(#DDDDDD, #A5A5A5);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#DDDDDD', endColorstr='#A5A5A5',GradientType=0 );
background: -webkit-linear-gradient(#DDDDDD, #A5A5A5);
background: -o-linear-gradient(#DDDDDD, #A5A5A5);
background: -moz-linear-gradient(#DDDDDD, #A5A5A5);
		padding:10px;
		height: 155px;
		color:#666666;
		height: 155px;
	}

	.accountTileLower {
		position: absolute;
		bottom: 10px;
	}
    
    .accountDisplay > img {
    	position: absolute;
        right: 10px;
        float: initial;
		max-height: 40px;
    }

	.accountTileLower {
		position: absolute;
		bottom: 10px;
	}
    
	.accountDisplay > h3, .accounts-table h3 {
		font-size:14px;
		font-weight:bold;
		margin:0px;
		padding:0px 0px 2px 0px;
	}

	.accountDisplay > p {
		height:10px;
	}

	.accounts-table-view th, .billsTable th {
		font-size: 12px;
		font-weight: 600;
		color: rgb(50,50,50);
	}

	.accountBalance {
		line-height: 30px;
		color:#FFFFFF;
        
        
		font-size:20px;
	}

	.accountBalance > span {
		font-size:35px;
	}
	
	.main * a, .utility-link {
		color:#666666;
		cursor: pointer;
	}
	
	.main * a:hover {
		color:#333333;
	}

	.main a.cancel-action {
		color: #666;
	}

	.filter-label {
		font-weight:bold;
		font-style:normal;
	}

	.bold-field-label {
		font-weight:bold;
		font-style:normal;
		margin-top:10px;
	}

	.bottom-buttons-container {
		padding-top:20px;
		margin-bottom: 0px;
	}

	.bottom-single-button {
		padding: 0 0 20px 0;
		text-align: center;
	}

	.bottom-single-button > .button {
		display: inline-block;
		margin: 0;
	}

	.frequency-col {
		text-align: left;
	}

	.inside-delete-buttons {
		margin: 20px 0 0 0;
	}

	.right-column {
		text-align: right;
	}

	.account-tile-icon {
		float: right;
	}

	a.button {
		padding:5px 30px 5px 30px;
		border:1px solid #666666;
		color:#FFFFFF;
		background:#047EBD;
		border-radius:4px;
		margin-right:15px;
		text-decoration:none;
        cursor: pointer;
		display: inline-block;
		text-transform: uppercase;
		font-size: 12px;
		font-weight: 600;
		font-family:'Open Sans',tahoma,sans-serif;
	}
    
    a.button:hover {
   		color:#FFFFFF;
    }
    
	.layout {
		border-collapse:collapse;
		width:100%;
	}
	
	.layout > tbody > tr > td:first-child { 
		width:70%;
	}
	
	.layout > tbody > tr > td:last-child {
		width:30%;
	}
	
	.layout > tbody > tr > td:last-child, .layout > tbody > tr > td:first-child {
		padding:10px;
	}
	
	.section {
		background:#f7f7f7;
		border-radius:7px;
		padding:10px 15px 10px 15px;
		border:1px solid #d6d6d6;
		color:#666;
	}


	.account-info > * {
		display:inline-block;
		vertical-align: top;
	}
	
	.account-info > *:last-child {
		padding-left:40px;
						margin-bottom: 200px;
		
}

	i#mobile-nav-button {
		float: left;
		margin: 5px 0 5px 10px;
		font-size: 24px;
		cursor: pointer;
	}

	.content input[type=text] {
		padding: 4px 10px;
		border-radius: 4px;
		border: 1px solid rgb(200,200,200);
		box-sizing: border-box;
	}

	#amountView {
		min-width:165px;
	}

	#memoView {
		width: 250px;
	}

	.button-container {
		margin-top: 20px;
	}

	.button-container > * {
		display: inline-block;
	}

	.field-container:not(:last-child) {
		margin-bottom: 10px;
	}

	.modal-header + .main {
		position: relative;
		top: 0;
		min-width: 100%;
	}

	#transfersTable table tr > *:last-child {
		width: 70px;
	}
	
	.inline-field-container {
		display: inline-block;
	}

	.inline-field-container:not(:last-child) {
		padding-right: 15px;
	}

	.subheader {
        font-size: 13px;
        font-weight: bold;
        color: rgb(120,120,120);
    }

	.filters-view .customSelect, .filters-view .customSelectDropdownWrapper, .filters-view .openCustomSelect {
		width: 100% !important;
	}

	.filter-status-list {
		position: relative;
	}

	.filters-view > *:last-child {
		margin-top: 15px;
	}

	.filters-view input[type=text] {
		width: calc(100% - 30px);
	}

	.account-details-tile, .account-details-actions {
		display: inline-block;
		vertical-align: top;
	}

	.account-details-tile {
		width: 325px;
	}

	.account-details-actions {
		width: calc(100% - 330px);
		padding-left: 50px;
	}

	.account-details-icon {
		width: 35px;
	}

	.detailsTransactionsContainer table tr > :first-child {
		width: 100px;
	}

	.detailsTransactionsContainer table tr > *:nth-child(n+3) {
		width: 100px;
	}
	
	.bordered-pod {
		border:1px solid #cccccc;
		border-radius:7px;
		background:#F7F7F7;
		padding:20px 40px 20px 20px;
		font-family: 'Istok Web',verdana,sans-serif;
	}

	.custom-select-target {
		position: relative;
	}

	textarea {
		font-size: inherit;
	}

	.outer-table-header {
		margin:10px 0px 0px 0px;
		color:#666;
		font-size:14px;
	}

	.mobile-main-view {
		width:100%;
		min-height:720px;
	}

	#loadingImageView {
		height:600px;
		width:100%;
	}

/**
 *
 *	Footer
 *
 */

	.footer > .content {
		padding:20px 40px 15px 40px;
	}



	.footer > .content > table {
		margin-bottom:20px;
	}

	.footer {
		
		border-top:2px solid #FF6600;
		background:#666666;
		
                
		color:#BBBBBB;
	}

	.footer * a
	{
		color:#FFFFFF;
	}
	
	.footer > .content > table * td
	{
		padding:5px 10px 5px 10px;
	}
    
    .footer * img
    {
   		float:left;
        margin-right:30px;
    }

/**
 *
 *	SSO Navigation
 *
 */
 	
	.ssoNav {
		background:#666666;
        	
		min-height:2px !important;
	}


	.ssoNav > ul > li > a {
		padding:10px;
		color:#BBBBBB;
		text-decoration:underline;
		display:block;
	}

	.ssoNav > ul > li:hover > a {
		color:#FFFFFF;
	}
	
	.ssoNav > ul > li:hover > .leftWedge {
		border-right: 5px solid #FFFFFF;
	}
	
	sup#zelle_registered_sign_in_nav {
		display: inline-block;
	}
	
	.leftWedge {
		width:0px;
		height:0px;
		border-top: 5px solid transparent;
		border-right: 5px solid #BBBBBB;
		border-bottom: 5px solid transparent;
		float: left;
		position: relative;
		top: -24px;
		left: -3px;
	}

/**
 *  
 *	Shared Selectors
 *
 */
  
	.footer, .header {
		font-size:13px;
	}
    
    .fa-question {
        color: #047EBD;
        font-size: 16px !important;
        height: 22px;
        width: 22px;
        border-radius: 50%;
        border: 2px solid #047EBD;
        text-align: center;
        cursor: pointer;
        margin-left: 5px;
        position: relative;
        box-sizing: border-box;
    }
    
    .tooltip {
      background-color: rgb(255,255,230);
      border: 1px solid rgb(200,150,30);
      border-radius: 5px;
      color: rgb(200,150,30);
      box-shadow: 0px 0px 5px rgba(0,0,0,.25);
      position: absolute;
      left: 34px;
      top: -18px;
      width: 230px;
      padding: 5px;
      font-size: 13px;
      text-align: left;
      opacity: 1;
	  font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
	  font-style: normal;
	  font-weight: 400;
	  line-height: 1.28;
	  z-index: 1;
      display: none;
    }
    
    .tooltip:after {
      content: "";
      position: absolute;
      left: -12px;
      top: 17px;
      border-top: 8px solid transparent;
      border-bottom: 8px solid transparent;
      border-right: 11px solid rgb(200,150,30);
    }
    
    .tooltip:before {
      content: "";
      position: absolute;
      left: -10px;
      top: 18px;
      border-top: 7px solid transparent;
      border-bottom: 7px solid transparent;
      border-right: 10px solid rgb(255,255,230);
      z-index: 1;
    }
    
    .modal {
    	display: none;
    }

	#mobile-nav-backdrop, #mobile-nav-button {
		display: none;
	}

	#cash-back-left .small-screen-text {
		display: none;
	}
    
/** 
 *
 *	Mozilla Adjustments 
 *
 */
 
	@-moz-document url-prefix() { 
	  
      .nav > ul {
		 height:39px;
	  }
      
       .nav > ul > li > a {
		 padding:10px 10px 9px 10px
	  }
      
	}

<!-- See /hybrid/cosap/fonts/IstokWeb/OFL.txt for Istok Web license -->

<!-- See /hybrid/cosap/fonts/Open_Sans/LICENSE.txt Open Sans for license -->
