.notifications {
	margin-bottom: 30px;
}
.notifications-heading {
	background: #5394be;
	color: #fff;
	padding: 3px 0 2px 10px;
	margin: 0;
	border-radius: 3px 3px 0px 0px;
}

.notifications-container {
	background: #daebf5;
	border-radius: 0 0 3px 3px;
}
.notifications-container .row {
	padding: 6px 0;
}
.notifications-container .notifications-header {
	border-bottom: 1px solid #ccc;
	background: #c5dae7;
	margin-bottom: 10px;
}
.notifications-container .notifications-header,
.notifications-container .row > div:not(:first-child) {
	text-align: center;
}
.notifications-container .notifications-header h5 {
	margin: 0;
}
.notifications-container .notifications-header h5,
.notifications-container .row > div:first-child {
	font-size: .875rem;
}
.notifications-container input[type="checkbox"] {
	margin-bottom: 0;
}
.notifications-hide {
	display: none;
}
.email-notification, .text-notification {
	background: #daebf5;
	padding: 10px;
	border-radius: 3px;
}

/* settings notifications */
.notification {
	border-bottom: 1px solid #ddd;
	margin-bottom: 1rem;
}
.notification:last-child {
	border-bottom: none;
}
.notification-heading {
	font-weight: 500 !important;
	padding: .4rem;
	margin-bottom: 1rem;
	background: #076191;
	color: #fff;
	border-radius: 3px;
}
.notifications-tip {
	font-size: 1.2rem;
	margin-top: .3rem;
	display: inline-block;
}
.balance-notice-frequency .panel {
	padding-top: .8rem;
}
.balance-notice-frequency p {
	margin-bottom: .5rem;
}
.balance-notice-frequency label:last-child {
	margin-left: 1rem !important;
}
.balance-notice-frequency label {
	margin-right: .2rem !important;
	margin-left: .2rem !important;
}
.balance-notice-frequency input {
	margin-bottom: 0;
}
.notification-contact-info .row {
	margin-bottom: .4rem;
}
.notification-contact-info h5 {
	margin: 0;
	font-weight: 500;
}
.notification-contact-info p {
	margin-bottom: 0;
}
.notification-table {
	width: 100%;
	margin-top: 1rem;
}
.notification-table .on {
	color: #076191;
	font-size: 1.5rem;
}
.notification-table .off {
	color: #ddd;
	font-size: 1.5rem;
}
.notification-table thead {
	border-bottom: 1px solid #ddd;
}
.notification-table th {
	border: none;
	text-align: center;
}
.notification-table tbody tr:nth-child(odd) {
	background: #f5f5f5;
}
.notification-table tbody tr td {
	text-align: center;
}
.notification-table tbody tr td:first-child {
	text-align: left;
}

@media only screen and (max-width:1024px) {
	.notification-contact-info .row {
		margin-bottom: 1rem;
	}

	.notification-table,
	.notification-table thead,
	.notification-table tbody,
	.notification-table th,
	.notification-table td,
	.notification-table tr {
		display: block;
	}
	.notification-table thead tr {
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	.notification-table tr {
		border: none;
	}
	.notification-table td {
		border: none;
		position: relative;
		padding-left: 50%;
		font-size: .8rem;
		font-weight: 300;
		text-align: right;
	}
	.notification-table td:nth-of-type(1) {
		padding-left: .5rem;
		font-weight: 600;
	}
	.notification-table td:before {
		position: absolute;
		top: inherit;
		left: 10px;
		width: 45%;
		padding-right: 10px;
		white-space: normal;
		font-weight: 500;
		text-align: left;
		line-height: 1em;
	}
	.notification-table td:nth-of-type(2):before { content: "Email"; }
	.notification-table td:nth-of-type(3):before { content: "Text"; }
	.notification-table td:nth-of-type(4):before { content: "Mobile Device"; }

}




/* notifications progress */
.notifications .notifications-heading {
	background: #076191;
}

.notifications .notifications-container {
	background: #56b9ed;
}

.notifications-container .progress-bar-container {
	background: #076191;
}
.notifications-container .progress-bar {
	text-align: center;
	margin: 3px 0 10px;
	background: #2496d2;
	border-radius: 3px;
}

	.notifications-container .custom-progress {
		width: 12%;
		height: 30px;
		background: #56b9ed;
		border: none;
		border-radius: 3px 0 0 3px;
		position: relative;
	}
	.notifications-container .custom-progress:after {
		content: '';
		display: inline-block;
		width: 0;
		height: 0;
		position: absolute;
		right: -30px;
		border-style: solid;
		border-width: 30px 30px 0 0;
		border-color: #56b9ed transparent transparent transparent;
	}
	.notifications-container .progress-bar.step-0 .custom-progress {
		width: 1%;
	}
	.notifications-container .progress-bar.step-1 .custom-progress {
		width: 12%;
	}
	.notifications-container .progress-bar.step-2 .custom-progress {
		width: 24%;
	}
	.notifications-container .progress-bar.step-3 .custom-progress {
		width: 36%;
	}
	.notifications-container .progress-bar.step-4 .custom-progress {
		width: 48%;
	}
	.notifications-container .progress-bar.step-5 .custom-progress {
		width: 60%;
	}
	.notifications-container .progress-bar.step-6 .custom-progress {
		width: 72%;
	}
	.notifications-container .progress-bar.step-7 .custom-progress {
		width: 84%;
	}
	.notifications-container .progress-bar.step-8 .custom-progress {
		width: 100%;
		border-radius: 3px;
	}
	.notifications-container .progress-bar.step-8 .custom-progress:after {
		border: none;
	}

	.notifications-container .progress-bar .progress-percent {
		display: inline-block;
		position: absolute;
		left: 0;
		right: 0;
		margin: 5px auto 0;
		color: #fff;
		font-size: 1.1rem;
		z-index: 1;
	}

.notifications-container .progress-steps-detail,  
.notifications-container .progress-steps {
	font-size: .875rem;
	color: #fff;
	margin: .5rem 0 .3rem;
}
.notifications-container .progress-steps a {
	color: #fff;
}
.notifications-container .progress-steps a:hover {
	color: #56b9ed;
}

.notifications-container .progress-bar span.step-off {
	background: #bfd8e7;
}
.notifications-container .progress-bar span.step-on {
	background: #076191;
}

.notifications-container .progress-text-container {
	padding-bottom: 0;
}
.notifications-container .progress-text {
	margin: 0 20px;
	/*text-align: center;*/
}
.notifications-container .progress-text p {
	margin-bottom: 0;
	font-size: .875rem;
	line-height: 1.2;
	color: #fff;
}

.notifications-container .progress-button .button {
	margin-bottom: .5rem;
}


