.one-div { position: relative; height: 250px; width: 200px; background-color: rgb(15, 15, 15); transform-style: preserve-3d; animation: rot 2s infinite ease; border-radius: 20px; box-shadow: 0 0 50px 0px ,inset 0 0 90px 0px; ; transition: 1.5s; display: flex; justify-content: center; align-items: center; } .one-div .text { opacity: 0; transition: all 0.5s; } .one-div:hover.one-div .text { scale: 1.2; opacity: 0.7; } .one-div:hover { box-shadow: 0 0 30px 1000px black,inset 5px 5px 5px 0px rgb(31, 31, 31); } @keyframes rot { 0% { transform: rotateX(-15deg) translateY(0px); } 50% { transform: rotateX(-15deg) translateY(-10px); } 100% { transform: rotateX(-15deg) translateY(0px); } }