HTML ⛶ <div class="container"> <div class="main-heading">you will read this first</div> <div class="secondary-text">Then you will read this...</div> <div class="tertiary-text">...followed by this text</div> <div class="additional-note">And you will read this at the end.</div> </div>
CSS 🛠⛶ body { font-family: Arial, sans-serif; background-color: #333; color: #fff; text-align: center; padding: 20px; } * { box-sizing: border-box; } .container { position: relative; border: 6px solid #999; padding: 20px; border-radius: 10px; background-color: #444; width: 600px; height: 400px; margin: 20px auto; box-shadow: 7px 7px 5px 0px rgba(0,0,0,0.75); } .main-heading { font-size: 3em; font-weight: bold; color: #FFD700; text-transform: uppercase; } .secondary-text { } .tertiary-text { } .additional-note { }