/*---------------------------------------------------
    LESS Elements 0.6
  ---------------------------------------------------
    A set of useful LESS mixins by Dmitry Fadeyev
    Special thanks for mixin suggestions to:
      Kris Van Herzeele,
      Benoit Adam,
      Portenart Emile-Victor,
      Ryan Faerman

    More info at: http://lesselements.com
-----------------------------------------------------*/
.dual-tone {
  position: relative;
}
.dual-tone .colored-image {
  position: absolute;
  top: 0;
  left: 0;
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -moz-opacity: 0;
  -khtml-opacity: 0;
  -webkit-opacity: 0;
  opacity: 0;
  -webkit-transition: opacity 0.5s linear;
  -moz-transition: opacity 0.5s linear;
  -ms-transition: opacity 0.5s linear;
  -o-transition: opacity 0.5s linear;
  transition: opacity 0.5s linear;
  z-index: 1;
}
.dual-tone .dual-tone-image {
  position: absolute;
  top: 0;
  left: 0;
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -moz-opacity: 0;
  -khtml-opacity: 0;
  -webkit-opacity: 0;
  opacity: 0;
  -webkit-transition: opacity 0.5s linear;
  -moz-transition: opacity 0.5s linear;
  -ms-transition: opacity 0.5s linear;
  -o-transition: opacity 0.5s linear;
  transition: opacity 0.5s linear;
}
.dual-tone .dual-tone-image.loaded {
  -moz-opacity: 1;
  -khtml-opacity: 1;
  -webkit-opacity: 1;
  opacity: 1;
}
.dual-tone-colored:hover .colored-image {
  -moz-opacity: 1;
  -khtml-opacity: 1;
  -webkit-opacity: 1;
  opacity: 1;
}
