@charset "UTF-8";
@keyframes spin { 
 0% { transform: rotate(0deg); } 
 100% { transform: rotate(360deg); } 
 }
 
@keyframes move-x {0% { transform: translateX(30px); -webkit-transform: translateX(30px); -moz-transform: translateX(30px); -ms-transform: translateX(30px); -o-transform: translateX(30px); } 
100% { transform: translateX(0px); -webkit-transform: translateX(0px); -moz-transform: translateX(0px); -ms-transform: translateX(0px); -o-transform: translateX(0px); } 
 }

@keyframes move-y {0% { transform: translateY(10px); -webkit-transform: translateY(10px); -moz-transform: translateY(10px); -ms-transform: translateY(10px); -o-transform: translateY(10px); } 
100% { transform: translateY(0px); -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); } 
 }

@keyframes swing-x {0% { transform: translateX(0); -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); } 
100% { transform: translateX(3px); -webkit-transform: translateX(3px); -moz-transform: translateX(3px); -ms-transform: translateX(3px); -o-transform: translateX(3px); } 
 }
@keyframes swing-y {0% { transform: translateY(-4px); -webkit-transform: translateY(-4px); -moz-transform: translateY(-4px); -ms-transform: translateY(-4px); -o-transform: translateY(-4px); } 
100% { transform: translateY(4px); -webkit-transform: translateY(4px); -moz-transform: translateY(4px); -ms-transform: translateY(4px); -o-transform: translateY(4px); } 
 }

@keyframes rotate {0% { transform: rotate(0); -webkit-transform: rotate(0); -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); } 
100% { transform: rotate(90deg); -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); } 
 }

@keyframes reveal-cover {0% { opacity: 0; clip-path: polygon(0 100%, 0 100%, 0 0, 0 0); } 
100% { opacity: 1; clip-path: polygon(0 100%, 100% 100%, 100% 0, 0 0); } 
 }

@keyframes opa {0% { opacity: 0; } 
100% { opacity: 1; } 
 }

 @keyframes bg-ani {0% { background-color: var(--sub2); } 
100% { background-color: #111; } 
 }







