SOURCE

<section>
    <svg viewBox='0 0 1080 1920'>
        <g>
            <g>
                <foreignobject x='0' y='0' width="1080" height="1920">
                    <svg class="135svg" width="100%" height="100%" style="background-image: url(https://bcn.135editor.com/files/202208/fwrAhOwX_x5KB.png) ;background-repeat:no-repeat;background-size:cover;"></svg>
                </foreignobject>
            </g>
            <svg>
                <g>
                    <g transform='translateY(660)'>
                        <foreignobject x='0' y='0' width="1080" height="1920">
                            <svg class="135svg" width="100%" height="100%" style="background-image: url(https://bcn.135editor.com/files/202208/Bb6THpFF_z9TE.png) ;background-repeat:no-repeat;background-size:cover;"></svg>
                        </foreignobject>
                    </g>
                    <animatetransform attributeType='XML' attributeName='transform' type='translateY' values='0 660;0 0' begin='0s' dur='2s' restart='never' fill='freeze'></animatetransform>
                </g>
            </svg>
            <g>
                <g>
                    <foreignobject x='0' y='0' width="1080" height="1920">
                        <svg class="135svg" opacity='0' width="100%" height="100%" style="background-image: url(https://bcn.135editor.com/files/202208/IsrdvIGS_UZSM.png) ;background-repeat:no-repeat;background-size:cover;">
                            <animate attributename="opacity" values="0;0; 1" begin="1.5s" dur="2s" fill="freeze" restart="never"></animate>
                        </svg>
                    </foreignobject>
                </g>
            </g>
        </g>
    </svg>
</section>