pkimpel.retro-b5500/webUI/B5500Console.css

/***********************************************************************
* retro-b5500/emulator B5500Console.css
************************************************************************
* Copyright (c) 2012, Nigel Williams and Paul Kimpel.
* Licensed under the MIT License, see http://www.opensource.org/licenses/mit-license.php
************************************************************************
* B5500 emulator Console web interface style sheet.
************************************************************************
* 2012-12-14  P.Kimpel
*   Original version, from B5500DistributionAndDisplay.css.
***********************************************************************/

BODY {
    position:           relative;
    margin:             4px}

DIV#consoleDiv {
    position:           absolute;
    left:               0;
    top:                0;
    width:              1125px;
    height:             140px;
    border-radius:      8px;
    background-color:   #666}

DIV#BurroughsLogo {
    position:           absolute;
    background-color:   black;
    top:                32px;
    right:              32px;
    border-top:         3px solid #EEE;
    border-bottom:      3px solid #EEE}

DIV#B5500Logo {
    background-color:   #EEE;
    font-family:        Arial Narrow, Arial, Helvetica, sans-serif;
    font-size:          24px;
    color:              #333333;
    letter-spacing:     1px;
    padding-left:       4px;
    padding-right:      4px;
    position:           absolute;
    top:                72px;
    right:              32px;
    z-index:            15}

DIV#RetroVersion {
    position:           absolute;
    top:                82px;
    right:              170px;
    color:              white;
    font-family:        Arial Rounded, Arial, Helvetica, sans-serif;
    font-size:          7pt;
    font-weight:        bold}

IMG#BurroughsLogoImage {
    width:              150px;
    text-align:         center;
    vertical-align:     middle;
    padding-top:        3px;
    padding-bottom:     3px;
    padding-left:       8px;
    padding-right:      8px}

BUTTON.whiteButton {
    position:           absolute;
    background-color:   #CCC;
    color:              black;
    font-family:        Arial Rounded, Arial, Helvetica, sans-serif;
    font-size:          8pt;
    font-weight:        bold;
    width:              60px;
    height:             40px;
    border:             1px solid #DDD;
    border-radius:      4px}
    
BUTTON.greenButton {
    position:           absolute;
    background-color:   #060;
    color:              black;
    font-family:        Arial Rounded, Arial, Helvetica, sans-serif;
    font-size:          8pt;
    font-weight:        bold;
    width:              60px;
    height:             40px;
    border:             1px solid #DDD;
    border-radius:      4px}

BUTTON.redButton {
    position:           absolute;
    background-color:   #900;
    color:              white;
    font-family:        Arial Rounded, Arial, Helvetica, sans-serif;
    font-size:          8pt;
    font-weight:        bold;
    width:              60px;
    height:             40px;
    border:             1px solid #DDD;
    border-radius:      4px}

BUTTON.blackButton {
    position:           absolute;
    background-color:   black;
    color:              #999;
    font-family:        Arial Rounded, Arial, Helvetica, sans-serif;
    font-size:          8pt;
    font-weight:        bold;
    width:              60px;
    height:             40px;
    border:             1px solid #DDD;
    border-radius:      4px}

BUTTON.yellowButton {
    position:           absolute;
    background-color:   #990;
    color:              black;
    font-family:        Arial Rounded, Arial, Helvetica, sans-serif;
    font-size:          8pt;
    font-weight:        bold;
    width:              60px;
    height:             40px;
    border:             1px solid #DDD;
    border-radius:      4px}

BUTTON.whiteLit {
    background-color:   #FFF}

BUTTON.blackLit {
    color:              #FFF}

BUTTON.greenLit {
    background-color:   #0F0}

BUTTON.redLit {
    background-color:   #F00}

BUTTON.yellowLit {
    background-color:   #FF0}
BUTTON.yellowLit5 {
    background-color:   #EE0}
BUTTON.yellowLit4 {
    background-color:   #DD0}
BUTTON.yellowLit3 {
    background-color:   #CC0}
BUTTON.yellowLit2 {
    background-color:   #BB0}
BUTTON.yellowLit1 {
    background-color:   #AA0}

BUTTON.blackBorder {
    border:             1px solid black}

BUTTON.yellowBorder {
    border:             2px solid yellow}

BUTTON.silverBorder {
    border:             1px solid #DDD}

BUTTON#HaltBtn {
    top:                31px;
    left:               32px}

BUTTON#NotReadyBtn {
    top:                31px;
    left:               132px}

BUTTON#MemoryCheckBtn {
    top:                31px;
    left:               202px}

BUTTON#LoadBtn {
    top:                31px;
    left:               272px}

BUTTON#LoadSelectBtn {
    line-height:        100%;
    top:                31px;
    left:               372px}

BUTTON#ANormalBtn {
    top:                31px;
    left:               442px}

BUTTON#AControlBtn {
    top:                31px;
    left:               512px}

BUTTON#BNormalBtn {
    top:                31px;
    left:               582px}

BUTTON#BControlBtn {
    top:                31px;
    left:               652px}

BUTTON#PowerOnBtn {
    top:                31px;
    left:               752px}

BUTTON#PowerOffBtn {
    top:                31px;
    left:               822px}

TABLE#CentralControl {
    position:           absolute;
    bottom:             0;
    color:              #666;
    font-family:        Arial Rounded, Arial, Helvetica, sans-serif;
    font-size:          7pt;
    font-weight:        bold}

COL.AnnunciatorCol {
    width:              28px}

TD#procDelay, TD#procSlack {
    color:              white;
    width:              64px;
    text-align:         right}
TD.statLabel {
    color:              white;
    text-align:         left}


.busy {
    color:              white}
.idle {
    color:              #666}

.center {
    text-align:         center}

.data {
    font-family:        Courier New, Courier, monospace;
    text-align:         left}
.number {
    font-family:        Courier New, Courier, monospace;
    text-align:         right}