.nav{
	display: table;
	height: 5em;
	font-weight: 500;
}
.nav>p{
	display: table-cell;
	vertical-align: middle;
}
.nav .relative-nav{
	text-transform: uppercase;
	width: 9.3em;
	font-size: 1.5em;
}
.nav .relative-nav a{
	text-decoration: none;
	color: inherit;
	display: inline-block;
	text-align: center;
	min-width: 6.3em;
}
.nav .relative-nav a>*{
	vertical-align: middle;
}
.nav .relative-nav svg{
	width: 2.2em;
	height: 2.2em;
}
.nav .relative-nav .button-bg{
	fill: currentColor;
}
.nav .relative-nav .button-shadow{
	visibility: hidden;
	/*this visual element is provided as a possible option, but not used by default (for backward compatibility).*/
}
.nav .relative-nav .button-icon{
	fill: #999;
}
.nav .relative-nav.back{
	padding-right: 0.8em;
	text-align: right;
}
.nav .relative-nav.next{
	padding-left: 0.8em;
	text-align: left;
}

.nav .steps>.wrapper{
	display: table;
	width: 100%;
}
.nav .steps .step-icon, .nav .steps .separator{
	display: table-cell;
	vertical-align: middle;
}
.nav .steps .step-icon, .nav .steps .step-icon>.wrapper{
	width: 2.5em;
}
.nav .steps .step-icon, .nav .steps .separator, .nav .steps .step-icon>.wrapper{
	height: 2.5em;
}
.nav .steps .step-icon{
	text-decoration: none;
	color: #666;
}
.nav .steps .step-icon>.wrapper{
	display: block;
	width: 2.5em;
	height: 2.5em;
	padding: 2px;
}
.nav .steps .step-icon.active{
	color: #999;
}
.nav .steps .step-icon.active>.wrapper{
	padding: 0;
}
.nav .steps .step-icon svg{
	width: 100%;
	height: 100%;
}
.nav .steps .step-icon .bg-circle{
	fill: #999;
}
.nav .steps .step-icon .step-index{
	fill: currentColor;
	visibility: hidden;
}
.nav .steps .step-icon .icon-completed{
	fill: currentColor;
}
.nav .steps .step-icon.active .bg-circle{
	fill: #FFF;
}
.nav .steps .step-icon.active .step-index{
	visibility: visible;
}
.nav .steps .step-icon.active .icon-completed{
	visibility: hidden;
}
.nav .steps .step-icon.active~.step-icon .icon-completed{
	visibility: hidden;
}
.nav .steps .step-icon.active~.step-icon .step-index{
	visibility: visible;
}
.nav .steps .separator:before{
	content: "";
	display: block;
	width: 100%;
	height: 0;
	border-top: 1px solid #999;
}