@feat-onboard-wrapper-width: 750px;
@feat-onboard-max-text-width: 700px;

.feat-onboard {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	display: flex;
 	justify-content: center;
 	align-items: center;
	background-color: rgba(0, 0, 0, .85);
	background-repeat: no-repeat;
	background-position-x: 0;
	color: #FFF;
	text-align: center;
	z-index: 102;
	overflow: auto;
}

	.feat-onboard-wrapper {
	}
		.feat-onboard-title {
			color: #FFF;
			margin-bottom: 40px;

		}
			.feat-onboard-title-name {
				font-weight: bold;
			}

		.feat-onboard-description {
			max-width: @feat-onboard-max-text-width;
			margin: 0 auto 5px;
			padding: 0 80px;
		}
	
	.feat-onboard-highlight {
		font-weight: bold;
		white-space: nowrap;
	}

	.feat-onboard-adv-wrapper {
		text-align: left;
	}
		.feat-onboard-adv-title {
			font-weight: bold;
			white-space: nowrap;
			color: #FFF;
			font-size: 23px;
			margin-top: 0;
		}

	.feat-onboard-btn-wrapper {
		margin-top: 30px;
		margin-bottom: 10px;

		> .btn {
			box-shadow: 0 0 70px 0 rgba(255, 255, 255, 0.3);
		}
	}

	.feat-onboard-tutorial-wrapper {
		display: flex;
		align-items: center;
		padding: 30px 0;
	}
		.feat-onboard-video-container {
			width: 618px;
			margin: 0 30px;
		}
		.feat-onboard-video {
			box-shadow: 0 0 70px 0 rgba(255, 255, 255, 0.3);
		}

		.feat-onboard-nav-btn {
			border-radius: 1em;
			width: 2em;
			height: 2em;
			text-align: center;
			padding: 0;
			font-size: 1.3em;
			line-height: 1em;

			&[disabled] {
				opacity: 0.2;
			}
		}