.symonheader {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 34px;
    /*background: linear-gradient(to bottom, #083900, #050505, black);*/
    background: white;
    color: white;
}

.quick {
    position: fixed;
    top: 33px;
    left: 0px;
    right: 0px;
    height: 44px;
    padding: 8px;
    border-bottom: solid black 2px;
    /*background-image: linear-gradient(180deg, rgb(73, 130, 204), rgb(39, 62, 98));*/
    /*color: white;*/
    background: linear-gradient(to bottom, #fff, #ccc);
    color: black;
}

.symonbrand {
    padding-left: 10px;
    padding-right: 10px;
    color: white;
    font-weight: bold;
}

.fa-bars {
    color: black;
    position: absolute;
    top: 8px;
}

.mainLogo {
    /*display: none;*/
    display: inline-block;
    position: fixed;
    top:3px;
    left:25px;
    height: 30px;
    text-align: left;
}

#quickLinks {
    border: solid black 1px;
    background-image: linear-gradient(180deg, rgb(133, 180, 254), rgb(89, 112, 148));
    padding: 8px;
    color: white;
    font-weight: bold;
    display: none;
    margin-left: -2px;
    margin-right: -4px;
    margin-top: 0px;
}

.fixedSideMeu {
    display: none;    
}

.content {
    position: absolute;
    top: 89px;
    bottom: 40px;
    left: 0px;
    right: 0px;
    overflow: auto;
    padding: 0px;
    background: linear-gradient(to bottom right, #fdfdfd, #fafafa);
}


.symonfooter {
    position: fixed;
    bottom: 0px;
    left: 0px;
    right: 0px;
    background: linear-gradient(to bottom, #083900, #222, black, black, #111);
    color: #ccc;
    text-align: center;
    height: 40px;
    border-top: 2px solid #cacaca;
    font-size: 16px;
}

.symonsearchbox {
    width: 150px;
    height: 30px;
    margin-top: 8px;
    margin-right: 10px;
}

.shown {
    display: inline;
}



#txtAssignTo {
    display: inline;
    box-shadow: inset 1px 1px 0 rgba(0, 0, 0, 0.377);
    border-radius: 6px 6px 6px 6px;
    color: #083900;
    font-weight: normal;
    padding-left: 4px;
    padding-right: 4px;
    background: #ddd;
}

.ui-autocomplete {
    z-index: 2000; /* on top of modals */
    background: #666;
    color: white;
    border: 1px solid black;
    padding: 0px;
    cursor: pointer;
}

.ui-menu-item {
    padding: 8px;
    background: linear-gradient(to bottom, #555, #333);
}

    .ui-menu-item:hover {
        background: linear-gradient(to bottom, #777, #555);
        color: white;
    }

    .ui-menu-item:active {
        color: red;
    }

.table-striped > tbody > tr:nth-child(2n+1) > td,
.table-striped > tbody > tr:nth-child(2n+1) > th {
    background-color: #aaa;
}

.changeBuildingBox {
    text-align: center;
}

.changeBuildingButton {
    width: 150px;
    height: 40px;
    padding: 10px;
    background: #083900;
    color: white;
    border-top: 1px solid silver;
    border-left: 1px solid silver;
    border-bottom: 1px solid #333;
    border-right: 1px solid #333;
    border-radius: 6px;
    display: block;
}

.dropdown {
    margin-left: 4px;
    margin-right: 4px;
}

.itemLogo {
    font-size: 80px;
    padding: 0px;
    margin: 0px;
    top: 10px;
    padding-left: 10px;
    padding-right: 10px;
    display: inline;
    color: #083900;
    vertical-align: top;
}

.buildingName {
    font-size: x-large;
    font-weight: bold;
    display: inline-block;
    padding-top: 10px;
}

.year {
    display: block;
    transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    /*For IE support*/
}

.tasksHeader {
    color: #083900;
    padding-top: 20px;
    font-size: large;
    font-weight: bold;
    padding-right: 8px;
}

    .tasksHeader > span {
        font-size: 0.9em;
        color: #083900ef;
        padding-left: 10px;
    }

    .tasksHeader > small {
        font-size: 0.65em;
        color: #08390099;
    }

.appHeader {
    color: #888;
    font-size: medium;
    font-weight: bold;
    padding-right: 8px;
}

.profilepic {
    padding: 8px;
    height: 150px;
}

button,
.ui-btn {
    background: #083900;
    color: white;
    border-top: 1px solid silver;
    border-left: 1px solid silver;
    border-bottom: 1px solid #333;
    border-right: 1px solid #333;
    border-radius: 6px;
    padding: 4px 8px 4px 8px;
    font-size: small;
    display: inline-block;
}

    button:active,
    .ui-btn:active {
        color: white;
    }

    button:visited,
    .ui-btn:visited {
        color: white;
    }

    .ui-btn.ui-btn-large {
        font-size: large;
    }

    button:hover,
    .ui-btn:hover {
        border-top: 1px solid lightyellow;
        border-left: 1px solid lightyellow;
        border-bottom: 1px solid yellow;
        border-right: 1px solid yellow;
        text-decoration: none;
        text-shadow: 0.5px 0px 0px #fff, -0.5px 0px 0px #fff;
        color: white;
    }

.formbody {
    background: #08390050;
    color: white;
    border: 1px solid #777;
    border-radius: 5px;
    padding: 7px;
    margin: 3px;
}

.fieldtitle {
    padding-top: 10px;
    font-size: medium;
    font-weight: bold;
    padding-right: 4px;
}

.fieldBox {
    background: #08390050;
    border: 1px solid #ccc;
    border-radius: 5px;
    padding: 7px;
    margin: 3px;
}

select {
    background: #777;
    color: white;
    padding: 0px;
    margin: 0px;
    border-radius: 124px;
    font-size: small;
}

    select:focus {
        /*background: blue;*/
        border: 2px orange solid;
    }

textarea {
    min-height: 200px;
    min-width: 100%;
    color: black;
    background: white;
}

input {
    color: black;
    background: white;
}

.formIndented {
    width: 100%;
    display: inline-block;
    border-radius: 4px;
    border: 1px solid #083900;
    background: #08390030;
    box-shadow: inset 1px 1px 0 rgba(0, 0, 0, 0.377);
    padding: 4px;
    margin: 2px;
    margin-top: 8px;
}

.shorttext {
    float: right;
    width: 100px;
    border: 0px;
    margin: 0px;
    border-bottom: 1px #008833 solid;
    padding-left: 10px;
    padding-right: 10px;
}

    .shorttext:focus {
        border-bottom: 2px orange solid;
    }

.loginbutton {
    width: 100%;
    margin-top: 30px;
}

.darklabel {
    display: inline-block;
    color: #083900;
    width: 80px;
}

.tag {
    padding: 4px 12px 3px 12px;
    margin-right: 3px;
    text-indent: 0;
    border: 1px solid #333;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    border-radius: 7px;
    font-size: x-small;
    background: #fff;
    color: black;
    font-weight: normal;
}

.notesubject {
    color: #333;
    font-size: small;
    font-weight: bold;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    border-radius: 7px;
}

.noteheader {
    font-size: xx-small;
    color: gray;
    text-align: left;
}

.notebody {
    font-size: smaller;
}

.tagsheader {
    font-size: xx-small;
    color: #444;
    margin-bottom: 4px;
    display: none;
}

.tagbox {
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    border-radius: 7px;
    margin: 8px;
}

.addnewbutton {
    color: white;
    position: fixed;
    float: none;
    top: 16px;
    right: 4px;
}

.notebox {
    margin: 8px;
    padding: 8px;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    border-radius: 7px;
    background: rgb(230, 230, 230);
    border: 1px solid #ddd;
}

.deleterowauto:hover {
    color: yellow;
}

.alert {
    padding: 5px;
    margin-bottom: 2px;
}



.timesel {
    position: relative;
    display: block;
    padding: 0;
    margin: 0;
    margin: 10px;
    margin-top: 30px;
    -webkit-touch-callout: none;
    /* iOS Safari */
    -webkit-user-select: none;
    /* Safari */
    -khtml-user-select: none;
    /* Konqueror HTML */
    -moz-user-select: none;
    /* Firefox */
    -ms-user-select: none;
    /* Internet Explorer/Edge */
    user-select: none;
    /* Non-prefixed version, currently
                                supported by Chrome and Opera */
}

.timeblock {
    display: inline-block;
    width: 15px;
    height: 15px;
    background: #08390090;
    border-top: 1px solid black;
    border-left: 1px solid black;
    border-bottom: 1px solid black;
    margin: 0px;
    margin-left: -5px;
    padding: 0px;
}

.seltime {
    background: #083900;
}

.timeblock > span {
    top: -20px;
    font-size: 11px;
    position: absolute;
    transform: rotate(-45deg);
}

/* The switch - the box around the slider */
.switch {
    position: relative;
    display: inline-block;
    width: 30px;
    height: 17px;
}

    /* Hide default HTML checkbox */
    .switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

/* The slider */
.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

    .slider:before {
        position: absolute;
        content: "";
        height: 13px;
        width: 13px;
        left: 3px;
        bottom: 2px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }

input:checked + .slider {
    background-color: #2196F3;
}

input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
}

input:check
ed + .slider:before {
    -webkit-transform: translateX(13px);
    -ms-transform: translateX(13px);
    transform: translateX(13px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 17px;
}

    .slider.round:before {
        border-radius: 50%;
    }




.dataEntry {
    border: 0px solid black;
    padding: 8px;
    margin: 2px;
    margin-left: 20px;
}

    .dataEntry .title {
        font-weight: bold;
        width: 160px;
        display: inline-block;
    }

    .dataEntry .datatext {
        background: white;
        border: 0px;
        border-bottom: 1px solid #aaa;
    }

        .dataEntry .datatext:hover {
            background: #ddd;
            border-bottom: 1px solid #444;
        }

        .dataEntry .datatext:focus {
            background: linear-gradient(#eee, #ddd);
            border: 1px solid #aaa;
        }

    .dataEntry .datadrop {
        background: linear-gradient(#eee, #ddd);
        color: black;
    }

.validationerror {
    border: 1px solid #aaa;
    background: #ddd;
    color: red;
    border-radius: 4px;
}



#catBox, #respBox, #priBox, #approversBox, #functionalTypeBox, #functionalTypeContactBox {
    border: 1px solid #333;
    background: #eee;
    height: 130px;
    overflow: auto;
    margin-bottom: 8px;
}

.ctrlbox {
    display: inline;
    float: right;
}

.deleteArea {
    color: red;
    float: right;
}

.catBoxItem {
    background: white;
    color: black;
    font-size: medium;
    padding: 8px;
}

    .catBoxItem:hover {
        background: lightblue;
    }

    .catBoxItem > .deleteCat {
        color: red;
        float: right;
    }


    .functionalTypeBoxItem {
        background: white;
        color: black;
        font-size: medium;
        padding: 8px;
    }
    
        .functionalTypeBoxItem:hover {
            background: lightblue;
        }
    
        .functionalTypeBoxItem > .deleteCat {
            color: red;
            float: right;
        }
    
    


.respBoxItem {
    background: white;
    color: black;
    font-size: medium;
    padding: 8px;
}

    .respBoxItem:hover {
        background: lightblue;
    }

    .respBoxItem .deletefunctionalCategoryContactID {
        color: red;
        float: right;
    }


.priBoxItem {
    background: white;
    color: black;
    font-size: medium;
    padding: 8px;
}

    .priBoxItem:hover {
        background: lightblue;
    }

    .priBoxItem > .deleteBoxItem {
        color: red;
        float: right;
    }

.approverBoxItem {
    background: white;
    color: black;
    font-size: medium;
    padding: 8px;
}

    .approverBoxItem:hover {
        background: lightblue;
    }

    .approverBoxItem > .deleteApproverBoxItem {
        color: red;
        float: right;
    }


.selected {
    background: blue;
    color: white;
}

    .selected:hover {
        background: blue;
        color: yellow;
        border: 1px solid yellow;
        font-weight: bold;
    }


/*
    Handles the tab pages on the building page
*/
.nav-tabs > li > a {
    border: medium none;
    color: black;
}

    .nav-tabs > li > a:hover {
        background-color: #888 !important;
        border: medium none;
        border-radius: 0;
        color: #fff;
    }

    .nav-tabs > li > a:visited {
        background-color: #888 !important;
        border: medium none;
        border-radius: 0;
        color: #fff;
    }

.nav-tabs > li.active > a {
    background: linear-gradient(#333, #444) !important;
    border: medium none;
    border-radius: 0;
    color: #fff;
}

    .nav-tabs > li.active > a:visited {
        background: linear-gradient(#333, #444) !important;
        border: medium none;
        border-radius: 0;
        color: #fff;
    }


.tab-content {
    border: 0px solid black;
    padding: 8px;
}

.itemselected {
    background: linear-gradient(orange, black);
    border: 1px solid black;
    padding: 2px 1px;
}

.loading {
    min-height: 100px;
    vertical-align: middle;
    text-align: center;
    border: 1px solid gray;
    background: linear-gradient(to bottom right, #ccc, #aaa);
    padding-top: 30px;
}


.notepart {
    margin-top: 20px;
    padding: 4px;
}

.noteitem {
    position: relative;
    border: 1px solid #333;
    background: linear-gradient(to bottom right, azure, lightblue);
    box-shadow: 2px 3px #777;
    border-radius: 4px 16px 0px 0px;
    margin: 4px;
}

    .noteitem > .fa-times {
        color: #be0000;
        text-shadow: 1px 2px black;
        position: absolute;
        right: 12px;
        top: 8px;
    }

        .noteitem > .fa-times:hover {
            color: #ee0000;
        }

.noteDate {
    position: absolute;
    top: 2px;
    left: 4px;
    font-size: smaller;
    color: #555;
}

.noteUser {
    position: absolute;
    top: 2px;
    right: 4px;
    font-size: small;
    color: #555;
}

.addnotebutton {
    position: absolute;
    right: 4px;
    bottom: 4px;
}

.notask {
    background: #ffaaa6;
    color: #852420;
    font-weight: bold;
    border: 3px solid #852420;
    padding: 30px;
    text-align: center;
    vertical-align: middle;
    border-radius: 4px;
}

.recursText {
    padding: 8px;
}

#btnDelete,
#btnDeleteAll,
#btnComplete,
#btnInComplete {
    margin-bottom: 8px;
    width: 160px;
}



.functionalType {
    font-size: small;
    color: #555;
    padding: 0px;
    margin: 0px;
    text-align: center;
    letter-spacing: 3px;
    margin-top: -10px;
    margin-left: -10px;
}

.createdTag {
    text-align: right;
    font-size: small;
    font-weight: bold;
    border: 1px solid #777;
    background: linear-gradient(#ddd, #bbb);
    margin-top: 8px;
    padding: 4px;
}

.subjectline {
    font-weight: bold;
    border-bottom: 1px solid #333;
    margin-bottom: 4px;
}

.taskbody {
    margin-left: 4px;
    min-height: 400px;
    max-height: 400px;
    padding: 8px;
}
.pill {
    position: relative;
    display: inline-block;
    min-width: 150px;
    /*max-width: 150px;*/
    font-size: small;
    margin: 2px;
}

.pill > .fa-times {
    color: #be0000;
    text-shadow: 1px 2px black;
    position: absolute;
    right: 12px;
}

    .pill > .fa-times:hover {
        color: #ee0000;
    }

.appliesList {
    border: 1px solid black;
    min-height: 150px;
    max-height: 150px;
    background: linear-gradient(to bottom, #bbb, #999);
    font-weight: bold;
    position: relative;
    margin-top: 4px;
}

    .appliesList > h4 {
        font-size: smaller;
        position: absolute;
        top: 0px;
        left: 4px;
    }

.appliesbox {
    overflow-y: auto;
    position: absolute;
    top: 26px;
    right: 8px;
    left: 8px;
    bottom: 40px;
    padding: 2px;
}

div.x,
div.e,
div.c,
div.b {
    border-radius: 4px 8px 0px 0px;
    border: 1px solid #333;
    margin: 2px;
    padding: 2px;
}

div.x {
    border-radius: 14px;
    padding-left: 8px;
    padding-right: 8px;
    min-width: unset;
}

.additionalApplies {
    background: linear-gradient(to bottom right, #999, #888);
    border-top: 1px solid white;
    position: absolute;
    bottom: 0px;
    width: 100%;
    left: 0px;
    padding: 4px;
    height: 38px;
}

.inputspan {
    position: absolute;
    bottom: 4px;
    right: 8px;
    left: 50px;
    display: block;
    overflow: hidden;
}

.inputspannote {
    position: absolute;
    bottom: 4px;
    right: 48px;
    left: 50px;
    display: block;
    overflow: hidden;
}

.textspan {
    position: absolute;
    bottom: 4px;
    left: 8px;
    display: block;
    overflow: hidden;
    color: white;
}

.additionalApplies > input {
    width: 100%;
    background: white;
}

.taskName {
    font-size: medium;
}

.dueDate {
    font-size: small;
}

.symonPageHeader {
    border: 4px solid #999;
    margin-bottom: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
    background: linear-gradient(to bottom right, #ddd, #ccc);
    margin-top: 8px;
}

.subTitle {
    font-size: x-small;
}

pre {
    border: 1px solid #333;
    max-height: 340px;
}


/* Sets teh colors for the symon tag backgrounds and foregrounds.*/
.x {
    background: linear-gradient(to bottom, #777, #666);
    color: white;
}
.e {
    background: linear-gradient(to bottom, #fccd7c, #ffac1c);
    color: black;
    padding: 4px;
}

.b {
    background: linear-gradient(to bottom, #00cc18, #018f12);
    padding: 4px;
}

.c {
    background: linear-gradient(to bottom, #469dfa, #007afc);
    padding: 4px;
}

.e, .b, .c {
    color: black;
}

.bugsubmit {
    position: fixed;
    bottom: 4px;
    right: 4px;
    border: none;
    padding: 8px;
    height: 32px;
    width: 32px;
    border-radius: 15px;
    display: inline-block;
    background-image: linear-gradient(180deg, #0a4d00, #083900);
}

    .bugsubmit > div {
        position: absolute;
        top: 1px;
        left: 1px;
        background: radial-gradient( white, #083900);
        height: 30px;
        width: 30px;
        border-radius: 15px;
    }

        .bugsubmit > div > i {
            position: absolute;
            left: 8px;
            top: 8px;
            color: #083900;
            text-shadow: 0px 0px 2px white;
        }

            .bugsubmit > div > i:hover {
                position: absolute;
                left: 8px;
                top: 8px;
                color: #08390099;
                text-shadow: 0px 0px 5px white;
            }

.mustbeloggedin {
    display: none;
}

.formReport {
    padding: 30px
}

.datePicker {
    width: 105px
}

.symonalert {
    position: fixed;
    display: none;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 50;
    bottom: 0;
    background-color: #08390085;
    z-index: 99999;
}

#symonAlertBody {
    height: 170px;
    border: #ccc solid 1px;
    padding: 8px;
    overflow: auto;
}

#symonAlertFooter {
    height: 40px;
    background: #fff;
    width: 300px;    
    overflow: hidden;
    justify-content: center;
    position: relative;
    align-content: center;
}

#symonAlertButton {
    
    float: right;
    margin-top: 3px;
    margin-right: 8px;
}

.is-dragover {
    border-radius: 5px;
    border-width: 8px;
    border-style: dashed;
    border-color: darkslategray;
    background-color: lightblue;
}

.changelog {
    border: 1px solid #777;
    background: #ddd;
    color: black;
    padding: 4px;
}
.changelog>h1 {
    font-size: medium;
    font-weight: bold;
    border-bottom: 1px solid #aaa;    
}
.changelog>p {
    font-size: small;
    font-weight: normal;
    
}

.list-group-item {
    padding: 0px 25px;
}

.rightButtons {
    position: absolute;
    right: 2px;
    top: 0px;    
    
}


.buildingExplorerList {
    width: inherit;
    margin-bottom: 0px;
}

.x1as {
    list-style-type: none;
    width: 300px;
}

.subSector {
    /*padding-left: 28px;*/
    cursor: pointer;
    user-select: none;
    /*transform: rotate(-90deg);*/
    margin-right: 16px;

}

.sectorName {
    position: relative;
    color: #444;
    font-weight: bold;
    cursor: pointer;
    width: 100%;
    user-select: none;
}

.sectorSelected {
    color: green;
    font-weight: bold;
    margin-left: 16px;
    margin-right: 4px;
}

.sectorHover {
    background: coral;
    font-weight: bold;
}

.superSector {
    cursor: pointer;
    user-select: none;
    /*transform: rotate(-90deg);*/
    margin-right: 16px;
}

.superSector:hover {
    background: orange;
    border: 1px solid black;
}

.superSector::before {
    color: black;
    display: inline-block;
}
  
/*.superSector-down::before {
    transform: rotate(90deg);  
}*/

.nested {
    display: none;
    margin: 8px;
    margin-left: 32px;
    padding-inline-start: 1px; /*This is how nested loops are padded*/
    /*border: 1px solid black;*/
}
 
.active {
    display: block;
}

#nameplate {
    position: fixed;
    right: 8px;
    top: 0px;
    font-size: 26px;
    color: white;
}


.progressBarInt {
    left: auto;
    position: inherit;
    border-style: inherit;
    background-color: lightgreen;
    border-radius: 20px;
    text-align: center;
    height:25px;
}

.progressBarExt {
    width: 100%;
    height: 25px;
    position: inherit;
    border-radius: 20px 20px;
}

.progressBarLabel {
    position: relative;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
}

.progressBarGif {
    height: 50px;
    position: relative;
    margin-top: 3%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}


.redTicket {
    color: white;
    background: red;
}
.redLogo {
    color: white;
    background: red;
}

.orangeTicket {
    color: white;
    background: orange;
}
.orangeLogo {
    color: white;
    background: orange;
}

.greenTicket {
    color: white;
    background: green;
}
.greenLogo {
    color: white;
    background: green;
}

.direlement {
    font-weight: bold;
}

.allowableBuildingRow:nth-child(even) {background: #CCC}
.allowableBuildingRow:nth-child(odd) {background: #FFF}

.allowableBuildingRow:hover td{
    background: #aaa;
}

.list-gi-selected {
    background-color: antiquewhite;
}

.symonButton {
    display: inline-block;
    height: 15px; 
    padding-left: 4px;
    padding-top: 1px;
    padding-right: 4px;
    padding-bottom: 6px;
    box-sizing: 1px 1px black;
    border: white 1px solid;
    font-size: xx-small; 
    background: rgb(45, 72, 221);
    color: white;
    cursor: pointer;
    margin-top: 4px;
    margin-bottom: 2px;
}
.symonButton:hover {
    background: rgb(58, 84, 231);
    color: #ddd;
}

.woot {
    font-size: small;
    font-weight: bold;
    margin-left: 20px;
    padding-top: 0px;
}

.headerElement {
    padding: 4px;
}

.headerElementTitle {
    font-size: small;
    font-weight: bold;
    color: #444;
    width: 100px;
    display: inline-block;
    padding-left: 8px;
    padding-right: 8px;
}

.headerElementText {
    font-size: small;
    display: inline-block;
    padding-left: 8px;
    padding-right: 8px;
}

.versionbox {
    display: inline-block;
    position: absolute;
    height: 60px;
    bottom: 40px;
    left: 0px;
    right: 178px;
    overflow: hidden;
    padding: 0px;
    width: 178px;
    background: linear-gradient(to right, #fff, #fff, #eee);
    border-right: 2px solid #777;
}

.versionHeader {
    font-size: xx-small;
    font-weight: bold;
    color: #444;
    display: inline-block;
    padding-left: 8px;
    padding-right: 2px;
}

.versionTitle {
    font-size: xx-small;
    font-weight: bold;
    color: #444;
    display: inline-block;
    padding-left: 8px;
    padding-right: 2px;
}

.versionText {
    font-size: x-small;
    display: inline-block;
    font-weight: bold;
    color: black;
    padding-left: 8px;
    padding-right: 2px;
}

.headerpic {
    position: absolute;
    right: 2px;
    top: 2px;
    width: 26px;
    height: 26px;
    object-fit: contain;
}

#nameplatename {
    display: none;
}

.symonmenu{
    color: black;
    position: fixed;
    top: 4px;
    right: 40px;    
}

.listSearch {    
    border: 1px solid black;
    padding-right: 20px;
    padding-left: 7px;
    outline: none;
    font-size: 14px;
}

.listsearch:focus {
    outline: none;
}

.searchBox {
    display: inline;    
}

.searchBox>i {
    position: absolute;
    color: #aaa;
    font-size: 14px;
    top: 6px;
    right: 8px;
    height: 20px;
}

#companytag {
    position: absolute;
    bottom: 8px;
    left: 0px;
    right: 0px;
}

/* 
Credit to https://gist.github.com/dylancwood/7368914 for the initial design

RenateUSB cleanup implemented
*/ 

p.tree,
ul.tree,
ul.tree ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

ul.tree ul {
  margin-left: 1.0em;
}

ul.tree li {
  margin-left: 0.35em;
  border-left: thin solid #000;
}

ul.tree li:last-child {
  border-left: none;
}

ul.tree li:before {
  width: 0.9em;
  height: 0.6em;
  margin-right: 0.1em;
  vertical-align: top;
  border-bottom: thin solid #000;
  content: "";
  display: inline-block;
}

ul.tree li:last-child:before {
  border-left: thin solid #000;
}

/* 
Finished Tree.
*/

.helpText {
    font-size: x-small;
    color: #444;
    border-radius: 8px;
    background: lightblue;
    padding: 4px;
    text-align: center;

}