h2 {margin-top: 1em; margin-bottom: 0.5em}
.profile {margin-top: 15px}
table.profile {border-style:none}
table.profile td {padding: 0 0 15px 0; border-style:none}
table.profile td.label {text-align: right}
td.label {white-space: normal}
table.profile td.data {padding-left: 10px}
.profile ul {margin-top: 0; margin-bottom: 0}
.profile ul li {margin: 0 0 0 17px !important}
#homepage-container a {padding-left: 5px}
.area-type-definition {margin-left: 5px}
.instructions {font-family: arial, sans-serif; font-size: 10pt}

a.ApplicationButton {width: 330px; margin-top: 5px; margin-bottom: 5px}

.expandable-table-row-child td {border-top: none; border-bottom: none}
.expandable-table-row .clickable {cursor:pointer}
.expandable-table-row-child td:first-child {padding-left:28px}
/*
.expandable-table-row .clickable {padding-left:28px; background-size: 9px 9px; background-repeat: no-repeat; background-position: 10px 8px;}
.expandable-table-row-open .clickable {background-image: url("../../../template/images/list-exp-minus-36.png")}
.expandable-table-row-closed .clickable {background-image:url("../../../template/images/list-exp-plus-36.png")}
*/
.expandable-table-row-open td {border-bottom-color:#dddddd}

.swal-modal {width:95%}
#main-observations-container .observations-chart-container {
	height:250px;
}
#main-observations-container .wetland-size-slider-container {
	margin-left:20px;
	margin-top:50px;
}
#comparison-observations-container .observations-chart-container {
	height:140px;
}
#comparison-observations-container .wetland-size-slider-container {
	margin-left:10px;
	margin-top:7px;
}
#comparison-titles-container {
	width:100px;
	vertical-align:middle;
}
#comparison-titles-container div {
	font-size:10pt; font-family:arial;
	white-space:pre-wrap;
	display:flex;
	text-align:center;
	justify-content: center;
	align-items: center;
}
.observations-container {
	display:flex;
}
.observations-chart-container {
	width:100%;
}
.wetland-size-slider-container {
	margin-bottom:30px;
	width:16px; /* set the same as slider thumb width */
}
.range-slider {
	width: 6px; /* width of the stem */
	margin:0 auto;
	height: 100%;
}
.range-slider .range-slider__thumb {
	width:16px; height:5px;
	border-radius:2px;
}
.range-slider .range-slider__range {
	cursor:grab;
}
.range-slider .range-slider__thumb, .range-slider .range-slider__range {
	background-color: #686cca; /* same as open water, defined in Summary Tool OutputJSONConsolidatedObservations */
}

#area-units-selector-fixed {position:fixed; z-index:999; right:0; bottom:0; overflow: visible; border: 1px solid #CCC; border-radius: 5px; ; padding:5px 10px; background-color:white}
#area-units-selector {display:inline-block; vertical-align:top; margin-left:5px}
table.Stats.System .label {width: 17em}
.stat-option-1 {display:none}

/*table.Wildlife caption {text-align: center}*/
table.Wildlife .label {width: 10em}
table.Wildlife tr.KingdomTotal {font-weight: bold}
table.Wildlife tr.KingdomTotal .label {text-align: left}
table.Wildlife tr.ClassTotal .label {text-align: right}

.LongListTable, .LongListTable td {border-style: none}
#Profile .LongListTable td {padding-right: 10px}
.ListCount {position: relative; margin-bottom: 10px}
.ListCount button {position: absolute; left: 160px; width: 70px; font-size: 78.5%; font-family: Arial, sans-serif}
.LongList .ListDetails_DISABLED {font-size: 78.5%}

h1 {margin-bottom: 5px}
#page-section-links-toggle {width: 306px}

#map-container {margin-right: 20px}
#map-draggable-container, #map-placeholder, #NameIndexContainer {width: 306px; height: 320px}
@media (max-width: 650px) {
	/* just before the name index falls down below the map due to the float */
	#NameIndexContainer {width: 306px !important}
	#map-container {margin-right: 0; float: none}
	#NameIndexContainerBox {float:none; margin-right: 0 !important}
}
@media (max-width: 360px) {
	#map-draggable-container, #map-placeholder {width: 260px !important}
	#NameIndexContainer {width: 260px !important}
}

#NameIndexContainerBox.left {height: 320px; margin-right: 20px}
#NameIndexContainer {width: 230px}
#NameIndexContainer {position: relative; background-color: white}
.NameIndexBox {border: 1px solid #CCC}
.NameIndexBox {display: none; overflow: auto; height: auto; width: auto; position: absolute; top: 20px; bottom: 0; left: 0; right: 0}
.NameIndex {font-size: 8pt; font-family: arial; background-color: white; white-space: nowrap}
.NameIndex div {padding-left: 5px; padding-right: 10px}
.NameIndex .Highlighted {background-color: #f0f0f0}
#NameIndexSelector {width: 100%; height: 20px; position: relative; z-index:1}

.grouped-intersecting-area-list.collapsible-list {padding-left: 6px}
.grouped-intersecting-area-list.collapsible-list ul li {background-image: none}

.SearchIndexText {display: none}
@media print {
	h2 .icon {display:none}
	.LongList button {display: none}
	#LongListDetails-ExternalLinks {display: block !important}
	#NameIndexContainerBox {display: none}
	.ApplicationButton {display: none}
	.limit-height-activated {height: auto !important; border: none}
	.instructions {display: none}
	#map_canvas {top: 2px}
}
