/**
 * Grab our fonts.
 */
	@font-face {
		font-family: "SourceSans";
		font-weight: 300;
		font-style: normal;
		src: 
			url( ../fonts/source_sans/SourceSansPro-Regular.ttf) format("truetype");
		font-display: swap;
	}

	@font-face {
		font-family: "SourceSerifLight";
		font-weight: 300;
		font-style: normal;
		src: 
			url( ../fonts/source_serif/SourceSerifPro-Light.ttf) format("truetype");
		font-display: swap;
	}

/**
 * Text meant only for screen readers.
 */
	.screen-reader-text {
		border: 0;
		clip: rect( 1px, 1px, 1px, 1px );
		clip-path: inset( 50% );
		height: 1px;
		margin: -1px;
		overflow: hidden;
		padding: 0;
		position: absolute;
		width: 1px;
		word-wrap: normal !important;
	}

/**
 * The blogress banner.
 */
	body .lxb_launch_wizard-blogress {

		display: none;

		position: fixed;
		background: #28344B;
		color:  #fff;
		top: auto;
		bottom:  0;
		left:  0;
		right:  0;
		padding:  20px 20px 16px;
		z-index: 999999;
		width: 100%;
		box-shadow: 0px 10px 10px 10px rgba(0,0,0,.5);
		font-family: "SourceSans", helvetica, arial, sans-serif;
	}

/**
 * We only show it on large screens.
 */
	@media( min-width: 834px ) { 
		body .lxb_launch_wizard-blogress {
			display: block;
		}
	}

/**
 * The user has clicked the close button.
 */
	body .lxb_launch_wizard-blogress-closed {
		padding:  6px 20px;
	}

	body .lxb_launch_wizard-blogress a {
		color: #fff;
	}

/**
 * An inner container to layout the title, the steps, and the toggle button.
 */
	.lxb_launch_wizard-blogress-inner {
		display: grid;
		grid-template-columns: 0 1fr 26px;
		grid-template-areas: "title steps buttons";
		align-items: center;
		gap: 0px;
		justify-content: space-between;
	}

	.lxb_launch_wizard-blogress-closed .lxb_launch_wizard-blogress-inner {
		grid-template-columns: 1fr auto 1fr;
	}

	@media( min-width: 1220px ) {
		.lxb_launch_wizard-blogress-inner {
			grid-template-columns: 26px 1fr 26px;
		}	
	}

/**
 * We only show the title when the banner is closed because the title is woven into the steps when the banner is open.
 */
	.lxb_launch_wizard-blogress-title {
		grid-area: title;
		display: none;
	}

	.lxb_launch_wizard-blogress-closed .lxb_launch_wizard-blogress-title {
		display: block;
	}

/**
 * Lay out the title elements.
 */
	.lxb_launch_wizard-blogress-title-inner {
		display: flex;
		align-items: center;
	}

	.lxb_launch_wizard-blogress-title-text {
		padding-left: 5px;
		white-space: nowrap;
	}

	.lxb_launch_wizard-blogress-title-icon {
		color: #c1e6e9;
	}

/**
 * A wrapper for the steps.
 */
	.lxb_launch_wizard-blogress-steps {
		position: relative;
		max-width: 1080px;
		display: flex;
		align-items: center;
		justify-content: center;
		justify-self: center;
		gap: 40px;
		grid-area: steps;

		width: 100%;
		margin-right: auto;
		padding-right: 30px;

	}

	@media( min-width: 1220px ) { 
		body .lxb_launch_wizard-blogress-steps {
			width: 1080px;
			padding-right: 0;
			margin-right: 0;
			margin-left: 0;
		}
	}

	.lxb_launch_wizard-blogress-closed .lxb_launch_wizard-blogress-steps {
		display: none;
	}

/**
 * An inner wrapper for the steps.
 * 
 * The first and last step are the title and the "Launched" icon.  So only the middle steps are true "steps".
 */
	.lxb_launch_wizard-blogress-steps-inner {
		display: grid;
		grid-template-columns: max-content repeat( 6, 1fr ) max-content;
		width: 100%;
	}

/**
 * Style the steps and their various sub-components / states.
 */
	.lxb_launch_wizard-blogress-item-title-middle .lxb_launch_wizard-blogress-item-text {
		text-align: center;
		flex: 1;
	}

	.lxb_launch_wizard-blogress-item-link:hover {
		color: #B8E7EA;
	}


	.lxb_launch_wizard-blogress-item-link:hover .lxb_launch_wizard-blogress-item-title-inner {
		text-decoration: underline;
	}

	.lxb_launch_wizard-blogress-item-title {
		font-size: 13px;
		line-height: 1.15em;
		display: flex;
		flex: 1;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		padding: 0 10px 0px;
	}

	.lxb_launch_wizard-blogress-item-title-first,
	.lxb_launch_wizard-blogress-item-title-last {
		padding-bottom: 2px;
	}

	.lxb_launch_wizard-blogress-item-title-first {
		padding-left: 0;
	}

	.lxb_launch_wizard-blogress-item-title-last {
		padding-right: 0;
	}

	.lxb_launch_wizard-blogress-title,
	.lxb_launch_wizard-blogress-item-title-first .lxb_launch_wizard-blogress-item-text,
	.lxb_launch_wizard-blogress-item-title-last .lxb_launch_wizard-blogress-item-text {
		font-size: 16px;
		line-height: 18px;
		font-family: "SourceSerifLight", georgia, times, serif;
	}

	.lxb_launch_wizard-blogress-item-title-first .lxb_launch_wizard-blogress-item-text {
		padding-left: 5px;
	}

	.lxb_launch_wizard-blogress-item-title-last .lxb_launch_wizard-blogress-item-text {
		text-align: right;
		padding-right: 3px;
	}

	.lxb_launch_wizard-blogress-item-title-first .lxb_launch_wizard-blogress-item-icon,
	.lxb_launch_wizard-blogress-item-title-last .lxb_launch_wizard-blogress-item-icon {
		margin-bottom: 0;
		height: auto;
	}

	.lxb_launch_wizard-blogress-item-pin {
		line-height: 0;
		display: flex;
		align-items: end;
		justify-content: center;
	}

	.lxb_launch_wizard-blogress-item-title-first,
	.lxb_launch_wizard-blogress-item-title-last {
		flex-direction: row;
	}

	.lxb_launch_wizard-blogress-item-link {
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.lxb_launch_wizard-blogress-item-icon {
		font-size: 20px;
		line-height: 1em;
		margin-bottom: 4px;
		color: #c1e6e9;
		height: 15px;
		display: flex;
		align-items: end;
	}


	.lxb_launch_wizard-blogress-item-top {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		flex: 1;
	}

	.lxb_launch_wizard-blogress-item-bottom {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.lxb_launch_wizard-blogress-item-pin {
		line-height: 0;
		color: #417BA4;

	}

	.lxb_launch_wizard-blogress-item-line {
		display: block;
		width: 100%;
		height: 1px;
		background: #417BA4;
		margin-bottom: 5px;
	}

	.lxb_launch_wizard-blogress-item-line-first {
		width: 50%;
		margin-left: 50%;
	}

	.lxb_launch_wizard-blogress-item-line-last {
		width: 50%;
	}

	.lxb_launch_wizard-blogress-item-number {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.lxb_launch_wizard-blogress-item-number-inner {
		width: 14px;
		height: 14px;
		border: 1px solid #417BA4;
		border-radius: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 1px;
		font-size: 8px;
		line-height: 8px;
	}

	.lxb_launch_wizard-blogress-item-number-first,
	.lxb_launch_wizard-blogress-item-number-last {
		visibility: hidden;
	}

	.lxb_launch_wizard-blogress-item-title-complete,
	.lxb_launch_wizard-blogress-item-title-complete .lxb_launch_wizard-blogress-item-link,
	.lxb_launch_wizard-blogress-item-title-complete .lxb_launch_wizard-blogress-item-icon {
		color: #417BA4;
	}

	.lxb_launch_wizard-blogress-item-title-complete .lxb_launch_wizard-blogress-item-link:hover {
		color: #fff;
	}

	.lxb_launch_wizard-blogress-item-number-complete .lxb_launch_wizard-blogress-item-number-inner {
		background: #68EBA4;
		border: none;
	}

/**
 * The buttons for toggling the steps.
 */
	.lxb_launch_wizard-blogress-buttons {
		grid-area: buttons;
		display: flex;
		justify-content: end;
	}

	.lxb_launch_wizard-blogress-button {
		background: transparent;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 28px;
		min-width: 28px;
		height: 28px;
		color: #90959f;
		appearance: none;
		padding: 3px;
		border-radius: 100%;
		box-shadow: 
			1px 1px 1px 0px rgba(0,0,0,.5) inset, 
			-1px -1px 0px 0px rgba(255,255,255,.25) inset
		;
	}

	.lxb_launch_wizard-blogress-button-hide {
		display: none;
	}