/*.login-container {
  animation-duration: 2s;
  animation-name: comein;
	width: 100%;
	margin: 0 auto;
}

.login-container-out {
  animation-duration: 2s;
  animation-name: comeout;
	width: 100%;
	margin: 0 auto;
}
         
@keyframes comein {
  from {
 	width: 10%;
	opacity: 0;
  }

  to {
    width: 100%;
  	opacity: 1;
  }
}

@keyframes comeout {
  from {
 	width: 100%;
	opacity: 1;
  }

  to {
    width: 10%;
  	opacity: 0;
  }
}*/

.view-container {
position: relative;
}
 
.view-frame-default.ng-enter, .view-frame-default.ng-leave, .menu-list.ng-enter, .menu-list.ng-leave, .menu-list-leave.ng-enter, .menu-list-leave.ng-leave, .option-list.ng-enter, .option-list.ng-leave {
position: absolute;
top: 0;
left: 0;
right: 0;
}

.option-list-leave.ng-enter, .option-list-leave.ng-leave, .screen-take-picture.ng-enter, .screen-take-picture.ng-leave, .get-contacts-leave.ng-leave, .fill-profile.ng-enter, .fill-profile.ng-leave, .screen-take-picture-back.ng-enter, .screen-take-picture-back.ng-leave, .categories.ng-leave, .categories.ng-enter {
position: absolute;
top: 0;
left: 0;
right: 0;
}
 
.view-frame-default.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-default.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; }
}

.menu-list.ng-enter {
  animation-duration: 0.7s;
  animation-name: slidefromleft;
}

.menu-list.ng-leave {
  animation-duration: 0.7s;
  animation-name: leavefromleft;
}

.menu-list-leave.ng-enter {
  animation-duration: 0.7s;
  animation-name: slidefromright;
}

.menu-list-leave.ng-leave {
  animation-duration: 0.7s;
  animation-name: leavefromright;
}

.option-list.ng-enter {
  animation-duration: 0.7s;
  animation-name: slidefromright;
}

.option-list.ng-leave {
  animation-duration: 0.7s;
  animation-name: leavefromright;
}

.option-list-leave.ng-enter {
  animation-duration: 0.7s;
  animation-name: slidefromleft;
}

.option-list-leave.ng-leave {
  animation-duration: 0.7s;
  animation-name: leavefromleft;
}

.screen-take-picture.ng-enter {
  animation-duration: 0.7s;
  animation-name: slidefromright;
}

.screen-take-picture.ng-leave {
  animation-duration: 0.7s;
  animation-name: leavefromright;
}

.screen-take-picture-back.ng-enter {
  animation-duration: 0.7s;
  animation-name: slidefromleft;
}

.screen-take-picture-back.ng-leave {
  animation-duration: 0.7s;
  animation-name: leavefromright;
}

.fill-profile.ng-enter {
  animation-duration: 0.7s;
  animation-name: slidefromright;
}

.fill-profile.ng-leave {
  animation-duration: 0.7s;
  animation-name: leavefromright;
}

.get-contacts-leave.ng-leave {
  animation-duration: 0.7s;
  animation-name: leavefromright;
}

.categories.ng-leave {
  animation-duration: 0.7s;
  animation-name: leavefromright;
}

.categories.ng-enter {
  animation-duration: 0.7s;
  animation-name: slidefromright;
}

@keyframes slidefromleft {
  from {
	transform: scale(1) translateX(-100%);
  }

  to {
  	transform: scale(1) translateX(0%);
  }
}

@keyframes slidefromright {
  from {
    transform: scale(1) translateX(100%);
  }

  to {
    transform: scale(1) translateX(0%);
  }
}

@keyframes leavefromright {
  from {
    transform: scale(1) translateX(0%);
  }

  to {
    transform: scale(1) translateX(-100%);
  }
}

@keyframes leavefromleft {
  from {
    transform: scale(1) translateX(0%);
  }

  to {
    transform: scale(1) translateX(100%);
  }
}