
/** Notifications */
	#notifications {
		position: absolute;
		top: 100%;
		width: 100%;
		padding: 2.083em 0;
		z-index: 10;
		max-height: calc(95vh - 60px);
		overflow-y: scroll;
		transform: translateY(-100%);
		-webkit-transition: all 1s ease;
			-moz-transition: all 1s ease;
			-ms-transition: all 1s ease;
			    -o-transition: all 1s ease;
			    transition: all 1s ease;
	}
	header.notifications-active #notifications {
		transform: translateY(0);
	}
	#messages, #payment-message {
		-webkit-transition: all .3s;
			-moz-transition: all .3s;
			-ms-transition: all .3s;
			    -o-transition: all .3s;
			    transition: all .3s;
    }

	#payment-message {
		margin-top: 10px;
	}

		#notifications .alert,
		#messages .alert,
		#payment-message .alert {
			position: relative;
			border-radius: 0 8px 8px 0;
			border: none;
			font-size: 1em;
			line-height: 1.385em;
			display: flex;
			padding: 20px 60px 20px 20px;
			margin: 0 0 10px;
			-webkit-transition: all .3s;
				-moz-transition: all .3s;
				-ms-transition: all .3s;
				    -o-transition: all .3s;
				    transition: all .3s;
			background-color: #fff;
			border-left: 5px solid #c4d9e7;
			align-items: center;
		}

		#notifications .alert::before,
		#messages .alert::before,
		#payment-message .alert::before,
		.alert::before {
			content: '';
			width: 25px;
			height: 25px;
			margin: 0 15px 0 0;
			border-radius: 50%;
		    background-size: auto 8px;
			background-position: 50% 50%;
		}

			#notifications .alert .message,
			#messages .alert .message,
			#payment-message .alert .message,
			.alert .message {
				width: calc(100% - 40px);
			}

			#notifications .alert a.close,
			#messages .alert .close,
			#payment-message .alert .close {
				position: absolute;
				cursor: pointer;
				top: calc(50% -7.5px);
				right: 15px;
				width: 15px;
				height: 15px;
				text-indent: -999em;
				background-image: url(../images/icon/close-grey.svg);
				-webkit-transition: all .3s;
					-moz-transition: all .3s;
					-ms-transition: all .3s;
					    -o-transition: all .3s;
					    transition: all .3s;
			}
			#notifications .alert a.close:hover,
			#messages .alert .close:hover,
			#payment-message .alert .close:hover {
				opacity: .6;
			}

			#notifications .alert .dismiss_notification{
				position:absolute;
				right:30px;
			}


		#notifications .notification-links {
			padding: 25px 0;
			display: flex;
			justify-content: center;
			align-items: center;
		}

			#notifications .notification-links a {
				font-size: 1.083em;
				font-weight: 400;
				color: #fff;
				padding: 0 1em;
			}


			header.notifications-active a.notifications {
				background-color: #2b2e83;
			}

			#notifications {
				background-color: #2b2e83;
			}

				.alert {
					background: #FFF;
					color: #393c3b;
				}

				/* Alert - Success */

				#messages .alert.alert-success,
				#payment-message .alert.alert-success {
					border-color: #46ae4d;
					background-color: #cfe8d0;
				}

				.alert-success::before {
					background: url(../images/icon/tick-white.svg) no-repeat;
					background-color: #46ae4d;
					background-position: center;
				}

				/* Alert - Warning */

				#messages .alert.alert-warning,
				#payment-message .alert.alert-warning {
					border-color: #f39521;
					background-color: #efc086;
				}

				.alert-warning::before {
					background: url(../images/icon/warning-white.svg) no-repeat;
					background-color: #f39521;
					background-position: center;
				}


				/* Alert - Notification */

				#messages .alert.alert-info,
				#payment-message .alert.alert-info {
					border-color: #3c80b1;
					background-color: #bbd4e6;
				}

				.alert-info::before {
					background: url(../images/icon/information-white-small.svg) no-repeat;
					background-color: #3c80b1;
					background-position: center;
				}

				/* Alert - Error */

				#messages .alert.alert-danger,
				#payment-message .alert.alert-danger {
					border-color: #ee3036;
					background-color: #f3adb0;
				}

				.alert-danger::before {
					background: url(../images/icon/error-white.svg) no-repeat;
					background-color: #ee3036;
					background-position: center;
				}

				/* General Notification */

				.single-notification {
					text-align: center;
					margin: 2em 0;
				}

				.single-notification h3:first-of-type {
					margin: 0.5em 0;
					flex: 100%;
					text-align: center;
				}

				.single-notification a {
					display: block;
					margin: 1.5em 0 0;
				}

				.single-notification > p:last-of-type {
					margin-bottom: 0;
				}

				.single-notification a:last-of-type {
					margin-bottom: 1em;
				}

				.single-notification .button {
					margin-bottom: 1em;
				}

				.single-notification .new-balance {
					padding: 2em;
					border-radius: 20px;
					background-color: #ebf2f7;
					max-width: 350px;
					width: 100%;
					margin: 1em auto;
				}

				.single-notification .new-balance p {
					margin: 0 0 0.5em;
				}

				.single-notification .new-balance .wallet-icon {
					width: 21px;
					height: 21px;
					display: inline-block;
					text-indent: -9999px;
					overflow: hidden;
					background: url(/assets/images/icon/wallet.svg) no-repeat;
					background-size: auto 100%;
					margin-right: 10px;
				}

				.single-notification .new-balance .value {
					display: flex;
					align-items: center;
					justify-content: center;
				}

				.single-notification .new-balance h5 {
					color: #46ae4d;
					font-size: 1.8em;
    				font-weight: 600;
					margin: 0;
				}
