/* ================================
|                                 |
|        Animations used          |
|                                 |
================================ */

/* loading */
@keyframes animation_spring_ltr_custom {
    0%   {  margin-left: 0%;   width: 10%;  }
    25%  {  margin-left: 10%;  width: 80%;  }
    50%  {  margin-left: 90%;  width: 10%;  }
    75%  {  margin-left: 10%;  width: 80%;  }
    100% {  margin-left: 0%;   width: 10%;  }
}

/* 360 */
@keyframes anim_motherfuck_effet{
    0%     { transform: rotate(0deg);   }
    100%   { transform: rotate(360deg); }
}

/* when same view */
@keyframes anim_bounce_effet{
    0%     { transform: scale(1);                         }
    50%    { transform: scale(0.95); border-radius:20px;  }
    100%   { transform: scale(1);                         }
}

/* for the superposition effect */
@keyframes anim_superposition_scale_down{
    0%     { transform: scale(1);                          }
    100%    { transform: scale(0.95); border-radius:20px;  }
}





/* ================================
|                                 |
|      Animations not used        |
|                                 |
================================ */

@keyframes animation_spring_ltr {
    0%   {  margin-left: 0%;   width: 10%;   }
    25%  {  margin-left: 0%;   width: 100%;  }
    50%  {  margin-left: 90%;  width: 10%;   }
    75%  {  margin-left: 0%;   width: 100%;  }
    100% {  margin-left: 0%;   width: 10%;   }
}

@keyframes animation_spring_center {
    0%   {  margin: auto;    width: 10%;   }
    50%  {  margin: auto;    width: 100%;  }
    100% {  margin: auto;    width: 10%;   }
}

@keyframes animation_passage {
    0%   {  margin-left: 0%;    width: 0%;    }
    50%  {  margin-left: 0%;    width: 100%;  }
    100% {  margin-left: 100%;  width: 0%;    }
}