/* In this stylesheet, classes are used in cases where there can be more than one instance of an element type. Id selectors are used only to refer to a specific object. */

html,body {
	margin:0;
	padding:0;
	height:100%;
	border:none;
	font-family: Arial;
	font-size: 11px;
	overflow-y: hidden;
	word-wrap: break-word; /* IE6 Needs this to avoid layout uglyness when dragging the panels closed*/
 }

select, input, textarea {
	font-family: Arial;
	font-size: 11px;
}

img {
	border:none;
}

#topmenu {
	width: 100%;
	height: 20px;
	border-bottom: 1px solid #9199a4; 
	border-top: 1px solid #9199a4;
	margin: 0;
	padding: 0;	
	background: #FFF;
	background-image:url('images/bg_menu.jpg');
/*	overflow-x: hidden;*/ 
}

#header { 
    /* KM: fix value in jitk_layout.js */
	/*height: 64px;*/ 
	height: 91px;
	margin-top: 0px; 
	/*margin-bottom: 5px;*/ 
	margin-bottom: 0px;
	border-bottom: 1px solid #d7d7d7;
	background-repeat: no-repeat;
	width: 100%;
/* Total Header Height: 65px */
}
#headertitle {
	padding: 1.2em 0 0 0.5em;
	font-size: 2.2em;
	font-family: "Trebuchet MS",Helvetica,Arial,Geneva,sans-serif;
	color: #FFF;
    text-decoration: none !important;
}

.error {
	/*color: #ff0000;*/
	align: center;
	font-weight: bold;
}

.userinfo {
	float: right;
	padding: 2px 10px 0 0;
	font-size: 12px;
	font-weight: bold;
	color: #444466; 
}

.userinfo a {
	color: #444466; 
}

.userinfo a:hover {
	color: #444466; 
}

.accordionSet {
	display: none;
}

#accordions {
	top:0; 
	float:left; 
	border-top: 1px solid #D2D2D2;
	background-color: #efefef;
	/*padding-bottom: 5px;*/
	overflow:hidden;
	/* Starting value only - overwritten on load.*/
	width: 300px;
}

#accordions div h1 {
	font-size: 11px;
	line-height: 11px;
	font-weight: bold;
	cursor: pointer;
	height: 16px;
	padding: 4px 0 0 5px;
	margin: 5px 5px 0 5px;
	overflow:hidden;
	border: 1px solid #9199a4;
	text-transform: uppercase;
/* Total accordion H1 Height: 27px */
}

#accordions div h1.off:hover {
	color: #000000;
	background-position: 0 -22px;
	border: 1px solid #666666;
}

#accordions div h1.on { 
	background-image: url('images/bg_header.jpg');
	background-position: 0 -44px;
	color: #ffffff;
	cursor: default;
}

#accordions div h1.off  {
	background-image: url('images/bg_header.jpg');
	color: #666666;
	border: 1px solid #c9c9c9;
}


#overviewMapContainerPanel {
	background-color: #efefef;
	display: block;
	margin: 3px 5px 5px 5px !important;
	margin: 5px;
}

#overviewMapBox {
	border: 1px solid #d2d2d2;
	border-top: 0;
	background-color: #fff;
	padding: 5px 6px 5px 6px;
}

#overviewMapContainerPanel h2 {
	color: #9199a4;
	font-size: 11px;
	line-height: 11px;
	font-weight: bold;
	height: 10px;
	padding:0;
	margin:0;
	text-transform: uppercase;
}

#overviewMapContainerPanel h2 a {
	color: #cccccc;
}

#overviewMapContainerPanel h2 a:hover {
	color: #000000;
}

#overviewMap {
	border: 1px solid #9199a4;
	/* background-image: url('images/sampleMap.jpg'); */ 
	margin-top: 7px !important;
	margin-top: 5px;
	padding: 0px 0px
}

#toolbar {
	background-image: url('images/bg_toolbar.jpg');
	background-position: right;
	background-repeat: repeat-y;
	float:left; 
	width: 62px; 
	background-color:#EFEFEF;
	border-top: 1px solid #D2D2D2;
}

#buttonset {
	margin: 0 0 5px 10px;
	padding-top: 10px;
	clear: both;
}

.toolbarCommandButton {
	padding-left: 3px;
}

#buttonset a {
	display: block;
	margin: 0 0 5px 0;
}

#rightPanel {
	position: absolute;
	top: -5000px;
	left: 0;
	overflow: hidden; 
	/*
	border-top: 1px solid #D2D2D2;
	_float:left;  /*IE6 Needs this or layout breaks*/
}

#mapHeader  {
	color: #666666;
	font-size: 12px;
	font-weight: bold;
	/*
	padding-top: 5px;
	padding-left: 5px;
	height: 16px;
	overflow: hidden;
	*/
	height: 21px;
	border-left: 1px solid #D2D2D2;
	border-top: 1px solid #D2D2D2;
	background-color:#EFEFEF;
	width: 100%;
}

#mapInfo {
	color: #666666;
	margin: 0 5px;
	/*height: 16px;*/
	/*
	font-size: 12px;
	font-weight: bold;
	*/
	/*overflow: hidden;*/
	/*border-left: 1px solid #D2D2D2;*/
	/*background-color:#EFEFEF;*/
}
#mapInfo span {
	display: inline-block;
	zoom: 1;
	cursor:pointer;
}

#mapDisclaimer {
	position: absolute;
	display: none; 
	bottom: 10px; 
	/*right: 20px;*/ 
	left: 10px;
	z-index: 99; 
	/*font-size: 1.2em;*/
	font-size: 11px;
	/*font-weight: bold;*/
	font-family: Arial,sans-serif;
	color: #000;
	padding: 1px 5px;
	margin: 0 5px;
	filter:alpha(opacity=60);
	-moz-opacity:0.6;
	background: #FFF;
	border: 1px solid #CCC;
	/*width: 150px;*/
	text-align: center;
}

#mapContainer {
	Position:relative; 
	top:0; 
	zoom: 1;
	border-left: 1px solid #D2D2D2;
	border-bottom: 1px solid #D2D2D2;
	background-color:#EFEFEF;
	overflow:hidden;
}

#map {
	overflow:hidden;
	border: 1px solid #9199A4;
	margin: 5px;
	z-index:0;
	height: 500px;
}

#hbar, #vbar {cursor:pointer; overflow:hidden; background-color: #ffffff;}

#hbar {
	border-bottom: 1px solid #D2D2D2;
}

#hbar {
	height: 14px;
}

#vbar {
	width: 14px;
}

#hControls {
	background-image: url('../images/pControlHandleH.jpg');
	background-position: bottom;
	background-repeat: no-repeat;
}

#hControls div {
	background-repeat: no-repeat;
	width: 9px;
	cursor:pointer;
}

#hControls div:hover {
	background-position: -9px 0;
}

#accordClose {
	background-image: url('../images/pControlLeftClose.jpg');
	height: 30px;
}

#accordMin {
	background-image: url('../images/pControlLeftMin.jpg');
	height: 29px;
}

#accordMax {
	background-image: url('../images/pControlLeftMax.jpg');
	height: 29px;
}
#accordBalance {
	background-image: url('../images/pControlLeftBalance.jpg');
	height: 29px;
}


#overviewMapControls {
	height: 9px;
	margin-top: 8px;
	border-bottom: 1px solid #d2d2d2;
}

#overviewMapControls div {
	background-repeat: no-repeat;
	height: 9px;
	cursor:pointer;
	float: right;
	overflow: hidden;
}

#overviewMapControls div:hover {
	background-position: 0 -9px;
}	

#overviewClose {
	background-image: url('../images/pControlResultsClose.jpg');
	width: 30px;
}
#overviewMin {
	background-image: url('../images/pControlResultsMin.jpg');
	width: 27px;
}
#overviewMax {
	background-image: url('../images/pControlResultsMax.jpg');
	width: 27px;
}

#vControls {
	width: 50%;
	height: 14px;
	float: right;
	background-image: url('../images/pControlHandleV.jpg');
	background-position: top left;
	background-repeat: no-repeat;
}

#vControls div {
	background-repeat: no-repeat;
	height: 9px;
	cursor:pointer;
	float: right;
	margin-top: 5px;
}

#vControls div:hover {
	background-position: 0 -9px;
}	

#resultsClose {
	background-image: url('../images/pControlResultsClose.jpg');
	width: 30px;
}
#resultsMin {
	background-image: url('../images/pControlResultsMin.jpg');
	width: 27px;
}
#resultsMax {
	background-image: url('../images/pControlResultsMax.jpg');
	width: 27px;
}
#resultsBalance {
	background-image: url('../images/pControlResultsBalance.jpg');
	width: 27px;
}

.lPanel {
	display: none; 
	overflow:auto;
	margin: 0 5px;
	border: 1px solid #9199a4;
	border-top: 0;
	background-color: #fff;
	/* Starting value only - overwritten on load.*/
	height: 600px;
}

#resultsContainer  {
	Position:relative; 
	top:0; 
	border-left: 1px solid #D2D2D2;
	background-color:#EFEFEF;
	overflow: hidden;
}
/*
#resultsTabs  {
	color: #666666;
	font-size: 12px;
	font-weight: bold;
	padding: 0px;
	height: 30px;
	border: 1px solid #D2D2D2;
	border-bottom: 0;
	background-color:#C9C9C9;
	overflow: hidden;
	display: none;
}

#resultsTabs a {
	color: #666666;
	font-size: 12px;
	font-weight: bold;
	padding: 8px 10px 6px 10px;
	height: 16px;
	display: block;
	float: left;
	text-transform: uppercase;
	text-decoration: none;
}

#resultsTabs a:hover {
	color: #000;
}

#resultsTabs a.on {
	color: #9199A4;
	background-color:#ffffff;
}
*/
#resultsBox  {
	font-size: 11px;
	border: 1px solid #D2D2D2;
	background-color:#ffffff;
	overflow: auto;
	margin: 5px;
}

#resultsBox .content {
	margin: 5px;
}
/*
.results  {
	display: none;
}

.results table {
	border-left: 1px solid #CCCCCC;
	border-top: 1px solid #CCCCCC;
	width: 100%;

}

.results td {
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-bottom-style: solid;
	border-right-style: solid;
	border-top-color: #CCCCCC;
	border-right-color: #CCCCCC;
	border-bottom-color: #CCCCCC;
	border-left-color: #CCCCCC;
	padding-left: 2px;
}

#elevator {
	width: 36px;
	margin: 5px 0 0 10px;
	padding-left: 6px;
	height: 168px;
	border-bottom: 1px solid #999999;
}
#elevatorTop {
	float: left;
	width: 31px;
	height: 21px;
	background-image: url('../images/zoomTop.gif');
	background-repeat: no-repeat;
	background-position: top center;
}

#elevatorStepsLeft {
	float: left;
	height: 112px;
	width: 5px;
	background-image: url('../images/zoomStep.gif');
	clear: both;
}

#elevatorBG {
	float: left;
	height: 116px;
	width: 16px;
	margin: 0 3px 0 3px;
	background-image: url('../images/zoomElevator.gif');
	background-repeat: no-repeat;
	cursor:pointer;
}

#elevatorBox {
	width: 16px;
	height: 16px;
	margin-top: 100px;
}

#elevatorBox, #elevatorTop, #elevatorBottom {
	cursor:pointer;
} 

#elevatorStepsRight {
	float: left;
	height: 112px;
	width: 5px;
	background-image: url('../images/zoomStep.gif');
}

#elevatorBottom {
	float: left;
	width: 31px;
	height: 21px;
	background-image: url('../images/zoomBottom.gif');
	background-repeat: no-repeat;
	background-position: top center;
}*/

#fader {
	position:absolute;
	left:0px;
	top:90px;
	width:100%;
	height:1200px;
	z-index:10;
	background-color:#FFF;
}

/* ABOUT THIS MENU
Adapted from Suckerfish menus. Had some stacking order trouble with Firefox. The elements being scaled via Javascript were stacking on top of this menu & ignoring z-index declarations. The solution seems to be to keep the menus in the same parent in the node tree as the page content. This fixed everything but the map without requiring any z-index vodoo. The map issue was fixed by assigning it a z-index:0 and z-index:1 to the #nav. Because I couldn't nest it in another div, I had to get creative with the #nav element by using 100% padding to push the contents off the page and a right-edge reset to bring it back. This could've also been padded-left via the DOM after calculating the page width, but I prefer using a pure CSS solution. It would be nicer not to right-align these menus in the future.
*/

#nav {
	position: relative;
	padding: 0;
	margin: 0;
	list-style: none;
	z-index:1;
	float: left;
}

#nav img {
	margin: 0 0.5em;
}
#nav li ul li a img {
	vertical-align: text-bottom;	
}

#nav ul {
	padding: 0;
	list-style: none;
	float: left;
	line-height: 0;
}

#nav a {
	border-left: 1px solid #9199a4;
	display: block;
	height: 16px;
	font-size: 10px;
	font-weight: bold;
	color: #444444;
	text-decoration: none;
	padding: 4px 2px 0 10px;
	text-transform: uppercase;
}

#nav li {
	height: 20px;
	float: left;
	/* width: 125px; */
	width: 155px;
	vertical-align:text-middle; 
}

#nav li ul {
	position: absolute;
	width: 220px;
	left: -999em;
	border-right: 1px solid #9199a4;
	border-bottom: 1px solid #9199a4;
	
	margin:0px;
	visibility: hidden;
}

#nav li ul li {
	width: 220px;
	height: 28px;
	border-top: 0;
	background-color:#edeff2;
	padding:0px;
	margin-top: 0px;
	vertical-align:text-middle; 
	/*filter:alpha(Opacity=85);*/
	white-space: nowrap;
	zoom: 1;
}

#nav .top {
	border-top: 1px solid #9199A4;
}

#nav li ul li a {
	font-size: 10px;
	height: 24px;
	color: #444444;
	margin: 0px;
	zoom: 1;
	/*
	border: 1px solid #9199a4;
	border-top: 0;
	*/
	vertical-align:text-middle; 
}

#nav li ul li a:hover {
	color: #ffffff;
	background-color: #7587ae;
}

#nav li:hover ul {
	left: auto;
}

/* Offset the left margin to keep it on the screen. A left-aligned menu would require no such tomfoolery. */
#nav li:hover ul, #nav li.sfhover ul {
	left: auto;
	/*margin-right: -49px;*/
	visibility:visible;
}

#nav li:hover, #nav li.sfhover {
	background-color:#edeff2;
}

.noBorderTable {
	border-left: 0px solid;
	border-top: 0px solid;
}

.noBorderTr {
	border-left: 0px solid;
	border-top: 0px solid;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
}


/*table.maptemplates tr.highband {
	background-color : #F2F2F2;
	vertical-align:middle;
}

table.maptemplates tr.highband:hover {
	background-color:#C7C7C7;
	vertical-align:middle; 
}

table.maptemplates tr.lowband {
	background-color : #FFFFFF;
	vertical-align:middle;
}

table.maptemplates tr.lowband:hover {
	background-color : #C7C7C7;
	vertical-align:middle;
}

table.maptemplates td.input {
}

table.maptemplates td.preview {
	width:100px;
	height:75px;
	text-align:center;
	background-image : url(../images/loading.gif);
	background-repeat : no-repeat;
	background-position : center center;
}

table.maptemplates td.preview div.preview {
	width:100px;
	height:75px;
}

table.maptemplates td.nameAndDescription {
	width:100%;
	height:75px;
	vertical-align:middle;
}

table.maptemplates td.nameAndDescription div.content {
	overflow : hidden;
	background-color : transparent;
	height:75px;
	text-overflow:ellipsis;
	vertical-align:middle;
}

table.maptemplates span.name {
	font-weight : bold;
	vertical-align:middle;
}

table.maptemplates p.description {
	font-weight : 100;
	overflow:hidden;
	text-overflow : ellipsis;
}

fieldset.maptemplates { 
}

fieldset.maptemplates div.content {
	height:160px;
	overflow:auto;
}

div#EsriTaskCell_newMapCompTask div#newMapCompTask_previewDiv {
	width:180px;
	height:120px;
}

div#EsriTaskCell_newMapCompTask div#newMapCompTask_mainForm {
	width:185px;
}

div#EsriTaskCell_newMapCompTask input#newMapCompTask_param_name {
	width:185px;
}

div#EsriTaskCell_newMapCompTask textarea {
	width:185px;
}*/

/* div#EsriTaskCell_saveMapCompTask div#saveMapCompTask_previewDiv {
	width:180px;
	height:120px;
} */

div#displaySettingsTask_previewContainer {
	width:80px;
	height:60px;
	float:left;
}

div#ImagePreviewDiv_servicePropertiesTask {
	width:100px;
	height:75px;
	float:left;
	border: 1px solid #CCC;
	margin-right:5px;
}

div#servicePropertiesTask_gisResourceName {
	font-size:1.1em;
	font-weight:bold;
}

div#servicePropertiesTask_connectionString {
	
}

textarea#servicePropertiesTask_param_connectionString {
	width:180px;
}

fieldset#servicePropertiesTask_fieldset_props {
	margin: 0px;
	padding: 5px;
}
div#servicePropertiesTask_serviceName_row {
	clear:both;
}

div#servicePropertiesTask_serviceName_label {
	width:100px;
	float:left;
	line-height:20px;
}

div#servicePropertiesTask_serviceName {
	float:left;
	line-height:20px;
}

div#servicePropertiesTask_spatialReference_row {
	clear:both;
}

div#servicePropertiesTask_spatialReference_label {
	width:100px;
	float:left;
	line-height:20px;

}

textarea#servicePropertiesTask_param_spatialReference {
	float:left;
	width:180px;
}

div#servicePropertiesTask_user_row {
	clear:both;
}

div#servicePropertiesTask_user_label {
	width:100px;
	float:left;
	line-height:20px;
}

div#servicePropertiesTask_user {
	float:left;
	line-height:20px;
}

#jitk_graphicsPreview {
	width: 80px;
}

.tocTable td {
	height:2em;
	margin:0;
}