/***********************************************************************
* retro-lgp21/webUI LGP21.css
************************************************************************
* Copyright (c) 2026, Paul Kimpel.
* Licensed under the MIT License, see
*       http://www.opensource.org/licenses/mit-license.php
************************************************************************
* General Precision LGP-21 emulator home page style sheet.
************************************************************************
* 2026-03-17  P.Kimpel
*   Original version, from retro-g15/G15.css.
***********************************************************************/

BODY {
    position:           relative;
    height:             100%;
    margin:             0;
    padding:            0}

H1 {
    margin-top:         1em;
    margin-bottom:      0.5em;
    font-size:          14pt;
    font-weight:        bold}

.registerRoundedBorder {
    border-top:         2px solid white;
    border-left:        2px solid white;
    border-right:       2px solid white;
    border-bottom:      none;
    height:             48px;
    border-radius:      24px}

#HomeFrame {
    position:           absolute;
    top:                0;
    height:             calc(100% - 8px);
    width:              calc(100% - 8px);
    padding:            4px}

#VersionDiv {
    position:           absolute;
    top:                4px;
    right:              4px;
    text-align:         right}
#StatusMsg {
    text-align:         center;
    font-size:          85%;
    color:              red}
#InfoTable {
    margin-top:         0;
    width:              100%}
#CenteredBody {
    position:           absolute;
    text-align:         center;
    top:                25%;
    bottom:             25%;
    left:               0;
    right:              0}
#LGP21Image {
    box-shadow:         12px 12px 12px gray;
    max-height:         80%;
    max-width:          80%}
#StartUpBtn,
#ConfigureBtn {
    margin-top:         2em;
    background-color:   #246;
    color:              white;
    font-family:        DejaVuSansWeb, sans-serif;
    font-weight:        normal;
    font-size:          12pt;
    width:              auto;
    height:             auto;
    padding:            0.5em;
    border-radius:      16px;
    border:             2px solid #999}
#StartUpBtn[disabled],
#ConfigureBtn[disabled] {
    background-color:   #468;
    color:              #999;
    border-color:       #666}
#ConfigMsg {
    margin-top:         1ex;
    font-size:          smaller}
#PageFooter {
    margin-top:         2em;
    margin-left:        calc(50% - 20em);
    margin-right:       calc(50% - 20em);
    font-weight:        bold;
    color:              red;
    text-align:         center}

#CreditsDiv {
    position:           absolute;
    bottom:             8px;
    right:              8px;
    font-size:          10px;
    white-space:        nowrap}

/* Control Panel & Flexowriter overlay */

#EmulatorFrame {
    position:           absolute;
    visibility:         hidden;
    top:                0;
    left:               0;
    width:              100%;
    height:             100%;
    display:            block;
    font-size:          11px;
    color:              black;
    background-color:   var(--offWhite);
    user-select:        none;
    cursor:             default}
#ControlPanelFrame {
    position:           absolute;
    top:                0;
    left:               0;
    height:             452px;
    width:              calc(100% - 2px);
    border:             1px solid #666}
#FlexowriterFrame {
    position:           absolute;
    top:                458px;
    left:               50%;
    height:             calc(100% - 460px - 2px);
    /* width:              calc(100% - 2px); */
    max-width:          calc(100% - 6px);
    min-width:          480px;
    transform:          translate(-50%, 0);
    border:             1px solid #666}