.caution{
    color:yellow;
    background-color:#333;
}
.caution:before{
    content:'Caution: ';
    /*background-color:#444;*/
}
.caution:hover{
    color:yellow;
    /*background-color:#444;*/
}
.note{
    color:green;
    background-color:#333;
    /*border-color:#AAA;
    border-width:2px;
    border-radius:3px;*/
}
.note:before{
    content:'Note: ';
    /*background-color:#444;*/
}
.note:hover{
    color:green;
    /*background-color:#444;*/
}
.warning{
    color:orange;
    background-color:#333;
}
.warning:before{
    content:'Warning! ';
}
.warning:hover{
    color:orange;
    /*background-color:#444;*/
}
/*
div.container{
    margin:none;
}*/
div#titleBar
{
    width:100%;
    /*background-color:#666;*/
    /*
    height:auto;
    overflow:none;*/
}
/*div#titleBar:after {
    content: "";
    clear: both;
    display: table;
}*/
/*
ul.horizontalMenu{
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
    width:100%;
}

ul.horizontalMenu li {
    float: left;
}

ul.horizontalMenu li a {
    display: block;
    color: #AAA;
    text-align: center;
    padding: 7px 8px;
    text-decoration: none;
}

ul.horizontalMenu li a:hover {
    background-color: #222;
}*/

/*div:disabled{
    opacity:0.5;
    background-color:black;
}*/
div#demoSel{
    overflow-y:scroll;
    overflow-x:none;
    width:auto;
    /*min-height:128px;
    display:block;*/
    margin-left:0px 0px 0px 0px;
    float:left;
}
div#demoSel details{
    float:left;
    /*display:inline-block;*/
    width:98%;
}

tr th {
    text-align: center;
}

caption {
    caption-side:top;
    background-color:#444;
}
form#filters{
    overflow-y:scroll;
    overflow-x:none;
    width:auto;
    /*min-height:128px;
    display:block;*/
    margin-left:0px 0px 0px 0px;
    float:left;
}
form#filters details{
    float:left;
    /*display:inline-block;*/
    width:98%;
}
div#filter-view{
    width:auto;
}
div#stat-view{
    /*overflow-y:scroll;*/
    overflow-y:none;
    overflow-x:none;
    width:auto;
    /*min-height:128px;
    display:block;*/
    /*margin-right:0px 0px 0px 0px;*/
    float:right;
}
table#unit-view{
    width:auto;
}
div#stats{
    width:auto;
}
div pre label{
    width:auto;
    margin-bottom:0px;
}
details#con-view{
    float:right;
    /*position:absolute;
    right:0px;*/
}
/*div#demoSel details:hover{
}*/
div#main{
    /*overflow-y:scroll;
    overflow-x:none;*/
    width-left:192px;
    /*min-height:128px;
    display:block;
    margin-left:194px;*/
    margin:none;
}
ul.verticalMenu{
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
    width:auto;
}

ul.verticalMenu li a {
    display: block;
    /*color: #AAA;*/
    text-align: center;
    padding: 7px 8px;
    text-decoration: none;
}

ul.verticalMenu li a:hover {
    background-color: #222;
}
.expand{
    height: 0px;
    overflow: hidden;
    transition: height 0.5s;
    color: #FFF;
}
input.collapsible[type='checkbox']~label{
  display: inline;
  text-align: center;
  color: #666;
}
input.collapsible[type='checkbox']~label:hover{
  color: #0F0;
}
input.collapsible[type='checkbox']~label:before{
    font-weight: bold;
    font-size: 15px;
    content: "+";
    vertical-align: text-top;
    display: inline-block;
    width: 20px;
    height: 20px;
    /*margin:left:3px;*/
    margin-right: 5px;
    background: radial-gradient(ellipse at center, #AAA 50%, transparent 75%);
}
input.collapsible[type='checkbox']~label:after{
    content: "Show";
}
input.collapsible[type='checkbox']{
  display: none;
  visibility: hidden;
}
input.collapsible[type='checkbox']:checked ~ label:before{
    /*label open*/
    content: "-";
}
input.collapsible[type='checkbox']:checked ~ label:after{
    /*label open*/
    content: "Hide";
}

input.collapsible[type='checkbox']:checked ~ .expand{
    height: auto;
}

section{
    padding: 0 20px;
}
ol{
    -webkit-padding-start:24px;
}
ol#pageNav{
    position:absolute;
    top:10%;
    left:0%;
}
ol#siteNav{
    position:absolute;
    top:10%;
    right:0%;
}
progress
{
    /*display:none;
    appearance:none;*/
    -moz-appearance:none;
    -webkit-appearance:none;
}
progress::-webkit-progress-bar{
    background:grey;
}
progress::-webkit-progress-value{
    background-color:red;
}
progress.high::-webkit-progress-value{
    background-color:green;
}
progress.med::-webkit-progress-value{
    background-color:yellow;
}
progress::-moz-progress-bar{
    background-color:red;
}
progress.high::-moz-progress-bar{
    background-color:green;
}
progress.med::-moz-progress-bar{
    background-color:yellow;
}
details div{
    background-color:#666;
    /*border-color:white;
    border-width:4px;*/
}
details#grid div{
    float:left;
}
details#objCntrls div{
    float:left;
    /*margin: 2px 2px 2px 2px;*/
}
/*
details div pre.vec{
    text-align:left;
}*/
details#camCntrls div{
    float:left;
}
details#vecCntrls div{
    float:left;
}

pre.vec{
    background-color:#333;
    /*font-weight:bold;*/
}
pre.vec label:nth-of-type(1){
    color:red;
}
pre.vec label:nth-of-type(2){
    color:green;
}
pre.vec label:nth-of-type(3){
    color:blue;
}
/*
pre.mat{
    font-weight:bold;
}
pre.mat label:nth-of-type(1n+0){
    color:red;
}
pre.mat label:nth-of-type(2n+0){
    color:green;
}
pre.mat label:nth-of-type(3n+0){
    color:blue;
}*/
/*pre.mat label:nth-of-type(1){
    color:red;
}
pre.mat label:nth-of-type(2){
    color:green;
}
pre.mat label:nth-of-type(3){
    color:blue;
}*/

/*
details div pre
*/
/*
details div pre input[type='number']::before{
    content:':';
    color:black;
}
details div pre input[type='number']::after{
    content:',';
    color:black;
}
details div pre input[type='number']:last-child::after{
    content:'';
}*/

details div pre label::before{
    content:':';
    color:black;
}
details div pre label::after{
    content:',';
    color:black;
}
details div pre label:last-child::after{
    content:'';
}

/*pre.vec label:first-child{
    color:red;
}
pre.vec label:last-child{
    color:blue;
}*/

div#main2D details{
    float:left;
}