*{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html{
	margin-top: 0!important;
}

body{
	display: flex;
	flex-direction: column;
	width: 100%;
	min-height: 100vh;
	margin: 0;
	font-family: 'Lato', sans-serif;
	font-size: 16px;
	line-height: 1.4;
	font-weight: 300;
}

body a{
	color: #f37657;
}

.small-text{
	font-size: 16px;
}
p,
h1,
h2,
h3,
h4,
h5{
	font-family: 'Lato', sans-serif;
}

h2{
	width: 100%;
	margin: 0 auto 10px;
	font-size: 32px;
	line-height: 1.3;
	font-weight: 300!important;
	letter-spacing: 0px;
	text-align:	center;
	color: #3B506C;
}
h3{
	display: inline-block;
	width: 100%;
	text-align: center;
	margin: 0 0 10px;
	font-size: 18px;
	line-height: 1.5;
	font-weight: 400;
	color: #3B506C;
}

ol:not(.wp-block), ul:not(.wp-block){
	margin: 0;
}

.bullet-list{
	max-width: 100%;
	width: 430px;
	margin: 0 0 35px;
}
.bullet-list h3{
	font-size: 21px;
	text-align: left;
	margin-bottom: 15px;
}
.bullet-list  ul{
	width: fit-content;						
}
	.bullet-list  ul li{
		list-style-type: none;
		position: relative;
		padding: 0 0 10px 35px;
		font-size: 17px;
		font-weight: 400;
		color: #808080;
	}
	.bullet-list  ul li:before{
		content: '';
		position: absolute;
		top: calc(50% - 12px);
		left: 0;
		width: 24px;
		height: 17px;
		background-image: url(/wp-content/themes/webon/templates/images/signup-waitlist-checkmark.png);
		background-size: contain;
		background-repeat: no-repeat;
		background-position: center;
	}

.orange{
	color: #f37657;
}

img{
	max-width: 100%;
}

.container{
	display: block;
	max-width: 100%;
	width: 1640px;
	margin: 0 auto;
	padding: 0 20px;
}

.et_pb_section{
	padding: 0!important;
}
.blog-article__text.t-s p:last-of-type{
	margin-bottom: 0;
}


.signup-split{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	margin: 0;
}
	.signup-split .column{
		display: flex;
		flex-direction: column;
		padding: 40px 90px 40px;
		/* justify-content: center; */
		align-items: center;
		min-height: 100vh;
	}
	.signup-split .column:nth-child(1){
		align-items: flex-end;
		width: 53%;
	}
	.signup-split .column:nth-child(2){
		align-items: flex-start;
		width: 47%;
		padding: 120px 90px 40px;
		background-color: #F5F5F5;
	}
		.signup-split .column .column-inner{
			display: flex;
			flex-direction: column;
			align-items: center;
			max-width: 100%;
			width: 600px;
		}

	.content{
		display: block;
		max-width: 100%;
		width: 600px;
		margin: 0 auto;
	}
		.content h2{
			margin-bottom: 35px;
		}
		.content h3{
			margin-bottom: 35px;
		}

	.testimonial{
		margin: 45px 0 40px;
	}
	.testimonial.n2{
		display: none;
	}
		.testimonial .image{
			max-width: 100%;
			width: 436px;
			text-align: center;
		}
		.testimonial .quote{
			max-width: 100%;
			width: 436px;
		}
		.testimonial .quote p{
			margin-bottom: 25px;
			font-size: 18px;
			font-weight: 400;
			line-height: 1.5;
			color: #808080;
		}
		.testimonial .quote .author{}
			.testimonial .quote .author span{
				display: inline-block;
				width: 100%;
				font-weight: 400;
			}
			.testimonial .quote .author .name{
				font-size: 14px;
				color: #F37657;
			}
			.testimonial .quote .author .loca{
				font-size: 12px;
				color: #808080;
			}
@media(max-width: 424px){
	.content h3 .small-text{
		font-size: 15px;
	}
}




div.header{
	padding: 0 0 40px 0;
}
	div.header .logo{
		text-align: center;
	}
		div.header .logo img{
			max-width: 207px;
			height: auto;
		}

	@keyframes loader {
		0% { transform: translate(-50%,-50%) rotate(0deg); }
		100% { transform: translate(-50%,-50%) rotate(360deg); }
	}
	.form-box{
		width: 100%;
	}
	.form-box .loader-bg{
		display: none;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 99999;
		width: 100%;
		height: 100%;
		background-color: rgba(255,255,255,.5);
	}
	.form-box .loader-bg.show{
		display: block;
	}
	.form-box .loader-contain {
		position: absolute;
		top: calc(50% - 100px);
		left: calc(50% - 100px);
		width: 200px;
		height: 200px;
		display: inline-block;
		overflow: hidden;
		background: none;
	}
		.form-box .loader {
			width: 100%;
			height: 100%;
			position: relative;
			transform: translateZ(0) scale(1);
			backface-visibility: hidden;
			transform-origin: 0 0; /* see note above */
		}
			.form-box .loader div {
				position: absolute;
				width: 100px;
				height: 100px;
				border: 5px solid #3b506c;
				border-top-color: transparent;
				border-radius: 50%;
				animation: loader 1s linear infinite;
				top: 100px;
				left: 100px
			}
		.loader-bg .load-status{
			position: absolute;
			left: 0;
			top: calc(50% + 100px);
			display: inline-block;
			width: 100%;
			text-align: center;
			font-weight: 700;
			color: #3c516d;
		}

	.form-box .loader div { box-sizing: content-box; }

	.form-box .fields-contain{
		max-width: 100%;
		width: 375px;
		margin: 0 auto 30px;
	}
	.populate-email{
		color: #F37657;
	}
	.form-box form{
		max-width: 100%;
		width: 450px;
		margin: 0 auto;
	}
		.form-box form .fields{
			display: flex;
			flex-direction: row;
			flex-wrap: wrap;
			gap: 20px;
		}
			.form-box form .fields .field-box{
				position: relative;
				width: 100%;
			}
			.form-box form .fields .field-box.half{
				width: calc(50% - 10px);
			}
				.form-box form .fields span.error{
					position: absolute;
					bottom: -19px;
					left: 0;
					display: none;
					font-size: 12px;
					width: 100%;
					color: red;
				}
				.form-box form .fields .field-box.error .error{
					display: inline-block;
				}
				.form-box form input:not([type=submit],[type=radio]){
					width: 100%;
					line-height: 1;
					margin-bottom: 0;
					padding: 7px 0px;
					font-family: 'Lato', sans-serif;
					font-size: 14px;
					font-weight: 400;
					color: #353535;
					background-color: #FFF;
					outline: none;
					border-bottom: 1px solid #C8C8C8;
				}
				.form-box form input.exists{
					border-color: #f37657;
				}
				.form-box form .field-box.error input:not([type=submit],[type=radio]){
					border-color: #ff7171;
				}
				.form-box form input:not([type=submit],[type=radio]).half{
/*							width: calc(50% - 10px);*/
				}
				.form-box form input:not([type=submit],[type=radio])::placeholder{
					color: #8B8B8B;
					font-weight: 400;
				}
				.form-box form input[type=submit],
				.form-box form button{
					width: 100%;
					text-align: center;
					padding: 12px 30px;
					font-family: 'Lato', sans-serif;
					font-size: 14px;
					line-height: 1;
					font-weight: 700;
					background-color: #f37657;
					color: #FFF;
					border: 0;
					border-radius: 0;
					cursor: pointer;
					transition: all .2s;
				}
				.form-box form input[type=submit]:hover,
				.form-box form button:hover{
					background-color: #dc6644;
					color: #FFF;
					border: 0;
					border-radius: 0;
				}


				.form-box form .step-1{

				}
					.form-box form .step-1 .notice{
						display: inline-block;
						width: 100%;
						margin-bottom: 20px;
						text-align: center;
						font-size: 12px;
						font-weight: 400;
						color: #8B8B8B;
					}
					.form-box form .step-1 .login{
						display: inline-block;
						width: 100%;
						text-align: center;
						font-size: 14px;
						font-weight: 700;
						letter-spacing: 0px;
						color: #3B506C;
						text-decoration: none;
					}
				.form-box form .step-2,
				.form-box form .submission{
					display: none;
				}
				.form-box form .submission{
				}
					.form-box form .step-2 .title{
						padding: 0;
						border: 0;
					}
					.form-box form .step-2 .tos-box{
						padding: 20px 12px 20px 20px;
						border: 1px solid #8B8B8B;
					}
						.form-box form .step-2 .tos-box .tos-content{
							display: block;
							max-height: 350px;
							padding-right: 11px;
							overflow-y: auto;
						}
						.form-box form .step-2 .tos-content::-webkit-scrollbar {
							width: 7px;
							margin-right: 5px;
						}
						.form-box form .step-2 .tos-content::-webkit-scrollbar-track {
							background-color: transparent;
						}
						.form-box form .step-2 .tos-content::-webkit-scrollbar-thumb {
							background-color: #D9D9D9;
							border-radius: 4px;
						}
							.form-box form .step-2 .tos-box .tos-content .et_pb_row{
								width: 100%;
								margin: 0;
								padding: 0;
							}
					.form-box form .step-2 .checkbox{
						display: flex;
						flex-direction: row;
						align-items: center;
						justify-content: flex-start;
						margin: 20px 0;
					}
					.form-box form .step-2 .checkbox input{
						width: 16px;
						height: 16px;
						margin-right: 13px;
						border-radius: 0;
						cursor: pointer;
					}
					.form-box form .step-2 .checkbox input:checked{
						accent-color: #3B506C;
					}
					.form-box form .step-2 .checkbox label{
						cursor: pointer;
					}
					.form-box form .step-2 button[type=submit]{
						display: flex;
						justify-content: center;
						width: 130px;
						margin-left: auto;
					}
					.form-box form .step-2 button[type=submit]:disabled{
						background-color: #e3e3e3;
						cursor: initial;
					}

			.form-box .submission .title{
				margin: 0 auto 15px;
				padding: 0;
				border: 0;
			}
			.form-box .submission .sub-header{
				display: inline-block;
				width: 100%;
				text-align: center;
				font-size: 18px;
				font-weight: 400;
				color: #3B506C;
			}
			.form-box .submission .intro-text{
				font-size: 18px;
				line-height: 1.6;
			}
			.form-box .submission .delivery{
				display: inline-block;
				width: 100%;
				margin: 30px 0 35px;
				text-align: center;
				font-size: 18px;
				font-weight: 700;
				color: #3B506C;
			}
				.form-box .submission .delivery .resend{
					display: inline-block;
					width: 100%;
					text-align: center;
					text-decoration: none;
					color: #F37657;
					font-weight: 400;
				}
				.form-box .submission .delivery .resend.resent{
					color: #8b8b8b;
					pointer-events: none;
				}

				.submit-text{
					display: inline-block;
					width: 100%;
					font-size: 22px;
					text-align: center;
				}

@media(max-width: 767px){
	.form-box form .step-1 .notice{
		font-size: 10px;
	}
	.form-box form .step-1 .login{
		font-size: 14px;
	}
}

div.footer{
	max-width: 100%;
	width: 600px;
	margin: auto 0 0;
	padding: 85px 0 55px;
}
	div.footer .container{
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		align-items: flex-end;
	}
		div.footer .content{
			display: flex;
			flex-direction: row;
			gap: 30px;
			justify-content: center;
			text-align: center;
		}
			div.footer .content span,
			div.footer .content a{
				font-size: 14px;
				line-height: 1.1;
				color: #8B8B8B;
				text-decoration: none;
				font-weight: 700;
			}
	div.footer .content span{
		font-size: 12px;
	}



@media(max-width: 1249px){
	.signup-split .column{
		padding: 40px 45px 40px;
	}
}
@media(max-width: 1049px){
	.signup-split .column:nth-child(1){
		width: 100%;
		align-items: center;
	}
	.signup-split .column:nth-child(2){ display: none; }
}
@media(max-width: 767px){
	h2{	font-size: 29px; }
	h3{ font-size: 16px; }

	.content h2 br,
	.notice br{
		display: none;
	}

	.signup-split .column{
		padding: 80px 20px 40px;
	}
}
@media(max-width: 550px){
	div.footer .content{
		flex-direction: column;
		justify-content: center;
		margin: 0 auto;
	}
}


.account-exists{
	position: fixed;
	top: 0;
	left: 0;
	z-index: 99999999;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	background-color: rgba(255,255,255,.5);
}
	.account-exists .inner{
		display: block;
		max-width: calc(100% - 40px);
		width: 400px;
		margin: 0 20px;
		padding: 40px 40px;
		background-color: #FFF;
		box-shadow: -4px 4px 6px 0 rgba(0,0,0,.15);
	}
		.account-exists .inner .message{
			text-align: center;
		}

.timeout-error{
	position: fixed;
	top: 0;
	left: 0;
	z-index: 99999999;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	background-color: rgba(255,255,255,.5);
}
	.timeout-error .inner{
		display: block;
		max-width: calc(100% - 40px);
		width: 400px;
		margin: 0 20px;
		padding: 40px 40px;
		background-color: #FFF;
		box-shadow: -4px 4px 6px 0 rgba(0,0,0,.15);
	}
		.timeout-error .inner .message{
			text-align: center;
		}