input { margin: 0.2em; }

/*
 * http://stackoverflow.com/questions/526035/html-css-positioning-float-bottom
 * (May fail when the prompt is more than one line?)
 *
 * Can I install a better font than Courier? Pref Terminus ...  But any
 * programmer monospace with a bit more weight ...
 *
 */

#disp {
    background-color: #000;
    color: white;
    border: 1px solid #ccc;
    width: 60em;
    margin: 3px;
    position: relative;
    font-family: courier;
}

#blinkingCursor { /* trying to provide a very narrow cursor */
    font-family: "Helvetica Narrow","Arial Narrow",Tahoma,Arial,Helvetica,sans-serif;
}

#codeview {
    border: 1px solid #ccc;
    width: 60em;
    margin: 3px;
    clear: both;
}

#textview {
    border: 2px solid gray;
    width: 60em;
    margin: 3px;
    clear: both;
}

#prompt {
    position: absolute;
    bottom: 0.2em;
    left: 0.2em;
}

#notification {
    position: absolute;
    top: 0.2em;
    left: 0.2em;
}

#overlay {
    visibility: hidden;
    /*position: absolute;*/
    position: fixed;
    left: 0px;
    top: 0px;
    width:100%;
    height:100%;
    text-align:center;
    z-index: 1000;
}

#overlay_bg {
    visibility: hidden;
    /*position: absolute;*/
    position: fixed;
    left: 0px;
    top: 0px;
    width:100%;
    height:100%;
    z-index: 999;
    background-color: black;
    -moz-opacity: 0.7;
    opacity: .70;
    filter: alpha(opacity=70);
}

#overlay #overlay_inner {
     /* width: 300px; */
     width: 80%;
     margin: 100px auto;
     background-color: #fff;
     border: 1px solid #000;
     padding: 15px;
     text-align: center;
}

#snippetMenu {
    border: 1px solid #111;
    position: fixed;
    left: 50px;
    top: 50px;
    background-color: white;
    z-index: 1000;
}

#snippetMenu thead {
    background-color: orange;
    font-weight: bold;
}

#snippetMenuDelete:hover {
    background-color: orange;
}

#snippetMenuHelp:hover {
    background-color: orange;
}

#views {
    float: left;
    width: 61em; /* 1em larger than the contained views */
}

#controlButtons {
    margin: 3px;
}

.secondaryTitle {
    /* applies to span title of secondary button boxes */
    font-weight: bold;
}

.hoveredPart {
    /* Highlighting of a part of the prompt when it's hovered over */
    background-color: orange;
}

.selectedTab {
    /* same as tab on hover colour */
    background: #fff;
    /* border: 1px 1px 0 1px solid #ccc; */
    /* above doesn't work, this does: */
    border-style: solid;
    border-color: #ccc;
    border-width: 1px 1px 0 1px;
}

.unselectedTab {
    /* same as tab on hover colour */
    background: #ddd;
    border: 1px solid #ccc;
}

#miscTab, #timeTab, #userTab, #dirTab, #charTab {
    float: left;
    padding: 5px 10px 5px 10px;
    color: #000;
    /* margin: 0px 5px 0px 5px; */
    margin: 0;
}

#miscTab:hover, #timeTab:hover, #userTab:hover, #dirTab:hover, #charTab:hover {
    background: #aaa;
    cursor: pointer;
}

#miscTabContent, #timeTabContent, #userTabContent, #dirTabContent, #charTabContent {
    width: 50em;
    padding: 1em;
    border: 1px solid #ccc;
}

#miscTabContent {
    display: block;
}

#timeTabContent, #userTabContent, #dirTabContent, #charTabContent {
    display: none;
}

/*
 * Borrowed from the ancient version, colours were well researched.  Even
 * if they end up as CSS, this way I have the exact colours.
 */

span.white      {color:#ffffff; font-weight: bold; }
span.lightGray  {color:#e5e5e5}
span.gray       {color:#4d4d4d; font-weight: bold; }
span.black      {color:#000000}
span.lightRed   {color:#ff0000; font-weight: bold; }
span.red        {color:#cd0000}
span.lightGreen {color:#00ff00; font-weight: bold; }
span.green      {color:#00cd00}
span.brown      {color:#cdcd00}
span.yellow     {color:#ffff33; font-weight: bold; }
span.lightBlue  {color:#3333ff; font-weight: bold; }
span.blue       {color:#0000cd}
span.pink       {color:#ff00ff; font-weight: bold; }
span.purple     {color:#cd00cd}
span.lightCyan  {color:#00ffff; font-weight: bold; }
span.cyan       {color:#00cdcd}

span.BGlightGray  {background-color:#e5e5e5}
span.BGblack      {background-color:#000000}
span.BGred        {background-color:#cd0000}
span.BGgreen      {background-color:#00cd00}
span.BGbrown      {background-color:#cdcd00}
span.BGblue       {background-color:#0000cd}
span.BGpurple     {background-color:#cd00cd}
span.BGcyan       {background-color:#00cdcd}