.animsition, .animsition-overlay { position: relative; opacity: 0; animation-fill-mode: both; } .animsition-overlay-slide { position: fixed; z-index: 1; width: 100%; height: 100%; } /* loading option */ .roy-loader { width: 100%; height: 100vh; position: fixed; top: 0; left: 0; z-index: 1000; } .roy-loader .icon_loader { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .roy-loader .icon_loader span { display: inline-block; width: 10px; height: 10px; border-radius: 50%; border-width: 2px; border-style: solid; margin-right: 4px; transform: translateZ(0); animation-iteration-count: infinite; animation-timing-function: linear; animation-duration: 0.6s; animation-name: icon_loader; } .roy-loader .icon_loader span:nth-child(2) { animation-delay: 0.2s; } .roy-loader .icon_loader span:nth-child(3) { animation-delay: 0.4s; } @keyframes icon_loader { 0% { transform: translateY(0); } 25% { transform: translateY(3px); } 75% { transform: translateY(-3px); } 100% { transform: translateY(0); } } @keyframes fade-in { 0% { opacity: 0; } 100% { opacity: 1; } } .fade-in { animation-name: fade-in; } @keyframes fade-out { 0% { opacity: 1; } 100% { opacity: 0; } } .fade-out { animation-name: fade-out; } @keyframes fade-in-up { 0% { transform: translateY(500px); opacity: 0; } 100% { transform: translateY(0); opacity: 1; } } .fade-in-up { animation-name: fade-in-up; } @keyframes fade-out-up { 0% { transform: translateY(0); opacity: 1; } 100% { transform: translateY(-500px); opacity: 0; } } .fade-out-up { animation-name: fade-out-up; } @keyframes fade-in-up-sm { 0% { transform: translateY(100px); opacity: 0; } 100% { transform: translateY(0); opacity: 1; } } .fade-in-up-sm { animation-name: fade-in-up-sm; } @keyframes fade-out-up-sm { 0% { transform: translateY(0); opacity: 1; } 100% { transform: translateY(-100px); opacity: 0; } } .fade-out-up-sm { animation-name: fade-out-up-sm; } @keyframes fade-in-down { 0% { transform: translateY(-500px); opacity: 0; } 100% { transform: translateY(0); opacity: 1; } } .fade-in-down { animation-name: fade-in-down; } @keyframes fade-out-down { 0% { transform: translateY(0); opacity: 1; } 100% { transform: translateY(500px); opacity: 0; } } .fade-out-down { animation-name: fade-out-down; } @keyframes fade-in-down-sm { 0% { transform: translateY(-100px); opacity: 0; } 100% { transform: translateY(0); opacity: 1; } } .fade-in-down-sm { animation-name: fade-in-down-sm; } @keyframes fade-out-down-sm { 0% { transform: translateY(0); opacity: 1; } 100% { transform: translateY(100px); opacity: 0; } } .fade-out-down-sm { animation-name: fade-out-down-sm; }/*# sourceMappingURL=animsition.css.map */