diff --git a/animate.css b/animate.css index d71da17..a7e794a 100644 --- a/animate.css +++ b/animate.css @@ -1089,6 +1089,75 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI animation-name: fadeInLeftBig; } +@-webkit-keyframes fadeInLeftLoop { + 0%, 10% { + opacity: 0; + -webkit-transform: translateX(-20px); + -ms-transform: translateX(-20px); + transform: translateX(-20px); + } + + 20% { + opacity: 1; + -webkit-transform: translateX(0); + -ms-transform: translateX(0); + transform: translateX(0); + } + + 80% { + opacity: 1; + -webkit-transform: translateX(0px); + -ms-transform: translateX(0px); + transform: translateX(0px); + } + + 90%, 100% { + opacity: 0; + -webkit-transform: translateX(20px); + -ms-transform: translateX(20px); + transform: translateX(20px); + } +} + +@keyframes fadeInLeftLoop { + 0%, 10% { + opacity: 0; + -webkit-transform: translateX(-20px); + -ms-transform: translateX(-20px); + transform: translateX(-20px); + } + + 20% { + opacity: 1; + -webkit-transform: translateX(0); + -ms-transform: translateX(0); + transform: translateX(0); + } + + 80% { + opacity: 1; + -webkit-transform: translateX(0px); + -ms-transform: translateX(0px); + transform: translateX(0px); + } + + 90%, 100% { + opacity: 0; + -webkit-transform: translateX(20px); + -ms-transform: translateX(20px); + transform: translateX(20px); + } +} + +.fadeInLeftLoop { + -webkit-animation-name: fadeInLeftLoop; + animation-name: fadeInLeftLoop; + -webkit-animation-duration: 10s; + animation-duration: 10s; + -webkit-animation-iteration-count: infinite; + animation-iteration-count: infinite; +} + @-webkit-keyframes fadeInRight { 0% { opacity: 0; @@ -1159,6 +1228,75 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI animation-name: fadeInRightBig; } +@-webkit-keyframes fadeInRightLoop { + 0%, 10% { + opacity: 0; + -webkit-transform: translateX(20px); + -ms-transform: translateX(20px); + transform: translateX(20px); + } + + 20% { + opacity: 1; + -webkit-transform: translateX(0); + -ms-transform: translateX(0); + transform: translateX(0); + } + + 80% { + opacity: 1; + -webkit-transform: translateX(0px); + -ms-transform: translateX(0px); + transform: translateX(0px); + } + + 90%, 100% { + opacity: 0; + -webkit-transform: translateX(-20px); + -ms-transform: translateX(-20px); + transform: translateX(-20px); + } +} + +@keyframes fadeInRightLoop { + 0%, 10% { + opacity: 0; + -webkit-transform: translateX(20px); + -ms-transform: translateX(20px); + transform: translateX(20px); + } + + 20% { + opacity: 1; + -webkit-transform: translateX(0); + -ms-transform: translateX(0); + transform: translateX(0); + } + + 80% { + opacity: 1; + -webkit-transform: translateX(0px); + -ms-transform: translateX(0px); + transform: translateX(0px); + } + + 90%, 100% { + opacity: 0; + -webkit-transform: translateX(-20px); + -ms-transform: translateX(-20px); + transform: translateX(-20px); + } +} + +.fadeInRightLoop { + -webkit-animation-name: fadeInRightLoop; + animation-name: fadeInRightLoop; + -webkit-animation-duration: 10s; + animation-duration: 10s; + -webkit-animation-iteration-count: infinite; + animation-iteration-count: infinite; +} + @-webkit-keyframes fadeInUp { 0% { opacity: 0; @@ -2741,4 +2879,4 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI .rollOut { -webkit-animation-name: rollOut; animation-name: rollOut; -} \ No newline at end of file +}