/*--------------------------------------------------------------
# PopUp
--------------------------------------------------------------*/
.popup-wrapper {
	width: 100%;
	height: 100%;
	position: fixed;
	left: 0;
	bottom: 0;
	z-index: 999;
	background: rgba($black-color, 0.6);
	-webkit-transform: translateY(100%);
	-ms-transform: translateY(100%);
	transform: translateY(100%);
	@include single-transition(all, .5s, ease-in-out, .5s);

	&.popup-show {
		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		transform: translateY(0);
	}
	
	.popup-page {
		width: 100%;
		max-width: 400px;
		height: 100%;
		display: flex;
		justify-content: center;
		flex-direction: column;
		text-align: center;
		position: relative;
		margin: 0 auto;
	}

	.popup-inner {
		width: 100%;
		max-width: 400px;
		position: relative;
	}

	.popup-header {

		h4 {
			font-size: 1.875em;
			margin: 0;
		}

		p {
			font-size: 1.25em;
		}

		strong {
			font-size: 2em;
		}
	}

	.popup-content {
		width: 100%;
		margin: 0 0 1.25em 0;
	}

	.button-deal {
		
		img {
			display: block;
		}
	}

	.button-close {
		position: absolute;
		top: 5px;
		right: 10px;
	}

	
}

.popup-notification {
	position: fixed;
	left: 20px;
	bottom: 20px;
	background: $link-color;
	color: $white-color;
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	cursor: pointer;
	z-index: 99;
	@include border-radius(2px);
	@include single-transition(all, 0.02s, ease-in-out, 0.02s);

	&:hover {
		background: $bg-button-hover;
	}

}