@viewport {zoom: 1.0}

.limit-width {margin:0 auto; max-width:1280px}
.unlimited-width .limit-width {max-width:none}
.unlimited-width .full-width.loaded {width:100% !important; height:auto !important}

body, caption, legend, input, button, textarea, .standard-font {
	font-family: Verdana, sans-serif;
	font-size: 11pt; /*12pt*/
	line-height: 1.4;
	color: #545454;
	text-align: left; /* qg.css strangely sets default to center */
}

body.templated {
	margin: 0;
	padding: 0;
}
.no-heading-indents h1, .no-heading-indents h2, .no-heading-indents h3 {
	margin-left:0 !important;
}

h1, .h1 {
	font-family: Trebuchet MS, sans-serif;
	margin-top: 0;
	padding-top: 0;
	font-size: 18pt; /*16pt verdana*/
	font-weight: bold;
	color:#CB702B;
}
.h1 {margin-top: 15px}

h2 {
	font-family: Trebuchet MS, sans-serif;
	font-size: 15pt; /*13pt verdana*/
	font-weight: bold;
	color:#545454;
	margin: 0.8em 0;
} 

h1 + h2 {margin: 0.5em 0} /* reduce top margin of h2 a little when it is the first heading */

h3 {
	font-family: Verdana, sans-serif;
	font-size: 11pt; /*14pt*/
	font-weight: bold; /*normal*/
	color: #15404F;
}
h3 a:link, h3 a:visited {color: #15404F !important}

h4 {
	font-family: Verdana, sans-serif;
	font-size: 11pt; /*12pt*/
	font-weight: bold; /*normal*/
	color:#545454;
}
h5 {
	font-family: Verdana, sans-serif;
	font-size: 11pt;
	color:#545454
}
h6 {
	font-family: Verdana, sans-serif;
	font-size: 11pt;
	color:#545454
}
h4, h5, h6, #bodytext h4, #bodytext h5, #bodytext h6 {font-size: 100%; margin-top: 0.5em; margin-bottom: 0.5em}

p, ul, ol, dl, dt {margin-top: 0.5em; margin-bottom: 0.5em}
dt {font-weight: bold; margin-bottom: 0}
ul, ol {padding: 0; margin: 0}
ul {list-style-image: url(../../template/images/bullet.png)}
ol {list-style-image: none}
li, dd {padding: 0; margin-left: 2em; margin-top: 0.3em; margin-bottom: 0.3em}
ol li {margin-left: 2.3em}
.no-bullets > li {list-style-type: none; list-style-image: none; 	padding-left: 22px; margin-left: 0}
ul.no-margin li {margin-left: 0 !important}
ul.detailed li {margin-top: 1em; margin-bottom: 1em}
.no-spacing * {margin-top: 0; margin-bottom: 0}

hr {clear: both; margin: 1.5em 0; padding: 0; border-style: none; height: 2px; color: #CCC; background-color: #CCC}
img, iframe {border-style: none}
img {max-width:100%; height:auto} /* make images responsive to mobile devices */
img.no-resize {max-width:none}
form {margin: 0}
.nowrap {white-space: nowrap}
/*label, .label {white-space: nowrap} commented this out 10/12/2024 as it causes formatting issues on small screens. Doesn't seem to have any negative impact. */
a:link, a:visited {color: #516473}
a:hover, a:focus {color: #15404F}

sub, sup {font-size: 70%}
blockquote {margin: 0} /* prevent it from being used just for margins, use indent class instead */

table {border-collapse: collapse; border-spacing: 0; margin-top: 0.5em; margin-bottom: 0.5em}
th, thead {text-align: left; font-weight: bold; vertical-align: middle}
tfoot {font-weight: bold}
tfoot td, tfoot th {font-weight: bold} /* override qg.css */
th, td {padding: 0.1em 0.7em}
td {color: #3D3D3D}
td {vertical-align: top} /* default to vertical-align:top as it causes less surprises than baseline (especially with images). use table class="baseline" to force baseline. */
td > p:first-child {margin-top:0}
caption {font-weight: bold; text-align: left; padding: 10px 0 5px} /* font is also set together with the body font */
table.center-headings th {text-align: center}
table.numeric-data td, table.numeric-data th {text-align: right}
table.numeric-data td.label, table.numeric-data th.label {text-align: left}
table.center {margin-left: auto !important; margin-right: auto !important} /* need text-align:left otherwise centred tables will also contain centred text */
th.center, td.center {text-align: center !important}
table.baseline td, table.baseline th {vertical-align: baseline}

table, th, td {border: 1px solid #3266B1}
th, thead, thead td {background-color:#4478B5; color:white}
tfoot, tfoot td {background-color: #558BBA; color:white}
th a:link, thead a:link, tfoot a:link {color:white}
th a:visited, thead a:visited, tfoot a:visited {color:white}
th a:focus, thead a:focus, tfoot a:focus {color:white}
th a:hover, thead a:hover, tfoot a:hover {color:#eeeeee}
tr.even {background-color:#ECF1F8}
.double-line-above td {border-top-style: double; border-top-width: 3px}
.double-line-below td {border-bottom-style: double; border-bottom-width: 3px}

table.layout {border-style: none}
table.layout {margin: 0; padding: 0}
table.layout td, table.layout th {border-style:none; color: inherit}
table.layout td, table.layout th {vertical-align: top; padding: 0}
table.layout th {background-color: transparent}

table.code-table tr td:nth-child(1) {white-space:nowrap}

.reference {background-color: #cccccc}

.citation, .multiple-citation-links {font-size: .8em; vertical-align:top; position: relative; top: -1px; font-style: normal; font-family: arial, sans-serif}
.citation a, .citation-links a {text-decoration: none; font-weight:normal}
.citation a:hover, .citation-links a:hover {text-decoration: underline}
.citation-links {font-weight: bold; font-family: arial, sans-serif}
.citation-references {font-size: 10.5pt}
.citation-link {overflow-wrap:break-word}

.right {float: right; margin-left: 10px; margin-bottom: 10px}
.right.container {margin-left: 10px}
.left {float: left; margin-right: 10px; margin-bottom: 10px}
div.center, p.center, img.center {text-align: center !important; margin-left: auto; margin-right: auto} /* not sure if margins necessary */
img.right {clear: right} /* makes consecutive float right images go underneath each other instead of stacking to the right */
.italic {font-style: italic}
.bold {font-weight: bold}
.indent {margin-left: 30px !important}
.externallink {padding-left: 5px} /* external link icon automatically added to external links in trigger.js */
.noexternallink {} /* used to prevent external link icon on specific links or in any descendents */
.icon12 {position: relative; top: 1px}
.icon16 {position: relative; top: 3px}
img.inline {margin-right: 10px; margin-bottom: 10px}
.margin {margin-top: 0.8em !important; margin-bottom: 0.8em !important}
.SmallFont {font-size: 75% !important}
.clear {clear: both !important} /* has to be !important to override #bodytext h2 {clear:none} in template fix */
.clear-content {overflow: auto} /* overflow auto or hidden have an undocumented side effect of clearing floats from contained elements */
.image-container, .figure-container {
	border: 1px solid #CCC;
	background-color:#E3EAF4; /* tint of #3266B1 */
	box-shadow: 1px 1px 3px rgba(0,0,0,.4);
	padding:4px;
	border-radius: 4px;
}
.image-container p, .figure-container p {margin:0}
.image-container .border, .figure-container .border {border-style: none}
.image-caption {font-size: 9pt !important; margin-top: 2px; text-align: left}
.image-caption div {font-size: 7pt !important}
.image-caption div.image-caption-title {font-size: 9pt !important}
.figure-caption, .figure-container p {font-size: 85% !important; margin-top: 2px !important; text-align: left} /* normally just use a p element inside a figure-container. This means the image shouldn't be enclosed in a p otherwise it will get the top margin. */
.csv-download-link {font-size: 90%; font-weight: bold; font-family: Arial, sans-serif}
.opaque-background {background-color: white}
.center-vertically, .center-vertically * {vertical-align: middle}
.standard-border, fieldset, .fieldset, img.border {
	border: 1px solid #CCC;
}
fieldset, .fieldset {padding-left: 10px; padding-bottom: 10px}
.fieldset {position: relative}
.fieldset-legend {position: absolute; top: -0.7em; padding: 0 2px; background-color: white}
.hint-field-untouched {color: #c0c0c0}
.process-content h2 {position: relative}
.limit-height-activated {overflow: auto; border: 1px solid #CCC}
.cluster-label {font-family: arial,sans-serif; color: white; font-size: 11px;}

.fact-sheet-content {display:none}

button {cursor: pointer}
label.button {cursor: pointer}
.standard-button {
	border-width:0;
	cursor: pointer;
	text-align: center; 
	padding: 3px 20px;
	font-weight: bold; font-size: 11pt; font-family: arial;
	background-color: #7B7E57;
	border-radius:4px;
	display: inline-block; 
	text-decoration: none !important;
	white-space: nowrap;
}
.standard-button, .standard-button:link, .standard-button:visited, .standard-button:active {color: white}
.standard-button:hover {
	background-color: #9C9E81;
}

.ApplicationButtonContainer {margin-bottom: 20px; margin-left: auto; margin-right: auto}
.ApplicationButtonContainer p {text-align: center; margin-left: auto; margin-right: auto}
.ApplicationButtonContainer label, .ApplicationButtonContainer .label {white-space: normal}

.ApplicationButton {
	cursor: pointer;
	text-align: center; 
	padding: 2px;
	margin: 0 auto; 
	font-weight: bold; font-size: 14px; font-family: arial;
	/* text-shadow: 0 1px 1px rgba(0,0,0,.3); */
	background-color: #CAE3E2;
	background: linear-gradient(to bottom, #CAE3E2, #A8B1B9);
	background: -webkit-linear-gradient(top, #CAE3E2, #A8B1B9);
	background: -moz-linear-gradient(top, #CAE3E2, #A8B1B9);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#CAE3E2', endColorstr='#A8B1B9');
	border-radius:12px;
	width: 200px; 
	display: inline-block; 
	border-style: solid; border-width: 1px; border-color: #CCC; 
	text-decoration: none !important;
	white-space: nowrap;
}
.ApplicationButton, .ApplicationButton:link, .ApplicationButton:visited, .ApplicationButton:active {color: black}
.ApplicationButton:hover {
	background-color: #CAE3E2;
	background: linear-gradient(to bottom, #E5F1F1, #CAE3E2);
	background: -webkit-linear-gradient(top, #E5F1F1, #CAE3E2);
	background: -moz-linear-gradient(top, #E5F1F1, #CAE3E2);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E5F1F1', endColorstr='#CAE3E2');
}
a.ApplicationButton.download .title {text-decoration: none}
a.ApplicationButton:hover {color: black}
.ApplicationButton.disabled, .ApplicationButton.disabled:hover {
	cursor: not-allowed;
	color: #888888;
	background-color: #eeeeee;
	background: linear-gradient(to bottom, #eeeeee, #cccccc);
	background: -webkit-linear-gradient(top, #eeeeee, #cccccc);
	background: -moz-linear-gradient(top, #eeeeee, #cccccc);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#cccccc');
}

.section-button {
	position: absolute; left: -218px; top: 2px;
	cursor: pointer;
	text-align: right;
	padding-top: 2px;
	padding-bottom: 2px;
	font-weight: normal;
	font-size: 14px; font-family: arial;
	color: white;
	background-color: #7B7E57;
	border-radius:4px;
	padding-right: 13px;
	width: 175px;
}
.section-button:hover {
	background-color: #9C9E81;
}
.section-button img {
	position: absolute; left: 13px; top:4px; width: 18px; height: 14px; /* IE needs dimensions */
}

a.download {text-decoration: none}
a.download .title {text-decoration: underline}


#template-bucket {display: none}

#access a {position: absolute;}
#access li {margin: 0; list-style-image: none;}

#header a,
#header a:link,
#header a:visited {
	color: #fff;
}

#header {position: relative; height:110px; line-height: 1; overflow: hidden; color: white; background: #15404F; background-position: bottom center; background-repeat: no-repeat}
#header {background-image: url("../../template/images/header-bg.jpg");}
.application #header {background-image: url("../../template/images/header-bg-wide.jpg");}
#header-print {display: none; font-size: 15px}
#header-print div {padding-top: 15px}
#header-print #qldgovt-print {position: absolute; right: 0; height: 90px}
#header-print hr {margin: 0}

#nav-site {
	position:relative;
	color: #545454;
	padding: 0 0 0 10px;
}
#nav-site-bg {position:absolute; height: 30px; left: 0; right: 0; background-color:#86954A; background-image:url(../../template/images/top-menu-shade.png); background-repeat: repeat-x; /* used to be #86954A */}
#nav-site a, #nav-site a:link, #nav-site a:visited {color: black;}
#nav-site ul {
	font-size: 11pt;
	position: relative;
}
#nav-site ul li {
	padding: 0;
	margin: 0 5px 2px 0;
	background-color: white; background-image:url(../../template/images/top-menu-shade.png); background-repeat: repeat-x;
	border: 4px solid #9C9E81;
	border-style: none none solid none;
	border-radius:4px;
	-webkit-border-radius:5px; /* need this to work around bug in chrome */
}
#nav-site ul li a {
	padding: 0 20px;
	/* need the following to hide border radius rendering problems in chrome and safari: */
	/*
	margin-left: -4px; margin-right: -4px;
	background-color: white;
	border-top-right-radius:4px;
	border-top-left-radius:4px;
	*/
}
#nav-site ul li {height: 30px}
#nav-site ul li a {line-height: 30px}
#nav-site ul li.open {
	background-image: none;
	border-bottom-style: none;
	border-bottom-right-radius:0;
	border-bottom-left-radius:0;
	height: 34px; /* prevent floating buttons getting caught underneath */
}
#nav-site a:hover, #nav-site a:focus {
	color: #985420;
	text-decoration: none;
}

#sitehelp {font-size:14px; position:absolute; bottom:73px; right:350px; z-index:3; padding:5px}
#sitehelp span {padding: 0 3px}
#sitehelp, #sitehelp a:link {color:#FFF; text-decoration:none}
#sitehelp a:hover {color:#FFF; text-decoration:underline}

#search {font-size: 10pt; position:absolute; z-index:3; bottom:69px; right:15px}
#search label {display:none; color:#FFF; font-weight:bold}
#search input, #search button {vertical-align: middle; border:1px solid #000}
#search #searchbox {width:220px; font-size: 12pt; line-height: 1.8; height: 30px; padding: 0 6px; border-radius: 5px; border-color: gray; border-width: 1px; border-style: solid}
#search #searchsubmit {padding: 0 5px; height: 30px; background-color: #3D4B56; color:white; font-size:12pt; border-color: white; border-width: 1px; border-style: solid; border-radius:5px; cursor:pointer; text-align: center}
#search #searchsubmit:hover {background-color:#516473}
.filter-search-button {padding: 5px 40px; font-size: 16pt} /* button that used to be called "Refresh list based on current filters" */

#depname {position: absolute; bottom: 14px; right: 16px; z-index:3; font-size:17pt; font-family: "Arial Narrow", Arial; font-weight:normal; letter-spacing: 0.08ch; text-decoration:none}
#qldgovt {position: absolute; top: 5px; left: 8px; z-index:3}
#headermask {position: absolute; z-index: 2}
#wetlandinfo-logo {position: absolute; bottom: 17px; left: 12px; z-index: 2}
#wetlandinfo-logo a {font-size: 22px; color: white; font-weight: bold; text-decoration: none}

#intro-box {margin-bottom: 20px}
#intro-box h2 {
	position:relative;
	margin-top: 0.3em !important;
	margin-bottom: 0.2em;
}
#left-side-content {
	margin-right: 520px;
}
#right-side-content {
	/* We have to position with absolute instead of float as we want it to fall under the left side content when too narrow. As a consequence we need a script to give #intro-box a min-height equal to height of #right-side-content */
	/* float:right; margin-left:15px; */
	position:absolute; top:10px; right:10px;
}
#feature-photo-column {
	float:left;
}
#feature-photo {
	display: inline-block; /* avoid extra white border to the right if it is narrower than the page content button */
}
#feature-photo .image-container {
	background-color:white;
}
#feature-photo p {
	margin-top: 0;
}

#quick-facts {
	float:left;
	width: 200px;
	border-left: 1px dashed black;
	padding-left: 15px;
	margin-left: 15px;
	font-size: 10pt;
}
#quick-facts h2 {
	margin: 0 0 5px 0;
	font-family: Verdana, sans-serif;
	font-size: 10pt;
	font-weight: bold;
}
#quick-facts dl {margin:0}
#quick-facts dt {
	font-size:16pt;
	margin: 0;
	font-weight: bold;
}
#quick-facts dt:nth-child(1) {color: #7B7E57}
#quick-facts dt:nth-child(3) {color: #CB702B}
#quick-facts dt:nth-child(5) {color: #E4AB37}
#quick-facts dt:nth-child(7) {color: #4D7886}
#quick-facts dt:nth-child(9) {color: #7B7E57}
#quick-facts dt:nth-child(11) {color: #CB702B}
#quick-facts dt:nth-child(13) {color: #E4AB37}
#quick-facts dt:nth-child(15) {color: #4D7886}
#quick-facts dd {
	margin: 0 0 5px 0;
}

#mainarea {position:relative; clear:both; overflow: visible; padding: 5px 0 10px;}


#column-layout {width:100%; border-style:none; margin: 0}
#column-layout-column-left {width:1px} /* keeps it to minimum width possible (note IE7- doesn't recognise width:0) */
#column-layout-column-right {max-width:1px}
	/* This is a quirky workaround for the problem that overflow-wrap:break-word doesn't work in a table cell,
	 * which caused citations with long lines to produce a horizontal scrollbar when the window is full width.
	 * There is a solution suggested in https://stackoverflow.com/questions/5889508/using-word-wrap-break-word-within-a-table
	 * to set table-layout:fixed on the table but that results in undesired effects.
	 * The max-width:1px workaround was found in https://stackoverflow.com/questions/1258416/word-wrap-in-an-html-table
	 * We have to clear this rule when changing the cell to display:block when reducing the screen size, as it actually results in the cell being 1px
	 */
.column-layout-column {border-style:none; vertical-align: top; padding: 0}
#column-layout-left {
	width: 260px;
	margin: 0 20px 0 10px;
}
#column-layout-content {
	margin: 0 10px;
}
#page-not-found #breadcrumbs {display:none}

.container, .box {
	overflow: visible;
	position: relative;
	border: 1px solid #CCC;
	border-radius: 5px;
	padding: 10px;
	margin-left: -10px;
}
.container.left  {margin-left: 0}
.box {
	background-color: #EFF1F3; /* tint of #516473 */
	background-image: url("../../template/images/box-background.jpg");
	background-position: top center;
	padding-left: 20px;
}
.solid-background {
	background-color: #E3EAF4; /* tint of #3266B1 */
	background-image: none;
}
.container h2 {margin-top: 0; margin-bottom: 10px} /* reduce top margin of h2 a little when it is the first heading */
.container h2.top-bar, .container h3.top-bar {
	min-height: 28px;
	margin:-10px -10px 10px -10px !important;
	padding: 3px 3px 5px 10px;
	font-weight: normal;
	background-color: #DFD9BC;
	background: linear-gradient(to bottom, #FFFFFF, #DFD9BC);
	background: -webkit-linear-gradient(top, #FFFFFF, #DFD9BC);
	background: -moz-linear-gradient(top, #FFFFFF, #DFD9BC);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#DFD9BC');
	border-top-left-radius:5px;
	border-top-right-radius:5px;
}
.container .top-bar.containing-tabs {
	/* very hacky but will be removing tabs soon */
	height: 28px;
	overflow:hidden;
}

.container h3.top-bar {
	DISABLED_font-size: 13pt;
	font-weight: bold;
}
.scrollbar {
	overflow: auto;
}
.container .scrollbar {
	margin:-10px;
	padding:0 10px;
}
.side-by-side-containers .container, .side-by-side-containers .image-container, .side-by-side-containers .figure-container {
	display: inline-block; vertical-align: top; margin-left: 0; margin-right: 10px; margin-bottom: 10px
}
.side-by-side-containers .container:last-child, .side-by-side-containers .image-container:last-child, .side-by-side-containers .figure-container:last-child {
	margin-right: 0
}
.vertical-images .image-container {margin-top:15px; margin-bottom:15px}

.side-by-side-containersb .container, .side-by-side-containersb .image-container, .side-by-side-containersb .figure-container {
	display: inline-block; vertical-align: top; margin-left: 0; margin-right: 0; margin-bottom: 10px; background-color: #FFFFFF
}

#breadcrumbs-placeholder-wide {height:2.9em}
#breadcrumbs {
	padding: 10px 10px 15px;
	width: auto; /* override width:100% in default cue layout that causes problems in combination with the padding */
	clear: none; /* override clear:both in qg.css */
	font-size: 11pt;
	color: #545454;
}
#breadcrumbs ol {
	margin-left: 0;
}
#breadcrumbs li {
	margin: 0;
	padding: 0 12px 0 15px;
	background: transparent url(../../template/images/breadcrumb.png) left center no-repeat;
	white-space: nowrap;
}
#breadcrumbs li:first-child {
	background: none;
	padding-left:0;
}
#breadcrumbs a {
	text-decoration:none;
	padding: 0; /* undo stupid padding in qg.css */
}
#breadcrumbs a:hover {text-decoration:underline}

#navtag-container {position: relative}
#navtag {position: absolute; z-index: 9999; overflow: hidden; display: none; border: 1px solid #CCC; height: 340px; min-width: 550px; min-height: 150px; top: 0px; left: 20px; right: 10px; padding-left: 20px; padding-right: 10px; box-shadow: 4px 4px 4px rgba(0,0,0,.4);}
#navtag .zero-delta {color: gray}
#navtag-current-list {width: 378px; overflow: hidden; background-color: white}
#navtag-current-list ul {list-style-type: none; list-style-image: none; padding-left: 5px}
#navtag-current-list li {margin-left: 0}
#navtag-links-container {position: absolute; top: 38px; left: 430px; bottom: 10px; right: 10px; background-color: white; overflow: auto}
#navtag-instructions {margin-top: 0}
#navtag-new-tag {width: 310px}
#navtag-total {margin-top: 0}
#navtag-close {position: absolute; top: 7px; right: 6px; cursor: pointer}
#navtag-open {padding: 2px 0; text-align: center; float:right; margin-right: 10px; display: none;}
#navtag-open {border-radius:5px}
#navtag-open a {padding:4px 10px}
#page-section-links-toggle.disabled a:hover {text-decoration:none; cursor:not-allowed}
.ui-autocomplete {font-size: 10pt !important; max-height: 300px; max-width: 800px; overflow-y: auto; overflow-x: hidden; white-space: nowrap}
  

.nav-box {font-size: 11pt}
.nav-box .li {position: relative}
.nav-box a {color:white; display:block; text-decoration:none}
.nav-box a:hover {text-decoration: underline; cursor:pointer}
.nav-box .ul .li {font-size: 96%; border-style: none}
/*.nav-box .ul {margin-left: 10px}*/

#page-section-links {position: relative; margin-top: 5px}
#page-section-links a {padding:4px 10px}
#page-section-links-toggle {padding: 2px 0; text-align: center}
#page-section-links-toggle {border-radius:5px}
#page-section-links-toggle.disabled {background-color: #9C9E81}
#page-section-links-toggle.disabled a:hover {text-decoration:none; cursor:not-allowed}
#page-section-links-list {position: absolute; top: 29px; left: 0; padding: 8px 0; white-space: nowrap; border: 1px solid white; border-left-width: 0}
#page-section-links-list {display:none; z-index: 9000} /* z-index must be higher than draggable map */
#page-section-links-list {
	border-top-right-radius:5px;
	border-bottom-left-radius:5px;
	border-bottom-right-radius:5px;
}
#page-section-links-list .li {padding-left: 15px; background-image: url("../../template/images/menu-bullet.png"); background-repeat: no-repeat; background-size: 9px 9px; background-position: 9px 11px}

/* above left menu:
#page-section-links {float: left; position: relative; width: 260px; margin: 5px 30px 0 0}
#page-section-links a {padding:4px 10px}
#page-section-links-toggle {padding: 2px 0}
#page-section-links-toggle {
	border-top-right-radius:5px;
	border-bottom-right-radius:5px;
}
#page-section-links-toggle.disabled {background-color: #9C9E81}
#page-section-links-toggle.disabled a:hover {text-decoration:none; cursor:not-allowed}
#page-section-links-list {position: absolute; top: 29px; left: 0; padding: 8px 0; white-space: nowrap; border: 1px solid white; border-left-width: 0}
#page-section-links-list {display:none; z-index: 9000} *//* z-index must be higher than draggable map *//*
#page-section-links-list {
	border-top-right-radius:5px;
	border-bottom-left-radius:5px;
	border-bottom-right-radius:5px;
}
#page-section-links-list .li {padding-left: 15px; background-image: url("../../template/images/menu-bullet.png"); background-repeat: no-repeat; background-size: 9px 9px; background-position: 9px 11px}
#breadcrumbs {margin-left: 280px}
*/

/* right-hand-side button:
#page-section-links {margin-right: 10px; float: right; position: relative}
#page-section-links a {padding:4px 10px}
#page-section-links-toggle {padding: 2px 0; border-radius:5px}
#page-section-links-toggle.disabled {background-color: #9C9E81}
#page-section-links-toggle.disabled a:hover {text-decoration:none; cursor:not-allowed}
#page-section-links-list {position: absolute; top: 29px; right: 0; z-index: 1; padding: 8px 0; white-space: nowrap; border-top: 1px solid white}
#page-section-links-list {display:none}
#page-section-links-list {
	border-top-left-radius:5px;
	border-bottom-left-radius:5px;
	border-bottom-right-radius:5px;
}
#page-section-links-list .li {padding-left: 15px; background-image: url("../../template/images/menu-bullet.png"); background-repeat: no-repeat; background-size: 9px 9px; background-position: 9px 11px}
*/

#column-layout-left {margin-left: 0}
#secondarynav {padding: 4px 0; margin-left: 0; position: relative}
#secondarynav {
	border-top-right-radius:5px;
	border-bottom-right-radius:5px;
}
#secondarynav {position: relative; z-index: 1} /* show on top of section buttons */
#secondarynav a {padding:4px 4px 4px 24px}
/* The following allows the hierarchical gradient colour to extend across the whole width, which isn't possible using .nav-box .ul {margin-left: 10px} */
#secondarynav .ul a,
#secondarynav .ul .xcm {margin-left:10px}
#secondarynav .ul .ul a,
#secondarynav .ul .ul .xcm {margin-left:20px}
#secondarynav .ul .ul .ul a,
#secondarynav .ul .ul .ul .xcm {margin-left:30px}
#secondarynav .ul .ul .ul .ul a,
#secondarynav .ul .ul .ul .ul .xcm {margin-left:40px}
#secondarynav .ul .ul .ul .ul .ul a,
#secondarynav .ul .ul .ul .ul .ul .xcm {margin-left:50px}
#secondarynav .ul .ul .ul .ul .ul .ul a,
#secondarynav .ul .ul .ul .ul .ul .ul .xcm {margin-left:60px}
#secondarynav .ul .ul .ul .ul .ul .ul .ul a,
#secondarynav .ul .ul .ul .ul .ul .ul .ul .xcm {margin-left:70px}
#secondarynav .ul .ul .ul .ul .ul .ul .ul .ul a,
#secondarynav .ul .ul .ul .ul .ul .ul .ul .ul .xcm {margin-left:80px}
#secondarynav .ul .ul .ul .ul .ul .ul .ul .ul .ul a,
#secondarynav .ul .ul .ul .ul .ul .ul .ul .ul .ul .xcm {margin-left:90px}

#secondarynav a.highlight {color: black; background-color:white}
#secondarynav a.highlight:hover {text-decoration:none}
#secondarynav-hider {border-radius:5px; background-color: #86954A; position: absolute; right:-7px; top:7px; border: 1px solid white; border-right-width:0; font-size: 20px; font-weight:bold; color: white; line-height: 30px; padding:0 3px 2px 2px; cursor:pointer; z-index:1}
#rehab-bookmark {
	margin-left:0;
	margin-bottom:10px;
	color:white;
	position: relative; z-index: 1; /* show on top of section buttons */
}
#rehab-bookmark a {
	color:white;
}
#rehab-bookmark button {
	padding: 0 10px;
	margin-top: 10px;
}
#unlimited-width-button {display:none; border-radius:5px; background-color: white; border: 1px solid #CCC; font-weight: normal; font-size: 10px; color: #3d3d3d; line-height: 16px; cursor:pointer; vertical-align: middle; margin-left: 15px; padding: 0 3px}
/* +/- control */
.xcm {position: absolute; left: -2px; top: 0; width: 29px; height: 29px; background-repeat: no-repeat; background-position: center; background-size: 9px 9px}
.xcb {background-image:url("../../template/images/menu-bullet.png")}
.xcx {background-image:url("../../template/images/menu-expander-hidden.png")}
.xcc {background-image:url("../../template/images/menu-expander-displayed.png")}
.xcb.onwhite {background-image:url("../../template/images/menu-bullet-onwhite.png")}
.xcx.onwhite {background-image:url("../../template/images/menu-expander-hidden-onwhite.png")}
.xcc.onwhite {background-image:url("../../template/images/menu-expander-displayed-onwhite.png")}
.plusminusstyle .xcb {background-image:url("../../template/images/list-exp-2-bullet-36.png")}
.plusminusstyle .xcx {background-image:url("../../template/images/list-exp-2-plus-36.png")}
.plusminusstyle .xcc {background-image:url("../../template/images/list-exp-2-minus-36.png")}
.xcx, .xcc {cursor: pointer}
#ArchiverLink {background-image: url("../../template/images/externallink.gif")}

#end-content-line {margin-top: 22px}

#updated {clear: both; margin: 22px 0 0}

#share-buttons-placeholder {position: relative}
#share-buttons {position: absolute; right: 0; bottom: -10px}
#share-buttons a {display: block; padding: 0; float: left; margin-right: 10px; height: 20px; font-size: 10px; color: #202020; position: relative; background-color: #f0f0f0; border: 1px solid #CCC; border-radius: 3px; cursor: pointer}
#share-buttons a:hover {background-color: white; text-decoration: none}
#share-buttons a img {position: absolute; left: 7px; top: 3px}
#share-buttons a span {position: absolute; right: 8px; top: 3px}
#share-buttons #share-button-email img {top: 4px}
#share-buttons #share-button-email {width: 70px}
#share-buttons #share-button-facebook {width: 66px}
#share-buttons #share-button-twitter {width: 65px}

#citation-guide {clear: both; margin-top: 22px; font-size: 0.8em}

#footer {
	position:relative;
	height: 130px;
	clear:both;
	margin: 20px auto 0;
	padding: 10px;
	background-color:#15404F;
	/*background-image: url("../../template/images/ehp-footer-branding-ext-60898f.png");*/
	background-repeat: repeat-x;
	background-position: bottom center;
	text-align:center;
	color:#FFF;
	font-size:12px;
	line-height:16px;
}
.application #footer {margin: 0; height: 89px}
.application #footer-legal-notices {padding-top: 12px}
.application #footer-copyright {padding-top: 12px}
.application #footer-copyright p {margin-bottom: 6px}
.application #footer-qwp-logo {height: 80%}
#footer a {color:#FFF; text-decoration:none}
#footer a:hover {text-decoration:underline}
#footer ul {margin:0 auto}
#footer ul li {display:inline; margin: 0; padding: 0}
#footer ul li + li {padding-left:18px}
#footer #footer-legal-notices a {padding-left:0; padding-right:0} /* remove internal padding specified in qg.css otherwise accessibility audit complains there is not enough space between the links */
#footer-legal-notices {padding: 20px 0 0}
#footer-copyright {padding: 30px 0 0}
#footer-copyright p {margin: 0}
#footer-copyright #copyright {margin-bottom: 16px}
#footer div {position: relative; z-index: 1}
#footer-qwp-logo {position: absolute; top: 7px; right: 40px}

#footer-share-buttons {position: absolute !important; bottom: 15px; left: 15px}
#footer-share-buttons a {display: block; padding: 0; float: left; margin-right: 10px; height: 20px; font-size: 10px; color: #202020; position: relative; background-color: #d0d0d0; border: 1px solid #CCC; border-radius: 3px; cursor: pointer}
#footer-share-buttons a {box-shadow: 0 0 2px rgba(0,0,0,.4);}
#footer-share-buttons a:hover {background-color: white; text-decoration: none}
#footer-share-buttons a img {position: absolute; left: 7px; top: 3px}
#footer-share-buttons a span {position: absolute; right: 8px; top: 2px}
#footer-share-buttons #footer-email-button img {top: 4px}
#footer-share-buttons #footer-email-button {width: 70px}
#footer-share-buttons #footer-facebook-button {width: 66px}
#footer-share-buttons #footer-twitter-button {width: 65px}
#footer-share-buttons {top: -30px; bottom: auto; left: 10px}
#footer-share-buttons a {box-shadow: none; background-color: #f0f0f0}


.print-only, .pdf-only {display: none}

/* used in development only: */ 
.page-segment {
	border: 2px dashed orange;
}
#quick-facts.page-segment {
	clear:left; float:none;
}

/* Page specific: */

.publication {clear: both; margin-top:20px; overflow:auto} /* overflow:auto does same as .clear-content */
/* NOTE use class="publication container solid-background" to make publications into shaded boxes */
.publication-screenshot {float: left; margin-right: 20px; margin-bottom: 10px; position:relative}
.publication-description {display:table} /* workaround to ensure bullet points are floated properly and works better than overflow:hidden which breaks the float in narrow windows. See http://stackoverflow.com/questions/710158/why-do-my-list-item-bullets-overlap-floating-elements */
.publication .publication-title {margin-top: 0; font-weight: normal}
.publication .publisher {margin-bottom: 0} /* normally removes margin only if followed by .duration */
.publication .duration {margin-top: 0} /* normally removes margin only if precedded by .publisher */
.publication .play-link {position: absolute; top:0; right:0; bottom:0; left:0}
.publication.video .play-link:hover, .publication.video .play-link.hover {background-image: url("../../images/resources/videos/play-overlay.png"); background-repeat: no-repeat; background-position: center}
.publication.catchment-story .play-link {position: static}

.card-container {
	width: 250px;
	display: inline-block;
	margin: 10px 20px 10px 0;
	vertical-align: top;
	background-color: #EFF1F3;
	border-bottom: 1px solid #CCC;
}
.card-container .card-container-pict {
	width: 100%;
}
.card-container .card-container-desc {
	display: inline-block;
	position: relative;
	margin-top: 10px;
	padding-right: 15px;
	padding-left: 15px;
	margin-bottom: 20px;
}

.Error {color: red; font-weight: bold}
#page-search {width: 600px}
#page-search-results {width: 100%; height: 155px; overflow: auto}
.clickable #map_canvas * {cursor: pointer} /* required on every page with google maps */
td > h3:first-child, th > h3:first-child {margin-top: 0 !important; margin-bottom: 0 !important} /* required for stressor model pages but also appears elsewhere */
#FeatureFrog {width: 540px; padding: 10px 15px 10px 10px; margin-top: 30px; font-size: 12px; font-weight: bold; color: #336600; border:1px solid #336600}
#FeatureFrog  .center .image-caption {text-align: center}
.WhereStartBox {width: 430px; border:1px solid #CCC; padding: 0 10px 15px 20px; margin-top: 10px; margin-bottom: 20px}
.conceptual-model-diagram-instructions {margin: 15px 0; font-weight: bold}
.conceptual-model-legend {display: none}
.conceptual-model-application-buttons .ApplicationButton {width: 330px; margin-bottom: 10px}
.ConceptualModelButtons {margin: 20px; text-align: center}
.ConceptualModelButtons img {margin-left: 10px; margin-right: 10px; margin-bottom: 10px}
.ConceptualModelRightImages {float: right; margin-left: 10px; background-color: white}
.ConceptualModelRightImages img {margin-bottom: 30px}
.ConceptualModelClientTabsContainer {width: 900px; margin-top: 20px; position: relative}

/* invertebrate pages */
.species-sub-class {margin: 20px 0 0 40px; padding: 10px 20px 20px 20px}
.species-sub-class {display:inline-block} /* prevents floated content from hanging over the bottom edge */
.species-sub-class.cls1 {background-color: #FAFAFC; margin-left:0}
.species-sub-class.cls2 {background-color: #EEEFEF}
.species-sub-class.cls3 {background-color: #E3E4E5}
.species-sub-class.cls4 {background-color: #DCDCDD}
.species-sub-class h3 {font-style: italic; font-size: 11pt}
.species-sub-class .image-container {background-color: #D3D3D3; border-radius: 0px; box-shadow: none; border: none; margin: 0px 0px 10px 10px}
.species-sub-class .image-caption {padding: 4px}

ul.top-bar-tabs {
	display: block;
	overflow: auto;
	position:relative;
	color: black;
	font-size: 11pt;
}
ul.top-bar-tabs a, ul.top-bar-tabs a:link, ul.top-bar-tabs a:visited {color: #545454; font-family: Trebuchet MS, sans-serif; font-size: 15pt}
ul.top-bar-tabs li {
	display: block;
	float: left;
	white-space: nowrap;
	padding: 0;
	margin: 0 10px 0 0;
	background-color: #DFD9BC;
	border-top-left-radius:4px; border-top-right-radius:4px;
	border-style: solid;
	border-width: 1px;
	border-color: #CCC;
	border-bottom-width: 0;
}
ul.top-bar-tabs li a {
	padding: 0 12px;
}
ul.top-bar-tabs li {height: 35px} /* a little more that needed but overflow is hidden */
ul.top-bar-tabs li a {line-height: 30px; text-decoration: none}
ul.top-bar-tabs li.open {background-image: none; background-color: white;}
ul.top-bar-tabs a:hover, ul.top-bar-tabs a:focus {text-decoration: underline}
ul.top-bar-tabs li.open a:hover, ul.top-bar-tabs li.open a:focus {text-decoration: none}


ul.horizontal-tabs {
	display: block;
	overflow: auto;
	position:relative;
	color: black;
	font-size: 11pt;
	margin-top: 15px;
	margin-bottom: 20px;
}
ul.horizontal-tabs a, ul.horizontal-tabs a:link, ul.horizontal-tabs a:visited {color: white}
ul.horizontal-tabs li {
	display: block;
	float: left;
	white-space: nowrap;
	padding: 0;
	margin: 0 5px 2px 0;
	background-color: #7B7E57;
	/*
	background-image:url(../../template/images/top-menu-shade.png); background-repeat: repeat-x;
	border: 4px solid #9C9E81;
	*/
	border-radius:4px;
	-webkit-border-radius:5px; /* need this to work around bug in chrome */
	border-style: solid;
	border-width: 1px;
	border-color: #7B7E57;
	border-bottom-width: 4px;
	border-bottom-color: #9C9E81;
}
ul.horizontal-tabs li a {
	padding: 0 12px;
}
ul.horizontal-tabs li {height: 30px}
ul.horizontal-tabs li a {line-height: 30px; text-decoration: none}
ul.horizontal-tabs li.open a, ul.horizontal-tabs li.open a:link, ul.horizontal-tabs li.open a:visited {color: black}
ul.horizontal-tabs li.open {
	background-image: none;
	background-color: white;
	border-color: #cccccc;
	border-bottom-color: white; /* don't make style=none as that causes undesired stacking of the following left floated tab */
	/* border-bottom-right-radius:0; border-bottom-left-radius:0; */
}
ul.horizontal-tabs a:hover, ul.horizontal-tabs a:focus {text-decoration: underline}
ul.horizontal-tabs li.open a:hover, ul.horizontal-tabs li.open a:focus {text-decoration: none}

.HoverImage {display: none; position: absolute; z-index: 2}
.HoverImage img {display: block; position: absolute; max-width:none}
.HoverWindows {position: relative; margin-top: 10px}
.HoverWindow {position: absolute; z-index: 1000} /* rely on script to hide all initially, otherwise google excludes hover content from search ranking */
.HoverWindowDefault {display: block}
.HoverWindow {
	background-color: #ECF3F5; /* variant of 67A0B3 */
	box-shadow: 4px 4px 4px rgba(0,0,0,.4);
	border-style: solid; border-width: 1px; border-color: #CCC;
	padding: 10px;
	font-size: 8pt; font-family: arial
}
.HoverWindow h3 {margin-top: 0 !important; margin-bottom: 0.5em !important; color: black !important}

.Legend {border-style: none; margin-top: 0; font-family: Arial, sans-serif; font-size: 75%; width:100%}
.Legend caption {text-align: left; font-weight: bold; padding-top: 15px; padding-bottom: 3px; font-size: 125%}
.Legend td {vertical-align: baseline; padding: 0; border-style: none}
.Legend .label {width: 20px; padding-right: 4px; text-align: right}

.clickable div * {cursor: pointer}
.wait, .wait * {cursor: wait !important}

.table-of-contents *, #bodytext .table-of-contents * {margin-top: 0; margin-bottom: 0}
.table-of-contents > li, #bodytext .table-of-contents > li {margin-top: 0.5em}

#AreaGroups td.label {vertical-align: top}
#AreaGroups .AreaGroup {padding-right: 15px; padding-bottom: 10px; float: left}
#AreaGroups .AreaGroup table {font-size: 85.7%; margin: 0} /* setting width:100% makes it look better but needs to be removed for IE7- */
#AreaGroups .AreaGroup table td {padding: 5px 10px 10px; border-style: none}
#AreaGroups .AreaGroup .table-caption {font-weight: bold; white-space: nowrap; padding-bottom: 3px} /* Use div.table-caption instead of proper table caption because IE uses absolute positioning for captions causing overlapping floating neighbours */
#AreaGroups .AreaGroup div {white-space: nowrap}

.product-selector .input-box {float:left; margin-right: 20px; width: 200px}
.product-selector .heading {font-weight: bold; height: 45px}
.product-selector select {height: 150px; width: 100%; border: 1px solid #CCC;}
.product-selector h3 {clear: left; padding-top: 20px; margin-bottom: 0}
.product-selector .products {clear: left; width: 860px; height: 200px; border: 1px solid #CCC; overflow: auto}

.indented-quote {margin: 20px 60px; font-family: serif}

.collapsible-list {list-style-type: none; list-style-image: none; padding-left: 0}
.collapsible-list > li {
	position:relative;
	background-image: url("../../template/images/list-expander-nobullet.png");
	background-size: 9px 9px;
	background-repeat: no-repeat;
	background-position: 5px 6px;
	padding-left: 22px;
	margin-left: 0;
	margin: 2px 0;
}
.collapsible-list.with-bullets > li {background-image: url("../../template/images/list-expander-bullet.png")} /* has to come before the collapsible-list-open and collapsible-list-closed styles so they take precedence */
.collapsible-list > li.collapsible-list-open {background-image: url("../../template/images/list-expander-displayed.png")}
.collapsible-list > li.collapsible-list-closed {background-image:url("../../template/images/list-expander-hidden.png")}
.collapsible-list li.placeholder > a {color:#aaa}
.collapsible-list .clickable {position: absolute; top: 0; left: 0; right: 0; height: 1.5em; width: 22px; cursor:pointer}
.collapsible-list .clickable.clickable-bullet-only {width: 22px} /* override width:auto if specified on the page and if the list item contains a link. Not used at present */
/* .collapsible-list .clickable {width:auto} *//* add this to any specific page to make the whole line clickable */

/* Use class="collapsible-list plusminusstyle" to use plus and minus instead of the newer triangle styles. */
.collapsible-list.plusminusstyle > li {background-image: url("../../template/images/list-exp-bullet-36.png")}
.collapsible-list.plusminusstyle > li.collapsible-list-open {background-image: url("../../template/images/list-exp-minus-36.png")}
.collapsible-list.plusminusstyle > li.collapsible-list-closed {background-image:url("../../template/images/list-exp-plus-36.png")}

.collapsible-list.normalbulletstyle > li {background-image: url("../../template/images/list-expander-bullet.png")} /* has to come after plusminusstyle as they can be combined */


.noflash {background-color:#ccc}
.noflash .message {margin:0 auto; max-width: 480px; text-align:center}

#hamburger-menu {display:none; width: 37px; height: 35px; background-image: url("../../template/images/hamburger-menu-icon.png"); background-size: 24px 24px; background-repeat: no-repeat; background-position: center; float:left; margin: 4px 10px 0 10px; background-color: #86954A; border:none; font-size:18pt; border-radius:5px; cursor:pointer}
#hamburger-menu {padding: 0} /* required for ios safari */

.cubetray {
	display: inline-block;
	overflow: hidden;
	margin-left: -10px;
	margin-top: -10px;
}
.cubetray > a > div {
	margin: 10px;
	float: left;
	position: relative;
	width: 225px;
	height: 225px;
	background-size: cover;
	background-position: center;
	background-color: rgba(20,20,20,.3);
	background-blend-mode: multiply;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	transition: all 0.5s ease;
	box-shadow: 1px 1px 3px rgba(0,0,0,.4);
}

.cubetray > a.noexternallink > div:after {
	/* this adds the external link indicated when the link DOES have class noexternallink. This is because the class is needed to prevent the default indicater after an internal link, so we assume an internal link doesn't have the class. */
	position: absolute;
	width: 13px;
	height: 13px;
	content: url(../../template/images/externallink-white.png);
	top: 5px;
	right: 5px;
}
.cubetray > a > div:hover, .cubetray > a.hover > div {
	background-color: rgba(20,20,20,0);
}
.cubetray > a > div > div {
	position: absolute;
	bottom: 20px;
	left: 20px;
	right: 0px;
	background-color: #86954A;
	color: white;
	padding: 10px;
}

.cubetray > a:focus > div > div {outline:2px solid #f8be4c;}

div.cubetray-blue > a > div > div {background-color: #3266B1}
div.cubetray-yellow > a > div > div {background-color: #B58E11}

div.cubetray-150 {font-size: 14px; margin-left: -1px; margin-top: -1px}
div.cubetray-150 > a > div {width: 150px; height: 150px; margin: 2px}
div.cubetray-150 > a > div > div {bottom:6px; left:6px; padding:1px}
div.cubetray-150 > a:focus > div > div {outline-width:1px}

div.cubetray-170 {font-size: 14px}
div.cubetray-170 > a > div {width: 170px; height: 170px;}

div.cubetray-200 > a > div {width: 200px; height: 200px;}

div.cubetray-treatment-systems {font-size: 10px; margin-left:0; margin-top:0}
div.cubetray-treatment-systems > a > div {width: 150px; height: 150px; float: none}

/* butcen not used */
div.cubetray-butcen {font-size: 14px; margin-left: -1px; margin-top: -1px; display:flex; align-items:center}
div.cubetray-butcen > a > div {width: 200px; height: 200px; margin: 60px; background-color: rgba(227,234,244,.3);}
div.cubetray-butcen > a > div > div {bottom:6px; left:6px; padding:1px}


.embedded-frame #header, .embedded-frame #nav-site, .embedded-frame #hamburger-menu, .embedded-frame #column-layout-column-left, .embedded-frame #share-buttons, .embedded-frame #footer {display:none}

@media (max-width: 1264px) {
	#column-layout, #column-layout > tbody, #column-layout > tbody > tr, .column-layout-column {display: block}
	#column-layout-column-right {max-width:none}
	#column-layout-column-left {width: auto !important; margin: 0 0 10px 10px !important}
	#column-layout-left {width: auto !important; margin-right: 10px !important}
	#column-layout-content {width: auto}
	.container, .box {margin-left: 0 !important}
	#nav-site {display: none}
	#nav-site {margin-top:5px}

	#nav-site-bg {display: none}
	#nav-site a, #nav-site a:link, #nav-site a:visited {color: white; line-height: 28px}
	#nav-site {padding-left: 0}
	#nav-site ul li {margin: 0 1px 1px 0; background-color: #86954A; background-image:none; border-style: none; border-radius:0}
	#nav-site ul li.open {height:30px; background-color: #e0e0e0}
	#nav-site ul li.open a {color:black}
	#nav-site a:hover, #nav-site a:focus {color: white; text-decoration:underline}
	#nav-site ul li a {padding: 0 10px}

	#footer-qwp-logo {opacity: 0.5}
	#hamburger-menu {display:block}
	#secondarynav {border-radius:5px; margin-top:0; display:none}
	#page-section-links-list {white-space: normal !important} /* not sure why it's nowrap by default, probably not necessary */
}
@media (max-width: 1000px) {
	/* calibrated for WetlandSumary detail pages */
	#NameIndexContainerBox {float: left; margin-left: 0}
	#intro-box-content {clear: both}
}
@media (max-width: 940px) {
	#header {height:180px;}
	#sitehelp {left: 5px; right: auto}
}
@media (max-width: 850px) {
	#intro-box #right-side-content {position:static}
	#intro-box #left-side-content {margin-right: 0 !important}
} 
.compact-view {display:none}
@media (max-width: 700px) {
	#header {height:185px;}
	#qldgovt img {height:35px}
	#sitehelp {bottom: 120px}
	#search {left: 10px; bottom: 75px; white-space: nowrap}
	#search #searchsubmit {width: 32px; background-image: url("../../template/images/search-icon.png"); background-size: 18px 18px; background-repeat: no-repeat; background-position: center; text-indent: 100px; white-space: nowrap; overflow: hidden;}
	#wetlandinfo-logo {bottom: 37px}
	#depname {left: 12px; font-size:8.5pt}
	.citation-link {word-break:break-all}
	.citation-link-container::before {content:""; display:block}
	#footer {height:auto !important; min-height: 130px}
	#footer ul li {display:block !important}
	#footer-legal-notices {padding-top: 0 !important}
	#footer-qwp-logo {right: auto; top: 20px !important; left:10px}
	.standard-button {white-space:normal}
	.xcx, .xcc, .xcb {background-size: 13px 13px}
	#secondarynav a {padding-left: 28px}
}
@media (max-width: 530px) {
	.box {padding-left: 10px !important} /* added for wetlandsummary detail page */
	#page-section-links-toggle {width: auto !important}
	.ApplicationButton {width: auto !important; white-space:normal !important; padding-left: 10px; padding-right: 10px}
}
@media print {
	.no-print {display: none}
	.print-only {display: block}
	body {font-size: 12px}
	body, #mainarea, #footer, #updated {background: none !important}
	#header, #nav-site, #secondarynav, #column-layout-left, #unlimited-width-button, #share-buttons, #footer-share-buttons, #footer-legal-notices, #qldgovlink, .externallink, #page-section-links, #breadcrumbs h2 {
		display: none
	}
	.icon13 {display: none}
	#header-print {display: block}
	#breadcrumbs {margin: 0 0 10px}
	#breadcrumbs li {padding: 0; background-image:none}
	#breadcrumbs a:after{content:" >";}
	#mainarea {padding-top: 5px}
	#column-layout-content {margin-right: 0}
	#hamburger-menu {display:none}
	#bodytext {border-style: none}
	#bodytext, a, td {color: black !important}
	h1, #bodytext h1 {padding: 0; background: none; border-bottom: 1px solid #DDD}
	#updated {padding: 0 !important; border-style: none !important}
	#footer {padding: 0; text-align: left; color: black}
	ul {list-style-image: none !important}
	h1 {margin-left: 0 !important; margin-right: 0 !important}
	hr {border-top: 2px solid #CCC; color: transparent; background-color: transparent} 
	.conceptual-model-legend {display: block}
}

.embedded-frame #header, .embedded-frame #nav-site, .embedded-frame #hamburger-menu, .embedded-frame #column-layout-column-left, .embedded-frame #share-buttons, .embedded-frame #footer {display:none}