/*
	CSS file for Standbérlés.hu
*/


/*	General	
------------------------------*/

	/* root variables */
	:root {
		--walton-purple: #4C4873;
		--walton-light-purple: #8D80FF;
	}

	* {
		padding: 0;
		margin: 0;
		outline: none;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}

	body {
		color: #616161;
		font-family: 'Poppins', sans-serif;
		background: #fff;
	}

	img,
	svg {
		display: block;
		max-width: 100%;
		height: auto;
	}

	a {
		color: inherit;
		text-decoration: none;
	}

	a img {
		border: 0;
	}

	a,
	svg,
	path,
	button {
		transition: all ease 0.4s;
	}

	.container {
		padding: 0 64px;
		margin: 0 auto;
	}

	.wrapper {
		min-height: 100vh;
		position: relative;
		overflow: hidden;
	}

		/*
		.wrapper:before {
			content: "";
			width: 1px;
			height: 100vh;
			top: 0;
			left: 50%;
			background: #ff0000;
			position: absolute;
		}
		*/

		.wrapper .bg-top-left {
			top: 0;
			left: 0;
			width: 524px;
			height: 287px;
			position: absolute;
			background: url('../img/bg-top-left-desktop.png') no-repeat top left / 100% auto;
		}

		.wrapper .bg-top-right {
			top: 0;
			right: 0;
			width: 205px;
			height: 147px;
			position: absolute;
			background: url('../img/bg-top-right-desktop.png') no-repeat top right / 100% auto;
		}

		.wrapper .bg-bottom-left {
			left: 0;
			bottom: 0;
			width: 194px;
			height: 270px;
			position: absolute;
			background: url('../img/bg-bottom-left-desktop.png') no-repeat bottom left / 100% auto;
		}

		.wrapper .bg-bottom-right {
			right: 0;
			bottom: 0;
			width: 430px;
			height: 531px;
			position: absolute;
			background: url('../img/bg-bottom-right-desktop.png') no-repeat bottom right / 100% auto;
		}


/*	Common Elements
-------------------------------------------*/

	/*
	 *	Button
	 */
	.btn {
		display: inline-flex;
		height: 48px;
		color: var(--walton-purple);
		font-size: 14px;
		font-weight: 700;
		line-height: 150%;
		align-items: center;
		justify-content: center;
		border-radius: 16px 0;
		border: 2px solid var(--walton-purple);
		box-sizing: border-box;
		padding: 0 20px 0 30px;
		background: #FFF;
		cursor: pointer;
	}

		.btn span {
			display: inline-flex;
			width: 16px;
			height: 8px;
			margin-left: 8px;
			overflow: hidden;
			position: relative;
			transition: all ease 0.4s;
		}

			.btn svg {
				min-width: 21px;
				width: 21px;
				height: 8px;
				right: 0;
				position: absolute;
				fill: var(--walton-purple);
			}

		.btn:hover {
			color: #fff;
			background: var(--walton-purple);
		}

			.btn:hover span {
				width: 20px;
			}

			.btn:hover svg {
				fill: #fff;
			}


	/*
	 *	Form
	 */
	.gform_ajax_spinner,
	.gform_validation_errors,
	.gform_validation_container,
	.gform_required_legend,
	.validation_error,
	.screen-reader-text,
	.gfield_visibility_hidden {
		display: none;
	}

	.gform_fields {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin: 0 -6px;
	}

	.gfield {
		width: calc(100% - 12px);
		margin: 0 6px 12px 6px;
	}

		.gfield .gfield_label {
			display: none;
		}

		.gfield input[type="text"],
		.gfield input[type="email"],
		.gfield textarea {
			display: block;
			width: 100%;
			height: 44px;
			padding: 10px 16px;
			color: #616161;
			font-family: Poppins, sans-serif;
			font-size: 14px;
			font-weight: 400;
			line-height: 22px;
			border-radius: 8px;
			border: 1px solid #616161;
			box-sizing: border-box;
			background: #fff;
		}

			.gfield input::placeholder,
			.gfield textarea::placeholder {
				opacity: 0.8;
			}

			.gfield input[type="text"]:focus,
			.gfield input[type="email"]:focus,
			.gfield textarea:focus {
				border-color: var(--walton-light-purple);
				box-shadow: 0 2px 32px 0 rgba(141, 128, 255, 0.10);
			}

		.gfield textarea {
			height: 247px;
			resize: none;
		}

			.gfield textarea.small {
				height: 88px;
			}

		.gfield--width-half {
			width: calc(50% - 12px);
		}

		.gfield--type-section {
			margin-bottom: 4px;
		}

			.gfield--type-section .gsection_title {
				color: #616161;
				font-size: 13px;
				font-weight: 700;
				line-height: 160%;
				padding-top: 4px;
			}
			
		.gfield--type-consent {
			border: 0;
			padding: 8px 0;
		}
		
			.gfield--type-consent input {
				display: none;
			}
		
			.gfield--type-consent label {
				display: block;
				font-size: 13px;
				line-height: 20px;
				padding-left: 27px;
				position: relative;
				cursor: pointer
			}
			
				.gfield--type-consent label a {
					color: var(--walton-purple);
					text-decoration: underline;
				}
				
				.gfield--type-consent label a:hover {
					text-decoration: none;
				}
			
			.gfield--type-consent label:before {
				content: "";
				top: 0;
				left: 0;
				width: 18px;
				height: 18px;
				border-radius: 4px;
				border: 1px solid #616161;
				position: absolute
			}
			
				.gfield--type-consent input:checked + label:before {
					border-color: var(--walton-purple);
					background: var(--walton-purple) url('../img/icon-tick.svg') no-repeat center center / 14px 14px;
				}

	.gform_footer .gform_button {
		width: 100%;
	}

	.gfield-product-details {
		padding-bottom: 12px;
	}

		.gfield-product-details h3 {
			display: flex;
			color: #616161;
			font-size: 14px;
			font-weight: 700;
			line-height: 160%;
		}

			.gfield-product-details h3 img {
				display: block;
				margin-left: 16px;
				cursor: pointer;
			}

		.gfield-product-details .details {
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
		}

			.gfield-product-details .details .item {
				width: calc(50% - 8px);
				color: #616161;
				font-size: 12px;
				line-height: 120%;
				margin-top: 8px;
			}

			.gfield-product-details .details .item strong {
				display: block;
				color: var(--walton-purple);
				font-size: 14px;
				font-weight: 700;
				line-height: 160%;
				margin-bottom: 2px;
			}

			.gfield-product-details .details .item em {
				font-style: normal;
			}
			
		.gfield-product-details .price {
			display: flex;
			align-items: center;
			margin-top: 24px;
		}

			.gfield-product-details .price .label {
				display: flex;
				align-items: center;
				color: #616161;
				font-size: 12px;
				font-weight: 400;
				line-height: 120%;
				margin-right: 32px;
			}

				.gfield-product-details .price .label img {
					display: block;
					margin-right: 8px;
				}

				.gfield-product-details .price .label span {
					display: block;
					color: var(--walton-purple);
					font-size: 16px;
					font-weight: 700;
					line-height: 120%;
				}

			.gfield-product-details .price .value {
				color: var(--walton-purple);
				font-size: 48px;
				font-weight: 700;
				line-height: 120%;
				letter-spacing: -0.96px;
			}	

	.validation_message {
		color: #fff;
		font-size: 10px;
		padding: 6px 16px;
		background: #F8306C;
		border-radius: 8px;
		margin-top: 2px;
	}


	/*
	 *	Select
	 */
	.select2-container {
		display: block;
		width: auto !important;
	}

		.select2-container--default .select2-selection--single {
			height: auto;
			border: 0;
			background: none !important;
			position: relative;
		}

		.select2-container .select2-selection--single .select2-selection__rendered {
			display: flex;
			align-items: center;
			width: 100%;
			color: var(--walton-purple);
			font-size: 14px;
			line-height: 22px;
			border-radius: 8px;
			padding: 10px 40px 10px 16px;
			background: #ffffff;
			border: 1px solid #616161;
			box-sizing: border-box;
		}

			.select2-container .select2-selection--single .select2-selection__rendered:hover {
				border-color: var(--walton-light-purple) !important;
			}

			.select2-container.select2-container--open .select2-selection__rendered {
				border-color: var(--walton-light-purple) !important;
			}

		.select2-container--default .select2-selection--single .select2-selection__arrow {
			top: 50%;
			right: 16px;
			width: 16px;
			height: 16px;
			margin-top: -8px;
			background: url('../img/icon-arrow-down.svg') no-repeat center center / 16px 16px;
			transition: all ease 0.4s;
		}

			.select2-container--open .select2-selection--single .select2-selection__arrow {
				transform: rotate(180deg);
			}

			.select2-container--default .select2-selection--single .select2-selection__arrow b {
				display: none;
			}

		.select2-dropdown {
			z-index: 9999;
			white-space: nowrap;
			border-radius: 8px !important;
			border: 1px solid var(--walton-purple) !important;
			background: #ffffff;
			box-shadow: 0 2px 32px 0 rgba(141, 128, 255, 0.15);
			overflow: hidden;
		}

			.select2-container--open .select2-dropdown--below {
				margin-top: 10px;
			}

			.select2-container--open .select2-dropdown--above {
				margin-top: -10px;
			}

			.select2-search--dropdown {
				display: none !important;
			}

			.select2-dropdown ul {
				margin: 0 !important;
			}

			.select2-results__options {
				max-height: 250px !important;
			}

			.select2-results__option {
				color: #161616;
				font-size: 14px;
				font-weight: 400;
				line-height: 160%;
				padding: 9px 16px;
				box-sizing: border-box;
			}

				.select2-container--default .select2-results__option[aria-selected=true] {
					background-color: #f1f1f1 !important;
				}

				.select2-container--default .select2-results__option--highlighted[aria-selected] {
					background-color: var(--walton-purple) !important;
				}


	/*
	 *	Datepicker
	 */
	.ui-datepicker {
		display: none;
		color: #616161;
		font-size: 13px;
		line-height: 18px;
		overflow-y: auto;
		text-align: center;
		background: #FFFFFF;
		border-radius: 8px;
		border: 1px solid var(--walton-purple);
		margin-top: 10px;
		padding: 10px;
	}

	.ui-datepicker .ui-datepicker-header {
		display: flex;
		align-items: center;
		height: 30px;
		margin-bottom: 6px;
		position: relative;
	}

	.ui-datepicker .ui-datepicker-title {
		width: 100%;
		color: #0E374D;
		font-size: 16px;
		font-weight: bold;
		line-height: 18px;
		text-align: center;
	}

	.ui-datepicker .ui-datepicker-prev,
	.ui-datepicker .ui-datepicker-next {
		top: 0;
		left: 0;
		width: 30px;
		height: 100%;
		position: absolute;
		cursor: pointer;
		background: url('../img/icon-arrow-left.svg') no-repeat center center / 30px 30px;
	}

	.ui-datepicker .ui-datepicker-next {
		left: auto;
		right: 0;
		background: url('../img/icon-arrow-right.svg') no-repeat center center / 30px 30px;
	}

	.ui-datepicker .ui-datepicker-prev span,
	.ui-datepicker .ui-datepicker-next span {
		display: none;
	}

	.ui-datepicker table {
		border: 0;
		border-collapse: collapse;
	}

	.ui-datepicker table th {
		color: #616161;
		font-size: 12px;
		padding: 5px 0;
		border: 0 !important;
		text-align: center;
	}

	.ui-datepicker table td {
		border-collapse: collapse;
		border-top: 1px solid rgba(255, 255, 255, 0.1);
		border-left: 1px solid rgba(255, 255, 255, 0.1);
		border-right: 0;
		border-bottom: 0;
		padding: 0;
	}

	.ui-datepicker table td a,
	.ui-datepicker table td span {
		display: block;
		color: #616161;
		font-size: 12px;
		text-decoration: none;
		padding: 6px 8px;
		text-align: center;
		border-radius: 8px;
	}

	.ui-datepicker table td a:hover {
		color: #ffffff;
		background: var(--walton-light-purple);
	}

	.ui-datepicker .ui-state-highlight {
		background: #eee;
	}

	.ui-datepicker .ui-state-active {
		color: #ffffff;
		background: var(--walton-purple);
	}

	.ui-datepicker .ui-state-disabled {
		opacity: 0.3;
		cursor: not-allowed;
	}

	
/*	Header
-------------------------------------------*/
	
	header {
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin: 32px 62px 24px 62px;
		position: relative;
		z-index: 5;
	}

		header .left {
			width: 160px;
		}

		header .logo {
			color: var(--walton-purple);
			font-size: 16px;
			font-weight: 700;
			line-height: normal;
			padding: 4px 12px;
			border: 1px solid var(--walton-purple);
		}

			header .logo:hover {
				color: var(--walton-light-purple);
				border-color: var(--walton-light-purple);
			}

		header .right {
			width: 160px;
		}

			.custom {
				display: flex;
				align-items: center;
				color: var(--walton-purple);
				font-size: 14px;
				font-weight: 700;
				line-height: 150%;
			}

				.custom svg {
					display: block;
					margin-right: 5px;
				}

				.custom:hover {
					color: var(--walton-light-purple);
				}

					.custom:hover svg {
						fill: var(--walton-light-purple);
					}

			header .back {
				display: none;
				width: 28px;
				height: 28px;
				align-items: center;
				justify-content: center;
				border: 1px solid var(--walton-purple);
				border-radius: 50%;
				position: absolute;
				top: 0px;
				right: 0px;
				opacity: 0;
				visibility: hidden;
			}

				header .back.show {
					opacity: 1;
					visibility: visible;
				}


	/*
	 *	Page Title
	 */
	.page-title {
		text-align: center;
	}

		.page-title h1,
		.page-title h2 {
			color: var(--walton-purple);
			font-size: 48px;
			font-weight: 700;
			line-height: 120%;
		}

		.page-title p {
			margin-top: 4px;
			font-size: 20px;
			font-weight: 400;
			line-height: 120%;
			margin-bottom: 32px;
		}

		.page-title ul {
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			list-style: none;
			color: var(--walton-purple);
			font-size: 14px;
			font-weight: 400;
			line-height: 16px;
			margin: 8px 0 27px 0;
			padding: 0 10px;
		}

			.page-title ul li {
				display: flex;
				margin-bottom: 8px;
			}

			.page-title ul li:after {
				content: "";
				display: block;
				width: 1px;
				height: 16px;
				margin: 0 8px;
				background: var(--walton-purple);
			}

			.page-title ul li:last-child:after {
				display: none;
			}


	/*
	 *	Steps
	 */
	.steps {

	}

		.steps .swiper-slide {
			width: auto;
			color: #161616;
			font-size: 24px;
			font-weight: 700;
			line-height: 160%;
			text-align: center;
		}

			.steps .swiper-slide span {
				display: inline-flex;
				position: relative;
				align-items: center;
				text-align: center;
				opacity: 0.1;
				transition: all ease 0.4s;
			}

				.steps .swiper-slide span:before {
					opacity: 0;
					content: "";
					display: block;
					width: 382px;
					height: 1px;
					margin-right: 32px;
					background: linear-gradient(90deg, rgba(141, 128, 255, 0.10) 0%, #8D80FF 100%);
					transition: all ease 0.4s;
				}

				.steps .swiper-slide span:after {
					opacity: 0;
					content: "";
					display: block;
					width: 382px;
					height: 1px;
					margin-left: 32px;
					background: linear-gradient(270deg, rgba(141, 128, 255, 0.10) 0%, #8D80FF 100%);
					transition: all ease 0.4s;
				}

			.steps .swiper-slide-active span,
			.steps .swiper-slide-active span:before,
			.steps .swiper-slide-active span:after {
				opacity: 1;
			}

			.steps .swiper-slide:first-child span:before,
			.steps .swiper-slide:last-child span:after {
				opacity: 0 !important;
			}



/*	Pages
-------------------------------------------*/

	.pages {
		overflow: visible;
	}

	.pages .swiper-slide {
		opacity: 0;
		visibility: hidden;
		padding-bottom: 70px;
		transition: all ease 0.6s;
	}

		.pages .swiper-slide-active {
			opacity: 1;
			visibility: visible;
		}

		.pages .step-2 .container {
			max-width: 1336px;
			display: flex;
			justify-content: center;
			padding-top: 20px;
		}

		.pages .step-3 .container {
			max-width: 1090px;
			display: flex;
			justify-content: center;
			padding-top: 20px;
		}

		.pages .step-4 .container {
			max-width: 1114px;
			display: flex;
			justify-content: center;
			padding-top: 20px;
		}

	.pages .back {		
		margin-top: -15px;
		position: absolute;
		text-align: center;
	}

		.pages .back a {
			display: inline-flex;
			align-items: center;
			color: #616161;
			font-size: 14px;
			font-weight: 700;
			line-height: 22px;
		}

			.pages .back a svg {
				display: block;
				margin-top: 1px;
				margin-right: 8px;
			}

	.pages .home-bottom {
		display: none;
		flex-direction: column;
		align-items: center;
		padding: 0 0 42px 0;
	}

		.pages .home-bottom:before {
			content: "";
			display: block;
			width: 24px;
			height: 1px;
			margin-bottom: 32px;
			background: var(--walton-light-purple);
		}


/*	Products listing
-------------------------------------------*/

	/*
	 *	Product Item
	 */
	.product-item {
		width: calc(25% - 24px);
		text-align: center;
		margin: 0 12px 64px 12px;
	}

		.product-item h3 {
			font-size: 20px;
			font-weight: 700;
			line-height: 160%;
		}

		.product-item p {
			font-size: 16px;
			font-weight: 400;
			line-height: 160%;
		}

		.product-item .image {
			display: block;
			width: 100%;
			height: 264px;
			margin: 16px 0;
		}

			.product-item .image img {
				width: 100%;
				height: 100%;
				object-fit: contain;
				transform: scale(1);
				transition: all ease 0.3s;
			}
				
			.product-item .image:hover img {	
				transform: scale(1.1);
			}

		.product-item .btn {
			width: 100%;
			max-width: 175px;
		}

	/*
	 *	Product Category
	 */
	.product-category {
		width: calc(50% - 48px);
		max-width: 420px;
		margin-left: 24px;
		margin-right: 24px;
	}

		.product-category {

		}


	/*
	 *	Product List
	 */
	.product-list {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		padding-bottom: 16px;
		margin: 48px auto 0 auto;
	}

		.product-list[data-col="2"] {
			justify-content: center;
		}

		.product-list[data-col="3"] {
			justify-content: center;
			margin-left: -40px;
			margin-right: -40px;
		}

			.product-list[data-col="3"] .product-item {
				margin-left: 40px;
				margin-right: 40px;
			}

		.product-list[data-col="4"] {
			margin-left: -24px;
			margin-right: -24px;
		}


/*	Products Single
-------------------------------------------*/

	.product-single {
		width: 100%;
		display: flex;
		justify-content: space-between;
		margin-top: 24px;
		margin-bottom: 40px;
	}

		.product-single .details {
			width: 420px;
		}

			.product-single h4 {
				color: var(--walton-purple);
				font-size: 16px;
				font-weight: 700;
				line-height: 160%;
				margin: 24px 0 4px 0;
			}

				.product-single h4:first-child {
					margin-top: 0;
				}

			.product-single .floor-selector {
				display: flex;
				justify-content: space-between;
			}

				.product-single .floor-selector label {
					width: calc(50% - 12px);
					height: 44px;
					display: flex;
					align-items: center;
					justify-content: center;
					color: #616161;
					text-align: center;
					font-size: 14px;
					font-weight: 500;
					line-height: 150%;
					padding: 17px 0;
					border-radius: 48px;
					border: 1px solid #616161;
					box-sizing: border-box;
					cursor: pointer;
					transition: all ease 0.4s;
				}

					.product-single .floor-selector label input {
						display: none;
					}

					.product-single .floor-selector label:hover {
						border-color: var(--walton-light-purple);
					}

				.product-single .floor-selector label:has(input:checked) {
					color: #fff;
					background: var(--walton-purple);
					border-color: var(--walton-purple);
				}

			.product-single .size-selector {
				display: flex;
			}

				.product-single .size-selector .option {
					width: calc(50% - 12px);
				}

					.product-single .size-selector .option + .option {
						margin-left: 16px;
					}

				.product-single .size-selector .option label {
					display: block;
					color: #616161;
					font-size: 14px;
					font-weight: 400;
					line-height: 160%;
					margin-bottom: 8px;
				}

			.product-single .description {
				color: #616161;
				font-size: 14px;
				font-weight: 400;
				line-height: 160%;
			}

				.product-single .description ul {
					padding-left: 20px;
				}

				.product-single .description ul li::marker {
					font-size: 12px;
				}

			.product-single .price {
				display: flex;
				align-items: center;
				margin-top: 24px;
			}

				.product-single .price .label {
					display: flex;
					align-items: center;
					color: #616161;
					font-size: 12px;
					font-weight: 400;
					line-height: 120%;
					margin-right: 32px;
				}

					.product-single .price .label img {
						display: block;
						margin-right: 8px;
					}

					.product-single .price .label span {
						display: block;
						color: var(--walton-purple);
						font-size: 16px;
						font-weight: 700;
						line-height: 120%;
					}

				.product-single .price .value {
					color: var(--walton-purple);
					font-size: 48px;
					font-weight: 700;
					line-height: 120%;
					letter-spacing: -0.96px;
				}

			.product-single .btn {
				width: 100%;
				margin-top: 24px;
			}

		.product-single .image {
			display: flex;
			align-items: center;
			width: calc(100% - 460px);
			height: 480px;
			max-width: 535px;
		}

			.product-single .image {

			}


	/*	
	 *	Product Viewer
	 */
	.product-viewer-wrapper {
		width: 100%;
		height: 100%;
		position: relative;
	}

		.product-viewer-wrapper .product-viewer {
			position: relative;
			z-index: 1;
			display: flex;
			overflow: hidden;
			width: 100%;
			height: 100%;
		}

		.product-viewer-wrapper img {
			display: block;
			position: relative;
			z-index: 1;
		}

			.product-viewer-wrapper.loaded .wp-post-image {
				display: none;
			}

		.product-viewer-wrapper .product-sprite {
			position: absolute;
			z-index: 2;
			top: 0;
			left: 0;
			width: 3600%;
			height: 100%;
			background-size: 100%;
			background-repeat: no-repeat;
			background-position: center center;
			opacity: 0;
			transition: opacity 0.3s;
		}

		.product-viewer-wrapper .product-sprite-overlay {
			display: none;
			z-index: 5;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			position: absolute;
		}

		.product-viewer-wrapper.loaded .product-sprite {
			opacity: 1;
			cursor: ew-resize;
		}
			
		.product-viewer-wrapper .instructions {
			z-index: 3;
			top: 50%;
			left: 50%;
			display: flex;
			align-items: center;	
			color: #4C4873;
			font-size: 16px;
			font-weight: 600;
			line-height: 150%;
			text-align: center;
			visibility: visible;
			position: absolute;
			border-radius: 48px;
			padding: 14px 20px 14px 16px;
			background: rgba(255, 255, 255, 0.60);
			box-shadow: 0 2px 48px 0 rgba(141, 128, 255, 0.35);
			backdrop-filter: blur(2px);
			transform: translate(-50%, -50%);
			transition: all ease 0.4s;
			opacity: 1;
		}

			.product-viewer-wrapper:hover .instructions {
				opacity: 0;
				visibility: hidden;
			}

			.product-viewer-wrapper .instructions img {
				display: block;
				margin-right: 8px;
			}

		.loaded .product-viewer-handle {
			display: none;
		}


/*	Form
-------------------------------------------*/

	.quote-form {
		width: 100%;
		display: flex;
		justify-content: space-between;
		margin: 32px 0;
	}

		.quote-form .image {
			width: 50%;
			max-width: calc(100% - 480px);
			margin-top: 32px;
		}
		
		.quote-form .image video {
			width: 100%;
			height: auto;
		}

		.form-wrapper {
			width: 446px;
			background: #FFF;
			padding: 32px;
			border-radius: 36px 0px;
			box-shadow: 0 2px 64px 0 rgba(141, 128, 255, 0.20);
			box-sizing: border-box;
		}

	.quote-form.centered {
		justify-content: center;
	}


/*	Thank you
-------------------------------------------*/

	/*
	.page-thank-you header {
		margin-top: 88px;
	}
	*/

	.page-thank-you .custom {
		opacity: 0;
		visibility: hidden;
	}

	.page-thanks {
		display: flex;
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh;
		position: fixed;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}

		.page-thanks h2 {
			color: var(--walton-purple);
			text-align: center;
			font-size: 48px;
			font-weight: 700;
			line-height: 120%;
			margin-bottom: 40px;
		}

		.page-thanks .btn {
			width: 100%;
			max-width: 240px;
		}


/*	Product popup
-------------------------------------------*/

	.popup {
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 9005;
		overflow: auto;
		position: fixed;
		background: rgba(255, 255, 255, 0.50);
		backdrop-filter: blur(2px);
		opacity: 0;
		visibility: hidden;
		transition: all ease 0.3s;
	}

		.popup.show {
			opacity: 1;
			visibility: visible;
		}

	.popup .inner {
		display: table;
		width: 100%;
		height: 100vh;
		vertical-align: middle;
	}

		.popup .inner .tr {
			padding: 20px;
			display: table-cell;
			vertical-align: middle;
		}

	.popup .box {
		max-width: 480px;
		margin: 0 auto;
		padding: 24px;
		position: relative;
		border-radius: 10px;
		background: #ffffff;
		box-shadow: 0 2px 40px 0 rgba(141, 128, 255, 0.2);
		transform: translate3d(0px, 50px, 0px);
		transition: all ease 0.5s 0s;
		box-sizing: border-box;
		opacity: 0;
	}

		.popup.show .box {
			opacity: 1;
			transform: translate3d(0px, 0px, 0px);
		}

		.popup .close {
			top: 12px;
			right: 12px;
			width: 40px;
			height: 40px;
			display: flex;
			align-items: center;
			justify-content: center;
			position: absolute;
		}

		.popup .head {

		}

			.popup .head h3 {
				color: #616161;
				font-size: 16px;
				font-weight: 700;
				line-height: 160%;
			}

		.popup h4 {
			color: var(--walton-purple);
			font-size: 16px;
			font-weight: 700;
			line-height: 160%;
			margin-top: 16px;
			margin-bottom: 4px;
		}

			.popup h4:first-child {
				margin-bottom: 8px;
			}

		.popup .products-selector {
			margin: 16px -24px 0 -24px;
		}

			.popup .swiper-slide {
				width: 270px;
				padding: 16px;
				border-radius: 10px;
				border: 1px solid #616161;
				background: #fff;
				box-shadow: 0 2px 32px 0 rgba(141, 128, 255, 0.08);
				box-sizing: border-box;
				position: relative;
				transition: none;
			}

				.popup .swiper-slide.selected {
					padding: 14px;
					border: 3px solid var(--walton-purple);
				}

				.popup .swiper-slide h5 {
					color: #616161;
					text-align: center;
					font-size: 14px;
					font-weight: 700;
					line-height: 160%;
					margin-bottom: 4px;
				}

				.popup .swiper-slide .image {
					width: 100%;
					height: 204px;
					position: relative;
				}

					.popup .swiper-slide .image img {
						width: 100%;
						height: 100%;
						object-fit: contain;
						object-position: center center;
					}

		.popup .floor-selector {
			display: flex;
			justify-content: space-between;
		}

		.popup .floor-selector label {
			width: calc(50% - 12px);
			height: 44px;
			display: flex;
			align-items: center;
			justify-content: center;
			color: #616161;
			text-align: center;
			font-size: 14px;
			font-weight: 500;
			line-height: 150%;
			padding: 17px 0;
			border-radius: 48px;
			border: 1px solid #616161;
			box-sizing: border-box;
			cursor: pointer;
			transition: all ease 0.4s;
		}

			.popup .floor-selector label input {
				display: none;
			}

			.popup .floor-selector label:hover {
				border-color: var(--walton-light-purple);
			}

			.popup .floor-selector label:has(input:checked) {
				color: #fff;
				background: var(--walton-purple);
				border-color: var(--walton-purple);
			}

		.popup .size-selector {
			display: flex;
		}

			.popup .size-selector .option {
				width: calc(50% - 12px);
			}

				.popup .size-selector .option + .option {
					margin-left: 16px;
				}

				.popup .size-selector .option label {
					display: block;
					color: #616161;
					font-size: 14px;
					font-weight: 400;
					line-height: 160%;
					margin-bottom: 8px;
				}

		.popup .btn {
			width: 100%;
			margin-top: 24px;
		}


/*	Responsive
-------------------------------------------*/

@media (max-width: 1260px)
{
	.container { padding: 0 32px; }

	header { margin-left: 32px; margin-right: 32px; }

	.steps .swiper-slide { font-size: 22px; }
	.steps .swiper-slide span:before { width: 300px; }
	.steps .swiper-slide span:after { width: 300px; }

	.wrapper .bg-top-left { width: 430px; }
	.wrapper .bg-bottom-right { width: 352px; }

	.page-title h1, .page-title h2 { font-size: 44px; }
	.page-title p { font-size: 18px; }

	.product-item h3 { font-size: 18px; }
	.product-item p { font-size: 15px; }
	.product-item .image { height: 210px; }

	.product-single .price .value { font-size: 44px; }

	.page-thanks h2 { font-size: 44px; }
}

@media (max-width: 1023px)
{
	.steps .swiper-slide { font-size: 22px; }
	.steps .swiper-slide span:before { width: 300px; }
	.steps .swiper-slide span:after { width: 300px; }

	.wrapper .bg-top-left { width: 280px; }
	.wrapper .bg-bottom-left { width: 160px; }
	.wrapper .bg-top-right { width: 170px; }
	.wrapper .bg-bottom-right { width: 290px; }


	.page-title h1, .page-title h2 { font-size: 40px; }
	.page-title p { font-size: 18px; }

	.product-item { width: calc(33.33% - 24px); }

	.product-single .details { width: 350px; }
	.product-single .price .value { font-size: 40px; }
	.product-single .image { width: calc(100% - 370px); }
	.product-single .floor-selector label { font-size: 12px; width: calc(50% - 8px); }
	.product-viewer-wrapper .instructions { font-size: 14px; min-width: 210px; white-space: nowrap; }

	.select2-container .select2-selection--single .select2-selection__rendered { font-size: 13px; }

	.form-wrapper { width: 50%; padding: 16px; border-radius: 24px 0; z-index: 2; position: relative; }
	.quote-form .image { max-width: calc(50% - 20px); }

	.page-thanks h2 { font-size: 40px; }
}

@media (max-width: 767px)
{
	.container { padding: 0 16px; }

	.wrapper .bg-top-left { width: 172px; height: 160px; z-index: -1; background-image: url('../img/bg-top-left-mobile.png'); }
	.wrapper .bg-top-right { width: 102px; height: 73px; z-index: -1; }
	.wrapper .bg-bottom-left { width: 86px; height: 123px; z-index: -1; }
	.wrapper .bg-bottom-right { width: 275px; height: 272px; z-index: -1; background-image: url('../img/bg-bottom-right-mobile.png'); }

	header { margin: 54px 16px 16px 16px; }
	header .logo { font-size: 12px; padding: 4px 12px; }
	header .right .custom { display: none; }
	header .back { display: flex; }

	.page-title h1 { max-width: 210px; margin-left: auto; margin-right: auto; }
	.page-title h1, .page-title h2 { font-size: 24px; }
	.page-title p { font-size: 16px; line-height: 140%; margin: 8px auto 24px auto; color: var(--walton-purple); max-width: 330px; }
	.page-title ul { font-size: 12px; margin-bottom: 16px; margin-top: 12px; }

	.steps .swiper-slide { font-size: 20px; }
	.steps .swiper-slide span:before { width: 16px; margin-right: 8px; }
	.steps .swiper-slide span:after { width: 16px; margin-left: 8px; }

	.pages .swiper-slide { padding-bottom: 48px; }
	.pages .home-bottom { display: flex; margin-top: 48px; }
	.pages .back { display: none; }

	.product-list { margin-top: 24px; padding-bottom: 0; }

	.product-item { width: 100%; margin: 0 0 48px 0; }
	.product-item p { font-size: 14px; margin-top: 4px; max-width: 260px; margin-left: auto; margin-right: auto; }
	.product-item .image { margin-top: 12px; margin-bottom: 12px; height: 255px; }
	.product-item:last-child { margin-bottom: 0; }

	.page-thanks h2 { font-size: 24px; margin-bottom: 32px; }

	.product-single { flex-direction: column; margin-bottom: 0; }
	.product-single .image { order: 1; width: 100%; height: px; }
	.product-single .details { order: 2; padding-top: 24px; width: 100%; }
	.product-single .floor-selector label { width: calc(50% - 8px); font-size: 12px; }
	.product-single .size-selector { display: block; }
	.product-single .size-selector .option { width: 100%; }
	.product-single .size-selector .option + .option { margin-left: 0; margin-top: 12px; }
	.product-single .price { margin-top: 32px; display: block; }
	.product-single .price .label { margin-right: 0; margin-bottom: 8px; }
	.product-single .price .value { font-size: 48px; }
	
	.product-viewer-wrapper .instructions { bottom: 10px; top: auto; }
	.product-viewer-wrapper .instructions img { width: 24px; height: 24px; }

	.form-wrapper { width: 100%; }

	.gfield input[type="text"], .gfield input[type="email"], .gfield textarea { font-size: 13px; }

	.quote-form { flex-direction: column; margin-bottom: 0; }
	.quote-form .form-wrapper { order: 2; }
	.quote-form .image { order: 1; width: 100%; max-width: 100%; height: 296px; margin: 0 0 24px 0; }

	.gfield-product-details { padding-top: 12px; }
	.gfield-product-details .details { display: block; padding-top: 2px; }
	.gfield-product-details .details .item { display: flex; font-size: 14px; width: 100%; margin-top: 10px; }
	.gfield-product-details .details .item em { width: 96px; order: 1; }
	.gfield-product-details .details .item strong { order: 2; margin-bottom: 0; }

	.popup .box { border-radius: 0; width: 100vw; max-width: 100%; padding: 20px 16px; }
	.popup .inner .tr { padding: 0; }
	.popup .head { border-bottom: 1px solid rgba(97, 97, 97, 0.5); padding-bottom: 12px; }
	.popup .head h3 { max-width: 200px; }
	.popup .products-selector { margin-left: -16px; margin-right: -16px; }
	.popup .swiper-slide { width: 242px; padding: 12px 16px 18px 16px; }
	.popup .swiper-slide .image { height: 184px; }
	.popup .swiper-slide.selected { padding: 10px 14px 16px 14px; }
	.popup .floor-selector label { width: calc(50% - 8px); font-size: 12px; }
	.popup .size-selector { display: block; }
	.popup .size-selector .option { width: 100%; }
	.popup .size-selector .option + .option { margin-left: 0; margin-top: 12px; }
	.popup h4:first-child { margin-top: 12px; }
	
}