body                                    { margin: 0px; font-size: 10pt; font-family: "Trebuchet MS", Arial, sans-serif; text-align: center; background-color: #ffffff; overflow-y: scroll;line-height: 13pt; }
input                                    { font-family: "Trebuchet MS", Arial, sans-serif; }

p                                       { text-align: justify; }
img                                     { border: 0px; vertical-align: top; }
a                                       { color: #486675; }
a:visited                               { color: #486675; }
a:focus                                 { outline: none; }
a:active                                { outline: none; }
h1,h2,h3,h4,h5                          { margin-top: 0px; }

.link                                   { color: #486675; text-decoration: underline; cursor: pointer; }
.clearboth                              { clear: both; }
.dialog                                 { font-size: 10pt; }
.unselectable                           { -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; user-select: none; }
.maintenance                            { font-size: 18px; color: red; border: 2px dotted red; text-align: center; margin: 5px 0px 10px 0px; padding: 10px; }

#container                              { margin: 0px; margin-left: auto; margin-right: auto; width: 95%; text-align: left; padding: 5px; background-color: #ffffff;  }
#leftcolumn                             { float: left; width: 160px; margin: 0px; padding-top: 10px; padding-bottom: 25px; transition: 0.5s; z-index: 1;}
#rightcolumn                            { margin-left: 160px; padding: 10px 10px; margin-right: 0px; }

.headercolor                            { background-color: #9bbfd1; color: #000000; }
#header                                 { position: relative; background-color: #82aec4; height: 70px; background-image: url("munisense-v2-header_background_image.png"); background-repeat: repeat-x; background-position: bottom; padding: 0;
 }
#header .headerbutton                   { font-size: 10px; color: black; float: right; text-align: left; border: 1px solid black; padding: 5px; background-color: #f0f0f0; height: 16px; width: 72px; line-height: 16px; cursor: pointer; margin-left: 5px; position: relative; }
#header .headerbutton img               { position: absolute; right: 5px; }
#header #headertext                     { position: absolute; bottom: 10px; left: 10px; color: #ffffff; font-size: 11px; bottom: 5px; }
#header #headerlogo                     { position: absolute; top: 17px; left: 10px;  }
#header #headerbuttons                  { position: absolute; top: 10px; right: 10px;  }
#header #languagebox                    { border: 1px solid black;  background-color: #f0f0f0; width: 72px; padding: 5px; position: absolute; left: -1px; top: 26px; }
#header #timezonebox                    { border: 1px solid black;  background-color: #f0f0f0; width: 144px; padding: 5px; position: absolute; left: -1px; top: 26px; height: 300px; overflow: auto; }
.side-menu-link                         { background: center center no-repeat rgba(48, 48, 48, 0.7); background-image: url('/images/menu-hamburger.png'); display: none; width: 40px; height: 40px; position: relative; top: 10px; left: 10px; border-radius: 2px; z-index: 1; }

.menu-depth-1                           { padding-left: 40px !important; }
.menu-depth-2                           { padding-left: 60px !important; }

@media (max-width: 991px) {
.side-menu-link                       { display: block; }
#container                            { width: auto; }
#rightcolumn                          { margin-left: 0px; }
#header #headerlogo                   { max-width: 100%; margin-left: 60px; }
#leftcolumn                           { box-shadow: 2px 0px 2px rgba(0, 0, 0, 0.15); }
#leftcolumn.hidden-on-mobile          { left: -200px; box-shadow: none; }

#side-menu .active-nav-item           { color: white; }
}

#header .header-buttons                 { position: absolute; top: 10px; right: 10px; z-index: 1; display: block; }
#header .header-buttons a               { position: relative; float: right; margin-left: 10px; background: #ccc; border-radius: 2px; background: center center no-repeat rgba(48, 48, 48, 0.7); }
#header #helpbutton div                 { padding: 7px; }
#header #helpbutton div:last-child      { background: center center no-repeat rgba(32, 32, 32, 1); border-radius: 2px; }


#navig                                  { font-size: 10pt; }
#navig ul                               { list-style-type: none; margin: 0px; padding-left: 0px; }
#navig ul li                            { clear: both; }
#navig ul li div                        { width: 18px; height: 18px; float: left; margin-bottom: 2px; }
#navig .divdepth0                       { display: inline; margin-left: 0px; }
#navig .divdepth1                       { display: inline; margin-left: 20px; }
#navig .divdepth2                       { display: inline; margin-left: 40px; }
#navig ul li span                       { width: 135px; height: 18px; float: left; margin-bottom: 2px; padding-left: 5px; }
#navig .spandepth0                      { width: 134px; }
#navig .spandepth1                      { width: 114px; }
#navig .spandepth2                      { width: 94px; }
#navig ul li a                          { text-decoration: none; cursor: pointer; }
#navig ul li span                       { overflow: hidden; white-space: nowrap; }
#navig ul li a:link                     { color: #486675; }
#navig ul li a:active                   { color: #486675; }
#navig ul li a:visited                  { color: #486675; }
#navig ul li a:hover                    { color: #486675; }
#navig .navig a:hover div                 { background-color: #82aec4; }
#navig .navig div                       { background-color: #82aec4; }
#navig .navig a:hover span                { background-color: #82aec4; }
#navig .navig span                      { background-color: #f4f4f4; }

#navig .nodegroup_select option         { width: 139px; }

#content                                { float: left; width: 100%; _width: 99%; font-size: 10pt; }
#content_minimal                        { width: 100%; font-size: 10pt; text-align: left; background-color: #ffffff; }

.helpbox                                { border: 1px solid gray; width: auto; padding: 5px; text-align: justify; margin-top: 10px; margin-right: 10px; margin-bottom: 10px; margin-left: 0px; background-color: white; background-image: url('https://shared.munisense.net/images/icons/information.png'); background-position: 10px 6px; background-repeat: no-repeat; }
.helpbox div                            { margin: 0px 32px; }

.datatable                              { margin: 0px; border-collapse: collapse; border: 0px; font-size: 1em; width: 100%;  }
.datatable tr th                        { text-align: left; font-weight: normal; background-color: #82aec4; color: #ffffff; white-space: nowrap; }
.datatable tr th a                      { color: #ffffff; text-decoration: none; }
.datatable tr td a                      { color: #486675; }
.datatable tr td a:link                 { color: #486675; }
.datatable tr td a:active               { color: #486675; }
.datatable tr td a:visited              { color: #486675; }
.datatable tr td a:hover                { color: #486675; }
.datatable .rowlo                       { background-color: #dedede; }
.datatable tr:nth-child(odd)            { background-color: #dedede; }
.datatable .rowhi                       { background-color: #f0f0f0; }
.datatable tr:nth-child(even)           { background-color: #f0f0f0; }
.datatable tr:hover:not(.disable-hover-effect) { background-color: #c4c4c4; }
.datatable .centerrow                   { text-align: center; }
.datatable .pageritem                   { padding-left: 10px; padding-right: 10px; }
.datatable .pageritemcur                { padding-left: 10px; padding-right: 10px; }
.datatable .pagercell                   { text-align: center; }

.datatable .searchrow td                { margin: 1px; padding: 0px; }
.datatable .searchrow .border           { padding: 3px; }
.datatable .searchrow .fill             { background-color: #ffffff; }
.datatable .searchrow input             { width: 95%; border: 0px; margin: 1px; padding: 1px; background-color: #ffffff; }
.datatable .searchrow .actioncolumn     { padding: 0px 5px; vertical-align: middle; }
.datatable .searchrow .actioncolumn .invisible_submit { width:0px; height: 0px; border: none; padding: 0px; font-size: 0px; }

.datatablefix {width: 50%;}

.dataform                               { margin: 0px; padding: 0px; margin-bottom: 1em; border: 1px solid gray; background-color: #f0f0f0; background-image: url('munisense-v2-dataform_background.png'); background-position: 0px 0px; background-repeat: repeat-x;  }
.dataform legend                        { margin-left: 0.75em; padding: 0em 0.25em; font-weight: bold; color: black; }
.dataform dl                            { list-style: none; margin-top: 0.5em; width: 100%; }
.dataform dt                            { padding-left: 1em; padding-bottom: 0.5em; float: left; clear: left; width: 97%; }
.dataform dt.note                       { font-size: 0.8em; padding-bottom: 0em; margin-left: 0.25em; }
.dataform label                         { float: left; width: 10em; margin-right: 1em; }
.dataform label.errorlabel              { color: red; }
.dataform .advanced                     { display: none; }

.dataform .block                        { float: none; margin-left: 11em; }
.dataform .block label                  { float: none; width: auto; margin: auto; }

.dataform .checkgroup                   { float: left; }
.dataform .checkgroup dl                { list-style: none; margin: 0px; }
.dataform .checkgroup dt                { padding: 0px; float: left; clear: left; }
.dataform .checkgroup input             { float: left; }
.dataform .checkgroup label             { float: left; width: auto; }

.ui-datepicker                          { text-align: left; }

.dataform .form_error_message           { color: red; font-size: 0.8em; }
.dataform textarea                      { width: 32em; height: 7em; padding-left: 2px; }
.dataform .query                        { margin-left: 1em; }
.dataform .graph                        { margin: 1em; }
.dataform input                         { padding-left: 2px; }
.dataform .smallnote                    { font-size: 0.8em; }

.textunderinput                         { clear: both; float: left; margin-left: 11em; }
.textfield8                             { width: 4em; }
.textfield16                            { width: 10em; }
.textfield128                           { width: 20em; }
.textfield255                           { width: 32em; }
.selectfield                            { width: 32em; }
.selectfield8                           { width: 4em; }
.selectfield16                          { width: 10em; }
.selectfield32                          { width: 16em; }
.selectfield128                         { width: 24em; }
.selectfield255                         { width: 32em; }
.smalltextarea                          { width: 32em; height: 7em; padding-left: 2px; }

.infotabletitle                         { margin: 0px; margin-top: 0.5em; }
.infotable                              { margin: 0px; border-collapse: collapse; border: 0px; font-size: 1em; width: 100%; }
.infotable tr th                        { text-align: left; font-weight: normal; background-color: #9bbfd1; padding: 0px 5px; border-collapse: collapse; border: 1px solid white; color: #ffffcc; }
.infotable tr td                        { padding: 0px 5px; border-collapse: collapse; border: 1px solid white; }
.infotable .rowlo                       { background-color: #e0ddc5; }
.infotable .rowhi                       { background-color: #f0f0dc; }
.infotable .raw                         { width: 25%; }
.infotable .display                     { width: 25%; }

.button                                 { float: left; min-width: 130px; border: 1px solid gray; padding-left: 4px; padding-right: 4px; padding-top: 2px; margin-right: 4px; background-color: #f2efeb; color: #486675; text-decoration: none; cursor: pointer; }
.buttons                                { padding: 5px 0px; margin: 0px; min-height: 20px; }
.buttons a                              { float: left; min-width: 130px; border: 1px solid gray; padding-left: 4px; padding-right: 4px; padding-top: 2px; margin-right: 4px; background-color: #f2efeb; color: #486675; text-decoration: none; }

.actions                                { padding: 0px; margin: 0px; min-height: 50px; margin-top: 5px; }
.actions p                              { margin: 0px; padding: 0px; }
.actions a, .actions button             { float: left; min-width: 130px; border: 1px solid gray; padding-left: 4px; padding-right: 4px; padding-top: 2px; padding-bottom: 2px; margin-right: 4px; margin-bottom: 4px; background-color: #f2efeb; color: #486675; text-decoration: none; white-space: nowrap; cursor: pointer; text-align: left; }
.actions .linktext                      { text-decoration: none; padding-left: 4px; }

#footer                                 { font-size: 8pt; margin-left: 5px; margin-top: 20px; clear: both; }
.footer_box                             { position: fixed; left: 4em; top: 4em; bottom: 4em; right: 4em; background-color: black; color: white; border: 1px solid silver; text-align: left; padding: 1em; overflow: scroll; filter:alpha(opacity=80); opacity:0.8; }
.footer_close                           { position: fixed; top: 5em; right: 6em; border: 1px solid black; background-color: gray; color: white; padding: 0.5em 1em; cursor: pointer; }

a.tooltip span                          { display: none; padding: 2px 3px; margin-left: -184px; margin-top: 12px; width: 180px; }
a.tooltip:hover span                    { display: inline; position: absolute; background: #ffffff; border: 1px solid #cccccc; color: #6c6c6c; }

.graph                                  { position: relative; width: 720px; height: 320px; }
.graph .graphimage                      { position: absolute; }
.graph .graphframe                      { position: absolute; top: 50px; left: 50px; width: 660px; height: 180px; background-image: url('https://shared.munisense.net/images/munisense/1x1t.gif'); }
.graph .imageframe                      { position: absolute; width: 100%; height: 100%; }

.graph .graphselect                     { position: absolute; height: 180px; width: 0px; display: none; border-left: 1px solid black; border-right: 1px solid black; font-size: 0; }
.graph .graphselectin                   { position: relative; height: 180px; width: 100%; background-color: gray; filter: alpha(opacity=20); -moz-opacity: .20; opacity: 0.20; }

.graph .sndhairline                     { position: absolute; width: 1px; height: 180px; background-color: red; display: none; }
.graph .sndloadbg                       { position: absolute; height: 2px; bottom: -4px; background-color: silver; width: 0px; z-index: 0; font-size: 0; }
.graph .sndloadbar                      { position: absolute; height: 2px; bottom: -4px; background-color: gray; width: 0px; z-index: 1; font-size: 0; }

.media_actions                          { padding: 0px; margin-top: 10px; }
.media_actions div                      { float: left; width: 120px; border: 1px solid gray; padding-left: 4px; padding-right: 4px; padding-top: 2px; margin-right: 4px; background-color: #f2efeb; color: #486675; text-decoration: none; cursor: pointer; }
.media_actions div span                 { text-decoration: none; padding-left: 4px; }

.hline                                  { height: 1px; width: 100%; background-color: black; margin: 0px; padding: 0px; font-size: 0; line-height: 0; }

.ssts                                   { border: 1px solid #999999; padding: 5px; width: 280px; }
.ssts label                             { width: 80px !important; float: left; }
.ssts_timefield                         { width: 60px; }
.ssts_datefield                         { width: 75px; }
.ssts_preset_select                     { width: 163px; }
.ssts_jump_select                       { width: 140px; }

.colorblock                             { float: left; font-size: 0.8em; vertical-align: middle; text-align: center; cursor: pointer; display: block; width: 20px; height: 20px; margin: 1px; }
#colorblock_container                   { display: inline-block; vertical-align: bottom; background-color: #CCCCCC; width: 177px; height: 177px; }

.colorblock_1                           { background-color: #00ff00; }
.colorblock_2                           { background-color: #33ff00; }
.colorblock_3                           { background-color: #66ff00; }
.colorblock_4                           { background-color: #aaff00; }
.colorblock_5                           { background-color: #ddff00; }
.colorblock_6                           { background-color: #ffee00; }
.colorblock_7                           { background-color: #ffbb00; }
.colorblock_8                           { background-color: #ff8800; }
.colorblock_9                           { background-color: #0000ff; }
.colorblock_10                          { background-color: #00aaff; }
.colorblock_11                          { background-color: #00ffff; }
.colorblock_12                          { background-color: #00ff55; }
.colorblock_13                          { background-color: #ddff00; }
.colorblock_14                          { background-color: #ffbb00; }
.colorblock_15                          { background-color: #ff6600; }
.colorblock_16                          { background-color: #ff0000; }
.colorblock_17                          { background-color: #dddddd; }
.colorblock_18                          { background-color: #bbbbcc; }
.colorblock_19                          { background-color: #9999bb; }
.colorblock_20                          { background-color: #7777aa; }
.colorblock_21                          { background-color: #665599; }
.colorblock_22                          { background-color: #444488; }
.colorblock_23                          { background-color: #222277; }
.colorblock_24                          { background-color: #110055; }
.colorblock_25                          { background-color: #dddddd; }
.colorblock_26                          { background-color: #bbddbb; }
.colorblock_27                          { background-color: #99dd99; }
.colorblock_28                          { background-color: #77cc77; }
.colorblock_29                          { background-color: #55cc55; }
.colorblock_30                          { background-color: #44cc44; }
.colorblock_31                          { background-color: #22bb22; }
.colorblock_32                          { background-color: #00bb00; }
.colorblock_33                          { background-color: #dddddd; }
.colorblock_34                          { background-color: #ddbbbb; }
.colorblock_35                          { background-color: #dd9999; }
.colorblock_36                          { background-color: #cc7777; }
.colorblock_37                          { background-color: #cc5555; }
.colorblock_38                          { background-color: #cc4444; }
.colorblock_39                          { background-color: #bb2222; }
.colorblock_40                          { background-color: #bb0000; }
.colorblock_41                          { background-color: #ff0000; }
.colorblock_42                          { background-color: #ff3300; }
.colorblock_43                          { background-color: #ff5500; }
.colorblock_44                          { background-color: #ff9900; }
.colorblock_45                          { background-color: #ffee00; }
.colorblock_46                          { background-color: #bbff00; }
.colorblock_47                          { background-color: #55ff00; }
.colorblock_48                          { background-color: #00ff00; }
.colorblock_49                          { background-color: #ff0000; }
.colorblock_50                          { background-color: #dd2200; }
.colorblock_51                          { background-color: #bb4400; }
.colorblock_52                          { background-color: #996600; }
.colorblock_53                          { background-color: #669900; }
.colorblock_54                          { background-color: #44bb00; }
.colorblock_55                          { background-color: #22dd00; }
.colorblock_56                          { background-color: #00ff00; }
.colorblock_57                          { background-color: #ff0000; }
.colorblock_58                          { background-color: #ff2200; }
.colorblock_59                          { background-color: #ff4400; }
.colorblock_60                          { background-color: #ff6600; }
.colorblock_61                          { background-color: #ff9900; }
.colorblock_62                          { background-color: #ffbb00; }
.colorblock_63                          { background-color: #ffdd00; }
.colorblock_64                          { background-color: #ffff00; }

#ui-datepicker-div                      { font-size: 11px; }

.source_select_widget                   { width: 100%; }

#single_group_select                    { display: none; }
#password_dialog                        { font-size: 2em; display: none; }
.validateTips                           { font-size: 1em; }
#password_dialog_submit                 { position:absolute; top:-1000px; display: none; }

.property_value_status_indication       { width: 12px; height: 12px; border: 1px solid black; background: lightgrey; display: inline-block; margin-right: 5px; }
.link-text                              { text-decoration: underline; }
.no-underscore                          { text-decoration: none; }

#header *, #header {
box-sizing: border-box;
}


#container {
padding: 0;
margin: 0;
width: 100%;
position: relative;
}

#footer {
margin-left: 215px;
text-align: center;
}

#header {
position: fixed;
z-index: 2;
width: 100%;
}

#rightcolumn {
padding-left: 15px;
padding-right: 15px;
}
#content, #leftcolumn {
margin-top: 70px;
}

.footer_box {
top: 70px;
}

#leftcolumn {
width: 200px;
padding-bottom: 10px;
background: #eee;
border-right: 1px solid #ddd;
position: absolute;
top: 0;
bottom: 0;
left: 0;
overflow-y: auto;
z-index: 1;

transition: 0.5s;
}

#navig ul {
z-index: 1;
}

#navig ul li span {
width: 100%;
text-overflow: ellipsis;
}

#navig .divdepth0, #navig .divdepth1 {
display: none;
}

#navig .spandepth0, #navig .spandepth1 {
width: 100%;
}

#navig .spandepth1 {
padding-left: 30px;
}

#navig ul li span {
height: 26px;
padding-top: 5px;
padding-right: 10px;
padding-left: 10px;
margin-bottom: 0px;
border-left: 4px solid transparent;
}

#navig .navig > a > span {
background-color: transparent;
}

#navig .navig > a.active-nav-item > span {
border-left: 4px solid #82aec4;
background: #ccc;
}

#navig .navig > a:hover > span {
background-color: #82aec4;
color: white;
}

#navig *{
box-sizing: border-box;
}

#rightcolumn {
margin-left: 200px;
}
.side-menu-link {
top: 15px;
}

#header {
border-bottom: 1px solid rgb(179, 179, 179);
box-shadow: 0 1px 0px rgba(0, 0, 0, 0.15);
}

#headertext {
background: rgba(0, 0, 0, 0.35);
padding-left: 3px;
padding-right: 3px;
}

#content { min-height: calc(100vh - 25px - 70px - 10px);
}

@media (max-width: 991px) {
#rightcolumn {
margin-left: 0px;
}
#footer {
margin-left: 15px;
}
}


/*  */