PostRoundPopup { position: absolute; width: 100%; height: 100%; transition: opacity 1s ease-in-out; justify-content: center; text-align: center; pointer-events: none; opacity: 1; z-index: 7; .background-banner { position: absolute; top: 82px; width: 100%; height: 150px; justify-content: center; align-items: center; box-shadow: 0 0 10px black; } .container { max-height: 250px; flex-direction: column; transition: transform 2s ease-in-out; transform: scale(1); } .header { text-transform: uppercase; font-weight: bolder; font-size: 50px; width: 100%; } .content { font-size: 20px; font-weight: 600; } &:intro { opacity: 0; .container { transform: scale(0.75); } } &:outro { opacity: 0; .container { transform: scale(0.75); } } }