/****** BENCH *****************************/

#main__content  .main-wrapper .content-header h1 {
    padding-bottom:     .1em;
}
#main__content  .main-wrapper .content-header p {
    font-size:  1.6em;
    color:      #aaa;
    text-align: center;
}

#main__content  .main-wrapper .content-header h4 {
    margin:     0;
    color:      #5B9BD5;
    font-size:  2.4em;
    text-align: center;
}

#main__content  .main-wrapper .content-header a.button {
    display:    inline-block;
    width:      auto;
    margin:     1.4em auto .5em auto;
    font-size:  .8em;
}
#main__content  .main-wrapper div[role="navigation"] a.button {
    line-height: 2.5em;
    box-shadow: 0 0 1px #000;
}
#main__content  .main-wrapper div[role="navigation"] a.button strong {
    font-size:  1.6em;
}

#bench-header {
    position:       relative;
    width:          100%;
    margin-top:     1em;
    margin-bottom:  3em;
    text-align:     center;
}
#bench-header label {
    display:        block;
    padding-bottom: .2em;
    font-size:      1.5em;
    color:          #aaa;
}
#bench-header ul {
    display:        inline-table;
    margin:         0 auto;
}

#bench-header li a {
    display:        inline-block;
    width:          100%;
    padding:        .5em .7em;
    font-size:      1.5em;
    text-align:     center;
    border:         1px solid #444;
    border-left-width: 0;
}
#bench-header li:first-child a {
    border-left-width: 1px;
}
#bench-header li a:hover {
    background:     rgba(255,255,255,.1);
}
#bench-header li a.active {
    font-weight:    bold;
    background:     rgba(166,35,147,.5);
    border-color:   #a62393;
    border-left-width: 1px;
}


#bench-graph {
    position:       relative;
    width:          96%;
    margin-top:     1em;
    margin-left:    2%;
    margin-bottom:  3em;
}
#bench-graph .disp-tabcell {
    vertical-align: middle;
}
#bench-graph .you .disp-tabcell {
    background:     #555;
}
#bench-graph .disp-tabcell.pns {
    font-size:      1.4em;
    text-align:     right;
    min-width:      20%;
    overflow:       hidden;
}
#bench-graph .disp-tabcell.pns span {
    display:        inline-block;
    padding:        1em;
}
#bench-graph .disp-tabcell.score {
    position:       relative;
    width:          80%;
}
#bench-graph .disp-tabcell.score span {
    display:        inline-block;
    padding:        .5em;
    font-size:      1.6em;
    font-weight:    bold;
}
#bench-graph .disp-tabcell.score .score-bar {
    display:        inline-block;
    text-align:     right;
    -webkit-transform-origin:   0% 0%;
    -webkit-transition:         -webkit-transform 300ms ease-out;
    -webkit-transform:          scaleX(1);
    transform-origin:   0% 0%;
    transition:         -webkit-transform 300ms ease-out;
    transform:          scaleX(1);
}
#bench-graph .disp-tabcell.score .score-bar[data-hide="true"] {
    -webkit-transform:      scaleX(0);
    transform:              scaleX(0);
}
#bench-graph .disp-tabrow.intel .disp-tabcell.score .score-bar {
    background:     #5B9BD5;
}
#bench-graph .disp-tabrow.amd .disp-tabcell.score .score-bar {
    background:     #70AD47;
}


#bench-graph .columns {
    position:   absolute;
    z-index:    2;
    top:        0;
    left:       20%;
    width:      80%;
    height:     100%;
    opacity:	.4;
}
#bench-graph .columns div {
    position:   absolute;
    top:        0;
    left:       0%;
    width:      1px;
    height:     100%;
    background: #fff;
}
#bench-graph .columns .column2 {
    left:       33%;
}
#bench-graph .columns .column3 {
    left:       66%;
}
#bench-graph .columns .column4 {
    left:       100%;
}
