/*
jquery.mobile.simultaneous-transitions.css
Add transitions in JQuery Mobile 1.1.1. with simultaneous transitions from 1.0.1 (with -sim suffix)
Version 1.2
Simultaneous transitions adapted from jQuery Mobile 1.0.1 for use with jQuery Mobile 1.1.1
Copyright (c), 2012 Watusiware Corporation
Distributed under the MIT License
*/
@charset "utf-8";

.slide-sim,
.slideoverleft-sim,
slideoverright-sim,
.slideup-sim,
.slidedown-sim,
.slidepushup-sim,
.slidepushdown-sim,
.fade-sim,
.flip-sim,
.pop-sim

 {
  -webkit-animation-timing-function: ease-in-out;
  -webkit-animation-duration: 350ms;
}

.slide-sim.out {
  -webkit-transform: translateX(-100%);
  -webkit-animation-name: slideouttoleft-sim;
}

.slide-sim.in {
  -webkit-transform: translateX(0);
  -webkit-animation-name: slideinfromright-sim;
}

.slide-sim.out.reverse {
  -webkit-transform: translateX(100%);
  -webkit-animation-name: slideouttoright-sim;
}

.slide-sim.in.reverse {
  -webkit-transform: translateX(0);
  -webkit-animation-name: slideinfromleft-sim;
}

/* Complementary transition: slideoverleft, slideoverright
   Similar to slideup, slidedown, slides *over* "out" page instead of animating it out
*/
.slideoverleft-sim.out {
  -webkit-animation-name: dontmove-sim;
  z-index: 0;
}

.slideoverleft-sim.in {
  -webkit-transform: translateX(0);
  -webkit-animation-name: slideinfromright-sim;
  z-index: 10;
}

.slideoverleft-sim.in.reverse {
  z-index: 0;
  -webkit-animation-name: dontmove-sim;
}

.slideoverleft-sim.out.reverse {
  -webkit-transform: translateX(100%);
  z-index: 10;
  -webkit-animation-name: slideouttoright-sim;
}

.slideoverright-sim.out {
  -webkit-animation-name: dontmove-sim;
  z-index: 0;
}

.slideoverright-sim.in {
  -webkit-transform: translateX(0);
  -webkit-animation-name: slideinfromleft-sim;
  z-index: 10;
}

.slideoverright-sim.in.reverse {
  z-index: 0;
  -webkit-animation-name: dontmove-sim;
}

.slideoverright-sim.out.reverse {
  -webkit-transform: translateX(100%);
  z-index: 10;
  -webkit-animation-name: slideouttoleft-sim;
}

.slideup-sim.out {
  -webkit-animation-name: dontmove-sim;
  z-index: 0;
}

.slideup-sim.in {
  -webkit-transform: translateY(0);
  -webkit-animation-name: slideinfrombottom-sim;
  z-index: 10;
}

.slideup-sim.in.reverse {
  z-index: 0;
  -webkit-animation-name: dontmove-sim;
}

.slideup-sim.out.reverse {
  -webkit-transform: translateY(100%);
  z-index: 10;
  -webkit-animation-name: slideouttobottom-sim;
}

.slidedown-sim {
  -webkit-animation-name: dontmove-sim;
  z-index: 0;
}

.slidedown-sim.in {
  -webkit-transform: translateY(0);
  -webkit-animation-name: slideinfromtop-sim;
  z-index: 10;
}

.slidedown-sim.in.reverse {
  z-index: 0;
  -webkit-animation-name: dontmove-sim;
}

.slidedown-sim.out.reverse {
  -webkit-transform: translateY(-100%);
  z-index: 10;
  -webkit-animation-name: slideouttotop-sim;
}

/* Complementary: slidepushup-sim, slidepushdown-sim
   like slide - pushes "out" page, instead of sliding "in" page over
   This is most appropriate for "in" and "out" pages with identical height */
.slidepushup-sim.out {
  -webkit-transform: translateY(-100%);
  -webkit-animation-name: slideouttotop-sim;
}

.slidepushup-sim.in {
  -webkit-transform: translateY(0);
  -webkit-animation-name: slideinfrombottom-sim;
}

.slidepushup-sim.in.reverse {
  -webkit-transform: translateY(0);
  -webkit-animation-name: slideinfromtop-sim;
}

.slidepushup-sim.out.reverse {
  -webkit-transform: translateY(100%);
  -webkit-animation-name: slideouttobottom-sim;
}

.slidepushdown-sim.out {
  -webkit-transform: translateY(100%);
  -webkit-animation-name: slideouttobottom-sim;

}

.slidepushdown-sim.in {
  -webkit-transform: translateY(0);
  -webkit-animation-name: slideinfromtop-sim;
}

.slidepushdown-sim.in.reverse {
  -webkit-transform: translateY(0);
  -webkit-animation-name:slideinfrombottom-sim;
}

.slidepushdown-sim.out.reverse {
  -webkit-transform: translateY(-100%);
  -webkit-animation-name: slideouttotop-sim;
}

@-webkit-keyframes slideinfromright-sim {
    from { -webkit-transform: translateX(100%); }
    to { -webkit-transform: translateX(0); }
}

@-webkit-keyframes slideinfromleft-sim {
    from { -webkit-transform: translateX(-100%); }
    to { -webkit-transform: translateX(0); }
}

@-webkit-keyframes slideouttoleft-sim {
    from { -webkit-transform: translateX(0); }
    to { -webkit-transform: translateX(-100%); }
}

@-webkit-keyframes slideouttoright-sim {
    from { -webkit-transform: translateX(0); }
    to { -webkit-transform: translateX(100%); }
}

@-webkit-keyframes slideinfromtop-sim {
    from { -webkit-transform: translateY(-100%); }
    to { -webkit-transform: translateY(0); }
}

@-webkit-keyframes slideinfrombottom-sim {
    from { -webkit-transform: translateY(100%); }
    to { -webkit-transform: translateY(0); }
}

@-webkit-keyframes slideouttobottom-sim {
    from { -webkit-transform: translateY(0); }
    to { -webkit-transform: translateY(100%); }
}

@-webkit-keyframes slideouttotop-sim {
    from { -webkit-transform: translateY(0); }
    to { -webkit-transform: translateY(-100%); }
}
@-webkit-keyframes fadein-sim {
    from { opacity: 0; }
    to { opacity: 1; }
}

@-webkit-keyframes fadeout-sim {
    from { opacity: 1; }
    to { opacity: 0; }
}

.fade-sim.out {
  z-index: 0;
  -webkit-animation-name: fadeout-sim;
}

.fade-sim.in {
  opacity: 1;
  z-index: 10;
  -webkit-animation-name: fadein-sim;
}

.viewport-flip-sim {
    -webkit-perspective: 1000;
    position: absolute;
}

.flip-sim {
  -webkit-animation-duration: .65s;
  -webkit-backface-visibility:hidden;
  -webkit-transform:translateX(0); /* Needed to work around an iOS 3.1 bug that causes listview thumbs to disappear when -webkit-visibility:hidden is used. */
}

.flip-sim.out {
  -webkit-transform: rotateY(-180deg) scale(.8);
  -webkit-animation-name: flipouttoleft-sim;
}

.flip-sim.in {
  -webkit-transform: rotateY(0) scale(1);
  -webkit-animation-name: flipinfromleft-sim;
}

/* Shake it all about */
.flip-sim.out.reverse {
  -webkit-transform: rotateY(180deg) scale(.8);
  -webkit-animation-name: flipouttoright-sim;
}

.flip-sim.in.reverse {
  -webkit-transform: rotateY(0) scale(1);
  -webkit-animation-name: flipinfromright-sim;
}

@-webkit-keyframes flipinfromright-sim {
    from { -webkit-transform: rotateY(-180deg) scale(.8); }
    to { -webkit-transform: rotateY(0) scale(1); }
}

@-webkit-keyframes flipinfromleft-sim {
    from { -webkit-transform: rotateY(180deg) scale(.8); }
    to { -webkit-transform: rotateY(0) scale(1); }
}

@-webkit-keyframes flipouttoleft-sim {
    from { -webkit-transform: rotateY(0) scale(1); }
    to { -webkit-transform: rotateY(-180deg) scale(.8); }
}

@-webkit-keyframes flipouttoright-sim {
    from { -webkit-transform: rotateY(0) scale(1); }
    to { -webkit-transform: rotateY(180deg) scale(.8); }
}

/* Hackish, but reliable. */
@-webkit-keyframes dontmove-sim {
    from { opacity: 1; }
    to { opacity: 1; }
}

.pop-sim {
  -webkit-transform-origin: 50% 50%;
}

.pop-sim.in {
  -webkit-transform: scale(1);
    opacity: 1;
  -webkit-animation-name: popin-sim;
  z-index: 10;
}

.pop-sim.in.reverse {
  z-index: 0;
  -webkit-animation-name: dontmove-sim;
}

.pop-sim.out.reverse {
  -webkit-transform: scale(.2);
  opacity: 0;
  -webkit-animation-name: popout-sim;
  z-index: 10;
}

@-webkit-keyframes popin-sim {
    from {
        -webkit-transform: scale(.2);
        opacity: 0;
    }
    to {
        -webkit-transform: scale(1);
        opacity: 1;
    }
}

@-webkit-keyframes popout-sim {
    from {
        -webkit-transform: scale(1);
        opacity: 1;
    }
    to {
        -webkit-transform: scale(.2);
        opacity: 0;
    }
}


