/*  animation  */
    .slideUp_04 {
        -webkit-animation: slideUp 1.5s ease-in-out forwards, floating 1.8s ease-in-out infinite;
        animation: slideUp 1.5s ease-in-out forwards, floating 1.8s 1.5s ease-in-out infinite;
    }
    .slideUp_03 {
        -webkit-animation: slideUp 1.55s ease-in-out forwards, floating 2.3s ease-in-out infinite;
        animation: slideUp 1.55s ease-in-out forwards, floating 2.3s 1.55s ease-in-out infinite;
    }
    .slideUp_02 {
        -webkit-animation: slideUp 1.6s ease-in-out forwards, floating 2.5s ease-in-out infinite;
        animation: slideUp 1.6s ease-in-out forwards, floating 2.5s 1.6s ease-in-out infinite;
    }
    .slideUp_01 {
        -webkit-animation: slideUp 1.65s ease-in-out forwards, floating 2.7s ease-in-out infinite;
        animation: slideUp 1.65s ease-in-out forwards, floating 2.7s 1.65s ease-in-out infinite;
    }


    @-webkit-keyframes floating {
        0% {-webkit-transform: translateY(0);}
        50% {-webkit-transform: translateY(-5px);}
        100% {-webkit-transform: translateY(0px);}     
    }
    @keyframes floating {
        0% {transform: translateY(0);}
        50% {transform: translateY(-5px);} 
        100% {transform: translateY(0px);}     
    }
    @-webkit-keyframes slideUp {
        0% {-webkit-transform: translateY(170%);}
        50%{-webkit-transform: translateY(-100%);}    
        95% {-webkit-transform: translateY(20px);}
        100%{-webkit-transform: translateY(0);}
    }
    @keyframes slideUp {
        0% {transform: translateY(170%);}
        50%{transform: translateY(-100%);}     
        95% {transform: translateY(20px);}
        100% {transform: translateY(0);} 
    }

    
    .rpflipInY {
        -webkit-backface-visibility: visible !important;
        backface-visibility: visible !important;
        -webkit-animation-name: rpflipInY;
        animation-name: rpflipInY;
        -webkit-animation-duration: 1s;
        animation-duration: 1s;
        -webkit-animation-fill-mode: both;
        animation-fill-mode: both;
    }

        @-webkit-keyframes rpflipInY {
          0% {
            -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 0deg);
            transform: perspective(400px) rotate3d(0, 1, 0, 0deg);
            -webkit-transition-timing-function: ease-in;
            transition-timing-function: ease-in;
          }
          40% {
            -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
            transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
            -webkit-transition-timing-function: ease-in;
            transition-timing-function: ease-in;
          }
          60% {
            -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
            transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
          }
          80% {
            -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
            transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
          }
          100% {
            -webkit-transform: perspective(400px);
            transform: perspective(400px);
          }
        }