/*
Template: Sparta
Author: XpertPoin8, www.xpertpoin8.com/
Version: 1.0
*/

/* Table of Content
================================================== 

    01. Main 
		- piecharts

*/


/* 01 - Main 
-------------------------------------------------*/


*  {margin:0px;padding:0px;text-decoration:none; outline:none;}

.chart {
  position: relative;
  display: inline-block;
  width: 171px;
  height: 171px;
  margin: 50px 0 50px 0;
  text-align: center;
}
.chart.first{ margin-left:0;}
.chart canvas {
  position: absolute;
  top: 0;
  left: 0;
}
.percent {
  display: inline-block;
  line-height: 170px;
  z-index: 2;
  font-size:30px;
  font-weight: bold;
}
.percent:after {
  content: '%';
  margin-left: 0.1em;
  font-size: .8em;
}
.angular {
  margin-top: 100px;
}
.angular .chart {
  margin-top: 0;
}
.skill-name{
	bottom: -37px;
    left: 0;
    position: absolute;
    width: 100%;
}






.green-circle, .yellow-circle, .purple-circle, .red-circle {
  position: relative;
  display: inline-block;
  width: 171px;
  height: 171px;
   margin: 50px 0 50px 74px; 
  text-align: center;
}
.green-circle canvas, .yellow-circle canvas, .purple-circle canvas, .red-circle canvas {
  position: absolute;
  top: 0;
  left: 0;
}




/* piecharts */
.piecharts{ text-align:center;  }