/* // Common HTML Elements// */

* { margin: 0; padding: 0; }

body {
	margin-left: 0px;
	margin-top: 0px;
	background-image: url();
	margin-right: 0px;
	margin-bottom: 0px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	color: #333333;
}


p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #333333;
	padding-left: 0px;
	padding-right: 0px;
}

hr {
 	color: #B8DDF0;
	height: 1px;
}

td {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #333333;
}

.bold {
	font-weight: bold;
}

.italic {
	font-style: italic;
}

.menuLi {
	line-height:0px ;
}



#outer_wrapper {
/* because "min-width" is not supported by IE, these pages use a script from PVII */
min-width:740px;
/* this is to "minimize" an IE bug related to background painting, but because it creates a gap below the footer, the same declaration is also added to #footer */
width:100%;
/* faux-column technique, this is the left one */
background:#fff url(/images/left.gif) repeat-y left;
margin-top: 0;
margin-left: 0;
}
#wrapper {
/* faux-column technique, this is the right one */
background:url(/images/right.gif) repeat-y right;
height: 100%;
}
#header {
background:#ffffff;
/* this is to "give layout" to the element and fix some peek-a-boo bug in  IE (v6 sp2) */
width:100%;
height: 120;
/* the above declaration creates an horizontal scroll bar in IE, this is to get rid of it */
background-image:url(/images/banner-bg.gif);
background-repeat: repeat-x;
margin-bottom:0;
}

#insideHeader {
	background-image:url(/images/top-banner-right.gif);
	background-position: 100% 0%;
	background-repeat: no-repeat;
	margin-top: 0px;
	margin-right: 0;
	height: 120;
	width: 100%;
}



.left {
	float: left;
}

.right {
	float: right;
}

.center {
	folat: center;
}
.noPad {
	padding: 0px;
}


.leftMenu {
width:150px;
font-size:15px;
font:Geneva, Arial, Helvetica, sans-serif;
color: black;
border-right:solid #FFCC7F 1px; 
height: 400px;
display:in-line;
vertical-align: top;
}

#nav{
font-family: Arial, Helvetica, sans-serif;
font-weight:
margin-top: 0px;
margin-right:0px;
padding-top: 20px;
width:150px;
background-color:#FFFFFF;

}

#nav a {	
	display: block;
	font-size: 11px;
	text-decoration:none;
	color: #000;
	padding-left: 4px;
  	line-height: 22px;
	vertical-align: middle;	
	background: url("/images/sidenav-dotline.png") left bottom repeat-x;
	list-style: none;
	list-style-position:outside;
}

#nav a:hover {
	color: #000;
	background: #FF9933 url("/images/sidenav-dotline.png") left bottom repeat-x;
	text-decoration: none;
	
}
#nav a.selected {
	color: #000;
	background: url("/images/sidenav-dotline.png") left bottom repeat-x;
	text-decoration: none;
	
}

#underNav {
padding-left: 0px;
height:356px;
width:150px;
background-image:url(/images/undernav.jpg); 
background-repeat:no-repeat;
background-position: top;
margin-left:0;

}


.main {
/* the width from #left (150px) + the negative margin from #container (200px) */
padding-top: 1em;
padding-left: 0.9em;
font-size: 0.78em;
border-top:thin #CCCCCC;
border-right:solid #FFCC7F  1px;
padding-right:10px;
vertical-align: top;
text-align: left;
width: 100%;
}

#mainWrapper {
	width: 100%;
}

.main p {
	width: 100%;
	text-align:left;	
	clear:both;
	margin-bottom: 1.5em;
}

.main p .left {
	width: 40%;
	display:inline
}

.main p .right {
	width: 60%;   
	text-align:left;
	vertical-align: middle;
	margin-left: 1em;
}
.main ul {
	margin-left: 0em;
	list-style: none;
}

.main li {
	margin-left: 5em;
	line-height: 1em;
}

.wbProjection {
	border-bottom: 1px dashed #cccccc;
	margin-bottom: 2em;
	color: #666666;
	width: 100%;
}

.wbProjection ul {
	margin-left: 1 px;
	list-style: none;
	list-style: outside;
}
.wbProjection li {
	list-style: url(/images/icons/small-arrow.gif);	
	margin-left:1em;
	margin-bottom:0.5em;
	font-weight:bold;
}


.wbProjection h1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.2em;
	color: #09407C;
	margin-bottom: 0.3em;
}

.wbProjection h2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.0em;
	color: #000000;
	text-decoration: underline;
	margin-bottom: 1em;
}

.wbProjection h3 {
	margin-bottom: 5px;
	color: #666666;
}

.wbProjection #subHeading {
	margin-bottom: 0.3em;
}

.wbProjection #topicInfo {
	margin-bottom: 1.0em;
}

.wbProjection #timestamp {
	display: block;
	margin-bottom: 0.5em;
}

.wbProjection #author {
	display: block;
}
.indent {
	margin-left: 2em;
}



.wbSearch ul {
	margin-left: 0px;

}
.wbSearch li {
	list-style: url(/images/icons/small-arrow.gif);	
	margin-left: 0px;
}


.wbSearch h1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.2em;
	color: #09407C;
	margin-bottom: 0.3em;
}

.wbSearch h2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.0em;
	color: #000000;
	text-decoration: underline;
	margin-bottom: 1em;
}

.wbSearch h3 {
	margin-bottom: 5px;
	color: #666666;
}

.wbSearch #timestamp {
	margin-bottom: 0.2em;
}

.detailTable {
	width: 100%;
}

.cpTitleColumn ul{
	margin-left: 0.5em; margin-bottom:0px;
	font: bold 0.9em Arial, Helvetica, sans-serif;	
	border: none;
	padding-bottom: 0px;

}

.cpTitleColumn li{
	font-weight: bold;
	margin-left: 2em;
	list-style: url(/images/icons/small-arrow.gif);
}

.main table {
	width: 80%;
}


.main td {
	padding-left: 0.5em;
}

.main #heading {
	background: #FFF8C6;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
}


.right  {
	font-size:14px;
	font:Geneva, Arial, Helvetica, sans-serif;
	color: black;
	border-right:solid #FFCC7F 1px; 
	height: 300px;
	display:in-line;
	vertical-align: top;
	width: 200px;
}

.right ul {
	margin-top: 1em;
	list-style: none;
	list-style: outside;
	width: 200px;	
}

.right li {
	margin-left: 2em;
	list-style: url(/images/icons/small-arrow.gif);	
}

/* // fonts// */

b  {  font-weight: bold; color: #000000;}

a:link    {color: #666666; font-size:13px }
a:visited {color: #666666; font-size:13px }
a:hover   {color: orange; }
a:active  {color: 666666; }

#topMenu  {	
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: bold;
	text-decoration:none;
}
	


h1 {  font-weight: bold; color: #333333; margin: 0px; font-size: 0.9em; font-family: Arial, Helvetica, sans-serif;}
h2 {  font-weight: bold; color: #09407C; margin: 0px; font-size: 1.0em; margin-bottom:0px; font-family:Arial, Helvetica, sans-serif} 
h3 {  font-weight: bold; color: black; margin: 0px; font-size: 1.0em; border: 1px none #0185CA; margin-top:0px; font-family:Arial, Helvetica, sans-serif}
h4 {  font-weight: bold; color: black; margin: 0px; font-size: 1.2em; border: 1px none #0185CA; margin-top:0px; font-family:Arial, Helvetica, sans-serif}
h5 {  font-weight: lighter;	color: black; margin: 0px; font-size: 0.9em; border: 1px none #0185CA; margin-top:0px; font-family:Arial, Helvetica, sans-serif}
h7 {  font-weight: bold;color: orange; margin: 0px; font-size: 1.1em; border: 1px none #0185CA; margin-top:0px; font-family:Arial, Helvetica, sans-serif}


.smallText{
	margin-top:2px;	
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:9px;
	font-weight:bold;
	color: #666666;
}
.smallRedText {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color:#990000;
	font-weight:normal;	
}

.formTitleCell {
	width: 150px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #333333;
	font-weight: bold;
}

/* // Table Classes // */
.formTable {
	width: 100%;
	font-size: 10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}


/* Table Classes */
.adminTableWrapper {
	margin-bottom: 1em;
}
#adminTable{
	width: 98%;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 90%;
	padding:0;
	border-right: 1px #333333 solid;
	border-bottom: 3px #333333 solid;
	margin-left: 0.4em; 
	margin-right: 0.4em; 
	margin-top: 0.4em; 
}

#adminTable th{
	background: url(/images/background_table.jpg);
	border-bottom: 1px #666666 solid;
	border-right: 1px #CCCCCC solid;
	color: #666666;
	text-align: left;
	padding-left: 0.4em;
	height: 20px;
	vertical-align: middle;
}

#adminTable caption {
	text-align: left;
	font: bold;
	color: #FF6600;
}

#adminTable a {text-decoration:none;}
#adminTable a:link {text-decoration:none;}
#adminTable a:visited {text-decoration:none;}
#adminTable a:hover {text-decoration:none; color: #FF6600;}
#adminTable a:action {text-decoration:none; color: #FF6600;}

#adminTable .titleColumn {
 width: 50%;
}

#adminTable .dateColumn {
	width: 11%;
}

#adminTable .actionColumn {
	width: 10%;
}

#adminTable .pageColumn {
	width: 30%;
}

#adminTable .cpTitleColumn {
	width: 50%;
}

#adminTable .cpActionColumn {
	width: 50%;
}

#adminTable td {	
	border-right: 1px #CCCCCC solid;
	padding-left: 0.7em;
	padding-left: 0.4em;
	height:20px;
}

#adminTable td p {
	margin: 0px;
}

table.adminMenu {
	margin-top: 0px;
	margin-bottom: 1em;
}


.pageHeading {	
	width:100%; 	
	height:23px;
	margin-bottom: 0.5em;
}

.border {
	border-bottom:1px solid #cccccc;
}

.pageHeadingCell {
	background: url(/images/page_heading_bg.gif) repeat-x left top; 
	vertical-align: middle;
	padding-bottom: 0px;
	height: 23px;
}

.PageHeadingImageCell {
	text-align:left; 
	height:23; 
	width:39; 
	margin-left:0; 
	padding-left:0;
	padding-bottom: 0px;
}

#adminMenuItems {
	margin-top: 0px;
	text-align:right; 
	vertical-align: bottom; 
	width:100%;
}


	

/* Layout the forms */
form.layout {
	width:100%;
	margin-top:1em;
	clear: both;
}

form.layout p { 
	text-align:left;	
	clear:both;
	margin-bottom: 1.5em;
	margin-left: 0.5em;
}

form.layout div{
	padding: 0.2em;
}

form.layout p .label {		
	float: left;
	text-align:left;
	margin-right: 0em;
	width: 15%;
	display:inline
}

form.layout p .mandatory {
	font-size: 0.8em;
	color:#990000;
	
}

.warning {
	font-size: 0.8em;
	color:#990000;
	
}


form.layout p .input{
	width: 100%;   
	text-align:left;
	vertical-align: middle;
	margin-left: 2.5em;
}

form.layout .field {
	border:  1px solid #251053;
	font: Verdana, Arial, Helvetica, sans-serif;	
	background:url(/images/background_action.gif);	
	width: 20em;}

form.layout p .input textarea { 
	border:  1px solid #251053;
	font: Arial, Helvetica, sans-serif;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding-left: 0px;
	padding-right: 0px;
	background: url(/images/gradient_yellow.gif);
	background-repeat:repeat-x;
	background-color:#FFFFFF;
	width: 78%;
}


fieldset {
	width: 100%;
	border: solid 1px #cccccc;
	margin-right: 20px;
	clip: rect(auto,auto,0px,auto);
}

#submitButtonWrapper {
	width: 100%;
	text-align: center;
	font-size: 100%
}

.submitButton { 
	border-width:1px;
	border-style:solid;	
	padding:.15em .25em;
	font-size:94%;
	font-weight:bold;
	vertical-align:middle;
	border-color:#ddd #aaa #aaa #ddd;
	color:#333;
	background-image:url(/images/background_button.gif)
}

legend {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: bold;
	color:#993300;
}

/* // Form Classes // */

.field {
	border:  1px solid #251053;
	font: Verdana, Arial, Helvetica, sans-serif;
	padding-left: 4px;
	padding-right: 0px;
	background:url(/images/background_action.gif);
	margin-right: 20px;
}

.submitButton { 
	border-width:1px;
	border-style:solid;	
	padding:.15em .25em;
	font-size:94%;
	font-weight:bold;
	vertical-align:middle;
	border-color:#ddd #aaa #aaa #ddd;
	color:#333;
	background-image:url(/images/background_button.gif)
}





#quickLink {
float:none;
display:inline;
}


.fullWidth {
	width: 60%;
}

.normalWidth {
	width: 55%;
}

.adminNormalWidth {
	width: 60%;
}

.adminTableLayout {
border: 1px solid #ffcc00; 
padding-left: 4px;
}

/* good to know: if #sidebar is to be shorter than #, then there is no need for this rule */
#sidebar {
/* this is to keep the content of #sidebar to the right of # even if the content of " is shorter */
/*padding-left:100%;*/
/* this is to "bring back" the #sidebar that has been moved out of the viewport because of the padding value */
/*margin-left:-260px;
margin-top:-25px;*/

width: 15%;
float: left;
margin-left: 20px;
list-style:inside;
background-image:url(/images/heading.jpg);
background-repeat:no-repeat;
margin-top: 10px;
}

#sidebar p {
/* this is to make sure IE (v6 sp2) *displays* this element (same problem as #header, but using a different fix) */
position:relative;
float: left;
width: 170px;
color: #333333;
text-align: left;
 
}

#footer {
/* see #outer_wrapper  */
/* this is to clear #container */
clear:both;
border-top:1px solid #cccccc;
background-repeat: repeat;
margin-bottom:0.5em;
background: url(/images/background_table2.jpg);
border-bottom: 1px #666666 solid;
border-top: 1px #666666 solid;
border-right: 1px #CCCCCC solid;
color: white;
text-align: left;
padding-left: 0.4em;
height: 17px;
vertical-align: middle;
		
}

/* this is the class that is applied to 2 structural hacks in the markup. The first "meaningless" element is used to clear #left in NN6 and the last one is used to clear #container in NN4 */
.clearing {height:0;clear:both}

.img-shadow {
  display: block;
  position: relative;
  background-color: #fff;
  margin-left:5px;  
  padding: 4px;
  }