@import "variables";

.p-order-result {
	padding-top: 100px;
	padding-bottom: 68px;
	font-size: 16px;
	text-align: center;
	@media (max-width: 767px){
		padding-top: 32px;
		padding-bottom: 0;
	}
	.color-green { color: #2DB92D !important; }
	.result {
		font-size: 16px;
		.result-icon {
			margin-bottom: 24px;
			svg {
				display: block;
				width: 80px;
				height: 80px;
				margin: 0 auto;
				@media(max-width: 991px){
					width: 60px;
					height: 60px;
				}
				@media(max-width: 767px){
					width: 48px;
					height: 48px;
				}
			}
		}
		.result-title {
			margin: 0 auto;
			font-size: 34px;
			font-weight: bold;
			line-height: 41px;
			text-align: center;
			@media (max-width: 767px){
				font-size: 22px;
				line-height: 1.25;
			}
		}
		.result-description {
			max-width: 400px;
			margin: 16px auto 0;
			font-size: 16px;
			font-weight: bold;
			@media (max-width: 767px){
				font-size: 14px;
			}
		}
		.result-description-email {
			max-width: 540px;
			margin: 0 auto;
			//font-weight: bold;
			font-size: 16px;
			color: #333;
			//text-align: left;
		}
		.result-description-sep {
			background: #DDE4EC;
			display: block;
			width: 200px;
			height: 1px;
			margin: 0 auto;
		}
		.result-text {
			font-size: 16px;
			font-weight: bold;
			@media (max-width: 767px){
				font-size: 14px;
			}
		}
		.result-payment {
			display: flex;
			flex-wrap: wrap;
			max-width: 600px;
			margin: 0 auto;
			padding: 0;
			list-style: none;
			& > li {
				width: 50%;
				padding: 8px;
				@media(max-width: 575px){
					width: 100%;
					padding: 8px 0;
				}
			}
			.pop-button {
				background: transparent;
				border: 1px solid $color_gray_10;

				position: relative;
				overflow: hidden;
				display: block;
				height: 110px;
				@media (max-width: 767px) {
					height: 90px;
				}
				@media (max-width: 449px) {
					height: 60px;
				}
				color: $color_dark;
				text-align: center;
				@include border-radius(3px);
				@include transition();
				@include box-shadow(0 2px 7px 0 rgba(0,0,0,0.1));

				img {
					position: absolute; top: 50%; left: 50%;
					display: block;
					max-width: 70%;
					max-height: 50%;
					@include transform(translateX(-50%) translateY(-50%));
				}

				&:hover {
					background: transparent;
					@include box-shadow(0 0 15px 0 rgba(50, 50, 50, 0.3));
				}
			}
		}
		.result-return {
			margin-top: 8px;
		}
		.result-freon {
			background: #ffefc1;
			max-width: 660px;
			margin: 0 auto 24px;
			padding: 16px;
			text-align: left;
		}
	}
	.pull {
		background: $color_gray_10;
		max-width: 400px;
		margin: 32px auto 0;
		padding: 32px 52px;
		@media (max-width: 575px){
			max-width: none;
			margin-left: -12px;
			margin-right: -12px;
			padding: 24px;
		}
		.pull-title {
			font-weight: bold;
		}
		.pull-description {
			margin-top: 8px;
			line-height: 1.25;
		}
		.pull-button {
			margin-top: 16px;
		}
	}
}

.p-order-result__registration {
	display: block;
	//flex-direction: column;
	max-width: 540px;
	margin: 0 auto;
	text-align: left;
	.por-registration__form {
		//margin-top: 40px;
		h6,.h6 {
			margin-bottom: 12px;
			font-size: 16px;
		}
		.form-group {
			.form-label {
				margin-bottom: 3px;
			}
			.form-field {
				max-width: 250px;
			}
			/*.form-control {
				height: 40px;
			}*/
		}
		.btn {
			padding: 7px 24px 9px;
			font-size: 16px;
			line-height: 1.5;
		}
	}
	.por-registration__advantages {
		margin: 50px 0 0 0;
		padding: 0;
		list-style: none;
		dt {
			padding-bottom: 8px;
			font-size: 16px;
		}
		dd {
			position: relative;
			margin-top: 4px;
			padding-left: 24px;
			&:before {
				content: "\f00c";
				position: absolute; top: 5px; left: 0;
				display: block;
				font-family: 'FontAwesome';
				font-size: 12px;
				color: $green;
			}
		}
	}
}