/**************************************************************************/
/* Style of NavigationBar */
/**************************************************************************/

/* Diese Werte müssen zwingen als RGB oder RGBA Wert angegeben werden */
p .chart_strokecolor     {  color: rgba(64,178,83,1.0);}
p .chart_fillcolor         {  color: rgba(64,178,83,.5);}
p .chart_linecolor         {  color: rgba(170,170,170,1.0);}
p .chart_fontcolor         {  color: rgba(170,170,170,1.0);}
p .chart_gridlinecolor {  color: rgba(68,68,68,1.0);}

/* Chart Yield Day Colors */
p .chart_produced           {  color:  rgb(0,100,100); }
p .chart_consumed           {  color:  rgb(180,30,30); }
p .chart_injected           {  color:  rgb(30,180,30); }
p .chart_ownConsumed     {  color:  rgb(252,244,99); }
p .chart_totalConsumed {  color:  rgb(179,73,245); }

/* Modulescan Colors */
p .chart_PV1                     {  color:  rgb(180, 30, 30); }
p .chart_PV2                     {  color:  rgb(30, 180, 30); }
p .chart_PV3                     {  color:  rgb(30, 30, 180); }

p .chart_opacity             {  opacity: 0.3;             }

td.eventlogTypeError
{
  color: rgba(219,0,49,1.0);
  font-weight: bold; 
}

canvas {
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}

td.parValueNotDefault
{
  color: rgba(0,156,216,1.0);
  font-weight: bold; 
}



/* Checkbox Bereich in der Überschrift */
body > div > h1 > label 
{
  float:     right; 
  font-size: 15px;
  padding:   7px 12px 0px 3px; 
}


@media print
{
 nav 
  {
   display: none;
 }    
}

nav .active {
    color: #b0ca33;
    background-color: #ededed;
}

nav .last {
    float: right;
}

nav ul {
    padding: 0;
    margin: 0;
    list-style: none;
    font-weight: 700;
    overflow: hidden;
}

    nav ul li {
        float: left;
        display: list-item;
        list-style: none;
        line-height: 20px;
        padding-right: 5px;
    }

        nav ul li a {
            display: block;
            padding: 10px 12px;
            color: #1e467d;
            font-size: 20px;
            text-decoration: none;
        }

            nav ul li a:hover {
                color: #b0ca33;
                background-color: #ededed;
            }

nav img.logo {
    display: none;
}

nav > a {
    background-image: url('data:image/png;base64,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');
    background-repeat: no-repeat;
    float: right;
    width: 145px;
    height: 30px;
}

/* The Dropdown Styles */
/* =================== */

/* Hide Dropdowns by Default */
nav li a:hover ul {
    display: block;
}

nav li a:hover {
    display: block;
}

nav ul ul {
    display: none;
    position: absolute;
    top: 56px;
}

/* Display Dropdowns on Hover */
nav ul li:hover > ul {
    display: list-item;
}

/* First Tier Dropdown */
nav ul ul li {
    float: none;
    position: relative;
    border-bottom: none;
    background-color: #ededed;
    background-image: none;
    border-top: 1px solid #828787;
}

/* Second, Third and more Tiers */
nav ul ul ul li {
    position: absolute;
}

/**************************************************************************/
/* Style of Chart Area */
/**************************************************************************/
div.chartContainer 
{
  display: -webkit-flex;             /* Safari */
  -webkit-justify-content: flex-end; /* Safari 6.1+ */
  
  display: flex; 
  justify-content: flex-end;
}

div.chartArea
{
  height: 20vh; 
  width: 100%; 
}

div.chartTable
{
  margin-left: 20px;
}


/**************************************************************************/
/* Style of Header */
/**************************************************************************/
header {
    padding: 0;
    color: #1e467d;
    margin: 16px 8px 8px 8px;
}

/**************************************************************************/
/* Style of Footer */
/**************************************************************************/
footer {
    position: fixed;
    background-color: #404040;
    right: 0;
    bottom: 0;
    height: 49px;
    width: 100%;
}

/**************************************************************************/
/* Style of Body */
/**************************************************************************/
body {
    margin-left: 20px;
    margin-right: 20px;
    font-family: Arial,Helvetica,sans-serif;
    color: #333;
    background-color: #eef2f5;
    background-image: -webkit-linear-gradient(top,#becdd9 0,#eef2f5 85px);
    background-image: -o-linear-gradient(top,#becdd9 0,#eef2f5 85px);
    background-image: linear-gradient(to bottom,#becdd9 0,#eef2f5 85px);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffbecdd9', endColorstr='#ffeef2f5', GradientType=0);
    font-size: 12px;
}

div.body {
    width: 90%; 
    text-align: center; 
    margin: 0 auto; 
    min-height: 85vh; 
}​

/**************************************************************************/
/* Style of Headers */
/**************************************************************************/
h1 {
    font-size: 24px;
}

h2 {
    font-size: 20px;
}

h3 {
    font-size: 16px;
}

body > div {
  border-left: 1px solid #d9d9d9;
  border-right: 3px solid #d9d9d9;
  border-top: 5px solid #1e467d;
  border-bottom: 3px solid #d9d9d9;
  background-color: #fff;
  padding: 0 20px 20px;
}

body > div h1 {
  background-color: #ededed;
  text-align: left;
  margin-left: 0;
  margin-right: 0;
  color: #1e467d;
  margin-bottom: 25px;
}

body > div h1:before {
  content: "-";
  display: block;
  float: left;
  width: 10px;
  height: 100%;
  color: #b0ca33;
  background-color: #b0ca33;
  margin-right: 15px;
}

canvas {
    margin-top: 5px;
    padding: 0;
    background-color: #666;
}

/**************************************************************************/
/* Style of Tables */
/**************************************************************************/

/* Sorgt für zentrierte Ausgabe von Tabellen im div.body */ 
div.body table 
{
    margin: 0 auto;  
    text-align: left;
}


table {
    border-collapse: collapse;
}

th,
td {
    border: solid 2px #909090;
    font-size: 12px;
    padding: 2px 5px;
    text-align: left;
}

th {
    text-align: center;
    padding: 2px 10px;
}

    /**************************************************************************/
    /* Style of Tables, invisible for Layouts */
    /**************************************************************************/
    table.invisible,
    tr.invisible,
    td.invisible,
    th.invisible {
        text-align: left;
        border-style: hidden;
    }
    
    td.invisible_narrow {
    padding: 0px 2px;
    border-style: hidden;
    background: rgba(0, 0, 0, 0.0);
}

/**************************************************************************/
/* Style of Buttons */
/**************************************************************************/
button, input, optgroup, select, textarea {
    color: inherit;
    font: inherit;
    margin: 0;
    outline: 0;
}

button, select {
    text-transform: none;
}

button, html input[type=button], input[type=button], input[type=reset], input[type=submit] {
    -webkit-appearance: button;
    cursor: pointer;
}

    button[disabled], html input[disabled] {
        cursor: default;
    }

    button::-moz-focus-inner, input::-moz-focus-inner {
        border: 0;
        padding: 0;
    }

button {
    overflow: visible;
    border: 1px solid #a6a6a6;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    -moz-background-clip: padding-box;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    font-size: 1em;
    font-weight: 400;
    line-height: 1em;
    padding: 3px 8px;
    color: #666;
    background: #ededed;
}

    button:hover:not([disabled]) {
        background: #e6e6e6;
        color: #666;
        border-color: #a6a6a6;
    }

    button:active:not([disabled]) {
        background: #e6e6e6;
        color: #666;
        border-color: #b0ca33;
        -webkit-box-shadow: inset 1px 1px 2px #c7c7c7;
        -moz-box-shadow: inset 1px 1px 2px #c7c7c7;
        box-shadow: inset 1px 1px 2px #c7c7c7;
    }

    button:disabled {
        color: #b3b3b3;
        border-color: #d9d9d9;
        background: #ededed;
    }

/**************************************************************************/
/* Style of Progress Bar */
/**************************************************************************/
progress {
    width: 100%;
    height: 12px;
    margin: 1px auto;
    display: block;
    /* Important Thing */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    /* For IE10 */
    color: #b0ca33;
}

    progress::-webkit-progress-bar {
        background: #b3b3b3;
        border-radius: 5px;
        padding: 1px;
        box-shadow: 0 1px 0 0 #ffffff;
        box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.2);
    }

progress::-moz-progress-bar {
        border-radius: 5px;
        background-image: -moz-linear-gradient(45deg, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%), -moz-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)), -moz-linear-gradient(left, #b0ca33, #b0ca33);
        background-size: 25px 14px, 100% 100%, 100% 100%;
    }

    progress::-webkit-progress-value {
        border-radius: 5px;
        box-shadow: inset 0 1px 1px 0 #ffffff;
        box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4);
        background: -webkit-linear-gradient(45deg, transparent, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%), -webkit-linear-gradient(top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.2)), -webkit-linear-gradient(left, #b0ca33, #b0ca33);
        background-size: 25px 14px, 100% 100%, 100% 100%;
        -webkit-animation: move 5s linear 0 infinite;
    }

@-webkit-keyframes move {
    0% {
        background-position: 0 0, 0 0, 0 0;
    }

    100% {
        background-position: -100px 0, 0 0, 0 0;
    }
}