/*
* jQuery Mobile Framework
* Copyright (c) jQuery Project
* Dual licensed under the MIT (MIT-LICENSE.txt) or GPL (GPL-LICENSE.txt) licenses.
*/
.in
{
    -webkit-animation-timing-function: ease-out;
    -webkit-animation-duration: 350ms;
    animation-timing-function: ease-out;
    animation-duration: 350ms;
}
.out
{
    -webkit-animation-timing-function: ease-in;
    -webkit-animation-duration: 225ms;
    animation-timing-function: ease-in;
    animation-duration: 225ms;
}
@-webkit-keyframes fadein
{
    from
    {
        opacity: 0;
    }
    to
    {
        opacity: 1;
    }
}
@keyframes fadein
{
    from
    {
        opacity: 0;
    }
    to
    {
        opacity: 1;
    }
}
@-webkit-keyframes fadeout
{
    from
    {
        opacity: 1;
    }
    to
    {
        opacity: 0;
    }
}
@keyframes fadeout
{
    from
    {
        opacity: 1;
    }
    to
    {
        opacity: 0;
    }
}
.fade.out
{
    opacity: 0;
    -webkit-animation-duration: 125ms;
    -webkit-animation-name: fadeout;
    animation-duration: 125ms;
    animation-name: fadeout;
}
.fade.in
{
    opacity: 1;
    -webkit-animation-duration: 225ms;
    -webkit-animation-name: fadein;
    animation-duration: 225ms;
    animation-name: fadein;
}
.pop
{
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
}
.pop.in
{
    -webkit-transform: scale(1);
    -webkit-animation-name: popin;
    -webkit-animation-duration: 350ms;
    transform: scale(1);
    animation-name: popin;
    animation-duration: 350ms;
    opacity: 1;
}
.pop.out
{
    -webkit-animation-name: fadeout;
    -webkit-animation-duration: 100ms;
    animation-name: fadeout;
    animation-duration: 100ms;
    opacity: 0;
}
.pop.in.reverse
{
    -webkit-animation-name: fadein;
    animation-name: fadein;
}
.pop.out.reverse
{
    -webkit-transform: scale(.8);
    -webkit-animation-name: popout;
    transform: scale(.8);
    animation-name: popout;
}
@-webkit-keyframes popin
{
    from
    {
        -webkit-transform: scale(.8);
        opacity: 0;
    }
    to
    {
        -webkit-transform: scale(1);
        opacity: 1;
    }
}
@keyframes popin
{
    from
    {
        transform: scale(.8);
        opacity: 0;
    }
    to
    {
        transform: scale(1);
        opacity: 1;
    }
}
@-webkit-keyframes popout
{
    from
    {
        -webkit-transform: scale(1);
        opacity: 1;
    }
    to
    {
        -webkit-transform: scale(.8);
        opacity: 0;
    }
}
@keyframes popout
{
    from
    {
        transform: scale(1);
        opacity: 1;
    }
    to
    {
        transform: scale(.8);
        opacity: 0;
    }
}/* keyframes for slidein from sides */
@-webkit-keyframes slideinfromright
{
    from
    {
        -webkit-transform: translate3d(100%,0,0);
    }
    to
    {
        -webkit-transform: translate3d(0,0,0);
    }
}
@keyframes slideinfromright
{
    from
    {
        transform: translateX(100%);
    }
    to
    {
        transform: translateX(0);
    }
}
@-webkit-keyframes slideinfromleft
{
    from
    {
        -webkit-transform: translate3d(-100%,0,0);
    }
    to
    {
        -webkit-transform: translate3d(0,0,0);
    }
}
@keyframes slideinfromleft
{
    from
    {
        transform: translateX(-100%);
    }
    to
    {
        transform: translateX(0);
    }
}/* keyframes for slideout to sides */
@-webkit-keyframes slideouttoleft
{
    from
    {
        -webkit-transform: translate3d(0,0,0);
    }
    to
    {
        -webkit-transform: translate3d(-100%,0,0);
    }
}
@keyframes slideouttoleft
{
    from
    {
        transform: translateX(0);
    }
    to
    {
        transform: translateX(-100%);
    }
}
@-webkit-keyframes slideouttoright
{
    from
    {
        -webkit-transform: translate3d(0,0,0);
    }
    to
    {
        -webkit-transform: translate3d(100%,0,0);
    }
}
@keyframes slideouttoright
{
    from
    {
        transform: translateX(0);
    }
    to
    {
        transform: translateX(100%);
    }
}
.slide.out, .slide.in
{
    -webkit-animation-timing-function: ease-out;
    -webkit-animation-duration: 350ms;
    animation-timing-function: ease-out;
    animation-duration: 350ms;
}
.slide.out
{
    -webkit-transform: translate3d(-100%,0,0);
    -webkit-animation-name: slideouttoleft;
    transform: translateX(-100%);
    animation-name: slideouttoleft;
}
.slide.in
{
    -webkit-transform: translate3d(0,0,0);
    -webkit-animation-name: slideinfromright;
    transform: translateX(0);
    animation-name: slideinfromright;
}
.slide.out.reverse
{
    -webkit-transform: translate3d(100%,0,0);
    -webkit-animation-name: slideouttoright;
    transform: translateX(100%);
    animation-name: slideouttoright;
}
.slide.in.reverse
{
    -webkit-transform: translate3d(0,0,0);
    -webkit-animation-name: slideinfromleft;
    transform: translateX(0);
    animation-name: slideinfromleft;
}
.slidefade.out
{
    -webkit-transform: translateX(-100%);
    -webkit-animation-name: slideouttoleft;
    -webkit-animation-duration: 225ms;
    transform: translateX(-100%);
    animation-name: slideouttoleft;
    animation-duration: 225ms;
}
.slidefade.in
{
    -webkit-transform: translateX(0);
    -webkit-animation-name: fadein;
    -webkit-animation-duration: 200ms;
    transform: translateX(0);
    animation-name: fadein;
    animation-duration: 200ms;
}
.slidefade.out.reverse
{
    -webkit-transform: translateX(100%);
    -webkit-animation-name: slideouttoright;
    -webkit-animation-duration: 200ms;
    transform: translateX(100%);
    animation-name: slideouttoright;
    animation-duration: 200ms;
}
.slidefade.in.reverse
{
    -webkit-transform: translateX(0);
    -webkit-animation-name: fadein;
    -webkit-animation-duration: 200ms;
    transform: translateX(0);
    animation-name: fadein;
    animation-duration: 200ms;
}/* slide down */
.slidedown.out
{
    -webkit-animation-name: fadeout;
    -webkit-animation-duration: 100ms;
    animation-name: fadeout;
    animation-duration: 100ms;
}
.slidedown.in
{
    -webkit-transform: translateY(0);
    -webkit-animation-name: slideinfromtop;
    -webkit-animation-duration: 250ms;
    transform: translateY(0);
    animation-name: slideinfromtop;
    animation-duration: 250ms;
}
.slidedown.in.reverse
{
    -webkit-animation-name: fadein;
    -webkit-animation-duration: 150ms;
    animation-name: fadein;
    animation-duration: 150ms;
}
.slidedown.out.reverse
{
    -webkit-transform: translateY(-100%);
    -webkit-animation-name: slideouttotop;
    -webkit-animation-duration: 200ms;
    transform: translateY(-100%);
    animation-name: slideouttotop;
    animation-duration: 200ms;
}
@-webkit-keyframes slideinfromtop
{
    from
    {
        -webkit-transform: translateY(-100%);
    }
    to
    {
        -webkit-transform: translateY(0);
    }
}
@keyframes slideinfromtop
{
    from
    {
        transform: translateY(-100%);
    }
    to
    {
        transform: translateY(0);
    }
}
@-webkit-keyframes slideouttotop
{
    from
    {
        -webkit-transform: translateY(0);
    }
    to
    {
        -webkit-transform: translateY(-100%);
    }
}
@keyframes slideouttotop
{
    from
    {
        transform: translateY(0);
    }
    to
    {
        transform: translateY(-100%);
    }
}/* slide up */
.slideup.out
{
    -webkit-animation-name: fadeout;
    -webkit-animation-duration: 100ms;
    animation-name: fadeout;
    animation-duration: 100ms;
}
.slideup.in
{
    -webkit-transform: translateY(0);
    -webkit-animation-name: slideinfrombottom;
    -webkit-animation-duration: 250ms;
    transform: translateY(0);
    animation-name: slideinfrombottom;
    animation-duration: 250ms;
}
.slideup.in.reverse
{
    -webkit-animation-name: fadein;
    -webkit-animation-duration: 150ms;
    animation-name: fadein;
    animation-duration: 150ms;
}
.slideup.out.reverse
{
    -webkit-transform: translateY(100%);
    -webkit-animation-name: slideouttobottom;
    -webkit-animation-duration: 200ms;
    transform: translateY(100%);
    animation-name: slideouttobottom;
    animation-duration: 200ms;
}
@-webkit-keyframes slideinfrombottom
{
    from
    {
        -webkit-transform: translateY(100%);
    }
    to
    {
        -webkit-transform: translateY(0);
    }
}
@keyframes slideinfrombottom
{
    from
    {
        transform: translateY(100%);
    }
    to
    {
        transform: translateY(0);
    }
}
@-webkit-keyframes slideouttobottom
{
    from
    {
        -webkit-transform: translateY(0);
    }
    to
    {
        -webkit-transform: translateY(100%);
    }
}
@keyframes slideouttobottom
{
    from
    {
        transform: translateY(0);
    }
    to
    {
        transform: translateY(100%);
    }
}
.perspectiveView
{
    -webkit-perspective: 1000;
    perspective: 1000;
}
.flip
{
    -webkit-backface-visibility: hidden;
    -webkit-transform: translateX(0);
    backface-visibility: hidden;
    transform: translateX(0);
    background: #fff;
}
.flip.out
{
    -webkit-transform: rotateY(-90deg) scale(.9);
    -webkit-animation-name: flipouttoleft;
    -webkit-animation-duration: 175ms;
    transform: rotateY(-90deg) scale(.9);
    animation-name: flipouttoleft;
    animation-duration: 175ms;
}
.flip.in
{
    -webkit-animation-name: flipintoright;
    -webkit-animation-duration: 225ms;
    animation-name: flipintoright;
    animation-duration: 225ms;
}
.flip.out.reverse
{
    -webkit-transform: rotateY(90deg) scale(.9);
    -webkit-animation-name: flipouttoright;
    transform: rotateY(90deg) scale(.9);
    animation-name: flipouttoright;
}
.flip.in.reverse
{
    -webkit-animation-name: flipintoleft;
    animation-name: flipintoleft;
}
@-webkit-keyframes flipouttoleft
{
    from
    {
        -webkit-transform: rotateY(0);
    }
    to
    {
        -webkit-transform: rotateY(-90deg) scale(.9);
    }
}
@keyframes flipouttoleft
{
    from
    {
        transform: rotateY(0);
    }
    to
    {
        transform: rotateY(-90deg) scale(.9);
    }
}
@-webkit-keyframes flipouttoright
{
    from
    {
        -webkit-transform: rotateY(0);
    }
    to
    {
        -webkit-transform: rotateY(90deg) scale(.9);
    }
}
@keyframes flipouttoright
{
    from
    {
        transform: rotateY(0);
    }
    to
    {
        transform: rotateY(90deg) scale(.9);
    }
}
@-webkit-keyframes flipintoleft
{
    from
    {
        -webkit-transform: rotateY(-90deg) scale(.9);
    }
    to
    {
        -webkit-transform: rotateY(0);
    }
}
@keyframes flipintoleft
{
    from
    {
        transform: rotateY(-90deg) scale(.9);
    }
    to
    {
        transform: rotateY(0);
    }
}
@-webkit-keyframes flipintoright
{
    from
    {
        -webkit-transform: rotateY(90deg) scale(.9);
    }
    to
    {
        -webkit-transform: rotateY(0);
    }
}
@keyframes flipintoright
{
    from
    {
        transform: rotateY(90deg) scale(.9);
    }
    to
    {
        transform: rotateY(0);
    }
}/* The properties in this rule are only necessary for the 'flip' transition.
 * We need specify the perspective to create a projection matrix. This will add
 * some depth as the element flips. The depth number represents the distance of
 * the viewer from the z-plane. According to the CSS3 spec, 1000 is a moderate
 * value.
 */
.viewport-turn
{
    -webkit-perspective: 200px;
    perspective: 200px;
    position: absolute;
}
.turn
{
    -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. */
    -webkit-transform-origin: 0;
    backface-visibility: hidden;
    transform: translateX(0);
    transform-origin: 0;
}
.turn.out
{
    -webkit-transform: rotateY(-90deg) scale(.9);
    -webkit-animation-name: flipouttoleft;
    -webkit-animation-duration: 125ms;
    transform: rotateY(-90deg) scale(.9);
    animation-name: flipouttoleft;
    animation-duration: 125ms;
}
.turn.in
{
    -webkit-animation-name: flipintoright;
    -webkit-animation-duration: 250ms;
    animation-name: flipintoright;
    animation-duration: 250ms;
}
.turn.out.reverse
{
    -webkit-transform: rotateY(90deg) scale(.9);
    -webkit-animation-name: flipouttoright;
    transform: rotateY(90deg) scale(.9);
    animation-name: flipouttoright;
}
.turn.in.reverse
{
    -webkit-animation-name: flipintoleft;
    animation-name: flipintoleft;
}
@-webkit-keyframes flipouttoleft
{
    from
    {
        -webkit-transform: rotateY(0);
    }
    to
    {
        -webkit-transform: rotateY(-90deg) scale(.9);
    }
}
@keyframes flipouttoleft
{
    from
    {
        transform: rotateY(0);
    }
    to
    {
        transform: rotateY(-90deg) scale(.9);
    }
}
@-webkit-keyframes flipouttoright
{
    from
    {
        -webkit-transform: rotateY(0);
    }
    to
    {
        -webkit-transform: rotateY(90deg) scale(.9);
    }
}
@keyframes flipouttoright
{
    from
    {
        transform: rotateY(0);
    }
    to
    {
        transform: rotateY(90deg) scale(.9);
    }
}
@-webkit-keyframes flipintoleft
{
    from
    {
        -webkit-transform: rotateY(-90deg) scale(.9);
    }
    to
    {
        -webkit-transform: rotateY(0);
    }
}
@keyframes flipintoleft
{
    from
    {
        transform: rotateY(-90deg) scale(.9);
    }
    to
    {
        transform: rotateY(0);
    }
}
@-webkit-keyframes flipintoright
{
    from
    {
        -webkit-transform: rotateY(90deg) scale(.9);
    }
    to
    {
        -webkit-transform: rotateY(0);
    }
}
@keyframes flipintoright
{
    from
    {
        transform: rotateY(90deg) scale(.9);
    }
    to
    {
        transform: rotateY(0);
    }
}/* flow transition */
.flow
{
    -webkit-transform-origin: 50% 30%;
    transform-origin: 50% 30%;
}
.flow.out
{
    -webkit-transform: translateX(-100%) scale(.7);
    -webkit-animation-name: flowouttoleft;
    -webkit-animation-timing-function: ease;
    -webkit-animation-duration: 350ms;
    transform: translateX(-100%) scale(.7);
    animation-name: flowouttoleft;
    animation-timing-function: ease;
    animation-duration: 350ms;
}
.flow.in
{
    -webkit-transform: translateX(0) scale(1);
    -webkit-animation-name: flowinfromright;
    -webkit-animation-timing-function: ease;
    -webkit-animation-duration: 350ms;
    transform: translateX(0) scale(1);
    animation-name: flowinfromright;
    animation-timing-function: ease;
    animation-duration: 350ms;
}
.flow.out.reverse
{
    -webkit-transform: translateX(100%);
    -webkit-animation-name: flowouttoright;
    transform: translateX(100%);
    animation-name: flowouttoright;
}
.flow.in.reverse
{
    -webkit-animation-name: flowinfromleft;
    animation-name: flowinfromleft;
}
@-webkit-keyframes flowouttoleft
{
    0%
    {
        -webkit-transform: translateX(0) scale(1);
    }
    60%, 70%
    {
        -webkit-transform: translateX(0) scale(.7);
    }
    100%
    {
        -webkit-transform: translateX(-100%) scale(.7);
    }
}
@keyframes flowouttoleft
{
    0%
    {
        transform: translateX(0) scale(1);
    }
    60%, 70%
    {
        transform: translateX(0) scale(.7);
    }
    100%
    {
        transform: translateX(-100%) scale(.7);
    }
}
@-webkit-keyframes flowouttoright
{
    0%
    {
        -webkit-transform: translateX(0) scale(1);
    }
    60%, 70%
    {
        -webkit-transform: translateX(0) scale(.7);
    }
    100%
    {
        -webkit-transform: translateX(100%) scale(.7);
    }
}
@keyframes flowouttoright
{
    0%
    {
        transform: translateX(0) scale(1);
    }
    60%, 70%
    {
        transform: translateX(0) scale(.7);
    }
    100%
    {
        transform: translateX(100%) scale(.7);
    }
}
@-webkit-keyframes flowinfromleft
{
    0%
    {
        -webkit-transform: translateX(-100%) scale(.7);
    }
    30%, 40%
    {
        -webkit-transform: translateX(0) scale(.7);
    }
    100%
    {
        -webkit-transform: translateX(0) scale(1);
    }
}
@keyframes flowinfromleft
{
    0%
    {
        transform: translateX(-100%) scale(.7);
    }
    30%, 40%
    {
        transform: translateX(0) scale(.7);
    }
    100%
    {
        transform: translateX(0) scale(1);
    }
}
@-webkit-keyframes flowinfromright
{
    0%
    {
        -webkit-transform: translateX(100%) scale(.7);
    }
    30%, 40%
    {
        -webkit-transform: translateX(0) scale(.7);
    }
    100%
    {
        -webkit-transform: translateX(0) scale(1);
    }
}
@keyframes flowinfromright
{
    0%
    {
        transform: translateX(100%) scale(.7);
    }
    30%, 40%
    {
        transform: translateX(0) scale(.7);
    }
    100%
    {
        transform: translateX(0) scale(1);
    }
}