@font-face {
    font-family: 'Luminari';
    src: url('./Luminari-Regular.ttf');
}


body {
    height: 100%;
    background-color: #000000;
    font-size: 16px;
    font-family: Cambria; /*   Verdana, Helvetica, Sans-Serif; */
    margin: 0;
    padding: 0;
    color: #FF9933;
    margin-left: 10px;
}

i {
    font-family: serif;
}

a {
    
    font-size: 1.0em;
}

h1, h2, h3, h4, h5, h6 {
    font-family: Luminari,fantasy, serif;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
}


a:link
{
    color: aqua;
    text-decoration: underline;
}
a:visited {
    color: aqua;
}
a:hover
{
    color: Aqua;
    text-decoration: none;
}
a:active
{
    color: Aqua;
}


table.nogrid {
    border: 1px solid silver;
}

table.nogrid th {
    font-weight: bold;
    text-align: left;
}



table.nogrid td:nth-child(2), table.nogrid th:nth-child(2) {
    color: white;
}


table.data td {
    color: white;
    text-align:right;
}
table.data td:nth-child(-n+1) {
    color: #ff9933;
    text-align:left;
}



table.grid {
    border-collapse: collapse;
}

table.grid td, table.grid th {
    border: 1px solid grey;
}
table.grid td {
    color:white;
}

table.info {
    border: 1px solid aqua;
    border-spacing: 0px;
    border-collapse: separate;
}

table.info tr {
    vertical-align: top;
}

table.info th {
    background-color:#000000;
    color:#ff9933;
    padding:6px;
    border-bottom: 1px solid silver;
}


table.info td.infoKey {
    padding: 3px;
    padding-right: 8px;
    background-color: #000000;
    color: #ff9933;
}
    table.info td.infoValue {
        padding: 3px;
        padding-right: 8px;
        background-color: #151515;
        color: white;
        font-weight: normal;
        
    }


tr.alternate_rows:nth-child(even) {
    background-color: #222222;
}

tr.alternate_rows:nth-child(odd) {
    background-color: #111111;
}


table.sticky_header {
    position: relative;
    border-collapse: collapse;
    border-color: black;
}

    table.sticky_header th {
        position: sticky;
        top: 0;
        background-color: #222244;
        font-size:16px;
        padding:5px;
    }

table.sticky_header tr:nth-child(even) {
    background: #202000;
}

    table.sticky_header tr:nth-child(odd) {
        background: #131300;
    }

a.editRoom {
    text-decoration: none;
    padding: 0px;
    margin: px;
    cursor: pointer;
}

.action{
    color:white;
    text-align:center;
}
.warning {
    color: yellow;
    text-align: center;
}
.error {
    color: red;
    text-align: center;
}

.rainbow {
    background: pink;
    background: linear-gradient(to right, orange, yellow, green, cyan, blue, violet);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.alternate {
    background: silver;
    background: linear-gradient(to right, currentColor,white,currentColor);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.grid_wrapper {
    display: grid;
    grid-gap: 5px;
    grid-template-columns: [col1-start] 1fr [col2-start] 5fr [col3-start] 350px [col3-end];
    grid-template-rows: [row1-start] 100px [row2-start] 4fr [row3-start]  25px [row4-start] auto [row4-end];
    background-color: #000000;
    height:95%;
    width: 99%;
   
}

.gmenu {
    grid-column: col1-start / col2-start;
    grid-row: row1-start / row4-end;
    resize: horizontal;
    overflow: auto;
    min-width: 320px;
    max-width: 30vw;
}

.gvitals {
    grid-row: row1-start / row2-start;
    grid-column: col2-start / col3-start;
    border: 1px dotted grey;
}

.glinks {
    grid-row: row1-start / row2-start;
    grid-column: col3-start / col3-end;
    border: 1px dotted grey;
}

.gworld {
    grid-column: col2-start / col3-end;
    grid-row: row2-start / row3-start;
    border: 1px dotted grey;
    resize: vertical;
    overflow: auto;

    min-height: 40vh;
    height:60vh;
    max-height: 75vh;

    min-width: 600px;


}

.gchatinput {
    grid-column: col2-start / col3-end;
    grid-row: row3-start / row4-start;
    min-height: 25px;
    max-height: 25px;
}

.gchat {
    grid-column: col2-start / col3-start;
    grid-row: row4-start / row4-end;
    min-height: 10vh;
   
    max-height: 45vh;
}

.gchatoptions {
    grid-column: col3-start / col3-end;
    grid-row: row4-start / row4-end;
    min-height: 150px;
    max-height: 100%;
}

input#Message {
    background: #404040;
    color: cyan;
    width: 70%
}

table.tabMenu {
    background-color:grey;
    width:95%;
    padding:0px;
    border-radius:3px;

}

    table.tabMenu a.tab {
        display: block;
        text-align: center;
        height: 25px;
        background-color: silver;
        color: black;
        border-radius: 10px 10px 0 0;
       
    }

table.tabMenu a.active {
    display: block;
    height: 25px;
    background-color: white;
    color:black;
}