<!DOCTYPE html> <html> <head> <title>Momo eG</title> <style> * { box-sizing: border-box; } html { font-size: 3vh; font-weight: 800; font-style: italic; } @media (min-width: 800px) { html { font-size: 4vh; } } body { margin: 0; padding: 1rem; display: flex; flex-direction: column; font-family: Source Sans Pro, Open Sans, sans-serif; background: radial-gradient(circle, rgba(255, 0, 230, 1) 0%, rgba(255, 0, 67, 1) 100%); color: white; height: 100vh; width: 100vw; } .logo { text-align: right; } .realness { display: block; margin-left: 2rem; } @media (min-width: 800px) { .realness { display: inline; margin-left: 0rem; } } h1 { font-size: 2rem; line-height: 1; font-weight: 800; font-style: normal; } @media (min-width: 800px) { h1 { margin-bottom: 2rem; } } @media (min-width: 800px) { p { max-width: 1200px; margin-top: 0; } } footer { margin-top: auto; } @media (min-width: 800px) { footer { margin-top: 0; } } a { word-wrap: break-word; line-break: normal; color: white; text-decoration: none; } a:hover { text-decoration: underline; } </style> </head> <body> <div class="logo"> Momo eG </div> <h1><> <span class="realness">IT ain't easy</span> </></h1> <p> We are a collective of professionals from around the field of IT. We are currently in the process of founding a German cooperative (e.G.). </p> <p> We are here to help you plan, design, develop, end operate solutions in the information technology space. </p> <footer> <p> <a href="mailto:everyone@list.momo.koeln">everyone@list.momo.koeln</a> </p> </footer> </body> </html>