Нашел такой пример:
http://codepen.io/abergin/pen/ihlDf

Но хотелось бы прояснить несколько моментов.

1. В CSS задаются стили для классов .transition, .flipIn, .no-select. Откуда эти классы берутся, ведь в HTML их нет? Или это просто для читабельности?

2. Насколько я понял, используются следующие моменты:
- для заголовков указан user-select: none
- чекбокс растянут на все пространство группы, но при этом полностью прозрачный, поэтому пользователь кликает по нему, но не видит его
Насколько это приемлемо? В моем понимании антивирусы (да и браузеры) должны недолюбливать невидимые элементы, перехватывающие ввод пользователя.

3. Стрелки рисуются с помощью transform (плюс симпатичная анимация).
Выглядит симпатично, хотелось бы сделать также. Или лучше обойтись изображениями стрелки?

________________________
Мы смотрим с оптимизмом...
...в оптический прицел.