/*
* CSS file dedicated to flot functionality.
* Flot does not support axisLabel resizing as of today. This is a fix for common problems.
*/

/*
* Rotates the xaxis labels when length of the given data is too long.
*/
.rotate div.xAxis div.tickLabel
{
    margin-top:0px;
    transform: rotate(45deg);
    -ms-transform:rotate(45deg); /* IE 9 */
    -moz-transform:rotate(45deg); /* Firefox */
    -webkit-transform:rotate(45deg); /* Safari and Chrome */
    -o-transform:rotate(45deg); /* Opera */
    /*rotation-point:50% 50%;*/ /* CSS3 */
    /*rotation:270deg;*/ /* CSS3 */
}

/*
* Creates small label font when datasets are too big.
*/
.label-sm div.xAxis{
    height:100%;
    font-size:10px;
}

.label-default div.xAxis{
    height:100%;
    font-size:20px;
}


/*
* Navigation bar class.
*/
.axisLabel {
    position: absolute;
    text-align: center;
    font-size: 15px;
}

/*
* Navigation bar class extend
*/
.xaxisLabel {
    bottom: 3px;
    left: 0;
    right: 0;
    margin-left:11%;
    width:85%;
    padding-top:50px;
}


/*
* Quick fix for yaxislabels in FLOT
*/
.yaxisLabel {
    top: 50%;
    left: 2px;
    transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -webkit-transform:  rotate(-90deg);
    transform-origin: 0 0;
    -o-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
}

#legend{
 font-size:15px;
}
/*
* Legend table settings. *Responsive Design*
*/
#legend table{
    margin-left:auto;
    margin-right:auto;
}

/*
* Legend padding for decent responsive design.
*/
#legend .legendLabel {
    padding-right:10px;
}​