/* Breadcrumbs Box styles */

.clr {
	clear:both;
}

#breadcrumbs {
	font-size:9px;
	padding-top:2px;
}

#breadcrumb {
  overflow: hidden;
  width: 100%;
}

ul#breadcrumb {
	margin: 0;
	padding: 0;
	list-style: none;
}
  
#breadcrumb li {
  float: left;
  margin: 0 .5em 0 1em;
}

#breadcrumb a,
#breadcrumb span {
  background: #f1f1f1;
  padding: .3em .6em;
  float: left;
  text-decoration: none;
  color: #444;
  text-shadow: 0 1px 0 rgba(255,255,255,.5); 
  position: relative;
}

#breadcrumb a:hover{
  background: #ddd;
}

#breadcrumb a::before{
  content: "";
  position: absolute;
  top: 50%; 
  margin-top: -1.5em;   
  border-width: 1.5em 0 1.5em 1em;
  border-style: solid;
  border-color: #f1f1f1 #f1f1f1 #f1f1f1 transparent;
  left: -1em;
}

#breadcrumb a:hover::before{
  border-color: #ddd #ddd #ddd transparent;
}

#breadcrumb a::after{
  content: "";
  position: absolute;
  top: 50%; 
  margin-top: -1.5em;   
  border-top: 1.5em solid transparent;
  border-bottom: 1.5em solid transparent;
  border-left: 1em solid #f1f1f1;
  right: -1em;
}

#breadcrumb a:hover::after{
  border-left-color: #ddd;
}

#breadcrumb .current,
#breadcrumb .current:hover{
  background: none;
}

#breadcrumb .current::after,
#breadcrumb .current::before{
  content: normal;
}