﻿body { background-color: #eee; margin:0;padding:0; font-family: arial,helvetica,sans-serif;font-size: 12px;}
img {border: none;}
a { color:black; }
a:hover {color: #999; text-decoration: underline;}
h1 {font-size: 24px; margin: 15px 0 5px 0;}
h2 {font-size: 20px; margin: 15px 0 5px 0;}
h3 {font-size: 16px; margin: 15px 0 5px 0;}
#content {margin-left: 10px; width: 96%; text-align:left; background-color:#FFFFFF;padding: 10px 10px 6px; border: 1px solid #ccc; }
#masthead {margin: 0 0 10px 0; position: relative;}
#utilMenu {position: absolute; top: 0; right: 0; width: 500px; text-align: right;}
#utilMenu a {font-size: 12px; margin-right: 15px;}
#utilMenu a:hover {color: #999;}
#utilMenu #logout-link {margin: 0; font-size: 13px; font-weight: bold; text-decoration: none; background: #666; color: #fff; padding: 5px 9px; line-height: 24px;}
#utilMenu #logout-link:hover {background: #999;}
#utilMenu p {margin: 5px 0;}
#navigation {color: #fff; margin: 0 0 4px 0; padding: 0; position: relative;}
#navigation ul {height: 33px; list-style: none; margin: 0; padding: 0;
	background: #666;
	background: -webkit-gradient(linear, left top, left bottom, from(#444444), to(#555555));
	background: -moz-linear-gradient(top,  #444444,  #555555);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#444444', endColorstr='#555555');
}
#navigation li {display: inline;}
#navigation li a,#nav li a:visited {display: block; float: left; padding: 8px 20px; color: #fff; text-decoration: none; font-size: 14px; text-shadow: 1px 1px 1px #333; font-weight: bold; border-right: solid 1px #888;}
#navigation li a.selected,#navigation li a:hover { text-shadow: none; color: #efefef;
	background: #f78d1d;
	background: -webkit-gradient(linear, left top, left bottom, from(#f37608), to(#f47a20));
	background: -moz-linear-gradient(top,  #f37608,  #f47a20);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f37608', endColorstr='#f47a20',GradientType=0);
}
#navigation span {position: absolute; top: 10px; right: 10px;}
#navigation span a {color: #fff;}
#navigation span a:hover {color: #ccc;}
.instruct {font-size: 10px; font-weight: normal;}
.instruct a {font-weight: normal;}
.note {font-size: 11px; color: #666; margin-left: 6px; font-weight: normal;}
.note a,.note a:visited{color: #000;}
.note a:hover{color: #f33;}
.stIP {background: #ffc; padding: 2px 4px;}
.stC {background: #cde18d; padding: 2px 4px;}

.fltGrp {margin-bottom: 5px; overflow: hidden; width: 100%; height: 1%;}
.emHd {border: solid 1px #f37608; -moz-border-radius: 10px; border-radius: 10px; -webkit-border-radius: 10px; color: #fff; background: #f37608; padding: 10px; font-size: 22px; width: 140px; margin: 0; text-align: center;}
.hide {display: none;}
form {text-align: left;}
fieldset h3 {margin: 0;}
fieldset.jqDForm label {display: block; font-size: 12px;}
fieldset.jqDForm input {display: block; font-size: 12px; margin-bottom: 8px;}
fieldset.jqDForm div.rdoGrp {margin: 10px 0;}
fieldset.jqDForm div.rdoGrp label {display: block; margin: 0; font-weight: normal;}
fieldset.jqDForm div.rdoGrp input {display: inline; margin-bottom: 2px;}

.checked-listbox input, .checked-listbox label {display: inline; margin-top: 0;}
.md {width: 150px;}
.lg {width: 200px;}
.xl {width: 250px;}
optgroup {font-style: normal;}
.fld {float: left; margin-right: 5px;}

a.editBtn {float: left; display: block; margin: 0 10px; padding: 0;}
a.delBtn {width: 16px; height: 16px; margin: 0; background: url(/Content/src/images/icon-removeS.png) no-repeat; padding: 0; display: block; float: left;}
a.delBtn:hover {background: #ccc url(/Content/src/images/icon-removeS-H.png) no-repeat; }


p.trigger {padding: 0 0 0 18px; margin: 0 0 10px 0; background: url(/Content/plusminus.gif) no-repeat; height: 13px; font-size: 12px; font-weight: bold; }
p.trigger a {color: #000; text-decoration: underline; display: block; cursor:pointer;}
p.trigger a:hover {color: #999;}
p.active {background-position: left bottom;}
.toggle_container {margin: 0; padding: 0; overflow: hidden; clear: both;}
.toggle_container .block {padding: 0px;}
.toggle_container ul {margin-top: 0;}

#footer {padding-top: 20px; font-size: 11px; margin: 0 auto; width: 300px;text-align: center; clear: both;}

.tabsContainer div { clear: both; margin: 0; padding:0px; }
.tabs li { float:left; list-style:none; margin-right:5px; }
.tabs li a { display:block; padding:4px 6px; background:#f0f0f0; color:#333; font:13px arial,helvetica,sans-serif; text-decoration:none; border:1px solid #999999 }
.tabs li a:hover { background:#c0c0c0; color:#000; }
.tabs li a.selected { background:#bbb; color:#000; }
.tabs { margin:0px;padding:0px;height:20px;margin-bottom:5px;}

.tabsContainer_styleOnly div { clear: both; margin: 0; padding:0px; }
.tabs_styleOnly li { float:left; list-style:none; margin-right:5px; }
.tabs_styleOnly li a { display:block; padding:4px 6px; background:#f0f0f0; color:#333; font:13px arial,helvetica,sans-serif; text-decoration:none; border:1px solid #999999 }
.tabs_styleOnly li a:hover { background:#c0c0c0; color:#000; }
.tabs_styleOnly li a.selected { background:#bbb; color:#000; }
.tabs_styleOnly { margin:0px;padding:0px;height:20px;margin-bottom:5px;}

#tab { padding: 0px; }
label { font-weight: bold;}
.success { color: #4F8A10; background-color: #DFF2BF; font-size: 13px; padding: 10px; margin: 5px; font-weight: bold; border: 1px solid #4F8A10;}
.error { color: red; font-size: 13px; font-weight: bold;}

/*table styles */
table.tablesorter {border-collapse: collapse; border: 1px solid #ccc; margin: 0 0 10px 1px; width: 99.9%;}
table.tablesorter td,table.tablesorter th {padding: 4px; border-right: solid 1px #ccc; vertical-align: top; white-space: nowrap;}
table.tablesorter td {text-align: right;}
table.tablesorter td.left {text-align: left;}
table.tablesorter tr td:first-child {text-align: left;}
table.tablesorter th {font-weight: bold; background-color: #ddd; border-bottom: solid 1px #ccc; text-align: center;}
table.tablesorter tfoot td {font-weight: bold; text-align: right; border-top: solid 1px #ccc; background: #fff;}
 
table.info tr td {text-align: left;}

.table, .table th
{
   font-size: 8pt;
   border-style: solid;
   border-color: #ccc;
   margin:5px;
   padding:5px;
   text-align: center;
}
.table td
{
   font-size: 8pt;
   border-style: solid;
   border-color: #ccc;
   margin:5px;
   padding:5px;
   text-align: right;
}
.table td.text {text-align: left; white-space: normal;}

.table tr td:first-child {text-align: left; white-space: normal;}

#Dashboard table, #Dashboard  td,#Dashboard th
{ 
    font-size: 7pt;
    border-color: #000;
    border-style: solid;
}

#Dashboard table, .table
{
    border-width: 0 0 1px 1px;
    border-spacing: 0;
    border-collapse: collapse;
}

#Dashboard td, #Dashboard th, .table td, .table th
{
    margin: 0;
    padding: 2px;
    border-width: 1px 1px 0 0;        
}
#Dashboard th, .table th { background-color: #fafafa; }    

.table tr.odd
{
	background-color: #f0f0f0;
}
input.date { width:100px; }
/* located in demo.css and creates a little calendar icon
* instead of a text link for "Choose date"
*/
a.dp-choose-date {
    float: left;
    width: 16px;
    height: 16px;
    padding: 0;
    margin: 5px 3px 0;
    display: block;
    text-indent: -2000px;
    overflow: hidden;
    background: url(/Content/js/calendar.png) no-repeat; 
}
a.dp-choose-date.dp-disabled {
    background-position: 0 -20px;
    cursor: default;
}
/* makes the input field shorter once the date picker code
 * has run (to allow space for the calendar icon
 */
input.dp-applied {
    width: 70px;
    float: left;
}

.checked-listbox { padding: 10px; border: 1px solid #C0C0C0;overflow: auto; font-size:8pt;}

[readonly=readonly] { background-color:#C0C0C0; }

.redBG { background-color: red;}
.yellowBG { background-color: yellow;}
.greenBG { background-color: #00FF00;}

.smallTextBox { border: 1px solid gray; width: 25px; }

#ddlScenario, #MeasurementScenario { width:250px;}

/* messaging */
.genMsg {clear: both; font-weight: bold; background: #ffc url(../images/icon-info.gif) no-repeat 4px 4px; color: #000; border: solid 1px #FFD700; padding: 5px 5px 5px 25px; margin: 10px 0; line-height: 14px;}


/* CSS for checkbox lists */
fieldset.jqDForm ul.checklist {overflow: auto; list-style: none; margin: 0 0 10px 0; border: solid 1px #ccc; max-height: 92px;}
fieldset.jqDForm ul.checklist, fieldset.jqDForm ul.checklist li {padding: 0; background: #fff;}
fieldset.jqDForm ul.checklist li {padding: 0; border-bottom: solid 1px #ddd;}
fieldset.jqDForm ul.checklist label { display: block; padding: 2px 2px 2px 25px; text-indent: -25px; font-weight: normal; margin: 0; font-size: 11px;}
fieldset.jqDForm ul.checklist label:hover, .checklist label.hover { background: #eee;}
fieldset.jqDForm ul.checklist input {display: inline; background: transparent; color: #000; width: auto; vertical-align: middle; margin: 3px 3px 3px 10px;}
fieldset.jqDForm ul.checklist input:focus {background: #ffc;}
fieldset.jqDForm ul.checklist li.groupHdr {background: #ddd; font-weight: bold;padding: 0 0 0 10px; line-height: 1.75em; vertical-align: middle; }

a.emulLaunch {display: block; width: 16px; height: 16px; margin: auto; background: url(../images/icon-emul.gif) no-repeat 0 0;}

.tooltip
{
  font-size: 100%;
  position: relative;
  cursor: help;
  display: inline-block;
  color: #000;
padding-right: 12px; 
background: transparent url('icon-question.png') no-repeat 100% 10%;
}

.tooltip span
{
  visibility: hidden;
  position: absolute; 
  bottom: 30px;
  left: 50%;
  z-index: 999;
/*  width: 230px;*/
  margin-left: -127px;
  padding: 5px 10px;
  border: 2px solid #ccc;
/*  opacity: .9;*/
background-color: #555;
border-color: #666;
  -moz-border-radius: 4px;
  border-radius: 4px;  
  text-decoration: none;
color: #FFFFFF;
font-weight: normal;

}

.tooltip:hover
{
  border: 0; /* IE6 fix */
  text-decoration: none;
  color: #f37608;
}

.tooltip:hover span
{
  visibility: visible;
}

.tooltip span:before,
.tooltip span:after
{
  content: "";
  position: absolute;
  z-index: 1000;
  bottom: -7px;
  left: 50%;
  margin-left: -8px;  
  border-top: 8px solid #ddd;
  border-top-color: #555;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;        
  border-bottom: 0;  
}

.tooltip span:before
{
    border-top-color: #555;
  bottom: -8px;
}