.bi-wrp {
	display:inline-block;
	position:relative;
}
.bi-wrp.bi-horizontal {
	width:100%;
}
.bi-bar {
	position:relative;
}

.bi-vertical .bi-bar { display:table-cell }
.bi-barInner {
	position:absolute;
}
.bi-vertical .bi-barInner {
	width:100%;
	bottom:0;
}

.bi-horizontal .bi-bar { 
	width:100%;
	float: left;
	margin-top: 5px;
}
.bi-horizontal .bi-barInner {
	top:0;
	bottom:0;
	left:0;
}
.bi-vertical .bi-barInner {
	width:100%;
	bottom:0;
}
.bi-vertical .bi-label {
	display:table-cell;
}
.bi-label-l { padding-right:5px }
.bi-label-r { padding-left:5px }

.bi-label { color: hsl(30, 100%, 50%); }
.bi-hor-topLeft .bi-label,
.bi-hor-topRight .bi-label {	padding-bottom: 5px }
.bi-hor-topLeft .bi-label,
.bi-hor-left .bi-label { float:left }
.bi-hor-topRight .bi-label,
.bi-hor-right .bi-label { float:right }
.bi-hor-left .bi-label,
.bi-hor-right .bi-label { padding:5px }

/* Title ------------------------------------------------ */
.bi-titleSpan { display:inline-block }
.bi-titleSpan.bi-titleSpan-topLeft {
	float:left;
	margin-right:10px;
}
.bi-titleSpan.bi-titleSpan-topRight { }
.bi-titleSpan.bi-titleSpan-left,
.bi-titleSpan.bi-titleSpan-right { width:100% }
.bi-titleSpan.bi-titleSpan-right { text-align:right }

/* Edge labels ------------------------------------------ */
.bi-labelEdge {
	position:absolute;
	top:5px;
	padding:1px 5px;
	border-radius:3px;
	font-size:0.8em;
	background-color:rgba(0,0,0,0.4); /* 0.1 */
	color:#c3d9c4;
	z-index:1200;
}
.bi-edge-min { left:-10px }
.bi-edge-max { right:-10px }

/* Limit ------------------------------------------------ */
.bi-limSpan { display:none}

.bi-limSpan {
	padding:3px 5px;
	color:#fff;
	font-size:0.8em;
	margin: 0 5px;
	border-radius:3px;
}

.bi-limSpan-min { background-color:rgb(92, 184, 92) }

.bi-limSpan-max { background-color:rgb(217, 83, 79) }

.bi-limPos-num .bi-label > .bi-limSpan,
.bi-limPos-title > .bi-titleSpan .bi-limSpan { display:inline-block }

.bi-limPos-num.bi-hor-left .bi-label > .bi-limSpan,
.bi-limPos-num.bi-hor-right .bi-label > .bi-limSpan,
.bi-limPos-num > .bi-limSpan,
.bi-limPos-title .bi-label > .bi-limSpan { display:none }
 

/* Label ------------------------------------------------ */
/* Hover */
.bi-label-vis-hover .bi-label { 
	position:absolute;
	background-color: #f1f1f1;
	padding: 5px 10px;
	box-shadow: 0 0 5px 0 rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 0 5px 0 rgba(0,0,0,0.5);
	-moz-box-shadow: 0 0 5px 0 rgba(0,0,0,0.5);
	-ms-box-shadow: 0 0 5px 0 rgba(0,0,0,0.5);
	-o-box-shadow: 0 0 5px 0 rgba(0,0,0,0.5);
	display:none;
}
.bi-label-vis-hover:hover .bi-label { display:block }
/* Hidden */
.bi-label-vis-hidden .bi-label { display:none }

.bi-mlst-labelTxt { color: #000; }

/* Milestone --------------------------------------------- */
.bi-milestone { 
	position:absolute;
	z-index:1050;
	cursor:pointer;
}
.bi-mlst-inner {
	width:100%;
	height:100%;
	float:left;
	position:relative;
	background-color:transparent;
}
.bi-mlst-inner .bi-mlst-labelTxt img {
    max-height: 300px;
}
.bi-mlst-inner.bi-mlst-innerHover { overflow: hidden }
.bi-mlst-inner.bi-mlst-innerHover.bi-mlst-innerOverflowVisible { overflow: visible }
.bi-mlst-innerLine,
.bi-mlst-label {
	display:inline-block;
	position: absolute;
}
.bi-mlst-label { 
	opacity:0;
	transition: top 300ms ease-in-out, opacity 300ms ease-in-out;
	position: relative;
	left: -100px;
}
.bi-horizontal .bi-mlst-inner.bi-mlst-innerVisible .bi-mlst-label { opacity:1;display:block; }
.bi-horizontal .bi-mlst-inner.bi-mlst-innerHidden .bi-mlst-label { display:none; }

.bi-horizontal .bi-milestone.top .bi-mlst-inner.bi-mlst-innerHover:hover > .bi-mlst-label { 
	opacity:1;
	top: -350px;
	position: relative;
	left: -100px;
}
.bi-horizontal .bi-milestone.bottom .bi-mlst-inner.bi-mlst-innerHover:hover > .bi-mlst-label {
	opacity:1;
	top: 50px;
	position: relative;
	left: -100px;
}

.bi-vertical .bi-mlst-inner.bi-mlst-innerHover:hover .bi-mlst-label { 
	opacity:1;
	top:-350px;
	position: relative;
	left: -100px;
}

.bi-milestone.bi-mlst_7_0  .bi-mlst-innerHover .bi-mlst-label,
.bi-milestone.bi-mlst_7_1  .bi-mlst-innerHover .bi-mlst-label {
	left: -200px !important;
}

.bi-milestone.bi-mlst_7_0  .bi-mlst-innerHover:hover .bi-mlst-label,
.bi-milestone.bi-mlst_7_1  .bi-mlst-innerHover:hover .bi-mlst-label
{
	left: -200px !important;
}
/* Themes ======================================================= */
/* Default ------------------------------------------------------ */
.bi-wrp.bi-default-theme .bi-bar {
	box-shadow: inset 0 0 10px -3px hsl(25, 20%, 55%);
	-webkit-box-shadow: inset 0 0 10px -3px hsl(25, 20%, 55%);
	-ms-box-shadow: inset 0 0 10px -3px hsl(25, 20%, 55%);
	-o-box-shadow: inset 0 0 10px -3px hsl(25, 20%, 55%);
	-moz-box-shadow: inset 0 0 10px -3px hsl(25, 20%, 55%);
}
.bi-wrp.bi-default-theme .bi-barInner {
	background-color: #3498db;
}
/* (Default) Bar color variations relative to label value */
.bi-wrp.bi-default-theme.bi-cRange-optimal .bi-barInner { background-color:rgb(92, 184, 92) }
.bi-wrp.bi-default-theme.bi-cRange-alert .bi-barInner { background-color:rgb(217, 170, 79) }
.bi-wrp.bi-default-theme.bi-cRange-critical .bi-barInner { background-color:rgb(217, 83, 79) }

/* (Default) Bar color according to average */
.bi-wrp.bi-default-theme.bi-avgBelow .bi-barInner { background-color:rgb(92, 184, 92) }
.bi-wrp.bi-default-theme.bi-avgAbove .bi-barInner { background-color:rgb(217, 83, 79) }

/* (Default) Milestones */
.bi-wrp.bi-default-theme .bi-milestone {
	background-color:transparent;
}
.bi-wrp.bi-default-theme.bi-vertical .bi-milestone {	
	left:50%;
}
.bi-wrp.bi-default-theme.bi-horizontal .bi-milestone {
	top:50%;
}
.bi-wrp.bi-default-theme .top .bi-mlst-innerLine {
	background-color: #000;
	border-top: 5px solid #e62117;
}
.bi-wrp.bi-default-theme .bottom .bi-mlst-innerLine {
	background-color: #000;
	border-bottom: 5px solid #00cc00;
}

.bi-wrp.bi-default-theme.bi-vertical .bi-mlst-innerLine {
	left:0;
	right:0;
	top:50%;
}
.bi-wrp.bi-default-theme.bi-horizontal .bi-mlst-innerLine {
	top:0;
	bottom:0;
	left:50%;
}
.bi-wrp.bi-default-theme .bi-mlst-label {
	padding:5px;
    /*
	background-color: #231a1a;
	color:#fff;
	*/
    border: 1px solid hsla(0, 0%, 0%, 0.8);
    box-shadow: 0 0 2px #5f4c50;
	border-radius:4px;
	font-size: 0.7em;
    background: url(/template/images/backgrounds/bg.png) center 0;
    color: black;
	white-space: nowrap;
}
.bi-wrp.bi-default-theme.bi-vertical .bi-mlst-label {
	top:-340px;/*-35px;*/
}

.bi-wrp.bi-default-theme.bi-horizontal .bi-milestone.top {
	margin-top: -15px !important;
}
.bi-wrp.bi-default-theme.bi-horizontal .bi-milestone.top .bi-mlst-label {
	top:-400px;/*-28px;*/
}
.bi-wrp.bi-default-theme.bi-horizontal .bi-milestone.bottom {
	margin-top: 0px !important;
}
.bi-wrp.bi-default-theme.bi-horizontal .bi-milestone.bottom .bi-mlst-label {
	top: 100px;
}
