pie.css

.pie-container[data-slices="1"] .pie-slice-1 {
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg); }
  .pie-container[data-slices="1"] .pie-slice-1 .pie {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg); }
.pie-container[data-slices="1"] .pie-slice-2 {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg); }
  .pie-container[data-slices="1"] .pie-slice-2 .pie {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg); }

.pie-container[data-slices="2"] .pie-slice-1 {
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg); }
  .pie-container[data-slices="2"] .pie-slice-1 .pie {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg); }
.pie-container[data-slices="2"] .pie-slice-2 {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg); }
  .pie-container[data-slices="2"] .pie-slice-2 .pie {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg); }

.pie-container[data-slices="3"] .pie-slice-1 {
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg); }
  .pie-container[data-slices="3"] .pie-slice-1 .pie {
    -webkit-transform: rotate(120deg);
    -moz-transform: rotate(120deg);
    -o-transform: rotate(120deg);
    -ms-transform: rotate(120deg);
    transform: rotate(120deg); }
.pie-container[data-slices="3"] .pie-slice-2 {
  -webkit-transform: rotate(120deg);
  -moz-transform: rotate(120deg);
  -o-transform: rotate(120deg);
  -ms-transform: rotate(120deg);
  transform: rotate(120deg); }
  .pie-container[data-slices="3"] .pie-slice-2 .pie {
    -webkit-transform: rotate(120deg);
    -moz-transform: rotate(120deg);
    -o-transform: rotate(120deg);
    -ms-transform: rotate(120deg);
    transform: rotate(120deg); }
.pie-container[data-slices="3"] .pie-slice-3 {
  -webkit-transform: rotate(240deg);
  -moz-transform: rotate(240deg);
  -o-transform: rotate(240deg);
  -ms-transform: rotate(240deg);
  transform: rotate(240deg); }
  .pie-container[data-slices="3"] .pie-slice-3 .pie {
    -webkit-transform: rotate(120deg);
    -moz-transform: rotate(120deg);
    -o-transform: rotate(120deg);
    -ms-transform: rotate(120deg);
    transform: rotate(120deg); }

.pie-container[data-slices="4"] .pie-slice-1 {
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg); }
  .pie-container[data-slices="4"] .pie-slice-1 .pie {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg); }
.pie-container[data-slices="4"] .pie-slice-2 {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg); }
  .pie-container[data-slices="4"] .pie-slice-2 .pie {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg); }
.pie-container[data-slices="4"] .pie-slice-3 {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg); }
  .pie-container[data-slices="4"] .pie-slice-3 .pie {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg); }
.pie-container[data-slices="4"] .pie-slice-4 {
  -webkit-transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  transform: rotate(270deg); }
  .pie-container[data-slices="4"] .pie-slice-4 .pie {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg); }

.pie-container[data-slices="5"] .pie-slice-1 {
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg); }
  .pie-container[data-slices="5"] .pie-slice-1 .pie {
    -webkit-transform: rotate(72deg);
    -moz-transform: rotate(72deg);
    -o-transform: rotate(72deg);
    -ms-transform: rotate(72deg);
    transform: rotate(72deg); }
.pie-container[data-slices="5"] .pie-slice-2 {
  -webkit-transform: rotate(72deg);
  -moz-transform: rotate(72deg);
  -o-transform: rotate(72deg);
  -ms-transform: rotate(72deg);
  transform: rotate(72deg); }
  .pie-container[data-slices="5"] .pie-slice-2 .pie {
    -webkit-transform: rotate(72deg);
    -moz-transform: rotate(72deg);
    -o-transform: rotate(72deg);
    -ms-transform: rotate(72deg);
    transform: rotate(72deg); }
.pie-container[data-slices="5"] .pie-slice-3 {
  -webkit-transform: rotate(144deg);
  -moz-transform: rotate(144deg);
  -o-transform: rotate(144deg);
  -ms-transform: rotate(144deg);
  transform: rotate(144deg); }
  .pie-container[data-slices="5"] .pie-slice-3 .pie {
    -webkit-transform: rotate(72deg);
    -moz-transform: rotate(72deg);
    -o-transform: rotate(72deg);
    -ms-transform: rotate(72deg);
    transform: rotate(72deg); }
.pie-container[data-slices="5"] .pie-slice-4 {
  -webkit-transform: rotate(216deg);
  -moz-transform: rotate(216deg);
  -o-transform: rotate(216deg);
  -ms-transform: rotate(216deg);
  transform: rotate(216deg); }
  .pie-container[data-slices="5"] .pie-slice-4 .pie {
    -webkit-transform: rotate(72deg);
    -moz-transform: rotate(72deg);
    -o-transform: rotate(72deg);
    -ms-transform: rotate(72deg);
    transform: rotate(72deg); }
.pie-container[data-slices="5"] .pie-slice-5 {
  -webkit-transform: rotate(288deg);
  -moz-transform: rotate(288deg);
  -o-transform: rotate(288deg);
  -ms-transform: rotate(288deg);
  transform: rotate(288deg); }
  .pie-container[data-slices="5"] .pie-slice-5 .pie {
    -webkit-transform: rotate(72deg);
    -moz-transform: rotate(72deg);
    -o-transform: rotate(72deg);
    -ms-transform: rotate(72deg);
    transform: rotate(72deg); }

.pie-container[data-slices="6"] .pie-slice-1 {
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg); }
  .pie-container[data-slices="6"] .pie-slice-1 .pie {
    -webkit-transform: rotate(60deg);
    -moz-transform: rotate(60deg);
    -o-transform: rotate(60deg);
    -ms-transform: rotate(60deg);
    transform: rotate(60deg); }
.pie-container[data-slices="6"] .pie-slice-2 {
  -webkit-transform: rotate(60deg);
  -moz-transform: rotate(60deg);
  -o-transform: rotate(60deg);
  -ms-transform: rotate(60deg);
  transform: rotate(60deg); }
  .pie-container[data-slices="6"] .pie-slice-2 .pie {
    -webkit-transform: rotate(60deg);
    -moz-transform: rotate(60deg);
    -o-transform: rotate(60deg);
    -ms-transform: rotate(60deg);
    transform: rotate(60deg); }
.pie-container[data-slices="6"] .pie-slice-3 {
  -webkit-transform: rotate(120deg);
  -moz-transform: rotate(120deg);
  -o-transform: rotate(120deg);
  -ms-transform: rotate(120deg);
  transform: rotate(120deg); }
  .pie-container[data-slices="6"] .pie-slice-3 .pie {
    -webkit-transform: rotate(60deg);
    -moz-transform: rotate(60deg);
    -o-transform: rotate(60deg);
    -ms-transform: rotate(60deg);
    transform: rotate(60deg); }
.pie-container[data-slices="6"] .pie-slice-4 {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg); }
  .pie-container[data-slices="6"] .pie-slice-4 .pie {
    -webkit-transform: rotate(60deg);
    -moz-transform: rotate(60deg);
    -o-transform: rotate(60deg);
    -ms-transform: rotate(60deg);
    transform: rotate(60deg); }
.pie-container[data-slices="6"] .pie-slice-5 {
  -webkit-transform: rotate(240deg);
  -moz-transform: rotate(240deg);
  -o-transform: rotate(240deg);
  -ms-transform: rotate(240deg);
  transform: rotate(240deg); }
  .pie-container[data-slices="6"] .pie-slice-5 .pie {
    -webkit-transform: rotate(60deg);
    -moz-transform: rotate(60deg);
    -o-transform: rotate(60deg);
    -ms-transform: rotate(60deg);
    transform: rotate(60deg); }
.pie-container[data-slices="6"] .pie-slice-6 {
  -webkit-transform: rotate(300deg);
  -moz-transform: rotate(300deg);
  -o-transform: rotate(300deg);
  -ms-transform: rotate(300deg);
  transform: rotate(300deg); }
  .pie-container[data-slices="6"] .pie-slice-6 .pie {
    -webkit-transform: rotate(60deg);
    -moz-transform: rotate(60deg);
    -o-transform: rotate(60deg);
    -ms-transform: rotate(60deg);
    transform: rotate(60deg); }

.pie-container[data-slices="7"] .pie-slice-1 {
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg); }
  .pie-container[data-slices="7"] .pie-slice-1 .pie {
    -webkit-transform: rotate(51.42857deg);
    -moz-transform: rotate(51.42857deg);
    -o-transform: rotate(51.42857deg);
    -ms-transform: rotate(51.42857deg);
    transform: rotate(51.42857deg); }
.pie-container[data-slices="7"] .pie-slice-2 {
  -webkit-transform: rotate(51.42857deg);
  -moz-transform: rotate(51.42857deg);
  -o-transform: rotate(51.42857deg);
  -ms-transform: rotate(51.42857deg);
  transform: rotate(51.42857deg); }
  .pie-container[data-slices="7"] .pie-slice-2 .pie {
    -webkit-transform: rotate(51.42857deg);
    -moz-transform: rotate(51.42857deg);
    -o-transform: rotate(51.42857deg);
    -ms-transform: rotate(51.42857deg);
    transform: rotate(51.42857deg); }
.pie-container[data-slices="7"] .pie-slice-3 {
  -webkit-transform: rotate(102.85714deg);
  -moz-transform: rotate(102.85714deg);
  -o-transform: rotate(102.85714deg);
  -ms-transform: rotate(102.85714deg);
  transform: rotate(102.85714deg); }
  .pie-container[data-slices="7"] .pie-slice-3 .pie {
    -webkit-transform: rotate(51.42857deg);
    -moz-transform: rotate(51.42857deg);
    -o-transform: rotate(51.42857deg);
    -ms-transform: rotate(51.42857deg);
    transform: rotate(51.42857deg); }
.pie-container[data-slices="7"] .pie-slice-4 {
  -webkit-transform: rotate(154.28571deg);
  -moz-transform: rotate(154.28571deg);
  -o-transform: rotate(154.28571deg);
  -ms-transform: rotate(154.28571deg);
  transform: rotate(154.28571deg); }
  .pie-container[data-slices="7"] .pie-slice-4 .pie {
    -webkit-transform: rotate(51.42857deg);
    -moz-transform: rotate(51.42857deg);
    -o-transform: rotate(51.42857deg);
    -ms-transform: rotate(51.42857deg);
    transform: rotate(51.42857deg); }
.pie-container[data-slices="7"] .pie-slice-5 {
  -webkit-transform: rotate(205.71429deg);
  -moz-transform: rotate(205.71429deg);
  -o-transform: rotate(205.71429deg);
  -ms-transform: rotate(205.71429deg);
  transform: rotate(205.71429deg); }
  .pie-container[data-slices="7"] .pie-slice-5 .pie {
    -webkit-transform: rotate(51.42857deg);
    -moz-transform: rotate(51.42857deg);
    -o-transform: rotate(51.42857deg);
    -ms-transform: rotate(51.42857deg);
    transform: rotate(51.42857deg); }
.pie-container[data-slices="7"] .pie-slice-6 {
  -webkit-transform: rotate(257.14286deg);
  -moz-transform: rotate(257.14286deg);
  -o-transform: rotate(257.14286deg);
  -ms-transform: rotate(257.14286deg);
  transform: rotate(257.14286deg); }
  .pie-container[data-slices="7"] .pie-slice-6 .pie {
    -webkit-transform: rotate(51.42857deg);
    -moz-transform: rotate(51.42857deg);
    -o-transform: rotate(51.42857deg);
    -ms-transform: rotate(51.42857deg);
    transform: rotate(51.42857deg); }
.pie-container[data-slices="7"] .pie-slice-7 {
  -webkit-transform: rotate(308.57143deg);
  -moz-transform: rotate(308.57143deg);
  -o-transform: rotate(308.57143deg);
  -ms-transform: rotate(308.57143deg);
  transform: rotate(308.57143deg); }
  .pie-container[data-slices="7"] .pie-slice-7 .pie {
    -webkit-transform: rotate(51.42857deg);
    -moz-transform: rotate(51.42857deg);
    -o-transform: rotate(51.42857deg);
    -ms-transform: rotate(51.42857deg);
    transform: rotate(51.42857deg); }

.pie-container[data-slices="8"] .pie-slice-1 {
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg); }
  .pie-container[data-slices="8"] .pie-slice-1 .pie {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg); }
.pie-container[data-slices="8"] .pie-slice-2 {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg); }
  .pie-container[data-slices="8"] .pie-slice-2 .pie {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg); }
.pie-container[data-slices="8"] .pie-slice-3 {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg); }
  .pie-container[data-slices="8"] .pie-slice-3 .pie {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg); }
.pie-container[data-slices="8"] .pie-slice-4 {
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  -ms-transform: rotate(135deg);
  transform: rotate(135deg); }
  .pie-container[data-slices="8"] .pie-slice-4 .pie {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg); }
.pie-container[data-slices="8"] .pie-slice-5 {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg); }
  .pie-container[data-slices="8"] .pie-slice-5 .pie {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg); }
.pie-container[data-slices="8"] .pie-slice-6 {
  -webkit-transform: rotate(225deg);
  -moz-transform: rotate(225deg);
  -o-transform: rotate(225deg);
  -ms-transform: rotate(225deg);
  transform: rotate(225deg); }
  .pie-container[data-slices="8"] .pie-slice-6 .pie {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg); }
.pie-container[data-slices="8"] .pie-slice-7 {
  -webkit-transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  transform: rotate(270deg); }
  .pie-container[data-slices="8"] .pie-slice-7 .pie {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg); }
.pie-container[data-slices="8"] .pie-slice-8 {
  -webkit-transform: rotate(315deg);
  -moz-transform: rotate(315deg);
  -o-transform: rotate(315deg);
  -ms-transform: rotate(315deg);
  transform: rotate(315deg); }
  .pie-container[data-slices="8"] .pie-slice-8 .pie {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg); }

.pie-container[data-slices="9"] .pie-slice-1 {
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg); }
  .pie-container[data-slices="9"] .pie-slice-1 .pie {
    -webkit-transform: rotate(40deg);
    -moz-transform: rotate(40deg);
    -o-transform: rotate(40deg);
    -ms-transform: rotate(40deg);
    transform: rotate(40deg); }
.pie-container[data-slices="9"] .pie-slice-2 {
  -webkit-transform: rotate(40deg);
  -moz-transform: rotate(40deg);
  -o-transform: rotate(40deg);
  -ms-transform: rotate(40deg);
  transform: rotate(40deg); }
  .pie-container[data-slices="9"] .pie-slice-2 .pie {
    -webkit-transform: rotate(40deg);
    -moz-transform: rotate(40deg);
    -o-transform: rotate(40deg);
    -ms-transform: rotate(40deg);
    transform: rotate(40deg); }
.pie-container[data-slices="9"] .pie-slice-3 {
  -webkit-transform: rotate(80deg);
  -moz-transform: rotate(80deg);
  -o-transform: rotate(80deg);
  -ms-transform: rotate(80deg);
  transform: rotate(80deg); }
  .pie-container[data-slices="9"] .pie-slice-3 .pie {
    -webkit-transform: rotate(40deg);
    -moz-transform: rotate(40deg);
    -o-transform: rotate(40deg);
    -ms-transform: rotate(40deg);
    transform: rotate(40deg); }
.pie-container[data-slices="9"] .pie-slice-4 {
  -webkit-transform: rotate(120deg);
  -moz-transform: rotate(120deg);
  -o-transform: rotate(120deg);
  -ms-transform: rotate(120deg);
  transform: rotate(120deg); }
  .pie-container[data-slices="9"] .pie-slice-4 .pie {
    -webkit-transform: rotate(40deg);
    -moz-transform: rotate(40deg);
    -o-transform: rotate(40deg);
    -ms-transform: rotate(40deg);
    transform: rotate(40deg); }
.pie-container[data-slices="9"] .pie-slice-5 {
  -webkit-transform: rotate(160deg);
  -moz-transform: rotate(160deg);
  -o-transform: rotate(160deg);
  -ms-transform: rotate(160deg);
  transform: rotate(160deg); }
  .pie-container[data-slices="9"] .pie-slice-5 .pie {
    -webkit-transform: rotate(40deg);
    -moz-transform: rotate(40deg);
    -o-transform: rotate(40deg);
    -ms-transform: rotate(40deg);
    transform: rotate(40deg); }
.pie-container[data-slices="9"] .pie-slice-6 {
  -webkit-transform: rotate(200deg);
  -moz-transform: rotate(200deg);
  -o-transform: rotate(200deg);
  -ms-transform: rotate(200deg);
  transform: rotate(200deg); }
  .pie-container[data-slices="9"] .pie-slice-6 .pie {
    -webkit-transform: rotate(40deg);
    -moz-transform: rotate(40deg);
    -o-transform: rotate(40deg);
    -ms-transform: rotate(40deg);
    transform: rotate(40deg); }
.pie-container[data-slices="9"] .pie-slice-7 {
  -webkit-transform: rotate(240deg);
  -moz-transform: rotate(240deg);
  -o-transform: rotate(240deg);
  -ms-transform: rotate(240deg);
  transform: rotate(240deg); }
  .pie-container[data-slices="9"] .pie-slice-7 .pie {
    -webkit-transform: rotate(40deg);
    -moz-transform: rotate(40deg);
    -o-transform: rotate(40deg);
    -ms-transform: rotate(40deg);
    transform: rotate(40deg); }
.pie-container[data-slices="9"] .pie-slice-8 {
  -webkit-transform: rotate(280deg);
  -moz-transform: rotate(280deg);
  -o-transform: rotate(280deg);
  -ms-transform: rotate(280deg);
  transform: rotate(280deg); }
  .pie-container[data-slices="9"] .pie-slice-8 .pie {
    -webkit-transform: rotate(40deg);
    -moz-transform: rotate(40deg);
    -o-transform: rotate(40deg);
    -ms-transform: rotate(40deg);
    transform: rotate(40deg); }
.pie-container[data-slices="9"] .pie-slice-9 {
  -webkit-transform: rotate(320deg);
  -moz-transform: rotate(320deg);
  -o-transform: rotate(320deg);
  -ms-transform: rotate(320deg);
  transform: rotate(320deg); }
  .pie-container[data-slices="9"] .pie-slice-9 .pie {
    -webkit-transform: rotate(40deg);
    -moz-transform: rotate(40deg);
    -o-transform: rotate(40deg);
    -ms-transform: rotate(40deg);
    transform: rotate(40deg); }

.pie-container[data-slices="10"] .pie-slice-1 {
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg); }
  .pie-container[data-slices="10"] .pie-slice-1 .pie {
    -webkit-transform: rotate(36deg);
    -moz-transform: rotate(36deg);
    -o-transform: rotate(36deg);
    -ms-transform: rotate(36deg);
    transform: rotate(36deg); }
.pie-container[data-slices="10"] .pie-slice-2 {
  -webkit-transform: rotate(36deg);
  -moz-transform: rotate(36deg);
  -o-transform: rotate(36deg);
  -ms-transform: rotate(36deg);
  transform: rotate(36deg); }
  .pie-container[data-slices="10"] .pie-slice-2 .pie {
    -webkit-transform: rotate(36deg);
    -moz-transform: rotate(36deg);
    -o-transform: rotate(36deg);
    -ms-transform: rotate(36deg);
    transform: rotate(36deg); }
.pie-container[data-slices="10"] .pie-slice-3 {
  -webkit-transform: rotate(72deg);
  -moz-transform: rotate(72deg);
  -o-transform: rotate(72deg);
  -ms-transform: rotate(72deg);
  transform: rotate(72deg); }
  .pie-container[data-slices="10"] .pie-slice-3 .pie {
    -webkit-transform: rotate(36deg);
    -moz-transform: rotate(36deg);
    -o-transform: rotate(36deg);
    -ms-transform: rotate(36deg);
    transform: rotate(36deg); }
.pie-container[data-slices="10"] .pie-slice-4 {
  -webkit-transform: rotate(108deg);
  -moz-transform: rotate(108deg);
  -o-transform: rotate(108deg);
  -ms-transform: rotate(108deg);
  transform: rotate(108deg); }
  .pie-container[data-slices="10"] .pie-slice-4 .pie {
    -webkit-transform: rotate(36deg);
    -moz-transform: rotate(36deg);
    -o-transform: rotate(36deg);
    -ms-transform: rotate(36deg);
    transform: rotate(36deg); }
.pie-container[data-slices="10"] .pie-slice-5 {
  -webkit-transform: rotate(144deg);
  -moz-transform: rotate(144deg);
  -o-transform: rotate(144deg);
  -ms-transform: rotate(144deg);
  transform: rotate(144deg); }
  .pie-container[data-slices="10"] .pie-slice-5 .pie {
    -webkit-transform: rotate(36deg);
    -moz-transform: rotate(36deg);
    -o-transform: rotate(36deg);
    -ms-transform: rotate(36deg);
    transform: rotate(36deg); }
.pie-container[data-slices="10"] .pie-slice-6 {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg); }
  .pie-container[data-slices="10"] .pie-slice-6 .pie {
    -webkit-transform: rotate(36deg);
    -moz-transform: rotate(36deg);
    -o-transform: rotate(36deg);
    -ms-transform: rotate(36deg);
    transform: rotate(36deg); }
.pie-container[data-slices="10"] .pie-slice-7 {
  -webkit-transform: rotate(216deg);
  -moz-transform: rotate(216deg);
  -o-transform: rotate(216deg);
  -ms-transform: rotate(216deg);
  transform: rotate(216deg); }
  .pie-container[data-slices="10"] .pie-slice-7 .pie {
    -webkit-transform: rotate(36deg);
    -moz-transform: rotate(36deg);
    -o-transform: rotate(36deg);
    -ms-transform: rotate(36deg);
    transform: rotate(36deg); }
.pie-container[data-slices="10"] .pie-slice-8 {
  -webkit-transform: rotate(252deg);
  -moz-transform: rotate(252deg);
  -o-transform: rotate(252deg);
  -ms-transform: rotate(252deg);
  transform: rotate(252deg); }
  .pie-container[data-slices="10"] .pie-slice-8 .pie {
    -webkit-transform: rotate(36deg);
    -moz-transform: rotate(36deg);
    -o-transform: rotate(36deg);
    -ms-transform: rotate(36deg);
    transform: rotate(36deg); }
.pie-container[data-slices="10"] .pie-slice-9 {
  -webkit-transform: rotate(288deg);
  -moz-transform: rotate(288deg);
  -o-transform: rotate(288deg);
  -ms-transform: rotate(288deg);
  transform: rotate(288deg); }
  .pie-container[data-slices="10"] .pie-slice-9 .pie {
    -webkit-transform: rotate(36deg);
    -moz-transform: rotate(36deg);
    -o-transform: rotate(36deg);
    -ms-transform: rotate(36deg);
    transform: rotate(36deg); }
.pie-container[data-slices="10"] .pie-slice-10 {
  -webkit-transform: rotate(324deg);
  -moz-transform: rotate(324deg);
  -o-transform: rotate(324deg);
  -ms-transform: rotate(324deg);
  transform: rotate(324deg); }
  .pie-container[data-slices="10"] .pie-slice-10 .pie {
    -webkit-transform: rotate(36deg);
    -moz-transform: rotate(36deg);
    -o-transform: rotate(36deg);
    -ms-transform: rotate(36deg);
    transform: rotate(36deg); }

#pie1 {
  height: 100px;
  width: 100px;
  position: relative;
  margin: 20px; }
  #pie1 .pie {
    position: absolute;
    width: 100px;
    height: 100px;
    -moz-border-radius: 50px;
    -webkit-border-radius: 50px;
    -o-border-radius: 50px;
    border-radius: 50px;
    clip: rect(0px, 50px, 100px, 0px); }
    #pie1 .pie.color1 {
      background-color: #d64231; }
    #pie1 .pie.color2 {
      background-color: #4284fc; }
    #pie1 .pie.color3 {
      background-color: #f5c827; }
    #pie1 .pie.color4 {
      background-color: #2ba553; }
  #pie1 .pie-number {
    height: 100px;
    width: 100px;
    position: absolute;
    text-align: center;
    top: 50%;
    margin-top: -25px;
    color: #ffffff;
    font-size: 50px;
    font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif;
    text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.75); }
  #pie1 .hold {
    position: absolute;
    width: 100px;
    height: 100px;
    -moz-border-radius: 50px;
    -webkit-border-radius: 50px;
    -o-border-radius: 50px;
    border-radius: 50px;
    clip: rect(0px, 100px, 100px, 50px); }

#pie2 {
  height: 50px;
  width: 50px;
  position: relative;
  margin: 20px; }
  #pie2 .pie {
    position: absolute;
    width: 50px;
    height: 50px;
    -moz-border-radius: 25px;
    -webkit-border-radius: 25px;
    -o-border-radius: 25px;
    border-radius: 25px;
    clip: rect(0px, 25px, 50px, 0px); }
    #pie2 .pie.color1 {
      background-color: #d64231; }
    #pie2 .pie.color2 {
      background-color: #4284fc; }
    #pie2 .pie.color3 {
      background-color: #f5c827; }
    #pie2 .pie.color4 {
      background-color: #2ba553; }
  #pie2 .pie-number {
    height: 50px;
    width: 50px;
    position: absolute;
    text-align: center;
    top: 50%;
    margin-top: -12.5px;
    color: #ffffff;
    font-size: 25px;
    font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif;
    text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.75); }
  #pie2 .hold {
    position: absolute;
    width: 50px;
    height: 50px;
    -moz-border-radius: 25px;
    -webkit-border-radius: 25px;
    -o-border-radius: 25px;
    border-radius: 25px;
    clip: rect(0px, 50px, 50px, 25px); }

#pie3 {
  height: 300px;
  width: 300px;
  position: relative;
  margin: 20px; }
  #pie3 .pie {
    position: absolute;
    width: 300px;
    height: 300px;
    -moz-border-radius: 150px;
    -webkit-border-radius: 150px;
    -o-border-radius: 150px;
    border-radius: 150px;
    clip: rect(0px, 150px, 300px, 0px); }
    #pie3 .pie.color1 {
      background-color: #d64231; }
    #pie3 .pie.color2 {
      background-color: #4284fc; }
    #pie3 .pie.color3 {
      background-color: #f5c827; }
    #pie3 .pie.color4 {
      background-color: #2ba553; }
  #pie3 .pie-number {
    height: 300px;
    width: 300px;
    position: absolute;
    text-align: center;
    top: 50%;
    margin-top: -75px;
    color: #ffffff;
    font-size: 150px;
    font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif;
    text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.75); }
  #pie3 .hold {
    position: absolute;
    width: 300px;
    height: 300px;
    -moz-border-radius: 150px;
    -webkit-border-radius: 150px;
    -o-border-radius: 150px;
    border-radius: 150px;
    clip: rect(0px, 300px, 300px, 150px); }