@ongov/ontario-design-system-component-library 6.0.0-alpha.3 → 6.0.0-alpha.4

package/dist/collection/components/ontario-footer/ontario-footer.css

@@ -27,190 +27,569 @@
 /* callout backgrounds */
 /* icon colours */
 /* service ontario header colours */
-/*** 1 - Breakpoint sizes for media queries ***/ /* -------------------------------
+/*** 1 - Breakpoint sizes for media queries ***/
+/* -------------------------------
     Global font variables
 --------------------------------- */
 /* -------------------------------
     Global font-weight variables
 --------------------------------- */
+/* -------------------------------
+    Global font-size variables
+--------------------------------- */
+/* -------------------------------
+    Global letter-spacing variables
+--------------------------------- */
 /* Rem calc function */
 /* Pixel to REM Conversion */
-/*
-*  Grid functions
-*
-*  1 - Lower-bound
-*  2 - Upper-bound
-*  3 - Grid calc
-*/
-/*** 1 - Lower-bound ***/
-/*** 2 - Upper-bound ***/
-/*** 3 - Grid calc ***/
-/*
-*  Global grid variables
-*
-*  1 - Grid text variables
-*  2 - Grid row/column variables
-*  3 - Grid screen size variables
-*/
-/*** 1 - Grid text variables ***/
-/*** 2 - Grid row/column variables ***/
-/*** 3 - Grid screen size variables ***/
-/*
-*  Grid mixins
-*
-*  1 - Exporting grid code
-*  2 - Clearfix
-*  3 - Grid row
-*  4 - Grid column
-*  5 - Grid HTML classes
-*/
-/*** 1 - Exporting grid code ***/
-/*** 2 - Clearfix ***/
-/*** 3 - Grid row ***/
-/*** 4 - Grid column ***/
-/*** 5 - Grid HTML classes ***/
-.ontario-row {
-	margin: 0 auto;
-	max-width: 72rem;
-	width: 100%;
+/* -------------------------------
+    Global line-height variables
+--------------------------------- */
+/* -------------------------------
+    Global typography variables
+--------------------------------- */
+h6,
+.ontario-h6,
+h5,
+.ontario-h5,
+h4,
+.ontario-h4,
+h3,
+.ontario-h3,
+h2,
+.ontario-h2,
+h1,
+.ontario-h1 {
+	font-style: normal;
+	font-weight: 700;
+	text-rendering: optimizeLegibility;
+	margin-bottom: 1rem;
+	font-feature-settings: normal;
+	font-family: 'Raleway Modified', 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
 }
-.ontario-row:before,
-.ontario-row:after {
-	content: '';
-	display: table;
+
+h1,
+.ontario-h1 {
+	font-size: 2rem;
+	letter-spacing: 0.04rem;
+	line-height: 1.29;
+	margin: 2.5rem 0 1.5rem 0;
+	max-width: 70rem;
 }
-.ontario-row:after {
-	clear: both;
+@media screen and (min-width: 40em) {
+	h1,
+	.ontario-h1 {
+		font-size: 2.5rem;
+		letter-spacing: 0.04rem;
+		line-height: 1.2;
+	}
 }
-.ontario-row.ontario-row--collapse > .ontario-column,
-.ontario-row.ontario-row--collapse > .ontario-columns {
-	padding-left: 0;
-	padding-right: 0;
+
+h2,
+.ontario-h2 {
+	font-size: 1.6875rem;
+	letter-spacing: 0.03rem;
+	line-height: 1.37;
+	margin: 0 0 0.75rem 0;
+	max-width: 48rem;
 }
-.ontario-row.ontario-row--collapse .ontario-row {
-	margin-left: 0;
-	margin-right: 0;
+@media screen and (min-width: 40em) {
+	h2,
+	.ontario-h2 {
+		font-size: 2.0625rem;
+		letter-spacing: 0.02rem;
+		line-height: 1.33;
+	}
 }
-.ontario-row .ontario-row {
-	margin: 0 -1rem;
-	max-width: none;
-	width: auto;
+
+h3,
+.ontario-h3 {
+	font-size: 1.4375rem;
+	letter-spacing: 0.02rem;
+	line-height: 1.39;
+	margin: 0 0 0.75rem 0;
+	max-width: 48rem;
 }
-.ontario-row .ontario-row:before,
-.ontario-row .ontario-row:after {
-	content: '';
-	display: table;
+@media screen and (min-width: 40em) {
+	h3,
+	.ontario-h3 {
+		font-size: 1.75rem;
+		letter-spacing: 0.02rem;
+		line-height: 1.43;
+	}
 }
-.ontario-row .ontario-row:after {
-	clear: both;
+
+h4,
+.ontario-h4 {
+	font-size: 1.25rem;
+	letter-spacing: 0.03rem;
+	line-height: 1.5;
+	margin: 0 0 0.75rem 0;
+	max-width: 48rem;
 }
-.ontario-row .ontario-row.ontario-row--collapse {
-	margin: 0;
-	max-width: none;
-	width: auto;
+@media screen and (min-width: 40em) {
+	h4,
+	.ontario-h4 {
+		font-size: 1.5rem;
+		letter-spacing: 0.0313rem;
+		line-height: 1.5;
+	}
 }
-.ontario-row .ontario-row.ontario-row--collapse:before,
-.ontario-row .ontario-row.ontario-row--collapse:after {
-	content: '';
-	display: table;
+
+h5,
+.ontario-h5 {
+	font-size: 1.125rem;
+	letter-spacing: 0.03rem;
+	line-height: 1.56;
+	margin: 0 0 0.75rem 0;
+	max-width: 48rem;
 }
-.ontario-row .ontario-row.ontario-row--collapse:after {
-	clear: both;
+@media screen and (min-width: 40em) {
+	h5,
+	.ontario-h5 {
+		font-size: 1.1875rem;
+		letter-spacing: 0.025rem;
+		line-height: 1.5;
+	}
 }
 
-.ontario-column,
-.ontario-columns {
-	padding-left: 1rem;
-	padding-right: 1rem;
-	box-sizing: border-box;
-	width: 100%;
-	float: left;
-}
-.ontario-column + .ontario-column:last-child,
-.ontario-column + .ontario-columns:last-child,
-.ontario-columns + .ontario-column:last-child,
-.ontario-columns + .ontario-columns:last-child {
-	float: right;
+h6,
+.ontario-h6 {
+	font-size: 1rem;
+	line-height: 1.56;
+	letter-spacing: 0.03rem;
+	max-width: 48rem;
+	margin: 0 0 0.75rem 0;
 }
-.ontario-column + .ontario-column.ontario-end,
-.ontario-column + .ontario-columns.ontario-end,
-.ontario-columns + .ontario-column.ontario-end,
-.ontario-columns + .ontario-columns.ontario-end {
-	float: left;
+@media screen and (min-width: 40em) {
+	h6,
+	.ontario-h6 {
+		font-size: 1rem;
+		letter-spacing: 0.025rem;
+		line-height: 1.5;
+	}
 }
 
-@media only screen {
-	.ontario-small-push-0 {
-		position: relative;
-		left: 0;
-		right: auto;
-	}
-	.ontario-small-pull-0 {
-		position: relative;
-		right: 0;
-		left: auto;
-	}
-	.ontario-small-push-1 {
-		position: relative;
-		left: 8.3333333333%;
-		right: auto;
-	}
-	.ontario-small-pull-1 {
-		position: relative;
-		right: 8.3333333333%;
-		left: auto;
-	}
-	.ontario-small-push-2 {
-		position: relative;
-		left: 16.6666666667%;
-		right: auto;
-	}
-	.ontario-small-pull-2 {
-		position: relative;
-		right: 16.6666666667%;
-		left: auto;
-	}
-	.ontario-small-push-3 {
-		position: relative;
-		left: 25%;
-		right: auto;
+.ontario-lead-statement {
+	font-size: 1.25rem;
+	line-height: 1.6;
+	max-width: 70rem;
+}
+@media screen and (min-width: 40em) {
+	.ontario-lead-statement {
+		font-size: 1.375rem;
 	}
-	.ontario-small-pull-3 {
-		position: relative;
-		right: 25%;
-		left: auto;
-	}
-	.ontario-small-push-4 {
-		position: relative;
-		left: 33.3333333333%;
-		right: auto;
-	}
-	.ontario-small-pull-4 {
-		position: relative;
-		right: 33.3333333333%;
-		left: auto;
-	}
-	.ontario-small-push-5 {
-		position: relative;
-		left: 41.6666666667%;
-		right: auto;
+}
+
+/*
+*  Global elements
+*
+*  1 - Unclassed elements
+*    1.1 - Base
+*    1.2 - Typography
+*    1.3 - Forms
+*    1.4 - Horizontal Rule
+*    1.5 - Lists
+*/
+/*** 1 - Unclassed Elements ***/
+/* Base */
+html {
+	font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+	font-size: 1rem;
+}
+
+body {
+	font-size: 1rem;
+	line-height: 1.6;
+	background-color: #ffffff;
+	color: rgb(25.5, 25.5, 25.5);
+	margin: 0;
+}
+
+/* Typography */
+p {
+	font-size: inherit;
+	margin-bottom: 1.25rem;
+	text-rendering: optimizeLegibility;
+	margin: 0 0 1.5rem 0;
+}
+
+cite {
+	font-style: italic;
+	line-height: inherit;
+}
+
+strong {
+	font-weight: 700;
+	line-height: inherit;
+}
+
+/* everything - including before and after - should inherit their box sizing */
+*,
+*::before,
+*::after {
+	box-sizing: inherit;
+}
+
+main p,
+main p:not(.ontario-lead-statement),
+main dd,
+main li {
+	max-width: 48rem;
+}
+
+hr {
+	border: 0;
+	padding: 0;
+	margin: 2.5rem 0;
+	border-bottom: 4px solid #cccccc;
+}
+
+/* Horizontal Rule */
+hr.ontario-hr--dark {
+	border-bottom: 4px solid rgb(25.5, 25.5, 25.5);
+}
+
+a {
+	color: #0066cc;
+	text-decoration: underline;
+}
+a:visited {
+	color: #551a8b;
+}
+a:hover {
+	color: #00478f;
+}
+a:active {
+	color: #002142;
+}
+a:focus {
+	-moz-box-shadow: 0 0 0 4px #009adb;
+	-webkit-box-shadow: 0 0 0 4px #009adb;
+	box-shadow: 0 0 0 4px #009adb;
+	outline: 4px solid transparent;
+	transition: all 0.1s ease-in-out;
+}
+
+​p {
+	margin: 0 0 1.5rem 0;
+}
+
+​p + h1,
+p + h2,
+p + h3,
+p + h4,
+p + h5,
+p + h6,
+ul + h1,
+ul + h2,
+ul + h3,
+ul + h4,
+ul + h5,
+ul + h6,
+ol + h1,
+ol + h2,
+ol + h3,
+ol + h4,
+ol + h5,
+ol + h6,
+h1 + h2,
+h2 + h3,
+h3 + h4,
+h4 + h5,
+h5 + h6 {
+	margin-top: 2rem;
+}
+
+p code,
+td code,
+li code {
+	line-height: 2.25rem;
+}
+
+/* Forms */
+input[type='text'],
+input[type='number'],
+input[type='email'],
+input[type='date'],
+input[type='color'],
+input[type='search'],
+input[type='tel'],
+textarea {
+	background-origin: initial;
+	height: auto;
+	-webkit-appearance: none;
+	-moz-appearance: none;
+}
+
+input[type='checkbox'] + label,
+input[type='radio'] + label {
+	font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+	font-size: 1rem;
+	font-weight: 400;
+	margin-left: 0;
+	margin-right: 0;
+}
+
+fieldset {
+	border: 0;
+	margin: 0;
+	padding: 0;
+	page-break-inside: avoid;
+}
+
+legend,
+label {
+	display: block;
+	margin: 0;
+}
+
+select {
+	background-origin: initial;
+	height: auto;
+	-webkit-appearance: none;
+	-moz-appearance: none;
+}
+
+/* Lists */
+ul,
+ol {
+	padding: 0;
+}
+
+ul {
+	margin-left: 2rem;
+}
+
+ul li {
+	padding: 0 0 0.75rem 0;
+}
+
+ol {
+	margin-left: 1.75rem;
+}
+
+ol li {
+	padding: 0 0 0.75rem 0.25rem;
+}
+
+ul li:last-child,
+ol li:last-child {
+	padding-bottom: 0;
+}
+
+ul[class*='columns-'] li:last-child,
+ol[class*='columns-'] li:last-child {
+	padding-bottom: 0.75rem;
+}
+
+ul ul,
+ol ul {
+	margin: 0.5rem 0 0.5rem 2rem;
+}
+
+ul ol,
+ol ol {
+	margin: 0.5rem 0 0.5rem 1.75rem;
+}
+
+p + ul,
+p + ol {
+	margin-top: -0.75rem;
+}
+
+@media screen and (min-width: 40em) {
+	ul {
+		margin: 0.5rem 0 1.5rem 3rem;
 	}
-	.ontario-small-pull-5 {
-		position: relative;
-		right: 41.6666666667%;
-		left: auto;
+	ol {
+		margin: 0.5rem 0 1.5rem 2.75rem;
 	}
-	.ontario-small-push-6 {
-		position: relative;
-		left: 50%;
-		right: auto;
+	ul ul,
+	ol ul {
+		margin: 0.5rem 0 0.5rem 3rem;
 	}
-	.ontario-small-pull-6 {
-		position: relative;
-		right: 50%;
-		left: auto;
+	ul ol,
+	ol ol {
+		margin: 0.5rem 0 0.5rem 2.75rem;
 	}
-	.ontario-small-push-7 {
+}
+/*
+*  Grid functions
+*
+*  1 - Lower-bound
+*  2 - Upper-bound
+*  3 - Grid calc
+*/
+/*** 1 - Lower-bound ***/
+/*** 2 - Upper-bound ***/
+/*** 3 - Grid calc ***/
+/*
+*  Global grid variables
+*
+*  1 - Grid text variables
+*  2 - Grid row/column variables
+*  3 - Grid screen size variables
+*/
+/*** 1 - Grid text variables ***/
+/*** 2 - Grid row/column variables ***/
+/*** 3 - Grid screen size variables ***/
+/*
+*  Grid mixins
+*
+*  1 - Exporting grid code
+*  2 - Clearfix
+*  3 - Grid row
+*  4 - Grid column
+*  5 - Grid HTML classes
+*/
+/*** 1 - Exporting grid code ***/
+/*** 2 - Clearfix ***/
+/*** 3 - Grid row ***/
+/*** 4 - Grid column ***/
+/*** 5 - Grid HTML classes ***/
+.ontario-row {
+	margin: 0 auto;
+	max-width: 72rem;
+	width: 100%;
+}
+.ontario-row:before,
+.ontario-row:after {
+	content: '';
+	display: table;
+}
+.ontario-row:after {
+	clear: both;
+}
+.ontario-row.ontario-row--collapse > .ontario-column,
+.ontario-row.ontario-row--collapse > .ontario-columns {
+	padding-left: 0;
+	padding-right: 0;
+}
+.ontario-row.ontario-row--collapse .ontario-row {
+	margin-left: 0;
+	margin-right: 0;
+}
+.ontario-row .ontario-row {
+	margin: 0 -1rem;
+	max-width: none;
+	width: auto;
+}
+.ontario-row .ontario-row:before,
+.ontario-row .ontario-row:after {
+	content: '';
+	display: table;
+}
+.ontario-row .ontario-row:after {
+	clear: both;
+}
+.ontario-row .ontario-row.ontario-row--collapse {
+	margin: 0;
+	max-width: none;
+	width: auto;
+}
+.ontario-row .ontario-row.ontario-row--collapse:before,
+.ontario-row .ontario-row.ontario-row--collapse:after {
+	content: '';
+	display: table;
+}
+.ontario-row .ontario-row.ontario-row--collapse:after {
+	clear: both;
+}
+
+.ontario-column,
+.ontario-columns {
+	padding-left: 1rem;
+	padding-right: 1rem;
+	box-sizing: border-box;
+	width: 100%;
+	float: left;
+}
+.ontario-column + .ontario-column:last-child,
+.ontario-column + .ontario-columns:last-child,
+.ontario-columns + .ontario-column:last-child,
+.ontario-columns + .ontario-columns:last-child {
+	float: right;
+}
+.ontario-column + .ontario-column.ontario-end,
+.ontario-column + .ontario-columns.ontario-end,
+.ontario-columns + .ontario-column.ontario-end,
+.ontario-columns + .ontario-columns.ontario-end {
+	float: left;
+}
+
+@media only screen {
+	.ontario-small-push-0 {
+		position: relative;
+		left: 0;
+		right: auto;
+	}
+	.ontario-small-pull-0 {
+		position: relative;
+		right: 0;
+		left: auto;
+	}
+	.ontario-small-push-1 {
+		position: relative;
+		left: 8.3333333333%;
+		right: auto;
+	}
+	.ontario-small-pull-1 {
+		position: relative;
+		right: 8.3333333333%;
+		left: auto;
+	}
+	.ontario-small-push-2 {
+		position: relative;
+		left: 16.6666666667%;
+		right: auto;
+	}
+	.ontario-small-pull-2 {
+		position: relative;
+		right: 16.6666666667%;
+		left: auto;
+	}
+	.ontario-small-push-3 {
+		position: relative;
+		left: 25%;
+		right: auto;
+	}
+	.ontario-small-pull-3 {
+		position: relative;
+		right: 25%;
+		left: auto;
+	}
+	.ontario-small-push-4 {
+		position: relative;
+		left: 33.3333333333%;
+		right: auto;
+	}
+	.ontario-small-pull-4 {
+		position: relative;
+		right: 33.3333333333%;
+		left: auto;
+	}
+	.ontario-small-push-5 {
+		position: relative;
+		left: 41.6666666667%;
+		right: auto;
+	}
+	.ontario-small-pull-5 {
+		position: relative;
+		right: 41.6666666667%;
+		left: auto;
+	}
+	.ontario-small-push-6 {
+		position: relative;
+		left: 50%;
+		right: auto;
+	}
+	.ontario-small-pull-6 {
+		position: relative;
+		right: 50%;
+		left: auto;
+	}
+	.ontario-small-push-7 {
 		position: relative;
 		left: 58.3333333333%;
 		right: auto;
@@ -1255,631 +1634,253 @@
 		float: left;
 	}
 }
-@media only screen and (min-width: 120.063em) {
-	.ontario-xxlarge-push-0 {
-		position: relative;
-		left: 0;
-		right: auto;
-	}
-	.ontario-xxlarge-pull-0 {
-		position: relative;
-		right: 0;
-		left: auto;
-	}
-	.ontario-xxlarge-push-1 {
-		position: relative;
-		left: 8.3333333333%;
-		right: auto;
-	}
-	.ontario-xxlarge-pull-1 {
-		position: relative;
-		right: 8.3333333333%;
-		left: auto;
-	}
-	.ontario-xxlarge-push-2 {
-		position: relative;
-		left: 16.6666666667%;
-		right: auto;
-	}
-	.ontario-xxlarge-pull-2 {
-		position: relative;
-		right: 16.6666666667%;
-		left: auto;
-	}
-	.ontario-xxlarge-push-3 {
-		position: relative;
-		left: 25%;
-		right: auto;
-	}
-	.ontario-xxlarge-pull-3 {
-		position: relative;
-		right: 25%;
-		left: auto;
-	}
-	.ontario-xxlarge-push-4 {
-		position: relative;
-		left: 33.3333333333%;
-		right: auto;
-	}
-	.ontario-xxlarge-pull-4 {
-		position: relative;
-		right: 33.3333333333%;
-		left: auto;
-	}
-	.ontario-xxlarge-push-5 {
-		position: relative;
-		left: 41.6666666667%;
-		right: auto;
-	}
-	.ontario-xxlarge-pull-5 {
-		position: relative;
-		right: 41.6666666667%;
-		left: auto;
-	}
-	.ontario-xxlarge-push-6 {
-		position: relative;
-		left: 50%;
-		right: auto;
-	}
-	.ontario-xxlarge-pull-6 {
-		position: relative;
-		right: 50%;
-		left: auto;
-	}
-	.ontario-xxlarge-push-7 {
-		position: relative;
-		left: 58.3333333333%;
-		right: auto;
-	}
-	.ontario-xxlarge-pull-7 {
-		position: relative;
-		right: 58.3333333333%;
-		left: auto;
-	}
-	.ontario-xxlarge-push-8 {
-		position: relative;
-		left: 66.6666666667%;
-		right: auto;
-	}
-	.ontario-xxlarge-pull-8 {
-		position: relative;
-		right: 66.6666666667%;
-		left: auto;
-	}
-	.ontario-xxlarge-push-9 {
-		position: relative;
-		left: 75%;
-		right: auto;
-	}
-	.ontario-xxlarge-pull-9 {
-		position: relative;
-		right: 75%;
-		left: auto;
-	}
-	.ontario-xxlarge-push-10 {
-		position: relative;
-		left: 83.3333333333%;
-		right: auto;
-	}
-	.ontario-xxlarge-pull-10 {
-		position: relative;
-		right: 83.3333333333%;
-		left: auto;
-	}
-	.ontario-xxlarge-push-11 {
-		position: relative;
-		left: 91.6666666667%;
-		right: auto;
-	}
-	.ontario-xxlarge-pull-11 {
-		position: relative;
-		right: 91.6666666667%;
-		left: auto;
-	}
-	.ontario-column,
-	.ontario-columns {
-		position: relative;
-		padding-left: 1rem;
-		padding-right: 1rem;
-		box-sizing: border-box;
-		float: left;
-	}
-	.ontario-xxlarge-1 {
-		width: 8.3333333333%;
-	}
-	.ontario-xxlarge-2 {
-		width: 16.6666666667%;
-	}
-	.ontario-xxlarge-3 {
-		width: 25%;
-	}
-	.ontario-xxlarge-4 {
-		width: 33.3333333333%;
-	}
-	.ontario-xxlarge-5 {
-		width: 41.6666666667%;
-	}
-	.ontario-xxlarge-6 {
-		width: 50%;
-	}
-	.ontario-xxlarge-7 {
-		width: 58.3333333333%;
-	}
-	.ontario-xxlarge-8 {
-		width: 66.6666666667%;
-	}
-	.ontario-xxlarge-9 {
-		width: 75%;
-	}
-	.ontario-xxlarge-10 {
-		width: 83.3333333333%;
-	}
-	.ontario-xxlarge-11 {
-		width: 91.6666666667%;
-	}
-	.ontario-xxlarge-12 {
-		width: 100%;
-	}
-	.ontario-xxlarge-offset-0 {
-		margin-left: 0 !important;
-	}
-	.ontario-xxlarge-offset-1 {
-		margin-left: 8.3333333333% !important;
-	}
-	.ontario-xxlarge-offset-2 {
-		margin-left: 16.6666666667% !important;
-	}
-	.ontario-xxlarge-offset-3 {
-		margin-left: 25% !important;
-	}
-	.ontario-xxlarge-offset-4 {
-		margin-left: 33.3333333333% !important;
-	}
-	.ontario-xxlarge-offset-5 {
-		margin-left: 41.6666666667% !important;
-	}
-	.ontario-xxlarge-offset-6 {
-		margin-left: 50% !important;
-	}
-	.ontario-xxlarge-offset-7 {
-		margin-left: 58.3333333333% !important;
-	}
-	.ontario-xxlarge-offset-8 {
-		margin-left: 66.6666666667% !important;
-	}
-	.ontario-xxlarge-offset-9 {
-		margin-left: 75% !important;
-	}
-	.ontario-xxlarge-offset-10 {
-		margin-left: 83.3333333333% !important;
-	}
-	.ontario-xxlarge-offset-11 {
-		margin-left: 91.6666666667% !important;
-	}
-	.ontario-xxlarge-reset-order {
-		float: left;
-		left: auto;
-		margin-left: 0;
-		margin-right: 0;
-		right: auto;
-	}
-	.ontario-column.ontario-xxlarge-centered,
-	.ontario-columns.ontario-xxlarge-centered {
-		margin-left: auto;
-		margin-right: auto;
-		float: none;
-	}
-	.ontario-column.ontario-xxlarge-uncentered,
-	.ontario-columns.ontario-xxlarge-uncentered {
-		float: left;
-		margin-left: 0;
-		margin-right: 0;
-	}
-	.ontario-column.ontario-xxlarge-centered:last-child,
-	.ontario-columns.ontario-xxlarge-centered:last-child {
-		float: none;
-	}
-	.ontario-column.ontario-xxlarge-uncentered:last-child,
-	.ontario-columns.ontario-xxlarge-uncentered:last-child {
-		float: left;
-	}
-	.ontario-column.ontario-xxlarge-uncentered.ontario-opposite,
-	.ontario-columns.ontario-xxlarge-uncentered.ontario-opposite {
-		float: right;
-	}
-	.ontario-row.ontario-xxlarge-collapse > .ontario-column,
-	.ontario-row.ontario-xxlarge-collapse > .ontario-columns {
-		padding-left: 0;
-		padding-right: 0;
-	}
-	.ontario-row.ontario-xxlarge-collapse .ontario-row {
-		margin-left: 0;
-		margin-right: 0;
-	}
-	.ontario-row.ontario-xxlarge-uncollapse > .ontario-column,
-	.ontario-row.ontario-xxlarge-uncollapse > .ontario-columns {
-		padding-left: 1rem;
-		padding-right: 1rem;
-		box-sizing: border-box;
-		float: left;
-	}
-}
-/* -------------------------------
-    Global font-size variables
---------------------------------- */
-/* -------------------------------
-    Global letter-spacing variables
---------------------------------- */
-/* -------------------------------
-    Global line-height variables
---------------------------------- */
-/* -------------------------------
-    Global typography variables
---------------------------------- */
-h6,
-.ontario-h6,
-h5,
-.ontario-h5,
-h4,
-.ontario-h4,
-h3,
-.ontario-h3,
-h2,
-.ontario-h2,
-h1,
-.ontario-h1 {
-	font-style: normal;
-	font-weight: 700;
-	text-rendering: optimizeLegibility;
-	margin-bottom: 1rem;
-	font-feature-settings: normal;
-	font-family: 'Raleway Modified', 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
-}
-
-h1,
-.ontario-h1 {
-	font-size: 2rem;
-	letter-spacing: 0.04rem;
-	line-height: 1.29;
-	margin: 2.5rem 0 1.5rem 0;
-	max-width: 70rem;
-}
-@media screen and (min-width: 40em) {
-	h1,
-	.ontario-h1 {
-		font-size: 2.5rem;
-		letter-spacing: 0.04rem;
-		line-height: 1.2;
-	}
-}
-
-h2,
-.ontario-h2 {
-	font-size: 1.6875rem;
-	letter-spacing: 0.03rem;
-	line-height: 1.37;
-	margin: 0 0 0.75rem 0;
-	max-width: 48rem;
-}
-@media screen and (min-width: 40em) {
-	h2,
-	.ontario-h2 {
-		font-size: 2.0625rem;
-		letter-spacing: 0.02rem;
-		line-height: 1.33;
-	}
-}
-
-h3,
-.ontario-h3 {
-	font-size: 1.4375rem;
-	letter-spacing: 0.02rem;
-	line-height: 1.39;
-	margin: 0 0 0.75rem 0;
-	max-width: 48rem;
-}
-@media screen and (min-width: 40em) {
-	h3,
-	.ontario-h3 {
-		font-size: 1.75rem;
-		letter-spacing: 0.02rem;
-		line-height: 1.43;
-	}
-}
-
-h4,
-.ontario-h4 {
-	font-size: 1.25rem;
-	letter-spacing: 0.03rem;
-	line-height: 1.5;
-	margin: 0 0 0.75rem 0;
-	max-width: 48rem;
-}
-@media screen and (min-width: 40em) {
-	h4,
-	.ontario-h4 {
-		font-size: 1.5rem;
-		letter-spacing: 0.0313rem;
-		line-height: 1.5;
-	}
-}
-
-h5,
-.ontario-h5 {
-	font-size: 1.125rem;
-	letter-spacing: 0.03rem;
-	line-height: 1.56;
-	margin: 0 0 0.75rem 0;
-	max-width: 48rem;
-}
-@media screen and (min-width: 40em) {
-	h5,
-	.ontario-h5 {
-		font-size: 1.1875rem;
-		letter-spacing: 0.025rem;
-		line-height: 1.5;
-	}
-}
-
-h6,
-.ontario-h6 {
-	font-size: 1rem;
-	line-height: 1.56;
-	letter-spacing: 0.03rem;
-	max-width: 48rem;
-	margin: 0 0 0.75rem 0;
-}
-@media screen and (min-width: 40em) {
-	h6,
-	.ontario-h6 {
-		font-size: 1rem;
-		letter-spacing: 0.025rem;
-		line-height: 1.5;
-	}
-}
-
-.ontario-lead-statement {
-	font-size: 1.25rem;
-	line-height: 1.6;
-	max-width: 70rem;
-}
-@media screen and (min-width: 40em) {
-	.ontario-lead-statement {
-		font-size: 1.375rem;
-	}
-}
-
-/*
-*  Global elements
-*
-*  1 - Unclassed elements
-*    1.1 - Base
-*    1.2 - Typography
-*    1.3 - Forms
-*    1.4 - Horizontal Rule
-*    1.5 - Lists
-*/
-/*** 1 - Unclassed Elements ***/
-/* Base */
-html {
-	font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
-	font-size: 1rem;
-}
-
-body {
-	font-size: 1rem;
-	line-height: 1.6;
-	background-color: #ffffff;
-	color: #1a1a1a;
-	margin: 0;
-}
-
-/* Typography */
-p {
-	font-size: inherit;
-	margin-bottom: 1.25rem;
-	text-rendering: optimizeLegibility;
-	margin: 0 0 1.5rem 0;
-}
-
-cite {
-	font-style: italic;
-	line-height: inherit;
-}
-
-strong {
-	font-weight: 700;
-	line-height: inherit;
-}
-
-/* everything - including before and after - should inherit their box sizing */
-*,
-*::before,
-*::after {
-	box-sizing: inherit;
-}
-
-main p,
-main p:not(.ontario-lead-statement),
-main dd,
-main li {
-	max-width: 48rem;
-}
-
-hr {
-	border: 0;
-	padding: 0;
-	margin: 2.5rem 0;
-	border-bottom: 4px solid #cccccc;
-}
-
-/* Horizontal Rule */
-hr.ontario-hr--dark {
-	border-bottom: 4px solid #1a1a1a;
-}
-
-a {
-	color: #0066cc;
-	text-decoration: underline;
-}
-a:visited {
-	color: #551a8b;
-}
-a:hover {
-	color: #00478f;
-}
-a:active {
-	color: #002142;
-}
-a:focus {
-	-moz-box-shadow: 0 0 0 4px #009adb;
-	-webkit-box-shadow: 0 0 0 4px #009adb;
-	box-shadow: 0 0 0 4px #009adb;
-	outline: 4px solid transparent;
-	transition: all 0.1s ease-in-out;
-}
-
-​p {
-	margin: 0 0 1.5rem 0;
-}
-
-​p + h1,
-p + h2,
-p + h3,
-p + h4,
-p + h5,
-p + h6,
-ul + h1,
-ul + h2,
-ul + h3,
-ul + h4,
-ul + h5,
-ul + h6,
-ol + h1,
-ol + h2,
-ol + h3,
-ol + h4,
-ol + h5,
-ol + h6,
-h1 + h2,
-h2 + h3,
-h3 + h4,
-h4 + h5,
-h5 + h6 {
-	margin-top: 2rem;
-}
-
-p code,
-td code,
-li code {
-	line-height: 2.25rem;
-}
-
-/* Forms */
-input[type='text'],
-input[type='number'],
-input[type='email'],
-input[type='date'],
-input[type='color'],
-input[type='search'],
-input[type='tel'],
-textarea {
-	background-origin: initial;
-	height: auto;
-	-webkit-appearance: none;
-	-moz-appearance: none;
-}
-
-input[type='checkbox'] + label,
-input[type='radio'] + label {
-	font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
-	font-size: 1rem;
-	font-weight: 400;
-	margin-left: 0;
-	margin-right: 0;
-}
-
-fieldset {
-	border: 0;
-	margin: 0;
-	padding: 0;
-	page-break-inside: avoid;
-}
-
-legend,
-label {
-	display: block;
-	margin: 0;
-}
-
-select {
-	background-origin: initial;
-	height: auto;
-	-webkit-appearance: none;
-	-moz-appearance: none;
-}
-
-/* Lists */
-ul,
-ol {
-	padding: 0;
-}
-
-ul {
-	margin-left: 2rem;
-}
-
-ul li {
-	padding: 0 0 0.75rem 0;
-}
-
-ol {
-	margin-left: 1.75rem;
-}
-
-ol li {
-	padding: 0 0 0.75rem 0.25rem;
-}
-
-ul li:last-child,
-ol li:last-child {
-	padding-bottom: 0;
-}
-
-ul[class*='columns-'] li:last-child,
-ol[class*='columns-'] li:last-child {
-	padding-bottom: 0.75rem;
-}
-
-ul ul,
-ol ul {
-	margin: 0.5rem 0 0.5rem 2rem;
-}
-
-ul ol,
-ol ol {
-	margin: 0.5rem 0 0.5rem 1.75rem;
-}
-
-p + ul,
-p + ol {
-	margin-top: -0.75rem;
-}
-
-@media screen and (min-width: 40em) {
-	ul {
-		margin: 0.5rem 0 1.5rem 3rem;
+@media only screen and (min-width: 120.063em) {
+	.ontario-xxlarge-push-0 {
+		position: relative;
+		left: 0;
+		right: auto;
 	}
-	ol {
-		margin: 0.5rem 0 1.5rem 2.75rem;
+	.ontario-xxlarge-pull-0 {
+		position: relative;
+		right: 0;
+		left: auto;
 	}
-	ul ul,
-	ol ul {
-		margin: 0.5rem 0 0.5rem 3rem;
+	.ontario-xxlarge-push-1 {
+		position: relative;
+		left: 8.3333333333%;
+		right: auto;
 	}
-	ul ol,
-	ol ol {
-		margin: 0.5rem 0 0.5rem 2.75rem;
+	.ontario-xxlarge-pull-1 {
+		position: relative;
+		right: 8.3333333333%;
+		left: auto;
+	}
+	.ontario-xxlarge-push-2 {
+		position: relative;
+		left: 16.6666666667%;
+		right: auto;
+	}
+	.ontario-xxlarge-pull-2 {
+		position: relative;
+		right: 16.6666666667%;
+		left: auto;
+	}
+	.ontario-xxlarge-push-3 {
+		position: relative;
+		left: 25%;
+		right: auto;
+	}
+	.ontario-xxlarge-pull-3 {
+		position: relative;
+		right: 25%;
+		left: auto;
+	}
+	.ontario-xxlarge-push-4 {
+		position: relative;
+		left: 33.3333333333%;
+		right: auto;
+	}
+	.ontario-xxlarge-pull-4 {
+		position: relative;
+		right: 33.3333333333%;
+		left: auto;
+	}
+	.ontario-xxlarge-push-5 {
+		position: relative;
+		left: 41.6666666667%;
+		right: auto;
+	}
+	.ontario-xxlarge-pull-5 {
+		position: relative;
+		right: 41.6666666667%;
+		left: auto;
+	}
+	.ontario-xxlarge-push-6 {
+		position: relative;
+		left: 50%;
+		right: auto;
+	}
+	.ontario-xxlarge-pull-6 {
+		position: relative;
+		right: 50%;
+		left: auto;
+	}
+	.ontario-xxlarge-push-7 {
+		position: relative;
+		left: 58.3333333333%;
+		right: auto;
+	}
+	.ontario-xxlarge-pull-7 {
+		position: relative;
+		right: 58.3333333333%;
+		left: auto;
+	}
+	.ontario-xxlarge-push-8 {
+		position: relative;
+		left: 66.6666666667%;
+		right: auto;
+	}
+	.ontario-xxlarge-pull-8 {
+		position: relative;
+		right: 66.6666666667%;
+		left: auto;
+	}
+	.ontario-xxlarge-push-9 {
+		position: relative;
+		left: 75%;
+		right: auto;
+	}
+	.ontario-xxlarge-pull-9 {
+		position: relative;
+		right: 75%;
+		left: auto;
+	}
+	.ontario-xxlarge-push-10 {
+		position: relative;
+		left: 83.3333333333%;
+		right: auto;
+	}
+	.ontario-xxlarge-pull-10 {
+		position: relative;
+		right: 83.3333333333%;
+		left: auto;
+	}
+	.ontario-xxlarge-push-11 {
+		position: relative;
+		left: 91.6666666667%;
+		right: auto;
+	}
+	.ontario-xxlarge-pull-11 {
+		position: relative;
+		right: 91.6666666667%;
+		left: auto;
+	}
+	.ontario-column,
+	.ontario-columns {
+		position: relative;
+		padding-left: 1rem;
+		padding-right: 1rem;
+		box-sizing: border-box;
+		float: left;
+	}
+	.ontario-xxlarge-1 {
+		width: 8.3333333333%;
+	}
+	.ontario-xxlarge-2 {
+		width: 16.6666666667%;
+	}
+	.ontario-xxlarge-3 {
+		width: 25%;
+	}
+	.ontario-xxlarge-4 {
+		width: 33.3333333333%;
+	}
+	.ontario-xxlarge-5 {
+		width: 41.6666666667%;
+	}
+	.ontario-xxlarge-6 {
+		width: 50%;
+	}
+	.ontario-xxlarge-7 {
+		width: 58.3333333333%;
+	}
+	.ontario-xxlarge-8 {
+		width: 66.6666666667%;
+	}
+	.ontario-xxlarge-9 {
+		width: 75%;
+	}
+	.ontario-xxlarge-10 {
+		width: 83.3333333333%;
+	}
+	.ontario-xxlarge-11 {
+		width: 91.6666666667%;
+	}
+	.ontario-xxlarge-12 {
+		width: 100%;
+	}
+	.ontario-xxlarge-offset-0 {
+		margin-left: 0 !important;
+	}
+	.ontario-xxlarge-offset-1 {
+		margin-left: 8.3333333333% !important;
+	}
+	.ontario-xxlarge-offset-2 {
+		margin-left: 16.6666666667% !important;
+	}
+	.ontario-xxlarge-offset-3 {
+		margin-left: 25% !important;
+	}
+	.ontario-xxlarge-offset-4 {
+		margin-left: 33.3333333333% !important;
+	}
+	.ontario-xxlarge-offset-5 {
+		margin-left: 41.6666666667% !important;
+	}
+	.ontario-xxlarge-offset-6 {
+		margin-left: 50% !important;
+	}
+	.ontario-xxlarge-offset-7 {
+		margin-left: 58.3333333333% !important;
+	}
+	.ontario-xxlarge-offset-8 {
+		margin-left: 66.6666666667% !important;
+	}
+	.ontario-xxlarge-offset-9 {
+		margin-left: 75% !important;
+	}
+	.ontario-xxlarge-offset-10 {
+		margin-left: 83.3333333333% !important;
+	}
+	.ontario-xxlarge-offset-11 {
+		margin-left: 91.6666666667% !important;
+	}
+	.ontario-xxlarge-reset-order {
+		float: left;
+		left: auto;
+		margin-left: 0;
+		margin-right: 0;
+		right: auto;
+	}
+	.ontario-column.ontario-xxlarge-centered,
+	.ontario-columns.ontario-xxlarge-centered {
+		margin-left: auto;
+		margin-right: auto;
+		float: none;
+	}
+	.ontario-column.ontario-xxlarge-uncentered,
+	.ontario-columns.ontario-xxlarge-uncentered {
+		float: left;
+		margin-left: 0;
+		margin-right: 0;
+	}
+	.ontario-column.ontario-xxlarge-centered:last-child,
+	.ontario-columns.ontario-xxlarge-centered:last-child {
+		float: none;
+	}
+	.ontario-column.ontario-xxlarge-uncentered:last-child,
+	.ontario-columns.ontario-xxlarge-uncentered:last-child {
+		float: left;
+	}
+	.ontario-column.ontario-xxlarge-uncentered.ontario-opposite,
+	.ontario-columns.ontario-xxlarge-uncentered.ontario-opposite {
+		float: right;
+	}
+	.ontario-row.ontario-xxlarge-collapse > .ontario-column,
+	.ontario-row.ontario-xxlarge-collapse > .ontario-columns {
+		padding-left: 0;
+		padding-right: 0;
+	}
+	.ontario-row.ontario-xxlarge-collapse .ontario-row {
+		margin-left: 0;
+		margin-right: 0;
+	}
+	.ontario-row.ontario-xxlarge-uncollapse > .ontario-column,
+	.ontario-row.ontario-xxlarge-uncollapse > .ontario-columns {
+		padding-left: 1rem;
+		padding-right: 1rem;
+		box-sizing: border-box;
+		float: left;
 	}
 }
 /*
@@ -2714,7 +2715,7 @@ p + ol {
 .ontario-footer p a:active,
 .ontario-footer__paragraph a:active,
 .ontario-footer__list_item a:active {
-	color: #e6e6e6;
+	color: rgb(229.5, 229.5, 229.5);
 }
 .ontario-footer p a:focus,
 .ontario-footer p a:hover,
@@ -2726,7 +2727,7 @@ p + ol {
 }
 
 .ontario-button.ontario-footer__button {
-	background-color: #1a1a1a;
+	background-color: rgb(25.5, 25.5, 25.5);
 	border: 2px solid #ffffff;
 	border-color: #ffffff;
 	color: #ffffff;
@@ -2747,7 +2748,7 @@ p + ol {
 	cursor: pointer;
 }
 .ontario-button.ontario-footer__button:hover {
-	background-color: #4d4d4d;
+	background-color: rgb(76.5, 76.5, 76.5);
 }
 .ontario-button.ontario-footer__button:focus,
 .ontario-button.ontario-footer__button:active {
@@ -2788,8 +2789,8 @@ p + ol {
 
 /* Default footer */
 .ontario-footer--default {
-	background-color: #1a1a1a;
-	border-bottom: 0.25rem solid #4d4d4d;
+	background-color: rgb(25.5, 25.5, 25.5);
+	border-bottom: 0.25rem solid rgb(76.5, 76.5, 76.5);
 }
 .ontario-footer--default:before {
 	background-size: 112.5rem;
@@ -2811,12 +2812,12 @@ p + ol {
 /* expanded footer */
 .ontario-footer--expanded {
 	padding-top: 0;
-	background-color: #1a1a1a;
-	border-bottom: 0.25rem solid #4d4d4d;
+	background-color: rgb(25.5, 25.5, 25.5);
+	border-bottom: 0.25rem solid rgb(76.5, 76.5, 76.5);
 }
 
 .ontario-footer__expanded-top-section {
-	background-color: #262626;
+	background-color: rgb(38.25, 38.25, 38.25);
 	padding: 4rem 0;
 }
 .ontario-footer__expanded-top-section:before {
@@ -2844,7 +2845,7 @@ p + ol {
 	text-decoration: none;
 }
 .ontario-footer__expanded-top-section .ontario-footer__link:active {
-	color: #e6e6e6;
+	color: rgb(229.5, 229.5, 229.5);
 }
 
 .ontario-footer__expanded-top-section ul {
@@ -2879,6 +2880,6 @@ p + ol {
 }
 
 .ontario-footer__expanded-bottom-section {
-	background-color: #1a1a1a;
+	background-color: rgb(25.5, 25.5, 25.5);
 	padding-top: 4rem;
 }