/*
 * animations css stylesheet
 */

/* cross fading between routes with ngView */

.view-container {
  position: relative;
}

.view-frame.ng-enter,
.view-frame.ng-leave {
  background: white;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}

.view-frame.ng-enter {
  -webkit-animation: 0.5s fade-in;
  -moz-animation: 0.5s fade-in;
  -o-animation: 0.5s fade-in;
  animation: 0.5s fade-in;
  z-index: 100;
}

.view-frame.ng-leave {
  -webkit-animation: 0.5s fade-out;
  -moz-animation: 0.5s fade-out;
  -o-animation: 0.5s fade-out;
  animation: 0.5s fade-out;
  z-index: 99;
}

@keyframes fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
@-moz-keyframes fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
@-webkit-keyframes fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes fade-out {
  from { opacity: 1; }
  to { opacity: 0; }
}
@-moz-keyframes fade-out {
  from { opacity: 1; }
  to { opacity: 0; }
}
@-webkit-keyframes fade-out {
  from { opacity: 1; }
  to { opacity: 0; }
}

@keyframes light {
  0%{
    color: #0f0f0f;
  }
  50%{
    color: #ffe136;
  }
  100%{
    color: #0f0f0f;
  }
}
@keyframes position {
  0%{
    /*top: 0;*/
    /*font-size: 14px;*/
    text-shadow: 0 0 3px #ff759c;
  }
  25%{
    /*top: -1px;*/
  }
  50%{
    /*font-size: 15px;*/
    text-shadow: 0 0 10px #ee44ee;
  }
  75%{
    /*top: 1px;*/
  }
  100%{
    /*top: 0;*/
  }
}