﻿
.verticalheader,.verticalheaderempty
{
        height: 175px;
        /* width: 40px; */
         min-width: 40px; 
        /* max-width: 40px; */
        position: relative;
        vertical-align: bottom;
        padding: 0;
        line-height: 0.8;
        white-space:nowrap;
}

.verticalheaderempty
{
        min-width:160px !important;
}


.verticalheader > div
{
    position: relative;
    top: 0px ;
    left: 90px ; /* 80 * tan(45) / 2 = 40 where 80 is the height on the cell and 45 is the transform angle 116*/
    height: 100% ;
    -ms-transform: skew(-45deg,0deg) ;
    -moz-transform: skew(-45deg,0deg) ;
    -webkit-transform: skew(-45deg,0deg) ;
    -o-transform: skew(-45deg,0deg) ;
    transform: skew(-45deg,0deg) ;
    overflow: hidden ; 
    /* border-left: 1px solid #dddddd; */
      border-right: 1px solid #dddddd;
     /* border-top: 1px solid #dddddd;*/
     background-color:White;
}


.verticalheader > div > span
{
    -ms-transform: skew(45deg,0deg) rotate(315deg) ;
    -moz-transform: skew(45deg,0deg) rotate(315deg) ;
    -webkit-transform: skew(45deg,0deg) rotate(315deg) ;
    -o-transform: skew(45deg,0deg) rotate(315deg) ;
    transform: skew(45deg,0deg) rotate(315deg) ;
    position: absolute ;
    bottom: 30px ; /* 40 cos(45) = 28 with an additional 2px margin*/
    left: -25px ; /*Because it looked good, but there is probably a mathematical link here as well*/
    display: inline-block ;
    width: 85px ; /* 80 / cos(45) - 40 cos (45) = 85 where 80 is the height of the cell, 40 the width of the cell and 45 the transform angle*/
    text-align: left ; /* white-space: nowrap; */ /*whether to display in one line or not*/
    padding-bottom:5px;
    padding-left:13px;
    font-size:11px;
}