CSS Frame Quote

HTML
<div class="frame-border"> <div class="frame-inset"> <h1 class="white">Work<br> hard,</h1> <h1>Dream<br> big.</h1> </div> </div>
CSS
html, body { position: relative; background-color: #bdc3c7; width: 100%; min-height: 100%; display: flex; justify-content: center; align-items: center; } h1 { color: #9a0011; text-transform: uppercase; font-family: sans-serif; font-size: 75px; line-height: 85px; letter-spacing: 4px; margin: 0px; } .white { color: #fff; } .frame-border { position: relative; -moz-box-shadow: 20px 20px 36px rgba(0,0,0,0.2); -webkit-box-shadow: 20px 20px 36px rgba(0,0,0,0.2); box-shadow: 20px 20px 36px rgba(0,0,0,0.2); border: 11px solid #192531; width: 457px; height: 547px; } .frame-inset:before { content: " "; display: block; position: absolute; top: 0; left: 0; z-index: 999; width: 100%; height: 100%; -moz-box-shadow: inset 10px 0 12px rgba(0,0,0,0.35); -webkit-box-shadow: inset 10px 0 12px rgba(0,0,0,0.35); box-shadow: inset 10px 0 12px rgba(0,0,0,0.35); } .frame-inset { -moz-box-shadow: inset 0 0 10px rgba(0,0,0,0.2); -webkit-box-shadow: inset 0 0 10px rgba(0,0,0,0.2); box-shadow: inset 0 0 10px rgba(0,0,0,0.2); background-color: #e74c3c; border: 32px solid #f5f5f5; max-width: 100%; max-height: 100%; padding: 72px 49px; }
JAVASCRIPT
Expand for more options Login