:root{font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--scale: 12vb;--height: 75svh;--width: 45svh}body{margin:0;background-color:#ffefd5}#cardsection{height:100dvh;display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:flex-start;overflow:scroll;margin:auto;scroll-snap-type:x mandatory}.card{scroll-snap-align:center;margin:1em;max-height:var(--height);min-height:var(--height);min-width:var(--width);max-width:var(--width);flex-grow:0;background-color:#fffaf0;overflow-y:scroll;border-radius:1em;z-index:1;box-shadow:0 1px 12px 2px}.card .front{white-space:nowrap;position:relative;padding:1.5em;-webkit-user-select:none;user-select:none;font-size:var(--scale)}.card .back{overflow:clip;display:none;background-color:#6a5acd;width:100%;height:100%}.card .back img{width:100%;height:100%;object-fit:cover}.active{border:5px solid green;box-shadow:0 12px 6px}#navigationsection{bottom:9svh;height:4svh;width:100%;position:absolute;z-index:3}#bringupmenu{display:block;margin:auto}#navpopup{position:absolute;z-index:3;width:100%;bottom:25svh;display:block;justify-content:center}button{display:none;position:relative;width:fit-content;margin:auto;font-size:16px;letter-spacing:.4px;text-transform:lowercase;color:#fff;user-select:none;border-radius:12px 5px;padding:.4em;font-family:Palatino Linotype;box-shadow:#000 0 0 2px 2px;background:#000;border:black;-webkit-user-select:none}#_placed{scroll-snap-align:center;max-height:var(--height);min-height:var(--height);min-width:var(--width);max-width:var(--width);margin:1em;border-radius:1em;border-style:dotted;border-width:.2em;border-color:#f08080;color:#f08080;background-color:none;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:2}#_placed p1{font-size:24px;padding:12px}#info_card{scroll-snap-align:center;margin:1em;max-height:var(--height);min-height:var(--height);min-width:var(--width);max-width:var(--width);flex-grow:0;background-color:#fffaf0;overflow-y:scroll;border-radius:1em;z-index:1;box-shadow:0 1px 12px 2px}#info_card p1{display:block;padding:1.5em}#info_card .buttonDEMO{background:#000;color:#fff;border-radius:12px 5px;padding:.2em;font-size:.8em}#info_button{display:block;position:absolute;bottom:9svh;right:25%;z-index:4}#boxsection{display:none;flex-direction:row;flex-wrap:wrap;margin:auto auto 14px;width:100svw;justify-content:center;align-items:center;padding-top:40px}#threescene{width:526px;border:dotted}#menu{width:45%}#menu p1{font-size:24px;padding-top:100px}
