/* CodeCharge-Theme Cobalt with smaller fonts and additional classes */
HTML, BODY {
  width: 98%;
  font-family: Tahoma, Verdana, Arial, Helvetica;
  font-size: 11px;
}
TABLE, TH, TR, TD, UL, OL, LI, P, FONT, A, BLOCKQUOTE, LABEL 
  { font-family: Tahoma, Verdana, Arial, Helvetica; font-size: 11px; }
.CobaltPageBODY{
  width: 98%;
  color: #000000;
  font-family: Tahoma, Verdana, Arial, Helvetica;
  font-size: 11px; }
.CobaltFormHeaderFont{ color: #00659C; font-size: 16px; font-weight: normal; }
.CobaltFormHeaderFont, .CobaltFormHeaderFontInline {
  margin-top: 10px; margin-bottom: 5px;
  padding: 5px;
  color: #00659C;
  font-size: 16px; font-weight: normal;
}
.CobaltFormHeaderFontInline {
  margin-top: 0px; margin-bottom: 2px;
}
.CobaltFormTABLE{ font-family: Tahoma, Verdana, Arial, Helvetica; font-size: 11px; }
.CobaltColumnTD{ border-bottom: 1px solid #003451; border-left: 1px solid #5AA4CC; border-right: 1px solid #003451; border-top: 1px solid #5AA4CC; background-color: #00659C; color: #FFFFFF; font-weight: normal; font-size: 11px; }
.CobaltFieldCaptionTD{ border-bottom: 1px solid #003451; border-left: 1px solid #5AA4CC; border-right: 1px solid #003451; border-top: 1px solid #5AA4CC; background-color: #00659C; color: #FFFFFF; font-weight: normal; font-size: 11px; }
.CobaltDataTD{ background-color: #F2EEE0; font-size: 11px; }
.CobaltErrorDataTD{ background-color: #F2EEE0; color: #FF0000; font-size: 11px; font-weight: bold; }
.CobaltSeparatorTD{ height: 1px; background-color: #00659C; }
.CobaltAltDataTD{ background-color: #FFFFF7; font-size: 11px; }
.CobaltFooterTD { border-bottom: 1px solid #003451; border-left: 1px solid #5AA4CC; border-right: 1px solid #003451; border-top: 1px solid #5AA4CC; background-color: #00659C; color: #FFFFFF; font-weight: normal; font-size: 11px; }
a.CobaltSorterLink:link,a.CobaltSorterLink:visited{ color: #FFFFFF; text-decoration: underline; }
a.CobaltSorterLink:hover,a.CobaltSorterLink:active{ color: #FFFFFF; text-decoration: none; }
a.CobaltDataLink:link,a.CobaltDataLink:visited{ color: #000000; text-decoration: underline; }
a.CobaltDataLink:hover,a.CobaltDataLink:active{ color: #FF0000; text-decoration: none; }
a.CobaltNavigatorLink:link,a.CobaltNavigatorLink:visited{ color: #FFFFFF; text-decoration: underline; }
a.CobaltNavigatorLink:hover,a.CobaltNavigatorLink:active{ color: #40E0D0; text-decoration: none; }
.CobaltButton { border-bottom: 1px solid #003451; border-left: 1px solid #5AA4CC; border-right: 1px solid #003451; border-top: 1px solid #5AA4CC; background-color: #00659C; color: #FFFFFF; font-family: Tahoma, Arial, Verdana, Helvetica; font-size: 11px; font-weight: normal; }
.CobaltInput { border-bottom: 1px solid #00659C; border-left: 1px solid #00659C; border-right: 1px solid #00659C; border-top: 1px solid #00659C; font-family: Tahoma, Arial, Verdana, Helvetica; font-size: 11px; }
.CobaltTextarea { border-bottom: 1px solid #00659C; border-left: 1px solid #00659C; border-right: 1px solid #00659C; border-top: 1px solid #00659C; font-family: Tahoma, Arial, Verdana, Helvetica; font-size: 11px; }
.CobaltSelect { border-bottom: 1px solid #00659C; border-left: 1px solid #00659C; border-right: 1px solid #00659C; border-top: 1px solid #00659C; font-family: Tahoma, Arial, Verdana, Helvetica; font-size: 11px; }
/* Calendar */
a.today:link,a.today:visited{ color: #FF0000; font-weight: bold; text-decoration: none; }
a.today:hover,a.today:active{ color: #00659C; font-weight: bold; text-decoration: none; }
a.selectedDay:link,a.selectedDay:visited{ color: #FFFFFF; font-weight: bold; text-decoration: none; }
a.selectedDay:hover,a.selectedDay:active{ color: #FF0000; font-weight: bold; text-decoration: none; }
a.weekDay:link,a.weekDay:visited{ color: #000000; text-decoration: none; }
a.weekDay:hover,a.weekDay:active{ color: #FF0000; text-decoration: none; }
TD.selectedDay { margin: 1px; border-bottom: 1px solid #003451; border-left: 1px solid #5AA4CC; border-right: 1px solid #003451; border-top: 1px solid #5AA4CC; background-color: #00659C; color: #FFFFFF; font-weight: bold; font-size: 11px; }
TD.today { border-top: 1px solid #FF0000; border-left: 1px solid #FF0000; border-bottom: 1px solid #FF0000; border-right: 1px solid #FF0000; background-color: #FFFFF7; font-size: 11px; }
TD.workday { background-color: #FFFFF7; font-size: 11px; }
TD.weekend { background-color: #EEEADB; font-size: 11px; }
TH.calendar { margin: 1px; border-bottom: 1px solid #003451; border-left: 1px solid #5AA4CC; border-right: 1px solid #003451; border-top: 1px solid #5AA4CC; background-color: #00659C; color: #FFFFFF; font-weight: bold; font-size: 11px; }
.CalendarButtons { border-bottom: 1px solid #003451; border-left: 1px solid #5AA4CC; border-right: 1px solid #003451; border-top: 1px solid #5AA4CC; background-color: #00659C; color: #FFFFFF; font-family: Tahoma, Arial, Verdana, Helvetica; font-size: 11px; font-weight: bold; }
.CalendarControls { font-family: Arial, Tahoma, Verdana, Helvetica; font-size: 11px; }
.Table { background-color: #DEDBDE; }

/* Hag++ additional classes */
.CobaltHidden {display: none;}
.CobaltDisabled {color: #606060;} /* since V 3.1 */
.CobaltReadonly {color: #606060;} /* since V 3.5 */
.CobaltError {color: #FF0000; font-weight: bold;}
.CobaltSmallHeaderFont {
	color: #00659C;
	font-size: 14px;
	font-weight: normal;
}
.CobaltSmallColumnTD { 
  border-bottom: 1px solid #003451; border-left: 1px solid #5AA4CC; 
  border-right: 1px solid #003451; border-top: 1px solid #5AA4CC; 
  background-color: #00659C; color: #FFFFFF; 
  font-size: 11px; 
}
.CobaltHiddenDataTD {background-color: #778899; font-size: 11px;}
.CobaltActiveDataTD {background-color: #99FF99;}
.CobaltActiveNumDataTD { 
  background-color: #99FF99; 
  text-align: right;
}
.CobaltHeaderDataTD {background-color: #6699CC; color: White;}
.CobaltExt {color: #800000; font-size: 11px; }  /* V 3.5 */
.CobaltWfPkg { /* V 3.5 */
  color:#800000;background-color:#FFFF66;
  padding:2px;
  border:1px solid #800000;border-radius:5px;
}
.CobaltMarkPkg { /* V 4.5 */
  color:#800000;background-color:#FFFF66;
  padding:2px;
  border:1px solid #800000;border-radius:5px;
}
.CobaltExtDataTD {background-color: #F2EEE0; color: #800000; font-size: 11px; }
.CobaltAltExtDataTD {background-color: #FFFFF7; color: #800000; font-size: 11px; }
.CobaltNumDataTD { 
  background-color: #F2EEE0; 
  font-size: 11px;
  text-align: right;
}
.CobaltAltNumDataTD { 
  background-color: #FFFFF7; 
  font-size: 11px;
  text-align: right;
}
.CobaltSumTD {
	background-color: #6699CC; 
	font-weight: normal;
	color: White;
  text-align: right;
}
.CobaltAltSumTD {
	font-weight: normal;
	color: #F8F8F8; 
	background-color: #99CCCC;
  text-align: right;
}
.CobaltSumColTD {
	background-color: #dfeded; 
	text-align: right;
}
.CobaltAltSumColTD {
	background-color: #f2ffff;
  text-align: right;
}
.CobaltMaxSumTD {
	font-weight: normal;
	background-color: #99FF99; 
	color: #000066;
  text-align: right;
}
.CobaltInvalidSumTD {
	font-weight: normal;
	color: white;
	background-color: red;
  text-align: right;
}
.CobaltLowSumTD {
	font-weight: normal;
	background-color: #FFB8B8;
	color: #000066;
  text-align: right;
}
.CobaltConfTD {
	background-color: #FFCC99; 
	font-size: 11px; 
}
.CobaltNumConfTD { 
	background-color: #FFCC99; 
	font-size: 11px; 
  text-align: right;
}
.CobaltSumConfTD { 
	background-color: #FFBC79; 
	font-size: 11px; 
  text-align: right;
}

.CobaltPageHeaderTD {
	background-color: #000066; 
	font-weight: normal;
	color: #FFFFFF;
}
.CobaltPageLogo {border: none;}
.CobaltPageFooterTD {
	background-color: #000066; 
	color: #FFFFFF;
	text-align: left;
	vertical-align: middle;
}
.CobaltPageLoginTD {
	background-color: #000066; 
	color: #FFFFFF;
}
.CobaltMenuBar {
	width: 100%; 
	border-spacing: 2px; 
	text-align: center; 
	/* background-color: #E6EDDB; */
	background-color: #000066; 
}
.CobaltMenuTD {
	border-width: 1px; 
	border-style: solid; 
	border-color: #616387; 
	padding-left: 10px; 
	padding-right: 10px; 
	background-color: #ACCB4A; 
	background-image: url(../graphics/buttoncell.gif); 
	font-weight: normal;
}
.CobaltPageDataTD {
	background-color: #FFBC79; 
	font-size: 11px; 
	font-weight: normal;
	color: #000066;
}
.CobaltRepHeaderTD {
	background-color: #FFBC79; 
	font-size: 11px; 
	font-weight: normal;
	color: #000066;
}
.CobaltTaskHeaderTD {
	background-color: #B0C4DE;  /* #E0E0E0; */
	font-size: 11px; 
	font-weight: normal;
	color: #000066;
}
.CobaltPkgHeaderTD {
	background-color: #FFFF80; 
	font-size: 11px; 
	font-weight: normal;
	color: #000066;
}
.CobaltDataInfoTD {
	background-color: #6699CC; 
	font-weight: normal;
	color: white;
  text-align: left;
}
.CobaltExportHeaderTD {
	padding:2px;
	background-color: #FFBC79; 
	font-size: 11px; 
	font-weight: normal;
	color: #FFFFFF;
}
.CobaltExportDataTD { 
	background-color: #FAFAD2; font-size: 11px; 
}
.CobaltExportButton { 
	border-bottom: 1px solid #B8860B; border-left: 1px solid #FFFFFF; 
	border-right: 1px solid #B8860B; border-top: 1px solid #FFFFFF; 
	background-color: #FFBC79; color: #FFFFFF; 
	font-family: Tahoma, Arial, Verdana, Helvetica; 
	font-size: 11px; font-weight: normal;
}

.CobaltNumInput {
  border: 1px solid #00659C; 
  font-family: Tahoma, Arial, Verdana, Helvetica; 
  font-size: 11px;
	text-align: right;
}
.CobaltInvalidNumInput {
	background-color: red;
	color: white;
  border: 1px solid #00659C; 
  font-family: Tahoma, Arial, Verdana, Helvetica; 
  font-size: 11px;
	text-align: right;
}
.CobaltGreenNumInput {
	background-color: #99FF99;
  border: 1px solid #00659C; 
  font-family: Tahoma, Arial, Verdana, Helvetica; 
  font-size: 11px;
	text-align: right;
}
.CobaltLowNumInput {
	background-color: #FFB8B8;
  border: 1px solid #00659C;
  font-family: Tahoma, Arial, Verdana, Helvetica;
  font-size: 11px;
	text-align: right;
}
.CobaltReadonlyNumInput {
  border: 1px solid #00659C;
  font-family: Tahoma, Arial, Verdana, Helvetica;
  font-size: 11px;
	text-align: right;
  background-color:#F2EEE0;
}
.CobaltRemarkButton {
	width: 18px; 
	border: 1px solid #00659C;
  background-color: #F2EEE0; color: #00659C; 
	font-family: Tahoma, Arial, Verdana, Helvetica; 
	font-size: 11px; font-weight: normal;
}
.CobaltSumHeaderTD {
	vertical-align: top;
}
.CobaltNoscript {
	font-size: 17px; font-weight: bold;
	color: red;
}
img.CobaltMarker {
  width:16px; height:16px;
	border:0;
}
img.CobaltMiniMarker {
  width:8px; height:8px;
	border:0;
}
img.CobaltWideMarker {
  width:24px; height:16px;
	border:0;
}
img.CobaltSelectButton {
  width:16px; height:16px;
	border:1px solid #00659C;
}
img.CobaltSelectDown {
  /* width:15px; height:15px; V 4.5 -> */
  width:16px; height:16px;
	border:1px solid #00659C;
}

a.CobaltOverview, a.CobaltOverview:visited {
	font-size: 11px; font-weight: normal;
	color: #000066;
}

/* V 4.5 - header cells (should also replace CobaltFormHeaderFont used in deprecated
           HTML-font-attribute) and some other useful things */
.CobaltFormHeader {
  color: #00659C;
  font-size: 16px;
  font-weight: normal;
  text-align: left;
  padding: 3px;
}
.CobaltFormHeaderHelp {
  text-align: right;
  padding: 3px;
}
img.HmcHelpIcon {
  width:16px; height:16px;
	border:0;
  cursor:pointer;
}
img.HmcHelpExtIcon {
  width:64px; height:32px;
	border:0;
  cursor:pointer;
}
.HmcWaitCursor {
  cursor: wait;
}
/* V 3.5 - link in header-captions */
a.CobaltFormHeaderLink, a.CobaltFormHeaderLink:visited {
  color: #00659C; font-size: 16px; font-weight: normal; text-decoration: underline;
}

/* V 3.3 - common HMC-classes for table-styled submenu adapted to "Cobalt"-style */
.tbl_submenu {
  position:absolute; z-index:10;
  display:none;
  text-align: left;
  color:#000066; background-color:#fff;
  border:1px solid #000066;}
.tbl_submenu tr {
  margin:0px; padding:0;}
.tbl_submenu td {
  margin:0px; padding:1px;
  border-bottom:1px solid #E6EDDB;}
.tbl_submenu td:hover {
  color:#6699CC;
  cursor:pointer;}
.tbl_submenu tr.subcaption {
  padding:0px;
  color:white;
  background-color:#6699CC;}
.tbl_submenu tr.subseparator {
  line-height:1px;
  font-size:1px;
  height:2px;
  background-color:#000066;
  padding:0px;}
.tbl_submenu tr.submendisabled {
  padding:1px 1px 1px 1em;
  border-bottom:1px solid #E6EDDB;
  margin:0px;
  color:#C0C0C0;}
/* don't forget -> order ":link, :visited, :hover, :active, :focus" has to 
   be kept in following, otherwise it doesn't work */
.tbl_submenu tr a:link,
.tbl_submenu tr a:visited {text-decoration:none;color:#000066;}
.tbl_submenu tr a:hover {text-decoration:none;color:#6699CC;}
.tbl_submenu tr a:active {text-decoration:none;color:#000066;}
.tbl_submenu tr a:focus {text-decoration:none;color:#6699CC;}

/* V 3.4 - material groups headlines */
.CobaltMgMainTD {
  background-color: #008B8B;
	color: #FFFFFF;
	text-align: left;
	vertical-align: middle;
}
.CobaltMgSubTD {
  background-color: #20B2AA;
	color: #FFFFFF;
	text-align: left;
	vertical-align: middle;
}

/* V 3.4 - speech bubbles */
.CobaltBubble {
  position:absolute; z-index:10;
  display:none;
	border: 1px solid #616387;
	padding: 10px;
  color: #000000; /* V 3.5 - important, because the bubble gets the text-colors
    from the surrounding element and this might e.g. result in white text on white
    background */
  white-space: normal; /* V 3.5 - also important, otherwise the nowrap from surrounding
    TDs comes into the game */
	background-color: #FFFFFF;
	background-image: url(../graphics/bubble.gif);
  background-repeat:repeat-x;
	font-weight: normal;
}
.CobaltBubble td, .CobaltBubble th {
  border: none; /* V 4.2.1 - to avoid inherited border from parent-element */
  background-image: none; /* V 4.2.1 - detto */
  text-align: left;
  font-weight: normal;
}
.CobaltBubble th {
  padding-bottom: 5px;
  border-bottom: 1px solid #616387;
}

/* V 4.2 - extra classes for output-/action-/composition-data (till now
   CobaltActiveDataTD/CobaltHeaderDataTD/CobaltDataTD have been used -> layout
   of new classes is still the same, but they open the chance to "modernize"
   layout */
.CobaltOutputData {background-color: #99FF99;}
.CobaltActionData {background-color: #6699CC; color: white;}
.CobaltCompositionData{ background-color: #F2EEE0;}

/* V 4.2 - fup-related */
.CobaltFupCaptionTD{
  color: #075698;
  background-color: #F2EEE0;
  font-size: 11px;
  padding-left: 2px;
  padding-right: 2px;
  padding-top: 0px;
  padding-bottom: 0px;
}
.CobaltFupTD{
  background-color: #F2EEE0;
  color: #000000;
  font-size: 11px;
  padding-left: 2px;
  padding-right: 2px;
  padding-top: 0px;
  padding-bottom: 0px;
}

/* V 4.2 - HmcGraf-related */
.HmcCobaltCanvas {
  display: block; /* keep this for showing/hiding needed canvasses in HmcMassGraf.splitCanvas() */
  /* border: 1px solid #000066; -> V 4.3.4 -> show border not with canvas itself but with
                                   surrounding container (see below) */
}
.HmcCobaltCanvasContainer {
  border: 1px solid #000066;
}

.HmcGrafOptionTD {
  padding: 3px;
  border: 1px solid #000066;
}

.HmcGrafTooltip, .HmcGrafTooltipOutput, .HmcGrafTooltipAction, .HmcGrafTooltipComposition {
  position:absolute; z-index:10;
  display:none;
  max-width: 300px;
  font-weight: normal;
	border-left: 1px solid #000066;
  border-top: 1px solid #000066;
  border-right: 1px solid #6699CC;
  border-bottom: 1px solid #6699CC;
  border-radius: 5px;
  color: #000000; /* important, because the bubble gets the text-colors
    from the surrounding element and this might e.g. result in white text on white
    background */
  background-color: #FFFFFF;
  white-space: normal; /* also important, otherwise the nowrap from surrounding
    TDs comes into the game */
}
.HmcGrafTooltip table, .HmcGrafTooltipOutput table,
.HmcGrafTooltipAction table, .HmcGrafTooltipComposition table {
  border-spacing: 0px;
  border-collapse: collapse;
}
.HmcGrafTooltip td, .HmcGrafTooltipOutput td,
.HmcGrafTooltipAction td, .HmcGrafTooltipComposition td {
  padding: 3px;
}
.HmcGrafTooltip th, .HmcGrafTooltipOutput th,
.HmcGrafTooltipAction th, .HmcGrafTooltipComposition th {
  padding: 3px;
  text-align: left;
  font-weight: normal;
}
.HmcGrafTooltip {
  padding: 3px;
	background-image: url(../graphics/bk_tooltip.png);
  background-repeat:repeat-x;
}
.HmcGrafTooltipOutput {
  padding: 0px;
  background-image: url(../graphics/bk_output.png);
  background-repeat:repeat-x;
}
.HmcGrafTooltipOutput td {
  border-top: 1px solid #99FF99;
}
.HmcGrafTooltipOutput th {
  background-image: url(../graphics/bk_output.png);
  background-repeat:repeat-x;
}
.HmcGrafTooltipAction {
  padding: 0px;
  background-image: url(../graphics/bk_action.png);
  background-repeat:repeat-x;
}
.HmcGrafTooltipAction td {
  border-top: 1px solid #6699CC;
}
.HmcGrafTooltipAction th {
  background-image: url(../graphics/bk_action.png);
  background-repeat:repeat-x;
}
.HmcGrafTooltipComposition {
  padding: 0px;
  background-image: url(../graphics/bk_composition.png);
  background-repeat:repeat-x;
}
.HmcGrafTooltipComposition td {
  border-top: 1px solid #F2EEE0;
}
.HmcGrafTooltipComposition th {
  background-image: url(../graphics/bk_composition.png);
  background-repeat:repeat-x;
}

/* V 4.5 - HmcHelp-related */
.HmcHelpDivText, .HmcHelpDivCaption {
  font-size: 13px;
  line-height: 1.5;
  padding: 5px;
}
.HmcHelpDivCaption {
  font-weight: bold;
  color: #3B5998;
}

/* V 4.5 - HmcComplete related */
.HmcComplete-dropdown-input {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}
.HmcComplete-dropdown-btn {
	vertical-align: top;
	height: 20px;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

.HmcComplete-caret {
	display: inline-block;
	width: 0;
	height: 0;
	margin-left: 2px;
	vertical-align: middle;
	border-top: 4px dashed;
	border-top: 4px solid;
	border-right: 4px solid transparent;
	border-left: 4px solid transparent;
}