.barm_container {
   position:relative;
  width:175px;
  height:175px;
}

.barm_first_ring {
  position:absolute;
  width:165px;
  height:165px;
  background-color:#666;
  border-radius: 50%;
  box-sizing: border-box;
}

.barm_second_ring {
  position:absolute;
  width:160px;
  height:160px;
  top:2px;
  left:2px;
  background-color:#CCC;
 border-radius: 50%;
  box-sizing: border-box;
}

.barm_third_ring {
  position:absolute;
  width:155px;
  height:155px;
  top:2px;
  left:2px;
  background-color:#FFF;
 border-radius: 50%;
  box-sizing: border-box;
}


.barm_pie {
  position:relative;
  width:150px;
  height:150px;
  transform: translate(7px,7px) rotate(-45deg);
}

.barm_pie_segment {
  position:absolute;
  height:75px;
  width:75px;
}

.barm_pie_segment.red {
  background-color:dodgerblue;
  border-radius: 100% 0px 0px 0px;
}

.barm_pie_segment.orange{
  background-color:limegreen;
  left:75px;
  border-radius: 0px 100% 0px 0px;
}

.barm_pie_segment.green {
  background-color:red;
  left:75px;
  top:75px;
  border-radius: 0px 0px 100% 0px;
}

.barm_pie_segment.white {
  background-color:white;
  left:0px;
  top:75px;
  border-radius: 0px 0px 0px 100%;
}

.barm_second_layer {
  position:absolute;
  index:10;
  top: 27px;
  left:27px;
  height:110px;
  width:110px;
  background-color: #FFFFFF;
  opacity: 0.5;
  border-radius: 50%;
  box-sizing: border-box;
}

.barm_third_layer {
  position:absolute;
  index:10;
  top: 47px;
  left:47px;
  height:70px;
  width:70px;
  background-color: #FFFFFF;
  border-radius: 50%;
  box-sizing: border-box;
}


.barm_middle_point {
  position:absolute;
  index:16;
  top: 75px;
  left:75px;
  height:15px;
  width:15px;
  background-color: #FFFFFF;
  border: solid 5px #CCC;
  border-radius: 50%;
  box-sizing: border-box;
}

.barm_arrow {
  background-color: transparent;
  box-sizing: border-box;
  width:60px;
  height:10px;
  position:absolute;
  top: 77px;
  left:22px;
  transform-origin: right;
  transform: rotate(0deg);
}

.barm_arrowtop {
  box-sizing: border-box;
  width: 0; height: 0;
  border-bottom: 5px solid #666;
  border-left: 60px solid transparent;
}

.barm_arrowbottom {
  box-sizing: border-box;
  width: 0; height: 0;
  border-top: 5px solid #666;
  border-left: 60px solid transparent;
}

.barm_title {
	top:147px;
	width:165px;
	position:relative;
	z-index: 2;
	text-align:center;
	font-family:verdana;
	font-size:14px;
}