
.right{
    display: block;
}

.fadeLeft{
    top: 0%;
    right: -100%;
    opacity: 1;
    animation: fadeLeft 0.2s 0s 1 ease-out normal forwards;
}
@keyframes fadeLeft {
 from{
    right: -100%;
 }
 to{
    right: 0%;
 }
}

.fadeRight{
    top: 0%;
    right: 0%;
    opacity: 1;
    animation: fadeRight 0.5s 0s 1 ease-out normal forwards;
}
@keyframes fadeRight {
 1%{
    opacity: 1;
    right: 0%;
 }
 100%{
    opacity: 0;
    right: -100%;
 }
}

.rightClone{
   top: 0%;
   opacity: 0;
   right: -100%;
}
.fadeLeftClone{
   animation: fadeLeftClone 0.3s 0.2s 1 ease-out normal forwards;
}
@keyframes fadeLeftClone {
1%{
   right: -100%;
}
100%{
   right: 0%;
}
}
