Wetterstation/mysql_php/wetter.css

body { font: 12px Arial;}

path {
    stroke: steelblue;
    stroke-width: 2;
    fill: none;
}

.axis path,
.axis line {
    fill: none;
    stroke: grey;
    stroke-width: 1;
    shape-rendering: crispEdges;
}


.grid .tick {
    stroke: lightgrey;
    stroke-opacity: 0.7;
    shape-rendering: crispEdges;
}
.grid path {
          stroke-width: 0;
}



/*
 * **************************************************
 * Darstellung Tooltipp  Grundfarbe: lightsteelblue
 * **************************************************
 * */

div.tooltip {   
  position: absolute;           
  text-align: center;           
  width: 100px;                  
  height: 40px;                 
  padding: 2px;             
  font: 12px sans-serif;        
  background: lightsteelblue;   
  border: 1px solid lightgray;      
  border-radius: 8px;           
  pointer-events: none;         
}


/*
 * **************************************************
 * Darstellung Temperatur  Grundfarbe: lightsteelblue
 * **************************************************
 * */
#graphTemperature {
    border: 3px solid #7070ED;
    width:  600px;
}

#graphTemperature .title {
    background: #7070ED;
    color: white;
    font-size:2em; 
    text-align:center; 
}

#graphTemperature .y {
    fill: steelblue;
    background: #7070ED;
}

#graphTemperature .linecolor {
    stroke: #7070ED;
    stroke-width: 2;
    fill: none;
}

#graphTemperature .tooltip1 {   
  background: lightsteelblue;   
}

/*
 * **************************************************
 * Darstellung Luftdruck  Grundfarbe: dunkelrot
 * **************************************************
 * */
#graphPressure {
    border: 3px solid Gray;
    width:  600px;
}

#graphPressure .title {
    background: #BB0202; 
    color: white;
    font-size:2em; 
    text-align:center; 
}

#graphPressure .y {
    fill: #BB0202
}

#graphPressure .linecolor {
    stroke: #BB0202;
    stroke-width: 2;
    fill: none;
}

#graphPressure  .tooltippfarbe{   
  background: #DCAFAF;   
}

/*
 * **************************************************
 * Darstellung Luftfeuchtigkeit  Grundfarbe: lindgrün
 * **************************************************
 * */


#graphHumidity {
    border: 3px solid #BDE7BD;
    width:  600px;
}

#graphHumidity .title {
    background: #BDE7BD; 
    color: gray;
    font-size:2em; 
    text-align:center; 
}

#graphHumidity .y {
    fill: green;
}

#graphHumidity .linecolor {
    stroke: green;
    stroke-width: 2;
    fill: none;
}

#graphHumidity .tooltip {   
  background: #BDE7BD;   
}




/*
 * **************************************************
 * Darstellung TT + P   Grundfarbe: hellgrau
 * **************************************************
 * */


#graphTemperaturePressure {
    border: 3px solid #BDE7BD;
    width:  1220px;
    color: black;
}

#graphTemperaturePressure .title {
    background: lightgray; 
    color: black;
    font-size:2em; 
    text-align:center; 
}

#graphTemperaturePressure .y1 {
    fill: blue
}

#graphTemperaturePressure .y2 {
    fill: red;
}

#graphTemperaturePressure .linecolor1 {
    stroke: lightsteelblue;
    stroke-width: 2;
    fill: none;
}

#graphTemperaturePressure .linecolor2 {
    stroke: red;
    stroke-width: 2;
    fill: none;
}

#graphTemperaturePressure .tooltip {   
  background: #BDE7BD;   
}

/* *************************************************
 * Darstellung aktueller Werte
 * *************************************************
 */
.messwert { float:left;
            margin-right:  2px;
            margin-left:   2px;
            border:        1px solid gray;
            padding-right: 10px;
            padding-left:  0px;
            /* width:300px; */
            /* background-image: url(celsius.png); */
            height: 85px;
}
	  
.text { float:left; 
        font-size:5em; 
        padding-left:0; 
    	color:lightgray;
}

.value {padding-left:85px;
	margin-top:8px; 
	font-size:1.2em;
	font-family: monospace; 
	font-weight: bold; 
	text-align:right;
}

.min {margin:2px; background-color:blue;  color:white;}

.max {margin:2px; background-color:red;   color:white;}

.avg {margin:2px; background-color:green; color:white;}

.aktuell {margin:2px; background-color:yellow; color:black;}