select {
    width: 100%;
}
DIV#nav-tools {
    position: absolute;
    display: block;
    background-color: #112;
    border: 2px solid #CCC;
    top: 0px;
    left: 0px;
}
SPAN.udt {
    color: #FFF;
}
SPAN.ssdt {
    color: #FF0;
}
SPAN.sdt {
    color: #0F0;
}
SPAN.pdt {
    color: #88F;
}
SPAN.tdt {
    color: #F8F;
}
SPAN.idt {
    color: #FF4D00;
}
DIV#displaytitle {
    position: absolute;
    display: block;
    text-align: center;
    background-color: #335;
    border: 2px solid #CCC;
    top: 0px;
}
div.basecursor {
    cursor: url('/images/cursors/cursor-base.png'), auto;
}
div.strucursor {
    cursor: url('/images/cursors/cursor-stru.png'), auto;
}
DIV#display {
    position: absolute;
    display: block;
    background-color: #112;
    border: 2px solid #CCC;
    top: 50px;
    overflow: scroll;
}
DIV.createtravellinkform {
    position: absolute;
    background-color: #113;
    border: 2px solid #CCC;
    z-index: 26;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    visibility: hidden;
}
DIV.createinstanceform {
    position: absolute;
    background-color: #131;
    border: 2px solid #CCC;
    z-index: 26;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    visibility: hidden;
}
DIV.editinstanceform {
    position: absolute;
    background-color: #113;
    border: 2px solid #CCC;
    z-index: 26;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    visibility: hidden;
}
DIV.deleteinstanceform {
    position: absolute;
    background-color: #311;
    border: 2px solid #CCC;
    z-index: 26;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    visibility: hidden;
}
DIV.pageblocker {
    position: absolute;
    background-color: #112;
    opacity: 0.5;
    border: 2px solid #CCC;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 25;
    visibility: hidden;
}
DIV.baseinstancelist {
    position: absolute;
    display: block;
    background-color: #112;
    border: 2px solid #CCC;
    top: 200px;
    overflow: scroll;
    visibility: hidden;
}
DIV#tiles-props {
    position: absolute;
    display: block;
    background-color: #112;
    border: 2px solid #CCC;
    top: 0px;
}
td.vmtd {
    cursor: pointer;
}
td.vmtds {
    background-color: #557;
    cursor: default;
}
div.propsdiv {
    display: grid;
    grid-template-rows: min-content min-content min-content auto;
    height: 100%;
}
.areatile {
    position: absolute;
    background-color: #112;
    border: 2px solid #CCC;
    width: 200px;
    height: 100px;
}
.maptile {
    position: absolute;
    background: none;
    /* Remove border when coding and testing is done */
    border: 1px solid #FFF;
    width: 32px;
    height: 32px;
    z-index: 10;
}
.maptilenoborder {
    position: absolute;
    background: none;
    /* Remove border when coding and testing is done */
    border: none;
    width: 32px;
    height: 32px;
    z-index: 10;
}
.mapbg {
    position: absolute;
    background-color: #112;
    /* Remove border when coding and testing is done */
    width: 32px;
    height: 32px;
    z-index: 0;
}
.mapst {
    position: absolute;
    background: none;
    /* Remove border when coding and testing is done */
    width: 32px;
    height: 32px;
    z-index: 1;
}
.maptt {
    position: absolute;
    background: none;
    /* Remove border when coding and testing is done */
    width: 32px;
    height: 32px;
    opacity: 0.5;
    z-index: 2;
}
.mapsid {
    position: absolute;
    background: none;
    /* Remove border when coding and testing is done */
    width: 32px;
    height: 32px;
    opacity: 0.5;
    z-index: 2;
}
.sgnid {
    position: absolute;
    background: none;
    /* Remove border when coding and testing is done */
    width: 32px;
    height: 32px;
    z-index: 3;
}
.ovrnid {
    position: absolute;
    background: none;
    /* Remove border when coding and testing is done */
    width: 32px;
    height: 32px;
    z-index: 4;
}
.coords {
    position: absolute;
    background-color: #112;
    font-size: 12px;
    color: #FFF;
    top: 2px;
    right: 2px;
}
.name {
    position: absolute;
    background-color: #112;
    font-size: 14px;
    font-weight: bold;
    color: #CCF;
    top: 2px;
    left: 2px;
    cursor: pointer;
}
.createnew {
    position: absolute;
    background-color: #112;
    font-size: 14px;
    color: #CFC;
    top: 2px;
    left: 2px;
    cursor: pointer;
}
div.processing {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    padding: 0px;
    margin: 0px;
    text-align: center;
    vertical-align: middle;
    color: #F00;
    background-color: #000;
    border: 2px solid #FFF;
    z-index: 100;
    overflow: hidden;
}
div.loadmessage {
    width: 300px;
    height: 100px;
    top: 50%;
    margin: auto;
    translate: 0%, -50%;
    font-size: xx-large;
    color: #F00;
}
div.tilecontent {
    position: absolute;
    width: 100%;
}
div.tilepicker {
    overflow-y: scroll;
}
div.terraincontent {
    position: absolute;
    width: 100%;
    visibility: hidden;
}
div.sidcontent {
    position: absolute;
    width: 100%;
    visibility: hidden;
}
div#propcontent {
    position: absolute;
    top: 300px;
    width: 100%;
}
div.sidpicker {
    overflow-y: scroll;
}
body {
    overflow: hidden;
}
table.instancelist {
    border: 1px solid #CCC;
    width: 100%;
}
tr.instancehead {
    border: 1px solid #CCC;
    background-color: #557;
    width: 100%;
}
tr.travellinkhead {
    border: 1px solid #CCC;
    background-color: #557;
    width: 100%;
}
tr.instanceitem {
    border: 1px solid #CCC;
    width: 100%;
}
span.deli {
    color: #F88;
    cursor: pointer;
}
span.deli:hover {
    color: #FCC;
    text-decoration: underline;
    cursor: pointer;
}
span.editi {
    color: #88F;
    cursor: pointer;
}
span.editi:hover {
    color: #CCF;
    text-decoration: underline;
    cursor: pointer;
}