/* CSS Overrides for Standard Help CSS */

#helpwrapper {
    width: 721px;
}

#helpwrapper body {
    margin: 0;
}

/*
  BEGIN HEADING STYLES
*/

#helpwrapper h1, .helpHead1 {
	color: #000000;
	background-color: transparent;
	padding: 0.7em 0px;
}

#helpwrapper .subHead {
    background-color: #A9A19D;
    border:0 none;
}

#helpwrapper .titlecodeph {
	color:#000000;
}

/*
  BEGIN OL / UL STYLES
  
  Here's where things get messy. Text within <li> tend to become messy, due to the fact that <li> fonts
  are sized smaller. <li>s are typically not within <div>, so they need a seperate percentage. As such, items within <li>s
  need to be accounted for with a larger font. This is why many items such as featureTable or <dl> have a seperate <li> definition
  
*/

/* nothing is overriden for ol ul li etc */

legend {
    padding: 0 2px;
}

/*
  BEGIN PERMTABLE STYLES
*/
#helpwrapper .permTable {
    background-color:transparent;
}

#helpwrapper .permTableHeader {
    background-color: #a9a19d;
    color: #ffffff;
    padding: 0.2em 0;
    border: medium none;
}

#helpwrapper .permRowLeft {
    border-bottom:1px solid #a9a19d;
    border-right:0 solid #a9a19d;
    padding: 0.25em .7em 0;
    background-color:#f5f5f5;
    min-width: 50%;
    text-align:left;
}

#helpwrapper .permRowRight {
    border-bottom:1px solid #a9a19d;
    background-color:#f5f5f5;
    min-width: 50%;
    text-align:left;
}
/*
  BEGIN FEATURETABLE STYLES
  
  Every table that is not a permTable or editionTable is considered a featureTable.
  
*/

#helpwrapper .featureTableHeader {
    background-color: #a9a19d;
    border:medium none;
    color: #ffffff;
}

#helpwrapper .featureTable tbody {
    background-color:#f5f5f5;
}

#helpwrapper .featureTable td {
    border-bottom: 1px solid #a9a19d;
    padding: 4px;
}

/*
  BEGIN ICON STYLES
*/


img.icon_24x24 {
    clip: rect(0px 24px 24px 0px);
    position:absolute;
}

img.icon_16x16 {
    clip: rect(0px 16px 16px 0px);
    position:absolute;
}

img.icon_32x32 {
    clip: rect(0px 32px 32px 0px);
    position:absolute;
}

img.icon_20x20 {
    clip: rect(0px 20px 20px 0px);
    position:absolute;
}

img.icon_20x15 {
    clip: rect(0px 20px 15px 0px);
    position:absolute;
}

img.icon_20x16 {
    clip: rect(0px 20px 16px 0px);
    position:absolute;
}

img.icon_24x18 {
   clip: rect(0px 24px 18px 0px);
    position:absolute;
}

/* Other ExtJS overrides */

.helpPageFooter{display: none;}

.alignright {
    float: right;
    display: inline; 
    text-align: right;
    margin-right:20px;
}

.alignleft {
    float: left;
    display: inline; 
    text-align: right;
    margin-right:20px;
}

#helpwrapper a {
color:#006699;
text-decoration:underline;
}

.relinfo {
    font-size: 90%;
    color: #51638A;
    font-weight: bold;
    padding-top: 1.5em;
}

.relinfo a {
    color:#006699;
    font-weight:normal;
    text-decoration:underline;
}

.ratingFeedbackDiv a{
    color:#006699
}

/* added pre, fieldName, var, dfn selectors to override
	 styles declared by extjs */
#helpwrapper pre {
    font-family: 'Courier New', Courier, monospace;
}

#helpwrapper .fieldName > span {
    font-family: Courier New, Courier, monospace;
    font-size: 110%;
}

#helpwrapper strong{
    font-style:normal;
    font-weight:bold;
}

#helpwrapper strong var{
    font-style: italic;
    font-weight: bold;
}

#helpwrapper pre.codeblock var {
    font-style: italic;
    font-family: 'Courier New', Courier, monospace;
}

#helpwrapper var, dfn {
    font-style: italic;
}

#helpwrapper table{
    width: 100%;
}

.relinfo div{
    padding:0px;
}

.relinfo a {
    font-weight: normal;
}

#sr_bg .rightLinksWrapper {
     width: 130px;
     float: right;
     margin-top: -15px;
     clear: both;
}

#sr_bg .rightLinks li {
   padding:2px;
   font-weight: bold;
   list-style-type:none;
   font-size:75%;

}

#sr_bg .mainContent {
	width:auto;
	padding-top:10px;
}

#sr_bg > p > span > table {
	margin-left: 10px;
	border-style: none;
}

#helpwrapper a span[class=fieldName] {
	font-family:Arial,Helvetica,Geneva,sans-serif;
	font-size:100%;
	color:#006699;
}

#helpwrapper pre {
	white-space: pre; /* CSS2 */	
	white-space: -moz-pre-wrap important!; /* Mozilla */
	white-space: -hp-pre-wrap; /* HP printers */
	white-space: -o-pre-wrap; /* Opera 7 */
	white-space: -pre-wrap; /* Opera 4-6 */
	white-space: pre-wrap; /* CSS 2.1 */
	word-wrap: break-word; /* IE */
	word-break: keep-all;
	width:99%;
	overflow: auto;
}

#helpwrapper div .dd {
    margin:10px;
}

.x-tree-node .x-tree-selected {
    background-color:#ccc;
}

.x-tree-selected{
    background-color:#ccc;
    font-weight:bold;
}

#helpwrapper .note {
    padding: 4px 8px 9px 8px;
}

#helpwrapper div.p div.note {
    font-size: 100%;
}

#helpwrapper ul, #helpwrapper ol {
	margin:0.5em 0 0.5em 1.5em;
}

/* commented for now - need to design proper css to override notes 

.note {
    border-color:#CCCCCC;
    border-style:solid;
    border-width:0;
    width:auto;
    margin:auto;
    background:#F3F3F3 url(/resource/HTStaticRes/imagese/images/note_top.gif) scroll no-repeat top left;
}

.note .noteBody {
    background:#F3F3F3 url(/resource/HTStaticRes/imagese/images/note_bottom.gif) scroll no-repeat bottom left;
    border-left:0px solid #CCCCCC;
    border-right:0px solid #CCCCCC;
    margin:0;
    min-height:60px;
    padding:10px;
}
*/

.helpdocimages {
   max-width:730px;
}

input {
   margin:0;
}