[data-pie-id] > *:nth-child(7n+1), [data-bar-id] > *:nth-child(7n+1), [data-line-id] > *:nth-child(7n+1) {
  color: #d13da4; }
[data-pie-id] > *:nth-child(7n+2), [data-bar-id] > *:nth-child(7n+2), [data-line-id] > *:nth-child(7n+2) {
  color: #89607e; }
[data-pie-id] > *:nth-child(7n+3), [data-bar-id] > *:nth-child(7n+3), [data-line-id] > *:nth-child(7n+3) {
  color: #677bc1; }
[data-pie-id] > *:nth-child(7n+4), [data-bar-id] > *:nth-child(7n+4), [data-line-id] > *:nth-child(7n+4) {
  color: #323e6b; }
[data-pie-id] > *:nth-child(7n+5), [data-bar-id] > *:nth-child(7n+5), [data-line-id] > *:nth-child(7n+5) {
  color: #a2b552; }
[data-pie-id] > *:nth-child(7n+6), [data-bar-id] > *:nth-child(7n+6), [data-line-id] > *:nth-child(7n+6) {
  color: #c1235c; }
[data-pie-id] > *:nth-child(7n+7), [data-bar-id] > *:nth-child(7n+7), [data-line-id] > *:nth-child(7n+7) {
  color: #661230; }

#pie, #donut, #bar {
  max-height: 550px; 
  
  }


svg {
  width: 100%;
  height: auto; }

.tooltip {
  margin-left: -5px;
  border-radius: 3px;
  padding: 5px; }

ul[data-pie-id] {
  list-style: none;
  padding: 10px; }