/* Zero margins and padding to handle IE differences. */
* {padding:0; margin:0}

html {overflow-y: scroll;}
body {font:11px/1.4 Verdana, Arial, Helvetica, sans-serif; 
        background:#e6e6e6; color:black; margin:0px;
        text-align:center }	/* puts the frame in the middle of the body for IE. */

#frame {width:977px; text-align:left; margin:0 auto; padding:0px} /*margin handles center allignment in std browser. */

#TopBar {height:68px; position:relative;z-index:1}

#TopGreyBar{height:27px; padding-left:0px;
    background:#CCCCCC url(/CSS/images/ui-bg_highlight-soft_75_cccccc_1x100.png) repeat-x scroll 50% 50%;
    border-top:1px solid #AAAAAA; color:#222222; }

/*min-height causes trouble with ie8 and dialog, but needed for IE7!*/
#MiddleBar {background:white; padding:10px 12px 1px 15px; min-height:500px; position:relative; border-right:1px solid #C5C5C5; }
#TopGreyBar {border-bottom:1px solid #C5C5C5; border-right:1px solid #C5C5C5; z-index:100;position:relative;}
#TopBar {border-right:1px solid #C5C5C5; background:url(/images/banner4.gif) 10px 5px no-repeat white}
#BottomBar {clear:left; padding:0px 10px 10px 15px; font-size:9px}

/* Page footer "control panel" */
.ControlPanel{font-size:10px; clear:both; min-height:35px; height:auto!important; height:35px}
div.ControlPanel > p {font-size:8px}
.SurgeryClassCheck label {width:60px; display:inline-block; vertical-align: middle; }
.SurgeryClassCheck  input  {vertical-align: middle}
#ControlBar {padding:0px 12px 10px 15px;position:relative; background:url(/images/footer.png) bottom left no-repeat white}
#ControlBar table {line-height:11px}
.PolySystem {float:right; margin:2px 22px 0px 0px; padding-bottom:2px}
.PolySystem input {margin:0px 1px}
.PolySystem span {margin-left:5px}

.dialog {font-size:10px}

h1 {font-size:22px; color:#373b94; margin-bottom:5px; float:left}
h2 {font-size:18px; color:#6998c9; margin:10px 0px}
h3 {font-size:14px; color:#6998c9; margin:5px 0px}
h4 {font-size:12px; color:#666666; margin:5px 0px}
em {font-style:italic; color:#f03b58}
a, .challenge {color:#38509f; text-decoration:none}
a:active, a:hover, .challenge:hover {color:#d96a00}
p {margin-bottom:5px}
ol, ul {margin: 5px 5px 5px 15px; }
ul li {margin-top:2px}
img {border:none}
acronym, abbr, .Acronym {cursor:help; border-bottom:dotted 1px #585850}
pre, .Pre {font-family:courier, "courier new", monospace}
.subscript {position: relative;top: 0.3em}

.HoverClass{ cursor:pointer}
.ui-tabs-panel a {color:#38509f!important;}
.ui-widget {font-size:11px!important}
.ui-tabs-panel {height:auto}
.ui-tabs {margin-bottom:5px}
.ui-tabs li a span {float:left}
.ui-tabs li a div {float:left; margin-left:5px}
.ui-tabs li a img {height:14px}
.ui-daterangepicker {text-align:left!important}
.ui-dialog .ui-dialog-content {overflow:hidden!important}
table.fancy th a.ui-widget {background:transparent}
table.fancy th a.ui-widget {background:transparent; color:#66A3D3!important;border: none}

table.fancy span.ui-icon {background-image: url(images/ui-icons_888888_256x240.png);margin-left:-4px}
.ui-dialog .ui-state-error { padding: .3em; }
.validateTips { border: 1px solid transparent; padding: 0.3em; }	
#dialog-form {text-align:left}
fieldset { padding:0; border:0; margin-top:2px; }
fieldset label {width:80px; display:block; float:left; clear:left}
fieldset input {width:230px; }

#tabs {min-height:450px; height:auto !important; height:450px; clear:both}
.normal {font-weight:normal!important}

div#BottLeft {float:left; width:360px}
div#BottRight{float:right}
div#DirectLogin {float:right; width:70%; text-align:right; display:none}
#LoginImg { float:right; cursor:pointer; margin-left:10px}

/* Menu Extras*/
#menu {z-index:200}
li.separator {border-bottom:1px solid #AAAAAA!important}
li.spacer {margin-left:20px}

.invisible {display:none!important; visibility:hidden!important}
.fail {color:#F03B58; font-weight:bold; margin-top:20px; font-size:12px}
.success {color:Green; font-weight:bold; margin-top:20px; font-size:12px}
.over {color:#F03B58}
.under {color:Green}

/* Charts */
.ChartClass {border-bottom:1px solid #C5C5C5; border-right:1px solid #C5C5C5; background:#e6e6e6}
.instructions {color:#f03b58}
.ReportSpinner {position:absolute; top:200px; left:200px}

.footnotes { border-top:1px solid #E5EFF8; background:#F4F9FE url(/images/table_background.gif) repeat-x;
    width:937px; padding:5px 0px 10px 15px; margin-top:20px}
.footnotes h3 {font-size:10px}
.footnotes {font-size:9px}
blockquote { padding:15px 10px 18px 7px; background:#efefef; color:#678197; margin: 5px 20px 5px 25px; font-size:10px} 

.beta {background:url(/images/beta.jpg) white no-repeat 750px 0px}
div.beta {min-height:100px; height:auto !important;height:100px;}

.figure {float:left; margin:0px 20px; }
.figure img, .figure table    { padding:5px; border:1px solid #ddd!important; background:white;
-moz-border-radius: 5px; -webkit-border-radius: 5px;}
.figure p {color:#585850; font-size:10px}

.slider {margin-left:5px}
.UnitsClass {float:left;line-height:12px; font-weight:bold; margin-left:10px}

.helpText {display:none; text-align:left; font-size:10px}
.helpText .BackButton {display:none} /* Edit button for content control. */
.helpText a {text-decoration:underline}
.pretty { border-top:1px solid #E5EFF8; background:#F4F9FE url(/images/table_background.gif) no-repeat}
.account {float:right; text-align:right; font-size:10px; margin-right:10px;z-index:2}
#RiskRangeSelector {width:423px; float:left}
.chartOptions {float:right; width:440px }

.AjaxLoader {margin-top:5px}
.AjaxLoadIcon {background:url(/images/ajax-loader.gif) no-repeat; display:block; width:16px; height:16px}
.ExportButtonClass{clear:left; margin-bottom:2px; display:none;padding:0.1em 0.2em!important;font-size:9px!important}
.version{font-size:xx-small; color:Gray}

/* Table things*/
.caption, caption { caption-side: bottom; color: #9BA9B4; font-size: 0.94em; letter-spacing: 0.1em;
    margin: 0px 0px 0px 0px; padding: 0; text-align: center; }
table.fancy { border-top: 1px solid #e5eff8; border-right: 1px solid #e5eff8; 
              border-bottom:none; border-collapse: collapse; width:100%}
table.fancy td { color: #678197; border-bottom: 1px solid #e5eff8; border-left: 1px solid #e5eff8; padding: .3em 1em;  vertical-align:top}    
 .PagerButton {padding:0.3em 1em;}              
tr.odd td, tr.odd .column1 {background: #f4f9fe url(/images/table_background.gif) no-repeat;}
.column1 {background: #f9fcfe; font-weight: bold; padding: 0.3em 1em; text-align: left;}
table.fancy tr:hover, table.fancy tr:hover td, 
table.fancy tr.RowHover td.column1, table.fancy tr.RowHover td {background-color: #FFFFCC!important; background-image:none}
table.fancy th {border-bottom: 1px solid #E3F1FE; border-left: 1px solid #E5EFF8;color: #678197;
    font-weight: bold; padding: 0.3em 1em;text-align: left; vertical-align: top}
tr.PagerClass, table.fancy thead th, tr.fancyHead th { background: #f4f9fe; color: #66a3d3; }
table.fancy .PagerClass a { font-weight:bold}
table.fancy tr.FooterClass {background: #f4f9fe}
table.fancy tr.FooterClass td {color: #66a3d3!important}

table.fancy th.ASC, table.fancy th.Ascending {background-image:url(/images/icons/triangle-1-n.gif); background-repeat: no-repeat; background-position: -2px 3px;}
table.fancy th.DESC, table.fancy th.Descending {background-image:url(/images/icons/triangle-1-s.gif); background-repeat: no-repeat; background-position: -2px 3px;}
table.fancy th.DESC a, table.fancy th.ASC a, table.fancy th.Descending a, table.fancy th.Ascending a {margin-left:1px}

tr.PagerClass table {background:none}
tr.PagerClass table td {border:none}
.SelectedRowStyle, .SelectedRowStyle td { background:#e6e6e6!important}
th.IP {padding-left:8px!important; padding-right:2px!important;}
.leftBorder {border-left:1px solid #ccc!important}
.leftHeavyBorder {border-left:2px solid #ccc!important}
table.fancy tr {height:1.6em}
td.small {font-size:9px}

.alwaysShow {display:table-cell!important}

/*Jquery UI button classes etc */
.ui-accordion .ui-accordion-header a {padding-left:1.8em!important;}
.errorMessage {float:right; padding: 5px 5px; width:300px!important}

/*Vital Signs*/
.Ok {color:green!important}
.NotOk {color:orange!important}
.printButton {z-index:1; position:absolute; bottom:10px; right:10px}

/* Suppress 1st table and control tree 3rd - mostly annoying. */
span.tracecontent table:nth-child(1) {display:none}
span.tracecontent table:nth-child(3) {display:none}

/*For Autocomplete*/
.qLabel {clear:left;float:left;width:70px;text-align:right; line-height:18px}
div.FauxAjaxInput {width:292px; min-height:20px; height:auto!important; height:20px;
margin-bottom:1px; padding:3px 3px 0; border:1px solid #aaa; background-color:#fff; cursor:text; float:left; font-size:9px; }
div.FauxAjaxInput input  { display:block; width:274px; border:medium none; float:left; height:10px;margin:0 0 2px; padding:3px 0 3px 3px; width:38px;}  
div.FauxAjaxInput span  { float:left; display:inline-block; position:relative; width:40px; margin:0 3px 3px 0; padding:0px 20px 1px 8px;  background-color:#eee; border:1px solid #333; -moz-border-radius:7px; -webkit-border-radius:7px; border-radius:7px; color:#333; }
div.FauxAjaxInput span a { position:absolute; right:8px; top:0px; color:#666; font-weight:bold; text-decoration:none; }  
.FauxAjaxInput  span a:hover { color:#ff0000; }
.ui-autocomplete-loading { background: white url('/images/ajax-loader.gif') right center no-repeat; }
ul.ui-autocomplete {text-align:left}

/* Print Only. */
@media print 
{
    body {background:none}
    #frame{margin:0}
    #MiddleBar {padding-top:0px}
    .NotPrint, table.ColSelector, .notprint, #buttons,
    div.PolySystem, a.dialog, #ControlBar span, #TopBar, #TopGreyBar, .ExportButtonClass {display:none!important}
    #MiddleBar  {border-right:none; padding:0;}
    #MiddleBar  h1 {margin-bottom:0px}
    #ControlBar {border-right:none; border-bottom:none;padding-top:0px; padding-bottom:0px;background:none}
    #ControlBar div.ControlPanel a {display:none}
    br {line-height:0px}
    #BottomBar {display:none}
    #RiskRangeSelector h4, #RiskRangeSelector a, #RangeSlider,.UnitsClass {display:none} 
    #tabs {margin-bottom:0px}
    #tabs div.ui-tabs-panel {padding-bottom:1px}
    #tabs div.ui-tabs-panel caption {display:none}
    .StatsClass{display:none}
    #tabs {margin-top:1px}
    #tabs h3 {display:none}
    
    /* For printing help.*/
    .helpText h1 {display:block}
    .printButton {display:none}
}