Affichage moitié de sunburst

Bonsoir à tous,

J'ai codé un css un sunburst dont voici le code:
html,body {
width: 100%;
height: 550px;
margin: 0;
}
#grad {
position: relative;
width: 100%;
height: 100%;
}
#grad:after, #grad:before {
content: '';
position: absolute;
background: linear-gradient(90deg, transparent 50%, #2cc26b 50%, #2cc26b),
linear-gradient(82deg, transparent 50%, #2ecc71 50%, #2ecc71),
linear-gradient(67deg, transparent 50%, #2cc26b 50%, #2cc26b),
linear-gradient(52deg, transparent 50%, #2ecc71 50%, #2ecc71),
linear-gradient(37deg, transparent 50%, #2cc26b 50%, #2cc26b),
linear-gradient(22deg, transparent 50%, #2ecc71 50%, #2ecc71),
linear-gradient(07deg, transparent 50%, #2cc26b 50%, #2cc26b),
linear-gradient(-8deg, transparent 50%, #2ecc71 50%, #2ecc71),
linear-gradient(-23deg, transparent 50%, #2cc26b 50%, #2cc26b),
linear-gradient(-38deg, transparent 50%, #2ecc71 50%, #2ecc71),
linear-gradient(-53deg, transparent 50%, #2cc26b 50%, #2cc26b),
linear-gradient(-68deg, transparent 50%, #2ecc71 50%, #2ecc71),
linear-gradient(-83deg, transparent 50%, #2cc26b 50%, #2cc26b),
linear-gradient(-90deg, transparent 50%, #2ecc71 50%, #2ecc71);
background-position:0% 0%;
background-size: 200% 100%;
height: 100%;
width: 50%;
}

#grad:before {
left: 50%;
transform: rotate(180deg);
}

Le div grad est dans le html et j'aimerais n'afficher que la partie supérieure de ce sunburst je ne pense pas que cela soit difficile mais je bloque dessus si quelqu'un a une idée ou sait comment faire je suis preneur.
Merci.

tu as les balise [.code] pour mettre en valeur ton code.. là c'est moche.
Modifié par JENCAL (15 Apr 2015 - 11:12)