* {
	box-sizing:bover-box;
}
.piechart-flatmin {
	position: relative;
	width: 100%;
}
.piechart-flatmin .piehole {
position: absolute;
width: 70%;
height: 70%;
top: 15%;
z-index: 2;
border-radius: 50%;
left: 15%;
overflow: hidden;
text-align: center;
padding: 2em;
}
.piehole .piehole-text {
	font-weight: 300;
	display: none;
	position: absolute;
	left: 15%;
	top: 30%;
	width: 70%;
}
.piechart-flatmin.m .piehole-text {
	font-size: 70%;
}
.piechart-flatmin.s .piehole-text {
	top:22%;
	font-size: 70%;
}


.piechart-flatmin .piehole-text p {
	line-height: 1;
	margin: 0;
	font-weight: 300;
}
.piehole-text .flatmin-percentage {
	font-size:4em;
}
.piehole-text .flatmin-percentage:after {
	/*content: '%';*/
	font-size: 0.4em;
	vertical-align: top;
	line-height: 1.5;
}
.piehole-text .flatmin-value {
	font-size:1.2em;
	font-weight:400;
}
.piehole-text .flatmin-title {
	font-size:1.2em;
	font-weight:400;
}
.piechart-flatmin.m .piehole-text .flatmin-title,.piechart-flatmin.m .piehole-text .flatmin-value,.piechart-flatmin.s .piehole-text .flatmin-title,.piechart-flatmin.s .piehole-text .flatmin-value {
	font-size: 1.4em;
}
.piechart-flatmin.s .piehole-text .flatmin-percentage {
	font-size: 2em;
    font-weight: bold;
}

.piechart-flatmin .ratio {
	padding-top: 100%;
}

.piechart-flatmin .sector {
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	position: absolute;
	pointer-events: none;
}
.sector.hover .sector-s {
	border:0.5em rgba(255,255,255,0.5) solid;
}
.sector-f {
	pointer-events: none;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	border-radius: 50%;
	left: 0;
}
.sector-s {
	cursor: pointer;
	pointer-events: auto;
	position: absolute;
	border-radius: 50%;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}
.example {
	width: 50%;
	padding: 1em;
    float:left;
    margin:-2px;
}

.LegendGraph{
    float: right;
    margin: 35px 0px 0px 0px;
    padding: 0px;
}

.LegendGraph li {
    list-style:none;
    font-size:11px;
}

.tvaColor
{
    background-color: #e71d35;
    width: 8px;
    height: 8px;
    display: block;
    float: left;
    margin: 4px 3px 0px 0px;
}

.tvmColor
{
    background-color: #2ec5b6;
    width: 8px;
    height: 8px;
    display: block;
    float: left;
    margin: 4px 3px 0px 0px;
}

.pelColor
{
    background-color: #ff9f1c;
    width: 8px;
    height: 8px;
    display: block;
    float: left;
    margin: 4px 3px 0px 0px;
}

.raColor{
    background-color: #00beff;
    width: 8px;
    height: 8px;
    display: block;
    float: left;
    margin: 4px 3px 0px 0px;
}

.deaColor
{
    background-color: #8e44ad;
    width: 8px;
    height: 8px;
    display: block;
    float: left;
    margin: 4px 3px 0px 0px;
}

.rvaColor{
    background-color: #1d3557;
    width: 8px;
    height: 8px;
    display: block;
    float: left;
    margin: 4px 3px 0px 0px;
}

.rvmColor{
    background-color: #188418;
    width: 8px;
    height: 8px;
    display: block;
    float: left;
    margin: 4px 3px 0px 0px;
}
.mdColor {
    background-color: #00b252;
    width: 8px;
    height: 8px;
    display: block;
    float: left;
    margin: 4px 3px 0px 0px;
}
.prColor {
    background-color: #f76100;
    width: 8px;
    height: 8px;
    display: block;
    float: left;
    margin: 4px 3px 0px 0px;
}
.vrColor {
    background-color: #ba9dc1;
    width: 8px;
    height: 8px;
    display: block;
    float: left;
    margin: 4px 3px 0px 0px;
}
.mrColor {
    background-color: #7f7d77;
    width: 8px;
    height: 8px;
    display: block;
    float: left;
    margin: 4px 3px 0px 0px;
}
.peColor {
    background-color: #f76100;
    width: 8px;
    height: 8px;
    display: block;
    float: left;
    margin: 4px 3px 0px 0px;
}
.rtColor {
    background-color: #ffbd00;
    width: 8px;
    height: 8px;
    display: block;
    float: left;
    margin: 4px 3px 0px 0px;
}
.veColor {
    background-color: #ac008d;
    width: 8px;
    height: 8px;
    display: block;
    float: left;
    margin: 4px 3px 0px 0px;
}