User:EpochFail/qualityviz/style.css

font-family: 'Georgia', 'Times', serif; color: #4D4D4D; font-weight:normal; background-color: #F2F2F2; width:100%; }
 * 1) quality {

color: #4D4D4D; text-decoration: none; font-weight:normal; }
 * 1) quality a {

color: #4D4D4D; text-decoration: underline; }
 * 1) quality a:hover {

color: #4D4D4D; text-decoration: none; font-weight:normal;
 * 1) quality a:visited {

}

.quality_bar { height: 28px; }

.quality_bar div { display:inline-block; float:left; margin-top:3px; }

.quality_bar_alert { height:inherit; border-top: 5px solid #B5F4D5; width:100%;

}

div.quality_col1 { height:inherit; width:30%; display:inline-block; float:left;

//   border:1px solid blue; }

div.quality_col2 { height:inherit;

width:68%; display:inline-block; float:left;

//   border:1px solid red; }

div.quality_col2 .detail { height:100px; width:30%; display:inline-block; float:left; }

div.detail_graph { height:100%; width:200px; float:right; vertical-align:bottom; }

.gradient_bg { border-left: 3px solid #eaeaea; /* IE10 */ background-image: -ms-linear-gradient(left, #eaeaea 0%, #F2F2F2 100%); /* Mozilla Firefox */ background-image: -moz-linear-gradient(left, #eaeaea 0%, #F2F2F2 100%); /* Opera */ background-image: -o-linear-gradient(left, #eaeaea 0%, #F2F2F2 100%); /* Webkit (Safari/Chrome 10) */ background-image: -webkit-gradient(linear, left top, right top, color-stop(0, #eaeaea), color-stop(1, #F2F2F2)); /* Webkit (Chrome 11+) */ background-image: -webkit-linear-gradient(left, #eaeaea 0%, #F2F2F2 100%); /* Proposed W3C Markup */ background-image: linear-gradient(left, #eaeaea 0%, #F2F2F2 100%);

}

height:28px; position:absolute; z-index:10; width:100%; background-color:#f2f2f2; display:none; }
 * 1) header_bar_expand {

.headline { font-size:0.8em; font-style:oblique; color: #666666; line-height:1em; margin: 0px 5px; }

.bar_text { font-size:0.643em; color:#4d4d4d; text-transform: uppercase; letter-spacing:2px; }

p.bar_text, p.list { display:inline; float:left; margin:0px 25px; line-height:2.4em; }

.legend { font-size:0.643em; color:#4d4d4d; font-style:oblique; font-weight:bold; text-transform: uppercase; letter-spacing:1px; line-height:1.4em; }

p.list { font-size:1em; font-style:normal; color:#0E43AE; margin-top: -9px; }

display:inline-block; float:left; height:14px; }
 * 1) overall_graph div {

width:75px; background-color:#9FE7C6; }   width:25px; background-color:#B3B3B3; }
 * 1) overall_graph .top {
 * 1) overall_graph .bottom {

.expand_me { float:right; margin-left:250px; }

height:200px; overflow:hidden; display:none; clear:both; border-top:2px dotted #cccccc;
 * 1) bar_expand {

}

padding:28px 50px; width:400px; float:left; display:inline-block;
 * 1) main_graph {

}

width:inherit; float:left; display:inline-block; }
 * 1) donut {

circle#hemisphere { stroke-dasharray: 1,3; }

.pieslice { width:72px; height:72px; display:inline-block; }

clear:both; display:block; }
 * 1) toprow {

clear:both; display:block; }
 * 1) bottomrow {

float:left;
 * 1) pie1 {

display:inline-block; }   float:left; display:inline-block;
 * 1) pie2 {

}

float:left; display:inline-block;
 * 1) pie3 {

}   float:left; display:inline-block;
 * 1) pie4 {

}