body { height: 100%; width: 100%; max-width: 100%; max-height: 100%; overflow: hidden; background: white } a { color: blue; } #inviteDiv { white-space: pre; position: absolute; display: flex; flex-direction: column; justify-content: center; align-items: center; pointer-events: none; word-wrap: break-word; width: 100%; } #inviteDiv h1, h2 { text-align: center; font-family: monospace; max-width: 100%; margin: 0; word-wrap: break-word; text-shadow: 3px 3px 1px rgba(75, 75, 75, 1); color: #d152b8; } #inviteDiv h1 { font-size: 1vw; padding-top: 5vh; padding-left: 17vw; } #inviteDiv h2 { font-size: 0.4vw; padding-left: 24vw; } #invitetextDiv { z-index: 500; position: absolute; display: flex; justify-content: center; align-items: center; word-wrap: normal; height: 100%; width: 100%; max-height: 100%; max-width: 100%; } #invitetextDiv p { font-family: Arial; font-weight: bold; flex-grow: 1; font-size: 1vw; color: #d152b8; text-align: center; line-height: 1.8vh; margin-left: 25vw; margin-right: 27vw; padding-top: 12vh; } #backgroundDiv { white-space: pre; position: absolute; display: flex; padding-top: 4vh; justify-content: center; align-items: center; width: 100%; height: 100%; } #backgroundDiv h3 { font-family: monospace; white-space: pre; font-size: 0.8vw; color: lightgrey; padding-right: 3vw; padding-top: 5vh; } @media only screen and (max-width: 768px) { #inviteDiv h1 { padding-top: 0vh; font-size: 1.5vw; } #inviteDiv h2 { font-size: 0.8vw; padding-left: 27vw; } #invitetextDiv p { padding-top: 8vh; font-size: 2.5vw; line-height: 3vw; color: #d152b8; margin-left: 5vw; margin-right: 10vw; } #backgroundDiv h3 { font-size: 1.8vw; padding-right: 10vw; padding-top: 0vh; } }