/* * Prefixed by https://autoprefixer.github.io * PostCSS: v8.3.6, * Autoprefixer: v10.3.1 * Browsers: last 4 version */ :root { --thickness: 1px; --background: #9fd3a8; --font: "Pirelli"; } html, body { margin: 0; background-color: var(--background); font-size: 24px; font-family: var(--font); height: 100vh; cursor: pointer; -webkit-tap-highlight-color: transparent; } .bold { font-weight: bold; font-style: italic; font-size: 36px; } .info { display: inline-block; padding: 8px; background-color: var(--background); border: var(--thickness) solid currentColor; margin: 0; } #sticker-container { position: fixed; left: 0; top: 0; bottom: 0; right: 0; cursor: pointer; z-index: 100; } .sticker { position: absolute; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; border: var(--thickness) solid currentColor; border-radius: 12px; white-space: nowrap; -webkit-box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2); box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2); } .sticker.info { background-color: white; } .informations-list { display: none; } .sticker.picto { background-color: white; min-width: 64px; min-height: 64px; padding: 2px; } .sticker.deco { background: none; border: none; box-shadow: none; min-width: 128px; min-height: 128px; padding: 0; } .sticker.deco object, .sticker.deco svg { -webkit-filter: drop-shadow(2px 2px 2px 1px rgba(0, 0, 0, 0.2)); filter: drop-shadow(2px 2px 2px 1px rgba(0, 0, 0, 0.2)); } li { list-style: none; } .link { display: inline-block; border-radius: 50%; width: 400px; height: 400px; display: flex; justify-content: center; align-items: center; } .link a { width: 100%; height: 100%; line-height: 400px; text-align: center; } a { color: currentColor; } @media (max-width: 991.98px) { body { font-size: 16px; } .bold { font-size: 21px; } }