/* Encorp Pacific (Canada) 2024 Annual Report CSS */
/* Last Updated: 2025.06.20 ET */

/** Colours

#22439C	rgb(34,67,156); corp blue
#1891D7 rgb(24,145,215); highlight blue
#0C3280 rgb(12,50,128); dark blue
#E8ECF5 rgb(232,236,245); light blue panel
#F4F5FA rgb(244,245,250); very light blue panel
#F99E1C rgb(249,158,28); orange
#E77800 rgb(231,120,0); dark orange
#DD703C rgb(221,112,60); alt dark orange
#FFAF44 rgb(255,175,68); bright orange
#FDD8A4 rgb(253,216,164); light orange
#FFF7EA rgb(255,247,234); very light orange
#50A147 rgb(80,161,71); EOLE green
#BEBEBE rgb(190,190,190); light grey
#EEEEEE rgb(238,238,238); very light grey

**/

/* Includes */

@import url('normalize.css');
@import url('glyphicons.css');
@import url('odometer-theme-minimal.css');

@font-face {
	font-family: DIN;
	font-weight: normal;
	src: url('../fonts/DINWeb.woff') format('woff');
}

@font-face {
	font-family: DIN;
	font-weight: bold;
	src: url('../fonts/DINWeb-Bold.woff') format('woff');
}

@font-face {
	font-family: DIN;
	font-weight: 500;
	src: url('../fonts/DINWeb-Medium.woff') format('woff');
}

@font-face {
	font-family: DIN;
	font-weight: 900;
	src: url('../fonts/DINWeb-Black.woff') format('woff');
}

/* Basic elements (no classes or id's) */

*,
:after,
:before {
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

html,
body {
	height: 100%;
}

body {
	background-color: white;
	font-weight: normal;
	font-family: DIN, "Trebuchet MS", sans-serif;
	font-size: 18px;
	line-height: 1.43;
	color: rgb(51,51,51);
	padding-top: 70px;
	/** For development only: **/
	/* background: white url('../images/encp_bkgd_guides_1140px.png') center center repeat-y; */
}

a {
	color: rgb(34,67,156);
	text-decoration: underline;
}

a:active,
a:hover {
	text-decoration: none;
	color: rgb(249,158,28);
}

a[name] {
	position: absolute;
	margin-top: -100px;
}

h1 {
	color: rgb(34,67,156);
	font-weight: bold;
	font-size: 46px;
	line-height: 1.1;
	text-align: left;
/* 	text-transform: uppercase; */
}

h1 > b:first-child {
	font-weight: normal;
}

h2 {
	position: relative;
	color: rgb(34,67,156);
	font-weight: normal;
	font-size: 40px;
	line-height: 1;
/* 	text-transform: uppercase; */
	padding-left: 1.8em;
	margin: 0.6em auto 0.9em;
}

h2 > b {
	position: absolute;
	left: 0;
	font-weight: normal;
	color: rgb(249,158,28);
}

h2 > div.slogan {
	font-style: italic;
	font-size: 0.8em;
	text-transform: none;
	margin-top: 0.8em;
	text-align: center;
}

h3 {
	color: rgb(34,67,156);
	font-weight: bold;
	font-size: 20px;
	line-height: 1.2;
	margin-top: 2em;
	margin-bottom: 0.5em;
}

h3.alternate {
	font-weight: 500;
	font-size: 24px;
	text-transform: uppercase;
	margin-top: 1em;
}	

h4 {
	font-size: 1em;
}

strong,
b {
	font-weight: bold;
}

p.statement {
	color: rgb(34,67,156);
	font-weight: bold;
	font-style: italic;
	text-align: center;
}	

main {
	background: white;
}

nav {
	text-align: left;
}

figure {
	margin: 1em auto;
	text-align: center;
}

figcaption {
	font-weight: bold;
	margin: 0em auto;
}

video {
	max-height: 360px;
	max-width: 640px;
	height: 100%;
	width: 100%;
}

/* This assumes all iframes are being used for 16x9 videos: */
iframe {
	max-width: 72vw;
	max-height: 40.5vw;
}

table {
	line-height: 1.2em;
	border-spacing: 0;
	margin-top: 1em;
	margin-bottom: 2em;
	width: 100%;
}

td {
	font-weight: normal;
}

td,
th {
	text-align: left;
	vertical-align: top;
	padding: 0.5em 0.75rem;
}

caption {
	font-size: 1.2rem;
	font-weight: bold;
	text-align: left;
	padding: 0 0.75rem 0.5em 0.75rem;
}

table thead th {
	vertical-align: bottom;
}

table tbody th,
table tbody td {
	border-top: 1px solid rgb(249,158,28);
}

table tbody tr:first-child th,
table tbody tr:first-child td {
	border-top: 3px solid rgb(249,158,28);
}

table tbody tr:last-child th,
table tbody tr:last-child td {
	border-bottom: 1px solid rgb(249,158,28);
}

table tfoot th,
table tfoot td {
	font-weight: bold;
	border-top: 3px solid rgb(249,158,28);
}

ol[type="a"] {
	counter-reset: list;
}

ol[type="a"] > li {
	list-style: none;
}

ol[type="a"] > li:before {
	content: counter(list, lower-alpha) ") ";
	counter-increment: list;
	display: inline-block;
	width: 1.4em;
}

/* Presentation classes */

.center-block {
	display: block;
	margin: 2em auto !important;
}

.center-text {
	text-align: center !important;
}

.center-text svg {
	margin: 2em auto;
}

.left-text {
	text-align: left !important;
}

.right-text {
	text-align: right !important;
}

.extra-margin-top {
	margin-top: 4em;
}

.float-left {
	float: left;
	margin: 0 2rem 1.4rem 0;
}

.float-right {
	float: right;
	margin: 0 0 1.4rem 2rem;
}

@media (max-width: 700px) {
	.float-left.max700,
	.float-right.max700 {
		float: none;
		margin: 2em auto;
	}
}

@media (max-width: 900px) {
	.float-left.max900,
	.float-right.max900 {
		float: none;
		margin: 2em auto;
	}
}

@media (max-width: 1100px) {
	.float-left.max1100,
	.float-right.max1100 {
		float: none;
		margin: 2em auto;
	}
}

table.align-bottom td {
	vertical-align: bottom;
}

div.side-by-side {
	float: left;
	width: calc(50% - 20px);
	margin-right: 20px;
}

div.side-by-side + div.side-by-side {
	margin-right: 0;
	margin-left: 20px;
}

div.flex-row {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: top;
}

/* Semantic classes */

.text {
	text-align: left !important;
}

.num {
	text-align: right !important;
}

.decrease {
	color: red !important;
}

.increase {
	color: green !important;
}

.footnote {
	font-size: 12px;
	line-height: 1.4;
	padding-top: 1em;
	border-top: 1px solid rgb(233,233,233);
}

img.headshot {
	float: right;
	width: 200px;
	margin: 1em 0 1em 1em;
}

img.paper-document {
	display: block;
	margin: 0 auto 100px auto;
	box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
}

img.paper-document.undivided {
	padding: 0 !important;
	border: none !important;
}

table.number-table th,
table.number-table td {
	text-align: right;
}

table.number-table th:first-child,
table.number-table td:first-child {
	text-align: left !important;
}

table.number-table tr.zebra-row th,
table.number-table tr.zebra-row td  {
	background: rgba(249,158,28,0.15);
}

table.number-table tfoot tr td {
	font-weight: normal;
	border-top: 3px solid rgb(249,158,28);
}

table.number-table tfoot tr.zebra-row th,
table.number-table tfoot tr.zebra-row td {
	font-weight: bold;
	padding-top: 0.75em;
	border-top: none;
	border-bottom: 1px solid rgb(249,158,28);
}

table.number-table td.table-indent {
	padding-left: 40px;
}

table.number-table tbody tr.operating-reserves-table td {
	border-top: 3px solid rgb(249,158,28);
}

table.number-table tbody tr.discarder-table td {
	border-top: 3px solid rgb(249,158,28);
}

table.number-table tbody tr.discarder-table td ul {
	padding-left: 20px;
}

table.number-table.materials tbody td:not(.text) {
	font-weight: bold;
	text-align: center;
}

table.number-table.materials thead th {
	padding-bottom: 1em;
}

table.number-table.materials thead th:not(:first-child),
table.number-table.materials tfoot td:not(:first-child) {
	text-align: center;
}

table.follow-money tbody td:not(:first-child),
table.follow-money tfoot td {
	font-weight: bold !important;
}

table.follow-money td {
	border-color: black !important;
}

table.follow-money tbody td {
	border: none !important;
}

table.follow-money tbody tr:not(:last-child) td {
	padding-bottom: 0;
}

th.num,
td.num {
	text-align: right;
	padding-right: 0;
	padding-left: 1em;
}

th.text,
td.text {
	text-align: left;
	padding-right: 0;
	padding-left: 1em;
}

tr.continued > th,
tr.continued td {
	border: none !important;
}

table.provincial-totals {
	width: auto;
	color: rgb(34,67,156);
	font-size: 1.4rem;
	border: none !important;
	margin-bottom: 
}

table.provincial-totals caption {
	font-weight: 500;
	font-size: 1.8rem;
	text-transform: uppercase;
	padding-left: 0;
	border: none !important;
}

table.provincial-totals tbody tr th,
table.provincial-totals tbody tr td {
	font-weight: normal;
	padding: 0.2em 1.5em 0.2em 0;
	border: none !important;
}

table.provincial-totals tbody tr td.num {
	white-space: nowrap;
}

table.capita-return-table {
	font-size: 0.98rem;
}

table.capita-return-table td:nth-child(2) {
	text-align: center !important;
}

table.capita-return-table tbody tr:nth-child(4n-3),
table.capita-return-table tbody tr:nth-child(4n-2) {
	background: rgba(249,158,28,0.15);
}

table.capita-return-table tbody tr:not(.continued):not(:first-child) td {
	border: none !important;
}

table.capita-return-table tfoot tr:first-child td {
	padding-top: 1em;
}

table.capita-return-table tr.continued td {
	padding-top: 0;
}

table.capita-return-table tfoot td,
table.capita-return-table tbody td:last-child,
table.capita-return-table td.number-bold,
table.number-table tfoot tr td.number-bold {
	font-weight: bold !important;
}

table.awareness-return-table tbody tr:nth-child(odd) {
	background: rgba(249,158,28,0.15);
}
table.awareness-return-table tr td {
	border-top: 2px solid rgb(249,158,28);
}

table.divided td + td {
	border-left: 1px solid rgb(249,158,28);
	padding-left: 1.25em;
}

.back-link {
	float: left;
	margin-left: -4em;
}

.next-link {
	float: right;
	margin-right: -4em;
}

a.back-link,
a.next-link {
	background-color: transparent !important;
	color: rgb(34,67,156) !important;
	font-weight: bold;
	font-size: 16px;
	text-transform: uppercase;
	text-decoration: none;
	margin-top: -0.5em;
}

a.back-link:hover,
a.next-link:hover {
	color: rgb(249,158,28) !important;
}

a.back-link::after,
a.next-link::after {
	display: block;
	font-size: 1.5em;
	line-height: 1;
	text-align: center;
	margin-top: -0.3em;
}

a.back-link::after {
	content: '\2190';
	font-family: arial, sans-serif;
}

a.next-link::after {
	content: '\2192';
	font-family: arial, sans-serif;
}

a.prev-section,
a.prev-section:visited,
a.next-section,
a.next-section:visited {
	display: inline-block;
	vertical-align: bottom;
	position: relative;
	width: 175px;
	height: 110px;
	background: white;
	color: rgb(34,67,156);
	font-weight: 500;
	font-size: 14px;
	line-height: 1.26;
	text-decoration: none;
	text-align: center;
	padding: 58px 5px 0;
	border: 2px solid rgb(34,67,156);
	margin: 0 0 0 5px;
}

a.prev-section:hover,
a.next-section:hover {
	background: rgb(247,217,170);
}

a.prev-section::before,
a.next-section::before {
	content: '';
	position: absolute;
	top: 18px;
	left: 50%;
	display: block;
	width: 20px;
	height: 20px;
	display: block;
	border-top: 2px solid rgb(34,67,156);
	margin-left: -10px;
	transform-origin: 50%;
}

a.prev-section::before {
	left: 52%;
	border-left: 2px solid rgb(34,67,156);
	transform: rotate(-45deg);
}

a.next-section::before {
	left: 48%;
	border-right: 2px solid rgb(34,67,156);
	transform: rotate(45deg);
}

input.nav-checkbox {
	display: none;
}

label.modal {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background: rgba(0,0,0,0.6);
	z-index: 9000;
}

label.modal::before {
	content: '';
	position: absolute;
	display: block;
	top: 10px;
	right: 10px;
	width: 52px;
	height: 52px;
	background: rgb(249,158,28) url('../images/encp_icon_ar-menu-close.svg') no-repeat center center;
	background-size: 26px 26px;
	border-radius: 9999px;
	z-index: 9002;
}

label.modal-button {
	display: inline-block;
	border: 3px solid rgb(249,158,28);
	font-weight: bold;
	text-align: center;
	padding: 0.8em 2em;
	cursor: pointer;
}

input.nav-checkbox:not(:checked) + label.modal {
	opacity: 0;
	z-index: -9000;
}

nav.selector {
	background-color: rgb(34,67,156);
	border: 2px solid white;
}

nav.selector > label {
	display: block;
	color: white;
	font-weight: 500;
	padding: 0.8em 1em;
	cursor: pointer;
}

nav.selector > label::after {
	content: '';
	position: absolute;
	top: 20px;
	right: 25px;
	width: 12px;
	height: 12px;
	border-right: 2px solid white;
	border-bottom: 2px solid white;
	transform-origin: 50% 50%;
	transform: rotate(45deg);
}

nav.selector > ol {
	display: none;
	list-style: none;
	padding: 0;
	margin: 0 0 0.5em 0;
}

nav.selector > ol > li {
	padding: 0;
	margin: 0;
}

nav.selector ol a,
nav.selector ol a:visited {
	display: block;
	color: white;
	text-decoration: none;
	padding: 0.3em 1em;
}

nav.selector ol a:hover {
	background-color: rgb(231,120,0);
	text-decoration: none;
}

.section-introduction {
	color: rgb(34,67,156);
	font-weight: 500;
	font-size: 20px;
	margin-bottom: 1.4em;
}

.section-introduction a {
	color: rgb(34,67,156);
	font-weight: bold;
}

div.panel {
	position: relative;
}

section.introduction {
	background: white;
	padding: 40px 66px;
	margin-bottom: 40px;
}

section.feature {
	position: relative;
	background: rgb(34,67,156);
	color: white;
	padding: 40px 40px 40px 60px;
	border-radius: 1.5rem;
}

section.feature:not(.alternate) h3 {
	color: white;
}

section.feature:not(.alternate) a,
section.feature:not(.alternate) a:visited {
	color: white;
}

section.feature:not(.alternate) a:hover {
	color: rgb(249,158,28);
}

section.feature.alternate {
	background-color: white;
	color: rgb(34,67,156);
	padding-left: 10px;
	padding-right: 10px;
}

section.closing {
	background: rgb(238,238,238);
	text-align: center;
	padding-bottom: 120px;
	margin-top: 80px;
	margin-bottom: -80px;
	border-top: 4px solid rgb(34,67,156);
}

section.closing p {
	color: rgb(34,67,156);
	font-weight: normal;
	font-size: 24px;
	line-height: 1.2;
}

section.closing big {
	font-size: 1.2em;
}

@media (min-width: 800px) {
	section.side-by-side {
		position: relative;
		overflow: hidden;
		margin: 1em auto;
		display: -webkit-box;
		display: -webkit-flex;
		display: -moz-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-webkit-flex-direction: row;
		-moz-box-orient: horizontal;
		-moz-box-direction: normal;
		-ms-flex-direction: row;
		flex-direction: row;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	section.side-by-side > div {
		float: left;
		width: 49%;
		margin-left: 2%;
		-webkit-box-flex: 1;
		-webkit-flex-grow: 1;
		-moz-box-flex: 1;
		-ms-flex-positive: 1;
		flex-grow: 1;
		-webkit-flex-shrink: 1;
		-ms-flex-negative: 1;
		flex-shrink: 1;
		-webkit-flex-basis: 0%;
		-ms-flex-preferred-size: 0%;
		flex-basis: 0%;
	}
	section.side-by-side.balanced > div {
		display: -webkit-box;
		display: -webkit-flex;
		display: -moz-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-webkit-flex-direction: column;
		-moz-box-orient: vertical;
		-moz-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		-webkit-box-pack: start;
		-webkit-justify-content: space-between;
		-moz-box-pack: start;
		-ms-flex-pack: start;
		justify-content: space-between;
	}
	section.side-by-side > div:first-child {
		margin-left: 0;
	}
	section.side-by-side > div:last-of-type {

	}
}

section.side-by-side img,
section.side-by-side table {
	height: auto;
	max-width: 100%;
}

ul.downloads {
	list-style: none;
	padding: 0;
	margin: 1em auto;
}

ul.downloads > li {
	display: inline-block;
	padding: 0;
	margin: 4px 2px 4px 0 !important;
}

ul.downloads > li:last-child {
	margin-right: 0;
}

a.pdf,
a.pdf:visited,
ul.downloads a,
ul.downloads a:visited,
label.show-help {
	display: inline-block;
	width: 175px;
	color: rgb(34,67,156);
	font-weight: normal;
	font-size: 14px;
	line-height: 1.1;
	text-decoration: none;
	text-align: left;
	padding: 0.5em 0.3em 0.3em 60px;
	border: 2px solid rgb(34,67,156);
}

a.pdf > strong,
ul.downloads a > strong,
label.show-help > strong {
	font-weight: 500;
	display: block;
}

a.pdf,
a.pdf:visited,
ul.downloads a,
ul.downloads a:visited {
	background: url('../images/encp_icon_ar-download_white.svg') 26px center / 22px 29px no-repeat;
	color: white;
	border-color: white;
}

ul.downloads a:hover {
	background-color: rgb(231,120,0) !important;
}

ul.highlighted {
	display: inline-block;
	border: 2px solid rgb(34,67,156);
	font-weight: bold;
	padding-top: 1em;
	padding-bottom: 0.5em;
	padding-right: 2em;
}

ul.highlighted > li {
	margin-bottom: 0.5em;
}

ul.highlighted b {
	color: rgb(34,67,156);
}

label.show-help {
	background: rgba(255,255,255,0.1) url('../images/encp_icon_ar-help.svg') 26px center / 24px 24px no-repeat;
	color: rgb(34,67,156);
	font-weight: bold;
}

div.signature {
	position: relative;
	overflow: hidden;
	max-width: 400px;
	margin-bottom: 3em;
}

div.signature img.headshot {
	width: 170px;
	float: left;
	margin: 0em 30px 0 0;
}

dl.goals {
	max-width: 32em;
	font-size: 30px;
}

dl.goals dt {
	font-weight: bold;
	color: rgb(34,67,156);
	margin: 0 auto;
}

dl.goals dd {
	font-weight: normal;
	font-size: 18px;
	margin: 0 auto 0.9em;
}

div.sub-topics-prompt {
	/* Don't need this until script kicks in */
	display: none;
	margin-top: 1.5em;
}

div.sub-topics-prompt .sub-topics-open {
	float: right;
	cursor: pointer;
}

dl.sub-topics {
	position: relative;
	overflow: hidden;
	border: 2px solid rgb(249,158,28);
	margin-top: 2em;
	margin-bottom: 4em;
}

dl.sub-topics img {
	max-width: 100%;
}

dl.sub-topics.collapsible {
	margin-top: 0.5em;
}

dl.sub-topics dt {
	background-color: rgb(249,158,28);
	color: black;
	font-weight: bold;
	padding: 10px 20px;
}

dl.sub-topics.collapsible dt.closed {
	background-color: transparent;
	cursor: pointer;
}

dl.sub-topics dd {
	position: relative;
	overflow: hidden;
	padding: 10px 20px 30px;
	margin: 0;
}

@media (min-width: 800px) {
	dl.sub-topics.collapsible dt {
		float: left;
		clear: left;
		position: relative;
		width: 361px;
		min-height: 24px;
		border-top: 1px solid rgb(249,158,28);
		border-right: 1px solid rgb(249,158,28);
		transition: background-color 0.2s;
	}
	dl.sub-topics.collapsible dt:first-child {
		border-top: none;
	}
	dl.sub-topics.collapsible dt::after {
		content: '';
		position: absolute;
		top: 50%;
		margin-top: -24px;
		right: -24px;
		width: 0;
		height: 0;
		border-top: 24px solid transparent;
		border-bottom: 24px solid transparent;
		border-left: 24px solid rgb(249,158,28);
	}
	dl.sub-topics.collapsible dd {
		padding: 0.2em 1.5em 1em;
		border-top: 1px solid rgb(249,158,28);
		border-left: 1px solid rgb(249,158,28);
		margin: 0 0 0 360px;
	}
	dl.sub-topics.collapsible dd:after {
		content: '';
		display: table;
		clear: both;
	}
	dl.sub-topics.collapsible dt.closed:hover {
		background-color: rgb(253,216,164);
	}
	dl.sub-topics.collapsible dt.closed::after {
		display: none;
	}
	dl.sub-topics.collapsible dd {
		position: absolute;
		border-top: none;
	}
	dl.sub-topics.collapsible dd:nth-child(2) {
		border-top: none;
	}
	dl.sub-topics.collapsible iframe {
		max-width: 48vw;
		max-height: 27vw;
	}
}

@media (min-width: 800px) and (max-width: 1100px) {
	dl.sub-topics.collapsible dt {
		width: 251px;
	}
	dl.sub-topics.collapsible dd {
		margin-left: 250px;
	}
}

@media (max-width: 800px) {
	dl.sub-topics.collapsible dt {
		border-bottom: 1px solid white;
	}
	dl.sub-topics.collapsible dt.closed {
		background-color: rgba(249,158,28,0.4);
	}
	dl.sub-topics.collapsible dt:last-of-type {
		border-bottom: none;
	}
	dl.sub-topics.collapsible dd {
		padding: 0;
		margin: 1em 1em 2em 1em;
	}
}

div.map-prompt {
	font-size: 0.8em;
	margin-bottom: 0.5em;
}

div.slide-table-prompt {
	display: none;
	font-size: 0.8em;
	margin-bottom: -0.5em;
}

div.slide-table-container {
	/* Scrolling is now only activated in combination with the "maxNNN" prompts below */
	background: linear-gradient(to right, rgba(0,0,0,0.2) 0%,rgba(0,0,0,0) 2%,rgba(0,0,0,0) 98%,rgba(0,0,0,0.2) 100%);
}

div.slide-table-container > table {
	position: relative;
	background: linear-gradient(to right, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 2%, rgba(255,255,255,0) 4%, rgba(255,255,255,0) 96%, rgba(255,255,255,1) 98%, rgba(255,255,255,1) 100%);
}

@media (max-width: 500px) {
	div.slide-table-prompt.max500 {
		display: block;
	}
	div.slide-table-prompt.max500 + div.slide-table-container {
		overflow-x: scroll;
		margin-top: 1em;
		margin-bottom: 1em;
	}
	div.slide-table-prompt.max500 + div.slide-table-container > table {
		min-width: 400px;
		border: 2px solid rgb(34,67,156);
		border-radius: 1em;
		padding: 0.25em 1em;
		margin: 0;
	}
}

@media (max-width: 700px) {
	div.slide-table-prompt.max700 {
		display: block;
	}
	div.slide-table-prompt.max700 + div.slide-table-container {
		overflow-x: scroll;
		margin-top: 1em;
		margin-bottom: 1em;
	}
	div.slide-table-prompt.max700 + div.slide-table-container > table {
		min-width: 600px;
		border: 2px solid rgb(34,67,156);
		border-radius: 1em;
		padding: 0.25em 1em;
		margin: 0;
	}
}

@media (max-width: 900px) {
	div.slide-table-prompt.max900 {
		display: block;
	}
	div.slide-table-prompt.max900 + div.slide-table-container {
		overflow-x: scroll;
		margin-top: 1em;
		margin-bottom: 1em;
	}
	div.slide-table-prompt.max900 + div.slide-table-container > table {
		min-width: 800px;
		border: 2px solid rgb(34,67,156);
		border-radius: 1em;
		padding: 0.25em 1em;
		margin: 0;
	}
}

@media (max-width: 1100px) {
	div.slide-table-prompt.max1100 {
		display: block;
	}
	div.slide-table-prompt.max1100 + div.slide-table-container {
		overflow-x: scroll;
		margin-top: 1em;
		margin-bottom: 1em;
	}
	div.slide-table-prompt.max1100 + div.slide-table-container > table {
		min-width: 1000px;
		border: 2px solid rgb(34,67,156);
		border-radius: 1em;
		padding: 0.25em 1em;
		margin: 0;
	}
}

@media (min-width: 1300px) {
	div.slide-table-container > table {
		background: white !important;
	}
}

@media (max-width: 1300px) {
	div.slide-table-prompt.max1300 {
		display: block;
	}
	div.slide-table-prompt.max1300 + div.slide-table-container {
		overflow-x: scroll;
		margin-top: 1em;
		margin-bottom: 1em;
	}
	div.slide-table-prompt.max1300 + div.slide-table-container > table {
		min-width: 1200px;
		border: 2px solid rgb(34,67,156);
		border-radius: 1em;
		padding: 0.25em 1em;
		margin: 0;
	}
}

figure span.odometer,
figure span.odometer-percent {
	display: inline;
	color: rgb(34,67,156);
	font-weight: normal;
	font-size: 44px;
	line-height: 1.1;
	vertical-align: top;
}

figure.percent-bucket {
	position: relative;
	display: inline-block;
	vertical-align: bottom;
	width: 200px;
	height: 200px;
	padding: 68px 20px 20px;
	border: 4px solid rgb(249,158,28);
	border-radius: 9999px;
	margin: 50px 10px 0;
}

figure.percent-bucket figcaption {
	position: absolute;
	width: 190px;
	top: -70px;
	left: 50%;
	transform: translateX(-50%);
	font-weight: normal;
	font-size: 26px;
	line-height: 1.1;
	text-align: center;
	z-index: 4;
}

figure.percent-bucket::before {
	content: '';
	position: absolute;
	width: 22px;
	height: 100%;
	top: 0;
	left: -70px;
	border-left: 4px solid white;
	z-index: 2;
}

figure.percent-bucket:first-child::before {
	background: url('../images/encp_bkgd_white-meter-lines.svg') no-repeat center center;
	border: none;
}

figure.percent-bucket::after {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: url('../images/encp_bkgd_white-box.svg') no-repeat center 15px;
	border: 10px solid rgb(34,67,156);
	border-radius: 9999px;
	transition: background-position-y 1s;
	z-index: 0;
}

figure.percent-bucket.collapsed::after {
	background-position-y: 200px !important;
}

figure.percent-bucket span.odometer,
figure.percent-bucket span.odometer-percent {
	position: relative;
	z-index: 10;
}

figure.percent-bucket div.unit {
	position: relative;
	color: rgb(34,67,156);
	font-weight: 400;
	font-size: 1.4rem;
	line-height: 1;
	z-index: 10;
}

figure.percent-bucket span.odometer {
	transition: color 1s;
}

figure.percent-bucket span.odometer-percent {
	transition: color 1s;
}

figure.percent-bucket.collapsed span.odometer,
figure.percent-bucket.collapsed span.odometer-percent,
figure.percent-bucket.collapsed div.unit {
	color: white;
}

@media (min-width: 1080px) {
	section.percent-buckets {
		display: flex;
		flex-direction: row;
		justify-content: space-around;
	}
}

@media (max-width: 1079px) {
	section.percent-buckets {
		text-align: center;
	}
	figure.percent-bucket {
		display: inline-block;
	}
	figure.percent-bucket:not(:first-child)::before {
		display: none;
	}
}

@media (max-width: 840px) {
	figure.percent-bucket:not(:last-child) {
		margin-bottom: 50px;
	}
}

section.rates {
	position: relative;
	overflow: hidden;
	text-align: center;
}

section.rates span {
	color: rgb(34,67,156);
	font-weight: bold;
	font-size: 54px;
	vertical-align: middle;
}

@media (min-width: 1140px) {
	section.rates > figure {
		display: inline-block;
		width: 33%;
		border-left: 6px solid rgb(249,158,28);
	}
	section.rates > figure:first-child {
		border-left: none;
	}
}

@media (max-width: 1140px) {
	section.rates > figure {
		max-width: 20em;
		padding-top: 2em;
		border-top: 6px solid rgb(249,158,28);
		margin-bottom: 2em;
	}
	section.rates > figure:first-child {
		padding-top: 0;
		border-top: none;
	}
}

section.rates figcaption {
	color: rgb(50,50,50);
	font-weight: 500;
	font-size: 24px;
}

ul.board-of-directors,
ul.advisory-committee {
	list-style: none;
	padding: 0;
	margin: 0 auto;
}

ul.board-of-directors > li {
	float: left;
	width: 550px;
	min-height: 200px;
	background: rgb(255,247,234);
	padding: 10px;
	margin: 0 10px 30px 0;
	border-bottom: 3px solid rgb(249,158,28);
	color: rgb(34,67,156);
}

ul.advisory-committee > li {
	float: left;
	width: 550px;
	min-height: 140px;
	background: rgb(238,238,238);
	padding: 10px;
	margin: 0 10px 20px 0;
}

ul.board-of-directors img,
ul.advisory-committee img {
	float: right;
	width: 130px;
	margin-left: 10px;
}

ul.advisory-committee img {
	width: 100px;
}

ul.board-of-directors p,
ul.advisory-committee p {
	font-weight: bold;
	margin: 0;
	padding: 0;
}

ul.board-of-directors p span,
ul.advisory-committee p span {
	font-weight: normal;
	font-size: 16px;
}

@media (max-width: 670px) {
	ul.board-of-directors > li,
	ul.advisory-committee > li {
		width: 100%;
	}
}

@media (max-width: 480px) {
	ul.board-of-directors img,
	ul.advisory-committee img {
		float: none;
		margin-bottom: 0.5em;
	}
	ul.board-of-directors p,
	ul.advisory-committee p {
		line-height: 1.2em;
	}
}

/* General descendant selectors */

body > header {
	top: 0;
	background: white;
	z-index: 101;
	position: fixed;
	height: 70px;
	width: 100%;
	box-shadow: 0 0 10px rgba(0,0,0,0.25);
}

/** For development only **/
/* body > header { background: white url('../images/layout_grid.gif') left top; } */

main > header {
	position: relative;
	background-image: linear-gradient(to bottom, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0.8) 50%, rgba(255,255,255,1) 80%),
		url('../images/encp_bkgd_ar2024_containers.svg');
	background-size: 100vw;
	background-position: top right;
	background-repeat: repeat, no-repeat;
	color: rgb(34,67,156);
	padding: 80px 0 0 50px;
}

main > header > div.panel {
	background-color: rgb(34,67,156);
	background-image: linear-gradient(to bottom, rgba(34,67,156,0.8) 0%, rgba(34,67,156,0.8) 40%, rgba(34,67,156,1) 70%),
		url('../images/encp_bkgd_ar2024_containers_paleblue.svg');
	background-size: 100vw;
	background-position: top right, top -80px right;
	background-repeat: repeat, no-repeat;
	color: white;
	padding: 50px;
}

main > header h1 {
	position: relative;
	max-width: 820px;
	color: rgb(249,158,28);
	font-weight: 900;
	font-size: 48px;
	line-height: 1.05;
	text-transform: uppercase;
	padding-right: 140px;
	margin-top: 0;
	margin-left: 280px;
	margin-right: auto;
}

main > header h1 > b:first-child {
	position: absolute;
	top: -46px;
	left: -290px;
	color: white;
	font-weight: 900;
	font-size: 240px;
	line-height: 1;
	letter-spacing: -0.05em;
	text-align: center;
	margin: 0;
}

main > header h1 > span {
	display: block;
}

/* main > header h1.short {
	font-size: 50px;
} */

main > section {
	position: relative;
	padding: 50px;
}

main > header + section {
	padding-top: 64px;
}

main > section > figure {
	text-align: center;
	margin: 2em auto;
}

body > footer {
	/* position: relative; */
	position: sticky;
	top: 100vh;
	background: rgb(34,67,156);
	color: white;
	padding: 50px 50px 30px;
	margin-top: 80px;
}

body > footer a,
body > footer a:visited {
	color: white;
	text-decoration: none;
}

section img,
section svg {
	max-width: 100%;
	height: auto;
}

section > table {
	width: 100%;
}

section > nav {
	text-align: center;
	margin: 2em auto -1em;
	clear: both;
}

section > nav a,
section > nav a:visited {
	display: inline-block;
	background-color: white;
	color: rgb(50,50,50);
	font-weight: normal;
	text-decoration: none;
	padding: 0.4em 1em;
	border: 1px solid rgb(249,158,28);
	margin-left: -6px;
}

section > nav a:hover {
	color: black;
	background-color: rgb(253,216,164);
}

ul.summary {
	list-style: none;
	font-size: 1rem;
	padding: 0;
	margin: 1em 0 2em calc(280px - 1.3em);
}

ul.summary > li {
	padding: 0;
	margin: 0 0 0.5em;
}

ul.summary > li {
	padding-left: 1.3em;
}

ul.summary > li::before {
	content: '•';
	position: absolute;
	margin-left: -1.3em;
}

div.panel > ul.downloads {
	text-align: right;
	margin: 0;
}

div.panel > nav.selector {
	position: absolute;
	left: 330px;
	width: 320px;
	margin-top: -2px;
	z-index: 99;
}

div.panel > nav.selector ol a {
	padding-left: 2.6em;
	text-indent: -1.6em;
}

div.panel > ul.downloads a,
div.panel > ul.downloads a:visited {
	width: 10em;
	padding-left: 42px;
	background-position: 10px center;
}

footer > nav.selector {
	position: absolute;
	display: inline-block;
	right: 50px;
	width: 20em;
	border: none;
	margin: -80px 0 0 0;
	z-index: 99;
}

footer > nav.selector > label {
	position: relative;
	background-color: white;
	color: rgb(34,67,156);
	font-size: 18px;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 3px;
	padding: 14px 90px 14px 20px;
	border: 2px solid rgb(34,67,156);
}

footer > nav.selector > label::after {
	content: '';
	position: absolute;
	top: 12px;
	right: 25px;
	width: 20px;
	height: 20px;
	border-right: 2px solid rgb(34,67,156);
	border-bottom: 2px solid rgb(34,67,156);
	transform-origin: 50% 50%;
	transform: rotate(45deg);
}

footer > nav.selector ol {
	background: rgb(249,158,28);
	padding-top: 4px;
	margin: 0;
}

footer > nav.selector ol a,
footer > nav.selector ol a:visited {
	color: black;
	font-weight: bold;
	font-size: 14px;
}

footer > nav.selector ol a:hover {
	background: rgba(255,255,255,0.5);
	color: black;
}

footer > nav.selector li.active {
	background: white;
	color: black;
}

footer > nav.prev-next {
	float: right;
	z-index: 2001;
}

footer > ul.downloads {
	margin-top: -4px;
	float: left;
}

div.slide-table-container > table th {
	white-space: nowrap;
}

/* Next sibling selectors */

h4 + p {
	margin-top: -0.5em;
}

header + section {
	padding-top: 0;
}

section + section {
	border-top: 1px solid #eee;
}

img.paper-document + img.paper-document {
	border-top: 2px solid rgb(233,233,233);
}

section > nav + ul.downloads {
	margin-top: 3em;
}

/* Specific elements (with ID) and their descendants/siblings */

#main-logo {
	position: absolute;
	top: 10px;
	left: 50%;
	margin-left: -570px;
	width: 94px;
	max-width: 100%;
	z-index: 101;
}

#title {
	position: absolute;
	top: 20px;
	left: 50%;
	margin-left: -300px;
	width: 350px;
	font-weight: bold;
	font-size: 16px;
	line-height: 1;
	text-align: center;
	z-index: 101;
}

#title a,
#title a:visited {
	color: black;
	text-decoration: none;
}

#title a:hover {
	color: rgb(34,67,156);
}

#back-to-website {
	position: absolute;
	top: 28px;
	right: 50%;
	margin-right: -340px;
	font-size: 14px;
	line-height: 1.1;
	text-decoration: none;
	text-align: center;
	z-index: 101;
}

#show-toc {
	position: absolute;
	top: 0px;
	right: 50%;
	margin-right: -590px;
	box-sizing: border-box;
	width: 200px;
	height: 70px;
	background: transparent url('../images/encp_icon_ar-menu-open.svg') right 20px center / 26px 26px no-repeat !important;
	color: rgb(34,67,156);
	font-weight: 500;
	line-height: 1.2em;
	text-align: right;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	padding: 14px 70px 0 14px;
	border-left: 1px solid rgb(190,190,190);
	z-index: 101;
	cursor: pointer;
}

@media (max-width: 1190px) {
	#main-logo {
		left: 20px;
		margin-left: 0;
	}
	#back-to-website {
		right: 240px;
		margin-right: 0;
	}
	#show-toc {
		right: 0;
		margin-right: 0;
	}
}

@media (max-width: 840px) {
	#title {
		left: 20%;
		margin-left: 0;
	}
	#back-to-website {
		display: none;
	}
}

@media (max-width: 740px) {
	#title {
		width: auto;
		height: 2em;
		left: 140px;
		right: 220px;
		overflow: hidden;
	}
}

@media (max-width: 480px) {
	#title {
		display: none;
	}
	#show-toc {
		width: 140px;
		background-position: right 10px center !important;
		font-size: 14px;
		padding: 20px 50px 0 10px;
	}
}

#subsec-tabs {
	list-style: none;
	padding: 0;
	margin: 0;
	position: absolute;
	top: 40px;
	left: 50%;
	margin-left: -300px;
	width: 350px;
	font-weight: bold;
	font-size: 16px;
	line-height: 1;
	text-align: center;
	z-index: 101;
}

#subsec-tabs li {
	display: inline-block;
	padding: 0;
	margin: 0;
}

#subsec-tabs a,
#subsec-tabs a:visited {
	display: block;
	color: black;
	text-decoration: none;
	padding: 7px 14px;
	transition: background-color 0.2s;
}

#subsec-tabs a:hover,
#subsec-tabs a.active {
	background-color: rgb(249,158,28);
}

#subsec-tabs li.back-link,
#subsec-tabs li.next-link {
	margin-top: -18px;
}

@media (max-width: 1000px) {
	#subsec-tabs li.back-link,
	#subsec-tabs li.next-link {
		display: none;
	}
}

@media (max-width: 840px) {
	#subsec-tabs {
		left: 20%;
		margin-left: 0;
	}
}

@media (max-width: 740px) {
	#subsec-tabs {
		display: none;
	}
}

#toc {
	position: relative;
	width: 1180px;
	min-height: 100vh;
	background-color: white;
	padding-top: 70px;
	margin: -100vh auto 0;
	box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.15);
	z-index: 100;
	overflow-x: hidden; /* This, combined with a negative right margin on the child UL, hides the scrollbar of the latter */
	opacity: 0;
}

#toc > ol {
	list-style: none;
	font-weight: bold;
	font-size: 18px;
	line-height: 1.2;
	padding: 0 0 200px 0;
	margin: 0;
	max-height: calc(100vh - 70px);
	overflow-y: auto;
	margin-right: -20px;  /* This, combined with overflow-x: hidden on the parent #toc, hides the scrollbar */
}

#toc > ol > li {
	padding: 8px 150px;
	border-top: 2px solid rgb(233,233,233);
	margin: 0;
}

#toc > ol > li:first-child {
	/* font-size: 26px; */
	font-weight: bold;
	border-top: none;
}

#toc ol ol {
	list-style: none;
	font-weight: normal;
	font-size: 18px;
	padding: 0;
	margin: 0 0 0 8px;
}

#toc ol li.active,
#toc ol li.js-active {
	background: rgba(255,255,255,0.2);
}

#toc ol li.active {
	/* border: 1px solid white; */
}

#toc ol li.active + li {
	/* border-top: none; */
}

#toc ol li ol {
	display: none;
}

#toc ol li.buttons {
	padding-top: 40px;
	padding-bottom: 40px;
}

#toc ol li.buttons ol {
	display: block;
}

#toc ol ol li {
	padding-left: 1.5em;
}

#toc ol li span {
	color: rgb(249,158,28);
	font-weight: bold;
	margin-right: 0.5em;
}

/* Having the subsection open without JavaScript creates problems whereby the #hash links don't uncheck the TOC checkbox */
/* #toc ol li.active ol {
	display: block;
} */

#toc ol a,
#toc ol a:visited {
	text-decoration: none;
}

#toc ol a:hover {
	color: rgb(249,158,28);
}

#toc > ol > li.with-subsec {
	background: transparent url('../images/encp_icon_ar-menu-open.svg') right 160px top 10px / 26px 26px no-repeat;
}

#toc > ol > li.with-subsec.active,
#toc > ol > li.with-subsec.js-active {
	background: rgba(255,255,255,0.3) url('../images/encp_icon_ar-menu-open.svg') right 160px top 10px / 26px 26px no-repeat;
}

#toc li.controls {
	padding-top: 40px;
	padding-bottom: 30px;
	border: none;
}

@media (min-height: 640px) {
	#toc li.controls {
		position: absolute;
		width: 100%;
		bottom: 0;
	}
}

#toc a.pdf,
#toc a.pdf:visited {
	background: url('../images/encp_icon_ar-download_blue.svg') 26px center / 22px 29px no-repeat;
	color: rgb(34,67,156);
	border-color: rgb(34,67,156);
}

#toc-checkbox:checked ~ #toc {
	transition: opacity 0.5s, margin 0.5s cubic-bezier(0.21, 0.7, 0.43, 1);
	margin-top: 0;
	opacity: 1;
}

#toc-checkbox:checked ~ #show-toc {
	background: transparent url('../images/encp_icon_ar-menu-close.svg') right 20px center / 26px 26px no-repeat !important;
	border-color: transparent;
}

#toc-checkbox:checked ~ #title {
	color: rgb(34,67,156);
}

#toc-checkbox:checked ~ a:hover,
#toc-checkbox:checked ~ #subsec-tabs a:hover {
	color: white !important;
}

@media (max-width: 1180px) {
	#toc {
		width: 100%;
	}
	#toc > ol > li {
		padding: 10px 130px 10px 70px;
	}
	#toc > ol > li.with-subsec,
	#toc > ol > li.with-subsec.active,
	#toc > ol > li.with-subsec.js-active {
		background-position: right 60px top 15px;
	}
}

@media (max-width: 780px) {
	#toc > ol  {
		font-size: 20px;
		line-height: 1.3;
	}
	#toc ol ol {
		font-size: 18px;
	}
	#toc > ol > li.with-subsec,
	#toc > ol > li.with-subsec.active,
	#toc > ol > li.with-subsec.js-active {
		background-size: 20px 20px;
	}
	#toc li.controls {
		padding-top: 30px;
		padding-bottom: 20px;
	}
}

@media (max-width: 560px) {
	#toc > ol > li {
		padding: 10px 60px 10px 30px;
	}
	#toc > ol > li.with-subsec,
	#toc > ol > li.with-subsec.active,
	#toc > ol > li.with-subsec.js-active {
		background-position: right 30px top 15px;
	}
}

@media (max-width: 480px) {
	#toc-checkbox:checked ~ #show-toc {
		background-size: 32px 32px !important;
	}
}

#subnav-checkbox:checked ~ nav.selector > label::after,
#footnav-checkbox:checked ~ nav.selector > label::after {
	top: 22px;
	transform: rotate(-135deg);
}

#subnav-checkbox:checked ~ nav.selector > ol {
	display: block;
}

#footnav-checkbox:checked ~ nav.selector > ol {
	display: block;
}

#help {
	display: none;
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: white;
	text-align: center;
	overflow-y: scroll;
	padding-top: 70px;
	margin-right: -20px;
	z-index: 10000;
}

#help img {
	display: block;
	width: 100%;
	height: auto;
}

#help-checkbox:checked ~ #help {
	display: block;
}

#close-help {
	position: fixed;
	top: 0px;
	right: 50%;
	margin-right: -570px;
	box-sizing: border-box;
	width: 200px;
	height: 70px;
	background: transparent url('../images/encp_icon_ar-menu-close.svg') right 20px center / 26px 26px no-repeat !important;
	color: rgb(34,67,156);
	font-weight: bold;
	line-height: 1.2em;
	text-align: right;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	padding: 26px 70px 0 0;
	cursor: pointer;
}

@media (max-width: 1140px) {
	#close-help {
		right: 20px;
		margin-right: 0;
	}
}

#document-info {
	position: relative;
	overflow: hidden;
	clear: both;
	text-align: left;
	padding-top: 24px;
}

#document-info p {
	float: left;
	font-family: DIN, "Helvetica Neue", Helvetica, Arial, sans-serif;
	line-height: 1.1em;
	margin: 0;
}

#document-info p:first-child {
	margin-top: 40px;
}

#contact-info {
	clear: left;
	font-size: 12px;
	letter-spacing: 0.02em;
	padding-top: 0.5em;
}

#contact-info span {
	display: inline-block;
	margin-right: 1em;
	margin-bottom: 0.2em;
}

#document-download {
	display: block;
	float: left;
	background: url('../images/encp_rule_vert_white.svg') left center no-repeat;
	background-size: 2px 24px;
	font-size: 14px;
	padding-left: 10px;
	margin-left: 16px;
}

#document-download > img {
	vertical-align: middle;
	margin: 0 10px;
}

#social-links {
	float: right;
	list-style: none;
	background: url('../images/encp_rule_vert_white.svg') right center no-repeat;
	font-size: 12px;
	line-height: 1;
	text-align: center;
	padding: 0 26px 0 0;
	margin: 0 26px 0 0;
}

#social-links > li {
	display: inline-block;
	margin: 0 0 10px;
}

#social-links svg {
	width: 52px;
	height: 52px;
}

#social-links::after {
	content: 'Share & Connect';
	display: block;
}

#social-links-large {
	background: none;
	list-style: none;
	padding: 0;
}

#social-links-large img {
	width: 108px;
	height: 108px;
}

#social-links-large > li {
	display: inline-block;
	margin: 0 10px 10px;
}

#show-help {
	display: block;
	float: right;
	font-size: 12px;
	line-height: 1;
	text-align: center;
	cursor: pointer;
}

#show-help svg {
	display: block;
	height: 24px;
	width: 24px;
	margin: 14px 14px 26px;
}

#social-links svg path,
#show-help svg path {
	fill: white;
}

#social-links a:hover svg path,
#show-help:hover svg path {
	fill: rgb(249,158,28);
}

#map_canvas {
	width: 100%;
	height: calc(100vw * 0.8);
	max-height: 70vh;
	border: 1px solid rgb(34,67,156);
}

#map_legend {
	position: relative;
	width: 210px;
	padding: 10px;
	margin-top: -250px;
	margin-left: calc(50% - 540px);
	margin-bottom: 60px;
	background-color: rgb(246,251,253);
	border: 1px solid rgba(34,67,156,0.5);
}

#map_legend > p {
	font-weight: bold;
	font-size: 0.8em;
	margin: 0;
}

#map_legend > p + p {
	margin-top: 0.5em;
}

#map_legend > p > img {
	vertical-align: middle;
	margin-right: 10px;
}

#gis_map {
	position: absolute;
	top: 50%;
	left: 50%;
	max-width: none;
	max-height: none;
	width: 90vw;
	height: 90vh;
	transform: translate(-50%, -50%);
}

@media (min-width: 1240px) {
	body > footer,
	main > section {
		padding-left: calc(50vw - 570px);
		padding-right: calc(50vw - 570px);
	}
	main > header {
		padding-left: calc(50vw - 450px);
	}
	main > header > div.panel {
		padding-right: calc(50vw - 570px);
	}
	footer > nav.selector {
		right: calc(50vw - 570px);
	}
	section > table {
		width: 1140px;
	}
	section img {
		max-width: 1140px;
	}
	#show-help {
		margin-right: 48px;
	}
}

@media (max-width: 1240px) {
	section.introduction {
		margin-left: 50px;
		margin-right: 50px;
	}
	main > header {
		background-image: linear-gradient(to bottom, rgba(255,255,255,0.8) 0, rgba(255,255,255,0.8) 300px, rgba(255,255,255,1) 577px),
			url('../images/encp_bkgd_ar2024_containers.svg');
		background-size: 1240px 577px;
		background-position: top right;
	}	
	main > header > div.panel {
		background-image: linear-gradient(to bottom, rgba(34,67,156,0.8) 0, rgba(34,67,156,0.8) 220px, rgba(34,67,156,1) 500px),
			url('../images/encp_bkgd_ar2024_containers_paleblue.svg');
		background-size: 1240px 577px;
		background-position: top center, top -80px right;
	}
	#map_legend {
		margin-left: 30px;
	}
}

@media (max-width: 1080px) {
	div.panel > nav.selector {
		position: relative;
		left: 0;
		margin-left: 280px;
	}
	div.panel > ul.downloads {
		text-align: left;
		margin-left: 280px;
	}
	#document-info p:first-child {
		margin-top: 24px;
	}
	#contact-info span:first-child {
		display: block;
	}
}

@media (max-width: 900px) {
	a.prev-section,
	a.next-section,
	a.prev-section:visited,
	a.next-section:visited {
		margin: 1px;
	}
	footer > nav.selector {
		display: none;
	}
	footer > ul.downloads,
	footer > nav.prev-next {
		float: none;
		text-align: center;
		padding: 0;
	}
	#document-info {
		text-align: center;
	}
	#document-info p {
		float: none;
		text-align: center;
	}
	#document-info p:first-child {
		margin-bottom: 1em;
	}
	#document-download {
		float: none;
		display: inline-block;
		background: url('../images/encp_rule_vert_white.svg') no-repeat right center;
		font-size: 12px;
		padding: 0 24px 0 0;
		margin: 0 22px 30px 0;
	}
	#document-download img {
		display: block;
		margin: 6px auto 10px;
	}
	#show-help {
		float: none;
		display: inline-block;
		margin-right: 0;
	}
	#social-links {
		float: none;
		display: inline-block;
		background: url('../images/encp_rule_vert_white.svg') no-repeat left center;
		padding: 0 0 0 24px;
		margin: 0 0 30px 22px;
	}
}

@media (max-width: 840px) {
	#map_legend {
		float: left;
		border: 1px solid rgb(34,67,156);
		margin: 1em 20px 1em 0;
	}
}

@media (max-width: 640px) {
	ul.summary {
		padding-left: 0;
		margin-left: -1.3em;
	}
	div.panel > nav.selector {
		margin-left: 0;
	}
	div.panel > ul.downloads {
		margin-left: 0;
	}
	main > header h1 {
		top: 0;
		padding-right: 0;
		margin-top: -46px;
		margin-left: 0;
	}
	main > header h1 > b:first-child {
		position: relative;
		display: block;
		top: 0;
		left: -10px;
		text-align: left;
	}
}

@media (max-width: 560px) {
	h2 {
		font-size: 32px;
	}
	main > section {
		padding: 50px 20px;
	}
	div.panel > nav.selector {
		width: auto;
	}
}

@media (max-width: 420px) {
	main > header {
		padding-left: 20px;
	}
	main > header > div.panel {
		padding-left: 30px;
		padding-right: 30px;
	}
	main > header h1 > b:first-child {
		font-size: 180px;
	}
}

@media (max-width: 360px) {
	body > footer {
		padding: 30px 20px;
	}
}

/** Note: other overrides in home.css and executive-summary.css **/

#executive-summary main,
#audited-statements main {
	padding-bottom: 0;
}
