html, body { height: 100%; width: 100%; font-family: Open Sans, sans-serif; font-size: 13px; } body { margin: 0; display: flex; justify-content: center; align-items: center; flex-direction: column; position: relative; } h1, h3 { display: block; } img { width: 100vw; height: 100vh; display: block; object-fit: cover; } .cleanPreview { position: absolute; width: 100vw; height: 100vh; display: block; z-index: 2; top: 0; left: 0; pointer-events: none; } .cleanPreview.active { z-index: 3; } a { z-index: 0; display: block; position: relative; } a.disabled { cursor: default; } .viewerVersionNote { opacity: 0; visibility: hidden; position: absolute; top: 20px; left: 0; right: 0; padding: 0 20px; pointer-events: none; transition: all 0.3s ease; z-index: 2; color: #555; text-align: center; } .viewerVersionNote span { margin: auto; display: inline-block; background: rgba(255, 255, 255, 0.9); padding: 10px 15px; border-radius: 3px; } .viewerVersionNote.active { opacity: 1; visibility: visible; } svg.ar { position: fixed; z-index: 10; top: 20px; right: 20px; visibility: hidden; opacity: 0; transition: all 0.3s ease; pointer-events: none; } img.ar { position: fixed; z-index: 10; top: 20px; right: 20px; visibility: hidden; opacity: 0; transition: all 0.3s ease; pointer-events: none; width: 74px; height: 74px; } img.ar.active { opacity: 1; visibility: visible; } img.vectaryLogo { position: fixed; z-index: 9; bottom: 20px; left: 20px; opacity: 0.8; width: 113px; height: auto; }