@-webkit-keyframes text-focus-in { 0% { -webkit-filter: blur(3px); filter: blur(3px); opacity: 0; } 100% { -webkit-filter: blur(0px); filter: blur(0px); opacity: 1; } } @keyframes text-focus-in { 0% { -webkit-filter: blur(3px); filter: blur(3px); opacity: 0; } 100% { -webkit-filter: blur(0px); filter: blur(0px); opacity: 1; } } .blurIn { -webkit-animation: text-focus-in cubic-bezier(0.550, 0.085, 0.680, 0.530) both; animation: text-focus-in cubic-bezier(0.550, 0.085, 0.680, 0.530) both; } @-webkit-keyframes text-focus-in-down { 0% { -webkit-filter: blur(3px); filter: blur(3px); opacity: 0; transform: translateY(20px); } 100% { -webkit-filter: blur(0px); filter: blur(0px); opacity: 1; transform: translateY(0px); } } @keyframes text-focus-in-down { 0% { -webkit-filter: blur(3px); filter: blur(3px); opacity: 0; transform: translateY(20px); } 100% { -webkit-filter: blur(0px); filter: blur(0px); opacity: 1; transform: translateY(0px); } } .blurInDown { -webkit-animation: text-focus-in-down cubic-bezier(0.550, 0.085, 0.680, 0.530) both; animation: text-focus-in-down cubic-bezier(0.550, 0.085, 0.680, 0.530) both; } @-webkit-keyframes text-focus-in-up { 0% { -webkit-filter: blur(3px); filter: blur(3px); opacity: 0; transform: translateY(-20px); } 100% { -webkit-filter: blur(0px); filter: blur(0px); opacity: 1; transform: translateY(0px); } } @keyframes text-focus-in-up { 0% { -webkit-filter: blur(3px); filter: blur(3px); opacity: 0; transform: translateY(-20px); } 100% { -webkit-filter: blur(0px); filter: blur(0px); opacity: 1; transform: translateY(0px); } } .blurInUp { -webkit-animation: text-focus-in-up 500ms cubic-bezier(0.550, 0.085, 0.680, 0.530) both; animation: text-focus-in-up 500ms cubic-bezier(0.550, 0.085, 0.680, 0.530) both; } @-webkit-keyframes text-focus-in-left { 0% { -webkit-filter: blur(3px); filter: blur(3px); opacity: 0; transform: translateX(-20px); } 100% { -webkit-filter: blur(0px); filter: blur(0px); opacity: 1; transform: translateX(0px); } } @keyframes text-focus-in-left { 0% { -webkit-filter: blur(3px); filter: blur(3px); opacity: 0; transform: translateX(-20px); } 100% { -webkit-filter: blur(0px); filter: blur(0px); opacity: 1; transform: translateX(0px); } } .blurInLeft { -webkit-animation: text-focus-in-left 500ms cubic-bezier(0.550, 0.085, 0.680, 0.530) both; animation: text-focus-in-left 500ms cubic-bezier(0.550, 0.085, 0.680, 0.530) both; } @-webkit-keyframes text-focus-in-right { 0% { -webkit-filter: blur(3px); filter: blur(3px); opacity: 0; transform: translateX(20px); } 100% { -webkit-filter: blur(0px); filter: blur(0px); opacity: 1; transform: translateX(0px); } } @keyframes text-focus-in-right { 0% { -webkit-filter: blur(3px); filter: blur(3px); opacity: 0; transform: translateX(20px); } 100% { -webkit-filter: blur(0px); filter: blur(0px); opacity: 1; transform: translateX(0px); } } .blurInRight { -webkit-animation: text-focus-in-right 500ms cubic-bezier(0.550, 0.085, 0.680, 0.530) both; animation: text-focus-in-right 500ms cubic-bezier(0.550, 0.085, 0.680, 0.530) both; }