#optionsContainer { display: inline; position: absolute; top: 0%; left: round(50%, var(--pxDensityPx)); transform: translate(-50%); width: max-content; padding: calc(2px * var(--pxDensity)); } #licenseContainer { width: 600px; height: 400px; padding: 40px; padding-top: 80px; position: absolute; left: 50%; bottom: 0%; transform: translate(-50%, calc(-22px * var(--pxDensity))); font-size: 0.75rem; box-sizing: border-box; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; } .blackBorderRect { background-color: #FFFFFF; border: 10px #000000 solid; border-radius: 32px; color: #000000; } #picContainer { width: 150px; height: 150px; } #credits { position: absolute; bottom: 0%; left: 0%; margin: 0% 0% 0% 20px; color: var(--navBarBtn_Inner); font-size: 0.6rem; } #signatureContainer { display: inline-flex; flex-direction: column; margin: 5% 0% 0% 0%; } #signature { margin: 0% 0% 0.2rem 0%; text-align: center; font-size: 1rem; } #signHere { border-top: #000000 solid 6px; margin: 0%; padding: 0% 25px; } #detailsContainer { display: grid; grid-template-columns: repeat(2, 1fr); } h2 { margin: 5px; } a { cursor: pointer; color: #1010da; text-decoration: underline; } a:visited { color: #551A8B; } #optionsCredits { margin: 0%; } label { background-color: var(--navBarBtn_Inner); box-shadow: calc(1px * var(--pxDensity)) 0px var(--navBarBtn_Border), calc(-1px * var(--pxDensity)) 0px var(--navBarBtn_Border), 0px calc(1px * var(--pxDensity)) var(--navBarBtn_Border), 0px calc(-1px * var(--pxDensity)) var(--navBarBtn_Border); padding: calc(1px * var(--pxDensity)); margin: calc(3px * var(--pxDensity)) calc(2px * var(--pxDensity)) 0% 0%; box-sizing: border-box; width: round(auto, var(--pxDensity)); height: round(auto, var(--pxDensity)); } input { background-color: var(--navBarBtn_Inner); box-shadow: calc(1px * var(--pxDensity)) 0px var(--navBarBtn_Border), calc(-1px * var(--pxDensity)) 0px var(--navBarBtn_Border), 0px calc(1px * var(--pxDensity)) var(--navBarBtn_Border), 0px calc(-1px * var(--pxDensity)) var(--navBarBtn_Border); padding: calc(1px * var(--pxDensity)); border: none; font-size: inherit; margin: calc(3px * var(--pxDensity)) calc(2px * var(--pxDensity)) 0% 0%; box-sizing: border-box; width: round(auto, var(--pxDensity)); height: round(auto, var(--pxDensity)); color: inherit; } .slider { -webkit-appearance: none; appearance: none; background-color: var(--navBarBtn_Border); box-shadow: none; filter: none; border: none; font-size: inherit; box-sizing: border-box; width: round(auto, var(--pxDensity)); height: calc(1px * var(--pxDensity)); margin: 0%; outline: none; padding: 0%; } .slider::-webkit-slider-thumb, .slider::-moz-range-thumb { -webkit-appearance: none; appearance: none; background-color: var(--navBar_Border); border: none; cursor: pointer; border-radius: 0%; width: calc(3px * var(--pxDensity)); height: calc(3px * var(--pxDensity)); } .sliderDiv { display: inline-block; background-color: var(--navBarBtn_Inner); box-shadow: calc(1px * var(--pxDensity)) 0px var(--navBarBtn_Border), calc(-1px * var(--pxDensity)) 0px var(--navBarBtn_Border), 0px calc(1px * var(--pxDensity)) var(--navBarBtn_Border), 0px calc(-1px * var(--pxDensity)) var(--navBarBtn_Border); padding: calc(1px * var(--pxDensity)); border: none; font-size: inherit; margin: calc(3px * var(--pxDensity)) calc(2px * var(--pxDensity)) 0% 0%; box-sizing: border-box; width: round(auto, var(--pxDensity)); height: round(auto, var(--pxDensity)); color: inherit; } #sillyNumberValue { display: inline; background-color: var(--navBarBtn_Inner); box-shadow: calc(1px * var(--pxDensity)) 0px var(--navBarBtn_Border), calc(-1px * var(--pxDensity)) 0px var(--navBarBtn_Border), 0px calc(1px * var(--pxDensity)) var(--navBarBtn_Border), 0px calc(-1px * var(--pxDensity)) var(--navBarBtn_Border); padding: calc(1px * var(--pxDensity)); border: none; font-size: inherit; margin: calc(3px * var(--pxDensity)) calc(2px * var(--pxDensity)) 0% 0%; box-sizing: border-box; width: round(auto, var(--pxDensity)); height: auto; aspect-ratio: 1 / 1; }