/* --- View 108 --- */

div#view108 {
    position: relative;
    width: auto; height: auto;
    font-size: 15px;
}

/* -- Chart and Legend -- */
div#view108 div.chart,
div#view108 div.legend {
    display: inline-block;
    vertical-align: top;
}


/* -- Legend -- */
div#view108 div.legend {
    width: 16em; height: auto;
    margin: 0 0 0 1em;
    padding: 0.2em;
    background: #f2f2f2;
    /**/display: none;
}


/* -- Chart -- */
div#view108 div.chart {
    position: relative;
    margin: 1em 0 0 0;
    padding-bottom: 8em;
    /*background: yellow;*/
}

/* -- Values and X-axis -- */
div#view108 div.chart table.values, 
div#view108 div.chart table.axis_x {
    margin: 0 0 0 3.5em;
    border-collapse: collapse;
    
}
div#view108 div.chart table.values td, 
div#view108 div.chart table.axis_x td {
    width: 3em;
    padding: 0 0;
}
div#view108 div.chart table.values td div, 
div#view108 div.chart table.axis_x td div {
    padding: 0 0;
}


/* -- Values --- */

div#view108 div.chart table.values {
    position: relative;
    width: auto;
    border-left: dotted 0.1em gray;
    /*background: yellow;*/
}

/* Values rows */
div#view108 div.chart table.values tr {
}

/* Values cells */
div#view108 div.chart table.values td {
    height: 22em;
    text-align: center;
    /*background: #f1f1f1;*/
}
/* Values cells - inner container */
div#view108 div.chart table.values td div.col {
    position: relative;
    height: 100%; width: 100%;
    padding: 0 0;
    text-align: center;
}
/* Value Bar */
div#view108 div.chart table.values td div.col div.val {
    position: absolute; bottom: 0em; left: 15%;
    width: 65%;
    background: green;
    z-index: 10;
}


/* -- X axis -- */

/* Table */
div#view108 div.chart table.axis_x {
    position: relative; top: 0;
    /*background: yellow;*/
}
/* Cell - ao */
div#view108 div.chart table.axis_x td {
    position: relative;
    height: 8em;
    /*background: yellow;*/
}
div#view108 div.chart table.axis_x td div {
    position: absolute; top: -3em; left: 4.67em; 
    width: 0.67em; height: 100%;
    direction: rtl; 
    transform: rotate(270deg); 
    white-space: nowrap;
    text-align: right;
    /*background: yellow;*/
}

/* -- Y axis -- */

/* Block */
div#view108 div.chart div.axis_y {
    position: absolute; top: 0.7em; left: 2.7em;
    width: 97%; height: auto;
}
div#view108 div.chart div.axis_y div {
    width: 100%; height: 3em;
    border-top: dotted 0.5px gray;
    position: relative;
}
div#view108 div.chart div.axis_y div span {
    position: absolute; top: -0.5em; left: -1.67em;
}