
.side-loader {
  float: right;
  /* margin-left: 100px; */
  overflow: hidden;
  margin-right: 4px;
  height: 14px;
  border-radius: 3px;
  margin-top: 4px;
  width: 66px;
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#bede24+0,8ebe4f+100 */
  background: rgb(190,222,36); /* Old browsers */
  background: -moz-linear-gradient(left,  rgba(190,222,36,1) 0%, rgba(142,190,79,1) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(left,  rgba(190,222,36,1) 0%,rgba(142,190,79,1) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right,  rgba(190,222,36,1) 0%,rgba(142,190,79,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bede24', endColorstr='#8ebe4f',GradientType=1 ); /* IE6-9 */
  /* border: 5px solid #f1f1f1; */
}

.side-loader:after {
  content:"";
  height:30px;
  width: 10px;
  display: none;
  background-color:#f1f1f1;
  margin-top:22px;
  margin-left: 8px;
  border: 0px solid #f1f1f1;
  position:absolute;
  border-bottom-right-radius: 2px;
  border-top-right-radius: 2px;
}

.perc {
  border-radius: 2px;
  border:1px solid rgba(200,200,200,0.3);
  float:left;
  margin-top: 2px;
  width:90%;
  height:16px;
  margin-left:3px;
}

.side-perc {
  /* border: 1px solid #fff; */
  float:left;
  width: 16.67596%;
  background: #aaa !important;
  box-sizing: border-box;
  height: 100%;
  /* margin-left:3px; */
}


.side-perc.active{
    background: transparent !important;
    border-right: 1px solid #fff;
    border-left: 1px solid #fff;
    opacity: 0.35;
}
