
/**
 *
 *  Responsive Tier 0: 959+
 *
 */

 .main, .modalWindowOverlay {
	top: 180px;
}

.header, body > .nav {
	position: fixed;
	width: 100%;
	left: 0;
	right: 0;
	z-index: 50;
}

.header {
	height: 140px;
}

body > .nav {
	height: 40px;
	top: 140px;
}

@media only screen and (min-width: 960px) {

	/* Targets credit sense image only */
	.creditSense img {
		margin-bottom: 187px;
	}
}

/** 
 *
 *	Responsive Tier 1: 680 - 959
 *
 */

 @media only screen and (max-width: 959px) and (min-width: 680px) {

	.main, .modalWindowOverlay {
		min-width: 960px;
		top: 180px;
	}

	.main > .content {
		padding:40px;
	}

	.header, body > .nav {
		position: fixed;
		width: 100%;
		left: 0;
		right: 0;
		z-index: 50;
	}

	.header {
		height: 140px;
	}

	body > .nav {
		height: 40px;
		top: 140px;
	}

	.header > .content, .main, .footer {
		width: 100%;
	}

	.account-tiles > * {
		width: calc(50% - 15px);
	}

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

	.account-tiles > *:nth-child(odd) {
		margin-right: 15px;
		margin-left: 0px !important;
	}

	.account-tiles > *:nth-child(even) {
		margin-left: 15px;
		margin-right: 0px !important;
	}

	body > .header > .content img {
		padding-left: 30px;
	}

	#headerNav {
		padding-right: 30px;
	}

	.account-info > * {
		width: 100%;
	}

	.account-info > *:last-child {
		margin-left: 0px;
	}

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

 }

 /** 
 *
 *	Responsive Tier 3: 0 - 959
 *
 */

 @media only screen and (max-width: 959px) {

	 .account-info > *, .pod-container, .header > .content, .main, .footer {
		width: 100% !important;
	}

	.footer {
		position: static !important;
	}

	.content-iframe {
		margin-bottom: 0px !important;
	}

	.account-info > *:last-child {
		margin-left: 0px;
	}

	.account-info > *, #new-transfer-container {
		padding: 0px !important;
	}

	#new-transfer-container {
		margin-bottom: 0px !important;
	}

	.pod-container > #success-header {
		margin-right: 0px;
	}

	.columnHeader.reviewing-transfer {
		margin-top: 50px;
	}

	.modalWindowView {
		left: 0 !important;
		right: 0 !important;
		top: 0 !important;
		margin-left: 0 !important;
		-webkit-overflow-scrolling: touch;
  		overflow: auto;
		max-height: 100%;
		max-width: 100%;
	}

	.loadingView, .modalWindowView, .modalWindow {
		width: 100% !important;
		max-height: 100% !important;
		border-radius: 0px !important;
		border: none !important;
	}

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

	div#services-ad-container {
		position: static;
		margin-top: 50px;
	}
	 
 }

 /** 
 *
 *	Responsive Tier 3: 0 - 679
 *
 */

 @media only screen and (max-width: 679px) {

	 body {
		 font-size: 16px;
	 }
	 
	 .columnHeader {
		 margin-bottom: 20px;
	 }

	 .main > .content, .pod-container {
		 -webkit-overflow-scrolling: touch;
  		overflow: visible;
	 }

	 ::-webkit-scrollbar {
		 display: none;
	 }

	 .main {
		position: fixed;
		top: 50px;
		bottom: 0;
		left: 0;
		overflow: auto;
		-ms-overflow-style: none;
		min-width: 320px;
	 }

	 .account-tiles > * {
		 width: 100%;
		 margin-right: 0px !important;
		 margin-left: 0px !important;
	 }

	 .account-tiles > *:not(:first-child) {
		 margin-top: 30px;
	 }
	 
	 body > .nav {
		 display: none;
	 }

	 .header {
		 padding: 5px 0;
		 height: 50px;
		 border-bottom: 2px solid #FF6600; 
		 top: 0;
		 width: 100%;
		 z-index: 100;
		 min-width: 320px;
	 }

	 .header > .content > * {
		 display: inline-block !important;
		 max-height: 40px;
	 }

	 body > .header > .content img {
		max-height: 40px;
		max-width: 100%;
	}

	 div#mobile-nav-backdrop {
		position: fixed;
		top: 50px;
		bottom: 0;
		background-color: rgba(0,0,0,.35);
		z-index: 100;
		width: 100%;
	}

	 #headerNav {
		 float: right;
		 width: initial;
		 width: auto;
		 margin: 13px 0;
	 }

	 #headerNav > ul:first-child {
		 display: none;
	 }

	 .header > .content {
		 text-align: center;
		 display: block;
	 }
	 
	 .main > .content {
		 padding: 30px 10px;
		 width: initial;
		 width: auto;
	 }

	 .accounts-table-view {
		 font-size: 13px;
	 }

	 .accounts-table-view tbody tr td:first-child a {
		 font-size: 14px;
	 }

	 .accounts-table-view tfoot {
		 display: none;
	 }

	 #liability-accounts tr > *:not(:last-child):not(:first-child) {
		 display: none;
	 }

	 #liability-accounts tr > *:last-child, #asset-accounts tr > *:not(:first-child) {
		 vertical-align: top;
		 font-size: 15px;
	 }

	 #asset-accounts tr > *:last-child:not(:nth-child(2)):not(:only-child) {
		 display: none;
	 }

	 .skinny-details, .skinny-totals {
		 display: block;
	 }

	 tr.skinny-details, tr.skinny-totals {
		 display: table-row;
	 }

	 table#liability-accounts .skinny-details .skinny-balance-value {
		text-align: right;
	}

	.skinny-details .skinny-balance-label, .skinny-details .skinny-balance-value {
		display: table-cell;
	}

	.skinny-details .skinny-balance-value {
		padding-left: 5px;
	}

	.skinny-details .skinny-details-row {
		display: table-row;
	}

	 .skinny-totals {
		 border: 1px solid #ddd;
		 padding: 5px;
		 margin-bottom: 20px;
	 }

	 .accounts-table > .accounts-table-view {
		 margin-bottom: 0px;
	 }

	 .accounts-table > h3 {
		 font-size: 16px;
		 font-weight: 600;
	 }

	 .billerView > table tr > *:nth-child(2) {
		 display: none;
	 }

	 i#mobile-nav-button {
		 display: inline-block;
	 }

	 div#mobile-nav-container {
		background-color: white;
		width: 80%;
		height: 100%;
		overflow: auto;
	}

	.mobile-nav-collection {
		border-top: 16px solid #f3f3f3;
		border-bottom: 1px solid rgb(220,220,220);
	}

	.mobile-nav-item {
		border-top: 1px solid rgb(220,220,220);
		font-weight: 600;
		cursor: pointer;
		font-size: 18px;
	}

	.mobile-nav-item a {
		color: rgb(100,100,100);
		padding: 10px 20px;
		width: 100%;
		display: inline-block;
	}

	.mobile-nav-item:not(:only-child) a {
		text-decoration: none;
	}

	.mobile-nav-item:only-child a {
		color:#BBBBBB;
	}

	div#mobile-nav-main .mobile-nav-item a {
		color: #FF6600;
	}

	.mobile-nav-item:hover:not(.mobile-nav-selected) a {
		color: rgb(100,100,100) !important;
	}

	.mobile-nav-selected a {
		background:#313133;
				color:#BBBBBB !important;
	}

	#mobile-nav-backdrop {
		display: block;
	}

	.content .field-container input[type=text]:not(.field-with-icon):not(.always-inline):not(.field-with-two-icons), .content .field-container input[type=password]:not(.field-with-icon):not(.always-inline):not(.field-with-two-icons), .field-container textarea:not(.field-with-icon):not(.always-inline):not(.field-with-two-icons), .field-container .customSelect, .field-container .openCustomSelect, .field-container .custom-select, .field-container .custom-select-menu {
		width: 100% !important;
		min-width: 100% !important;
	}

	.content .field-container input[type=text], .field-container .customSelect, .field-container .openCustomSelect, .field-container .customSelectDropdown, .field-container .custom-select, .field-container .custom-select-menu {
		font-size: 15px !important;
	}

	.field-with-icon, .field-container .field-with-icon {
		width: calc(100% - 35px);
	}

	.field-with-two-icons, .field-container .field-with-two-icons {
		width: calc(100% - 65px);
	}

	.main > .content, #cardlytics-view .content {
		padding: 20px;
	}

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

	.showRecurringTransfer {
		margin-top: 10px;
		display: inline-block;
	}

	#transfersTable table tr > *:nth-child(even) {
		display: none;
	}

	.inline-field-container {
		display: block;
		width: 100%;
	}

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

	.account-details-tile, .account-details-actions {
		display: block;
		width: 100%;
		padding: 0px;
		margin-bottom: 20px;
	}

	.account-details-actions .accountActions {
		display: block !important;
	}
	
	body > .customSelectDropdownWrapper, .openCustomSelect + .customSelectDropdownWrapper {
		width: 100% !important;
		display: block;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		margin: auto;
		height: 100%;
		background-color: rgba(0,0,0,.5);
		z-index: 999999;
	}

	.customSelectDropdown {
		width: 85% !important;
		margin: auto;
		position: absolute !important;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		padding: 15px !important;
		font-size: 15px !important;
		border: none !important;
		box-sizing: content-box !important;
	}

	.customSelectDropdown:before {
		content: "";
		height: 45px;
		background-color: white;
		position: absolute;
		top: -45px;
		width: 100%;
		left: 0px;
		border-top-left-radius: 5px;
		border-top-right-radius: 5px;
		border-bottom: 1px solid rgb(150,150,150);
	}

	.customSelectDropdown > div {
		border: 1px solid rgb(150,150,150);
		padding: 5px 10px !important;
		border-radius: 4px;
	}

	.customSelectDropdown > div:not(:last-child) {
		margin-bottom: 10px;
	}

	.closeDropdownbutton {
		display: block;
		position: absolute;
		right: 15px;
		top: -35px;
		font-size: 25px;
		color: black;
	}

	.moreActionsButton span {
		display: inline-block !important;
	}

	.moreActionsButton a {
		text-decoration:none !important;
	}

	a.moreActionsButton, a.moreActionsButton + .downWedge {
		display: none !important;
	}

	.moreActionsView {
		display: block !important;
		position: static !important;
		margin: -15px 0 0 0 !important;
	}
	
	.moreActions {
		border: none !important;
		background: transparent;
	}

	.moreActionsBorder {
		display: none;
	}

	.moreActionsButton {
		padding: 15px 0 !important;
		font-size: 1.1em;
	}

	.moreActionsButton a {
		text-decoration: underline !important;
		color: #666666 !important;
	}

	.detailsTransactionsContainer table tr > *:nth-child(2), .detailsTransactionsContainer table tr > *:last-child:not(:only-child) {
		display: none;
	}

	.detailsTransactionsContainer .dateHeader {
		width: auto;
		width: initial;
	}

	.detailsTransactionsContainer table tr > :first-child {
		width: auto;
		width: initial;
	}

	.customSelectDropdown {
		max-height: 85% !important;
		border-top-right-radius: 6px !important;
		border-top-left-radius: 6px !important;
	}

	#steps-container li {
		display: block !important;
	}

	#user-account-rows .field-container-inline > *, #user-account-rows .field-container-inline {
		display: block !important;
	}

	div#user-account-rows .field-label {
		width: 100% !important;
	}

	.fa-question {
		position: static;
	}

	.contains-tooltip {
		position: relative;
	}

	.tooltip {
		width: 100%;
		left: 0;
		top: calc(100% + 8px);
	}

	.tooltip .tooltip-arrow {
		position: absolute;
	}

	.tooltip .tooltip-arrow.front {
		left: initial;
		left: auto;
		top: -10px;
		right: 10px;
		border-top: none;
		border-left: 7px solid transparent;
		border-right: 7px solid transparent;
		border-bottom: 10px solid rgb(255,255,230);
		z-index: 1;
	}

	.tooltip .tooltip-arrow.back {
		left: initial;
		left: auto;
		top: -12px;
		right: 9px;
		border-top: none;
		border-left: 8px solid transparent;
		border-right: 8px solid transparent;
		border-bottom: 11px solid rgb(200,150,30);
		z-index: 0;
	}

	.tooltip:before, .tooltip:after {
		display: none;
	}

	table#message-table tr > *:nth-child(3) {
		display: none;
	}

	table#message-table tr > *:first-child {
		width: 40px;
	}

	table#active-alerts-table tr > *:first-child, table#active-alerts-table tr > *:nth-child(3) {
		display: none;
	}

	table#active-alerts-table tr > *:last-child {
		vertical-align: top;
	}

	div#cash-back-right {
		float: none;
		width: 100%;
		padding: 0 !important;
		text-align: left !important;
		white-space: nowrap;
	}

	div#cash-back-left {
		float: none;
		width: 100%;
		margin-bottom: 30px;
	}

	div#cash-back-right > *:nth-child(n+5) {
		display: none;
	}

	div#cash-back-right > * {
		margin-right: 0px;
	}

	a#cash-back-total {
		display: none;
	}

	#cash-back-left .small-screen-text {
		display: block;
	}

	#cash-back-left .large-screen-text {
		display: none;
	}

 }