/* from wizard css */
.wizard {
	position:relative;
	overflow:hidden;
	background-color:#d4d4d4;
	border:1px solid #d4d4d4;
	-webkit-border-radius:4px 4px 0px 0px;
	-moz-border-radius:4px 4px 0px 0px;
	border-radius:4px 4px 0px 0px;
	-webkit-box-shadow:0 1px 4px rgba(0,0,0,0.065);
	-moz-box-shadow:0 1px 4px rgba(0,0,0,0.065);
	box-shadow:0 1px 4px rgba(0,0,0,0.065)
}

.wizard a:hover { text-decoration: none;}

.wizard:before, .wizard:after {
	display:table;
	line-height:0;
	content:""
}

.wizard:after { clear:both }

.wizard ul {
	padding:0;
	margin:0;
	list-style:none outside none;
	display: grid;
	grid-gap: 1px;
}

.wizard ul.previous-disabled li.complete { cursor:default }

.wizard ul.previous-disabled li.complete:hover {
	color:#468847;
	cursor:default;
	background:#f3f4f5
}

.wizard ul.previous-disabled li.complete:hover .chevron:before { border-left-color:#f3f4f5 }

	.wizard ul li {
		position: relative;
		float: left;
		height: 46px;
		padding: 0 20px 0 30px;
		margin: 0;
		font-size: 16px;
		line-height: 46px;
		color: #999;
		cursor: default;
		background: var(--main-color);
		height: 100%;
	}

.wizard ul li .chevron {
	position:absolute;
	top:0;
	right:-14px;
	z-index:1;
	display:block;
	border:24px solid transparent;
	border-right:0;
	border-left:14px solid #d4d4d4
}

.wizard ul li .chevron:before {
	position:absolute;
	top:-24px;
	right:1px;
	display:block;
	border:24px solid transparent;
	border-right:0;
	border-left:14px solid #ededed;
	content:""
}

.wizard ul li.complete {background:#f3f4f5}
.wizard ul li.complete a { 	color:#468847;}


.wizard ul li.complete:hover {
	cursor:pointer;
	background:#e7eff8
}

.wizard ul li.complete:hover .chevron:before { border-left:14px solid #e7eff8 }

.wizard ul li.complete .chevron:before { border-left:14px solid #f3f4f5 }

.wizard ul li a { 
	display: block;
	color:var(--cta-font-color);
}

.wizard ul li.active {	background-color:var(--cta-background-color) }
.wizard ul li.active a { color:var(--cta-font-color)}

.wizard ul li.active .chevron:before { border-left:14px solid #f1f6fc }

.wizard ul li .badge { 
	margin-right:8px;
	background-color: var(--cta-font-color);
	color: var(--main-color);
}

@media (min-width:768px) {
	.wizard ul {
		grid-template-columns: repeat(4, 1fr);
		grid-gap: 0;
	}

	.wizard ul li {
		margin-right: -12px;
		clip-path: polygon(0% 0%, 94% 0, 100% 50%, 94% 100%, 0% 100%, 6% 50%);
		height: 100%;
		padding:0 30px;
		width: 105.5%;
	}
	
	.wizard ul li:first-child {
		padding-left: 20px;
		border-radius: 4px 0 0 4px;
		clip-path: polygon(0% 0%, 94% 0, 100% 50%, 94% 100%, 0% 100%, 0 50%);
		height: 100%;
		border-bottom-left-radius: 0;
	}
	
	.wizard ul li:last-child {
		clip-path: polygon(0% 0%, 100% 0, 100% 50%, 100% 100%, 0% 100%, 6% 50%);
		height: 100%;
	}
}

@media ( min-width:992px ) {
	.wizard ul li {
		padding-left: 40px;
	}
}

.step-content .step-pane { display:none }

.step-content .active { display:block }

.step-content .active .btn-group .active { display:inline-block }

.step-content {
	border: 1px solid #D4D4D4;
	border-top: 0;
	border-radius: 0 0 4px 4px;
	padding: 10px;
	margin-bottom: 10px;
}

label.required { color:#990000 }
span.required { color:#990000 }

