Подскажите как залить кружок желтым цветом .light.on ?

/*================= План помещения =========================*/
.plane2d{height: 428px;width: 900px; position: relative;background:url(/template/images/plane2d.jpg) no-repeat 0 0;}
/*================= План помещения =========================*/

/*================= План помещения - освещение =========================*/
.light{position: absolute;height: 50px;width: 50px;border-radius: 50%;}
.light.on{ box-shadow: 0px 0px 100px 100px rgba(255, 191, 0, 0.3);background:url(/template/images/lightOn.png) no-repeat 0 0;}
.light.off{background:url(/template/images/lightOff.png) no-repeat 0 0;}
/*================= План помещения - освещение  =========================*/

_____________
Мой первый сайтик

Посмотри на свой XBMC под другим углом

arbuzmaster
Не совсем понял вопроса... у тебя же вроде png меняются просто изменением класса

Можно ли избавиться от прозрачного кружка?
Если я убираю border-radius: 50%; из .light, то он становиться квадратом.
Суть - чтобы желтый свет исходил из центра PNG, без кружочка!

_____________
Мой первый сайтик

Посмотри на свой XBMC под другим углом

arbuzmaster, насколько я понял, ты хочешь "включать" и "выключать" свет без изменения картинки? Я бы наложил поверх этого элемента еще один, для которого бы задал радиальный градиент http://htmlbook.ru/css3-na-primerakh/radialnyi-gradient
Точнее говоря, надо задать как градиент, так и полупрозрачность для наложенного элемента.

_____________
* Хэлп по PHP
* Описалово по JavaScript
* Хэлп и СУБД для PostgreSQL

* Обучаю PHP, JS, вёрстке. Интерактивно и качественно. За разумные деньги.

* "накапливаю умение телепатии" (С) и "гуглю за ваш счет" (С)

sergeiss Спасибо, я попробовал, но это не то чего хотелось бы! Картинки у меня разные, а градиент закрывает картинку сверху, короче я просто покрашу картинку!

_____________
Мой первый сайтик

Посмотри на свой XBMC под другим углом