* {
	font-family: Arial, helvetica, sans;
	font-size: 10pt;
	text-align: left;
	outline-style: none;
	outline-width: 0;
	margin: 0;
	padding: 0;
}

html, body {
	font-family: Arial, helvetica, sans, sans-serif, georgia, times, "times new roman", serif;
	font-size: 10pt;
	text-align: center;
	color: #000000;
	height: 100%;
	min-height: 100%;  
	position: absolute;  
	width: 100%;
	outline-style: none;
	outline-width: 0;
	margin: 0;
	padding: 0;
	background-color: #ffffff;
}

table thead td {
	font-weight: bold;
}
#container
{
	margin: 0;
	background-color: #FFF;
	background-image:  url(images/background.jpg);
	background-repeat: repeat-y;
	min-height:100%;
	height:100%;
	position:relative;
}

* html #container
{
	height: 100%;
	height: auto !important;	
}

#banner
{
	background: #ffffff ;
	height:52px;
	padding:5px 0 5px 5px;
}

#banner h1
{
	margin: 0;
	padding: .5em;
}

#info {
	height:50px;

}

#user {
	width:25%;
	margin:0;
	text-align:right;
	font-style:italic;
	padding-right:4px;
	font-size:10pt;
	position:absolute;
	right:10px;
	top:40px;
}

#nav
{
	float:left;
	width:74%;
	margin:0;
	font-size:10pt;
}

#search_container
{
	top:68px;
	position:absolute;
	right:10px;
	width:35%;
}

#search_container form
{
	float:right;
}

#content
{
	/*position:relative;*/
	/*height:100%;*/
	/*border:1px solid;*/
	/*padding-top: 1em;*/
	/*margin: 0 1em 0 1em;	*/
	margin: 0 0 20px 0;
}

#content h2 { margin-top: 0; }

#Panel {
	position:relative;
	height:800px;
	margin: 0 1em 0 1em;	
	padding-top: 1em;
}

#footer {
	position:absolute;
	clear: both;
  width: 100%;
  height: 28px;
  bottom:0;
	background-color: #ced4ab;
	text-align: center;
	border-top: 1px solid #f5f5f5;
	font-size:10pt;
}

.clsFooter {
	padding:5px;
}

#paging {
	position:relative;
	width:100%;
	height:20px;
	clear:both;
}

#viewPaging {
	padding:0 10px 0 0;
	margin-top:3px;
	float:right;
	height:20px;
}

/* ======================== */
/* MISC */
/* ======================== */
.clsColorLegend {
	position:relative;
	margin-top:5px;
	z-index:1;
}

.clsTitle {
	font-style:italic;
	font-weight:bold;
	color:#393a31;
	font-size:12pt;
}

.clsLink {
	text-decoration:none;
	font-weight:bold;
	color:#8b0000;
}

button.prompt {font-family:arial;font-size:10pt;font-weight:bold; color:black;}
td.titlebar { background-color:#708090; color:#000000;; font-weight:bold;font-family:arial; font-size:10pt;}
table.bar {	border-top:1px outset #8d9aa7; border-left:1px outset #8d9aa7;}
table.promptbox {border-left:1px solid #f3f6f9; background-color:#ecf0f4; color:black;padding-left:2px;padding-right:2px;padding-bottom:2px;font-family:arial; font-size:9pt;}
table.promptbox td {text-indent:4px;height:20px;}
input.promptbox {border:1px solid #708090;width:90%;font-family:arial;font-size:9pt; color:black; }
.clsPrompt {
}
a.keyLink {
	text-decoration:none;
	display:none;
	visibility:hidden;
}

.dragged { cursor:move;}

/* ======================== */
/* FORM */
/* ======================== */
.clsNormal {
	font-family:Arial, Helvetica, sans-serif;
	font-size: 10pt;
	padding:3px;
	margin-top:3px;
	position:absolute;
}

.clsFieldset {
	border:1px dashed #cbc9c9;
	padding:5px;
}

.clsLegend {
	font-family:Arial, Helvetica, sans-serif;
	font-size: 10pt;
	letter-spacing: -1px;
	font-weight: bold;
	line-height: 1.1;
	color:#fff;
	background: #9ac5dc;
	border: 1px solid #0094de;
	padding: 2px 6px;
}

.clsLabel {
	width:200px;
	height:19px;
	margin-top:2px;
	margin-right:2px;
	padding-bottom:5px;
	padding-left:3px;
	padding-right:3px;
	background-color:#ecf1e6;
	color:#79641a;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 10pt;
	letter-spacing: -1px;
	font-weight: bold;
	clear:left;
	display:block;
	text-align:right;
}

.clsText {
	font:normal 10pt Arial;
	margin-top:2px;
	padding:3px;
	border:1px solid #708090;
}

.clsSelectText {
	font:normal 10pt Arial;
	margin-top:2px;
	padding:2px;
	border:1px solid #708090;
}

.clsTextNone
{
	font-family:arial,san-serif;
	font-size:9pt;
	border:0px;
	background-color:#708090;
}

.clsTextNumber
{
	width:100px;
	font:normal 10pt Arial;
	margin-top:2px;
	padding:3px;
	border:1px solid #708090;
	text-align:right;
}

.clsTextNone {
	width:100px;
	font-family:arial;
	font-size:9pt;
	color:#000000;
	background:#ffffff;
	margin-top:2px;
	padding:3px;
}

.divInput {
	width:500px;
	float:left;
	display:block;
	margin:0;
	padding:0;
	clear:right;
}

.clsButtonOld {
	font-size:9pt;
	font-weight:bold;
	font-family: arial,sans-serif, georgia, times, "times new roman", serif;	
}

.checklist {
  border: 1px solid #708090;
  list-style: none;
  height: auto;
  overflow: auto;
  width:400px;
  margin-bottom:0;
}

.checklist, .checklist li {
	margin-top: 2px;
	padding: 0;
}

.checklist span {
  display: block;
  padding-left: 25px;
  text-indent: -25px;
}

.checklist span:hover {
	background: #E5E5E5;
	color: #000000;
}

.checkListNone {
  border: 1px solid #cccccc;
  list-style: decimal;
  height: auto;
  overflow: auto;
  width:400px;
  margin-bottom:0;
  margin-top:0;
  padding-top:3px;
  padding-bottom:3px;
}

/* ===========*/
.flsDetail {
	position:relative;
	border:1px solid #000000;
	background:#C6D0D2;
	margin:20px 0 10px 0;
	padding:0 8px 8px 8px;

}

.lgnDetail {
	font-size:9pt;
	font-weight:bold;
	color:#A52A2A;
	background:#C6D0D2;
	text-transform:uppercase;	
	padding:4px 6px 0 6px;
	position:relative;
	margin-bottom:18px;
  top: -1.6em;
  left: .5em;
  margin-left:0;
	border:1px solid #000;
	border-bottom:0;
}

/* FOR IE6 */
* html fieldset.flsDetail {
	margin:30px 0 30px 0;
}

* html legend.lgnDetail {
	margin-bottom:0px;	
}
/* FOR IE7 */
*+html fieldset.flsDetail {
	position:relative;
}

*+html legend.lngDetail {
	position:absolute;
}

/* ======================== */
/* TABLE */
/* ======================== */
.clsTableList {
	border:1px solid #2C6CBA/*#c89a0d*/;
}

.clsHeader {
	background:#85B5D9/*#e0c266*/;
	color:#000000;
	font-weight:bold;
	font-size:9pt;
}

.clsHeader th {
	border-left:1px solid #3F81AF/*#f1dfaa*/;
	border-top:1px solid #3F81AF/*#f1dfaa*/;
	border-right:1px solid #7CA4C1/*#d8ae30*/;
	border-bottom:1px solid #7CA4C1/*#d8ae30*/;
}

.clsSubHeader {
	background:#EFE8D1;
	color:#000000;
	font-weight:bold;
	font-size:9pt;
}

.clsRecord {
	background:dbf0fd;
	color:#000000;
	font-size:9pt;
}

.clsRecord td {
	border-right:1px solid #d5d5d5;
	border-left:1px solid #e4e2e2;
	border-bottom:1px solid #bdbdbd;
}

.clsGroup
{
	font-family:arial,san-serif;
	font-size:9pt;
	font-weight:bold;
	font-style:italic;
	background-color:#EFE0B3;
	text-indent:2px;
	color:#6E6F30;
}

.clsGroup td {
	border-bottom:1px solid #DFD1A7;
}

table.clsTableForm td.lbl {
	border:0;
	vertical-align:top;
}


/* SCOLL TABLE */

div.scrollContainer
{
	width:100%;
	height:100%;
	margin: 0 auto;

}

html>body div.scrollContainer
{
	overflow:visible;
}

div.scrollContainer table
{
	width: 100%;		/*100% of container produces horiz. scroll in Mozilla*/
	border:1px solid #8c8c8c;
	/*background-color: #f7f7f7;*/
}

div.scrollContainer table>tbody	{  /* child selector syntax which IE6 and older do not support*/
	overflow: auto;
	height: 270px;
	overflow-x: hidden;
	}

div.scrollContainer thead tr	{
	position:relative;
	/*top: expression(offsetParent.scrollTop);*/ /*IE5+ only*/
	}

div.scrollContainer thead td, thead th
{
}

div.scrollContainer td	{
padding-right: 2px;
height:20px;
	}

div.scrollContainer table.lastTD {
	height:auto
}

div.scrollContainer table td:last-child {padding-right: 20px;} /*prevent Mozilla scrollbar from hiding cell content*/

/*============================*/
/* CSS TOOLTIPS */
/*============================*/
a.tooltips{
  position:relative; /*this is the key*/
  z-index:24;
	font-weight:bold;
	color:#8b0000;
  text-decoration:none
}

a.tooltips:hover{z-index:25; color:#CF4949}

a.tooltips span{display: none}

a.tooltips:hover span{ /*the span will display just on :hover state*/
  display:block;
  position:absolute;
  padding:5px;
  top:1em;
  left:3.5em;
  width:280px;
  border:1px solid #708090;
  background-color:#B1BCC8;
  color:#000;
}

/*==================*/
/* SEXY BUTTON */
/*==================*/
.clear { /* generic container (i.e. div) for floating buttons */
    overflow: hidden;
    width: 100%;
}

a.button {
    background: transparent url('../images/bg_button_a.gif') no-repeat scroll top right;
    color: #444;
    display: block;
    float: left;
    font: bold 12px arial, sans-serif;
    height: 24px;
    margin-right: 6px;
    padding-right: 18px; /* sliding doors padding */
    text-decoration: none;
    outline: none; /* hide dotted outline in Firefox */    
}

a.button span {
    background: transparent url('../images/bg_button_span.gif') no-repeat;
    display: block;
    line-height: 14px;
    padding: 5px 0 3px 18px; 
} 

a.button:active {
    background-position: bottom right;
    color: #000;
    outline: none; /* hide dotted outline in Firefox */
}

a.button:active span {
    background-position: bottom left;
    padding: 5px 0 2px 18px; /* push text down 1px */
    outline: none; /* hide dotted outline in Firefox */    
}

a.button span > img {
	border:0;
    vertical-align:bottom;	
    outline: none; /* hide dotted outline in Firefox */    
}   

a.button:active span > img {
	border:0;
  vertical-align:bottom;	
  padding-top:1px;
}    


 
/*-----------------*/


    
/* Start custom button CSS here
---------------------------------------- */
.clsButton {
		display:inline-block;
		background:none;
		margin:0;
		padding:5px 0 4px;
		border-width:0;
		overflow:visible;
		font:100%/1.2 arial,verdana,sans-serif, georgia, times, "times new roman", serif;
		font-weight:bold;
		text-decoration:none;
		color:#333;
		outline:none !important;
  }
* html button.clsButton {
  padding-bottom:3px;
  }
/* Immediately below is a temporary hack to serve the 
   following margin values only to Gecko browsers
   Gecko browsers add an extra 3px of left/right 
   padding to button elements which can't be overriden.
   Thus, we use -3px of left/right margin to overcome this. */
html:not([lang*=""]) button.clsButton {
  margin:0 -5px;
  }
.clsButton span {
  background:#ddd url(../image/bg-button.gif) repeat-x 0 0;
  margin:0;
  padding:5px 0 4px;
  border-left:1px solid #bbb;
  border-right:1px solid #aaa;
	outline:none;   
  }
* html .clsButton span {
  padding-top:0;
  }
.clsButton span span {
  position:relative;
  padding:5px .6em 4px;
  border-width:0;
  border-top:1px solid #bbb;
  border-bottom:1px solid #aaa;  
  }

/* pill classes only needed if using pill style buttons ( LEFT | CENTER | RIGHT ) */
button.pill-l span {
  border-right-width:0;
  }
button.pill-l span span {
  border-right:1px solid #bbb;
  }
button.pill-c span {
  border-right-style:none;
  border-left-color:#fff;
  }
button.pill-c span span {
  border-right:1px solid #bbb;
  }
button.pill-r span {
  border-left-color:#fff;
  }

/* only needed if implementing separate hover/focus/active state for buttons */
.clsButton:hover span, .clsButton:hover span span, .clsButton:focus span, .clsButton:focus span span {
  cursor:pointer; /* important for any clickable/pressable element */
  border-color:#0094de  !important;
  color:#000;

  }
.clsButton:active span {
  background-position:0 -392px;
  outline:none;
  }
button.clsButton::-moz-focus-inner { border-color: transparent; }  
.clsButton:focus, .btn:active {

  outline:none; /* doesn't seem to be respected for <button>, only <a> */
  }
.clsButton span > img {
	vertical-align:bottom;	
  }          
.clsButton:active span > img {
	vertical-align:bottom;	
  }      

/* use if one button should be the 'primary' button */
.primary {
  font-weight:bold;
  color:#000;
  }

/*==================*/
/* PAGINATION */
/*==================*/

ul{
border:0; margin:0; padding:0;
}

#pagination-flickr li{
	border:0; margin:0; padding:0;
	list-style:none;
	float:left;
}
#pagination-flickr a{
	border:solid 1px #DDDDDD;
	margin-right:2px;
}
#pagination-flickr .previous-off,
#pagination-flickr .next-off {
	color:#666666;
	display:block;
	float:left;
	font-weight:bold;
	padding:3px 4px;
border:solid 1px #FFFFFF;	
}
#pagination-flickr .next a,
#pagination-flickr .previous a {
font-weight:bold;
border:solid 1px #FFFFFF;
}
#pagination-flickr .active{
color:#ff0084;
font-weight:bold;
display:block;
float:left;
padding:4px 6px;
}
#pagination-flickr a:link,
#pagination-flickr a:visited {
color:#0063e3;
display:block;
float:left;
padding:3px 6px;
text-decoration:none;
}
#pagination-flickr a:hover{
border:solid 1px #666666;
}

.ui-layout-pane-center {
}
.ui-layout-west .ui-jqgrid tr.jqgrow td { border-bottom: 0px none;}
.ui-column-bottom {border-bottom:1px solid #8E846B !important;}
.ui-tr-group td {
	font-weight:bold !important;
	font-style:italic;
	background-color:#EFECD1;
}

/* JQUERY UI MENU */
	
.ui-menu { overflow: hidden;}
.ui-menu .ui-menu { overflow: visible !important; }
.ui-menu > li { float: left; display: block}
.ui-menu > li { margin: 5px 5px !important; padding: 0 0 !important; }
.ui-menu > li > a { float: left; display: block; clear: both; overflow: hidden;}
.ui-menu .ui-menu-icon { margin-top: 0.3em !important;}
.ui-menu .ui-menu .ui-menu li { float: left; display: block;}

.ui-menu .ui-menu-item {
	margin:0;
	padding: 0;
	zoom: 1;
	float: left;
}	
	#menus li {width:auto; clear:none;}


/* PHOTOBOX PORTFOLIO */
#photobox {
	margin: 20px auto 0; 
	overflow: hidden; 
	width: 90%;
}

ul#photos {
    float: left;
    list-style: none;
    margin-left: 0;
    width: 100%;
}

ul#photos li {
    float: left;
    margin: 0 20px 0 20px;
    padding: 10px;
    width: 130px;
		height:150px;    
}

ul#photos li a {
	text-align:center;
}

ul#photos li:last-child { border-right: none; margin-right: 0; padding-right: 0; }
ul#photos a { display: block; width: 100%;border:1px solid #dedede;}
ul#photos img { 

	display: block; 
	padding-bottom: 5px; 
	margin: auto;
	vertical-align: middle; 
	display: inline-block;	
}
ul#photos li { margin-right: 5px; }

ul#photos li span {
	float: left;
  display:block;
}

ul#photos li div.desc1 {
	text-align:center;
}

ul#photos li div.desc2 {
	text-align:center;
}