.ty-flip {
  display: inline-block;
  background-color: transparent;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-perspective: 1000px;
          perspective: 1000px; }
  .ty-flip:hover .ty-flip__inner_hor {
    -webkit-transform: rotateY(-180deg);
            transform: rotateY(-180deg); }
  .ty-flip:hover .ty-flip__inner_hor_reverse {
    -webkit-transform: rotateY(180deg);
            transform: rotateY(180deg); }
  .ty-flip:hover .ty-flip__inner_ver {
    -webkit-transform: rotateX(-180deg);
            transform: rotateX(-180deg); }
  .ty-flip:hover .ty-flip__inner_ver_reverse {
    -webkit-transform: rotateX(180deg);
            transform: rotateX(180deg); }
  .ty-flip__inner {
    position: relative;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    width: 100%;
    height: 100%;
    text-align: center;
    -webkit-transition: -webkit-transform 0.8s;
    transition: -webkit-transform 0.8s;
    transition: transform 0.8s;
    transition: transform 0.8s, -webkit-transform 0.8s;
    -webkit-transform-style: preserve-3d;
            transform-style: preserve-3d; }
  .ty-flip__item-front, .ty-flip__item-back {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden; }
  .ty-flip__item-back_hor {
    -webkit-transform: rotateY(-180deg);
            transform: rotateY(-180deg); }
  .ty-flip__item-back_hor_reverse {
    -webkit-transform: rotateY(180deg);
            transform: rotateY(180deg); }
  .ty-flip__item-back_ver {
    -webkit-transform: rotateX(-180deg);
            transform: rotateX(-180deg); }
  .ty-flip__item-back_ver_reverse {
    -webkit-transform: rotateX(180deg);
            transform: rotateX(180deg); }