/*! Open Sans Semibold | Apache License 2.0 | fonts.google.com/specimen/Open+Sans */ @font-face { font-family: "Open Sans"; font-weight: 600; font-style: normal; src: url("./fonts/OpenSans-Semibold.eot"); /* IE9 Compat Modes */ src: local("Open Sans SemiBold"), local("OpenSans-SemiBold"), url("./fonts/OpenSans-Semibold.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */ url("./fonts/OpenSans-Semibold.woff2") format("woff2"), /* Super Modern Browsers */ url("./fonts/OpenSans-Semibold.woff") format("woff"), /* Modern Browsers */ url("./fonts/OpenSans-Semibold.ttf") format("truetype"), /* Safari, Android, iOS */ url("./fonts/OpenSans-Semibold.svg#OpenSans") format("svg"); /* Legacy iOS */ font-display: fallback; } html, body { display: table; font-size: 4.5em; line-height: 1.15; font-family: "Open Sans", sans-serif; font-weight: 600; width: 100%; height: 100%; margin: 0; background-color: #9ac92f; color: #ffffff; cursor: default; } div#container { display: table-cell; vertical-align: middle; margin: 0 auto; width: 100%; height: 100%; text-align: center; } @media (min-width: 0px) { html { font-size: 50%; } } @media (min-width: 300px) { html { font-size: 70%; } } @media (min-width: 500px) { html { font-size: 80%; } } @media (min-width: 700px) { html { font-size: 120%; } } @media (min-width: 1200px) { html { font-size: 200%; } } div#footer { position: absolute; bottom: 0; right: 0; font-size: 14px; margin: 12px; } div#footer a { text-decoration: none; color: inherit; } div#footer span { vertical-align: middle; } div#footer img { height: 20px; width: 20px; vertical-align: middle; }