@media all {
html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    font-family: Arial, sans-serif;
}

/* hide google attribution, already displayed by google */
.olLayerGooglePoweredBy, .olLayerGoogleCopyright {
    visibility: hidden !important;
    display: none !important;
}

p.small, .smTxt {
    font-size:70%;
    /* margin:10px 0 5px;*/
}

.red {
	color:#ff0000;
}

.clearer {
	height: 1px;
	clear: both;
}

#clear_fltr {
	clear:both;
	float:left;
}

.hilite {
	background-color:#efef7f;
}

#firstloaddiv, #filterloaddiv {
    position: fixed; 
    top: 0px;
    left: 0px;
    width: 100%;
	height:100%;
    background: rgba(0,0,0,.805);
    opacity: 0.80;
    filter: alpha(opacity=80);
    z-index: 8500;
    display:block;
    overflow:auto;
}

#filterloaddiv{
    background: none;
    opacity: 0;
    filter: alpha(opacity=0);
	display:none;
}

#help_msg {
	z-index: 8501;
	display: none;
	color: #ff0000;
    text-align:center;
}

#legendMsg {
    color: #ba7214;
    font-size:85%;
    font-style:italic;
    width: auto;
    height: auto;
    z-index: 8550;
    text-align: right;
}

#mvLgnd {
    border-bottom: 1px solid #ccc;
    margin: 10px;
    cursor: pointer;
    font-size: 85%;
    font-style: normal;
    padding: 2px;
}

.legendbox {
    position:relative;
    float:left;
	clear:both;
    width:auto;
    height:auto;
	font-size: 85%;
	font-weight: bold;
	font-style:italic;
	text-align:left;
	margin-left:20px;
	padding-top:5px;
	display:none;
}

#printLegend {
	display:none;
}

.legendHead {
    float:left;
	clear:both;
    width:auto;
    height:auto;
	text-align:left;
	padding:5px;
}

.legendHead h4 {
	display:none;
	border-bottom:1px dotted;	
}

.tbl-contents-txt {
	font-size: 80%;
	width: auto;
	float:right;
	margin: 8px 35px 0 0;
}
	
#legndBtn.ol-control {
	background: rgba(0, 60, 136, 0.5) url("side_arrow.png") no-repeat scroll -27px -1px;
	border: medium none;
	color: #fff;
	display: block;
	float: left;
	font-size: 12px;
	font-weight: 700;
	height: 1.7em;
	margin: 15px 3px 0 0;
	padding: 3px 0 0 0;
	position: relative;
	text-decoration: none;
	width: 160px;
	}
	
#legndBtn.on {
	background: rgba(0, 60, 136, 0.5) url("side_arrow.png") no-repeat scroll 142px -1px;
	}
	
#legndWrapper {
	width: auto;
	height: 100%;
	position: absolute;
	top: 138px;
	right: 0;
	background: #ffffff;
	font-size: 0.825em;
	padding:2px;
	border-top:0 none;
	display:block;
}

 #legndWrapper .legndLabel {
 	text-align:center;
	color: #5a2110;
	display:block;
	font-weight:bold;
	clear:both;
 }

#mapZm {
    float: left;
	margin-right: -4px;
}

#mapZm .ol-extnt button {
	 margin: 1.1em 14px 0 15px;
}

#mapZm .ol-zoom {
    float: left;
    left: -1em;
    margin-top: 0.65em;
}

.ol-zoom .ol-zoom-in, .ol-zoom .ol-zoom-out {
	float:left;
}

#introCloseBtn, #uploadCloseBtn, #printCloseBtn, #contactCloseBtn {
    right: 5px;
    position: absolute;
    top: 6px;
    z-index: 9000;
}

input#startdate, input#enddate {
	width:120px;
}

span#date2 {
    top: 40px;
}
span#date1, span#date2 {
    position: absolute;
    width: 220px;
	text-align: right;
}

span#date1 {
	top:10px;
}

#introCloseBtn {
        display:none;
}

.closeBtn {
    -moz-border-radius: 50%;
    border-radius: 50%;
    background-color:#fdfbad;
    text-align:center;
    text-decoration: none;
    font-size:13px;
    font-weight:bold;
    color:#708090;
	height: 15px;
	width: 15px;
	cursor: pointer;
	border: 1px solid;
    right: 5px;
}

.closeBtn:hover {
	color:#BB7B7F;
}

.hidden {
	color: #bfbfbf;
}

#spinner, .ajax-loader {
  position: absolute;
  width:30px;
  height:30px;
  left: 0;
  top: 50%;
  right: 0;
  margin: auto;
  display: none;
  z-index: 9500;
}

#spinner2 {
  position: absolute;
  width:30px;
  height:30px;
  left: 0;
  top: 2%;
  right: 0;
  margin: auto;
  display: block;
  z-index: 9500;
}

#spinner3 {
  position: absolute;
  width:30px;
  height:30px;
  top: 50%;
  left:50%;
  margin: 0 auto;
  display: none;
  z-index: 9500;
}

#introContainer, #filterContainer {
    background-color: rgb(255, 255, 255);
    border-radius: 14px;
    color: #000000;
    height: auto;
    margin: 5% auto;
    padding: 2%;
    position: relative;
    width: 50em;
	box-shadow: 0 0 15px rgba(0,0,0,0.2);
	border:thin solid #ccc;
    z-index: 9000;
}

.intro {
    text-align: left;
}

/* Info Windows */

.info {
    padding: 6px 8px;
    font: 14px/16px Arial, Helvetica, sans-serif;
    background: white;
    background: rgba(255,255,255,0.8);
    box-shadow: 0 0 15px rgba(0,0,0,0.2);
    border-radius: 5px;
}

.info h4 {
    margin: 0 0 5px;
    color: #777;
}

canvas#legend {
    position: relative;
    top: 10px;
    /*background-color: #ccc;*/
    opacity: 1;
    text-align: left;
    color: #555;
    width: auto;
    height: auto;
    background-color:rgba(255,255,255,0);
	z-index: 0;
}

p.jbwq-txt {
	color: #5a2110;
    font-weight: bold;
    padding-top: 0.6em;
	text-align: left;
}


#popstyle {
    color: #636363;
    font-size: .825em;
    margin: 0;
    /*font-size:1.35em;*/
    font-weight: normal;
    border-bottom: thin solid #ccc;
    /*color:#222;*/
}

#popstyle img {
    float: bottom;
    margin-top: 1em;
}

/* Floating popup*/

.ol-popup {
  position: absolute;
  background-color: white;
  -webkit-filter: drop-shadow(0 1px 4px rgba(0,0,0,0.2));
  filter: drop-shadow(0 1px 4px rgba(0,0,0,0.2));
  padding: 15px;
  border-radius: 10px;
  border: 1px solid #cccccc;
  bottom: 12px;
  left: -50px;
  min-width: 280px;
  text-align:left;
}
.ol-popup:after, .ol-popup:before {
  top: 100%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}
.ol-popup:after {
  border-top-color: white;
  border-width: 10px;
  left: 48px;
  margin-left: -10px;
}
.ol-popup:before {
  border-top-color: #cccccc;
  border-width: 11px;
  left: 48px;
  margin-left: -11px;
}
.ol-popup-closer {
  text-decoration: none;
  position: absolute;
  top: 2px;
  right: 8px;
}
.ol-popup-closer:after {
  content: "✖";
}

#floating-panel {
    position: absolute;
    right: .25em;
    background-color: rgba(255,255,255,0.95);
    border-radius: 5px;
    color: #636363;
    width: 300px;
    z-index: 18000;
    border-radius: 5px;
    color: #636363;
	display: block;
    border: 1px solid #D6D4D4;
	bottom:20%;
	margin: 1.2em;
    font-size: .825em;
	display:none;
}

#output-id {
    margin: 1.2em;
    font-size: .825em
}

#floating-panel h1 {
    margin: 0;
    font-size: 1.35em;
    font-weight: normal;
    border-bottom: thin solid #ccc;
    color: #222
}

#floating-panel dt {
    margin-top: .75em;
    color: black
}

#floating-panel dt:first-child {
    margin-top: 0
}

#floating-panel dd {
    margin: 0 0 .25em .75em
}

#panel-info p, #no-bounds-msg {
    margin-top: 1em;
    color: black;
    text-align: center;
    font-style: italic
}

#panel-wrapper {
    margin: 1.2em;
    font-size: .825em
}

.btn2 {
	/*
    background-color: rgb(229, 229, 229) !important;
    border-radius: 3px;
    border-style: solid;
    border-width: 1px;
    color: #636363;
    left: 0;
    padding: 8px 10px;
    position: absolute;
    text-decoration: none;
    top: -2px;
    vertical-align: top;
    width: 22.9em;
    text-align: center;
    */
	-moz-border-bottom-colors: none;
	-moz-border-left-colors: none;
	-moz-border-right-colors: none;
	-moz-border-top-colors: none;
	border-radius: 4px;
	border-style: solid;
	border-width: 1px;
	color: rgb(253, 251, 173);
	cursor: pointer;
	display: inline-block;
	font-size: 12px;
	line-height: 11px;
	margin: 4px 1px 1px;
	padding: 4px 25px 6px 8px;
	text-align: center;
	left:0;
	}

#left-panel {
    /*background-color: rgba(255, 255, 255, 0.85);*/
	background-color: #ffffff;;
    border-radius: 5px 0;
    color: #636363;
    height: auto;
    position: absolute;
    top: 135px;
    z-index: 2999;
	float:left;
	width: 317.2px;
	padding:0 5px 5px 0;
	border: 2px solid #564B9C;
	overflow:visible;
	}

#filter {/**/
    height: auto;
    top: 10px;
    float: left;
    width: auto;
    text-align: left; 
    /*font-size: 75%;
    color: #ccc;*/
    padding-bottom: 0px;
    margin: 0 10% 10px;
    z-index: 5;
}

#panel-info {
    position:relative;
    top: 0;
    z-index: 5;
    display:none;
	/*
    height: auto;
    float: left;
    text-align: left;
    padding: 2%;
    border-radius: 5px;
    background-color:rgba(235,235,235,0.95);
    */
}

.panel-info {
/*
    background-color: rgba(235, 235, 235, 0.95);
    border-radius: 5px;
    float: left;
    height: auto;
    margin-top: 10px;
    padding: 2%;
    position: absolute;
    text-align: left;
    top: 250px;
    width: 21em;
    z-index: 5;
    */
}


ul#info-tabs {
    list-style-type: none;
    margin: 5px 0 -2px;
    padding: 0;
    text-align: center;
	display:none;
}

ul#info-tabs li {
    background-color: #ffffff;
    border: 1px solid #bfbfbf;
    cursor: pointer;
    float: left;
    font-size: 80%;
    margin-bottom: 0;
    margin-top: 5px;
    margin-top: 5px;
    padding: 1px 3px;
    width: auto;
    z-index:100;
}

ul#info-tabs li.active {
    font-weight: bold;
	color:#000;
	border-bottom: medium solid #fff; 
}


ul#info-tab {
    border-bottom: 1px solid #238b68;
    list-style-type: none;
    margin: 0;
    padding: 0;
}

#info-contents, #info-contents2, .jbwq_summ_links {
	margin:0;
	padding:0;
    z-index: 5;
}

#info-contents table, #info-contents2 table {
    text-align: left;
    z-index: 5;
}

#info-contents tbody, #info-contents2 tbody {
    /*border-top: 1px solid #bfbfbf;*/
    float: left;
    text-align: left;
    z-index: 5;    
}

table.info-content.active, .info-content.active {
    display:block;
    background-color: #fff;
}

li.info_summ {
    border-bottom: 1px solid #dedede;
    line-height: 1.1;
    list-style-type: none;
    margin: -1px 0 0 -40px;
}

.info-tab {
	
}

.info-tab.active {
	
}

#info-contents, #info-contents2, .info-content {
	display:none
}

#dnld_summary .dnld-content, .jbwq_summ_links {
	display:block;
}

.info-content.active {
	display:block;
}

.info_head {
  margin:1% 0 1% 0;
  padding: 0;
  border-bottom: 1px solid;
  color: inherit;
  text-align:center;
}

#panel-info p.info_summ {
  margin:.3% 0 0 0;
  color: black;
  text-align: left;
  font-style:normal;
  color: inherit;
}

#output-id2 {
    margin: 1.2em;
    font-size: .825em
}

#left-panel h1 {
    margin: 1% 0 3%;
    font-size: 1.35em;
    font-weight: normal;
    border-bottom: thin solid #ccc;
    color: #222
}

#left-panel dt {
    margin-top: .75em;
    color: black
}

#left-panel dt:first-child {
    margin-top: 0
}

#left-panel dd {
    margin: 0 0 .25em .75em
}

#panel-info dl {
    margin-top: 1em;
    color: #444;
    text-align: left;
    font-style: italic
}

#panel-wrapper2 {
    font-size: .825em;
    /*padding-top: 2em;
    margin: 1.2em;*/
}

/*legend*/
#legend {
    background-color: white;
    background-color: rgba(255,255,255,0.85);
    border-radius: 5px;
}

#legend span {
    padding-right: 1em
}

#legend span:last-child {
    padding-right: 0
}

#legend img {
    padding-right: .25em
}

.partnr_logo {
    margin: 0 0 5px;
	}

.partnr_block {
	width:100%;
	margin: 10px 0 15px 0;
	float:left;
	border-bottom:1px dotted #efefef;
	padding-bottom:15px;
}

#map_loading {
    position: absolute;
    top: 8px;
    left: 78px;
    z-index: 99999;
    padding: 3px 3px 0 3px;
    background-color: white;
    background-color: rgba(255,255,255,0.85);
    border-radius: 5px;
    opacity: .75
}

.btn, .input-prepend .btn, .input-append .btn-group > .dropdown-toggle, .input-prepend .btn-group > .dropdown-toggle {
    vertical-align: top;
	border-style: solid;
	border-width: 1px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    text-decoration: none;
	margin:2% 0;
	padding:1%;
}

.btn:hover, .btn:focus {
    color: #333;
    text-decoration: none;
    background-position: 0 -15px;
    -webkit-transition: background-position .1s linear;
    -moz-transition: background-position .1s linear;
    -o-transition: background-position .1s linear;
    transition: background-position .1s linear;
}

.btn:hover, .btn:focus, .btn:active, .btn.active {
    background-color: #e6e6e6;
}

.btn.disabled, .btn[disabled], .disabled {
    color: #d1d1d1 !important;
    /*background-color: #e6e6e6;*/
}

#poly-select, #poly-remove {
	float:left;
	width:auto;
	}
	
#poly-remove {
	display:none;
	}

/*
.btn:first-child {
    -webkit-border-radius: 4px 0 0 4px;
    -moz-border-radius: 4px 0 0 4px;
    border-radius: 4px 0 0 4px;
}
*/

a:hover, a:focus {
    color: #005580;
    /* text-decoration: underline; */
}

#header .btn {
-moz-border-bottom-colors: none;
-moz-border-left-colors: none;
-moz-border-right-colors: none;
-moz-border-top-colors: none;
background-color: rgb(78, 98, 114);
background-repeat: repeat-x;
border-radius: 4px;
border-style: solid;
border-width: 1px;
color: rgb(253, 251, 173);
cursor: pointer;
display: inline-block;
font-size: 12px;
line-height: 11px;
margin: 4px 1px 1px;
padding: 4px 8px 6px;
text-align: center;
}


/*
.btn:first-child {
    -webkit-border-radius: 4px 0 0 4px;
    -moz-border-radius: 4px 0 0 4px;
    border-radius: 4px 0 0 4px;
}
*/
#panel-switch.btn {
	float:left;
}

#panel-switch:hover {
	box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
}

#panel-switch, #explore, #dataExplBtn {
	cursor:pointer;
}

.icon-download {
    /* background-position: -120px -24px */
}

#upload-form, #print-instr, #contact-instr {
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    display:none;
    position:absolute;
    padding: 1%;
    right:50px;
    width:400px;
    height:300px;
    background-color:#EEEEEE;
    border: 1px solid;
    z-index: 6000;
}

#contact-instr {
    height:170px;
}

.upload-form{
    font-size: 85%;
    text-align: left;
}

	
#filter-form-wrapper, #seldownload-form-wrapper, #alldownload-form-wrapper, #byparam-form-wrapper, #byfilter-form-wrapper {
	float:left;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    border: 1px solid #c8c5be;
    display:none;
    padding: 2%;
	/*position:relative;*/
	top:40px;
	margin-top:15px;
	width: 23em;
	text-align: left;
}


#alldownload-form-wrapper, #byparam-form-wrapper, #byfilter-form-wrapper {
	background-color: #f8e186; 
}

#seldownload-form-wrapper h4 {
	margin-top:.5em;
}

#dnlddates-main {
	margin-bottom:1.5em;
}


.dnld-link.btn.ui-button {
    margin-top: 1em;
	display: none;
}

#downloadContent {
	border-bottom: 1px solid #c8c5be;
}

#filter-form {
	width:100%;
	text-align:left;
}

#filter-form h3 {
	display: inline-block;
}

#filter-form fieldset, #dataExplBtn.d_btn  {
    border: 1px solid #c8c5be;
    border-radius: 6px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
    clear: right;
    float: left;
    margin-left: 0.2em;
    padding: 2%;
    width: 44.5%;
	word-break:break-word;
}

#dataExplBtn.d_btn  {
	display: none;
	width:150px;
	margin-top:1em;
	position: absolute;
	right:180px;;
	top:140px;
    background: rgba(255, 255, 255, 0.3);
    border: 1px solid #aaaaaa;
    color: #404040;
}
		
	
#filter-form fieldset#filtrCrit {
	width:95%;
}
	
 #filter-form .select_p, #filter-form .select, #filter-form div.subform, #dnld-form .select_p, #dnld-form .select, #dnld-form div.subform, #chartparams-main.select_p {
 	color: #000000;
    border: 1px solid #c8c5be;
    border-radius: 6px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
    clear: both;
    float: left;
    margin: 0 0.2em;
    padding: 2%;
    width: 94.5%;
	cursor: pointer;
}
	
#filter-form fieldset .select_p.button {
	height:1.4em;
}
	
#filter-form .select_p.button, .select_p.button {
	background: transparent url("updn_arrow.png") no-repeat scroll 99% 0;
}

#filter-form .select_p.button.on, .select_p.button.on {
	background: transparent url("updn_arrow.png") no-repeat scroll 99% 99%;
}

#fltrparams-form {
	top:165px;
}

#dnldparams-form {    
	left: 5px;
    top: 135px;
}

#dnldparams-main.button {
    color: #005a8c;
    margin-bottom: 0.05em;
    margin-top: 0.1em;
	font-weight: bold;
	position:relative;
}
	
 #panel-switch.btn2 {
 	color: rgb(253, 251, 173);
	float:left;
	background: rgb(78, 98, 114) url("updn_arrow2.png") no-repeat scroll 99% -3px;
}

#panel-switch.btn2.on {
    background: url("updn_arrow2.png") no-repeat scroll 99% -25px;
}

#filter-form #sources.select {
	width: 99%;
}
	
.subform, #resultStatus, #resultStatus2 {
	background: transparent none;
	font-size:inherit;
	padding:2%;
	position:relative;
	display:none;
	width:auto;
}

#filter-form .subform option {
    font-size: 92%;
}

div#dnloadGroup .d_btn  {
    border: 1px solid #808080;
    border-radius: 6px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
    /*margin-left: 0.2em;
    padding: 1%;*/
	word-break:break-word;
}

div#dnloadGroup > .d_btn {	
    clear: right;
    float: left;
}

#download.d_btn {
	color: #5a2110;
	font-weight: bold;
    height: 2.7em;
    text-align: left;
    width: 7.5em;
    padding-bottom: .6em !important;
}


#dnld-form > fieldset {
    clear: both;
}

.d_btn {
	color: #5a2110;
	font-weight: bold;
    width: 7.1em;
    /*padding-top: .6em !important;*/
    text-align: center;
	font-size:98%;
}


.chartFrmBtns {
    clear: both;
    display: block;
    padding: 0.5em 0 0.2em;
    text-align: center;
}

#dnloadGroup {
	text-align:left;
	padding-top:10px;
	width:100%;
	margin-left:3px;
}

#dnld_all.d_btn {
    float: right;
	cursor: pointer;
    /*width: 5.1em !important;*/
	width:100px;
	height:32px;
	background: #ffffff url("jbwq_button1.png") no-repeat right top;
}

#dnld_all.d_btn:hover {
	background: #ffffff url("jbwq_button1.png") no-repeat right -33px;
}

#dnld_by.d_btn {
	cursor: pointer;
    /*width: 9.26em;*/
	width:111px;
	height:32px;
	background: #ffffff url("jbwq_button2.png") no-repeat right top;
}

#dnld_by.d_btn:hover {
	background: #ffffff url("jbwq_button2.png") no-repeat right -33px;
}

#explore.d_btn {
	width:100px;
	height:32px;
	background: #ffffff url("jbwq_button3.png") no-repeat right top;
}

#explore.d_btn:hover {
	background: #ffffff url("jbwq_button3.png") no-repeat right -33px;
}

.W_hov.d_btn:hover, .w_hov.d_btn:hover, #explore.d_btn:hover {
	box-shadow: 0 0 15px rgba(213, 213, 106, 0.2) !important;
}

/*
#dataExplBtn.d_btn {
    display: none;
}
*/

#dataExplBtn.d_btn:hover {
	box-shadow: 0 0 15px rgba(213, 213, 106, 0.2);
}

#resultStatus2 {
    display: block;
	float:right;
	padding:0;
	font-weight: bold;
	position:absolute;
    right: 20px;
	top: 75px;
}

#paramMsg {
    background-color: #eeeeeb;
    display: block;
    float: left;
    font-size: 80%;
    margin: 1px 0 5px;
    padding: 3px;
	width:95%;
}

#resultStatus {
    display: block;
    float: right;
    font-weight: bold;
    left: 16.5em;
    position: absolute;
    text-align: right;
    top: 0;
    width: 7em;
	}

#dates-form {
	height:65px;
}

#clear_dates {
    display: inline-block;
    float: right;
    /* top: 25px; */
    padding: 3px 5px;
}

#clear_all {
    float: right;
    top: -5px; 
}

.boxform {
	position:absolute;
	top:90px;
	color: #000000;
	background-color: #ffffff;
    border: 1px solid #c8c5be;
    border-radius: 6px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
    clear: both;
    margin: 0 0.2em;
    padding: 2%;
    width: 550px;
	display:none;
	z-index:500;
}

.ui-dialog #jbwqChartSelDiv {
    overflow: visible !important;
}

#chartparams-form.boxform {
	left:0;
	/* width:280px; */
	top:115px;
}

.boxform .box {
	width:30%;
	float:left;
	text-align:left;
	position: relative;
}

#chartparams-form.boxform .box {
	/* width:50%; */
}

.chkbox, .chkbox_top, .chkbox_bot {
	margin:2px 0 0 5px;
	vertical-align: 2px;
}

.chkbx {
	margin:2px 0 0 2px;
	vertical-align: -2px;
}

#chkBoxBtns input[type="radio"] {style
	margin-top:5px;
}


.chkbox_top {color:#911313;}
.chkbox_bot {color:  #6475bf;}
.boxform .off {color:#bfbfbf; }

/********* ol overrides ***********/

#external_controls .layer-switcher {
    left: 0;
    text-align: left;
    top: 0.1em;
}


#latlon {
    color:#88321E;
    height: 1em;
    position: relative;
    float: left;
	margin-top:1.5em;
    z-index: 600;
}

/* override */
.ol-mouse-position {
    position: relative;
	right:0;
	top:0;
}

.layer-switcher .panel {
    /*background-color: #9eb7a2;
    border: 1px solid gray;*/
    border-radius: 3px;
    display: inline-block;
    margin: 0 0 10px 0;
    padding: 5px;
    position: relative;
    z-index: 5000;
}

.layer-switcher ul {
    list-style: outside none none;
    margin-top: -1px;
    padding-left: 1em;
	margin-left: -1em;
}

.layer-switcher ul li{
    float:left;
}

.layer-switcher li.group, .layer-switcher li.group li {
    padding: 4px 0 0;
}

.layer-switcher ul li.group {    margin: 0 5px;
	line-height: 1.2;
}

.layer-switcher li.group > label {
    color: #5a2110;
    display: block;
    font-style: italic;
    display:block;
    width:100%;
	text-align:center;
    border-bottom: 1px solid #dedede;
}

.layer-switcher li.group li label {
    display: inline-block;
    font-size: inherit;
    padding-top: 3px;
    vertical-align: top;
    width: 10em;
}

.layer-switcher li input {
	display: inline-block;
    font-size: inherit;
    padding-top: 3px;
    vertical-align: top;
}

#external_controls {
    display: block;
    float: left;
    font-size: 100%;
    height: 30px;
    left: 5px;
    position: absolute;
    top: 140px;
    z-index: 5000;
	}
	
#switcher-box {
    /* border-top: 1px solid #cccccc; */
    padding: 0;
    position: relative;
    z-index: 400;
}

.ol-control button {
    background-color: rgba(0, 60, 136, 0.5);
    border: medium none;
    color: #fff;
    display: block;
    font-size: 1.14em;
    font-weight: 700;
    height: 1.375em;
    line-height: 0.4em;
    margin: 1px;
    padding: 0;
    text-align: center;
    text-decoration: none;
    width: 1.375em;
}

#switcher-box .ol-unselectable.ol-control.layer-switcher {
    float: none;
    position: relative;
    width:100%;
}

.layer-switcher .panel {
	width:150px;
}

#switcher-box .ol-control.layer-switcher button {
    background-position: -3px center;
    height: 1.6em;
    position: relative;
    top: -18px;
    width: 1.6em;
    z-index: 5500;
}

#external_controls .ol-zoom .ol-zoom-in, #external_controls .ol-zoom .ol-zoom-out {
    border-radius: 2px;
}

.ol-unselectable.ol-control {
    background-color: rgba(255, 255, 255, 0.0);
    border-radius: 4px;
    position: relative;
    padding: 0;
	float:left;
}

#external_controls .ol-zoom.ol-unselectable.ol-control {
    float: left;
    left: 0;
    top: 0;
    width: 3.4em;
}

#external_controls .ol-attr.ol-unselectable.ol-control {
	top:0px;
}


.ol-attr button, .ol-attr ul {
    display: block;
}	
	
.ol-attr li:not(:last-child):after {
    content: " ";
}
.ol-attr li {
    display: inline;
    line-height: inherit;
    list-style: outside none none;
}


.ol-attr.ol-unselectable.ol-control.ol-collapsed ul {
    display: none;
}

.ol-attr ul {
    color: #000;
    font-size: 0.7em;
    left: 3.5em;
    line-height: 1.375em;
    list-style: outside none none;
    margin: 0;
    padding: 0;
    position: absolute;
    text-align: left;
    text-shadow: 0 0 2px #fff;
    top: -3px;
    width: 10em;
}

#external_controls .ol-extnt.ol-unselectable.ol-control {

}

#external_controls .ol-zoom-out {
    float: left;
    left: 1.5em;
    position: relative;
    top: -1.5em;
}

#rtBottom {
    height: 3em;
    position: absolute;
    right: 0;
    top: -3em;
    width: auto;
}

#scale-line, #scale-line .ol-scale-line {
	float: left;
    margin-top: 1em;
    position: relative;
    width: auto;
}

.ol-scale-line {
	background: rgba(0, 60, 136, 0.5) none repeat scroll 0 0 !important;
}

#ui-datepicker-div { display: none; }

/************************************************************************************************************************/

ul.sm {font-size:75%;}


#helpbox {
	position: relative;
}
.icon_r {
    float: right !important;
}

.helpicon {
	-moz-border-radius: 50%;
	border-radius: 50%;
    background-color: #fdfbad;
    color: #708090;
    font-size: 17px;
    font-weight: bold;
	/*position:absolute; */
    height: 20px;
    margin: 6px;
    right: 5px;
    text-align: center;
    text-decoration: none;
    width: 20px;
    z-index: 3000;
	border:1px solid;
}

a.helpicon:hover, a.helpicon:focus {
    text-decoration: none;
}

.helpicon2 {
	-moz-border-radius: 50%;
	border-radius: 50%;
    background-color: #fdfbad;
    color: #708090;
	text-align:center;
	text-decoration: none;
	font-size:14px;
	font-weight:bold;
	position: relative;
	margin: 0 5px;
	height: 15px;
	width: 15px;
	z-index: 3000;
	cursor: pointer;
	border:1px solid;
	float:left;
}

.helpicon:hover {
	color:#BB7B7F;
}

.divclose, .divclose2{
	-moz-border-radius: 50%;
	border-radius: 50%;
    background-color: #fdfbad;
    color: #708090;
	text-align:center;
	text-decoration: none;
	font-size:13px;
	font-weight:bold;
	right: 5px;
	height: 15px;
	width: 15px;
	position: absolute;
	cursor: pointer;
	border: 1px solid;
}
.divclose:hover, .divclose2:hover {
	color:#BB7B7F;
}
.divclose {
	top: 6px;
}
.divclose2 {
	display:none;
	bottom: 6px;
}

.helpdiv {
	-moz-border-radius: 8px 8px 8px 8px;
	border-radius: 8px 8px 8px 8px;
	background-color:  #EDEDED;
	border: 1px solid #64482D;
	color: #000000;
	display: none;
	font-size: 1em;
	opacity: 0.98;
	padding: 5px;
	position:absolute;
	text-align: left;
	top: 10%;
	left: 310px;
	width: auto;
	min-width: 250px;
	z-index: 10010;
}

.helpdiv h2 {width:385px;}

.metadiv {
    background-color: #ededed;
    border: 1px solid #64482d;
    border-radius: 8px;
    color: #000000;
    display: none;
    font-size: 0.8em;
    height: auto;
	width:270px;
    left: 30em;
    opacity: 0.98;
    padding: 3px;
    position: absolute;
    text-align: left;
    z-index: 10010;
    top: -8em;
}

.grpMetadiv {
    background-color: #ededed;
    border: 1px solid #64482d;
    border-radius: 8px;
    color: #000000;
    display: none;
    font-size: 0.8em;
    height: auto;
	width:270px;
    left: 32em;
    opacity: 0.98;
    padding: 3px;
    position: absolute;
    text-align: left;
    z-index: 10010;
    top: .5em;
}

div[id$='tog'] {
	display:none;
	
}

h4[id$='tog'] p, h4 div.ctr {
	margin-top:0;
}

.pic-block {
	display:inline-block;
	padding:0 5px;
	width:310px;
	font-size:70%;
}

.pic-block p {
	margin-left:10%;
	text-align: left;
}

.ctr {
    display: block;
    margin: 0 auto;
    text-align: center;
    width: auto;
}

.alertBox {
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    padding: 1%;
    background-color:white;
    border: 1px solid;
    }
    
    #summaries {
        
    }
    
    #summtable_0, #summtable_1, #summtable_2 {

        }
    
   .info-content th, .dnld-content th {
        font-size:70%;
        font-weight: bold;
        padding: 0 3px;
        border-bottom: 2px solid rgb(242,241,240);
        padding: 5px 3px 0 0;
		text-align: center;
    }
    
tr {
    text-align: left;
    vertical-align: top;
}

#jbwq-datavis-container {
	top:160px;
	left:70%;
	height:auto;
	z-index:3500;
}

#jbwq-datavis-container.ui-dialog {
	overflow:visible !important;
}

#jbwq_datavis_tab, #jbwq_download_tab, #jbwq_summ_tab {
	text-align: left;
	overflow-x: auto;
}
	
#ptMsg, .ptMsg {
    color: red;
    cursor: pointer;
	display:block;
	padding: 3px;
}

#jbwq-chart-container {
	width:600px;
	height:auto;
	bottom:50px;
	right:50px;
	overflow-y: auto;
}

#statscharts {
	display:none;
	min-width:600px;
	min-height:400px;
}
/*
#statscharts .ts{
	display:none;
	min-width:600px;
	min-height:400px;
}

#statscharts .sp {
	display:none;
	min-width:600px;
	min-height:400px;
}
*/
#jbwq-chart-container.ui-dialog {
	width:null;
	height:null;
}

#jbwq-charts{
	width:null;
	height:null;
	overflow: hidden;
}

#jbwqCharts_notavailable {
	font-size: 150%;
	display: none;
	}


#chartparameters {
    width: 19em;
}	

#chartIds {
    display: inline-block;
    width: 10.5em;
    margin: 5px 0 0 2px;
    padding: 2px;
}

#chart_no_pt, #chart_w_pt {
	display:none;
}

#charttype {

}

.highcharts-container {
    padding-left: 5px;
}

#filtrDownload, #pointDownload {
	display:none;
}

.chartlist {
    
}

.chartInstr {
    display: block;
    float: left;
    margin-top: 2%;
    padding-top: 10px;
}

.ui-autocomplete.ui-front.ui-menu.ui-widget.ui-widget-content {
    z-index: 1000 !important;
}

table#stats-content {
	margin:5px auto;
}

   .stats-content th {
        font-size:100%;
        font-weight: bold;
        padding: 0 3px;
        border-bottom: 2px solid rgb(242,241,240);
        padding: 5px 3px 0 0;
    }

   .stats-content tr td + td {
        text-align:right;
    }
    
    .info-content td, .dnld-content td {
        font-size:100%;
		text-align:right;
        padding: 0 15px;
        border-bottom: 1px solid rgb(242,241,240);
    }
	
	
	#clear_dnlddates {
	    display: inline-block;
	    float: right;
   		margin: -18px -5px 0 0;
    	padding: .3em .4em;
	}
	
	.p_chkd { 
		display:none;
	    float: right;
	    position: absolute;
	    right: 40px;
	    top: inherit;
		margin-top:18px;
	}
	
	#dnld-form .p_chkd { 
		margin-top:10px;
	}
	
	/* dateRangeSlider overrides */
	
		.ui-rangeSlider .ui-rangeSlider-bar {
		    background: rgba(50, 150, 50, 0.2) none repeat scroll 0 0;
		    cursor: grab;
		    height: 20px;
		    margin: 1px 0;
	}
		
		.ui-rangeSlider .ui-rangeSlider-innerBar {
			background-color: #fff;
		    border: 1px solid;
		    height: 16px;
		    margin: 3px 6px;
	}
	
	
	.paramGrpLink {
		display:none;
	}
	

} /* end screen styles */
/******************************************************************************************************************************************/

@media print {
	
	
	html, body {
	    margin: 0;
	    padding: 0;
	    width: 100%;
	    height: 100%;
		overflow: visible;
	    font-family: Arial, sans-serif;
	}
	
	#panel-wrapper, #panel-wrapper2, #filter {
		font-size: 80%;
	}

	
	#filter-form fieldset,  {
		background-color: inherit;
	}

	
	#legndWrapper {
		position:relative;
		top:0;
		width: auto;
		height: auto;
		overflow:visible;
		z-index: 10000;
		float:left;
		background: #ffffff;
		border: 1px solid #959595;
		font-size: 0.825em;
		padding:2px;
		border-top:0 none;
		-webkit-region-break-inside: avoid;
	    page-break-inside: avoid;
	}

#left-panel {
	width:auto;
    top: 0px;
	display:none;
	}

	.layer-switcher .panel {
	    display: inline;
	    margin-top: 15px;
	    position: relative;
	    z-index: 5000;
		font-size: 80%;
	}
	
	.legendHead {
		clear:none;
	}
	
	#pageContainer {
	    position:relative;
		width:100%;
	}
	
	#pageHeader {
		display:none;
	}
	
	#printHeader {
		display:block;
		height: auto;
	    border-bottom:2px solid #5D6F81;
	    font-weight: bold;
	    width:100%;
	    position:absolute;
		top:0px;
		z-index:5000;
	}
	
	#legend {
		position:relative;
		display:block;
		float:left;
	}
		
	#switcher-box {
	    border-top: 1px solid #cccccc;
	    padding: 5px 0;
		height:100px;
	    position: relative;
	    z-index: 5000;
		display: block;
    	float: left;
		width: auto;
		min-width: 700px;
	}
	
	.ol-control {
	display: block;
	}
	
	.tbl-contents-txt, #header {
		display:none;
	}
	
	#external_controls {
    top: 10px;
    z-index: 5000;
	}

	#map {
	    border-top: 1px solid black;
		clear: both;
	    display: block;
	    float: left;
		margin:0 auto;
	    height: auto;
		width:100%;
	    position: relative;
	}
	
	#jbwq-datavis-container {
		position:relative;
		float:left;
		width:auto;
		top:0;
		left:0;
		display: block;
	}
	
	#jbwq-chart-container {
		position:relative;
		display: block;
		width:auto;
		float:left;
		-webkit-region-break-inside: avoid;
	    page-break-inside: avoid;
		page-break-before:always;
	}
	
	#mapfooter {
		display:none;
	}	
	
	#panel-info2 {
    /*left: 620px;
    position: absolute;*/
	}
	
	.divclose, #submitform {display:none;}
	
	#spinner2 {
	position: relative;
	width: 0px;
	height: 0px;
	left: 0;
	right: 0;
	display: none;
	z-index: 0;
	}
	
	.pagebreak { 
	position:relative;
	width:100%;
	-webkit-region-break-inside: avoid;
    page-break-inside: avoid;
	page-break-after:always;
	display:block;
	}
	
	.helpicon2 {display:none;}
	
	div[id$='tog'] {
	display:block;
	}
	
	/* spell out links? 
	a[href]:after { 
		content:" (" attr(href) ") "; 
	}
	*/
	.info-tab{display:none;}
	.info-tab.active{display:block;}

	#filter select, select {
		font-size:100%;
	}
} /* end print styles */