/* CSS used here will be applied after bootstrap.css */
.nav-wizard{
	display: table;
	width: 100%;
}

.nav-wizard > li {
  display: table-cell;
  /*width:18%;
  height:41px;*/
}
.nav-wizard > li > a {
  position: relative;
  color: #72879C;
  background-color: #DAE4E6;
  /*height:41px;*/
    /*display:inline-block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;*/
}
.nav-wizard > li > a .badge {
  margin-left: 3px;
  color: #DAE4E6;
  background-color: #073c8d;
}
.nav-wizard > li > a .badge.badge-step {
  color: #FFFFFF;
  border: 1px solid #72879C;
  border-radius: 50%;
  padding: 3px 5px;
  background-color: #72879C;
}
.nav-wizard > li.active > a .badge.badge-step {
  color: #FFFFFF;
  border: 1px solid #5ECAD4;
  border-radius: 50%;
  padding: 3px 5px;
  background-color: #5ECAD4;
}
.nav-wizard > li:not(:first-child) > a {
  padding-left: 34px;
}
.nav-wizard > li:not(:first-child) > a:before {
  width: 0px;
  height: 0px;
  border-top: 20px inset transparent;
  border-bottom: 20px inset transparent;
  border-left: 20px solid #ffffff;
  position: absolute;
  content: "";
  top: 0;
  left: 0;
}
.nav-wizard > li:not(:last-child) > a {
  margin-right: 4px;
}
.nav-wizard > li:not(:last-child) > a:after {
  width: 0px;
  height: 0px;
  border-top: 20px inset transparent;
  border-bottom: 20px inset transparent;
  border-left: 20px solid #DAE4E6;
  position: absolute;
  content: "";
  top: 0;
  right: -20px;
  z-index: 2;
}

.nav-wizard > li.done:hover > a,
.nav-wizard > li:hover > a {
  background-color: #DAE4E6;
}
.nav-wizard > li.done:hover > a:before,
.nav-wizard > li:hover > a:before {
  border-right-color: #DAE4E6;
}
.nav-wizard > li.done:hover > a:after,
.nav-wizard > li:hover > a:after {
  border-left-color: #DAE4E6;
}
.nav-wizard > li.done > a {
  background-color: #DAE4E6;
}
.nav-wizard > li.done > a:before {
  border-right-color: #DAE4E6;
}
.nav-wizard > li.done > a:after {
  border-left-color: #DAE4E6;
}
.nav-wizard > li.active > a,
.nav-wizard > li.active > a:hover,
.nav-wizard > li.active > a:focus {
  color: #FFFFFF;
  background-color: #72879C;
}
.nav-wizard > li.active > a:after {
  border-left-color: #72879C;
}
.nav-wizard > li.active > a .badge {
  color: #073c8d;
  background-color: #ffffff;
}
.nav-wizard > li.disabled > a {
  color: #777777;
}
.nav-wizard > li.disabled > a:hover,
.nav-wizard > li.disabled > a:focus {
  color: #777777;
  text-decoration: none;
  background-color: #DAE4E6;
  cursor: none;
}
.nav-wizard > li.disabled > a:before {
  border-right-color: #DAE4E6;
}
.nav-wizard > li.disabled > a:after {
  border-left-color: #DAE4E6;
}
.nav-wizard.nav-justified > li {
  float: none;
}
.nav-wizard.nav-justified > li > a {
  padding: 10px 15px;
}

.nav-wizard > .right-link > a {
	text-align:right;
}


.nav-wizard > li > a:focus, .nav > li > a:hover {
    text-decoration: none;
    background-color: #DAE4E6;
    cursor:default;
}


@media (max-width: 768px) {
  .nav-wizard.nav-justified > li > a {
    /*border-radius: 4px;*/
    margin-right: 0;
  }
  .nav-wizard.nav-justified > li > a:before,
  .nav-wizard.nav-justified > li > a:after {
    border: none !important;
  }
}