Как создать модуль в joomla в стиле Metro UI?

Здравствуйте!
Помогите создать, полному чайнику (абсолютно) модуль в joomla в метро стиле (Metro UI), с анимацией переключения при наведении мышки перехода от картинки к тексту, при помощи css или HTML.
Я нашел на github код:

}
.flipbox {
  display: block;
  position: relative;
  -webkit-perspective: 800;
  -moz-perspective: 800;
  -ms-perspective: 800;
  -0-perspective: 800;
  perspective: 800;
}

.flipbox > div {
  height: 100%;
  width: 100%;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  -o-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transition: -webkit-transform 300ms;
  -moz-transition: -moz-transform 300ms;
  -ms-transition: -ms-transform 300ms;
  -o-transition: -o-transform 300ms;
  transition: transform 300ms;
}

.flipbox > div > div {
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -o-backface-visibility: hidden;
  backface-visibility: hidden;
}

.flipbox > div > *:last-child {
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
  transform: rotateY(180deg);
}

.flipbox.flipped > div {
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
  transform: rotateY(180deg);
}

И ввел его в файле template.css. задал для модуля CSS класс flipbox. Но он не подхватился.
Подскажите, что я делаю не так?