main { perspective: 60em; } .post::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 300px; display: block; background: url('https://doggo.ninja/4yYF9v.png'); background-size: contain; background-position: center center; transition: transform 1s; transform: translateY(-100%); pointer-events: none; } .post:hover::before { transform: none; } .post { overflow: hidden; } header { background: url('https://doggo.ninja/JfPhTS.png'); background-repeat: repeat-x; background-position: center left; animation: conga 20s infinite linear; } header p { background: rgba(255, 255, 255, 0.7); margin: 0 auto; width: 300px; border-radius: 20px; } header img { background-color: lightblue; } header::before { content: 'CONGA!!!!'; position: absolute; left: 0px; font-size: 50px; background-color: rgba(0, 0, 0, 0.5); padding: 20px; } @keyframes conga { from { background-position: center left; } to { background-position: center right; } } @keyframes cool { from { transform: none; } 50% { transform: rotateX(-20deg); } to { transform: none; } }