﻿/*******************************************************************/
/*verhindert, dass Menü links & body geladen wird bevor icons geladen sind*/
.sideMenu {
    display: none;
}
.fontawesome-i2svg-active .sideMenu {
    display: initial;
}
/*body {
    display: none;
}
.fontawesome-i2svg-active body {
    display: initial;
}*/
/*******************************************************************/

body {
  font-family: "Segoe UI", Verdana, Helvetica, Sans-Serif;    
  font-size: 14px;
  line-height: 1.42857143;
  color: #333333;
  background-color: #fff;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-family: inherit;
  font-weight: 500;
  line-height: 1.1;
  color: inherit;
  padding-bottom: 0;
    margin: 0;
}

h1, 
.h1 {
    font-weight: lighter;
    font-size: 3em;
}

h2,
.h2 
{
    font-weight: normal;
    font-size: 1.5em;
}

h3,
.h3
 {
    font-size: 1.3em;
}

h4,
.h4 {
    font-size: 1.1em;
}


@media (min-width: 768px) {
  .navbar-square {
      -ms-border-radius: 0;
      border-radius: 0;
  }
}



.navbar-inverse-sdc {
    background-color: #505050;
    background-image: none;
    background-image: none;
  
}

.navbar-sdc {
  position: relative;
  min-height: 50px;
  margin-bottom: 20px;
  border: 0px solid transparent;
}


.navbar-inverse-sdc .navbar-nav > .open > a,
.navbar-inverse-sdc .navbar-nav > .open > a:hover,
.navbar-inverse-sdc .navbar-nav > .open > a:focus {
  color: #fff;
  background-color: #23507b;
}


.btn-square {
    /*-ms-border-radius: 0;
    border-radius: 0;*/
}

.btn-sdc {
    color: whitesmoke;
    background-color: #23507b;
    /*border: none;*/
    
    text-transform: uppercase;
    font-size: 0.8em;
    font-weight: bold;
    letter-spacing: 0.5px;
    height: 33px;
}

.btn-sdc:hover,
.btn-sdc:focus,
.btn-sdc.active,
.btn-sdc:active,
.open .dropdown-toggle.btn-sdc {
  color: whitesmoke;
  background-color: #16395b;
}


/*
 * Style tweaks
 * --------------------------------------------------
 */
html,
body {
  overflow-x: hidden; /* Prevent scroll on narrow devices */
}
body {
  padding-top: 0px;
}
footer {
  padding: 30px 0;
}


.btn-sdc {
  /*background-image: -webkit-linear-gradient(top, #428bca 0%, #2d6ca2 100%);
  background-image:         linear-gradient(to bottom, #428bca 0%, #2d6ca2 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff2d6ca2', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  background-repeat: repeat-x;
  border-color: #2b669a;*/

    background-color: #23507b;

}
.btn-sdc:hover,
.btn-sdc:focus {
  background-color: #2d6ca2;
  /*background-position: 0 -15px;*/
}
.btn-sdc:active, 
.btn-sdc.active {
  background-color: #2d6ca2;
  border-color: #2b669a;
}

 
/*a.list-group-item-sdc:hover,
a.list-group-item-sdc:focus {
  text-decoration: none;
  background-color: #23507b;
}
a.list-group-item-sdc.active,
a.list-group-item-sdc.active:hover,
a.list-group-item-sdc.active:focus {
  z-index: 2;
  color: #fff;
  background-color: #23507b;
  border-color: #23507b;
}*/

a.list-group-item.active,
a.list-group-item.active:hover,
a.list-group-item.active:focus {
  z-index: 2;
  color: #fff;
  background-color: #23507b;
  border-color: #23507b;
}

.table > thead > tr > td.warning2,
.table > tbody > tr > td.warning2,
.table > tfoot > tr > td.warning2,
.table > thead > tr > th.warning2,
.table > tbody > tr > th.warning2,
.table > tfoot > tr > th.warning2,
.table > thead > tr.warning2 > td,
.table > tbody > tr.warning2 > td,
.table > tfoot > tr.warning2 > td,
.table > thead > tr.warning2 > th,
.table > tbody > tr.warning2 > th,
.table > tfoot > tr.warning2 > th {
  background-color: #f9e0c9;
}
.table-hover > tbody > tr > td.warning2:hover,
.table-hover > tbody > tr > th.warning2:hover,
.table-hover > tbody > tr.warning2:hover > td,
.table-hover > tbody > tr:hover > .warning2,
.table-hover > tbody > tr.warning2:hover > th {
  background-color: #fcefe3;
}

.list-group-item-warning2 {
  color: #b86a22;
  background-color: #f9e0c9;
}
a.list-group-item-warning2 {
  color: #b86a22;
}
a.list-group-item-warning2 .list-group-item-heading {
  color: inherit;
}
a.list-group-item-warning2:hover,
a.list-group-item-warning2:focus {
  color: #b86a22;
    background-color: #FFE7C2; /*#f9e0c9;*/
}
a.list-group-item-warning2.active,
a.list-group-item-warning2.active:hover,
a.list-group-item-warning2.active:focus {
  color: #fff;
  background-color: #b86a22;
  border-color: #b86a22;
}

.greenValue,
table > thead > tr > td.greenValue,
.table > tbody > tr > td.greenValue,
.table > tfoot > tr > td.greenValue,
.table > thead > tr > th.greenValue,
.table > tbody > tr > th.greenValue,
.table > tfoot > tr > th.greenValue,
.table > thead > tr.greenValue > td,
.table > tbody > tr.greenValue > td,
.table > tfoot > tr.greenValue > td,
.table > thead > tr.greenValue > th,
.table > tbody > tr.greenValue > th,
.table > tfoot > tr.greenValue > th {
  background-color: rgb(197, 224,180);
}
td.greenValue a {
    color: black;
}

.yellowValue,
table > thead > tr > td.yellowValue,
.table > tbody > tr > td.yellowValue,
.table > tfoot > tr > td.yellowValue,
.table > thead > tr > th.yellowValue,
.table > tbody > tr > th.yellowValue,
.table > tfoot > tr > th.yellowValue,
.table > thead > tr.yellowValue > td,
.table > tbody > tr.yellowValue > td,
.table > tfoot > tr.yellowValue > td,
.table > thead > tr.yellowValue > th,
.table > tbody > tr.yellowValue > th,
.table > tfoot > tr.yellowValue > th {
  background-color: rgb(255, 255, 0);
}
td.yellowValue a {
    color: black;
}

.orangeValue,
table > thead > tr > td.orangeValue,
.table > tbody > tr > td.orangeValue,
.table > tfoot > tr > td.orangeValue,
.table > thead > tr > th.orangeValue,
.table > tbody > tr > th.orangeValue,
.table > tfoot > tr > th.orangeValue,
.table > thead > tr.orangeValue > td,
.table > tbody > tr.orangeValue > td,
.table > tfoot > tr.orangeValue > td,
.table > thead > tr.orangeValue > th,
.table > tbody > tr.orangeValue > th,
.table > tfoot > tr.orangeValue > th {
  background-color: rgb(255, 140, 0);
}
td.orangeValue a {
    color: black;
}

.redValue,
table > thead > tr > td.redValue,
.table > tbody > tr > td.redValue,
.table > tfoot > tr > td.redValue,
.table > thead > tr > th.redValue,
.table > tbody > tr > th.redValue,
.table > tfoot > tr > th.redValue,
.table > thead > tr.redValue > td,
.table > tbody > tr.redValue > td,
.table > tfoot > tr.redValue > td,
.table > thead > tr.redValue > th,
.table > tbody > tr.redValue > th,
.table > tfoot > tr.redValue > th {
  background-color: rgb(255, 0, 0);
}








td.redValue a {
    color: black;
}

.bg-warning2 {
  background-color: #FFE7C2 /*#f9e0c9;*/
}
a.bg-warning2:hover {
  background-color: #f7ecb5;
}


.media-object-small {
  display: block;
    width: 40px;
    height: 40px;
}

.panel-group .panel-sdc {

    margin-bottom:50px
}

.panel-sdc {
    -moz-box-shadow: none;
    -webkit-box-shadow: inherit;
    margin-bottom: 50px;
}

.panel-table {
    margin-top: 5px
}

.panel-sdc>.panel-group>.panel-heading {
    border-bottom-color: black;
    border-bottom-width: 2px;
}

.panel-sdc>.panel-heading {
    background-color: white;
    padding-left: 0;
    border-bottom-color: black;
    border-bottom-width: 2px;
    border-bottom-style: solid;
}



.panel-group .panel-dashboard {

    margin-bottom:50px
}

.panel-dashboard{
    -moz-box-shadow: none;
    -webkit-box-shadow: inherit;
    background-color: whitesmoke;
    padding:10px;

    
    
    border-top-width: 3px;
    border-top-style: solid;
    border-top-color: lightgray;
    -ms-border-radius:0;
    border-radius:0;
}

    .panel-dashboard-fixedHeight {
        height:180px;
    }

        .panel-dashboard-fixedHeight2 {
        height:230px;
    }


        .panel-dashboard-ok {
    border-top-left-radius:4px;
    border-top-right-radius:4px;
    border-top-color: green;
    border-top-width: 3px;
}
.panel-dashboard-danger {
    border-top-left-radius:4px;
    border-top-right-radius:4px;
    border-top-color: red;
    border-top-width: 3px;
}

.panel-dashboard-warning {
    border-top-left-radius:4px;
    border-top-right-radius:4px;
    border-top-color: orange;
    border-top-width: 3px;
}

.dashboard-warning {
    color:orange;
}

.dashboard-danger {
    color:red;
}

.dashboard-ok {
    color:green;
}
.panel-dashboard>.panel-group>.panel-heading {
    /*border-bottom-color: black;
    border-bottom-width: 2px;*/
        
}

.panel-dashboard>.panel-heading {
    color: rgb(123, 122, 122);
    font-weight: 600;
    /*background-color: white;*/
    /*padding-left: 0;*/
    /*border-bottom-color: black;
    border-bottom-width: 2px;
    border-bottom-style: solid;*/
}


/*
Full screen Modal 
*/
.fullscreen-modal .modal-dialog {
  margin: 0;
  margin-right: auto;
  margin-left: auto;
  width: 100%;
}
@media (min-width: 768px) {
  .fullscreen-modal .modal-dialog {
    width: 750px;
  }
}
@media (min-width: 992px) {
  .fullscreen-modal .modal-dialog {
    width: 970px;
  }
}
@media (min-width: 1200px) {
  .fullscreen-modal .modal-dialog {
     width: 1170px;
  }
}



.table-bordered>thead>tr>td, .table-bordered>thead>tr>th {
    border-bottom-style: solid !important;
    border-bottom-width: 1px !important;
    border-bottom-color: #333 !important;
}


/*Ging so mit Font Awesome 5 nicht mehr START*/
/*table.dataTable thead .sorting:after {
    opacity: 0.2;
    content: "\f0dc";
}

table.dataTable thead .sorting_asc:after {
    content: "\f0de";
}

table.dataTable thead .sorting_desc:after {
    content: "\f0dd";
}

table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:after {
    position: absolute;
    bottom: 8px;
    right: 8px;
    display: block;
    font-family: Font Awesome;
    opacity: 0.4;
}*/
/*Ging so mit Font Awesome 5 nicht mehr ENDE*/

/*Label innerhalb eines buttons*/
.btn-label { 
    text-transform: uppercase;
    font-size: 0.8em;
    color: #505050;
    font-weight: bold;
    letter-spacing: 0.5px
}

.control-label {
    text-transform: uppercase;
    font-size: 0.8em;
    color: #505050;
    font-weight: bold;
}


.table-label {
    text-transform: uppercase;
    font-size: 0.8em;
    vertical-align: bottom !important;
    color: #505050;
    padding-bottom: 1px;
    font-weight: bold;
}

.table-label.active {
    color: white !important;
}


.table-label-no-uppercase {
    /*text-transform: uppercase;*/
font-size:0.9em;

vertical-align: bottom !important;
color: #505050;
padding-bottom: 1px;
}


tr.selected > .table-content {
    color: #ffffff;
}


.table-content {
    font-size: 0.9em;
    color: #505050;
    padding-bottom: 1px;
}

.table-content-uppercase {
    text-transform: uppercase;
    font-size: 0.8em; /*Schrift bei uppercase etwas kleiner und fett*/
    font-weight: bold;
    color: #505050;
    padding-bottom: 1px;
}

.visualization-panel {
    display: none;
    background-color: whitesmoke;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

    .visualization-panel.alarm-state {
        border-left-style: solid;
        border-left-width: 3px !important;
        border-radius: 5px !important;
    }

        .visualization-panel.alarm-state.no-alarm {
            border-left-color: green;
        }

        .visualization-panel.alarm-state.pre-alarm {
            border-left-color: rgb(255, 200, 0);
        }

        .visualization-panel.alarm-state.alarm {
            border-left-color: rgb(255, 140, 0);
        }

        .visualization-panel.alarm-state.main-alarm {
            border-left-color: rgb(217, 11, 11);
        }

    .visualization-panel.online {
    }

    .visualization-panel.offline {
        color: grey !important;
        border-left-color: grey !important;
    }


table.dataTable td.alarm-state {
    border-left-style: solid;
    border-left-width: 4px !important;
    border-bottom-left-radius: 5px !important;
    border-top-left-radius: 5px !important;
}
table.dataTable td.alarm-state.unkown {
    border-left-color: black;
}
table.dataTable td.alarm-state.no-alarm {
     border-left-color: green;
}
table.dataTable td.alarm-state.pre-alarm {
    border-left-color: rgb(255, 200, 0);
}
table.dataTable td.alarm-state.alarm {
    border-left-color: rgb(255, 140, 0);
}
table.dataTable td.alarm-state.main-alarm {
    border-left-color: rgb(217, 11, 11);
}
table.dataTable td.online {
}

table.dataTable td.offline {
    color: grey !important;
    border-left-color: grey !important;
}




.list-group-item.alarm-state {
    border-left-style: solid;  
    border-left-width: 4px!important; 
    border-radius: 5px!important;
}

.list-group-item.alarm-state.no-alarm { border-left-color: green; }
.list-group-item.alarm-state.pre-alarm { border-left-color: rgb(255, 200, 0); }
.list-group-item.alarm-state.alarm { border-left-color: rgb(255, 140, 0); }
.list-group-item.alarm-state.main-alarm { border-left-color: rgb(217, 11, 11); }

.list-group-item.online {
    
}
.list-group-item.offline {
    color: grey!important;
    border-left-color: grey!important;
}


i.alarm-state.no-alarm {
    color: green;
}

i.alarm-state.pre-alarm {
    color: rgb(255, 200, 0);
}

i.alarm-state.alarm {
    color: rgb(255, 140, 0);
}

i.alarm-state.main-alarm {
    color: rgb(217, 11, 11);
}






/*.fas.alarm-state.no-alarm {
    color: green;
}
.fas.alarm-state.pre-alarm {
    color: rgb(255, 200, 0);
}
.fas.alarm-state.alarm {
    color: rgb(255, 140, 0);
}
.fas.alarm-state.main-alarm {
    color: rgb(217, 11, 11);
}


.fal.alarm-state.no-alarm {
    color: green;
}

.fal.alarm-state.pre-alarm {
    color: rgb(255, 200, 0);
}

.fal.alarm-state.alarm {
    color: rgb(255, 140, 0);
}

.fal.alarm-state.main-alarm {
    color: rgb(217, 11, 11);
}


.far.alarm-state.no-alarm {
    color: green;
}

.far.alarm-state.pre-alarm {
    color: rgb(255, 200, 0);
}

.far.alarm-state.alarm {
    color: rgb(255, 140, 0);
}

.far.alarm-state.main-alarm {
    color: rgb(217, 11, 11);
}*/








