.paused {
   -webkit-animation-play-state: paused;
}
/*.willShow {
    -webkit-animation-name: willShow;
}
.willHide {
    -webkit-animation-name: willHide;
}*/
@-webkit-keyframes transform {
    0% {
        opacity: 1.0;
        -webkit-transform-origin: 50% 50% 0;
        -webkit-transform: scale(1.0,1.0);
    }

    25% {
        opacity: 0.0;
        -webkit-transform: scale(0.054,0.072);
        border: solid 2px #2c395b;
        border-radius: 100%;
    }
    to {
        opacity: 1.0;
        -webkit-transform: scale(0.54,0.72);
        border-radius: 100%;
        border: solid 2px #2c395b;
    }
}
@-webkit-keyframes move {
    from {
        /*-webkit-transform: translate(50%, 50%);*/
        motion-rotation: 0deg;
        offset-rotate: 0deg;
    }
    to {
        motion-rotation: 0deg;
        offset-rotate: 0deg;
        opacity: 1.0;
        border-radius: 100%;
        -webkit-transform: scale(0.54,0.72);
        border: solid 2px #2c395b;
        motion-offset: 100%;
        offset-distance: 100%; /*chrome version>M55*/
    }
}
@-webkit-keyframes headerMove {
    from {
        /*-webkit-transform: translate(50%, 50%);*/
        -webkit-transform-origin: 50% 50% 0;
        motion-rotation: 0deg;
        offset-rotate: 0deg;
    }

    to {
        motion-rotation: 0deg;
        offset-rotate: 0deg;
        opacity: 1.0;
        motion-offset: 100%;
        offset-distance: 100%; /*chrome version>M55*/
    }
}
/*@-webkit-keyframes willShow {
    from {
        left:-100%;
    }
    to {
        left:0px;
    }
}
@-webkit-keyframes willHide {
    from {
        left: 0px;
    }

    to {
        left: 100%;
    }
}*/
@-webkit-keyframes before {
    to {
        height: -webkit-calc(100% - 100px);/*miniblink does not support flex propery in animaton keyframes*/
    }
}

@-webkit-keyframes after {
    to {
        height: 0px; /*miniblink does not support flex propery in animaton keyframes*/
    }
}