From Graphic to Code

I had made the graphic below in Photoshop and in a moment of curiosity, I wonder if it was possible to recreate the text/border portion with HTML/CSS.

Honestly this is probably how web developers feel when they receive an impractical design to implement, but it was a nice challenge for me. Keep in mind that Internet Explorer had not been killed off yet so it was a NIGHTMARE to design anything remotely creative and still be compatible with it.

Result:

For the top border I created a psuedo border using ::before and ::after

And then the rest of the box had a regular border"

Lastly, it had to scale adequately on iPad/smaller laptop screens, so once it reached a certain breaking point, it convert to this design and the background would remain static as the sides closed in: