.container {
    background-color: #A1CEFF;
    padding: 1px 2px;
}
.container.top {
    height: 87px;
    margin-top: 5px;
    border-top-color: royalblue;
    border-top-width: 2px;
    border-top-style: solid;
}
.container.middle {
    height: 87px;
    border-left-color: royalblue;
    border-left-width: 2px;
    border-left-style: solid;
    border-right-color: royalblue;
    border-right-width: 2px;
    border-right-style: solid;
}
.container.bottom {
    height: auto;
    padding-top: 5px;
    text-align: center;
    border-bottom-color: royalblue;
    border-bottom-width: 2px;
    border-bottom-style: solid;
}

.vp .figure {
    background-color: royalblue;
}
.vp .figure.active {
    background-color: lightSalmon;
}
.vp .figure.inactive {
    background-color: #CCC;
}
.vp .figure .name,
.vp .figure .title {
    color: cornsilk;
    font-weight: bold;
}
.vp .figure.active .name,
.vp .figure.active .title {
    color: black;
    font-weight: bold;
}
.vp .figure.inactive .name,
.vp .figure.inactive .title {
    color: black;
    font-weight: bold;
}

.tool-information {
    display: none;
}

.main-interface .tools a.active div {
    background-color: lightSalmon;
    color: #008ee8;
}

.tools-interface .message {
    display: none;
}

/* figures */

#form-figures {
    margin-bottom: 10px;
}

.block-figures {
    width: 795px;
    color: black;
}
.container-full {
    display: inline-block;
    width: 100%;
}
.container-slice {
    position: relative;
    float: left;
    width: 145px;
    min-height: 460px;
    margin: 0 3px;
    border: solid 1px #6194C8;
    background: #C2D3E6;
}
.container-slice {
    -moz-border-radius: 12px;
    -webkit-border-radius: 12px;
    border-radius: 12px;
    behavior: url("/js/pei.htc");
}
.container-slice {
    -webkit-box-shadow:rgba(0, 0, 0, .4) 0 2px 2px;
    -moz-box-shadow:rgba(0, 0, 0, .4) 0 2px 2px;
    box-shadow:rgba(0, 0, 0, .4) 0 2px 2px;
}
.line-separator {
    width: 128px; margin: 0 auto;
}
.side-bg {
    background: url("../images/line-bg.png") center repeat-y;
}
.center-bg {
    background: url("../images/line-bg.png") 62px repeat-y;
}
.short {
    height: 7px;
}
.high {
    height: 5px;
}

.center {
    margin: 0 auto;
}
.up {
    padding-bottom: 25px;
    background: url("../images/container-top-bg.png") bottom center no-repeat;
    margin-left: -15px;
}
.dual .left {
    float: left;
    width: 30%;
}
.dual .right{
    float: right;
    width: 30%;
}
.dual {
    width: 57%;
}

.category {
    position: absolute;
    left: 0;
    bottom: 0;
    display: block;
    width: 60%;
    height: 30px;
    padding: 5px 30px;
    font-size: 14px;
    font-weight: bold;
    line-height: 16px;
    text-align: center;
}

.figures {
    position: relative;
    overflow: hidden;
    width: 125px;
    padding: 3px 4px;
    border: solid 1px #6194C8;
    color: #000;
    background: #FFF;
}
.figures {
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    behavior: url("/js/pei.htc");
}
.figures {
    -webkit-box-shadow:rgba(0, 0, 0, .4) 0px 2px 2px;
    -moz-box-shadow:rgba(0, 0, 0, .4) 0px 2px 2px;
    box-shadow:rgba(0, 0, 0, .4) 0 2px 2px;
}

.figures img {
    float: left;
    margin-right: 5px;
    width: 36px;
}
.figures span {
    display: block;
    float: left;
    width: 80px;
    font-size: 10px;
    line-height: 12px;
}
.figures span.name {
    font-weight: bold;
    margin-bottom: 3px;
}
.figures .interest-bar {
    display: inline-block;
    float: left;
    width: 100px;
    height: 9px;
    margin: 3px 0 1px;
    border: 1px solid #6194C8;
}
.figures .interest {
    height: 9px;
    float: left;
}
.block-2 .bar-red,
.figures .bar-red {
    background-color: red;
}
.block-2 .bar-gray,
.figures .bar-gray {
    background-color: #85B1E6;
}

.block-2 .bar-orange,
.figures .bar-orange {
    background-color: orange;
}

.block-2 .bar-greenyellow,
.figures .bar-greenyellow {
    background-color: greenyellow;
}

.block-2 .bar-green,
.figures .bar-green {
    background-color: lime;
}

.figures div.add-interest {
    display: inline-block;
    width: auto;
    float: left;
    margin: 2px 0 0 2px;
    background-color: gold;
    padding: 1px;
    font-size: 10px;
}

.vp .figures {
    background: #E7F1FF;
}

.sidebar.left {
    margin-left: 0;
}

.figure-information p,
.action-history table th,
.action-history table td,
.action-history table td span,
.result table th,
.result table td {
    line-height: 18px;
}
.vp .figures.active,
.figures.active,
.vp .figures.active.select,
.figures.active.select {
    background-color: lightsalmon;
}
.tools-interface h2 {
    text-align: center;
    margin-left: -120px;
}
.networks h2 {
    margin-left: 0;
}
.figures.inactive,
.figures.inactive.select {
    background-color: #CCC;
}
.vp .figures.inactive,
.vp .figures.inactive.select {
    background-color: #BBB;
}

.vp .figures.select,
.figures.select {
    background-color: #ffdead;
}

/* history */

.action-history {
    border: 1px solid #999;
    max-height: 480px;
    overflow: auto;
}
.action-history table {
    border-collapse: collapse;
}
.action-history table th, 
.action-history table td {
    border: 1px solid #999;
    padding: 1px 4px;
}
.action-history table td p {
    padding-top: 2px;
    padding-bottom: 14px;
    line-height: 16px;
}
.action-history .left {
    float: left;
    width: 140px;
}
.action-history .right {
    float: right;
    width: 35px;
    text-align: right;
}
.action-history th.action {
    min-width: 75px;
}
.action-history th.figure-score {
    width: 180px;
}
/* bar-days */

.bar-days {
    overflow: hidden;
    padding: 4px;
    width: 156px;
}
.bar-days .label span.left, 
.bar-days .label span.right {
    font-size: 14px; 
    font-weight: bold; 
    padding: 1px 10px;
}
.bar-days span.left {
    float: left;
}
.bar-days span.right {
    float: right;
}
.bar-days .days-elapsed {
    float: left;
    height: 15px;
    background-color: coral;
}
.bar-days .days-togo {
    float: left;
    height: 15px;
    background-color: lightskyblue;
}
.bar-days-text {
    font-size: 10px;
    margin-top: 3px;
}

/* chart */

.chart {
    margin: 10px auto;
}
.chart .diagram {
    border: 1px solid #999;
    height: 400px;
    width: 780px;
    margin: 5px
}
.chart .y-axis-left,
.chart .y-axis-right {
    float: left;
}

.chart .y-axis-left div,
.chart .y-axis-right {
    width: 60px;
    line-height: normal;
}
.chart .y-axis-left div {
    text-align: right;
    padding-right: 5px;
}
.chart .y-axis-right {
    text-align: left;
    padding-left: 5px;
}

.chart .y-axis-left div.title {
    text-align: left;
    padding-top: 10px;
    padding-bottom: 45px;
}
.chart .y-axis-right div.title {
    padding-top: 10px;
    padding-bottom: 149px;
}
.chart .y-axis-left div.label-zero {
    padding-top: 74px;
}
.chart .x-axis {
    margin-left: 65px;
}
.chart .x-axis span.label-zero {
    margin-left: 0;
}
.chart .x-axis span {
    margin-left: 133px;
}
.x-axis-label {
    text-align: right;
    margin-right: 100px;
}
.score-footer {
    margin-left: 150px;
    margin-bottom: 20px;
}
.score-footer > div.left,
.score-footer > div.right {
    float: left;
    padding: 10px;
    height: 60px;
}
.score-footer > div.left {
    border: 1px solid #999;
}
.score-footer > div.right {
    border-top: 1px solid #999;
    border-right: 1px solid #999;
    border-bottom: 1px solid #999;
}
.score-footer > div.right .number-adopters,
.score-footer > div.right .score {
    float: left;
    margin-top: 10px;
    text-align: center;
}
.score-footer > div.right .score {
    margin-left: 20px;
}
.score-footer > div.right .number-adopters .value,
.score-footer > div.right .score .value {
    font-size: 14px;
    font-weight: bold;
}

/* report */

.report {
    width: 800px; 
    margin: 10px auto;
    line-height: 100%;
}
.report .result {
    page-break-inside: avoid;
}

.report h1 {
    font-size: 24px;
    text-align: center;
    margin-bottom: 20px;
}

.report .result {
    width: 800px;
    margin-bottom: 40px;
}
.report .result table {
    border-collapse: collapse;
}
.report .result table th,
.report .result table td {
    border: 1px solid #999;
    padding: 2px;
}
.strategic .result table td {
    vertical-align: top;
}
.report .result table.block-figures th,
.report .result table.block-figures td {
    border: 0;
}

.report .result table th.left,
.report .result table th.right {
    width: 50%;
}