/* ANIMATIONS
============================================================================= */
.page.ng-enter{
  z-index: 9999;
}

.page-login.ng-enter     {  
   -webkit-animation:scaleUp 0.2s both ease-in;
  -moz-animation:scaleUp 0.2s both ease-in;
  animation:scaleUp 0.2s both ease-in;
}

.page-patients.ng-enter    {  
  -webkit-animation:slideInRight 0.5s both ease-in;
  -moz-animation:slideInRight 0.5s both ease-in;
  animation:slideInRight 0.5s both ease-in;    
}

/* wounds------------------------ */
.page-wounds.ng-enter    {  
  -webkit-animation:slideInRight 0.4s both ease-in;
  -moz-animation:slideInRight 0.4s both ease-in;
  animation:slideInRight 0.4s both ease-in;    
}
.page-wounds    {  
  max-width: 1500px;
  margin: 0 auto;
}

.section.ng-enter
{ 
  -webkit-animation:slideInRight 0.4s both ease-in;
  -moz-animation:slideInRight 0.5s both ease-in;
  animation:slideInRight 0.5s both ease-in;  
} 

.bgimage.ng-enter{
    -webkit-animation:slideInRight 0.4s both ease-in;
  -moz-animation:slideInRight 0s both ease-in;
  animation:slideInRight 0s both ease-in; 
}
.wound-step-2.ng-enter{
    -webkit-animation:slideInRight 0.4s both ease-in;
  -moz-animation:slideInRight 0.5s both ease-in;
  animation:slideInRight 0.5s both ease-in; 
}
/* rotate and fall */
@-webkit-keyframes rotateFall {
  0% { -webkit-transform: rotateZ(0deg); }
  20% { -webkit-transform: rotateZ(10deg); -webkit-animation-timing-function: ease-out; }
  40% { -webkit-transform: rotateZ(17deg); }
  60% { -webkit-transform: rotateZ(16deg); }
  100% { -webkit-transform: translateY(100%) rotateZ(17deg); }
}
@-moz-keyframes rotateFall {
  0% { -moz-transform: rotateZ(0deg); }
  20% { -moz-transform: rotateZ(10deg); -moz-animation-timing-function: ease-out; }
  40% { -moz-transform: rotateZ(17deg); }
  60% { -moz-transform: rotateZ(16deg); }
  100% { -moz-transform: translateY(100%) rotateZ(17deg); }
}
@keyframes rotateFall {
  0% { transform: rotateZ(0deg); }
  20% { transform: rotateZ(10deg); animation-timing-function: ease-out; }
  40% { transform: rotateZ(17deg); }
  60% { transform: rotateZ(16deg); }
  100% { transform: translateY(100%) rotateZ(17deg); }
}

/* scale up */
@keyframes scaleUp {
  from    { opacity: 0.3; transform: scale(0.8); }
}
@-moz-keyframes scaleUp {
  from    { opacity: 0.3; -moz-transform: scale(0.8); }
}
@-webkit-keyframes scaleUp {
  from    { opacity: 0.3; -webkit-transform: scale(0.8); }
}

/* move */
@-webkit-keyframes moveFromBottom {
  from { -webkit-transform: translateY(100%); }
}
@keyframes moveFromBottom {
  from { -webkit-transform: translateY(100%); transform: translateY(100%); }
}
/* slide in from the right */
@keyframes slideInRight {
  from  { transform:translateX(100%); }
  to    { transform: translateX(0); }
}
@-moz-keyframes slideInRight {
  from  { -moz-transform:translateX(100%); }
  to    { -moz-transform: translateX(0); }
}
@-webkit-keyframes slideInRight {
  from  { -webkit-transform:translateX(100%); }
  to    { -webkit-transform: translateX(0); }
}

/* slide in from the bottom */
@keyframes slideInUp {
  from  { transform:translateY(100%); }
  to    { transform: translateY(0); }
}
@-moz-keyframes slideInUp {
  from  { -moz-transform:translateY(100%); }
  to    { -moz-transform: translateY(0); }
}
@-webkit-keyframes slideInUp {
  from  { -webkit-transform:translateY(100%); }
  to    { -webkit-transform: translateY(0); }
}

/* slide in from the bottom */
@keyframes slideOutLeft {
  to    { transform: translateX(-100%); }
}
@-moz-keyframes slideOutLeft {  
  to    { -moz-transform: translateX(-100%); }
}
@-webkit-keyframes slideOutLeft {
  to    { -webkit-transform: translateX(-100%); }
}