#doughnut-chart{
  background-color: #ffffff;
  position:relative;
  height:90%;
  width:90%;
  font-family: 'Source Sans Pro', sans-serif;
}
.ct-series-a .ct-slice-donut {
  stroke: #0475C4;
}
.ct-series-b .ct-slice-donut {
  stroke: #43A2CA;
}
.ct-series-c .ct-slice-donut {
  stroke: #7BCCC4;
}
.ct-series-d .ct-slice-donut {
  stroke: #BAE4BC;
}
.ct-series-e .ct-slice-donut {
  stroke: #E9FED4;
}
.ct-series-f .ct-slice-donut {
  stroke: #E55845;
}
.ct-series-g .ct-slice-donut {
  stroke: #E48444;
}
.ct-series-h .ct-slice-donut {
  stroke:  #E8DD46;
}
.ct-series-i .ct-slice-donut {
  stroke:  #54D75D;
}
.ct-series-j .ct-slice-donut {
  stroke:  #04C477;
}

.ct-label{
  fill: white;
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 15px;
}
/*
.ct-slice-donut:hover
{
  position: absolute;
  top: 50%;
  left: 50%;
  right: auto;
  bottom: auto; 
  stroke-width: 50px !important;
  border-radius: 50%;
 -webkit-transform: translate3d(1%,0,0);
          transform: translate3d(1%,0,0);
		   border-radius: 0 100% 100% 0 / 50%;
  background-color: inherit;
  transform-origin: left;
  animation: spin 3s linear infinite,
             bg 6s step-end infinite;
}
 transition: all 0.5s ease;
  z-index: 1;
}
.cover-fill {
  position: absolute;
  top: 50%;
  left: 50%;
  right: auto;
  bottom: auto;
  background-color: white;
  border-radius: 50%;
  -webkit-transform: translate3d(-50%,-50%,0);
          transform: translate3d(-50%,-50%,0);
  z-index: 1;
}
*/
.ct-slice-donut:hover{
  stroke-width: 57px !important;
  transition: all 0.5s ease;
}

.chartist-tooltip {
    position: absolute;
	width: auto;
	height: 45px;
	top: 50;
    left: 0;
    z-index: 1000;
    visibility: hidden;
    opacity: 0.5;
    background: rgba(0, 0, 0, 0.7);
    transition: transform 0.2s ease-in-out;
	color: #fff;
	text-align: left;
	margin: auto;
	padding-top: 5px;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 5px;
	}

.chartist-tooltip:not([hidden]) {
        visibility: visible;
        transform: none;
        opacity: 1;
    }

    /* Tooltip arrow */
    .chartist-tooltip::before {
	content: attr(tooltip);
	position: absolute;
	opacity: 0;
	transition: all 0.2s ease;
          z-index: -1;
         font-family: 'Source Sans Pro', sans-serif;
		 font-size: 15px;
        transform: scaleY(0.7);
        text-shadow: 0 0.25em 0.35em rgba(255, 255, 255, 0.9);	
    }
        .chartist-tooltip--left::before {
            left: 0.75em;
        }
        .chartist-tooltip--right::before {
            left: auto;
            right: 0.75em;
        }

/* Adds a small point transition (line charts) when the point is active */
.ct-point {
    transition: all 0.2s ease-in-out;
}

/* Increased specificity intended to overwrite the default chartist style */
    .ct-chart-line.ct-chart-line .ct-point--hover {
        stroke-width: 1.50em;
    }