ul.crumbBox {
  margin: 0px 0px 10px;
  padding: 0px;
  font-size: 0px;
  line-height: 0px;
  display: inline-block;
  *display: inline;
  zoom: 1;
  vertical-align: top;
}
ul.crumbBox li {
  position: relative;
  margin: 0px 0px;
  padding: 0px;
  list-style: none;
  list-style-image: none;
  display: inline-block;
  *display: inline;
  zoom: 1;
  vertical-align: top;
  border-left: 1px solid #ccc;
  transition: 0.3s ease;
}
ul.crumbBox li:hover:before {
  border-left: 10px solid #6fb6ff;
}
ul.crumbBox li:hover a {
  color: #000;
  background: #6fb6ff;
}
ul.crumbBox li:before {
  content: "";
  position: absolute;
  right: -9px;
  top: -1px;
  z-index: 20;
  border-left: 10px solid #fff;
  border-top: 22px solid transparent;
  border-bottom: 22px solid transparent;
  transition: 0.3s ease;
}
ul.crumbBox li:after {
  content: "";
  position: absolute;
  right: -10px;
  top: -1px;
  z-index: 10;
  border-left: 10px solid #ccc;
  border-top: 22px solid transparent;
  border-bottom: 22px solid transparent;
}
ul.crumbBox li.active a {
  color: #000;
  background: #6fb6ff;
}
ul.crumbBox span.firstCrumb li {
  border-left: none;
}
ul.crumbBox span.firstCrumb a {
  padding-left: 20px;
  border-radius: 5px 0px 0px 5px;
}
ul.crumbBox li.lastCrumb:before {
  display: none;
}
ul.crumbBox li.lastCrumb:after {
  display: none;
}
ul.crumbBox li.lastCrumb a {
  padding-right: 20px;
  border-radius: 0px 40px 40px 0px;
}
ul.crumbBox li a {
  display: block;
  font-size: 12px;
  line-height: 40px;
  color: #757575;
  padding: 0px 15px 0px 25px;
  text-decoration: none;
  background: #fff;
  border: 1px solid #ddd;
  white-space: nowrap;
  overflow: hidden;
  transition: 0.3s ease;
}