@charset "UTF-8";

/**
---------------------------------------
NZTA Core stylesheet
---------------------------------------

Front-end architecture for NZTA web properties.
With a nod to inuit.css (https://github.com/inuitcss)


## Some principles:

* https://github.com/csswizardry/CSS-Guidelines
* http://csswizardry.com/2013/01/mindbemding-getting-your-head-round-bem-syntax/
* Comments max 80 columns.


## Browser support

Use progressive enhancement. Ensure critical components
are functional without CSS Transitions or border-radii, for instance.

Layout requires at a minimum support for:

* box-sizing: border-box;
* :before and :after.

pseudo-elements are used for clearing floats and creating elements in the
justify grid system.

This means IE8 and above. Respond.js is included to facilitate correct handling
of simple media queries in IE8.


## Vendor prefixing

Don't worry about writing vendor prefixes in the SaSS. Just write the
standards-first property, and the fallbacks will be automatically generated.

For instance:

```
transition: opacity .2s;
```

will generate:

```
-webkit-transition: opacity .2s;
   -moz-transition: opacity .2s;
    -ms-transition: opacity .2s;
        transition: opacity .2s;
```

This is handled via grunt-autoprefixer:
https://github.com/nDmitry/grunt-autoprefixer

*/

/**
*
* CONTENTS
*
* Config .............. Globally-available variables and config.
*
* Mixins............... Useful mixins.
*
* Reset................ A level playing fields.
*
* Extends ............. Globally-available extends.
*
* Type ................ Text sizes, Heirarchy, H1–H6 styles..
*
* Layout .............. Layout modifiers along with vertical and horizontal spacing.
*
* Icons ............... Icons
*
* Themes .............. Themes
*
* Playpen ............. The place where we solve design problems without dirtying up the sass structure
*
* Components .......... Components (See below for the component list)
*
* Form Components ..... Form Components (See below for the component list)
*
* Pages ............... Page specific styles
*
*
*/

/* base colours */

/* link colours */

/*------------------------------------*\
    #MIXINS
\*------------------------------------*/

html {
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
  height: 100%;
  min-height: 100%;
  background-color: #F2F4F7;
}

body {
  margin: 0;
  background-color: #fff;
  color: #555;
  font-family: "Source Sans Pro", "Helvetica Neue", sans-serif;
  line-height: 1.5;
  position: relative;
  min-height: 100%;
}

audio,
canvas,
video {
  display: inline-block;
}

audio:not([controls]) {
  display: none;
  height: 0;
}

[hidden],
template {
  display: none;
}

abbr[title] {
  border-bottom: 1px dotted;
}

b,
strong {
  font-weight: bold;
}

dfn {
  font-style: italic;
}

hr {
  height: 0;
}

mark {
  background: #ff0;
  color: #000;
}

code,
kbd,
pre,
samp {
  font-family: monospace, serif;
  font-size: 1em;
}

pre {
  white-space: pre-wrap;
}

q {
  quotes: "\201C" "\201D" "\2018" "\2019";
}

small {
  font-size: 80%;
}

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

del {
  text-decoration: line-through;
}

img {
  border: 0;
}

svg:not(:root) {
  overflow: hidden;
}

figure {
  display: block;
  margin: 0;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

blockquote {
  quotes: none;
}

blockquote:before,
blockquote:after {
  content: none;
}

/*------------------------------------*\
    #EXTENDS
\*------------------------------------*/

.breadcrumb,
.list-inline,
.nav,
.pagination ul,
.block-list,
.anchor-links,
.list-unstyled,
.nav-list,
.radio-button-list,
.segmented-control,
.segmented-control--1-segments,
.segmented-control--2-segments,
.segmented-control--3-segments,
.segmented-control--4-segments,
.segmented-control--5-segments,
.segmented-control--6-segments,
.segmented-control--7-segments,
.segmented-control--8-segments,
.segmented-control--9-segments,
.segmented-control--10-segments,
.segmented-control--11-segments,
.segmented-control--12-segments,
.segmented-control--13-segments,
.segmented-control--14-segments,
.location-list,
.route,
.webcam-list,
.search__results-items,
.block-list .block__content ol {
  list-style: none;
  padding-left: 0;
}

.breadcrumb > li,
.list-inline > li,
.nav > li,
.pagination ul > li,
.block-list > li,
.anchor-links > li,
.list-unstyled > li,
.nav-list > li,
.radio-button-list > li,
.segmented-control > li,
.segmented-control--1-segments > li,
.segmented-control--2-segments > li,
.segmented-control--3-segments > li,
.segmented-control--4-segments > li,
.segmented-control--5-segments > li,
.segmented-control--6-segments > li,
.segmented-control--7-segments > li,
.segmented-control--8-segments > li,
.segmented-control--9-segments > li,
.segmented-control--10-segments > li,
.segmented-control--11-segments > li,
.segmented-control--12-segments > li,
.segmented-control--13-segments > li,
.segmented-control--14-segments > li,
.location-list > li,
.route > li,
.webcam-list > li,
.search__results-items > li,
.block-list .block__content ol > li {
  list-style: none;
  margin: 0;
}

.breadcrumb > li,
.list-inline > li,
.nav > li,
.pagination ul > li {
  margin-top: 0;
  display: inline-block;
  padding-left: 0;
}

.list-styled--disc {
  list-style-type: disc;
}

.block-list > li {
  display: block;
}

.text-center,
.grid--center,
.btn,
.btn--submit,
.email-wrapper input[type='submit'],
.search-wrapper .search-submit,
.segmented-control label,
.form-50max .segmented-control label {
  text-align: center;
}

.text-left,
dd,
.grid--justify > *,
.subnav--tertiary,
.segmented-control--timeslots label {
  text-align: left;
}

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

.uppercase {
  text-transform: uppercase;
}

.lowercase {
  text-transform: lowercase;
}

.breadcrumb > li {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}

.layout--nudge,
.relative,
.anchor-links li,
.section--nav > .section__content,
.global-nav,
.global-nav .search-container,
.field--prev-next,
.radio-button-list > li,
.segmented-control > li,
.form-50max .segmented-control > li {
  position: relative;
}

.anchor-links li:before,
.anchor-links li:after,
.section--nav,
body:after,
.header__image + .header__title,
.prev-link:before,
.next-link:after,
.radio-button-list input,
.segmented-control input,
.form-50max .segmented-control input {
  position: absolute;
}

dl dt,
.left,
.prev-link,
.email-wrapper [type='email'],
.segmented-control > li,
.form-50max .segmented-control > li,
.search-wrapper .search-term {
  float: left;
}

.right,
.footer_social-links,
.global-nav__items > *,
.next-link,
.segmented-control--timeslots label span,
.publication .publication__summary .publication__summary--image {
  float: right;
}

.subnav--tertiary,
.grid > *,
.grid__item {
  vertical-align: top;
}

.grid--middle > *,
.pill,
.pill--roadworks,
.pill--orange {
  vertical-align: middle;
}

.grid--bottom > * {
  vertical-align: bottom;
}

.anchor-links li:before,
.prev-link:before,
.radio-button-list input {
  left: 0;
}

.next-link:after {
  right: 0;
}

.anchor-links li:before,
.anchor-links li:after,
.prev-link:before,
.next-link:after {
  width: 0;
}

.grid--justify:after,
.section--nav > .section__content:after,
.anchor-links li:before,
.anchor-links li:after,
.prev-link:before,
.next-link:after {
  height: 0;
}

.link-complex,
.statistics__figure,
.statistics__label,
.statistics__sub-label,
.header__image img,
.field__label,
.field__input,
.field,
[type='text'],
[type='email'],
[type='date'],
[type='number'],
[type='password'],
label,
select,
.radio-button-list label span,
.segmented-control label span,
.form-50max .segmented-control label span {
  display: block;
}

.breadcrumb > li,
.footer_pages a,
.grid > *,
.grid > .grid,
.grid--justify > *,
.grid--justify:after,
.subnav--tertiary,
.section--nav > .section__content:after,
.breadcrumb > li:last-child,
.btn,
.btn--submit,
.email-wrapper input[type='submit'],
.search-wrapper .search-submit,
.share-nav > li > a,
.field--bare,
.segmented-control > li,
.form-50max .segmented-control > li,
.traffic-metrics > *,
.map-nav__item > a > span,
.section--map-nav,
.route__item:after,
.webcam-list,
.webcam-list > li,
.map-nav--view-type,
.switch-nav {
  display: inline-block;
  *display: inline;
  *zoom: 1;
}

h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child,
h6:first-child,
p:first-child,
.text:first-child,
li:first-child,
code:first-child,
.intro:first-child,
.news .news__intro:first-child,
ul:first-child,
dt:first-child,
dd:first-child,
td:first-child,
.btn--block:first-child,
.btn--submit:first-child {
  margin-top: 0;
}

.breadcrumb,
.list-inline,
.nav,
.pagination ul,
.share-nav,
.field--link,
.field--prev-next,
.radio-button-list > li,
.field--radio-button-group,
.segmented-control,
.form-50max .segmented-control,
.traffic-info__body h3,
.traffic-info__body h4,
.map-nav--view-type,
.switch-nav,
.search__filters,
.publication .publication__summary,
.ccos-graphic,
.accordian-item {
  /**
     * For IE 6/7 only
     * Include this rule to trigger hasLayout and contain floats.
     */
  *zoom: 1;
}

.breadcrumb:before,
.list-inline:before,
.nav:before,
.pagination ul:before,
.share-nav:before,
.field--link:before,
.field--prev-next:before,
.radio-button-list > li:before,
.field--radio-button-group:before,
.segmented-control:before,
.form-50max .segmented-control:before,
.traffic-info__body h3:before,
.traffic-info__body h4:before,
.map-nav--view-type:before,
.switch-nav:before,
.search__filters:before,
.publication .publication__summary:before,
.ccos-graphic:before,
.accordian-item:before {
  content: " ";
  /* 1 */
  display: table;
  /* 2 */
}

.breadcrumb:after,
.list-inline:after,
.nav:after,
.pagination ul:after,
.share-nav:after,
.field--link:after,
.field--prev-next:after,
.radio-button-list > li:after,
.field--radio-button-group:after,
.segmented-control:after,
.form-50max .segmented-control:after,
.traffic-info__body h3:after,
.traffic-info__body h4:after,
.map-nav--view-type:after,
.switch-nav:after,
.search__filters:after,
.publication .publication__summary:after,
.ccos-graphic:after,
.accordian-item:after {
  clear: both;
  content: " ";
  /* 1 */
  display: table;
  /* 2 */
}

.hide {
  display: none;
}

.show {
  display: block;
}

.visible {
  visibility: visible !important;
}

.hidden,
.segmented-control input,
.form-50max .segmented-control input {
  visibility: hidden !important;
}

.layout,
.btn,
.btn--submit,
.email-wrapper input[type='submit'],
.search-wrapper .search-submit,
.field,
[type='text'],
[type='email'],
[type='date'],
[type='number'],
[type='password'] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
.text,
li,
code,
.intro,
.news .news__intro,
ul,
blockquote,
caption,
address,
dd,
.breadcrumb > li,
.anchor-links li,
.btn,
.btn--submit,
.email-wrapper input[type='submit'],
.search-wrapper .search-submit,
.statistics__figure,
.statistics__label,
.subnav__child,
.prev-link,
.next-link,
.radio-button-list > li,
.grid--isotope.grid--isotope-thirds .col--isotope__metadata.title-highlight,
.grid--isotope.grid--isotope-thirds .innovation-article .innovationarticle-grid .innovationarticle-overview h3.col--isotope__metadata,
.innovation-article .innovationarticle-grid .innovationarticle-overview .grid--isotope.grid--isotope-thirds h3.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .innovation-article .innovationarticle-grid .innovationarticle-content h3.col--isotope__metadata,
.innovation-article .innovationarticle-grid .innovationarticle-content .grid--isotope.grid--isotope-thirds h3.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .lesson-alert .lessonalert-grid .lessonalert-overview h1.col--isotope__metadata,
.lesson-alert .lessonalert-grid .lessonalert-overview .grid--isotope.grid--isotope-thirds h1.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .lesson-alert .lessonalert-grid .lessonalert-overview h2.col--isotope__metadata,
.lesson-alert .lessonalert-grid .lessonalert-overview .grid--isotope.grid--isotope-thirds h2.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .lesson-alert .lessonalert-grid .lessonalert-overview h3.col--isotope__metadata,
.lesson-alert .lessonalert-grid .lessonalert-overview .grid--isotope.grid--isotope-thirds h3.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .lesson-alert .lessonalert-grid .lessonalert-overview h4.col--isotope__metadata,
.lesson-alert .lessonalert-grid .lessonalert-overview .grid--isotope.grid--isotope-thirds h4.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .lesson-alert .lessonalert-grid .lessonalert-overview h5.col--isotope__metadata,
.lesson-alert .lessonalert-grid .lessonalert-overview .grid--isotope.grid--isotope-thirds h5.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .lesson-alert .lessonalert-grid .lessonalert-overview h6.col--isotope__metadata,
.lesson-alert .lessonalert-grid .lessonalert-overview .grid--isotope.grid--isotope-thirds h6.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .landing-overview h1.col--isotope__metadata,
.landing-overview .grid--isotope.grid--isotope-thirds h1.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .landing-overview h2.col--isotope__metadata,
.landing-overview .grid--isotope.grid--isotope-thirds h2.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .landing-overview h3.col--isotope__metadata,
.landing-overview .grid--isotope.grid--isotope-thirds h3.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .landing-overview h4.col--isotope__metadata,
.landing-overview .grid--isotope.grid--isotope-thirds h4.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .landing-overview h5.col--isotope__metadata,
.landing-overview .grid--isotope.grid--isotope-thirds h5.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .landing-overview h6.col--isotope__metadata,
.landing-overview .grid--isotope.grid--isotope-thirds h6.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .highwayreview .highwayreview-grid .highwayreview-overview h1.col--isotope__metadata,
.highwayreview .highwayreview-grid .highwayreview-overview .grid--isotope.grid--isotope-thirds h1.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .highwayreview .highwayreview-grid .highwayreview-overview h2.col--isotope__metadata,
.highwayreview .highwayreview-grid .highwayreview-overview .grid--isotope.grid--isotope-thirds h2.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .highwayreview .highwayreview-grid .highwayreview-overview h3.col--isotope__metadata,
.highwayreview .highwayreview-grid .highwayreview-overview .grid--isotope.grid--isotope-thirds h3.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .highwayreview .highwayreview-grid .highwayreview-overview h4.col--isotope__metadata,
.highwayreview .highwayreview-grid .highwayreview-overview .grid--isotope.grid--isotope-thirds h4.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .highwayreview .highwayreview-grid .highwayreview-overview h5.col--isotope__metadata,
.highwayreview .highwayreview-grid .highwayreview-overview .grid--isotope.grid--isotope-thirds h5.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .highwayreview .highwayreview-grid .highwayreview-overview h6.col--isotope__metadata,
.highwayreview .highwayreview-grid .highwayreview-overview .grid--isotope.grid--isotope-thirds h6.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .highwayreview .highwayreview-grid .highwayreview-content h1.col--isotope__metadata,
.highwayreview .highwayreview-grid .highwayreview-content .grid--isotope.grid--isotope-thirds h1.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .highwayreview .highwayreview-grid .highwayreview-content h2.col--isotope__metadata,
.highwayreview .highwayreview-grid .highwayreview-content .grid--isotope.grid--isotope-thirds h2.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .highwayreview .highwayreview-grid .highwayreview-content h3.col--isotope__metadata,
.highwayreview .highwayreview-grid .highwayreview-content .grid--isotope.grid--isotope-thirds h3.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .highwayreview .highwayreview-grid .highwayreview-content h4.col--isotope__metadata,
.highwayreview .highwayreview-grid .highwayreview-content .grid--isotope.grid--isotope-thirds h4.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .highwayreview .highwayreview-grid .highwayreview-content h5.col--isotope__metadata,
.highwayreview .highwayreview-grid .highwayreview-content .grid--isotope.grid--isotope-thirds h5.col--isotope__metadata,
.grid--isotope.grid--isotope-thirds .highwayreview .highwayreview-grid .highwayreview-content h6.col--isotope__metadata,
.highwayreview .highwayreview-grid .highwayreview-content .grid--isotope.grid--isotope-thirds h6.col--isotope__metadata {
  margin-top: 0px;
  margin-top: 0rem;
  /* fallback  times by 6 */
}

.field__label + .field__note,
.form-50max .field__label + #Form_Form_50maxTextField4-error2,
.field--error .field__label + .error.message {
  margin-top: 4px;
  margin-top: 0.25rem;
  /* fallback  times by 6 */
}

.action > span,
.field__label + .field__input,
.field__note + .field__note,
.form-50max #Form_Form_50maxTextField4-error2 + .field__note,
.field--error .error.message + .field__note,
.form-50max .field__note + #Form_Form_50maxTextField4-error2,
.form-50max #Form_Form_50maxTextField4-error2 + #Form_Form_50maxTextField4-error2,
.field--error .form-50max .error.message + #Form_Form_50maxTextField4-error2,
.form-50max .field--error .error.message + #Form_Form_50maxTextField4-error2,
.form-50max .field--error #Form_Form_50maxTextField4-error2 + .error.message,
.field--error .form-50max #Form_Form_50maxTextField4-error2 + .error.message,
.field__input + .field__note,
.form-50max .field__input + #Form_Form_50maxTextField4-error2,
.field--error .error.message,
.innovation-article .innovationarticle-grid .innovationarticle-share,
.lesson-alert .lessonalert-grid .lessonalert-share,
.highwayreview .highwayreview-grid .highwayreview-share {
  margin-top: 8px;
  margin-top: 0.5rem;
  /* fallback  times by 6 */
}

.field__note + .field__input,
.form-50max #Form_Form_50maxTextField4-error2 + .field__input,
.field--error .error.message + .field__input {
  margin-top: 12px;
  margin-top: 0.75rem;
  /* fallback  times by 6 */
}

.btn--block,
.btn--submit,
.subnav--tertiary .breakline--hatched,
.innovation-article .innovationarticle-grid .innovationarticle-info-header,
.lesson-alert .lessonalert-grid .lessonalert-info-header,
.highwayreview .highwayreview-grid .highwayreview-info-header {
  margin-top: 16px;
  margin-top: 1rem;
  /* fallback  times by 6 */
}

.spacing.spacing--l {
  margin-top: 20px;
  margin-top: 1.25rem;
  /* fallback  times by 6 */
}

.link-complex + .link-complex,
.innovation-article .innovationarticle-grid .innovationarticle-overview,
.innovation-article .innovationarticle-grid .innovationarticle-content,
.lesson-alert .lessonalert-grid .lessonalert-overview,
.highwayreview .highwayreview-likebox {
  margin-top: 24px;
  margin-top: 1.5rem;
  /* fallback  times by 6 */
}

hr,
.field--link,
.creative-commons-license,
.motorcycle-scheme .motorcycle-scheme__section,
.highwayreview .highwayreview-discovery {
  margin-top: 28px;
  margin-top: 1.75rem;
  /* fallback  times by 6 */
}

.spacing.spacing--xxxl {
  margin-top: 32px;
  margin-top: 2rem;
  /* fallback  times by 6 */
}

.innovation-article .innovationarticle-grid .innovationarticle-likebox {
  margin-top: 48px;
  margin-top: 3rem;
  /* fallback  times by 6 */
}

.horizontal-icon-list,
.list--home,
.btn,
.btn--submit,
.email-wrapper input[type='submit'],
.search-wrapper .search-submit,
li ul,
li ol,
.statistics__figure,
.statistics__label,
.layout .content-block:last-child,
.traffic-info__header h1,
.traffic-info__header h2,
.traffic-info__body h5,
.traffic-info__body p,
.traffic-info__body h3,
.traffic-info__body h4,
.nav.nav--landing,
.nav.nav--landing .btn--custom {
  margin-bottom: 0px;
  margin-bottom: 0rem;
  /* fallback  times by 6 */
}

.nav-transaction__title,
.field--dropdown .error.message,
.innovation-article .innovationarticle-grid .innovationarticle-likebox h3,
.innovation-article .innovationarticle-grid .innovationarticle-share,
.lesson-alert .lessonalert-grid .lessonalert-share,
.comment__author,
.highwayreview .highwayreview-grid .highwayreview-share,
.highwayreview .highwayreview-likebox h3 {
  margin-bottom: 8px;
  margin-bottom: 0.5rem;
  /* fallback  times by 6 */
}

.list--home li,
.footer_pages a,
.breadcrumb,
.innovation-article .innovationarticle-grid .innovationarticle-likebox {
  margin-bottom: 12px;
  margin-bottom: 0.75rem;
  /* fallback  times by 6 */
}

h2,
h3,
h4,
h5,
h6,
.intro,
.news .news__intro,
.anchor-links {
  margin-bottom: 16px;
  margin-bottom: 1rem;
  /* fallback  times by 6 */
}

.styleguide__example .theme--confirmation,
.styleguide__example .theme--error,
.horizontal-icon-list li,
.spacing.spacing--l,
.search-formset,
.search-licence,
.innovation-article .innovationarticle-related-section .related-pages-summary,
.highwayreview .highwayreview-related-section .related-pages-summary,
.cycle-related-section .related-pages-summary {
  margin-bottom: 20px;
  margin-bottom: 1.25rem;
  /* fallback  times by 6 */
}

.list-styled--disc,
ul,
ol,
.motorcycle-scheme .motorcycle-scheme__filter,
.highwayreview .highwayreview-likebox {
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
  /* fallback  times by 6 */
}

hr,
.btn,
.btn--submit,
.email-wrapper input[type='submit'],
.search-wrapper .search-submit,
.subnav .subnav__intro,
.subnav--tertiary,
table,
.search__filters,
.publication .publication__summary,
.publication .publication__details,
.publication .publication__order-details,
.publication .publication__sections,
.publication__list-subscribe-content,
.innovation-article .innovationarticle-grid .innovationarticle-overview,
.innovation-article .innovationarticle-grid .innovationarticle-content,
.innovation-article .innovationarticle-grid .innovationarticle-content p,
.lesson-alert .lessonalert-grid .lessonalert-overview,
.highwayreview .highwayreview-grid .highwayreview-overview {
  margin-bottom: 28px;
  margin-bottom: 1.75rem;
  /* fallback  times by 6 */
}

h1,
.intro:last-child,
.news .news__intro:last-child,
.header-search,
.primary-subnav,
.secondary-subnav,
.field,
.field--select,
.field--number,
.field--text,
.field--prev-next,
.field--email-plus-submit,
.field--radio-button-list,
.field--details,
.field--radio-button-group,
.field--submit,
.field--search,
.spacing.spacing--xxxl,
.motorcycle-scheme .motorcycle-scheme__nav,
.motorcycle-scheme .motorcycle-scheme__section {
  margin-bottom: 32px;
  margin-bottom: 2rem;
  /* fallback  times by 6 */
}

.highwayreview .highwayreview-likebox--mb-large {
  margin-bottom: 48px;
  margin-bottom: 3rem;
  /* fallback  times by 6 */
}

dd {
  margin-left: 0px;
  margin-left: 0rem;
  /* fallback  times by 6 */
}

.icon-link--reversed i,
.comment__date {
  margin-left: 16px;
  margin-left: 1rem;
  /* fallback  times by 6 */
}

.footer_social-links a,
.btn + .btn,
li ul,
li ol {
  margin-left: 20px;
  margin-left: 1.25rem;
  /* fallback  times by 6 */
}

.nav.nav--landing > li:last-child,
.nav.nav--landing > li {
  margin-right: 0px;
  margin-right: 0rem;
  /* fallback  times by 6 */
}

.webcam__last-update > .i {
  margin-right: 4px;
  margin-right: 0.25rem;
  /* fallback  times by 6 */
}

.comments-form-toggle.toggle-control i {
  margin-right: 12px;
  margin-right: 0.75rem;
  /* fallback  times by 6 */
}

.icon-link i,
.global-nav .search-container {
  margin-right: 16px;
  margin-right: 1rem;
  /* fallback  times by 6 */
}

.footer_pages a {
  margin-right: 20px;
  margin-right: 1.25rem;
  /* fallback  times by 6 */
}

@media only screen {

}

@media only screen and (min-width: 37.5em) {

}

@media only screen and (max-width: 59.99em) {

}

@media only screen and (min-width: 60em) {

}

@media only screen and (min-width: 75em) {

}

.publication .publication__heading {
  padding-top: 0px;
  padding-top: 0rem;
  /* fallback  times by 6 */
}

.subnav__child,
.segmented-control--timeslots label span,
.btn.btn--isotope-load,
.nav.nav--landing .btn--custom {
  padding-top: 4px;
  padding-top: 0.25rem;
  /* fallback  times by 6 */
}

li ul,
li ol,
.field,
[type='text'],
[type='email'],
[type='date'],
[type='number'],
[type='password'],
.segmented-control label,
.form-50max .segmented-control label {
  padding-top: 8px;
  padding-top: 0.5rem;
  /* fallback  times by 6 */
}

.btn,
.btn--submit,
.email-wrapper input[type='submit'],
.search-wrapper .search-submit,
.radio-button-list label,
.segmented-control--timeslots label {
  padding-top: 12px;
  padding-top: 0.75rem;
  /* fallback  times by 6 */
}

.action,
.subnav--tertiary h3,
.global-nav,
.homepage .content__right,
.grid--isotope.grid--isotope-thirds .col--isotope__content,
.nav.nav--landing {
  padding-top: 16px;
  padding-top: 1rem;
  /* fallback  times by 6 */
}

.subnav h2,
.subnav h3,
.subnav--tertiary .breakline--hatched,
.isotope__no-results {
  padding-top: 20px;
  padding-top: 1.25rem;
  /* fallback  times by 6 */
}

.innovation-article .innovationarticle-grid .innovationarticle-likebox,
.highwayreview .highwayreview-likebox {
  padding-top: 24px;
  padding-top: 1.5rem;
  /* fallback  times by 6 */
}

.subnav .link-complex > h2,
.homepage .content__right {
  padding-top: 28px;
  padding-top: 1.75rem;
  /* fallback  times by 6 */
}

.anchor-links,
.content-block h2,
.block--border-top,
.comments-list.root-level > .comment {
  padding-top: 32px;
  padding-top: 2rem;
  /* fallback  times by 6 */
}

.btn.btn--isotope-load,
.nav.nav--landing .btn--custom {
  padding-bottom: 4px;
  padding-bottom: 0.25rem;
  /* fallback  times by 6 */
}

.subnav__child,
.field,
[type='text'],
[type='email'],
[type='date'],
[type='number'],
[type='password'],
.grid--isotope.grid--isotope-thirds .col--isotope__content {
  padding-bottom: 8px;
  padding-bottom: 0.5rem;
  /* fallback  times by 6 */
}

.btn,
.btn--submit,
.email-wrapper input[type='submit'],
.search-wrapper .search-submit,
.radio-button-list label,
.segmented-control label,
.form-50max .segmented-control label,
.segmented-control--timeslots label {
  padding-bottom: 12px;
  padding-bottom: 0.75rem;
  /* fallback  times by 6 */
}

.transaction_links,
.nav-transaction ul > li,
.global-nav {
  padding-bottom: 16px;
  padding-bottom: 1rem;
  /* fallback  times by 6 */
}

.isotope__no-results {
  padding-bottom: 20px;
  padding-bottom: 1.25rem;
  /* fallback  times by 6 */
}

.nav-list > li,
.innovation-article .innovationarticle-grid .innovationarticle-likebox,
.highwayreview .highwayreview-likebox {
  padding-bottom: 24px;
  padding-bottom: 1.5rem;
  /* fallback  times by 6 */
}

.anchor-links {
  padding-bottom: 32px;
  padding-bottom: 2rem;
  /* fallback  times by 6 */
}

.innovation-article .innovationarticle-grid .innovationarticle-viewmore {
  padding-bottom: 48px;
  padding-bottom: 3rem;
  /* fallback  times by 6 */
}

.innovation-article .innovationarticle-grid .innovationarticle-share .share-list li:first-child {
  padding-left: 0px;
  padding-left: 0rem;
  /* fallback  times by 6 */
}

.breadcrumb > li a:after,
.breadcrumb > li .back:before,
.breadcrumb > li .close:before,
.innovation-article .innovationarticle-grid .innovationarticle-info-header .list > li:after,
.lesson-alert .lessonalert-grid .lessonalert-info-header .list > li:after,
.highwayreview .highwayreview-grid .highwayreview-info-header .list > li:after {
  padding-left: 4px;
  padding-left: 0.25rem;
  /* fallback  times by 6 */
}

.footer_pages span,
.innovation-form .field,
.innovation-form [type='text'],
.innovation-form [type='email'],
.innovation-form [type='date'],
.innovation-form [type='number'],
.innovation-form [type='password'] {
  padding-left: 8px;
  padding-left: 0.5rem;
  /* fallback  times by 6 */
}

.list--home,
.global-nav .search__input,
.field,
[type='text'],
[type='email'],
[type='date'],
[type='number'],
[type='password'],
.segmented-control--timeslots label {
  padding-left: 12px;
  padding-left: 0.75rem;
  /* fallback  times by 6 */
}

.anchor-links,
.list-styled--disc,
ul,
ol,
.prev-link {
  padding-left: 16px;
  padding-left: 1rem;
  /* fallback  times by 6 */
}

.btn,
.btn--submit,
.email-wrapper input[type='submit'],
.search-wrapper .search-submit,
.global-nav .menu-small {
  padding-left: 20px;
  padding-left: 1.25rem;
  /* fallback  times by 6 */
}

.radio-button-list label {
  padding-left: 32px;
  padding-left: 2rem;
  /* fallback  times by 6 */
}

.radio-button-list label,
.innovation-article .innovationarticle-grid .innovationarticle-share .share-list li:last-child,
.lesson-alert .lessonalert-grid .lessonalert-share .share-list li:last-child,
.highwayreview .highwayreview-grid .highwayreview-share .share-list li:last-child {
  padding-right: 0px;
  padding-right: 0rem;
  /* fallback  times by 6 */
}

.breadcrumb > li a:after,
.breadcrumb > li .back:before,
.breadcrumb > li .close:before,
.innovation-article .innovationarticle-grid .innovationarticle-info-header .list > li:after,
.lesson-alert .lessonalert-grid .lessonalert-info-header .list > li:after,
.highwayreview .highwayreview-grid .highwayreview-info-header .list > li:after {
  padding-right: 4px;
  padding-right: 0.25rem;
  /* fallback  times by 6 */
}

.innovation-form .field,
.innovation-form [type='text'],
.innovation-form [type='email'],
.innovation-form [type='date'],
.innovation-form [type='number'],
.innovation-form [type='password'] {
  padding-right: 8px;
  padding-right: 0.5rem;
  /* fallback  times by 6 */
}

.field,
[type='text'],
[type='email'],
[type='date'],
[type='number'],
[type='password'],
.segmented-control--timeslots label {
  padding-right: 12px;
  padding-right: 0.75rem;
  /* fallback  times by 6 */
}

.anchor-links,
.statistics__label,
.next-link {
  padding-right: 16px;
  padding-right: 1rem;
  /* fallback  times by 6 */
}

.btn,
.btn--submit,
.email-wrapper input[type='submit'],
.search-wrapper .search-submit,
.global-nav .search-small {
  padding-right: 20px;
  padding-right: 1.25rem;
  /* fallback  times by 6 */
}

@media only screen {

}

@media only screen and (min-width: 37.5em) {
  .global-nav {
    padding-top: 24px;
    padding-top: 1.5rem;
    /* fallback  times by 6 */
  }

  .global-nav {
    padding-bottom: 24px;
    padding-bottom: 1.5rem;
    /* fallback  times by 6 */
  }
}

@media only screen and (max-width: 59.99em) {
  .content-block .content-block__icon {
    padding-top: 20px;
    padding-top: 1.25rem;
    /* fallback  times by 6 */
  }
}

@media only screen and (min-width: 60em) {

}

@media only screen and (min-width: 75em) {

}

fieldset {
  padding: 0;
}

fieldset,
.field,
[type='text'],
[type='email'],
[type='date'],
[type='number'],
[type='password'],
.segmented-control > li,
.form-50max .segmented-control > li {
  margin: 0;
}

.body-copy a,
.textlink,
.theme--error a,
.theme--confirmation a {
  text-decoration: none;
  background-repeat: repeat-x;
  -webkit-background-size: .125em .125em;
  background-size: .125em .125em;
}

.body-copy a,
.textlink,
.theme--error a,
.theme--confirmation a {
  background-position: 0 100%;
}

.breadcrumb > li a,
.btn,
.btn--submit,
.email-wrapper input[type='submit'],
.search-wrapper .search-submit,
.link-complex {
  background-image: none !important;
}

.subnav h2,
.subnav h3,
.subnav--tertiary h3,
.content-block h2,
.search__results-set-heading,
.block--border-top,
.comments-list.root-level > .comment,
.flowchart h2 {
  position: relative;
}

.subnav h2:before,
.subnav h3:before,
.subnav--tertiary h3:before,
.content-block h2:before,
.search__results-set-heading:before,
.block--border-top:before,
.comments-list.root-level > .comment:before,
.flowchart h2:before {
  height: 2px;
  display: block;
  width: 22.5%;
  background: rgba(37, 117, 174, 0.5);
  content: '';
  position: absolute;
  top: 0;
  left: 0;
}

.subnav h2:after,
.subnav h3:after,
.subnav--tertiary h3:after,
.content-block h2:after,
.search__results-set-heading:after,
.block--border-top:after,
.comments-list.root-level > .comment:after,
.flowchart h2:after {
  display: block;
  content: '';
  background: rgba(37, 117, 174, 0.25);
  height: 1px;
  width: 72.5%;
  top: 0;
  right: 0;
  position: absolute;
}

.btn--submit:hover,
.segmented-control label:hover {
  cursor: pointer;
}

.segmented-control--1-segments li,
.form-50max .segmented-control.segmented-control--1-segments li {
  border-radius: 4px;
  border-radius: 0.25rem;
}

.back-to-top-anchor {
  border-top-left-radius: 4px;
  border-top-left-radius: 0.25rem;
  border-top-right-radius: 4px;
  border-top-right-radius: 0.25rem;
}

.segmented-control--2-segments li:first-child,
.form-50max .segmented-control.segmented-control--2-segments li:first-child,
.segmented-control--3-segments li:first-child,
.form-50max .segmented-control.segmented-control--3-segments li:first-child,
.segmented-control--4-segments li:first-child,
.form-50max .segmented-control.segmented-control--4-segments li:first-child,
.segmented-control--5-segments li:first-child,
.form-50max .segmented-control.segmented-control--5-segments li:first-child {
  border-top-left-radius: 4px;
  border-top-left-radius: 0.25rem;
  border-bottom-left-radius: 4px;
  border-bottom-left-radius: 0.25rem;
}

.segmented-control--2-segments li:last-child,
.form-50max .segmented-control.segmented-control--2-segments li:last-child,
.segmented-control--3-segments li:last-child,
.form-50max .segmented-control.segmented-control--3-segments li:last-child,
.segmented-control--4-segments li:last-child,
.form-50max .segmented-control.segmented-control--4-segments li:last-child,
.segmented-control--5-segments li:last-child,
.form-50max .segmented-control.segmented-control--5-segments li:last-child,
.segmented-control--7-segments li:nth-child(2),
.form-50max .segmented-control.segmented-control--7-segments li:nth-child(2) {
  border-top-right-radius: 4px;
  border-top-right-radius: 0.25rem;
  border-bottom-right-radius: 4px;
  border-bottom-right-radius: 0.25rem;
}

.segmented-control--6-segments li:nth-child(3),
.form-50max .segmented-control.segmented-control--6-segments li:nth-child(3),
.segmented-control--8-segments li:nth-child(4),
.form-50max .segmented-control.segmented-control--8-segments li:nth-child(4),
.segmented-control--9-segments li:nth-child(3),
.form-50max .segmented-control.segmented-control--9-segments li:nth-child(3),
.segmented-control--10-segments li:nth-child(5),
.form-50max .segmented-control.segmented-control--10-segments li:nth-child(5),
.segmented-control--11-segments li:nth-child(4),
.form-50max .segmented-control.segmented-control--11-segments li:nth-child(4),
.segmented-control--12-segments li:nth-child(4),
.form-50max .segmented-control.segmented-control--12-segments li:nth-child(4),
.segmented-control--13-segments li:nth-child(2),
.form-50max .segmented-control.segmented-control--13-segments li:nth-child(2),
.segmented-control--14-segments li:nth-child(2) {
  border-top-right-radius: 4px;
  border-top-right-radius: 0.25rem;
}

.segmented-control > li:last-child,
.segmented-control--7-segments li:nth-child(6),
.form-50max .segmented-control.segmented-control--7-segments li:nth-child(6),
.segmented-control--11-segments li:nth-child(8),
.form-50max .segmented-control.segmented-control--11-segments li:nth-child(8) {
  border-bottom-right-radius: 4px;
  border-bottom-right-radius: 0.25rem;
}

.segmented-control > li:first-child {
  border-top-left-radius: 4px;
  border-top-left-radius: 0.25rem;
}

.segmented-control--6-segments li:nth-child(4),
.form-50max .segmented-control.segmented-control--6-segments li:nth-child(4),
.segmented-control--7-segments li:last-child,
.form-50max .segmented-control.segmented-control--7-segments li:last-child,
.segmented-control--8-segments li:nth-child(5),
.form-50max .segmented-control.segmented-control--8-segments li:nth-child(5),
.segmented-control--9-segments li:nth-child(7),
.form-50max .segmented-control.segmented-control--9-segments li:nth-child(7),
.segmented-control--10-segments li:nth-child(6),
.form-50max .segmented-control.segmented-control--10-segments li:nth-child(6),
.segmented-control--11-segments li:nth-child(9),
.form-50max .segmented-control.segmented-control--11-segments li:nth-child(9),
.segmented-control--12-segments li:nth-child(9),
.form-50max .segmented-control.segmented-control--12-segments li:nth-child(9),
.segmented-control--13-segments li:nth-child(13),
.form-50max .segmented-control.segmented-control--13-segments li:nth-child(13),
.segmented-control--14-segments li:nth-child(13) {
  border-bottom-left-radius: 4px;
  border-bottom-left-radius: 0.25rem;
}

dd,
.radio-button-list > li {
  border-top: 1px solid #F2F2EB;
}

.transaction_links,
.radio-button-list,
.radio-button-list li:last-child {
  border-bottom: 1px solid #F2F2EB;
}

.full-width,
.section--nav > .section__content:after,
.col,
.subnav--tertiary .subnav__content,
.field,
[type='text'],
[type='email'],
[type='date'],
[type='number'],
[type='password'],
select,
body:after,
.header__image img {
  width: 100%;
}

p,
.text,
code,
dt,
dd,
td,
th {
  font-size: 16px;
  font-size: 1rem;
  line-height: 1.5;
}

p,
.text,
code,
td,
blockquote,
caption,
li,
ol,
dl,
ul {
  margin-bottom: 16px;
  margin-bottom: 1rem;
}

li {
  margin-top: 8px;
  margin-top: 0.5rem;
  margin-bottom: 0;
}

.statistics__figure {
  font-size: 64px;
  font-size: 4rem;
  line-height: 1.1666666667;
}

@media only screen and (max-width: 37.49em) {
  .statistics__figure {
    font-size: 48px;
    font-size: 3rem;
    line-height: 1.1666666667;
  }
}

h1 {
  font-size: 48px;
  font-size: 3rem;
  line-height: 1.1666666667;
}

@media only screen and (max-width: 37.49em) {
  h1 {
    font-size: 32px;
    font-size: 2rem;
    line-height: 1.25;
  }
}

h2,
.traffic-info__header h1 {
  font-size: 32px;
  font-size: 2rem;
  line-height: 1.25;
}

@media only screen and (max-width: 37.49em) {
  h2,
  .traffic-info__header h1 {
    font-size: 24px;
    font-size: 1.5rem;
    line-height: 1.5;
  }
}

h3,
.intro,
.news .news__intro,
.traffic-info__body h3,
.block-list .block__content ol,
.block-list .block__content ol > li:before,
.col--isotope .news--landing .title-highlight,
.col--isotope .news--landing .innovation-article .innovationarticle-grid .innovationarticle-overview h3,
.innovation-article .innovationarticle-grid .innovationarticle-overview .col--isotope .news--landing h3,
.col--isotope .news--landing .innovation-article .innovationarticle-grid .innovationarticle-content h3,
.innovation-article .innovationarticle-grid .innovationarticle-content .col--isotope .news--landing h3,
.col--isotope .news--landing .lesson-alert .lessonalert-grid .lessonalert-overview h1,
.lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .news--landing h1,
.col--isotope .news--landing .lesson-alert .lessonalert-grid .lessonalert-overview h2,
.lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .news--landing h2,
.col--isotope .news--landing .lesson-alert .lessonalert-grid .lessonalert-overview h3,
.lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .news--landing h3,
.col--isotope .news--landing .lesson-alert .lessonalert-grid .lessonalert-overview h4,
.lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .news--landing h4,
.col--isotope .news--landing .lesson-alert .lessonalert-grid .lessonalert-overview h5,
.lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .news--landing h5,
.col--isotope .news--landing .lesson-alert .lessonalert-grid .lessonalert-overview h6,
.lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .news--landing h6,
.col--isotope .news--landing .landing-overview h1,
.landing-overview .col--isotope .news--landing h1,
.col--isotope .news--landing .landing-overview h2,
.landing-overview .col--isotope .news--landing h2,
.col--isotope .news--landing .landing-overview h3,
.landing-overview .col--isotope .news--landing h3,
.col--isotope .news--landing .landing-overview h4,
.landing-overview .col--isotope .news--landing h4,
.col--isotope .news--landing .landing-overview h5,
.landing-overview .col--isotope .news--landing h5,
.col--isotope .news--landing .landing-overview h6,
.landing-overview .col--isotope .news--landing h6,
.col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-overview h1,
.highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .news--landing h1,
.col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-overview h2,
.highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .news--landing h2,
.col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-overview h3,
.highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .news--landing h3,
.col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-overview h4,
.highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .news--landing h4,
.col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-overview h5,
.highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .news--landing h5,
.col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-overview h6,
.highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .news--landing h6,
.col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-content h1,
.highwayreview .highwayreview-grid .highwayreview-content .col--isotope .news--landing h1,
.col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-content h2,
.highwayreview .highwayreview-grid .highwayreview-content .col--isotope .news--landing h2,
.col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-content h3,
.highwayreview .highwayreview-grid .highwayreview-content .col--isotope .news--landing h3,
.col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-content h4,
.highwayreview .highwayreview-grid .highwayreview-content .col--isotope .news--landing h4,
.col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-content h5,
.highwayreview .highwayreview-grid .highwayreview-content .col--isotope .news--landing h5,
.col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-content h6,
.highwayreview .highwayreview-grid .highwayreview-content .col--isotope .news--landing h6,
.col--isotope .statistics--landing .title-highlight,
.col--isotope .statistics--landing .innovation-article .innovationarticle-grid .innovationarticle-overview h3,
.innovation-article .innovationarticle-grid .innovationarticle-overview .col--isotope .statistics--landing h3,
.col--isotope .statistics--landing .innovation-article .innovationarticle-grid .innovationarticle-content h3,
.innovation-article .innovationarticle-grid .innovationarticle-content .col--isotope .statistics--landing h3,
.col--isotope .statistics--landing .lesson-alert .lessonalert-grid .lessonalert-overview h1,
.lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .statistics--landing h1,
.col--isotope .statistics--landing .lesson-alert .lessonalert-grid .lessonalert-overview h2,
.lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .statistics--landing h2,
.col--isotope .statistics--landing .lesson-alert .lessonalert-grid .lessonalert-overview h3,
.lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .statistics--landing h3,
.col--isotope .statistics--landing .lesson-alert .lessonalert-grid .lessonalert-overview h4,
.lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .statistics--landing h4,
.col--isotope .statistics--landing .lesson-alert .lessonalert-grid .lessonalert-overview h5,
.lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .statistics--landing h5,
.col--isotope .statistics--landing .lesson-alert .lessonalert-grid .lessonalert-overview h6,
.lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .statistics--landing h6,
.col--isotope .statistics--landing .landing-overview h1,
.landing-overview .col--isotope .statistics--landing h1,
.col--isotope .statistics--landing .landing-overview h2,
.landing-overview .col--isotope .statistics--landing h2,
.col--isotope .statistics--landing .landing-overview h3,
.landing-overview .col--isotope .statistics--landing h3,
.col--isotope .statistics--landing .landing-overview h4,
.landing-overview .col--isotope .statistics--landing h4,
.col--isotope .statistics--landing .landing-overview h5,
.landing-overview .col--isotope .statistics--landing h5,
.col--isotope .statistics--landing .landing-overview h6,
.landing-overview .col--isotope .statistics--landing h6,
.col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-overview h1,
.highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .statistics--landing h1,
.col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-overview h2,
.highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .statistics--landing h2,
.col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-overview h3,
.highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .statistics--landing h3,
.col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-overview h4,
.highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .statistics--landing h4,
.col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-overview h5,
.highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .statistics--landing h5,
.col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-overview h6,
.highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .statistics--landing h6,
.col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-content h1,
.highwayreview .highwayreview-grid .highwayreview-content .col--isotope .statistics--landing h1,
.col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-content h2,
.highwayreview .highwayreview-grid .highwayreview-content .col--isotope .statistics--landing h2,
.col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-content h3,
.highwayreview .highwayreview-grid .highwayreview-content .col--isotope .statistics--landing h3,
.col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-content h4,
.highwayreview .highwayreview-grid .highwayreview-content .col--isotope .statistics--landing h4,
.col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-content h5,
.highwayreview .highwayreview-grid .highwayreview-content .col--isotope .statistics--landing h5,
.col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-content h6,
.highwayreview .highwayreview-grid .highwayreview-content .col--isotope .statistics--landing h6 {
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 1.5;
}

@media only screen and (max-width: 37.49em) {
  h3,
  .intro,
  .news .news__intro,
  .traffic-info__body h3,
  .block-list .block__content ol,
  .block-list .block__content ol > li:before,
  .col--isotope .news--landing .title-highlight,
  .col--isotope .news--landing .innovation-article .innovationarticle-grid .innovationarticle-overview h3,
  .innovation-article .innovationarticle-grid .innovationarticle-overview .col--isotope .news--landing h3,
  .col--isotope .news--landing .innovation-article .innovationarticle-grid .innovationarticle-content h3,
  .innovation-article .innovationarticle-grid .innovationarticle-content .col--isotope .news--landing h3,
  .col--isotope .news--landing .lesson-alert .lessonalert-grid .lessonalert-overview h1,
  .lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .news--landing h1,
  .col--isotope .news--landing .lesson-alert .lessonalert-grid .lessonalert-overview h2,
  .lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .news--landing h2,
  .col--isotope .news--landing .lesson-alert .lessonalert-grid .lessonalert-overview h3,
  .lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .news--landing h3,
  .col--isotope .news--landing .lesson-alert .lessonalert-grid .lessonalert-overview h4,
  .lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .news--landing h4,
  .col--isotope .news--landing .lesson-alert .lessonalert-grid .lessonalert-overview h5,
  .lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .news--landing h5,
  .col--isotope .news--landing .lesson-alert .lessonalert-grid .lessonalert-overview h6,
  .lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .news--landing h6,
  .col--isotope .news--landing .landing-overview h1,
  .landing-overview .col--isotope .news--landing h1,
  .col--isotope .news--landing .landing-overview h2,
  .landing-overview .col--isotope .news--landing h2,
  .col--isotope .news--landing .landing-overview h3,
  .landing-overview .col--isotope .news--landing h3,
  .col--isotope .news--landing .landing-overview h4,
  .landing-overview .col--isotope .news--landing h4,
  .col--isotope .news--landing .landing-overview h5,
  .landing-overview .col--isotope .news--landing h5,
  .col--isotope .news--landing .landing-overview h6,
  .landing-overview .col--isotope .news--landing h6,
  .col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-overview h1,
  .highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .news--landing h1,
  .col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-overview h2,
  .highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .news--landing h2,
  .col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-overview h3,
  .highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .news--landing h3,
  .col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-overview h4,
  .highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .news--landing h4,
  .col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-overview h5,
  .highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .news--landing h5,
  .col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-overview h6,
  .highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .news--landing h6,
  .col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-content h1,
  .highwayreview .highwayreview-grid .highwayreview-content .col--isotope .news--landing h1,
  .col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-content h2,
  .highwayreview .highwayreview-grid .highwayreview-content .col--isotope .news--landing h2,
  .col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-content h3,
  .highwayreview .highwayreview-grid .highwayreview-content .col--isotope .news--landing h3,
  .col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-content h4,
  .highwayreview .highwayreview-grid .highwayreview-content .col--isotope .news--landing h4,
  .col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-content h5,
  .highwayreview .highwayreview-grid .highwayreview-content .col--isotope .news--landing h5,
  .col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-content h6,
  .highwayreview .highwayreview-grid .highwayreview-content .col--isotope .news--landing h6,
  .col--isotope .statistics--landing .title-highlight,
  .col--isotope .statistics--landing .innovation-article .innovationarticle-grid .innovationarticle-overview h3,
  .innovation-article .innovationarticle-grid .innovationarticle-overview .col--isotope .statistics--landing h3,
  .col--isotope .statistics--landing .innovation-article .innovationarticle-grid .innovationarticle-content h3,
  .innovation-article .innovationarticle-grid .innovationarticle-content .col--isotope .statistics--landing h3,
  .col--isotope .statistics--landing .lesson-alert .lessonalert-grid .lessonalert-overview h1,
  .lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .statistics--landing h1,
  .col--isotope .statistics--landing .lesson-alert .lessonalert-grid .lessonalert-overview h2,
  .lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .statistics--landing h2,
  .col--isotope .statistics--landing .lesson-alert .lessonalert-grid .lessonalert-overview h3,
  .lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .statistics--landing h3,
  .col--isotope .statistics--landing .lesson-alert .lessonalert-grid .lessonalert-overview h4,
  .lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .statistics--landing h4,
  .col--isotope .statistics--landing .lesson-alert .lessonalert-grid .lessonalert-overview h5,
  .lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .statistics--landing h5,
  .col--isotope .statistics--landing .lesson-alert .lessonalert-grid .lessonalert-overview h6,
  .lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .statistics--landing h6,
  .col--isotope .statistics--landing .landing-overview h1,
  .landing-overview .col--isotope .statistics--landing h1,
  .col--isotope .statistics--landing .landing-overview h2,
  .landing-overview .col--isotope .statistics--landing h2,
  .col--isotope .statistics--landing .landing-overview h3,
  .landing-overview .col--isotope .statistics--landing h3,
  .col--isotope .statistics--landing .landing-overview h4,
  .landing-overview .col--isotope .statistics--landing h4,
  .col--isotope .statistics--landing .landing-overview h5,
  .landing-overview .col--isotope .statistics--landing h5,
  .col--isotope .statistics--landing .landing-overview h6,
  .landing-overview .col--isotope .statistics--landing h6,
  .col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-overview h1,
  .highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .statistics--landing h1,
  .col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-overview h2,
  .highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .statistics--landing h2,
  .col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-overview h3,
  .highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .statistics--landing h3,
  .col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-overview h4,
  .highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .statistics--landing h4,
  .col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-overview h5,
  .highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .statistics--landing h5,
  .col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-overview h6,
  .highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .statistics--landing h6,
  .col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-content h1,
  .highwayreview .highwayreview-grid .highwayreview-content .col--isotope .statistics--landing h1,
  .col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-content h2,
  .highwayreview .highwayreview-grid .highwayreview-content .col--isotope .statistics--landing h2,
  .col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-content h3,
  .highwayreview .highwayreview-grid .highwayreview-content .col--isotope .statistics--landing h3,
  .col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-content h4,
  .highwayreview .highwayreview-grid .highwayreview-content .col--isotope .statistics--landing h4,
  .col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-content h5,
  .highwayreview .highwayreview-grid .highwayreview-content .col--isotope .statistics--landing h5,
  .col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-content h6,
  .highwayreview .highwayreview-grid .highwayreview-content .col--isotope .statistics--landing h6 {
    font-size: 18px;
    font-size: 1.125rem;
    line-height: 1.5555555556;
  }
}

h4,
.emphasis,
.subnav .subnav__intro,
.subnav--tertiary h2,
.traffic-info__header h2,
.traffic-info__body h4,
h1 > .highway,
h2 > .highway,
h3 > .highway {
  font-size: 18px;
  font-size: 1.125rem;
  line-height: 1.5555555556;
}

h5,
h6,
p,
.text,
code,
blockquote,
caption,
address,
.statistics__label,
.map-nav,
.map-nav--icon,
.homepage .content__left .action span,
.homepage .content__right .action span {
  font-size: 16px;
  font-size: 1rem;
  line-height: 1.5;
}

.small,
.news .news__meta,
.news .news__footer *,
.list--home,
.footer_pages a,
.nav-transaction ul > li a,
.action > span,
.pill,
.pill--roadworks,
.pill--orange,
.statistics__sub-label,
.subnav--tertiary .subnav__child__link,
.nav-pill,
.global-nav .search__input,
.share-nav > li,
.field__note,
.form-50max #Form_Form_50maxTextField4-error2,
.field--error .error.message,
.traffic-info__body h5,
.traffic-info__body p,
.map-nav__item > a > span,
.map-nav--tools .map-nav__item > label,
.map-nav--view-type,
.switch-nav,
.project-features .project-features--link {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.4285714286;
}

.tiny,
.segmented-control label span,
.form-50max .segmented-control label span {
  font-size: 12px;
  font-size: 0.75rem;
  line-height: 1.3333333333;
}

@media only screen and (max-width: 37.49em) {
  h2 {
    margin-bottom: 12px;
    margin-bottom: 0.75rem;
  }
}

@media only screen and (max-width: 37.49em) {
  h3 {
    margin-bottom: 12px;
    margin-bottom: 0.75rem;
  }
}

@media only screen and (max-width: 37.49em) {
  h4 {
    margin-bottom: 12px;
    margin-bottom: 0.75rem;
  }
}

@media only screen and (max-width: 37.49em) {
  h5 {
    margin-bottom: 12px;
    margin-bottom: 0.75rem;
  }
}

@media only screen and (max-width: 37.49em) {
  h6 {
    margin-bottom: 12px;
    margin-bottom: 0.75rem;
  }
}

@media only screen and (min-width: 37.5em) {
  .text-right--medium {
    text-align: right;
  }
}

h3,
h4,
h5,
.font-bold,
.comment__actions,
.highwayreview .highwayreview-list li > a,
strong,
b,
.btn--submit,
.btn--primary,
.email-wrapper input[type='submit'],
.search-wrapper .search-submit,
.btn--secondary,
.nav-transaction__title,
.action--bold span,
.pill strong,
.pill--roadworks strong,
.pill--orange strong,
.statistics__label,
.subnav__child__link,
.field__label,
.segmented-control label,
.form-50max .segmented-control label,
.map-nav--tools .map-nav__item,
.webcam__caption,
h1 > .highway,
h2 > .highway,
h3 > .highway,
table.nltp__report .nltp__report_row--header,
table.nltp__report .nltp__report_row.nltp__report_row--total td,
table.trams__report .trams__report_row--header,
table.trams__report .trams__report_row.trams__report_row--total td,
.landing__banner h1 {
  font-weight: 600;
}

h1,
h2,
h6,
p,
.text,
code,
blockquote,
caption,
address,
.intro,
.news .news__intro,
.statistics__sub-label,
.subnav .subnav__intro,
.field__label span,
.segmented-control label span,
.form-50max .segmented-control label span,
.webcam__last-update,
table.nltp__report .nltp__report_row--header span,
.content-navigation__top-link a,
table.trams__report .trams__report_row--header span,
.btn.btn--isotope-load,
.col--isotope .news--landing .title-highlight,
.col--isotope .news--landing .innovation-article .innovationarticle-grid .innovationarticle-overview h3,
.innovation-article .innovationarticle-grid .innovationarticle-overview .col--isotope .news--landing h3,
.col--isotope .news--landing .innovation-article .innovationarticle-grid .innovationarticle-content h3,
.innovation-article .innovationarticle-grid .innovationarticle-content .col--isotope .news--landing h3,
.col--isotope .news--landing .lesson-alert .lessonalert-grid .lessonalert-overview h1,
.lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .news--landing h1,
.col--isotope .news--landing .lesson-alert .lessonalert-grid .lessonalert-overview h2,
.lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .news--landing h2,
.col--isotope .news--landing .lesson-alert .lessonalert-grid .lessonalert-overview h3,
.lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .news--landing h3,
.col--isotope .news--landing .lesson-alert .lessonalert-grid .lessonalert-overview h4,
.lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .news--landing h4,
.col--isotope .news--landing .lesson-alert .lessonalert-grid .lessonalert-overview h5,
.lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .news--landing h5,
.col--isotope .news--landing .lesson-alert .lessonalert-grid .lessonalert-overview h6,
.lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .news--landing h6,
.col--isotope .news--landing .landing-overview h1,
.landing-overview .col--isotope .news--landing h1,
.col--isotope .news--landing .landing-overview h2,
.landing-overview .col--isotope .news--landing h2,
.col--isotope .news--landing .landing-overview h3,
.landing-overview .col--isotope .news--landing h3,
.col--isotope .news--landing .landing-overview h4,
.landing-overview .col--isotope .news--landing h4,
.col--isotope .news--landing .landing-overview h5,
.landing-overview .col--isotope .news--landing h5,
.col--isotope .news--landing .landing-overview h6,
.landing-overview .col--isotope .news--landing h6,
.col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-overview h1,
.highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .news--landing h1,
.col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-overview h2,
.highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .news--landing h2,
.col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-overview h3,
.highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .news--landing h3,
.col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-overview h4,
.highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .news--landing h4,
.col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-overview h5,
.highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .news--landing h5,
.col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-overview h6,
.highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .news--landing h6,
.col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-content h1,
.highwayreview .highwayreview-grid .highwayreview-content .col--isotope .news--landing h1,
.col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-content h2,
.highwayreview .highwayreview-grid .highwayreview-content .col--isotope .news--landing h2,
.col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-content h3,
.highwayreview .highwayreview-grid .highwayreview-content .col--isotope .news--landing h3,
.col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-content h4,
.highwayreview .highwayreview-grid .highwayreview-content .col--isotope .news--landing h4,
.col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-content h5,
.highwayreview .highwayreview-grid .highwayreview-content .col--isotope .news--landing h5,
.col--isotope .news--landing .highwayreview .highwayreview-grid .highwayreview-content h6,
.highwayreview .highwayreview-grid .highwayreview-content .col--isotope .news--landing h6,
.col--isotope .statistics--landing .title-highlight,
.col--isotope .statistics--landing .innovation-article .innovationarticle-grid .innovationarticle-overview h3,
.innovation-article .innovationarticle-grid .innovationarticle-overview .col--isotope .statistics--landing h3,
.col--isotope .statistics--landing .innovation-article .innovationarticle-grid .innovationarticle-content h3,
.innovation-article .innovationarticle-grid .innovationarticle-content .col--isotope .statistics--landing h3,
.col--isotope .statistics--landing .lesson-alert .lessonalert-grid .lessonalert-overview h1,
.lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .statistics--landing h1,
.col--isotope .statistics--landing .lesson-alert .lessonalert-grid .lessonalert-overview h2,
.lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .statistics--landing h2,
.col--isotope .statistics--landing .lesson-alert .lessonalert-grid .lessonalert-overview h3,
.lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .statistics--landing h3,
.col--isotope .statistics--landing .lesson-alert .lessonalert-grid .lessonalert-overview h4,
.lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .statistics--landing h4,
.col--isotope .statistics--landing .lesson-alert .lessonalert-grid .lessonalert-overview h5,
.lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .statistics--landing h5,
.col--isotope .statistics--landing .lesson-alert .lessonalert-grid .lessonalert-overview h6,
.lesson-alert .lessonalert-grid .lessonalert-overview .col--isotope .statistics--landing h6,
.col--isotope .statistics--landing .landing-overview h1,
.landing-overview .col--isotope .statistics--landing h1,
.col--isotope .statistics--landing .landing-overview h2,
.landing-overview .col--isotope .statistics--landing h2,
.col--isotope .statistics--landing .landing-overview h3,
.landing-overview .col--isotope .statistics--landing h3,
.col--isotope .statistics--landing .landing-overview h4,
.landing-overview .col--isotope .statistics--landing h4,
.col--isotope .statistics--landing .landing-overview h5,
.landing-overview .col--isotope .statistics--landing h5,
.col--isotope .statistics--landing .landing-overview h6,
.landing-overview .col--isotope .statistics--landing h6,
.col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-overview h1,
.highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .statistics--landing h1,
.col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-overview h2,
.highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .statistics--landing h2,
.col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-overview h3,
.highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .statistics--landing h3,
.col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-overview h4,
.highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .statistics--landing h4,
.col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-overview h5,
.highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .statistics--landing h5,
.col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-overview h6,
.highwayreview .highwayreview-grid .highwayreview-overview .col--isotope .statistics--landing h6,
.col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-content h1,
.highwayreview .highwayreview-grid .highwayreview-content .col--isotope .statistics--landing h1,
.col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-content h2,
.highwayreview .highwayreview-grid .highwayreview-content .col--isotope .statistics--landing h2,
.col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-content h3,
.highwayreview .highwayreview-grid .highwayreview-content .col--isotope .statistics--landing h3,
.col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-content h4,
.highwayreview .highwayreview-grid .highwayreview-content .col--isotope .statistics--landing h4,
.col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-content h5,
.highwayreview .highwayreview-grid .highwayreview-content .col--isotope .statistics--landing h5,
.col--isotope .statistics--landing .highwayreview .highwayreview-grid .highwayreview-content h6,
.highwayreview .highwayreview-grid .highwayreview-content .col--isotope .statistics--landing h6,
.landing__banner .btn--secondary-transparent {
  font-weight: 400;
}

.font-light,
.statistics__figure,
.project-contacts .project-contacts__content {
  font-weight: 300;
}

.font-italic,
.font-bold-italic,
.font-light-italic,
em,
i,
cite,
.circle-text .circle-text__content.text--italic,
.landing__banner h1 {
  font-style: italic;
}

.subnav__child__link:hover {
  text-decoration: underline;
}

a {
  outline: 0;
  text-decoration: none;
  color: #236FA6;
}

a:hover {
  color: #1a537c;
}

.body-copy a,
.textlink {
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(50%, transparent), color-stop(50%, #236FA6));
  background-image: -webkit-linear-gradient(top, transparent 50%, #236FA6 50%);
  background-image: -moz- oldlinear-gradient(top, transparent 50%, #236FA6 50%);
  background-image: linear-gradient(to bottom, transparent 50%, #236FA6 50%);
}

.body-copy a:hover,
.textlink:hover {
  background-image: none;
}

.subnav__child__link {
  text-decoration: underline;
}

.action:hover,
.subnav__child__link:hover,
.level-1 .location-list > .list__item > a:hover {
  color: #1a537c;
}

.action:hover.link--action > div,
.subnav__child__link:hover.link--action > div,
.level-1 .location-list > .list__item > a:hover.link--action > div {
  background-color: #1f6191;
}

.action:hover .nav-main__icon > i,
.subnav__child__link:hover .nav-main__icon > i,
.level-1 .location-list > .list__item > a:hover .nav-main__icon > i {
  background-color: #003a5d;
}

.link-more {
  font-style: italic;
}

.link-more:after {
  content: "...";
}

.linedText {
  border-bottom: 1px dashed;
  text-decoration: none;
  background-color: #ffffff;
  background: -webkit-gradient(linear, left top, left bottom, from(#000000), color-stop(1%, #ffffff)) 0 -1px;
  background: -webkit-linear-gradient(top, #000000 0%, #ffffff 1%) 0 -1px;
  background: -moz- oldlinear-gradient(top, #000000 0%, #ffffff 1%) 0 -1px;
  background: linear-gradient(to bottom, #000000 0%, #ffffff 1%) 0 -1px;
  -webkit-background-size: 100% 24px;
  -ms-background-size: 100% 24px;
  background-size: 100% 24px;
}

dl dt {
  font-weight: bold;
  padding-top: 12px;
  padding-top: 0.75rem;
  padding-right: 12px;
  padding-right: 0.75rem;
  padding-bottom: 12px;
  padding-bottom: 0.75rem;
}

dd {
  padding-top: 12px;
  padding-top: 0.75rem;
  padding-bottom: 12px;
  padding-bottom: 0.75rem;
  text-align: right;
}

@media only screen and (max-width: 37.49em) {
  dt {
    border-top: 1px solid #F2F2EB;
    float: none !important;
  }

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

hr {
  height: 1px;
  border: none;
  background-color: #ddd;
}

hr.hr--bleed {
  margin-left: -10%;
  margin-right: -10%;
  padding-left: 10%;
  padding-right: 10%;
}

@media only screen and (max-width: 60em) {
  hr.hr--bleed {
    margin-left: -4%;
    margin-right: -4%;
    padding-left: 4%;
    padding-right: 4%;
  }
}

blockquote {
  margin: 0;
  padding: 0;
  padding-left: 28px;
  padding-left: 1.75rem;
  border-left: 0 solid #F2F4F7;
  border-width: 8px;
  border-width: 0.5rem;
}

/*------------------------------------*\
    #PAGE LAYOUT
\*------------------------------------*/

.wrapper {
  max-width: 1152px;
  max-width: 72rem;
  margin-left: auto;
  margin-right: auto;
}

.wrapper--huge {
  max-width: none;
  margin-left: 0;
  margin-right: 0;
  padding-left: 0;
  padding-right: 0;
}

.section-s {
  padding-top: 20px;
  padding-top: 1.25rem;
  padding-bottom: 20px;
  padding-bottom: 1.25rem;
}

.section-m,
.share-nav,
.traffic-metrics {
  padding-top: 32px;
  padding-top: 2rem;
  padding-bottom: 32px;
  padding-bottom: 2rem;
}

.section {
  padding-top: 48px;
  padding-top: 3rem;
  padding-bottom: 48px;
  padding-bottom: 3rem;
}

@media only screen and (max-width: 37.49em) {
  .section {
    padding-top: 32px;
    padding-top: 2rem;
    padding-bottom: 32px;
    padding-bottom: 2rem;
  }
}

.traffic-messages {
  padding-top: 12px;
  padding-top: 0.75rem;
}

.pagination,
.traffic-info__header,
.search__results,
.search__results-count {
  padding-top: 20px;
  padding-top: 1.25rem;
}

.section--stacked {
  padding-top: 48px;
  padding-top: 3rem;
}

@media only screen and (max-width: 37.49em) {
  .section--stacked {
    padding-top: 20px;
    padding-top: 1.25rem;
  }
}

.route__item > * {
  padding-bottom: 12px;
  padding-bottom: 0.75rem;
}

.content-block .control-group {
  padding-bottom: 20px;
  padding-bottom: 1.25rem;
}

.traffic-info__header,
.traffic-messages,
.horizontal-scroll,
.subscription-interests {
  padding-bottom: 32px;
  padding-bottom: 2rem;
}

.landing-overview {
  margin-bottom: 48px;
  margin-bottom: 3rem;
}

@media only screen and (max-width: 37.49em) {
  .landing-overview {
    margin-bottom: 20px;
    margin-bottom: 1.25rem;
  }
}

.section.fullwidth {
  max-width: 74rem;
  padding-left: 1rem;
  padding-right: 1rem;
}

.layout,
.layout--left,
.homepage .content__left {
  padding-left: 1rem;
}

@media only screen and (min-width: 37.5em) {
  .layout,
  .layout--left,
  .homepage .content__left {
    padding-left: 4%;
  }
}

@media only screen and (min-width: 60em), only print {
  .layout,
  .layout--left,
  .homepage .content__left {
    padding-left: 8.3333333%;
  }
}

.layout,
.layout--right,
.homepage .content__right {
  padding-right: 1rem;
}

@media only screen and (min-width: 37.5em) {
  .layout,
  .layout--right,
  .homepage .content__right {
    padding-right: 4%;
  }
}

@media only screen and (min-width: 60em), only print {
  .layout,
  .layout--right,
  .homepage .content__right {
    padding-right: 8.3333333%;
  }
}

@media only screen and (min-width: 60em), only print {
  .layout--nudge {
    margin-top: -2em;
  }
}

.layout--nudge + .layout--nudge {
  margin-top: 0;
}

@media only screen and (min-width: 60em), only print {
  .layout--half {
    padding-left: 25%;
    padding-right: 25%;
  }
}

.homepage .ratio-square,
.homepage .ratio-filmic {
  position: relative;
  height: 0;
}

.homepage .ratio-square > *,
.homepage .ratio-filmic > * {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}

.ratio-square {
  padding-bottom: 100%;
}

.crop {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: hidden;
}

.crop--bottom > img {
  width: 100%;
  position: absolute;
  bottom: 0;
}

@media only screen and (min-width: 37.5em) {
  .divider-medium {
    border-left: solid 1px rgba(0, 0, 0, 0.1);
  }
}

/*------------------------------------*\
	#ICONS
\*------------------------------------*/

.i,
.i-circle-arrow,
.i-arrow-r,
.subnav h2 > .i-arrow-r,
.subnav h3 > .i-arrow-r {
  width: 1em;
  height: 1em;
  -webkit-background-size: cover;
  background-size: cover;
  display: inline-block;
  vertical-align: middle;
}

.icon-text .i,
.btn--icon .i {
  margin-right: 0.375em;
}

.icon-text--rev .i,
.btn--icon-rev .i {
  margin-left: 0.375em;
}

.i--small {
  width: .8em;
  height: .8em;
  vertical-align: baseline;
}

.i--large {
  width: 1.5em;
  height: 1.5em;
}

.i--xlarge {
  width: 2em;
  height: 2em;
}

.i-circle-arrow {
  width: 1.2em;
  height: 1.2em;
}

.i-arrow-r {
  width: 1em;
  height: 1em;
}

.i-section,
.action__icon {
  border-radius: 50em;
}

.i-section {
  width: 40px;
  width: 2.5rem;
  height: 40px;
  height: 2.5rem;
  -webkit-background-size: cover;
  background-size: cover;
  display: inline-block;
  vertical-align: middle;
  background-position: 0 33.333%;
  background-color: #fff;
}

.section--nav .i-section,
.i-section.-blue {
  background-position: 0 11.111%;
  background-color: #004771;
}

.nav-about .i-section {
  background-color: #236FA6;
}

.i-search {
  width: 1.25em;
  height: 1.25em;
}

.i-menu,
.i-search {
  background-position: 0 11.111%;
}

.global-nav .i-menu,
.global-nav .i-search {
  opacity: .5;
}

.global-nav .i-menu:hover,
.global-nav .i-search:hover {
  opacity: .75;
}

.i-nzta-logo,
.i-nzta-logo-coloured,
.i-branding-logo {
  height: 33px;
  height: 2.0625rem;
  width: 145px;
  width: 9.0625rem;
  width: 9.4rem;
}

.i-branding-logo {
  margin-left: 1.2em;
  position: absolute;
}

@media only screen and (max-width: 50em) {
  .i-branding-logo {
    position: relative;
    margin-left: 0;
    margin-top: 1em;
  }
}

.i-newzealand-government {
  width: 12em;
  height: 1.25em;
}

.i-nzgovt,
.i-nzgovtlogo {
  width: 13.75em;
  height: 3.1em;
}

.i-nav-section {
  background-color: transparent;
  border: solid 2px #fff;
}

.i-nav-caret {
  margin-left: .5em;
  width: 1.25em;
  height: 1.25em;
}

.i-facebook-grey {
  width: 1.25em;
  height: 1.25em;
}

.i-youtube-grey {
  width: 1.5em;
  height: 1.125em;
}

.i-twitter-grey {
  width: 1.375em;
  height: 1.125em;
}

.i-linkedin-grey {
  width: 1.25em;
  height: 1.25em;
}

.i-pinterest-grey {
  width: 1.25em;
  height: 1.375em;
}

.i-about-grey {
  width: 1.5em;
  height: 1em;
}

.i-contact-grey {
  width: 1.4375em;
  height: 1.125em;
}

.i-search-grey {
  width: 1.125em;
  height: 1.125em;
}

.i-resources-grey {
  width: 1.125em;
  height: 1.125em;
}

.i-pdf {
  width: 1em;
  height: 1em;
}

.i-powerpoint,
.i-ppt {
  width: 1em;
  height: 1em;
}

.i-excel,
.i-xls,
.i-xlsx {
  width: 1em;
  height: 1em;
}

.i-word,
.i-doc,
.i-docx {
  width: 1em;
  height: 1em;
}

.i-hyperlink {
  width: 1em;
  height: 1em;
}

.i-download {
  width: 1em;
  height: 1em;
}

.i-generic-doc,
.i-document {
  width: 1em;
  height: 1em;
}

.i-bin-white,
.i-bin-black {
  width: 1em;
  height: 1em;
}

.i-map-marker-white {
  width: 19.2px;
  width: 1.2rem;
  height: 24.8px;
  height: 1.55rem;
  margin-top: 0.1em;
}

.i-pencil-white,
.i-pencil-black {
  width: 1em;
  height: 1em;
}

.i-zeroharm-footer {
  height: 2.5em;
  width: 22.5em;
}

.i-coins.i--xlarge {
  width: 26px;
  width: 1.625rem;
}

.i-lightbulb.i--xlarge {
  width: 27px;
  width: 1.6875rem;
}

.i-envelope {
  width: 26px;
}

/* colourised icons */

.subnav h2 > .i-arrow-r,
.subnav h3 > .i-arrow-r,
.route__item h4 .i-arrow-r,
.route__item > a > * .i-arrow-r,
.i--blue,
.footer_social-links a:hover .i,
.toll-road-info .i--large {
  background-position: 0 22.222%;
}

.i--dark-blue,
a.lightbox-popup:hover i.i-help,
.nav-transaction ul > li .nav-main__icon i,
.glossary-index-link i,
.gallery--top-link .i {
  background-position: 0 33.333%;
}

.i--grey {
  background-position: 0 44.444%;
}

.i--dark-grey,
.route__item > * p > i,
.nltp__form_summary a .i,
.trams__form_summary a .i,
.gallery--top-link:hover .i {
  background-position: 0 55.555%;
}

.i--light-grey,
.footer_social-links .i,
a.lightbox-popup i.i-help,
.comment--unflagged {
  background-position: 0 66.666%;
}

.i--green {
  background-position: 0 77.777%;
}

.i--red,
.comment--flagged {
  background-position: 0 100%;
}

.i--orange {
  background-position: 0 88.888%;
}

.i--white,
.project-section.theme--dark .arrow-toggle .i,
.project-section.theme--mono .arrow-toggle .i,
.project-section.theme--strong .arrow-toggle .i,
.project-section.comment_admin .arrow-toggle .i,
.project-section.theme--slate .arrow-toggle .i,
.project-section.theme--error .arrow-toggle .i,
.project-section.theme--confirmation .arrow-toggle .i,
.project-contacts.theme--dark .arrow-toggle .i,
.project-contacts.theme--mono .arrow-toggle .i,
.project-contacts.theme--strong .arrow-toggle .i,
.project-contacts.comment_admin .arrow-toggle .i,
.project-contacts.theme--slate .arrow-toggle .i,
.project-contacts.theme--error .arrow-toggle .i,
.project-contacts.theme--confirmation .arrow-toggle .i {
  background-position: 0 11.111%;
}

/*------------------------------------*\
    #THEMES
\*------------------------------------*/

.theme--dark,
.traffic-info__header,
.map-nav,
.map-nav--icon,
.webcam-list {
  background-color: #004771;
  color: #fff;
}

.theme--dark a,
.traffic-info__header a,
.map-nav a,
.map-nav--icon a,
.webcam-list a {
  color: inherit;
}

.theme--dark a:hover,
.traffic-info__header a:hover,
.map-nav a:hover,
.map-nav--icon a:hover,
.webcam-list a:hover {
  opacity: .8;
  color: inherit;
}

.theme--mono {
  background-color: #333;
  color: #fff;
}

.theme--mono a {
  color: #fff;
}

.theme--mono a:hover {
  opacity: .8;
  color: inherit;
}

.theme--strong,
.comment_admin {
  background-color: #005485;
  color: #fff;
}

.theme--strong a,
.comment_admin a {
  color: inherit;
}

.theme--strong a:hover,
.comment_admin a:hover {
  opacity: .8;
  color: inherit;
}

.theme--error,
.typography .shortcode-parser-error {
  background-color: #c44;
  color: #fff;
}

.theme--error a,
.typography .shortcode-parser-error a {
  color: #fff;
}

.theme--error a:hover,
.typography .shortcode-parser-error a:hover {
  opacity: .8;
  color: inherit;
}

.theme--confirmation {
  background-color: #59B359;
  color: #fff;
}

.theme--confirmation a {
  color: #fff;
}

.theme--confirmation a:hover {
  opacity: .8;
  color: inherit;
}

.theme--white,
.theme--paper {
  background-color: #fff;
}

.theme--neutral {
  background-color: #F2F4F7;
}

.theme--light {
  background-color: #DFE4E9;
}

.theme--mid {
  background-color: #f8f7f0;
}

.theme--paper,
.theme--error,
.theme--confirmation {
  -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
}

.theme--slate {
  background-color: #41535E;
  color: #fff;
}

.theme--slate a {
  color: #fff;
}

.theme--info {
  background: #F7F9E9;
  color: #236FA6;
}

.theme--info .i-section {
  background-color: #afc83d;
}

.theme--info-icon {
  background-color: #afc83d;
}

.theme--details > :last-child {
  margin-bottom: 0 !important;
}

.theme--error a,
.theme--confirmation a {
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(50%, transparent), color-stop(50%, #fff));
  background-image: -webkit-linear-gradient(top, transparent 50%, #fff 50%);
  background-image: -moz- oldlinear-gradient(top, transparent 50%, #fff 50%);
  background-image: linear-gradient(to bottom, transparent 50%, #fff 50%);
}

.theme--error a:hover,
.theme--confirmation a:hover {
  background-image: none;
}

/*------------------------------------*\
    #THEMING
\*------------------------------------*/

.block-theme--grey {
  color: #D8D8D8;
  border-width: 0 !important;
}

.block-theme--grey .i {
  background-position: 0 33.333%;
}

.block-theme--grey .theme__background {
  background-color: #F2F4F7;
  color: #095685;
}

.block-theme--grey .theme__background .i {
  background-position: 0 33.333%;
}

.noTouchEvents .block-theme--grey a.theme__background:hover {
  background-color: #d9dfe7;
}

.inline-theme--grey {
  color: #095685;
  background-color: #F2F4F7;
  color: #095685;
}

.-hover.inline-theme--grey:hover,
.inline-theme--grey .-hover:hover {
  background-color: #d9dfe7;
}

.inline-theme--grey i {
  background-position: 0 33.333% !important;
}

.link-theme--grey {
  color: #095685;
  background-color: #F2F4F7;
}

.link-theme--grey:hover {
  background-color: #d9dfe7;
}

.block-theme--dark-grey {
  color: #555555;
  border-width: 0 !important;
}

.block-theme--dark-grey .i {
  background-position: 0 11.111%;
}

.block-theme--dark-grey .theme__background {
  background-color: #555555;
  color: #ffffff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.block-theme--dark-grey .theme__background .i {
  background-position: 0 11.111%;
}

.noTouchEvents .block-theme--dark-grey a.theme__background:hover {
  background-color: #414141;
}

.inline-theme--dark-grey {
  color: #ffffff;
  background-color: #555555;
  color: #ffffff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.-hover.inline-theme--dark-grey:hover,
.inline-theme--dark-grey .-hover:hover {
  background-color: #414141;
}

.inline-theme--dark-grey i {
  background-position: 0 11.111% !important;
}

.link-theme--dark-grey {
  color: #ffffff;
  background-color: #555555;
}

.link-theme--dark-grey:hover {
  background-color: #414141;
}

.block-theme--dark-blue {
  color: #004771;
  border-width: 0 !important;
}

.block-theme--dark-blue .i {
  background-position: 0 11.111%;
}

.block-theme--dark-blue .theme__background {
  background-color: #004771;
  color: #ffffff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.block-theme--dark-blue .theme__background .i {
  background-position: 0 11.111%;
}

.noTouchEvents .block-theme--dark-blue a.theme__background:hover {
  background-color: #002d48;
}

.inline-theme--dark-blue,
.pill {
  color: #ffffff;
  background-color: #004771;
  color: #ffffff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.-hover.inline-theme--dark-blue:hover,
.-hover.pill:hover,
.inline-theme--dark-blue .-hover:hover,
.pill .-hover:hover {
  background-color: #002d48;
}

.inline-theme--dark-blue i,
.pill i {
  background-position: 0 11.111% !important;
}

.link-theme--dark-blue,
.pill {
  color: #ffffff;
  background-color: #004771;
}

.link-theme--dark-blue:hover,
.pill:hover {
  background-color: #002d48;
}

.block-theme--confirm {
  color: #59B359;
  border-width: 0 !important;
}

.block-theme--confirm .i {
  background-position: 0 11.111%;
}

.block-theme--confirm .theme__background {
  background-color: #59B359;
  color: #ffffff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.block-theme--confirm .theme__background .i {
  background-position: 0 11.111%;
}

.noTouchEvents .block-theme--confirm a.theme__background:hover {
  background-color: #479c47;
}

.inline-theme--confirm,
.pill.pill--confirm {
  color: #ffffff;
  background-color: #59B359;
  color: #ffffff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.-hover.inline-theme--confirm:hover,
.-hover.pill.pill--confirm:hover,
.inline-theme--confirm .-hover:hover,
.pill.pill--confirm .-hover:hover {
  background-color: #479c47;
}

.inline-theme--confirm i,
.pill.pill--confirm i {
  background-position: 0 11.111% !important;
}

.link-theme--confirm,
.pill.pill--confirm {
  color: #ffffff;
  background-color: #59B359;
}

.link-theme--confirm:hover,
.pill.pill--confirm:hover {
  background-color: #479c47;
}

.block-theme--orange {
  color: #452606;
  border-width: 0 !important;
}

.block-theme--orange .i {
  background-position: 0 55.555%;
}

.block-theme--orange .theme__background {
  background-color: #FF8C19;
  color: #452606;
}

.block-theme--orange .theme__background .i {
  background-position: 0 55.555%;
}

.noTouchEvents .block-theme--orange a.theme__background:hover {
  background-color: #ef7800;
}

.inline-theme--orange,
.pill--roadworks,
.pill--orange {
  color: #452606;
  background-color: #FF8C19;
  color: #452606;
}

.-hover.inline-theme--orange:hover,
.-hover.pill--roadworks:hover,
.-hover.pill--orange:hover,
.inline-theme--orange .-hover:hover,
.pill--roadworks .-hover:hover,
.pill--orange .-hover:hover {
  background-color: #ef7800;
}

.inline-theme--orange i,
.pill--roadworks i,
.pill--orange i {
  background-position: 0 55.555% !important;
}

.link-theme--orange,
.pill--roadworks,
.pill--orange {
  color: #452606;
  background-color: #FF8C19;
}

.link-theme--orange:hover,
.pill--roadworks:hover,
.pill--orange:hover {
  background-color: #ef7800;
}

.block-theme--yellow {
  color: #FFD633;
  border-width: 0 !important;
}

.block-theme--yellow .i {
  background-position: 0 55.555%;
}

.block-theme--yellow .theme__background {
  background-color: #FFD633;
  color: #452606;
}

.block-theme--yellow .theme__background .i {
  background-position: 0 55.555%;
}

.noTouchEvents .block-theme--yellow a.theme__background:hover {
  background-color: #ffce0a;
}

.inline-theme--yellow {
  color: #452606;
  background-color: #FFD633;
  color: #452606;
}

.-hover.inline-theme--yellow:hover,
.inline-theme--yellow .-hover:hover {
  background-color: #ffce0a;
}

.inline-theme--yellow i {
  background-position: 0 55.555% !important;
}

.link-theme--yellow {
  color: #452606;
  background-color: #FFD633;
}

.link-theme--yellow:hover {
  background-color: #ffce0a;
}

.block-theme--warning,
.block-theme--google {
  color: #CA4142;
  border-width: 0 !important;
}

.block-theme--warning .i,
.block-theme--google .i {
  background-position: 0 11.111%;
}

.block-theme--warning .theme__background,
.block-theme--google .theme__background {
  background-color: #CA4142;
  color: #fff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.block-theme--warning .theme__background .i,
.block-theme--google .theme__background .i {
  background-position: 0 11.111%;
}

.noTouchEvents .block-theme--warning a.theme__background:hover,
.noTouchEvents .block-theme--google a.theme__background:hover {
  background-color: #b13132;
}

.inline-theme--warning,
.inline-theme--google,
.pill.pill--warning {
  color: #fff;
  background-color: #CA4142;
  color: #fff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.-hover.inline-theme--warning:hover,
.-hover.inline-theme--google:hover,
.-hover.pill.pill--warning:hover,
.inline-theme--warning .-hover:hover,
.inline-theme--google .-hover:hover,
.pill.pill--warning .-hover:hover {
  background-color: #b13132;
}

.inline-theme--warning i,
.inline-theme--google i,
.pill.pill--warning i {
  background-position: 0 11.111% !important;
}

.link-theme--warning,
.link-theme--google,
.pill.pill--warning {
  color: #fff;
  background-color: #CA4142;
}

.link-theme--warning:hover,
.link-theme--google:hover,
.pill.pill--warning:hover {
  background-color: #b13132;
}

.block-theme--closures {
  color: #fff;
  border-width: 0 !important;
}

.block-theme--closures .i {
  background-position: 0 11.111%;
}

.block-theme--closures .theme__background {
  background-color: #000000;
  color: #fff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.block-theme--closures .theme__background .i {
  background-position: 0 11.111%;
}

.noTouchEvents .block-theme--closures a.theme__background:hover {
  background-color: black;
}

.inline-theme--closures,
.pill.pill--closures {
  color: #fff;
  background-color: #000000;
  color: #fff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.-hover.inline-theme--closures:hover,
.-hover.pill.pill--closures:hover,
.inline-theme--closures .-hover:hover,
.pill.pill--closures .-hover:hover {
  background-color: black;
}

.inline-theme--closures i,
.pill.pill--closures i {
  background-position: 0 11.111% !important;
}

.link-theme--closures,
.pill.pill--closures {
  color: #fff;
  background-color: #000000;
}

.link-theme--closures:hover,
.pill.pill--closures:hover {
  background-color: black;
}

.block-theme--twitter {
  color: #55ACEE;
  border-width: 0 !important;
}

.block-theme--twitter .i {
  background-position: 0 11.111%;
}

.block-theme--twitter .theme__background {
  background-color: #55ACEE;
  color: #fff;
}

.block-theme--twitter .theme__background .i {
  background-position: 0 11.111%;
}

.noTouchEvents .block-theme--twitter a.theme__background:hover {
  background-color: #309aea;
}

.inline-theme--twitter {
  color: #fff;
  background-color: #55ACEE;
  color: #fff;
}

.-hover.inline-theme--twitter:hover,
.inline-theme--twitter .-hover:hover {
  background-color: #309aea;
}

.inline-theme--twitter i {
  background-position: 0 11.111% !important;
}

.link-theme--twitter {
  color: #fff;
  background-color: #55ACEE;
}

.link-theme--twitter:hover {
  background-color: #309aea;
}

.block-theme--facebook {
  color: #3B5998;
  border-width: 0 !important;
}

.block-theme--facebook .i {
  background-position: 0 11.111%;
}

.block-theme--facebook .theme__background {
  background-color: #3B5998;
  color: #fff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.block-theme--facebook .theme__background .i {
  background-position: 0 11.111%;
}

.noTouchEvents .block-theme--facebook a.theme__background:hover {
  background-color: #30487b;
}

.inline-theme--facebook {
  color: #fff;
  background-color: #3B5998;
  color: #fff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.-hover.inline-theme--facebook:hover,
.inline-theme--facebook .-hover:hover {
  background-color: #30487b;
}

.inline-theme--facebook i {
  background-position: 0 11.111% !important;
}

.link-theme--facebook {
  color: #fff;
  background-color: #3B5998;
}

.link-theme--facebook:hover {
  background-color: #30487b;
}

.block-theme--area-warning {
  color: #000000;
  border-width: 0 !important;
}

.block-theme--area-warning .i {
  background-position: 0 11.111%;
}

.block-theme--area-warning .theme__background {
  background-color: #f1561c;
  color: #fff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.block-theme--area-warning .theme__background .i {
  background-position: 0 11.111%;
}

.noTouchEvents .block-theme--area-warning a.theme__background:hover {
  background-color: #d7440d;
}

.inline-theme--area-warning,
.pill.pill--area-warning {
  color: #fff;
  background-color: #f1561c;
  color: #fff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.-hover.inline-theme--area-warning:hover,
.-hover.pill.pill--area-warning:hover,
.inline-theme--area-warning .-hover:hover,
.pill.pill--area-warning .-hover:hover {
  background-color: #d7440d;
}

.inline-theme--area-warning i,
.pill.pill--area-warning i {
  background-position: 0 11.111% !important;
}

.link-theme--area-warning,
.pill.pill--area-warning {
  color: #fff;
  background-color: #f1561c;
}

.link-theme--area-warning:hover,
.pill.pill--area-warning:hover {
  background-color: #d7440d;
}

/*------------------------------------*\
    #PLAYPEN
    The place where we solve design
    problems without dirtying up the
    sass structure
\*------------------------------------*/

.document--overlay:after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #000;
  opacity: .6;
}

@media only screen and (min-width: 37.5em) {
  .document--overlay--bps:after {
    display: none;
  }
}

.hatched-line {
  position: relative;
}

.hatched-line:before {
  position: absolute;
  content: "";
  top: 0;
  width: 92%;
  height: 1em;
  background-repeat: repeat-x !important;
  opacity: 1;
}

@media only screen and (min-width: 37.5em) {
  .hatched-line:before {
    left: 4%;
  }
}

@media only screen and (min-width: 60em), only print {
  .hatched-line:before {
    left: 8.3333333%;
    width: 83.3333333%;
  }
}

@media only screen and (max-width: 37.49em) {
  .hatched-line:before {
    content: none;
  }
}

.img--responsive {
  max-width: 100%;
}

.styleguide__example .header__image {
  margin-top: 0;
}

.styleguide__example .access {
  width: 100%;
  height: auto;
  position: relative;
}

.fixed--bottom {
  position: fixed;
  bottom: 0;
}

.back-to-top-anchor {
  background-color: #004771;
  padding: 0 1rem;
  right: 2em;
  margin-bottom: 0;
}

.list--home li:last-child {
  margin-bottom: 0;
}

@media only screen and (max-width: 37.49em) {
  .list--home {
    padding-left: 68px;
    padding-left: 4.25rem;
    padding-bottom: 20px;
    padding-bottom: 1.25rem;
  }
}

@media only screen and (max-width: 37.49em) {
  .small-block-list {
    list-style: none;
    padding-left: 0;
  }

  .small-block-list > li {
    list-style: none;
    margin: 0;
    display: block;
  }
}

@media only screen and (max-width: 59.99em) {
  .footer_social-links {
    float: left;
  }

  .footer_social-links a {
    margin-left: 0;
    margin-right: 1.75em;
  }
}

@media only screen and (max-width: 37.49em) {
  .footer_pages .icon-wrapper {
    width: 4em;
    text-align: center;
  }
}

.icon-wrapper {
  display: inline-block;
}

.grid.large-grid--table,
.grid.medium-grid--table {
  margin-left: 0;
  margin-right: 0;
}

/**
## Components
*/

/*------------------------------------*\
    #GRID STYLES
\*------------------------------------*/

.grid {
  font-size: 0;
  margin-left: -.5rem;
  margin-right: -.5rem;
}

@media only screen and (min-width: 37.5em) {
  .grid {
    margin-left: -1rem;
    margin-right: -1rem;
  }

  .grid .no-margin {
    margin-left: 0;
    margin-right: 0;
  }
}

.grid > * {
  font-size: medium;
}

.grid > .grid {
  font-size: 0;
}

.grid--justify {
  text-align: justify;
  font-size: 0;
}

.grid--justify > * {
  float: none;
  font-size: medium;
}

.grid--justify:after {
  width: 100%;
  content: '';
}

.subnav--tertiary {
  font-size: medium;
  text-justify: auto;
  /* [3] */
}

.section--nav > .section__content:after {
  content: '';
}

@media only screen and (max-width: 37.49em) {
  .grid--flip-small {
    direction: rtl;
  }

  .grid--flip-small > * {
    direction: ltr;
  }
}

.grid--table {
  display: table;
  table-layout: fixed;
  width: 100%;
}

.col .grid--table {
  width: auto;
}

.grid--table > * {
  display: table-cell;
}

@media only screen and (min-width: 37.5em) {
  .medium-grid--table {
    display: table;
    table-layout: fixed;
    width: 100%;
  }

  .medium-grid--table > * {
    display: table-cell;
  }
}

@media only screen and (min-width: 60em), only print {
  .large-grid--table {
    display: table;
    table-layout: fixed;
    width: 100%;
  }

  .large-grid--table > * {
    display: table-cell;
  }
}

.half {
  width: 50%;
}

.third {
  width: 33.3333333%;
}

.two-thirds {
  width: 66.666666%;
}

.quarter {
  width: 25%;
}

.three-quarters {
  width: 75%;
}

.fifth {
  width: 20%;
}

.sixth {
  width: 16.6666667%;
}

@media only screen and (min-width: 30em) {
  .small-full-width {
    width: 100%;
  }

  .small-half {
    width: 50%;
  }

  .small-third {
    width: 33.3333333%;
  }

  .small-two-thirds {
    width: 66.666666%;
  }

  .small-quarter {
    width: 25%;
  }

  .small-three-quarters {
    width: 75%;
  }
}

@media only screen and (min-width: 37.5em) {
  .medium-full-width {
    width: 100%;
  }

  .medium-half {
    width: 50%;
  }

  .medium-third {
    width: 33.3333333%;
  }

  .medium-two-thirds {
    width: 66.666666%;
  }

  .medium-quarter {
    width: 25%;
  }

  .medium-three-quarters {
    width: 75%;
  }

  .medium-fifth {
    width: 20%;
  }
}

@media only screen and (min-width: 60em), only print {
  .large-full-width {
    width: 100%;
  }

  .large-half {
    width: 50%;
  }

  .large-third {
    width: 33.3333333%;
  }

  .large-two-thirds {
    width: 66.666666%;
  }

  .large-quarter {
    width: 25%;
  }

  .large-three-quarters {
    width: 75%;
  }

  .large-fifth {
    width: 20%;
  }

  .large-sixth {
    width: 16.6666667%;
  }
}

.small-1 {
  width: 10%;
}

.small-2 {
  width: 20%;
}

.small-3 {
  width: 30%;
}

.small-4 {
  width: 40%;
}

.small-5 {
  width: 50%;
}

.small-6 {
  width: 60%;
}

.small-7 {
  width: 70%;
}

.small-8 {
  width: 80%;
}

.small-9 {
  width: 90%;
}

.small-10 {
  width: 100%;
}

@media only screen and (min-width: 37.5em) {
  .medium-1 {
    width: 10%;
  }
}

@media only screen and (min-width: 37.5em) {
  .medium-2 {
    width: 20%;
  }
}

@media only screen and (min-width: 37.5em) {
  .medium-3 {
    width: 30%;
  }
}

@media only screen and (min-width: 37.5em) {
  .medium-4 {
    width: 40%;
  }
}

@media only screen and (min-width: 37.5em) {
  .medium-5 {
    width: 50%;
  }
}

@media only screen and (min-width: 37.5em) {
  .medium-6 {
    width: 60%;
  }
}

@media only screen and (min-width: 37.5em) {
  .medium-7 {
    width: 70%;
  }
}

@media only screen and (min-width: 37.5em) {
  .medium-8 {
    width: 80%;
  }
}

@media only screen and (min-width: 37.5em) {
  .medium-9 {
    width: 90%;
  }
}

@media only screen and (min-width: 37.5em) {
  .medium-10 {
    width: 100%;
  }
}

@media only screen and (min-width: 60em), only print {
  .large-1 {
    width: 10%;
  }
}

@media only screen and (min-width: 60em), only print {
  .large-2 {
    width: 20%;
  }
}

@media only screen and (min-width: 60em), only print {
  .large-3 {
    width: 30%;
  }
}

@media only screen and (min-width: 60em), only print {
  .large-4 {
    width: 40%;
  }
}

@media only screen and (min-width: 60em), only print {
  .large-5 {
    width: 50%;
  }
}

@media only screen and (min-width: 60em), only print {
  .large-6 {
    width: 60%;
  }
}

@media only screen and (min-width: 60em), only print {
  .large-7 {
    width: 70%;
  }
}

@media only screen and (min-width: 60em), only print {
  .large-8 {
    width: 80%;
  }
}

@media only screen and (min-width: 60em), only print {
  .large-9 {
    width: 90%;
  }
}

@media only screen and (min-width: 60em), only print {
  .large-10 {
    width: 100%;
  }
}

.section--nav > .section__content:after,
.col,
.subnav--tertiary .subnav__content,
.field,
[type='text'],
[type='email'],
[type='date'],
[type='number'],
[type='password'],
select {
  padding-left: 16px;
  padding-left: 1rem;
  padding-left: .5rem;
  padding-right: .5rem;
}

@media only screen and (min-width: 37.5em) {
  .section--nav > .section__content:after,
  .col,
  .subnav--tertiary .subnav__content,
  .field,
  [type='text'],
  [type='email'],
  [type='date'],
  [type='number'],
  [type='password'],
  select {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}

/*------------------------------------*\
    #BREADCRUMBS
\*------------------------------------*/

.breadcrumb {
  font-weight: 100;
  letter-spacing: .03em;
}

.breadcrumb > li {
  display: none;
}

@media only screen and (min-width: 37.5em) {
  .breadcrumb > li {
    display: inline-block;
    *display: inline;
    *zoom: 1;
  }
}

.breadcrumb > li a:after {
  content: ' › ';
  color: #C7D900;
}

.breadcrumb > li .back:before,
.breadcrumb > li .close:before {
  content: ' ‹ ';
  color: #C7D900;
}

.breadcrumb > li .close:before {
  content: '\d7';
}

.breadcrumb > li .back:after,
.breadcrumb > li .close:after {
  content: none;
}

.anchor-links {
  background-color: #f4f8fb;
}

.anchor-links li:before,
.anchor-links li:after {
  top: 12px;
  top: 0.75rem;
}

.anchor-links li:before {
  content: '';
  border: 4px solid transparent;
  border-top: 4px solid #555;
}

.anchor-links li:after {
  content: '';
  left: 2px;
  border: 2px solid transparent;
  border-top: 2px solid #F2F4F7;
}

@media only screen and (max-width: 37.49em) {
  .anchor-links li a {
    padding-left: 10px;
    padding-left: 0.625rem;
  }
}

.anchor-links .grid {
  margin: 0;
}

/*------------------------------------*\
    #BUTTONS
\*------------------------------------*/

button {
  display: inline-block;
  border: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: transparent;
  cursor: pointer;
}

.btn,
.btn--submit,
.email-wrapper input[type='submit'],
.search-wrapper .search-submit {
  white-space: normal;
  border: none;
  cursor: pointer;
  font-family: inherit;
  color: inherit;
  text-decoration: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  font-size: inherit;
}

.btn:hover,
.btn--submit:hover,
.email-wrapper input[type='submit']:hover,
.search-wrapper .search-submit:hover {
  text-decoration: none;
}

.btn,
.btn--submit {
  border-radius: 4px;
  border-radius: 0.25rem;
}

.btn--block,
.btn--submit {
  display: block;
  width: 100%;
  padding-left: 0;
  padding-right: 0;
}

.btn--wide {
  padding-left: 2.5rem;
  padding-right: 2.5rem;
}

.btn--submit,
.btn--primary,
.email-wrapper input[type='submit'],
.search-wrapper .search-submit {
  background-color: #236FA6;
  color: #fff;
  border: #236FA6;
}

.btn--submit:visited,
.btn--primary:visited,
.email-wrapper input[type='submit']:visited,
.search-wrapper .search-submit:visited {
  color: #fff;
}

.btn--submit:hover,
.btn--primary:hover,
.email-wrapper input[type='submit']:hover,
.search-wrapper .search-submit:hover {
  background: #1a537c;
  color: #fff;
}

.btn--submit:active,
.btn--primary:active,
.email-wrapper input[type='submit']:active,
.search-wrapper .search-submit:active {
  color: #fff;
  background: #236FA6;
}

.btn--secondary {
  background: #fff;
  color: #236FA6;
  -webkit-box-shadow: inset 1px 0 0 #236FA6, inset 0 1px 0 #236FA6, inset -1px 0 0 #236FA6, inset 0 -1px 0 #236FA6;
  box-shadow: inset 1px 0 0 #236FA6, inset 0 1px 0 #236FA6, inset -1px 0 0 #236FA6, inset 0 -1px 0 #236FA6;
}

.btn--secondary:visited {
  color: #236FA6;
}

.btn--secondary:hover {
  background-color: #F2F4F7;
  color: #236FA6;
}

.btn--secondary:active {
  background-color: white;
  -webkit-box-shadow: inset 1px 0 0 #1a537c, inset 0 1px 0 #1a537c, inset -1px 0 0 #1a537c, inset 0 -1px 0 #1a537c;
  box-shadow: inset 1px 0 0 #1a537c, inset 0 1px 0 #1a537c, inset -1px 0 0 #1a537c, inset 0 -1px 0 #1a537c;
  color: #1a537c;
}

.btn--tertiary {
  background: none;
  color: #236FA6;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.btn--tertiary:visited {
  color: #236FA6;
}

/**
 * Make a button behave like a block at mobile only (also handy)
 */

@media only screen and (max-width: 37.49em) {
  .btn--block-mobile {
    text-align: center;
    display: block;
  }
}

/**
### Buttons in forms
Try and avoid using `<input type='submit' value='Go'>` in favour of
`<button type='submit'>Go</button>` as it's easier to style.
*/

.btn--block + .btn--block {
  margin-left: 0;
}

.btn--bounce {
  position: relative;
  top: 0;
}

.btn--bounce:hover {
  top: .1em;
}

.btn-group .btn {
  margin-left: 0;
}

.btn-group .btn:not(:last-child) {
  margin-right: 1.25rem;
}

.link-complex {
  color: inherit;
}

.noTouchEvents .link-complex:hover {
  text-decoration: none;
}

.link-complex:active {
  text-decoration: none;
}

.link-complex:hover .link-complex__link,
.link-complex:hover .news .news__title-link,
.news .link-complex:hover .news__title-link {
  text-decoration: underline;
}

.link-complex .link-complex__link,
.link-complex .news .news__title-link,
.news .link-complex .news__title-link,
.subnav .link-complex > h2 {
  color: #236FA6;
}

.link--disabled {
  pointer-events: none;
}

.link--disabled > * {
  color: #aaa;
}

.link--disabled .link-complex__link,
.link--disabled .news .news__title-link,
.news .link--disabled .news__title-link {
  color: #777;
}

.list-styled--disc,
ul,
ol {
  padding-top: 0;
  margin-left: 0;
  margin-top: 0;
}

.list-styled--disc > li,
ul > li,
ol > li {
  margin-left: 0;
  position: relative;
  list-style: inherit;
}

li ul,
li ol {
  padding-left: 0;
}

.nav > li {
  margin-right: .5em;
}

/*------------------------------------*\
    #NAV
\*------------------------------------*/

@-webkit-keyframes navIn {
  0% {
    -webkit-transform: translateY(-10%);
    transform: translateY(-10%);
    opacity: 0;
  }

  100% {
    -webkit-transform: translateY(0%);
    transform: translateY(0%);
    opacity: 1;
  }
}

@-moz-keyframes navIn {
  0% {
    -moz-transform: translateY(-10%);
    transform: translateY(-10%);
    opacity: 0;
  }

  100% {
    -moz-transform: translateY(0%);
    transform: translateY(0%);
    opacity: 1;
  }
}

@keyframes navIn {
  0% {
    -webkit-transform: translateY(-10%);
    -moz-transform: translateY(-10%);
    transform: translateY(-10%);
    opacity: 0;
  }

  100% {
    -webkit-transform: translateY(0%);
    -moz-transform: translateY(0%);
    transform: translateY(0%);
    opacity: 1;
  }
}

@-webkit-keyframes reveal {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@-moz-keyframes reveal {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes reveal {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.anim-nav-in {
  -webkit-animation: navIn .2s cubic-bezier(0.075, 0.82, 0.165, 1);
  -moz-animation: navIn .2s cubic-bezier(0.075, 0.82, 0.165, 1);
  animation: navIn .2s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.anim-nav-out {
  -webkit-animation: navIn .2s cubic-bezier(0.075, 0.82, 0.165, 1) reverse;
  -moz-animation: navIn .2s cubic-bezier(0.075, 0.82, 0.165, 1) reverse;
  animation: navIn .2s cubic-bezier(0.075, 0.82, 0.165, 1) reverse;
}

.section--nav {
  z-index: 10;
  top: 80px;
  left: 0;
  right: 0;
  width: 100%;
  background-color: #fff;
  border-bottom-style: solid;
  border-bottom-color: #C7D900;
  border-bottom-width: 4px;
  -webkit-box-shadow: 0px 5px 3px -3px rgba(0, 0, 0, 0.25);
  box-shadow: 0px 5px 3px -3px rgba(0, 0, 0, 0.25);
  display: none;
}

@media only screen and (max-width: 37.49em) {
  .section--nav {
    top: 64px;
  }
}

.section--nav > .section__content {
  padding-top: 0;
  padding-bottom: 0;
}

.no-js .section--nav {
  position: static;
  display: block;
}

@media only screen and (max-width: 59.99em) {
  .section--nav__content {
    padding-left: 0;
    padding-right: 0;
  }
}

body:after {
  content: "";
  height: 0;
  background: rgba(0, 0, 0, 0.15);
  top: 0;
  left: 0;
  opacity: 0;
  -webkit-transition: opacity .15s ease .1s, height 0s .25s;
  -moz-transition: opacity .15s ease .1s, height 0s .25s;
  transition: opacity .15s ease .1s, height 0s .25s;
}

.menu--active:after {
  opacity: 1;
  height: 100%;
  -webkit-transition: opacity .2s cubic-bezier(0.075, 0.82, 0.165, 1), height 0s;
  -moz-transition: opacity .2s cubic-bezier(0.075, 0.82, 0.165, 1), height 0s;
  transition: opacity .2s cubic-bezier(0.075, 0.82, 0.165, 1), height 0s;
  z-index: 1;
}

.menu--active .global-nav__menu:after {
  bottom: 0;
}

@media only screen and (max-width: 37.49em) {

}

.nav-list {
  padding-top: 4px;
  padding-top: 0.25rem;
}

.nav-list > li {
  min-width: 50%;
}

.nav-list .i {
  margin-right: .5em;
}

.nav-list a {
  display: block;
}

.nav-list a:hover .i-section {
  background-color: #00456B;
}

.nav-transaction,
.nav-about,
.nav-main {
  padding-left: 1em;
  padding-top: 1em;
  padding-bottom: 1em;
}

.nav-transaction li:last-child,
.nav-about li:last-child,
.nav-main li:last-child {
  padding-bottom: 0;
}

@media only screen and (min-width: 37.5em) {
  .nav-transaction,
  .nav-about,
  .nav-main {
    padding-left: 32px;
    padding-left: 2rem;
    padding-right: 32px;
    padding-right: 2rem;
  }
}

@media only screen and (min-width: 37.5em) and (max-width: 59.99em) {
  .nav-transaction,
  .nav-about,
  .nav-main {
    padding-bottom: 32px;
    padding-bottom: 2rem;
  }
}

@media only screen and (max-width: 37.49em) {
  .nav-transaction,
  .nav-about,
  .nav-main {
    padding-top: 16px;
    padding-top: 1rem;
    padding-bottom: 32px;
    padding-bottom: 2rem;
  }
}

@media only screen and (min-width: 60em) {
  .nav-main {
    padding-left: 0;
  }
}

.nav-transaction__label {
  vertical-align: middle;
  margin-left: .5em;
}

.nav-transaction__title {
  display: inline-block;
  width: 100%;
}

.nav-transaction ul > li {
  padding-left: 50px;
  padding-left: 3.125rem;
  text-align: left;
}

.nav-transaction ul > li .nav-main__icon {
  width: 33.3333333%;
  display: inline-block;
  text-align: center;
}

.action__icon {
  width: 72px;
  width: 4.5rem;
  height: 72px;
  height: 4.5rem;
  display: inline-block;
  text-align: center;
  vertical-align: middle;
  background-color: #236FA6;
}

@media only screen and (max-width: 37.49em) {
  .action__icon {
    width: 48px;
    width: 3rem;
    height: 48px;
    height: 3rem;
  }
}

.action__icon .i {
  background-position: 0 11.111%;
  margin-top: 0;
}

@media only screen and (min-width: 37.5em) {
  .action__icon .i {
    margin-top: 6px;
    margin-top: 0.375rem;
  }
}

.action {
  text-align: center;
  display: block;
}

.action > span {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

@media only screen and (min-width: 37.5em) {
  .action > span {
    max-width: 144px;
    max-width: 9rem;
  }
}

.action i {
  width: 4em;
  height: 4em;
}

@media only screen and (max-width: 37.49em) {
  .action {
    text-align: left;
  }

  .action > div,
  .action > span {
    vertical-align: middle;
  }

  .action i {
    background-position: 0 11.111%;
    margin-top: 22.5em;
    width: 3em;
    height: 3em;
  }

  .action > span {
    padding-left: 1em;
    margin-top: 0;
    display: inline-block;
    width: 66%;
  }
}

.action--small .action__icon {
  width: 48px;
  width: 3rem;
  height: 48px;
  height: 3rem;
}

.action--small .i {
  margin-top: 0;
  width: 3em;
  height: 3em;
}

.action--tiny .action__icon {
  width: 40px;
  width: 2.5rem;
  height: 40px;
  height: 2.5rem;
}

.action--tiny .i {
  margin-top: 0;
  width: 2.5em;
  height: 2.5em;
}

.action--horizontal {
  text-align: left;
}

.action--horizontal > div,
.action--horizontal > span {
  vertical-align: middle;
}

.action--horizontal i {
  background-position: 0 11.111%;
  margin-top: 22.5em;
  width: 3em;
  height: 3em;
}

.action--horizontal > span {
  padding-left: 1em;
  margin-top: 0;
  display: inline-block;
  width: 66%;
}

.action--horizontal.action--tiny > span {
  line-height: 1em;
  padding-left: 0.5em;
}

.action--green .action__icon {
  background-color: #afc83d;
}

.action--dark .action__icon {
  background-color: #004771;
}

.action--orange .action__icon {
  background-color: #de3f00;
}

.action--transparent .action__icon {
  background-color: inherit;
}

/*------------------------------------*\
    #PILLS
\*------------------------------------*/

.pill,
.pill--roadworks,
.pill--orange {
  border-radius: 2px;
  display: inline-block;
  vertical-align: middle;
  font-weight: normal;
  padding: .428571429em .571428571em;
  margin-right: .142857143em;
  margin-top: .142857143em;
  margin-bottom: .142857143em;
}

.pill strong,
.pill--roadworks strong,
.pill--orange strong {
  margin-left: .1em;
  margin-right: .2em;
}

.pill i,
.pill--roadworks i,
.pill--orange i {
  font-size: 1.142857143em;
  width: 1em;
  height: 1em;
  margin-top: -.125em;
}

.pill.pill--area-warning .i-area-warning {
  height: 0.65em;
}

.pill.pill--grey {
  background-color: #333;
  background-color: rgba(0, 0, 0, 0.6);
  color: inherit;
}

/*------------------------------------*\
    #STATISTICS BLOCK
\*------------------------------------*/

.statistics__figure {
  color: #00456B;
}

.statistics__label {
  color: #00456B;
}

.statistics__sub-label {
  color: #555;
}

/*------------------------------------*\
    #SUBNAV
\*------------------------------------*/

.breakline--hatched {
  position: relative;
  width: 100%;
  padding-top: 32px;
  padding-top: 2rem;
}

.breakline--hatched:before {
  position: absolute;
  content: "";
  top: 0;
  height: 12px;
  height: 0.75rem;
  left: 0;
  right: 0;
  background-repeat: repeat-x !important;
  opacity: .5;
}

.subnav h2 > .i-arrow-r,
.subnav h3 > .i-arrow-r {
  width: .6em;
  height: .6em;
}

.subnav__child {
  padding-left: 24px;
  padding-left: 1.5rem;
}

.subnav__child:before {
  content: "•";
  position: absolute;
  left: .25em;
}

@media only screen and (max-width: 37.49em) {
  .subnav__sidebar .action:first-child {
    padding-top: 0;
  }
}

.primary-subnav:first-child,
.secondary-subnav:first-child {
  margin-top: 0;
}

@media only screen and (max-width: 59.99em) {
  .primary-subnav .subnav__image,
  .secondary-subnav .subnav__image {
    display: none;
  }
}

@media only screen and (min-width: 37.5em) {
  .primary-subnav .subnav__sidebar,
  .secondary-subnav .subnav__sidebar {
    padding-top: 16px;
    padding-top: 1rem;
  }
}

.home__banner {
  position: relative;
  overflow-x: hidden;
}

.home__image {
  display: block;
  bottom: 0;
  width: 175%;
  margin-left: -37.5%;
}

@media only screen and (min-width: 37.5em) {
  .home__image {
    width: 150%;
    margin-left: -25%;
    margin-top: 0;
  }
}

@media only screen and (min-width: 60em), only print {
  .home__image {
    margin-top: 0vh;
    width: 110%;
    margin-left: 0;
  }
}

@media only screen and (min-width: 90em), only print {
  .home__image {
    width: 100%;
    margin-left: 0;
    margin-top: -18vh;
  }
}


.home__message {
  position: absolute;
  top: 0;
  width: 100%;
  color: #fff;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.375);
  padding-top: 12.5%;
}

@media only screen and (min-width: 30em) {
  .home__message {
    padding-top: 18.75%;
  }
}

@media only screen and (min-width: 37.5em) {
  .home__message {
    padding-top: 6.25%;
  }
}

.home__message .banner--Intro2 {
  text-shadow: 0 0 1em transparent, 1px 1px 1px rgba(0, 0, 0, 0.5);
}

.theme--banner {
  color: #236fa6;
}

.banner__overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url('../images/bg-abstract.png');
  background-repeat: no-repeat;
}

.subnav--tertiary .breakline--hatched:before {
  height: 8px;
  height: 0.5rem;
}

/*------------------------------------*\
    #CONTENT BLOCK
\*------------------------------------*/

/**
 * GLOBAL NAV
 *
 * Contents:
 * 1. Nav Pills
 * 2. Global nav - blue header (default)
 * 3. Global nav - white header
 */

/*
* 1. Nav Pills
*/

.nav-pill {
  border-radius: .25rem;
  padding: 0.2em .6em;
}

/*
* 2. Global nav - blue header (default)
*/

.global-nav--home + * {
  margin-top: -5.5em;
  padding-top: 5.5em;
  background-color: #7196a8;
}

.global-nav {
  z-index: 11;
}

.global-nav .search-container {
  width: 55%;
}

@media only screen and (max-width: 37.49em) {
  .global-nav .search-container {
    position: absolute;
    top: 100%;
    z-index: 10;
    margin-top: -1.5em;
    right: 1em;
    left: 1em;
    width: 80%;
  }
}

.global-nav .i-menu,
.global-nav .i-menu:hover {
  opacity: .75;
}

.global-nav .search__input,
.global-nav .menu {
  border-radius: .25rem;
  line-height: 25px;
  height: 30px;
}

.global-nav .search__input {
  background-color: #00456B;
  border-color: #00456B;
}

.global-nav .search__icon {
  display: block;
  position: absolute;
  right: 1em;
  top: 9px;
  padding: 7px;
}

.global-nav .search__icon:hover {
  background-position: 0 11.111%;
}

.global-nav .menu {
  background-color: #236FA6;
}

.global-nav .menu:hover {
  background-color: #00456B;
}

.global-nav .search-small .i-search {
  opacity: .75;
}

.global-nav .menu-small .i-menu {
  opacity: .75;
  padding: 10px;
}

/*
* 3. Global nav - white header (home page and traffic map page)
*/

.theme--full-colour {
  background-color: #fff;
}

.theme--full-colour a {
  color: #236FA6;
}

.theme--full-colour .menu,
.theme--full-colour .search__input {
  background-color: #f2f4f7;
}

.theme--full-colour .menu:hover {
  background-color: #eceff3;
}

.theme--full-colour .search__input {
  border-color: #f2f2eb;
  color: #555;
}

.theme--full-colour .search__input:focus {
  background-color: #eceff3;
}

.theme--full-colour .i-search,
.theme--full-colour .i-menu {
  background-position: 0 33.333%;
}

.theme--full-colour .i-search {
  opacity: .75;
}

.theme--full-colour .i-search:hover {
  opacity: .5;
  background-position: 0 33.333%;
}

.theme--full-colour .menu-small:hover {
  opacity: .65;
}

/*------------------------------------*\
	#HEADER STYLES
\*------------------------------------*/

.header {
  position: relative;
}

.header__image {
  min-height: 4em;
  overflow: hidden;
}

@media only screen and (max-width: 37.49em) {
  .header__image {
    position: relative;
  }
}

@media only screen and (min-width: 37.5em) and (max-width: 59.99em) {
  .header__image img {
    width: 150%;
    margin-left: -25%;
    margin-right: -25%;
  }
}

@media only screen and (max-width: 37.49em) {
  .header__image img {
    width: 150%;
    margin-left: -25%;
    margin-right: -25%;
  }
}

.header__title {
  padding-bottom: 16px;
  padding-bottom: 1rem;
}

@media only screen and (min-width: 37.5em) {
  .header__title h1 {
    margin-bottom: 12px;
    margin-bottom: 0.75rem;
    line-height: 0.9;
  }

  .header__title .breadcrumb {
    margin-bottom: 0px;
  }
}

@media only screen and (min-width: 60em) {
  .header__title {
    padding-bottom: 48px;
    padding-bottom: 3rem;
  }
}

.header__image + .header__title {
  bottom: 0;
  left: 0;
  right: 0;
}

@media only screen and (max-width: 37.49em) {
  .header__title {
    padding-bottom: 0;
  }

  .header__title .breadcrumb {
    margin-top: 0;
    margin-bottom: 4px;
    margin-bottom: 0.25rem;
  }

  .header__image + .header__title {
    position: relative;
    background-color: transparent;
  }

  .header__image + .header__title .breadcrumb {
    position: relative;
    bottom: 100%;
    left: 0;
    right: 0;
  }
}

/*------------------------------------*\
    #TABLES
\*------------------------------------*/

table {
  border: 1px solid #ccc;
  width: 100%;
  text-align: left;
}

table > thead {
  background-color: #eee;
}

table caption {
  text-align: left;
  padding: 4px 0;
}

table thead,
table tfoot {
  font-weight: 700;
}

table td,
table th {
  padding: .75em;
  border-right: solid 1px #ccc;
  border-bottom: solid 1px #ccc;
  vertical-align: top;
  word-wrap: break-word;
}

table td p:last-child {
  margin: 0;
}

table.table--header-borders thead th {
  border: 1px solid #ccc;
}

table.table--zebra > thead {
  border-bottom: solid 1px #ccc;
}

table.table--zebra > tfoot {
  border-top: solid 1px #ccc;
}

table.table--zebra > tbody > tr:nth-child(odd) th {
  background-color: #eee;
}

table.table--zebra > tbody > tr:nth-child(odd) td {
  background-color: #fafafa;
}

table.table--plain {
  border: 0;
}

table.table--plain td,
table.table--plain th {
  padding: 0 0 .5em 0;
  border-right: 0;
}

table.table--plain td:first-child,
table.table--plain th:first-child {
  padding-left: 0;
}

@media only screen and (max-width: 37.49em) {
  table.table--responsive {
    display: block;
    border: none;
  }

  table.table--responsive td,
  table.table--responsive tr,
  table.table--responsive tbody,
  table.table--responsive th {
    display: block;
    width: 100%;
    text-align: left;
    border-right: none;
    margin-top: 0;
  }

  table.table--responsive thead {
    display: none;
  }

  table.table--responsive td:first-child,
  table.table--responsive th {
    padding: 0;
    margin-top: 1.5em;
    font-weight: bold;
  }

  table.table--responsive th {
    font-weight: bold;
  }

  table.table--responsive tbody tr:nth-child(odd) td,
  table.table--responsive tbody tr:nth-child(odd) th {
    background: transparent;
  }

  table.table--responsive tbody tr:nth-child(odd) td + td,
  table.table--responsive tbody tr:nth-child(odd) th + td,
  table.table--responsive td + td,
  table.table--responsive th + td {
    background: #F7F7F7;
  }

  table.table--responsive td + td {
    border-top: solid 1px #e6e6e6;
  }

  table.table--responsive td[data-header] {
    overflow: hidden;
    display: block;
    position: relative;
    padding-left: 50%;
  }

  table.table--responsive td[data-header]:before {
    content: attr(data-header);
    float: left;
    width: 95%;
    margin-left: -100%;
    color: #777;
  }
}

/**
 *  Share navigation
**/

.share-nav {
  margin: 0;
}

.share-nav > li {
  color: #fff;
  display: block;
  float: left;
  background-color: #004771;
  margin: 0;
  line-height: 36px;
  line-height: 2.25rem;
  height: 38px;
  height: 2.375rem;
}

.share-nav > li + li {
  border-left: 1px solid #fff;
}

.share-nav > li:first-child {
  padding-left: 32px;
  padding-left: 2rem;
  padding-right: 16px;
  padding-right: 1rem;
}

.share-nav > li:last-child {
  overflow: hidden;
  border-radius: 0 5px 5px 0;
}

.share-nav > li > a {
  height: 100%;
  padding-left: .75em;
  padding-right: .75em;
}

.share-nav .i {
  background-position: 0 11.111%;
}

/*------------------------------------*\
    #PAGINATION
\*------------------------------------*/

.pagination.pagination-centered {
  text-align: center;
}

.pagination.pagination-centered a {
  margin: 0 .75rem;
}

.pagination a {
  margin: 0 1.5rem 0 0;
}

.pagination a.disabled {
  color: #999;
}

.pagination li.active a {
  color: #00456B;
}

/*
* Image Gallery component
*
* contents:
* 1. Lightbox core styles
* 2. Image Gallery theme
*/

/*
1. Magnific Popup - v1.0.0 - 2015-01-03
* http://dimsemenov.com/plugins/magnific-popup/
* Copyright (c) 2015 Dmitry Semenov;
*/

.mfp-bg {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1042;
  overflow: hidden;
  position: fixed;
  background: #0b0b0b;
  opacity: 0.8;
  filter: alpha(opacity=80);
}

.mfp-wrap {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1043;
  position: fixed;
  outline: none !important;
  -webkit-backface-visibility: hidden;
}

.mfp-container {
  text-align: center;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  padding: 0 8px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.mfp-container:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

.mfp-align-top .mfp-container:before {
  display: none;
}

.mfp-content {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  margin: 0 auto;
  text-align: left;
  z-index: 1045;
}

.mfp-inline-holder .mfp-content,
.mfp-ajax-holder .mfp-content {
  width: 100%;
  cursor: auto;
}

.mfp-ajax-cur {
  cursor: progress;
}

.mfp-zoom-out-cur,
.mfp-zoom-out-cur .mfp-image-holder .mfp-close {
  cursor: -moz-zoom-out;
  cursor: zoom-out;
}

.mfp-zoom {
  cursor: pointer;
  cursor: -moz-zoom-in;
  cursor: zoom-in;
}

.mfp-auto-cursor .mfp-content {
  cursor: auto;
}

.mfp-close,
.mfp-arrow,
.mfp-preloader,
.mfp-counter {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.mfp-loading.mfp-figure {
  display: none;
}

.mfp-hide {
  display: none !important;
}

.mfp-preloader {
  color: #CCC;
  position: absolute;
  top: 50%;
  width: auto;
  text-align: center;
  margin-top: -0.8em;
  left: 8px;
  right: 8px;
  z-index: 1044;
}

.mfp-preloader a {
  color: #CCC;
}

.mfp-preloader a:hover {
  color: #FFF;
}

.mfp-s-ready .mfp-preloader {
  display: none;
}

.mfp-s-error .mfp-content {
  display: none;
}

button.mfp-close,
button.mfp-arrow {
  overflow: visible;
  cursor: pointer;
  background: transparent;
  border: 0;
  -webkit-appearance: none;
  display: block;
  outline: none;
  padding: 0;
  z-index: 1046;
  -webkit-box-shadow: none;
  box-shadow: none;
}

button::-moz-focus-inner {
  padding: 0;
  border: 0;
}

.mfp-close {
  width: 44px;
  height: 44px;
  line-height: 44px;
  position: absolute;
  right: 0;
  top: 0;
  text-decoration: none;
  text-align: center;
  opacity: 0.65;
  filter: alpha(opacity=65);
  padding: 0 0 18px 10px;
  color: #FFF;
  font-style: normal;
  font-size: 44px;
  font-family: Arial, Baskerville, monospace;
}

.mfp-close:hover,
.mfp-close:focus {
  opacity: 1;
  filter: alpha(opacity=100);
}

.mfp-close:active {
  top: 1px;
}

.mfp-close-btn-in .mfp-close {
  color: #333;
}

.mfp-image-holder .mfp-close,
.mfp-iframe-holder .mfp-close {
  color: #FFF;
  right: -6px;
  text-align: right;
  padding-right: 6px;
  width: 100%;
}

.mfp-iframe-holder {
  margin-top: -70px;
  padding-top: 0px;
}

.mfp-sitelink {
  padding-bottom: 1em;
}

.mfp-counter {
  position: absolute;
  top: 0;
  right: 0;
  color: #CCC;
  font-size: 12px;
  line-height: 18px;
  white-space: nowrap;
}

.mfp-arrow {
  position: absolute;
  opacity: 0.65;
  filter: alpha(opacity=65);
  margin: 0;
  top: 50%;
  margin-top: -55px;
  padding: 0;
  width: 90px;
  height: 110px;
  -webkit-tap-highlight-color: transparent;
}

.mfp-arrow:active {
  margin-top: -54px;
}

.mfp-arrow:hover,
.mfp-arrow:focus {
  opacity: 1;
  filter: alpha(opacity=100);
}

.mfp-arrow:before,
.mfp-arrow:after,
.mfp-arrow .mfp-b,
.mfp-arrow .mfp-a {
  content: '';
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  left: 0;
  top: 0;
  margin-top: 35px;
  margin-left: 35px;
  border: medium inset transparent;
}

.mfp-arrow:after,
.mfp-arrow .mfp-a {
  border-top-width: 13px;
  border-bottom-width: 13px;
  top: 8px;
}

.mfp-arrow:before,
.mfp-arrow .mfp-b {
  border-top-width: 21px;
  border-bottom-width: 21px;
  opacity: 0.7;
}

.mfp-arrow-left {
  left: 0;
}

.mfp-arrow-left:after,
.mfp-arrow-left .mfp-a {
  border-right: 17px solid #FFF;
  margin-left: 31px;
}

.mfp-arrow-left:before,
.mfp-arrow-left .mfp-b {
  margin-left: 25px;
  border-right: 27px solid #3F3F3F;
}

.mfp-arrow-right {
  right: 0;
}

.mfp-arrow-right:after,
.mfp-arrow-right .mfp-a {
  border-left: 17px solid #FFF;
  margin-left: 39px;
}

.mfp-arrow-right:before,
.mfp-arrow-right .mfp-b {
  border-left: 27px solid #3F3F3F;
}

.mfp-iframe-holder {
  padding-top: 40px;
  padding-bottom: 40px;
}

.mfp-iframe-holder .mfp-content {
  line-height: 0;
  width: 100%;
  max-width: 900px;
}

.mfp-iframe-holder .mfp-close {
  top: -40px;
}

.mfp-iframe-scaler {
  width: 100%;
  height: 0;
  overflow: hidden;
  padding-top: 56.25%;
}

.mfp-iframe-scaler iframe {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  background: #000;
}

/* Main image in popup */

img.mfp-img {
  width: auto;
  max-width: 100%;
  height: auto;
  display: block;
  line-height: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 40px 0 40px;
  margin: 0 auto;
}

/* The shadow behind the image */

.mfp-figure {
  line-height: 0;
}

.mfp-figure:after {
  content: '';
  position: absolute;
  left: 0;
  top: 40px;
  bottom: 40px;
  display: block;
  right: 0;
  width: auto;
  height: auto;
  z-index: -1;
  -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  background: #444;
}

.mfp-figure small {
  color: #BDBDBD;
  display: block;
  font-size: 12px;
  line-height: 14px;
}

.mfp-figure figure {
  margin: 0;
}

.mfp-bottom-bar {
  margin-top: -36px;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  cursor: auto;
}

.mfp-bottom-bar.video {
  margin-top: 0;
  padding: 1em 1em;
  background-color: #000;
}

.mfp-title {
  text-align: left;
  line-height: 18px;
  color: #F3F3F3;
  word-wrap: break-word;
  padding-right: 36px;
}

.mfp-publisheddate,
.mfp-description {
  color: #F3F3F3;
}

.mfp-publisheddate {
  margin-bottom: 0.25em;
}

.mfp-image-holder .mfp-content {
  max-width: 100%;
}

.mfp-gallery .mfp-image-holder .mfp-figure {
  cursor: pointer;
}

@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
  /**
       * Remove all paddings around the image on small screen
       */

  .mfp-img-mobile .mfp-image-holder {
    padding-left: 0;
    padding-right: 0;
  }

  .mfp-img-mobile img.mfp-img {
    padding: 0;
  }

  .mfp-img-mobile .mfp-figure:after {
    top: 0;
    bottom: 0;
  }

  .mfp-img-mobile .mfp-figure small {
    display: inline;
    margin-left: 5px;
  }

  .mfp-img-mobile .mfp-bottom-bar {
    background: rgba(0, 0, 0, 0.6);
    bottom: 0;
    margin: 0;
    top: auto;
    padding: 3px 5px;
    position: fixed;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }

  .mfp-img-mobile .mfp-bottom-bar:empty {
    padding: 0;
  }

  .mfp-img-mobile .mfp-counter {
    right: 5px;
    top: 3px;
  }

  .mfp-img-mobile .mfp-close {
    top: 0;
    right: 0;
    width: 35px;
    height: 35px;
    line-height: 35px;
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    text-align: center;
    padding: 0;
  }
}

@media all and (max-width: 900px) {
  .mfp-arrow {
    -webkit-transform: scale(0.75);
    -moz-transform: scale(0.75);
    -ms-transform: scale(0.75);
    transform: scale(0.75);
  }

  .mfp-arrow-left {
    -webkit-transform-origin: 0;
    -moz-transform-origin: 0;
    -ms-transform-origin: 0;
    transform-origin: 0;
  }

  .mfp-arrow-right {
    -webkit-transform-origin: 100%;
    -moz-transform-origin: 100%;
    -ms-transform-origin: 100%;
    transform-origin: 100%;
  }

  .mfp-container {
    padding-left: 6px;
    padding-right: 6px;
  }
}

.mfp-ie7 .mfp-img {
  padding: 0;
}

.mfp-ie7 .mfp-bottom-bar {
  width: 600px;
  left: 50%;
  margin-left: -300px;
  margin-top: 5px;
  padding-bottom: 5px;
}

.mfp-ie7 .mfp-container {
  padding: 0;
}

.mfp-ie7 .mfp-content {
  padding-top: 44px;
}

.mfp-ie7 .mfp-close {
  top: 0;
  right: 0;
  padding-top: 0;
}

/*
 * 2. Image Gallery theme
 */

.lightbox-gallery figure {
  margin-bottom: 16px;
  margin-bottom: 1rem;
  position: relative;
}

.lightbox-gallery figure a .icon-bg {
  position: absolute;
  background: #fff;
  width: 1em;
  height: 1em;
  right: 0;
  top: 0;
  opacity: .5;
  -webkit-transition: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  transition: opacity 0.2s;
}

.lightbox-gallery figure a .icon-enlarge {
  position: absolute;
  right: 1px;
  top: 1px;
}

.lightbox-gallery figure a:hover .icon-bg {
  opacity: 1;
}

.lightbox-gallery figure a:focus {
  outline: 0;
}

.lightbox-gallery figcaption {
  font-size: 14px;
  font-size: 0.875rem;
}

.lightbox-content {
  position: relative;
}

/* removes the stupid focus selector on all links */

.mfp-container button:focus,
.mfp-container a:focus {
  outline: 0;
}

.global__checkbox-group .global__checkbox-group_master {
  font-style: italic;
}

.global__checkbox-group .global__checkbox-group_nest-master {
  display: inline-block;
}

.global__checkbox-group .global__checkbox-group_showhide {
  display: inline-block;
  padding: 0 4px 1px 0;
}

.global__counter-checkbox-group .global__counter-checkbox-group_master {
  font-style: italic;
}

.global__counter-checkbox-group .global__counter-checkbox-group_nest-master {
  display: inline-block;
}

.global__counter-checkbox-group .global__counter-checkbox-group_showhide {
  display: inline-block;
  padding: 0 4px 1px 0;
}

/**
## Forms
*/

/*------------------------------------*\
    #Fieldset
\*------------------------------------*/

fieldset {
  border: 0;
}

/*------------------------------------*\
    #FIELD
\*------------------------------------*/

@media only screen and (max-width: 37.49em) {
  .field,
  .field--select,
  .field--number,
  .field--text,
  .field--prev-next,
  .field--email-plus-submit,
  .field--radio-button-list,
  .field--details,
  .field--radio-button-group,
  .field--submit,
  .field--search {
    margin-bottom: 20px;
    margin-bottom: 1.25rem;
  }
}

.field,
[type='text'],
[type='email'],
[type='date'],
[type='number'],
[type='password'] {
  border-radius: 4px;
  border-radius: 0.25rem;
  -webkit-appearance: none;
  border: 1px solid #00456B;
  background-color: #F2F2EB;
  font-family: inherit;
  font-size: inherit;
  color: inherit;
}

div.field,
fieldset fieldset.field {
  background: transparent;
  border: none;
}

.field--bare {
  border: none;
  background-color: transparent;
  border-radius: none;
}

.field--knockout {
  color: #555;
  -webkit-transition: background-color .1s, -webkit-box-shadow .1s;
  -moz-transition: background-color .1s, box-shadow .1s;
  transition: background-color .1s, box-shadow .1s;
  border-width: 3px;
  border-color: transparent;
}

.field--knockout:focus,
.field--knockout:active {
  outline: none;
  border: solid 3px #ff5c00;
  background-color: #fff;
}

label {
  color: #00456B;
}

select {
  padding: .5rem;
  font-family: inherit;
  font-size: inherit;
}

/*------------------------------------*\
    #FIELD NUMBER
\*------------------------------------*/

/*------------------------------------*\
    #FIELD TEXT
\*------------------------------------*/

/*------------------------------------*\
    #Field error
\*------------------------------------*/

.field--error {
  color: #c44;
}

.field--error .field__label,
.field--error label {
  color: #c44;
}

.field--error [type='text'],
.field--error [type='date'],
.field--error [type='email'],
.field--error [type='number'],
.field--error textarea {
  color: #555;
}

.form--has-errors .field,
.form--has-errors .field--select,
.form--has-errors .field--number,
.form--has-errors .field--text,
.form--has-errors .field--prev-next,
.form--has-errors .field--email-plus-submit,
.form--has-errors .field--radio-button-list,
.form--has-errors .field--details,
.form--has-errors .field--radio-button-group,
.form--has-errors .field--submit,
.form--has-errors .field--search {
  display: none;
}

.form--has-errors .field--error,
.form--has-errors .field--submit {
  display: block;
}

/*------------------------------------*\
    #Field link -
    this wraps a link in a container so it can apply a consistent top margin to
    match the other field components
\*------------------------------------*/

/*------------------------------------*\
    #FIELD PREV AND NEXT BUTTONS
\*------------------------------------*/

.prev-link:before,
.next-link:after {
  margin-top: -2px;
  margin-top: -0.125rem;
  border-width: 4px;
  border-width: 0.25rem;
  top: 50%;
  content: '';
  border-color: transparent;
  border-style: solid;
}

.prev-link:before {
  border-right-color: #236FA6;
}

.next-link:after {
  border-left-color: #236FA6;
}

/*------------------------------------*\
    #Field email plus submit
\*------------------------------------*/

.email-wrapper [type='email'],
.email-wrapper input[type='submit'] {
  height: 44px;
}

.email-wrapper [type='email'] {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  width: 70%;
}

.email-wrapper input[type='submit'] {
  padding: 4px;
  padding: 0.25rem;
  line-height: 16px;
  line-height: 1rem;
  border-top-left-radius: 0px;
  border-top-left-radius: 0rem;
  border-bottom-left-radius: 0px;
  border-bottom-left-radius: 0rem;
  border-top-right-radius: 4px;
  border-top-right-radius: 0.25rem;
  border-bottom-right-radius: 4px;
  border-bottom-right-radius: 0.25rem;
  width: 30%;
  margin-top: 0;
  margin-bottom: 0;
}

/*!
 * Pikaday
 * Copyright © 2014 David Bushell | BSD & MIT license | http://dbushell.com/
 */

.pika-single {
  z-index: 9999;
  display: block;
  position: relative;
  color: #333;
  background: #fff;
  border: 1px solid #ccc;
  border-bottom-color: #bbb;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.pika-single.is-hidden {
  display: none;
}

.pika-single.is-bound {
  position: absolute;
  -webkit-box-shadow: 0 5px 15px -5px rgba(0, 0, 0, 0.5);
  box-shadow: 0 5px 15px -5px rgba(0, 0, 0, 0.5);
}

.pika-single {
  *zoom: 1;
}

.pika-single:before,
.pika-single:after {
  content: " ";
  display: table;
}

.pika-single:after {
  clear: both;
}

.pika-lendar {
  float: left;
  width: 240px;
  margin: 8px;
}

.pika-title {
  position: relative;
  text-align: center;
}

.pika-title select {
  cursor: pointer;
  position: absolute;
  z-index: 9998;
  margin: 0;
  left: 0;
  top: 5px;
  filter: alpha(opacity=0);
  opacity: 0;
}

.pika-label {
  display: inline-block;
  *display: inline;
  position: relative;
  z-index: 9999;
  overflow: hidden;
  margin: 0;
  padding: 5px 3px;
  font-size: 14px;
  line-height: 20px;
  font-weight: bold;
  background-color: #fff;
}

.pika-prev,
.pika-next {
  display: block;
  cursor: pointer;
  position: relative;
  outline: none;
  border: 0;
  padding: 0;
  width: 20px;
  height: 30px;
  text-indent: 20px;
  white-space: nowrap;
  overflow: hidden;
  background-color: transparent;
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: 75% 75%;
  background-size: 75% 75%;
  opacity: .5;
  *position: absolute;
  *top: 0;
}

.pika-prev:hover,
.pika-next:hover {
  opacity: 1;
}

.pika-prev.is-disabled,
.pika-next.is-disabled {
  cursor: default;
  opacity: .2;
}

.pika-prev,
.is-rtl .pika-next {
  float: left;
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAUklEQVR42u3VMQoAIBADQf8Pgj+OD9hG2CtONJB2ymQkKe0HbwAP0xucDiQWARITIDEBEnMgMQ8S8+AqBIl6kKgHiXqQqAeJepBo/z38J/U0uAHlaBkBl9I4GwAAAABJRU5ErkJggg==');
  *left: 0;
}

.pika-next,
.is-rtl .pika-prev {
  float: right;
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAU0lEQVR42u3VOwoAMAgE0dwfAnNjU26bYkBCFGwfiL9VVWoO+BJ4Gf3gtsEKKoFBNTCoCAYVwaAiGNQGMUHMkjGbgjk2mIONuXo0nC8XnCf1JXgArVIZAQh5TKYAAAAASUVORK5CYII=');
  *right: 0;
}

.pika-select {
  display: inline-block;
  *display: inline;
}

.pika-table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  border: 0;
}

.pika-table th,
.pika-table td {
  width: 14.2857142857%;
  padding: 0;
}

.pika-table th {
  color: #999;
  font-size: 12px;
  line-height: 25px;
  font-weight: bold;
  text-align: center;
}

.pika-table abbr {
  border-bottom: none;
  cursor: help;
}

.pika-button {
  cursor: pointer;
  display: block;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  outline: none;
  border: 0;
  margin: 0;
  width: 100%;
  padding: 5px;
  color: #666;
  font-size: 12px;
  line-height: 15px;
  text-align: right;
  background: #f5f5f5;
}

.is-today .pika-button {
  color: #33aaff;
  font-weight: bold;
}

.is-selected .pika-button {
  color: #fff;
  font-weight: bold;
  background: #33aaff;
  -webkit-box-shadow: inset 0 1px 3px #178fe5;
  box-shadow: inset 0 1px 3px #178fe5;
  border-radius: 3px;
}

.is-disabled .pika-button {
  pointer-events: none;
  cursor: default;
  color: #999;
  opacity: .3;
}

.pika-button:hover {
  color: #fff;
  background: #ff8000;
  -webkit-box-shadow: none;
  box-shadow: none;
  border-radius: 3px;
}

.pika-week {
  font-size: 11px;
  color: #999;
}

.is-inrange .pika-button {
  background: #D5E9F7;
}

.is-startrange .pika-button {
  color: #fff;
  background: #6CB31D;
  -webkit-box-shadow: none;
  box-shadow: none;
  border-radius: 3px;
}

.is-endrange .pika-button {
  color: #fff;
  background: #33aaff;
  -webkit-box-shadow: none;
  box-shadow: none;
  border-radius: 3px;
}

/*------------------------------------*\
    #RADIO BUTTON LIST
\*------------------------------------*/

.radio-button-list input {
  top: 32%;
}

/*------------------------------------*\
    #Field details
\*------------------------------------*/

/*------------------------------------*\
    #RADIO BUTTON GROUP
\*------------------------------------*/

@media only screen and (max-width: 37.49em) {
  .field--radio-button-group .field__note,
  .field--radio-button-group .form-50max #Form_Form_50maxTextField4-error2,
  .form-50max .field--radio-button-group #Form_Form_50maxTextField4-error2,
  .field--radio-button-group .field--error .error.message,
  .field--error .field--radio-button-group .error.message {
    margin-bottom: 4px;
    margin-bottom: 0.25rem;
  }
}

.segmented-control > li,
.form-50max .segmented-control > li {
  border: 1px solid #236FA6;
  margin-right: -1px;
  margin-bottom: -1px;
}

.segmented-control label,
.form-50max .segmented-control label {
  color: #236FA6;
}

.segmented-control label span,
.form-50max .segmented-control label span {
  cursor: pointer;
}

.segmented-control input:checked + label {
  background: #236FA6;
  color: #fff;
}

.segmented-control--2-segments li,
.form-50max .segmented-control.segmented-control--2-segments li {
  width: 50%;
}

.segmented-control--3-segments li,
.form-50max .segmented-control.segmented-control--3-segments li {
  width: 33.33333333%;
}

.segmented-control--4-segments li,
.form-50max .segmented-control.segmented-control--4-segments li {
  width: 25%;
}

.segmented-control--5-segments li,
.form-50max .segmented-control.segmented-control--5-segments li {
  width: 20%;
}

.segmented-control--6-segments li,
.form-50max .segmented-control.segmented-control--6-segments li {
  width: 33.33333333%;
}

.segmented-control--7-segments li,
.form-50max .segmented-control.segmented-control--7-segments li {
  width: 50%;
}

.segmented-control--7-segments li:first-child,
.form-50max .segmented-control.segmented-control--7-segments li:first-child {
  border-bottom-left-radius: 0px;
  border-bottom-left-radius: 0rem;
}

.segmented-control--7-segments li:nth-child(2),
.form-50max .segmented-control.segmented-control--7-segments li:nth-child(2) {
  border-bottom-right-radius: 0px;
  border-bottom-right-radius: 0rem;
}

.segmented-control--7-segments li:last-child,
.form-50max .segmented-control.segmented-control--7-segments li:last-child {
  border-top-right-radius: 0px;
  border-top-right-radius: 0rem;
}

.segmented-control--8-segments li,
.form-50max .segmented-control.segmented-control--8-segments li {
  width: 25%;
}

.segmented-control--9-segments li,
.form-50max .segmented-control.segmented-control--9-segments li {
  width: 33.33333333%;
}

.segmented-control--10-segments li,
.form-50max .segmented-control.segmented-control--10-segments li {
  width: 20%;
}

.segmented-control--11-segments li,
.form-50max .segmented-control.segmented-control--11-segments li {
  width: 25%;
}

.segmented-control--12-segments li,
.form-50max .segmented-control.segmented-control--12-segments li {
  width: 25%;
}

.segmented-control--13-segments li,
.form-50max .segmented-control.segmented-control--13-segments li {
  width: 50%;
}

.segmented-control--14-segments li {
  width: 50%;
}

/*------------------------------------*\
    #FIELD SUBMIT
\*------------------------------------*/

/*------------------------------------*\
    #FIELD DROPDOWN
\*------------------------------------*/

.field--dropdown {
  margin-bottom: 5px;
}

.field--dropdown select {
  cursor: pointer;
  height: 40px !important;
}

.field--dropdown select:disabled {
  cursor: not-allowed;
}

.field--dropdown .dropdown {
  background-color: #F2F2EB;
  background-repeat: no-repeat;
  background-position: 95% 0;
  background-image: url("../images/forms/field--dropdown.png");
  -webkit-background-size: 20px 160px;
  background-size: 20px 160px;
  color: inherit;
  border-radius: .25rem;
  width: 100%;
  line-height: 1;
  height: 40px;
  /* select box is open */
  /* select box is in focus */
  /* dark blue theme */
  /* select box itself is disabled */
}

.field--dropdown .dropdown .dropdownInner {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  padding: 0 10% 0 1rem;
  line-height: 40px;
}

.field--dropdown .dropdown.dropdownOpen {
  background-position: 95% -40px;
}

.field--dropdown .dropdown.dropdownFocus {
  outline: solid 3px #ff5c00;
}

.field--dropdown .dropdown.dropdown--dark {
  background-color: #094771;
  background-position: 95% -80px;
  color: #fff;
}

.field--dropdown .dropdown.dropdown--dark.dropdownOpen {
  background-position: 95% -120px;
}

.field--dropdown .dropdown.dropdownDisabled {
  background: #eee;
  cursor: not-allowed;
  color: inherit;
  opacity: 0.6;
}

/*------------------------------------*\
    #Field text plus submit
\*------------------------------------*/

.search-wrapper .search-term,
.search-wrapper .search-submit {
  height: 44px;
}

.search-wrapper .search-term {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  width: 70%;
}

.search-wrapper .search-submit {
  padding: 4px;
  padding: 0.25rem;
  line-height: 16px;
  line-height: 1rem;
  border-top-left-radius: 0px;
  border-top-left-radius: 0rem;
  border-bottom-left-radius: 0px;
  border-bottom-left-radius: 0rem;
  border-top-right-radius: 4px;
  border-top-right-radius: 0.25rem;
  border-bottom-right-radius: 4px;
  border-bottom-right-radius: 0.25rem;
  width: 30%;
  margin-top: 0;
  margin-bottom: 0;
}

/**
## Pages
*/

/*------------------------------------*\
    #TRAFFIC - PAGE SPECIFIC
\*------------------------------------*/

.traffic-info .global-nav {
  position: relative;
}

@media only screen and (max-width: 37.49em) {
  .traffic-info .global-nav {
    padding-bottom: 18px;
    padding-bottom: 1.125rem;
    padding-top: 20px;
    padding-top: 1.25rem;
  }
}

.traffic-info .global-nav > .wrapper > .layout {
  padding-left: 32px;
  padding-left: 2rem;
  padding-right: 16px;
  padding-right: 1rem;
}

.traffic-info h1,
.traffic-info h2,
.traffic-info h3 {
  position: relative;
  padding-right: 8px;
  padding-right: 0.5rem;
}

.traffic-info h1.highway-count__1,
.traffic-info h2.highway-count__1,
.traffic-info h3.highway-count__1 {
  padding-right: 16px;
  padding-right: 1rem;
}

.traffic-info h1.highway-count__2,
.traffic-info h2.highway-count__2,
.traffic-info h3.highway-count__2 {
  padding-right: 48px;
  padding-right: 3rem;
}

.traffic-info .access:focus,
.traffic-info .access-keys:target {
  position: fixed;
  z-index: 11;
  top: -1em;
  bottom: 0;
  left: 0;
  right: 0;
}

.map-nav,
.map-nav--icon,
.map-nav--tools,
.map-nav--view-type,
.switch-nav {
  list-style: none;
  margin-bottom: 0;
  margin-top: 0;
  padding-left: 0;
}

.map-nav > li,
.map-nav--icon > li,
.map-nav--tools > li,
.map-nav--view-type > li,
.switch-nav > li {
  margin-top: 0;
}

.section--map {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 0;
}

.section--map > * {
  width: 100%;
  height: 100%;
}

.list-view,
.modal-view,
.map-nav,
.map-nav--icon,
.glossary-popup {
  -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.4);
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.4);
}

a {
  text-decoration: none;
}

a:hover {
  text-decoration: none;
}

/*
    map list
*/

.list-view,
.modal-view {
  -webkit-transition: left .25s ease-out;
  -moz-transition: left .25s ease-out;
  transition: left .25s ease-out;
  border-radius: 2px;
  background-color: #fff;
  z-index: 1;
  position: absolute;
  top: 1em;
}

.list-view {
  -moz-border-top-left-radius: 0;
  border-top-left-radius: 0;
  -moz-border-bottom-left-radius: 0;
  border-bottom-left-radius: 0;
  bottom: 1.5em;
  overflow-x: hidden;
  overflow-y: auto;
  min-width: 20em;
  max-width: 24em;
  width: 40%;
}

@media only screen and (max-width: 37.49em) {
  .list-view {
    width: 100%;
    border-radius: 0;
    padding-bottom: 32px;
    padding-bottom: 2rem;
    max-width: none;
    display: none;
    top: auto !important;
    margin-top: 0;
    bottom: auto;
  }
}

@media only screen and (max-width: 37.49em) {
  .list-active .list-view {
    display: block;
    position: relative;
  }

  .list-active .list-view .view-absolute {
    position: relative;
  }
}

@media only screen and (max-width: 37.49em) {
  .modal-active .list-view {
    position: absolute;
  }
}

.modal-view {
  -moz-border-top-left-radius: 0;
  border-top-left-radius: 0;
  -moz-border-bottom-left-radius: 0;
  border-bottom-left-radius: 0;
  overflow-x: hidden;
  overflow-y: auto;
  min-width: 20em;
  max-width: 24em;
  width: 40%;
  left: -26em;
  position: relative;
}

@media only screen and (max-width: 37.49em) {
  .modal-view {
    width: 100%;
    border-radius: 0;
    max-width: none;
    position: relative;
    top: auto;
    display: none;
    -webkit-transition: left 0s;
    -moz-transition: left 0s;
    transition: left 0s;
    left: 0;
    bottom: 0;
    margin-top: 0;
  }
}

.modal-active .modal-view {
  display: block;
}

.modal-view ul {
  margin-bottom: 0px;
}

.modal-active .list-view {
  left: -20em;
  width: 20em;
}

.modal-active .modal-view {
  left: 1em;
}

@media only screen and (max-width: 37.49em) {
  .modal-active .modal-view {
    left: 0;
  }
}

.traffic-info__nav .nav__link {
  color: #555;
  display: block;
  padding: 1.25em 0 1.25em 1.5em;
  text-transform: uppercase;
}

.traffic-info__nav .nav__link > span {
  display: inline-block;
  vertical-align: middle;
  font-size: 14px;
  font-size: 0.875rem;
}

.traffic-info__header {
  padding-left: 32px;
  padding-left: 2rem;
  padding-right: 32px;
  padding-right: 2rem;
  position: relative;
  width: 100%;
}

.traffic-info__header .breadcrumb {
  margin-top: 2px;
  margin-top: 0.125rem;
  margin-bottom: 8px;
  margin-bottom: 0.5rem;
  padding-right: 96px;
  padding-right: 6rem;
}

.traffic-info__header .breadcrumb + h1 {
  margin-top: 0;
}

.traffic-info__header h1 {
  margin-top: 1.3em;
}

.traffic-info__header h1 + h2 {
  margin-top: .5em;
}

.traffic-info__header .switch-nav {
  margin-top: 1em;
}

.level-1 .traffic-info__header {
  margin-bottom: 16px;
  margin-bottom: 1rem;
}

.level-1 .traffic-info__header:after {
  position: absolute;
  left: 32px;
  left: 2rem;
  height: 16px;
  height: 1rem;
  bottom: -16px;
  bottom: -1rem;
  right: 0;
  content: "";
  background-repeat: repeat-x !important;
}

.traffic-metrics {
  margin-left: 1%;
}

.traffic-metrics > * {
  vertical-align: middle;
  width: 32%;
}

.list__link + .traffic-messages {
  padding-top: 0;
}

.traffic-metrics + .traffic-messages {
  margin-top: -16px;
  margin-top: -1rem;
}

.traffic-info__body h5,
.traffic-info__body p {
  margin-top: .1em;
}

.traffic-info__body h3 > i {
  margin-top: 0.2em;
  margin-right: -.5em;
}

.level-1 .location-list {
  margin-left: 32px;
  margin-left: 2rem;
  margin-right: 32px;
  margin-right: 2rem;
}

.level-1 .location-list {
  border-bottom: 1px solid #eeeeee;
}

.level-1 .location-list > .list__item > a {
  padding-left: 0;
  padding-right: 0;
}

.location-list > .list__item {
  margin-top: 0;
}

.location-list > .list__item + .list__item {
  border-top: 1px solid #eeeeee;
}

.location-list > .list__item > * {
  padding-left: 32px;
  padding-left: 2rem;
  padding-right: 32px;
  padding-right: 2rem;
}

.location-list > .list__item.full-width > * {
  padding-left: 0;
  padding-right: 0;
}

.location-list > .list__item > a {
  padding-top: 1.25em;
  padding-bottom: 1.25em;
}

.location-list .list__link .pill {
  padding: .071428571em .285714286em .142857143em;
}

.location-list .list__link {
  display: block;
}

.location-list h4 {
  margin-bottom: 0;
}

.location-list__split {
  float: right;
}

/*
    map controls
*/

.map-controls {
  z-index: 1;
  position: absolute;
  margin-top: 1em;
  right: 0.75em;
  text-align: right;
  pointer-events: none;
}

@media only screen and (max-width: 37.49em) {
  .modal-active .map-controls {
    display: none;
  }
}

.list-active .map-controls {
  z-index: auto;
}

@media only screen and (max-width: 37.49em) {
  .list-active .map-controls .map-nav--view-type__map {
    display: inline-block;
  }

  .list-active .map-controls .map-nav--view-type__list {
    display: none;
  }
}

@media only screen and (max-width: 37.49em) {
  .map-controls {
    margin-top: 1em;
  }

  .map-controls .map-nav--view-type__map {
    display: none;
  }
}

.map-nav,
.map-nav--icon {
  border-radius: 2px;
  overflow: hidden;
  list-style: none;
  padding-left: 0;
  margin: 0;
}

.map-nav__item {
  text-align: center;
  margin-left: 0;
  margin-top: 0;
  padding: 0;
  border-top: 1px solid #005d95;
}

.map-nav__item > a {
  color: #fff;
  padding: .4em 0 .5em;
  display: block;
  line-height: 1.5;
}

.map-nav__item > a .i {
  background-position: 0 11.111%;
}

.map-nav__item > a:hover {
  background-color: #003758;
}

.map-nav__item.active > a {
  color: #000;
}

.map-nav__item:first-child {
  border-top: 0;
}

.section--view-type-nav {
  margin-bottom: .5em;
  pointer-events: all;
}

.section--map-nav {
  width: 2.6em;
  pointer-events: all;
}

@media only screen and (max-width: 37.49em) {
  .section--map-nav {
    width: 2em;
  }
}

.map-nav--icon {
  margin-top: 1em;
}

@media only screen and (max-width: 37.49em) {
  .map-nav--icon {
    margin-top: .5em;
  }
}

.map-nav--view-type {
  display: none;
  z-index: 2;
  position: relative;
}

@media only screen and (max-width: 37.49em) {
  .map-nav--view-type {
    display: inline-block;
  }
}

#live-updates-button-wrapper {
  display: inline-block;
}

#live-updates-button-wrapper.active {
  background-color: #479c47;
  border: 1px solid #479c47;
  color: #fff;
}

#live-updates-button-wrapper.active:hover {
  background-color: #67A967;
}

#live-updates-button-wrapper.active a:hover {
  background-color: transparent;
}

/**
 *   Taffic navigation
**/

.map-nav--tools {
  overflow: auto;
  max-height: 0;
  -webkit-transition: max-height .2s ease-out;
  -moz-transition: max-height .2s ease-out;
  transition: max-height .2s ease-out;
  border-radius: 2px;
  -moz-border-top-right-radius: 0;
  border-top-right-radius: 0;
  width: 230px;
  width: 14.375rem;
  background-color: #ffffff;
  float: right;
}

.tools-active .map-nav--tools {
  max-height: 15em;
  position: absolute;
  right: 0px;
}

.map-nav--tools .map-nav__item {
  text-align: left;
  margin: 0 .75em 0 3em;
}

.map-nav--tools .map-nav__item > label {
  color: #555;
  padding: 1.2em 0;
  position: relative;
}

.map-nav--tools .map-nav__item > label > i {
  position: absolute;
  left: -36px;
  left: -2.25rem;
}

.map-nav--tools .map-nav__item > label > input {
  float: right;
}

.map-nav--tools .map-nav__item + .map-nav__item {
  border-top: 1px solid #F2F2EB;
}

/*
    route list
*/

.route {
  padding-top: 48px;
  padding-top: 3rem;
}

.route__item {
  position: relative;
}

.route__item:before {
  position: absolute;
  content: "";
  left: 89px;
  left: 5.5625rem;
  margin-left: -1px;
  top: 1em;
  bottom: -0.65em;
  border-left: 2px solid #59B359;
}

.route__item:after {
  position: absolute;
  content: "";
  left: 89px;
  left: 5.5625rem;
  margin-left: -0.375em;
  top: 0.45em;
  width: 0.75em;
  height: 0.75em;
  background-position: 0 77.777%;
}

.route__item:last-child:before {
  content: none;
}

.route__item > * {
  min-height: 4.5em;
  position: relative;
  display: block;
}

.route__item > * p {
  color: #555;
}

.route__item > * p > i {
  width: 1em;
  height: 1em;
}

.route__item h4 {
  margin-bottom: 0;
}

.route__item h4,
.route__item > a > * {
  padding-left: 114px;
  padding-left: 7.125rem;
}

.route__item h4 .i-arrow-r,
.route__item > a > * .i-arrow-r {
  float: none;
  width: .8em;
  height: .8em;
}

.route__item .route__figure {
  position: absolute;
  left: 0;
  top: -20px;
  top: -1.25rem;
  width: 74px;
  width: 4.625rem;
  height: 64px;
  height: 4rem;
  overflow: hidden;
  line-height: 0;
  padding: 0;
}

.route__item .route__figure img {
  height: 100%;
  width: auto;
  border-radius: 5px;
}

.route__item .route__figure:after {
  content: "";
  -webkit-background-size: cover;
  background-size: cover;
  position: absolute;
  right: -1px;
  bottom: 0;
  top: 0;
  width: 10px;
}

.route__item--red:before {
  border-left-color: #CA4142;
}

.route__item--red:after {
  background-position: 0 100%;
}

.route__item--orange:before {
  border-left-color: #FF8C19;
}

.route__item--orange:after {
  background-position: 0 88.888%;
}

.route__item--green:before {
  border-left-color: #59B359;
}

.route__item--green:after {
  background-position: 0 77.777%;
}

.route__item--black:before {
  border-left-color: #555;
}

.route__item--black:after {
  background-position: 0 55.555%;
}

.route__item--unknown:before {
  border-left-color: #ddd;
}

.route__item--unknown:after {
  background-position: 0 66.666%;
}

.route__item--roadclosure:after,
.route__item--roadworks:after,
.route__item--warning:after,
.route__item--area-warning:after {
  width: 1.5em;
  height: 1.5em;
  margin-top: -0.375em;
  margin-left: -0.75em;
  border-width: .25em;
  border-style: solid;
  border-radius: 3px;
}

.route__item--roadclosure:after {
  background-position: 0 0 !important;
  -webkit-background-size: cover;
  background-size: cover;
  background-color: #000000;
  border-color: #000000;
}

.route__item--roadworks:after {
  background-position: 0 55.555% !important;
  background-color: #FF8C19;
  border-color: #FF8C19;
}

.route__item--warning:after {
  background-position: 0 11.111% !important;
  background-color: #CA4142;
  border-color: #CA4142;
}

.route__item--area-warning:after {
  background-position: 0 40% !important;
  background-color: #F1561C;
  border-color: #F1561C;
}

.webcam {
  line-height: 0;
  position: relative;
}

.webcam__image {
  line-height: 1;
  width: 100%;
  height: auto;
}

.webcam__caption {
  font-size: 14px;
  font-size: 0.875rem;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding-top: 16px;
  padding-top: 1rem;
  padding-bottom: 12px;
  padding-bottom: 0.75rem;
  padding-left: 32px;
  padding-left: 2rem;
  padding-right: 32px;
  padding-right: 2rem;
  color: #fff;
  background-image: -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.7)));
  background-image: -webkit-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.7) 100%);
  background-image: -moz- oldlinear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.7) 100%);
  background-image: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.7) 100%);
}

.webcam__last-update {
  display: block;
}

.webcam__last-update > .i {
  font-size: 16px;
  font-size: 1rem;
  margin-top: -1px;
  margin-top: -0.0625rem;
}

.webcam-list {
  padding-top: 0;
  white-space: nowrap;
  overflow: hidden;
  border-radius: 5px;
  margin: 0;
}

.webcam-list > li {
  margin-right: -.2em;
  vertical-align: top;
  margin-top: 0;
  width: 78px;
  width: 4.875rem;
  overflow: hidden;
  white-space: normal;
}

.webcam-list .webcam {
  display: block;
  position: static;
}

.webcam-list .webcam > .webcam__image {
  height: 64px;
  height: 4rem;
  width: auto;
}

.webcam-list .webcam > .webcam__caption {
  position: static;
  line-height: 1.2;
  padding: .2em .3em .3em;
  background: none;
}

/*
    switch navigation
*/

.map-nav--view-type,
.switch-nav {
  border-radius: 2px;
  overflow: hidden;
  background-color: #004771;
  border: 1px solid #236FA6;
  list-style: none;
}

.map-nav--view-type .nav__item,
.switch-nav .nav__item {
  float: left;
  border-top: 0;
  margin-top: 0;
}

.map-nav--view-type .nav__item > a,
.switch-nav .nav__item > a {
  padding: .35em 1em;
  display: inline-block;
  color: #fff;
}

.map-nav--view-type .nav__item > a:hover,
.switch-nav .nav__item > a:hover,
.map-nav--view-type .nav__item > a.active,
.switch-nav .nav__item > a.active {
  background-color: #236FA6;
}

.tools-active .toggle-tools a {
  background-color: #236FA6;
}

.horizontal-scroll {
  width: 100%;
  overflow-y: hidden;
  overflow-x: auto;
}

/*
    custom map icons
*/

.i-map-caret-down,
.i-map-caret-up,
.i-map-plus,
.i-map-minus,
.i-map-compass,
.i-map-cog {
  width: .875em;
  height: .875em;
}

.i-map-tools-cameras,
.i-map-tools-roadworks,
.i-map-tools-warnings,
.i-map-tools-area-warnings,
.i-map-tools-timsigns,
.i-map-tools-vmssigns,
.i-map-tools-projects,
.i-map-tools-closures {
  width: 26px;
  width: 1.625rem;
  height: 34px;
  height: 2.125rem;
  margin-top: -0.2em;
}

.i-map-tools-traffic-flow {
  width: 20px;
  width: 1.25rem;
  height: 18px;
  height: 1.125rem;
  margin-left: 3px;
  margin-left: 0.1875rem;
  margin-right: 3px;
  margin-right: 0.1875rem;
}

.i-sh {
  width: 1.625em;
  height: 1.625em;
}

.i-route {
  width: .875em;
  height: 1.25em;
}

.i-twitter,
.i-facebook,
.i-google {
  width: 1.375em;
  height: 1.375em;
}

.i-distance,
.i-speed,
.i-duration {
  width: 1.5em;
  height: 1.5em;
}

.i-limit {
  border: .3em solid #CA4142;
  border-radius: 2em;
  display: block;
  font-size: 1.2em;
  font-style: normal;
  font-weight: bold;
  height: 2.3em;
  line-height: 1.7em;
  text-align: center;
  width: 2.3em;
}

.highway {
  position: relative;
  display: inline-block;
}

h1 > .highway,
h2 > .highway,
h3 > .highway {
  position: absolute;
  top: 4px;
  top: 0.25rem;
  right: -12px;
  right: -0.75rem;
}

.highway__number {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  text-align: center;
  color: #fff;
}

.highway--white .highway__number {
  color: #333;
}

.view-relative {
  position: relative;
}

.view-absolute {
  position: absolute;
  background: #fff;
  width: 100%;
}

/**
 *  Traffic animation
**/

@-webkit-keyframes slideInFromRight {
  0% {
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    transform: translateX(100%);
  }

  100% {
    -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
  }
}

@-moz-keyframes slideInFromRight {
  0% {
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    transform: translateX(100%);
  }

  100% {
    -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
  }
}

@keyframes slideInFromRight {
  0% {
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    transform: translateX(100%);
  }

  100% {
    -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
  }
}

@-webkit-keyframes slideOutToRight {
  0% {
    -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
  }

  100% {
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    transform: translateX(100%);
  }
}

@-moz-keyframes slideOutToRight {
  0% {
    -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
  }

  100% {
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    transform: translateX(100%);
  }
}

@keyframes slideOutToRight {
  0% {
    -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
  }

  100% {
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    transform: translateX(100%);
  }
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@-moz-keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.anim-reveal {
  -webkit-animation: slideInFromRight 200ms both cubic-bezier(0.645, 0.045, 0.355, 1);
  -moz-animation: slideInFromRight 200ms both cubic-bezier(0.645, 0.045, 0.355, 1);
  animation: slideInFromRight 200ms both cubic-bezier(0.645, 0.045, 0.355, 1);
}

.anim-slidein {
  -webkit-animation: slideInFromRight 200ms both cubic-bezier(0.645, 0.045, 0.355, 1);
  -moz-animation: slideInFromRight 200ms both cubic-bezier(0.645, 0.045, 0.355, 1);
  animation: slideInFromRight 200ms both cubic-bezier(0.645, 0.045, 0.355, 1);
}

.anim-slideout {
  -webkit-animation: slideOutToRight 200ms both cubic-bezier(0.645, 0.045, 0.355, 1);
  -moz-animation: slideOutToRight 200ms both cubic-bezier(0.645, 0.045, 0.355, 1);
  animation: slideOutToRight 200ms both cubic-bezier(0.645, 0.045, 0.355, 1);
}

.anim-fadein {
  -webkit-animation: fadeIn 200ms both cubic-bezier(0.645, 0.045, 0.355, 1);
  -moz-animation: fadeIn 200ms both cubic-bezier(0.645, 0.045, 0.355, 1);
  animation: fadeIn 200ms both cubic-bezier(0.645, 0.045, 0.355, 1);
}

/*------------------------------------*\
    #HOME - PAGE SPECIFIC
\*------------------------------------*/

@media only screen and (max-width: 37.49em) {
  .homepage .content__right {
    padding-left: 1rem !important;
  }
}

@media only screen and (max-width: 37.49em) {
  .homepage .content__bottom,
  .homepage .content__right,
  .homepage .content__left {
    padding-top: 1em;
  }

  .homepage .content__left {
    padding-bottom: 1em;
  }
}

/*------------------------------------*\
    #ACCESSIBILITY
\*------------------------------------*/

.sr-only,
.nonvisual-indicator {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.access {
  width: 0;
  height: 0;
  position: absolute;
  overflow: hidden;
}

.access:focus,
.access-keys:target {
  width: auto;
  height: auto;
  position: static;
  overflow: visible;
  visibility: visible;
  width: auto;
  height: auto;
  overflow: visible;
}

.access-keys {
  background-color: #fcf4b9;
}

.access-keys__key {
  margin-right: .5em;
  display: inline-block;
  width: 2.5em;
}

.external {
  padding-right: 6px;
  padding-right: 0.375rem;
  margin-right: 6px;
  margin-right: 0.375rem;
}

.external:after {
  margin-top: 5px;
  margin-top: 0.3125rem;
  position: absolute;
  content: "";
  width: 9px;
  height: 9px;
  background-position: 0 22.222%;
  -webkit-background-size: cover;
  background-size: cover;
}

.external:hover:after {
  background-position: 0 33.333%;
}

.i-external-link {
  width: 10px;
  height: 10px;
  vertical-align: middle;
}

.theme--error a.external:after,
.theme--confirmation a.external:after {
  background-position: 0 11.111%;
}

.theme--dark a.external:after,
.theme--strong a.external:after,
.comment_admin a.external:after,
.theme--slate a.external:after,
.theme--error a.external:after,
.theme--confirmation a.external:after {
  background-position: 0 11.111%;
}

.theme--dark .theme--white a.external:after,
.theme--strong .theme--white a.external:after,
.comment_admin .theme--white a.external:after,
.theme--slate .theme--white a.external:after,
.theme--error .theme--white a.external:after,
.theme--confirmation .theme--white a.external:after {
  background-position: 0 33.333%;
}

/**
## Misc
*/

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

.btn:focus {
  outline: solid 3px #ff5c00;
}

@media only screen and (max-width: 37.49em) {

}

@media only screen and (max-width: 37.49em) {
  .hide-small {
    display: none;
  }
}

@media only screen and (min-width: 37.5em) {
  .hide-medium {
    display: none;
  }
}

@media only screen and (min-width: 60em) {
  .hide-large {
    display: none;
  }
}

/* progress bar */

.progress--bar .label-wrap {
  width: 100%;
  clear: both;
  height: auto;
  display: inline-block;
  font-size: 0.85 rem;
}

.progress--bar .label-wrap label:nth-child(1) {
  width: 30%;
}

.progress--bar .label-wrap label:nth-child(2) {
  width: 35%;
}

.progress--bar .label-wrap label:nth-child(3) {
  width: auto;
}

.progress--bar .label-wrap label:nth-child(4) {
  float: right;
}

.progress--bar > div {
  border: medium none;
  background-color: #FFF;
  background-repeat: repeat-x;
}

.progress--bar > div label {
  float: left;
}

.progress--bar > div div {
  background-color: #B0C83C;
  height: 8px;
}

/**
 * Custom variables
 */

/*
 * @see '../pattern-library/frontend/sass/_layout.scss'
 */

/**
 * Typography related stylesheet.
 *
 * This stylesheet needs to safely apply to CMS editor. Prefix all entries here
 * with .typography class. If the style is not typography-related, it needs to
 * go into another file - for example layout.[s]css
 *
 */

/* base colours */

/* link colours */

/*------------------------------------*\
    #MIXINS
\*------------------------------------*/

/**
 * Custom variables
 */

/*
 * @see '../pattern-library/frontend/sass/_layout.scss'
 */

/*
 * typography
 */

.typography {
  font-family: "Source Sans Pro", "Helvetica Neue", sans-serif;
  /* Media insert formatting  (Youtube embed) */
  /* Fixes media display on iOS */
  /*** Image formatting ***/
  /**
	 * The img tag above fails when the image is inside a table, fix that.
	 */
}

.typography .fileExt {
  font-size: 14px;
  font-size: 0.875rem;
}

.typography .media,
.typography .leftAlone:not(.captionImage):not(img):not(.caption) {
  position: relative;
  padding-bottom: 56.25%;
  width: auto !important;
}

.typography .media.center,
.typography .leftAlone.center {
  margin: 0 auto;
  text-align: center;
}

.typography .media.left,
.typography .leftAlone.left {
  float: left;
  clear: left;
  margin: 0 18px 18px 0px;
}

.typography .media.leftAlone,
.typography .leftAlone {
  margin: 0 18px 18px 0;
  float: none;
  display: block;
  clear: both;
}

.typography .media.right,
.typography .leftAlone.right {
  float: right;
  clear: right;
  margin: 0 0 18px 18px;
}

.typography .media iframe,
.typography .leftAlone iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.typography img {
  max-width: 100%;
  height: auto;
}

.typography img.right {
  float: right;
  clear: right;
  margin: 0 0 18px 18px;
}

.typography img.left {
  float: left;
  clear: left;
  margin: 0 18px 18px 0px;
}

.typography img.leftAlone {
  margin: 0 18px 18px 0;
  float: none;
  display: block;
  clear: both;
}

.typography img.center {
  display: block;
  margin: 0 auto 18px auto;
  clear: both;
}

.typography .tbl-content img {
  max-width: none;
}

.typography .captionImage {
  width: 100%;
  max-width: 100%;
}

.typography .captionImage.left {
  float: left;
  margin: 0 18px 18px 0px;
}

.typography .captionImage.right {
  float: right;
  margin: 0 0 18px 18px;
}

.typography .captionImage.leftAlone {
  float: none;
  margin: 0 18px 18px 0px;
}

.typography .captionImage.center {
  margin: 0 auto 18px;
}

.typography .captionImage p {
  clear: both;
  margin: 8px 0;
  color: #444;
}

.typography .captionImage img {
  margin: 0 0 5px 0;
}

.typography ul {
  padding-left: 1.3rem;
}

.typography ul ul {
  padding-left: 1.1rem;
}

.typography ul ul ul {
  padding-left: 1.1rem;
}

.typography ol {
  list-style-type: decimal;
  padding-left: 1.4rem;
}

.typography ol ol {
  list-style-type: lower-latin;
  padding-left: 1.1rem;
}

.typography ol ol ol {
  list-style-type: lower-roman;
  padding-left: 1.1rem;
}

.typography h2 {
  margin-top: 32px;
  margin-top: 2rem;
}

.typography h2:first-of-type {
  margin-top: 20px;
  margin-top: 1.25rem;
}

.typography .maori {
  background: transparent;
}

.typography textarea {
  resize: vertical;
}

.typography .anchor-links li {
  margin-top: 0px;
}

.typography .shortcode-parser-error {
  padding: 20px;
  padding: 1.25rem;
}

/*
* table headers and abbrs in content
*/

abbr {
  cursor: help;
}

/*
* global bond calculator
*/

tr.middle td {
  vertical-align: middle;
}

/**
 * Title highlight component
 * Provides spacing and underline styles for headings
 * Used in highways section and landing pages
 */

h1.title-highlight,
.lesson-alert .lessonalert-grid .lessonalert-overview h1,
.landing-overview h1,
.highwayreview .highwayreview-grid .highwayreview-overview h1,
.highwayreview .highwayreview-grid .highwayreview-content h1,
h2.title-highlight,
.lesson-alert .lessonalert-grid .lessonalert-overview h2,
.landing-overview h2,
.highwayreview .highwayreview-grid .highwayreview-overview h2,
.highwayreview .highwayreview-grid .highwayreview-content h2,
h3.title-highlight,
.innovation-article .innovationarticle-grid .innovationarticle-overview h3,
.innovation-article .innovationarticle-grid .innovationarticle-content h3,
.lesson-alert .lessonalert-grid .lessonalert-overview h3,
.landing-overview h3,
.highwayreview .highwayreview-grid .highwayreview-overview h3,
.highwayreview .highwayreview-grid .highwayreview-content h3,
h4.title-highlight,
.lesson-alert .lessonalert-grid .lessonalert-overview h4,
.landing-overview h4,
.highwayreview .highwayreview-grid .highwayreview-overview h4,
.highwayreview .highwayreview-grid .highwayreview-content h4 {
  color: #004771;
  margin-top: 1rem;
  margin-bottom: 0rem;
  padding-bottom: 1em;
  position: relative;
}

h1.title-highlight:after,
.lesson-alert .lessonalert-grid .lessonalert-overview h1:after,
.landing-overview h1:after,
.highwayreview .highwayreview-grid .highwayreview-overview h1:after,
.highwayreview .highwayreview-grid .highwayreview-content h1:after,
h2.title-highlight:after,
.lesson-alert .lessonalert-grid .lessonalert-overview h2:after,
.landing-overview h2:after,
.highwayreview .highwayreview-grid .highwayreview-overview h2:after,
.highwayreview .highwayreview-grid .highwayreview-content h2:after,
h3.title-highlight:after,
.innovation-article .innovationarticle-grid .innovationarticle-overview h3:after,
.innovation-article .innovationarticle-grid .innovationarticle-content h3:after,
.lesson-alert .lessonalert-grid .lessonalert-overview h3:after,
.landing-overview h3:after,
.highwayreview .highwayreview-grid .highwayreview-overview h3:after,
.highwayreview .highwayreview-grid .highwayreview-content h3:after,
h4.title-highlight:after,
.lesson-alert .lessonalert-grid .lessonalert-overview h4:after,
.landing-overview h4:after,
.highwayreview .highwayreview-grid .highwayreview-overview h4:after,
.highwayreview .highwayreview-grid .highwayreview-content h4:after {
  background: #0a4671;
  bottom: 1rem;
  content: '';
  display: block;
  height: 2px;
  left: 0;
  position: absolute;
  width: 90px;
}

h1.title-highlight.title-highlight--green,
.lesson-alert .lessonalert-grid .lessonalert-overview h1.title-highlight--green,
.landing-overview h1.title-highlight--green,
.highwayreview .highwayreview-grid .highwayreview-overview h1.title-highlight--green,
.highwayreview .highwayreview-grid .highwayreview-content h1.title-highlight--green,
h2.title-highlight.title-highlight--green,
.lesson-alert .lessonalert-grid .lessonalert-overview h2.title-highlight--green,
.landing-overview h2.title-highlight--green,
.highwayreview .highwayreview-grid .highwayreview-overview h2.title-highlight--green,
.highwayreview .highwayreview-grid .highwayreview-content h2.title-highlight--green,
h3.title-highlight.title-highlight--green,
.innovation-article .innovationarticle-grid .innovationarticle-overview h3.title-highlight--green,
.innovation-article .innovationarticle-grid .innovationarticle-content h3.title-highlight--green,
.lesson-alert .lessonalert-grid .lessonalert-overview h3.title-highlight--green,
.landing-overview h3.title-highlight--green,
.highwayreview .highwayreview-grid .highwayreview-overview h3.title-highlight--green,
.highwayreview .highwayreview-grid .highwayreview-content h3.title-highlight--green,
h4.title-highlight.title-highlight--green,
.lesson-alert .lessonalert-grid .lessonalert-overview h4.title-highlight--green,
.landing-overview h4.title-highlight--green,
.highwayreview .highwayreview-grid .highwayreview-overview h4.title-highlight--green,
.highwayreview .highwayreview-grid .highwayreview-content h4.title-highlight--green {
  color: #6d933e;
}

h1.title-highlight.title-highlight--green:after,
.lesson-alert .lessonalert-grid .lessonalert-overview h1.title-highlight--green:after,
.landing-overview h1.title-highlight--green:after,
.highwayreview .highwayreview-grid .highwayreview-overview h1.title-highlight--green:after,
.highwayreview .highwayreview-grid .highwayreview-content h1.title-highlight--green:after,
h2.title-highlight.title-highlight--green:after,
.lesson-alert .lessonalert-grid .lessonalert-overview h2.title-highlight--green:after,
.landing-overview h2.title-highlight--green:after,
.highwayreview .highwayreview-grid .highwayreview-overview h2.title-highlight--green:after,
.highwayreview .highwayreview-grid .highwayreview-content h2.title-highlight--green:after,
h3.title-highlight.title-highlight--green:after,
.innovation-article .innovationarticle-grid .innovationarticle-overview h3.title-highlight--green:after,
.innovation-article .innovationarticle-grid .innovationarticle-content h3.title-highlight--green:after,
.lesson-alert .lessonalert-grid .lessonalert-overview h3.title-highlight--green:after,
.landing-overview h3.title-highlight--green:after,
.highwayreview .highwayreview-grid .highwayreview-overview h3.title-highlight--green:after,
.highwayreview .highwayreview-grid .highwayreview-content h3.title-highlight--green:after,
h4.title-highlight.title-highlight--green:after,
.lesson-alert .lessonalert-grid .lessonalert-overview h4.title-highlight--green:after,
.landing-overview h4.title-highlight--green:after,
.highwayreview .highwayreview-grid .highwayreview-overview h4.title-highlight--green:after,
.highwayreview .highwayreview-grid .highwayreview-content h4.title-highlight--green:after {
  background-color: #6d933e;
}

h1.title-highlight.title-highlight--orange,
.lesson-alert .lessonalert-grid .lessonalert-overview h1.title-highlight--orange,
.landing-overview h1.title-highlight--orange,
.highwayreview .highwayreview-grid .highwayreview-overview h1.title-highlight--orange,
.highwayreview .highwayreview-grid .highwayreview-content h1.title-highlight--orange,
h2.title-highlight.title-highlight--orange,
.lesson-alert .lessonalert-grid .lessonalert-overview h2.title-highlight--orange,
.landing-overview h2.title-highlight--orange,
.highwayreview .highwayreview-grid .highwayreview-overview h2.title-highlight--orange,
.highwayreview .highwayreview-grid .highwayreview-content h2.title-highlight--orange,
h3.title-highlight.title-highlight--orange,
.innovation-article .innovationarticle-grid .innovationarticle-overview h3.title-highlight--orange,
.innovation-article .innovationarticle-grid .innovationarticle-content h3.title-highlight--orange,
.lesson-alert .lessonalert-grid .lessonalert-overview h3.title-highlight--orange,
.landing-overview h3.title-highlight--orange,
.highwayreview .highwayreview-grid .highwayreview-overview h3.title-highlight--orange,
.highwayreview .highwayreview-grid .highwayreview-content h3.title-highlight--orange,
h4.title-highlight.title-highlight--orange,
.lesson-alert .lessonalert-grid .lessonalert-overview h4.title-highlight--orange,
.landing-overview h4.title-highlight--orange,
.highwayreview .highwayreview-grid .highwayreview-overview h4.title-highlight--orange,
.highwayreview .highwayreview-grid .highwayreview-content h4.title-highlight--orange {
  color: #cf8b2d;
}

h1.title-highlight.title-highlight--orange:after,
.lesson-alert .lessonalert-grid .lessonalert-overview h1.title-highlight--orange:after,
.landing-overview h1.title-highlight--orange:after,
.highwayreview .highwayreview-grid .highwayreview-overview h1.title-highlight--orange:after,
.highwayreview .highwayreview-grid .highwayreview-content h1.title-highlight--orange:after,
h2.title-highlight.title-highlight--orange:after,
.lesson-alert .lessonalert-grid .lessonalert-overview h2.title-highlight--orange:after,
.landing-overview h2.title-highlight--orange:after,
.highwayreview .highwayreview-grid .highwayreview-overview h2.title-highlight--orange:after,
.highwayreview .highwayreview-grid .highwayreview-content h2.title-highlight--orange:after,
h3.title-highlight.title-highlight--orange:after,
.innovation-article .innovationarticle-grid .innovationarticle-overview h3.title-highlight--orange:after,
.innovation-article .innovationarticle-grid .innovationarticle-content h3.title-highlight--orange:after,
.lesson-alert .lessonalert-grid .lessonalert-overview h3.title-highlight--orange:after,
.landing-overview h3.title-highlight--orange:after,
.highwayreview .highwayreview-grid .highwayreview-overview h3.title-highlight--orange:after,
.highwayreview .highwayreview-grid .highwayreview-content h3.title-highlight--orange:after,
h4.title-highlight.title-highlight--orange:after,
.lesson-alert .lessonalert-grid .lessonalert-overview h4.title-highlight--orange:after,
.landing-overview h4.title-highlight--orange:after,
.highwayreview .highwayreview-grid .highwayreview-overview h4.title-highlight--orange:after,
.highwayreview .highwayreview-grid .highwayreview-content h4.title-highlight--orange:after {
  background-color: #cf8b2d;
}

.theme--dark h1.title-highlight,
.theme--dark .lesson-alert .lessonalert-grid .lessonalert-overview h1,
.lesson-alert .lessonalert-grid .lessonalert-overview .theme--dark h1,
.theme--dark .landing-overview h1,
.landing-overview .theme--dark h1,
.theme--dark .highwayreview .highwayreview-grid .highwayreview-overview h1,
.highwayreview .highwayreview-grid .highwayreview-overview .theme--dark h1,
.theme--dark .highwayreview .highwayreview-grid .highwayreview-content h1,
.highwayreview .highwayreview-grid .highwayreview-content .theme--dark h1,
.theme--dark h2.title-highlight,
.theme--dark .lesson-alert .lessonalert-grid .lessonalert-overview h2,
.lesson-alert .lessonalert-grid .lessonalert-overview .theme--dark h2,
.theme--dark .landing-overview h2,
.landing-overview .theme--dark h2,
.theme--dark .highwayreview .highwayreview-grid .highwayreview-overview h2,
.highwayreview .highwayreview-grid .highwayreview-overview .theme--dark h2,
.theme--dark .highwayreview .highwayreview-grid .highwayreview-content h2,
.highwayreview .highwayreview-grid .highwayreview-content .theme--dark h2,
.theme--dark h3.title-highlight,
.theme--dark .innovation-article .innovationarticle-grid .innovationarticle-overview h3,
.innovation-article .innovationarticle-grid .innovationarticle-overview .theme--dark h3,
.theme--dark .innovation-article .innovationarticle-grid .innovationarticle-content h3,
.innovation-article .innovationarticle-grid .innovationarticle-content .theme--dark h3,
.theme--dark .lesson-alert .lessonalert-grid .lessonalert-overview h3,
.lesson-alert .lessonalert-grid .lessonalert-overview .theme--dark h3,
.theme--dark .landing-overview h3,
.landing-overview .theme--dark h3,
.theme--dark .highwayreview .highwayreview-grid .highwayreview-overview h3,
.highwayreview .highwayreview-grid .highwayreview-overview .theme--dark h3,
.theme--dark .highwayreview .highwayreview-grid .highwayreview-content h3,
.highwayreview .highwayreview-grid .highwayreview-content .theme--dark h3,
.theme--dark h4.title-highlight,
.theme--dark .lesson-alert .lessonalert-grid .lessonalert-overview h4,
.lesson-alert .lessonalert-grid .lessonalert-overview .theme--dark h4,
.theme--dark .landing-overview h4,
.landing-overview .theme--dark h4,
.theme--dark .highwayreview .highwayreview-grid .highwayreview-overview h4,
.highwayreview .highwayreview-grid .highwayreview-overview .theme--dark h4,
.theme--dark .highwayreview .highwayreview-grid .highwayreview-content h4,
.highwayreview .highwayreview-grid .highwayreview-content .theme--dark h4 {
  color: #fff;
}

.theme--dark h1.title-highlight:after,
.theme--dark .lesson-alert .lessonalert-grid .lessonalert-overview h1:after,
.lesson-alert .lessonalert-grid .lessonalert-overview .theme--dark h1:after,
.theme--dark .landing-overview h1:after,
.landing-overview .theme--dark h1:after,
.theme--dark .highwayreview .highwayreview-grid .highwayreview-overview h1:after,
.highwayreview .highwayreview-grid .highwayreview-overview .theme--dark h1:after,
.theme--dark .highwayreview .highwayreview-grid .highwayreview-content h1:after,
.highwayreview .highwayreview-grid .highwayreview-content .theme--dark h1:after,
.theme--dark h2.title-highlight:after,
.theme--dark .lesson-alert .lessonalert-grid .lessonalert-overview h2:after,
.lesson-alert .lessonalert-grid .lessonalert-overview .theme--dark h2:after,
.theme--dark .landing-overview h2:after,
.landing-overview .theme--dark h2:after,
.theme--dark .highwayreview .highwayreview-grid .highwayreview-overview h2:after,
.highwayreview .highwayreview-grid .highwayreview-overview .theme--dark h2:after,
.theme--dark .highwayreview .highwayreview-grid .highwayreview-content h2:after,
.highwayreview .highwayreview-grid .highwayreview-content .theme--dark h2:after,
.theme--dark h3.title-highlight:after,
.theme--dark .innovation-article .innovationarticle-grid .innovationarticle-overview h3:after,
.innovation-article .innovationarticle-grid .innovationarticle-overview .theme--dark h3:after,
.theme--dark .innovation-article .innovationarticle-grid .innovationarticle-content h3:after,
.innovation-article .innovationarticle-grid .innovationarticle-content .theme--dark h3:after,
.theme--dark .lesson-alert .lessonalert-grid .lessonalert-overview h3:after,
.lesson-alert .lessonalert-grid .lessonalert-overview .theme--dark h3:after,
.theme--dark .landing-overview h3:after,
.landing-overview .theme--dark h3:after,
.theme--dark .highwayreview .highwayreview-grid .highwayreview-overview h3:after,
.highwayreview .highwayreview-grid .highwayreview-overview .theme--dark h3:after,
.theme--dark .highwayreview .highwayreview-grid .highwayreview-content h3:after,
.highwayreview .highwayreview-grid .highwayreview-content .theme--dark h3:after,
.theme--dark h4.title-highlight:after,
.theme--dark .lesson-alert .lessonalert-grid .lessonalert-overview h4:after,
.lesson-alert .lessonalert-grid .lessonalert-overview .theme--dark h4:after,
.theme--dark .landing-overview h4:after,
.landing-overview .theme--dark h4:after,
.theme--dark .highwayreview .highwayreview-grid .highwayreview-overview h4:after,
.highwayreview .highwayreview-grid .highwayreview-overview .theme--dark h4:after,
.theme--dark .highwayreview .highwayreview-grid .highwayreview-content h4:after,
.highwayreview .highwayreview-grid .highwayreview-content .theme--dark h4:after {
  background: #fff;
}

h2.title-highlight,
.lesson-alert .lessonalert-grid .lessonalert-overview h2,
.landing-overview h2,
.highwayreview .highwayreview-grid .highwayreview-overview h2,
.highwayreview .highwayreview-grid .highwayreview-content h2 {
  font-size: 2em;
}

h3.title-highlight,
.innovation-article .innovationarticle-grid .innovationarticle-overview h3,
.innovation-article .innovationarticle-grid .innovationarticle-content h3,
.lesson-alert .lessonalert-grid .lessonalert-overview h3,
.landing-overview h3,
.highwayreview .highwayreview-grid .highwayreview-overview h3,
.highwayreview .highwayreview-grid .highwayreview-content h3,
h4.title-highlight,
.lesson-alert .lessonalert-grid .lessonalert-overview h4,
.landing-overview h4,
.highwayreview .highwayreview-grid .highwayreview-overview h4,
.highwayreview .highwayreview-grid .highwayreview-content h4 {
  font-size: 1.1em;
  padding-bottom: 2rem;
}

.title-label {
  color: #fff;
  padding: 10px 15px;
  font-size: 14px;
  font-weight: bold;
  width: 200px;
  margin-bottom: 0;
}

.title-label span {
  vertical-align: middle;
  line-height: 1;
}

.title-label.title-label--green {
  background-color: #afbd22;
}

.title-label.title-label--blue {
  background-color: #005485;
}

.title-label__icon {
  color: #fff;
  font-size: 24px;
  margin-right: 12px;
  -webkit-background-size: contain;
  background-size: contain;
}

.title-label__icon.i-file-tick-white {
  margin-right: 6px;
}

.color-blue-dark {
  color: #00456B;
}

/**
 * Layout Helpers module
 *
 * This contains a bunch of classes that are used as "helpers" for common layout styles
 */

.section.section--bottom-only,
.section-m.section--bottom-only,
.section-s.section--bottom-only {
  padding-top: 0;
}

.section.section--top-only,
.section-m.section--top-only,
.section-s.section--top-only {
  padding-bottom: 0;
}

.spacing {
  margin-bottom: 10px;
  margin-top: 10px;
}

.spacing.spacing--tight {
  margin-bottom: 5px;
  margin-top: 5px;
}

.spacing.spacing--none {
  margin-bottom: 0;
  margin-top: 0;
}

.spacing.spacing--bottom-only {
  margin-top: 0;
}

.spacing.spacing--top-only {
  margin-bottom: 0;
}

.col-gutters {
  padding-left: 1em;
  padding-right: 1em;
}

/*
 * A scroll wrapper for large content, such as tables
 */

.content-overflow {
  overflow-x: auto;
  display: block;
  border: 1px solid #ddd;
  margin-bottom: 20px;
  margin-bottom: 1.25rem;
}

/*
 * Accessibility
 */

.print-only {
  display: none;
}

/*
* icons have display set which takes precedence on print only so include it here
*/

.i.print-only {
  display: none;
}

.no-print {
  display: initial;
}

/*
 * Restrict the pattern-library focus style to relevant items
 */

*:focus {
  outline: none;
}

input:focus,
button:focus,
.btn:focus,
.nav-pill:focus {
  outline: solid 3px #ff5c00;
}

/*
 * grey for disabled navigation links and icons
 */

a.beta-disabled {
  color: #9aa4aa;
  cursor: pointer;
}

a.beta-disabled:hover,
a.beta-disabled:active {
  color: #9aa4aa;
  cursor: default;
}

a.beta-disabled:focus {
  outline: none;
}

a.action--disabled:hover,
a.action--disabled:active {
  cursor: default;
}

a.action--disabled:focus {
  outline: none;
}

a.action--disabled .action__icon {
  background-color: #9aa4aa;
}

a.action--disabled span {
  color: #9aa4aa;
}

/**
 * Custom styles for the header section
 */

.sitewide-banner {
  padding-top: 1rem;
  position: relative;
  z-index: 11;
}

.header__logo.header__logo--branding {
  display: inline-block;
  margin-top: 2px;
  vertical-align: top;
}

@media (max-width: 767px) {
  .header__logo.header__logo--branding {
    display: none;
  }
}

/*
 * Home banner link text color
 */

.home__message a {
  color: inherit;
}

.i-nzta-logo,
.site-title {
  float: left;
}

.header-right-wrap {
  text-align: right;
  float: right;
  width: 80%;
}

.site-title {
  padding-left: 0px;
  margin-left: 3px;
  font-size: 1.2em;
}

.social-media-wrapper,
.search-form-wrapper {
  clear: both;
}

.search-form-wrapper .search-container {
  width: 100%;
}

@media (max-width: 767px) {
  .site-title {
    border-left: 0;
  }
}

a.header__sitename {
  background-color: #fff;
  border-top-right-radius: 60px;
  color: #00456B;
  font-size: 21px;
  font-weight: 700;
  line-height: 30px;
  margin-left: -13px;
  margin-top: 14px;
  overflow: hidden;
  padding: 0.08em 30px 0.08em 40px;
  position: relative;
  text-align: center;
  text-decoration: none;
  z-index: -1;
}

a.header__sitename:before {
  background-color: #005485;
  border-radius: 60px;
  content: "";
  height: 61px;
  left: -30px;
  position: absolute;
  top: -30px;
  width: 61px;
}

a.header__sitename:hover {
  text-decoration: none;
  color: #00658f;
}

@media only screen and (max-width: 59.99em) {
  a.header__sitename {
    display: none;
  }
}

.header__sitename--mobile {
  display: none;
  color: #fff;
  font-size: 21px;
  font-weight: 700;
  line-height: 30px;
}

@media only screen and (max-width: 59.99em) {
  .header__sitename--mobile {
    display: block;
    padding: 0.5em 0 0 0;
    font-weight: bold;
    border-top: 1px solid #00658f;
    width: 100%;
    margin-top: 1em;
  }
}

/*
 * Footer social svg icons hover effect
 */

.footer_social-links .i {
  width: 22px;
  height: 22px;
}

/*
 * Privacy Policy footer link - uses 'Resources' icon
 */

.footer {
  /**
	 * Landing Page specific branding styles
	 */
}

.footer .footer--privacy .i-resources {
  font-size: 1.8rem;
}

.footer.footer--zeroharm {
  text-align: center;
}

.footer.footer--innovation,
.footer.footer--cycle {
  background-color: #002d4d;
  background-image: url(../images/innovation-footer-background.png);
  -webkit-background-size: auto 100%;
  background-size: auto 100%;
  background-repeat: no-repeat;
  background-position: center;
  margin-top: 2rem;
}

.footer.footer--innovation .btn,
.footer.footer--cycle .btn {
  margin-bottom: 0;
}

.footer.footer--innovation .btn .i,
.footer.footer--cycle .btn .i {
  position: relative;
  top: -2px;
  margin-right: 0.5em;
}

.footer.footer--innovation p:last-child,
.footer.footer--cycle p:last-child {
  margin-bottom: 0;
}

.footer.footer--cycle {
  margin-top: 0;
}

.feedback-tab {
  position: fixed;
  z-index: 18;
  top: 46%;
  right: 0;
  padding: 0.7rem 1rem;
  border: 1px solid #ccc;
  border-bottom: solid 0rem #bbca0c;
  border-top-left-radius: 0.6rem;
  border-top-right-radius: 0.6rem;
  background-color: rgba(35, 111, 166, 0.6);
  font-size: 1rem;
  text-decoration: none;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
  -webkit-transform: rotate(-90deg) translate3d(0, -100%, 0);
  -moz-transform: rotate(-90deg) translate3d(0, -100%, 0);
  transform: rotate(-90deg) translate3d(0, -100%, 0);
  -webkit-transform-origin: right top;
  -moz-transform-origin: right top;
  -ms-transform-origin: right top;
  transform-origin: right top;
}

.footer-privacy {
  margin-right: 1em;
}

/**
 * Search specific styles
 */

/*
 * Creative Commons License - see: CreativeCommons.ss
 */

/*
 * site search
 */

.site-search-container {
  position: relative;
}

.site-search__button {
  position: absolute;
  top: 1.5em;
  left: 1.5em;
}

.site-search__input {
  padding-left: 2.5em;
}

.search-sort .search-sort--title {
  display: inline-block;
  margin-right: 20px;
  margin-right: 1.25rem;
}

.search-sort .btn {
  margin-left: 0px;
}

.search-licence .search-licence__cc a {
  line-height: 2.5;
}

.search-licence .search-licence__cc .i {
  width: 20px;
  height: 20px;
}

.search__sort {
  margin-bottom: 1em;
  margin-top: 15px;
  line-height: 31.2px;
}

@media only screen and (min-width: 60em) {
  .search__sort {
    margin-bottom: 0;
    margin-top: 0;
    text-align: right;
  }
}

/*
 * dropdown filters - e.g. highway projects list, resources search
 */

.search__filters .field__label {
  display: none;
}

.search__filters .filter--prompt {
  margin-bottom: 0;
  line-height: 2.8;
}

/*
 * results
 */

.search__results-count,
.search__section-filter {
  margin-bottom: 0;
}

.search__results-query {
  line-height: 1.3;
  margin-bottom: 10px;
}

.search__results-query span {
  font-weight: 300;
}

.search__results-set {
  margin-top: 20px;
  margin-top: 1.25rem;
  margin-bottom: 32px;
  margin-bottom: 2rem;
}

.search__results-set-heading {
  padding-top: 20px;
  padding-top: 1.25rem;
  font-size: 21px;
  font-size: 1.3125rem;
}

.search__results-items li {
  margin-bottom: 20px;
  margin-bottom: 1.25rem;
}

.search__results-items h5 {
  margin-bottom: 2px;
  margin-bottom: 0.125rem;
  margin-top: 0;
  padding: 0;
}

.search__results-items p {
  margin-bottom: 4px;
  margin-bottom: 0.25rem;
  margin-top: 0;
  padding: 0;
}

.search__results-items p:last-child {
  margin-bottom: 0;
}

.search__results-set-actions .action:first-child {
  padding-top: 0;
}

/*
* hide the x that IE10< displays when you type in the search input
*/

.global-nav .search__input::-ms-clear {
  display: none;
}

.feedbackmap-list__list {
  margin: 1rem;
}

.feedback-list {
  overflow-x: hidden;
  overflow-y: auto;
  color: #555;
}

.small-screen .feedback-list {
  height: 100% !important;
}

.feedback-list.feedback-list--one-col {
  height: 100% !important;
}

span.text-float-right {
  float: right;
}

/*
 * Media releases
 */

.news {
  position: relative;
}

.news.news--landing {
  padding-bottom: 3em;
}

.news.news--landing .news__title-link,
.news.news--landing .typography a {
  text-decoration: none;
  border-bottom: 1px solid #fff;
}

.news.news--landing .news__title-link:hover,
.news.news--landing .typography a:hover {
  border-bottom-color: transparent;
}

.news.news--landing .news__meta {
  font-size: 12px;
  font-size: 0.75rem;
  font-weight: 300;
}

.news.news--spaced {
  margin-bottom: 32px;
  margin-bottom: 2rem;
}

.news .link-complex:focus {
  outline: none;
}

.news .news__image {
  padding: 20px;
  padding: 1.25rem;
  float: left;
  padding-left: 0;
  padding-top: 7px;
  /* to top-align the image with the h3 */
}

.news .news__image img {
  width: 100%;
  height: auto;
}

.news .news__title-link {
  margin-bottom: 8px;
  margin-bottom: 0.5rem;
}

.news .news__meta {
  clear: left;
}

.news .news__meta time + .news__meta-types span:before {
  content: '|';
  color: #555;
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}

.news .news__meta .news__meta-types {
  display: inline;
}

.news .news__meta .news__meta-types span:after {
  content: '|';
  color: #555;
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}

.news .news__meta .news__meta-types span:last-child:after {
  display: none;
}

.news .news__summary {
  clear: left;
}

.news .news__contact {
  border-radius: 0.25em;
  padding: 12px;
  padding: 0.75rem;
  margin-top: 32px;
  margin-top: 2rem;
  margin-bottom: 32px;
  margin-bottom: 2rem;
}

.news .news__contact p:last-child {
  margin-bottom: 0;
}

.news .news__footer {
  font-size: 14px;
  font-size: 0.875rem;
}

.news .news__more {
  font-size: 14px;
  font-size: 0.875rem;
  bottom: 1em;
  position: absolute;
  right: 1em;
}

.news_tags-list {
  margin-bottom: 40px;
}

/*
 * News page summary
 */

.typography.media-release-summary {
  font-size: 1.1em;
  margin-bottom: 20px;
  margin-bottom: 1.25rem;
}

/*
 * Resources and publications
 */

/*
 * content mixins
 */

.publication .publication__summary,
.publication .publication__details,
.publication .publication__order-details,
.publication .publication__sections {
  padding: 28px;
  padding: 1.75rem;
  border: 1px solid #ddd;
}

.publication .publication__heading {
  margin-top: 0;
}

.publication .publication__heading:before,
.publication .publication__heading:after {
  display: none;
}

.publication .publication__sort {
  text-align: right;
}

.publication .publication__details .publication__filters {
  padding: 28px;
  padding: 1.75rem;
  background-color: #ddd;
}

.publication .publication__summary.publication__summary--details {
  border: none;
  background-color: #F2F4F7;
}

.publication .publication__summary .publication__summary--image {
  height: auto;
}

@media only screen and (max-width: 40em) {
  .publication .publication__summary .publication__summary--image {
    margin-top: 28px;
    margin-top: 1.75rem;
    width: 100%;
  }
}

.publication .publication__summary .term-separator {
  padding-left: 4px;
  padding-left: 0.25rem;
  padding-right: 4px;
  padding-right: 0.25rem;
  color: #555;
}

.publication .publication__summary .term-comma {
  padding-right: 1px;
  padding-right: 0.0625rem;
  color: #555;
}

.publication .publication__order-details {
  border: none;
  background-color: #F2F4F7;
}

.publication .publication__order-details a {
  display: block;
}

.publication .publication__sections .file-meta {
  font-size: 90%;
  color: #555;
}

.publication .publication__sections .publication__sections--link .i {
  vertical-align: baseline;
}

/*
 * Publication List Page / Subscribe to updates / content field
 */

.nltp__form {
  margin-bottom: 32px;
  margin-bottom: 2rem;
}

.nltp__form .nltp__summary {
  position: absolute;
  right: 13px;
}

@media only screen and (max-width: 40em) {
  .nltp__form .nltp__summary {
    position: relative;
    display: block;
    right: 0;
  }
}

.nltp__form .nltp__form_filter {
  margin-bottom: 32px;
  margin-bottom: 2rem;
}

.nltp__form .nltp__form_filter .field__heading {
  margin: .5em 0;
}

.nltp__form .nltp__form_filter .field__label {
  padding-left: 18px;
}

.nltp__form .nltp__form_filter .field__label input[type="checkbox"] {
  margin-left: -18px;
}

.nltp__form .nltp__form_filter .nltp__form_header {
  padding-left: 0;
  margin: .5em 0;
}

.nltp__form .nltp__form_filter li {
  margin-top: 3px;
}

.nltp__form .nltp__regions li ul {
  margin: 0 0 .5em 1.5em;
  padding-top: 0;
}

.nltp__form .nltp__regions .global__checkbox-group_showhide {
  color: #00456B;
}

.nltp__form .nltp__regions .global__checkbox-group_showhide:hover {
  color: #555;
}

.nltp__form .nltp__form_options {
  margin-bottom: 16px;
  margin-bottom: 1rem;
}

.nltp__form .nltp__form_actions .btn--submit:disabled {
  background-color: #e5e5e5;
}

.nltp__form .nltp__form_actions .btn--submit:disabled:hover {
  cursor: not-allowed;
}

.nltp__form .toggle-item.toggle--active {
  display: none;
}

.nltp__form_summary {
  margin-bottom: 16px;
  margin-bottom: 1rem;
  border-radius: 4px;
  background-color: #ddd;
}

.nltp__form_summary:hover {
  background-color: #e5e5e5;
}

.nltp__form_summary a {
  padding: 14px;
  padding: 0.875rem;
  color: #555;
  display: block;
  position: relative;
}

.nltp__form_summary a:hover {
  color: #555;
}

table.nltp__report {
  border-color: #ccc;
  background-color: #fff;
}

table.nltp__report th,
table.nltp__report td {
  border-color: #ddd;
  padding: 10px;
  padding: 0.625rem;
}

@media only screen and (max-width: 59.99em) {
  table.nltp__report th,
  table.nltp__report td {
    padding: 5px;
    padding: 0.3125rem;
  }
}

table.nltp__report thead th {
  font-size: 14px;
  font-size: 0.875rem;
  border-color: #ccc;
}

table.nltp__report thead th:first-child {
  border-left: 1px solid #ccc;
}

table.nltp__report tbody tr td {
  color: #555;
}

table.nltp__report tbody abbr {
  border-bottom-color: #d1d1d1;
}

table.nltp__report tfoot tr td {
  font-weight: normal;
}

table.nltp__report .nltp__report_row--header {
  background-color: #d5e5ee !important;
  font-size: 14px;
  font-size: 0.875rem;
}

table.nltp__report .nltp__report_row--header span {
  color: #555;
  padding: 0 .125em;
}

table.nltp__report .nltp__report_row td,
table.nltp__report .nltp__report_row th,
table.nltp__report tbody td,
table.nltp__report tbody th,
table.nltp__report tfoot td,
table.nltp__report tfoot th {
  font-size: 14px;
  font-size: 0.875rem;
}

table.nltp__report .nltp__report_row.nltp__report_row--total td,
table.nltp__report .nltp__report_row.nltp__report_row--subtotal td {
  font-style: italic;
}

table.nltp__report .nltp__report_row.nltp__report_row--total {
  border-bottom: 4px solid #ccc;
}

table.nltp__report .nltp__report_row.nltp__report_row--total td {
  border-bottom-width: 2px;
}

table.nltp__report .nltp__report_row.nltp__report_row--subtotal {
  border-top: 2px solid #ccc;
  border-bottom: 2px solid #ccc;
}

table.nltp__report .td--numeric,
table.nltp__report .td--currency {
  text-align: right;
}

.nltp__report_key {
  margin: 2em 0;
}

.nltp__report_key dd,
.nltp__report_key dt {
  font-size: 14px;
  font-size: 0.875rem;
  text-align: left;
}

.nltp__report_meta span {
  color: #ddd;
  margin: 0 .5em;
}

/*
 * Service Providers Table
 */

.typography .serviceproviders {
  /*
	* NZ map on child restriction technitian finder
	*/
}

.typography .serviceproviders h3 a .i-arrow-r {
  width: .6em;
  height: .6em;
}

.typography .serviceproviders th,
.typography .serviceproviders td {
  border-bottom: 1px solid #ddd;
}

@media only screen and (max-width: 40em) {
  .typography .serviceproviders th,
  .typography .serviceproviders td {
    border: none;
  }
}

.typography .serviceproviders tbody td {
  font-size: 14px;
  font-size: 0.875rem;
  padding: 12px;
  padding: 0.75rem;
}

.typography .serviceproviders tr.even {
  background: #fafafa;
  border: 1px solid #ccc;
}

.typography .serviceproviders tr.odd {
  background: #fff;
}

.typography .serviceproviders h4 {
  font-size: 16px;
  font-size: 1rem;
  margin: 0;
  padding: 0 0 .5em 0;
  line-height: 1.4;
  font-weight: normal;
  color: #00456B;
}

.typography .serviceproviders h4 strong {
  font-weight: bold;
}

.typography .serviceproviders address,
.typography .serviceproviders p {
  margin: 0;
  line-height: 1.2rem;
}

.typography .serviceproviders address {
  margin-bottom: 8px;
  margin-bottom: 0.5rem;
  font-size: 14px;
  font-size: 0.875rem;
  padding: 0;
  font-style: normal;
  line-height: 1.1rem;
}

.typography .serviceproviders .filter--prompt {
  line-height: 2.8;
}

.typography .serviceproviders .color-buttons {
  margin-bottom: 28px;
  margin-bottom: 1.75rem;
}

.typography .serviceproviders .color-buttons .pill {
  color: #fff;
}

@media only screen and (max-width: 40em) {
  .typography .serviceproviders table.serviceproviders__table {
    border: 1px solid #ccc;
    border-top: none;
  }

  .typography .serviceproviders table.serviceproviders__table td {
    margin-bottom: 0;
    margin-top: 0;
    border-top: 1px solid #ccc;
  }
}

.typography .serviceproviders .serviceproviders__contacts {
  margin-bottom: 12px;
  margin-bottom: 0.75rem;
  font-size: 12px;
  font-size: 0.75rem;
}

.typography .serviceproviders .serviceproviders__contacts a.tel {
  color: #555;
}

.typography .serviceproviders .serviceproviders__contacts .term-separator {
  color: #ddd;
}

.typography .serviceproviders .serviceproviders__contacts .term-separator:first-child {
  display: none;
}

.typography .serviceproviders .serviceproviders__key dd,
.typography .serviceproviders .serviceproviders__key dt {
  font-size: 14px;
  font-size: 0.875rem;
}

.typography .serviceproviders .crumb {
  color: #aaa;
  margin: 0 .25em;
}

.typography .serviceproviders .serviceproviders__courses_list.serviceproviders__courses_list--onlymobile {
  display: none;
}

@media only screen and (max-width: 40em) {
  .typography .serviceproviders .serviceproviders__courses_list.serviceproviders__courses_list--onlymobile {
    display: block;
  }
}

.typography .serviceproviders .serviceproviders__courses_list.nav {
  padding-left: 0;
  margin-bottom: 0;
}

.typography .serviceproviders .serviceproviders__courses_list.nav .pill--lightgrey {
  background-color: #eaeaea;
  color: inherit;
}

@media only screen and (max-width: 40em) {
  .typography .serviceproviders .serviceproviders__hide-mobile {
    display: none;
  }
}

.typography .serviceproviders .serviceproviders__role {
  font-weight: 400;
  font-size: .85rem;
  color: #00456B;
}

.typography .serviceproviders #service-providers-map {
  height: 350px;
  width: 490px;
  background-color: white;
}

@media only screen and (max-width: 40em) {
  .typography .serviceproviders #serviceprovider-nzmap-wrapper {
    display: none;
  }
}

/**
 * Toll Roads
 *
 * Table of contents:
 * 1. Toll Road Decision page
 * 2. Toll Road Info shortcode
 */

/*
 * 1. Toll Road Decision page
 */

.toll-roads .toll-roads__questions {
  position: relative;
  padding-top: 24px;
  padding-top: 1.5rem;
  padding-bottom: 24px;
  padding-bottom: 1.5rem;
  margin-top: 48px;
  margin-top: 3rem;
  margin-bottom: 32px;
  margin-bottom: 2rem;
}

.toll-roads .toll-roads__questions:before {
  height: 2px;
  display: block;
  width: 22.5%;
  background: rgba(37, 117, 174, 0.5);
  content: '';
  position: absolute;
  top: 0;
  left: 0;
}

.toll-roads .toll-roads__questions:after {
  display: block;
  content: '';
  background: rgba(37, 117, 174, 0.25);
  height: 1px;
  width: 72.5%;
  top: 0;
  right: 0;
  position: absolute;
}

.toll-roads .toll-roads__questions .field--radio-button-group {
  display: none;
}

.toll-roads .toll-roads__questions ul.segmented-control {
  height: 100%;
}

.toll-roads .toll-roads__questions ul.segmented-control li {
  height: 100%;
  padding-left: 0;
  padding-right: 0;
}

.toll-roads .toll-roads__questions ul.segmented-control li input,
.toll-roads .toll-roads__questions ul.segmented-control li label {
  height: 100%;
}

.toll-roads .toll-roads__questions ul.segmented-control > li:first-child {
  border-top-left-radius: 0.25rem;
  border-bottom-left-radius: 0.25rem;
}

@media only screen and (max-width: 40em) {
  .toll-roads .toll-roads__questions ul.segmented-control > li:first-child {
    border-bottom-left-radius: 0;
    border-top-right-radius: 0.25rem;
  }
}

.toll-roads .toll-roads__questions ul.segmented-control > li:last-child {
  border-top-right-radius: 0.25rem;
  border-bottom-right-radius: 0.25rem;
}

@media only screen and (max-width: 40em) {
  .toll-roads .toll-roads__questions ul.segmented-control > li:last-child {
    border-top-right-radius: 0;
    border-bottom-left-radius: 0.25rem;
  }
}

.toll-roads .toll-roads__answer {
  margin-top: 48px;
  margin-top: 3rem;
  display: none;
}

.toll-roads .toll-roads__answer .answer--item {
  padding: 20px;
  padding: 1.25rem;
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
  padding-bottom: 0;
}

@media only screen and (max-width: 40em) {
  .toll-roads .toll-roads__answer .answer--item {
    padding-bottom: 20px;
    padding-bottom: 1.25rem;
  }
}

.toll-roads .toll-roads__answer #payment-option {
  font-weight: bold;
}

.toll-roads .toll-roads__answer div {
  display: none;
}

/*
* 2. Toll Road Info shortcode
*
* {@link TollRoadInfoShortcode.php}
* {@link TollRoadInfoShortcode.ss}
*/

.toll-road-info .toll-road-info__item {
  /* override the default column behaviour that forces full-width for small breakpoint to keep them one-third width */
  border-left: 1px solid #ccc;
}

@media only screen and (max-width: 40em) {
  .toll-road-info .toll-road-info__item {
    width: 33.3333%;
  }
}

.toll-road-info .toll-road-info__item span {
  font-size: 14px;
  font-size: 0.875rem;
  padding-top: 8px;
  padding-top: 0.5rem;
  padding-bottom: 8px;
  padding-bottom: 0.5rem;
  display: inline;
  font-weight: bold;
}

.toll-road-info .toll-road-info__item span sup {
  display: block;
  line-height: 1em;
  font-weight: normal;
  margin-top: 1em;
}

.toll-road-info .toll-road-info__item.first {
  border-left: 0;
}

.toll-road-info .toll-road-info__heading,
.toll-road-info .toll-road-info__summary,
.toll-road-info .toll-road-info__item span,
.toll-road-info .toll-road-info__caveats {
  color: #236FA6;
}

.toll-road-info .toll-road-info__heading,
.toll-road-info .toll-road-info__summary {
  font-size: 14px;
  font-size: 0.875rem;
  margin-bottom: 12px;
  margin-bottom: 0.75rem;
}

.toll-road-info .toll-road-info__caveats {
  font-size: 14px;
  font-size: 0.875rem;
  margin-top: 8px;
  margin-top: 0.5rem;
  color: #236FA6;
  text-align: right;
}

@media only screen and (min-width: 60em) {
  .toll-road-info .i--large-valign-bottom {
    vertical-align: bottom;
  }
}

/**
 * Content Blocks
 *
 * 0. Core style modifiers
 * 1. Block defaults
 * 2. List blocks
 * 3. Download blocks
 * 4. Gallery blocks
 * 5. Circle Headline blocks
 * 6. Two & Three Column blocks
 * 7. Block borders
 */

/*
* 0. Core style modifiers
*/

/*
* section modifier to remove the bottom box shadow and bottom padding
*/

.section--seamless-bottom-edge {
  -webkit-box-shadow: 0 -2px 2px 0 rgba(0, 0, 0, 0.2);
  -ms-box-shadow: 0 -2px 2px 0 rgba(0, 0, 0, 0.2);
  -o-box-shadow: 0 -2px 2px 0 rgba(0, 0, 0, 0.2);
  box-shadow: 0 -2px 2px 0 rgba(0, 0, 0, 0.2);
  padding-bottom: 0;
}

/*
* .block-section modifies the default section class to reduce padding vertically
* for Blocks in AboutPage as they are fluid to the wrapper edges,
* unlike blocks in all other pages which are contained in a medium-7 column.
*/

.block-section.block-section--thin {
  padding-top: 0;
  padding-bottom: 0;
}

.block-section.block-section--slim-down {
  padding-bottom: 20px;
  padding-bottom: 1.25rem;
}

.block-section.block-section--slim-up {
  padding-top: 20px;
  padding-top: 1.25rem;
}

.block-section .block {
  padding-top: 0;
  padding-bottom: 0;
}

/*
* 1. Block defaults
*/

.block {
  padding-top: 28px;
  padding-top: 1.75rem;
  padding-bottom: 28px;
  padding-bottom: 1.75rem;
}

.block.block--no-pad {
  padding: 0;
}

.block .block__header {
  margin-top: 0;
  color: #236FA6;
}

.block .block__header.block__header--no-border {
  padding-top: 0;
}

.block .block__header.block__header--no-border:before,
.block .block__header.block__header--no-border:after {
  width: 0;
  background: none;
}

.block .block__header--gray {
  color: #555;
}

.block .block__subheader {
  margin-top: 12px;
  margin-top: 0.75rem;
  color: #236FA6;
}

.block .block__content {
  padding-bottom: 28px;
  padding-bottom: 1.75rem;
  padding-top: 28px;
  padding-top: 1.75rem;
}

.block .block__content img {
  width: 100%;
  height: auto;
}

.block .grid--fluid {
  margin-left: 0;
  margin-right: 0;
}

.block .grid--fluid .col {
  padding-left: 0;
  padding-right: 0;
}

/*
* 2. List Blocks
*/

.block-list .block__content {
  padding-bottom: 0;
  /**
         * We must add counters layer by layer because of invalid
         * HTML generated by the WYSIWYG editor for nested lists.
         * (UL->UL rather than UL->LI->UL)
         */
}

.block-list .block__content ol > li {
  padding-left: 48px;
  padding-left: 3rem;
  margin-bottom: 20px;
  margin-bottom: 1.25rem;
  position: relative;
}

@media only screen and (max-width: 40em) {
  .block-list .block__content ol > li {
    padding-left: 32px;
    padding-left: 2rem;
    margin-bottom: 16px;
    margin-bottom: 1rem;
  }
}

.block-list .block__content ol > li:before {
  left: 0;
  border: 1px solid #236FA6;
  border-radius: 50%;
  color: #236FA6;
  height: 1.4em;
  line-height: 1.3em;
  position: absolute;
  text-align: center;
  width: 1.4em;
}

.block-list .block__content > ol {
  counter-reset: li-firstlevel;
}

.block-list .block__content > ol > li:before {
  content: counter(li-firstlevel);
  counter-increment: li-firstlevel;
}

.block-list .block__content > ol > ol {
  margin-top: 0;
  margin-bottom: 1.2em;
  counter-reset: li-secondlevel;
}

.block-list .block__content > ol > ol > li:before {
  border-style: dashed;
  content: counter(li-secondlevel);
  counter-increment: li-secondlevel;
}

/*
* 3. Download Blocks
*/

.block-download h2.block__header {
  margin-top: 0;
}

/*
 * 4. Gallery Blocks
 *
 * Also used by the Highway Projects, gallery grid on the project overview page
 * {@link _highways.scss} {@link ProjectGallery.ss}
 */

.block-gallery {
  padding-top: 0;
  padding-bottom: 0;
}

.block-gallery .block-gallery__header h2 {
  margin-top: 0;
  padding-top: 0;
}

.block-gallery .block-gallery__header .block__content {
  padding-top: 0;
  padding-bottom: 0;
}

.block-gallery .block-gallery__footer .block__content {
  padding-top: 0;
  padding-bottom: 0;
}

.block-gallery .grid.grid--gallery,
.block-gallery .grid.grid--gallery__image {
  margin-left: 0;
  margin-right: 0;
}

.block-gallery .block-gallery__images .col.grid--gallery__image--large {
  padding-left: 0;
  padding-right: 0;
}

.block-gallery .block-gallery__images .col.grid--gallery-right {
  padding-left: 0;
  padding-right: 0;
}

.block-gallery .block-gallery__images .col.grid--gallery-right .grid {
  margin-left: 0;
  margin-right: 0;
}

.block-gallery .block-gallery__images .col.grid--gallery-right .col.grid--gallery__image--small {
  padding-left: 0;
  padding-right: 0;
}

.block-gallery .grid--gallery__image a,
.block-gallery .grid--gallery__image div {
  -webkit-background-size: cover;
  background-size: cover;
  background-position: 50% 50%;
  height: 0;
  padding-bottom: 66%;
  display: block;
  margin: .5px;
}

.block-gallery .grid--gallery__link {
  display: block;
  margin: 1rem 2rem;
}

.block-gallery .grid--gallery__link i {
  color: #fff;
}

.block-gallery .gallery-video-wrapper {
  position: relative;
}

.block-gallery .gallery-video-wrapper .wrapper,
.block-gallery .gallery-video-wrapper a {
  z-index: 99;
  display: block;
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}

.block-gallery .gallery-video-wrapper a {
  z-index: 10;
}

.block-gallery .gallery-video-wrapper .wrapper {
  background: none;
}

.block-gallery .gallery-video-wrapper .wrapper .video-btn-wrapper {
  text-align: center;
  vertical-align: middle;
}

.block-gallery .gallery-video-wrapper .wrapper .i-circle-arrow {
  width: 5em;
  height: 5em;
  position: absolute;
  top: 42%;
  left: 42%;
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
}

/*
* 5. Circle Headline blocks
*
* Circle Text
* - Uses jquery.fittext.js to dynamically resize the font based on the circle width.
* - Circle shape is maintained for all column widths using "height: 0 and padding-botttom: 100%"
*/

.circle-text {
  width: 100%;
}

.circle-text:after {
  border-radius: 50%;
  content: "";
  background: url(../images/block-headline__circle.png) repeat top left;
  -webkit-background-size: 8% 8%;
  background-size: 8%;
  display: block;
  width: 100%;
  height: 0;
  padding-bottom: 100%;
}

.circle-text .circle-text__content {
  font-size: 33px;
  font-size: 2.0625rem;
  color: #00456B;
  float: left;
  line-height: 1.5em;
  width: 100%;
  margin: 27% 0 0 13%;
  width: 75%;
}

.circle-text .circle-text__content.text--center {
  text-align: center;
}

.circle-text.circle-text--solid {
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
}

.circle-text.circle-text--solid:after {
  background: #b0c137;
}

.circle-text.circle-text--solid .circle-text__content {
  font-size: 30px;
  font-size: 1.875rem;
  color: #fff;
  line-height: 1.1em;
  font-weight: bold;
  margin-top: 24%;
}

/*
* 6. Two & Three Column blocks
*/

.block-two,
.block-three {
  position: relative;
}

.block-two .block__content,
.block-three .block__content {
  padding-top: 0;
  padding-bottom: 0;
}

.block-two h1:before,
.block-two h1:after,
.block-two h2:before,
.block-two h2:after,
.block-two h3:before,
.block-two h3:after,
.block-two h4:before,
.block-two h4:after,
.block-two h5:before,
.block-two h5:after,
.block-two h6:before,
.block-two h6:after,
.block-three h1:before,
.block-three h1:after,
.block-three h2:before,
.block-three h2:after,
.block-three h3:before,
.block-three h3:after,
.block-three h4:before,
.block-three h4:after,
.block-three h5:before,
.block-three h5:after,
.block-three h6:before,
.block-three h6:after {
  display: none;
}

.block-two h1:first-of-type,
.block-two h2:first-of-type,
.block-two h3:first-of-type,
.block-two h4:first-of-type,
.block-two h5:first-of-type,
.block-two h6:first-of-type,
.block-three h1:first-of-type,
.block-three h2:first-of-type,
.block-three h3:first-of-type,
.block-three h4:first-of-type,
.block-three h5:first-of-type,
.block-three h6:first-of-type {
  margin-top: 0;
  padding-top: 0;
}

.block-two {
  margin-bottom: 32px;
  margin-bottom: 2rem;
}

/*
* 7. Block borders
*/

.element .no-margin-bottom {
  padding-top: 0;
  margin-bottom: 0;
}

/* For Elements without ElementHolder */

.block.no-top-padding.no-margin-bottom {
  padding-top: 0;
  margin-bottom: 0;
}

/*
 * 50max form application style
 */

.form-50max .literalFieldArea p {
  font-size: 0.85rem;
}

.form-50max label.left {
  float: none;
}

.form-50max .field.text.nolabel {
  background: none;
  border: none;
  font-size: 1rem;
  line-height: 1.5;
  padding: 0;
}

.form-50max #50maxLiteralField2.field.text.nolabel {
  color: red;
  background-color: transparent;
  border: none;
}

.form-50max .segmented-control {
  padding-left: 0;
}

.form-50max .segmented-control label {
  padding-left: 0;
}

@media only screen and (max-width: 40em) {
  .form-50max .vehicle__holder {
    padding-left: 0.9rem;
    padding-right: 0.9rem;
  }
}

@media only screen and (max-width: 1040px) {
  .form-50max .vehicle__holder .btn {
    display: block;
    margin-left: 0;
  }
}

@media only screen and (max-width: 40em) {
  .form-50max .vehicle__holder .file.requiredField.field--file {
    width: 95%;
  }
}

.form-50max .vehicleWrap {
  padding-top: 2rem;
}

.form-50max .radio-button-list {
  border-bottom: none;
}

/**
 * NZTA specific form styles
 * These are separate styles on top of pattern library
 * that aren't required to be added to it
 */

.field--error .error.message {
  display: block;
}

.field--dropdown .dropdown.dropdown--wide {
  background-position-x: 98%;
}

.field--dropdown .dropdown.dropdown--wide.dropdownOpen {
  background-position-x: 98%;
}

.field--dropdown .error.message {
  display: inline-block;
  margin-top: 0;
}

.field.composite {
  background: none;
  border: none;
  padding: 0;
}

.step-navigation .btn--submit {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}

.userform-progress .step-buttons {
  padding-left: 0;
}

.userform-progress .step-buttons .step-button-wrapper {
  padding: 1em 1em 0 1em;
}

.userform-progress .step-buttons .step-button-wrapper .step-button-jump {
  background: #fff;
  border-radius: 3px;
  padding: 4px 12px;
  margin: 0px 12px 0 0;
  display: inline-block;
  border: 1px solid #00456B;
}

.userform-progress .step-buttons .step-button-wrapper.current .step-button-jump {
  background: #00456B;
  color: #fff;
}

.userform-progress .step-buttons .progress {
  height: 0.25em;
}

.userform-progress div.progress {
  height: 0.2em;
}

.userform-progress div.progress .progress-bar {
  background: #00456B;
  height: 0.2em;
}

/**
 * Section nav specific styles
 */

@media only screen and (max-width: 40em) {
  .header.has-section-nav .header__title {
    padding-bottom: 44px !important;
  }
}

.header.has-section-nav .col {
  position: relative;
}

@media only screen and (max-width: 40em) {
  .header.has-section-nav .col {
    position: static;
  }
}

.section-nav {
  background: #00456B;
  margin: 0;
  padding: 0;
}

@media only screen and (max-width: 40em) {
  .section-nav {
    max-height: 0px;
    left: 0;
    overflow: hidden;
    padding: 0 5px;
    position: absolute;
    top: 100%;
    width: 100%;
    z-index: 1;
  }

  .section-nav.section-nav--active {
    max-height: 9999px;
  }
}

.section-nav.section-nav--expander {
  display: none;
}

.section-nav.section-nav--expander.section-nav--active {
  display: block;
  padding-left: 1em;
  position: absolute;
  right: 1em;
  top: 100%;
  z-index: 1;
}

.section-nav.section-nav--expander.section-nav--active li {
  clear: left;
  float: left;
  text-align: right;
  width: 100%;
}

.section-nav li {
  display: inline-block;
}

@media only screen and (max-width: 40em) {
  .section-nav li {
    display: block !important;
  }
}

.section-nav li.more {
  cursor: pointer;
  float: right;
}

.section-nav li.more i {
  margin-left: 7px;
}

.section-nav li.active a {
  font-weight: 600;
}

.section-nav li a {
  background: #00456B;
  display: block;
  font-weight: 300;
  margin: 0;
  padding: 8px 10px;
}

@media only screen and (max-width: 40em) {
  .section-nav li a:first-child {
    padding-top: 18px;
  }
}

@media only screen and (max-width: 40em) {
  .section-nav li a:last-child {
    padding-bottom: 18px;
  }
}

@media only screen and (min-width: 37.5em) {
  .section-nav li a {
    padding: 1rem .6rem 1rem .8rem;
  }
}

@media only screen and (min-width: 60em), only print {
  .section-nav li a {
    margin: 5px;
    padding: 1rem 1.3rem 1rem 1.6rem;
  }
}

/**
 * Mobile menu expander
 */

.section-nav__mobile-expander {
  display: none;
}

@media only screen and (max-width: 40em) {
  .section-nav__mobile-expander {
    background: #00456B;
    bottom: 0;
    display: block;
    left: 0;
    padding: 10px 15px;
    position: absolute;
    width: 100%;
  }

  .section-nav__mobile-expander .i {
    margin-top: -8px;
    position: absolute;
    right: 15px;
    top: 50%;
  }
}

.header--section-nav .header__title {
  padding-bottom: 0;
}

.header--section-nav .col {
  position: relative;
}

/**
 * Removes bottom padding from the header when a section nav is present.
 * Can be removed when section nav goes into the pattern library.
 */

.header.has-section-nav .header__title {
  padding-bottom: 0;
}

/*
* Customise section-nav items when viewed in mobile view as nav-pills
*/

.nav--pills .active .pill {
  background: #002d48;
}

.nav--pills .pill:hover {
  color: #fff;
}

/**
 * Content Navigation
 * An unorordered list of anchor links added to a page by JS
 *
 * @see app/code/pagetypes/Page.php:DisplayContentNavigation
 * @see themes/default/js/compontents/content-navigation.js
 * @see themes/default/templates/Includes/ContentNavigation.ss
 */

.content-navigation .anchor-links--hidden {
  display: none;
}

.content-navigation__top-link {
  float: right;
}

@media only screen and (max-width: 59.99em) {
  .content-navigation__top-link {
    float: none;
    display: block;
    text-align: left;
  }

  .content-navigation__top-link a {
    line-height: 1;
  }
}

.content-navigation__top-link a {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 2;
}

/**
 * Styles for the sidebar navigtion
 */

.sidebar-nav {
  margin: 0 0 2rem 0;
}

.sidebar-nav .nav {
  margin-left: 0;
  padding: 0;
}

.sidebar-nav .nav.active {
  background-color: #0b5485;
}

.sidebar-nav .nav .nav {
  padding-left: 0.5rem;
}

.sidebar-nav li {
  display: block;
  margin-right: 0;
  padding-bottom: 0;
}

.sidebar-nav li a {
  font-weight: 100;
  line-height: 1.3;
  padding: 0.5rem 0rem 0.5rem 0rem;
}

.sidebar-nav li a.current {
  font-weight: 600;
}

/**
 * Glossary
 * Style for glossary links and lightbox inline content popup
 * @see GlossaryItem.php
 * @see Page.php
 */

.glossary-link {
  border-bottom: 1px dotted #aaa;
  color: #555;
  text-decoration: none;
}

.glossary-link:hover {
  cursor: help;
}

.glossary-popup {
  border-radius: 4px;
  background: #fff;
  border: 2px solid #00456B;
  margin: 0 auto;
  max-width: 650px;
  padding: 1em;
  position: relative;
}

.glossary-popup dd,
.glossary-popup dt {
  display: block;
  float: none;
  text-align: left;
}

.glossary-popup dd {
  font-size: 14px;
  font-size: 0.875rem;
}

.glossary-index ul {
  padding-left: 0;
}

.glossary-index li {
  line-height: 2;
}

.glossary-index.affix-top {
  padding-bottom: 1rem;
}

.glossary-index.affix {
  -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
  -ms-box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
  -o-box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
  background: #fff;
  left: 0;
  padding-left: 4%;
  padding-right: 4%;
  top: 0;
  width: 100%;
}

@media only screen and (max-width: 40em) {
  .glossary-index.affix {
    -webkit-box-shadow: none;
    -ms-box-shadow: none;
    -o-box-shadow: none;
    box-shadow: none;
    padding-left: 0;
    padding-right: 0;
    position: static;
  }
}

.glossary-index-link a {
  color: #00456B;
}

.glossary-index-link a:hover {
  text-decoration: underline;
}

.affix {
  position: fixed;
}

.affix + .glossary-table {
  margin-top: 56px;
}

/*
 * help icon (?) next to lightbox-popup links
 */

a.lightbox-popup i.i-help {
  width: 1.08em;
  height: 1.08em;
}

a.lightbox-popup:hover i.i-help {
  width: 1.08em;
  height: 1.08em;
}

/* Road status SH94 milford road */

.road-status-wrapper {
  padding: 0.75em;
  background-color: #009966;
  color: #fff;
}

.road-status {
  padding: 0.75em;
  border: 3px solid #fff;
  text-align: center;
}

.road-status-wrapper,
.road-status {
  border-radius: 8px;
}

.road-status-wrapper .i--red,
.road-status-wrapper .comment--flagged {
  color: #fff;
  font-weight: bold;
  line-height: 52px;
}

.road-status-wrapper h2 {
  margin-top: 0;
  padding-top: 0;
  height: auto;
  font-size: 3rem;
}

.road-status-wrapper h2:before,
.road-status-wrapper h2:after {
  background: none !important;
}

.RoadStatusRoadStatus,
.RoadStatusRoadNextUpdate,
.RoadStatusRoadDescription {
  text-transform: uppercase;
  border: 1px solid #eee;
  margin-bottom: 1em;
  padding: 0.25em;
}

.RoadStatusRoadTitle h2,
.RoadStatusRoadStatus h3 {
  font-weight: bold;
}

.RoadStatusRoadTitle h2 {
  font-weight: bold;
  margin-bottom: 0.25em;
}

.RoadStatusRoadStatus h3,
.RoadStatusRoadNextUpdate h3,
.RoadStatusRoadDescription h3 {
  margin-bottom: 0;
}

.RoadStatusRoadStatus h3 {
  font-size: 220%;
}

.RoadStatusRoadDescription {
  background-color: #ff6600;
  color: #000 !important;
}

.RoadStatusRoadNumber .i--white {
  font-size: 2em;
  height: 2.3em;
  width: 2.3em;
  padding-top: 0.2em;
}

.RoadStatusRoadNumber .i--red,
.RoadStatusRoadNumber .comment--flagged {
  color: #fff;
  font-size: 125%;
  font-weight: bold;
  font-style: normal;
  margin-top: -3px;
  font-size: 125%;
}

.promo .RoadStatusRoadNumber .i--red,
.promo .RoadStatusRoadNumber .comment--flagged {
  line-height: 80px;
}

.promo .RoadStatusRoadNumber .i--white {
  font-size: 3.5em;
}

.promo .RoadStatusRoadStatus h3 {
  font-size: 600%;
}

.promo .RoadStatusRoadDescription h3 {
  font-size: 240%;
  line-height: 1.2em;
}

.promo .RoadStatusRoadNextUpdate p {
  color: #fff;
  font-size: 180%;
  line-height: 1.2em;
}

.block_area_sidebar .road-status {
  border: 1px solid #fff;
}

.block_area_sidebar .no-top-padding {
  padding-top: 0;
}

.block_area_sidebar .road-status-wrapper h2 {
  font-size: 1.5rem;
}

.block_area_sidebar .RoadStatusRoadStatus h3,
.block_area_sidebar .RoadStatusRoadDescription h3 {
  font-size: 120%;
  line-height: 120%;
}

.block_area_sidebar .RoadStatusRoadStatus,
.block_area_sidebar .RoadStatusRoadNextUpdate,
.block_area_sidebar .RoadStatusRoadDescription {
  padding: 0.5em;
  word-wrap: break-word;
}

.block_area_sidebar .RoadStatusRoadNumber .i--white {
  font-size: 1.3em;
  height: 2.3em;
  padding-top: 0.2em;
  width: 2.3em;
}

.block_area_sidebar .RoadStatusRoadNumber .i--red,
.block_area_sidebar .RoadStatusRoadNumber .comment--flagged {
  font-size: 125%;
  margin-top: -2px;
  line-height: 30px;
}

.promooverlay__slide.roadstatus .road-status-wrapper {
  width: 70vw;
  margin: 0 auto;
}

/*
 * Learner Approved Motorcycle Scheme (LAMS) page
 */

.motorcycle-scheme .motorcycle-scheme__filter .field__label {
  display: none;
}

.motorcycle-scheme .motorcycle-scheme__table h5 {
  margin-bottom: 0;
}

.trams__form {
  margin-bottom: 32px;
  margin-bottom: 2rem;
}

.trams__form .trams__summary {
  position: absolute;
  right: 13px;
}

@media only screen and (max-width: 40em) {
  .trams__form .trams__summary {
    position: relative;
    display: block;
    right: 0;
  }
}

.trams__form .trams__form_filter {
  margin-bottom: 32px;
  margin-bottom: 2rem;
}

.trams__form .trams__form_filter .field__heading {
  margin: .5em 0;
}

.trams__form .trams__form_filter .field__label {
  padding-left: 18px;
}

.trams__form .trams__form_filter .field__label input[type="checkbox"] {
  margin-left: -18px;
}

.trams__form .trams__form_filter .trams__form_header {
  padding-left: 0;
  margin: .5em 0;
}

.trams__form .trams__form_filter li {
  margin-top: 3px;
}

.trams__form .trams__regions li ul {
  margin: 0 0 .5em 1.5em;
  padding-top: 0;
}

.trams__form .trams__regions .global__checkbox-group_showhide {
  color: #00456B;
}

.trams__form .trams__regions .global__checkbox-group_showhide:hover {
  color: #555;
}

.medium-screen .trams__form .trams__regions .global__checkbox-group_showhide {
  word-break: break-word;
  text-align: left;
  max-width: 120px;
}

.trams__form .trams__contaminants li ul {
  margin: 0 0 .5em 1.5em;
  padding-top: 0;
}

.trams__form .trams__contaminants .global__checkbox-group_showhide {
  color: #00456B;
}

.trams__form .trams__contaminants .global__checkbox-group_showhide:hover {
  color: #555;
}

.trams__form .trams__form_options {
  margin-bottom: 16px;
  margin-bottom: 1rem;
}

.trams__form .trams__form_actions .btn--submit:disabled {
  background-color: #e5e5e5;
}

.trams__form .trams__form_actions .btn--submit:disabled:hover {
  cursor: not-allowed;
}

.trams__form .toggle-item.toggle--active {
  display: none;
}

@media only screen and (max-width: 59.99em) {
  .typography .trams__form_filter ul {
    padding-left: 14px;
    padding-left: 0.875rem;
  }
}

.typography .trams__form_filter li ul {
  margin-left: 0;
}

.typography .trams__form_filter ul ul {
  padding-left: 1.4rem;
  font-size: 90%;
}

.trams__form_summary {
  margin-bottom: 16px;
  margin-bottom: 1rem;
  border-radius: 4px;
  background-color: #ddd;
}

.trams__form_summary:hover {
  background-color: #e5e5e5;
}

.trams__form_summary a {
  padding: 14px;
  padding: 0.875rem;
  color: #555;
  display: block;
  position: relative;
}

.trams__form_summary a:hover {
  color: #555;
}

table.trams__report {
  border-color: #ccc;
  background-color: #fff;
}

table.trams__report th,
table.trams__report td {
  border-color: #ddd;
  padding: 10px;
  padding: 0.625rem;
}

@media only screen and (max-width: 59.99em) {
  table.trams__report th,
  table.trams__report td {
    padding: 5px;
    padding: 0.3125rem;
  }
}

table.trams__report thead th {
  font-size: 14px;
  font-size: 0.875rem;
  border-color: #ccc;
}

table.trams__report thead th:first-child {
  border-left: 1px solid #ccc;
}

table.trams__report tbody tr td {
  color: #555;
}

table.trams__report tbody abbr {
  border-bottom-color: #d1d1d1;
}

table.trams__report tfoot tr td {
  font-weight: normal;
}

table.trams__report .trams__report_row--header {
  background-color: #d5e5ee !important;
  font-size: 14px;
  font-size: 0.875rem;
}

table.trams__report .trams__report_row--header span {
  color: #555;
  padding: 0 .125em;
}

table.trams__report .trams__report_row td,
table.trams__report .trams__report_row th,
table.trams__report tbody td,
table.trams__report tbody th,
table.trams__report tfoot td,
table.trams__report tfoot th {
  font-size: 14px;
  font-size: 0.875rem;
}

table.trams__report .trams__report_row.trams__report_row--total td,
table.trams__report .trams__report_row.trams__report_row--subtotal td {
  font-style: italic;
}

table.trams__report .trams__report_row.trams__report_row--total {
  border-bottom: 4px solid #ccc;
}

table.trams__report .trams__report_row.trams__report_row--total td {
  border-bottom-width: 2px;
}

table.trams__report .trams__report_row.trams__report_row--subtotal {
  border-top: 2px solid #ccc;
  border-bottom: 2px solid #ccc;
}

table.trams__report .trams__report_row.trams__report_row--subtotal .trams__link_right {
  float: right;
}

table.trams__report .trams__report_row.trams__report_row--subtotal .trams__link_right i {
  margin-top: -3px;
}

table.trams__report .td--numeric,
table.trams__report .td--currency {
  text-align: right;
}

.trams__report_key {
  margin: 2em 0;
}

.trams__report_key dd,
.trams__report_key dt {
  font-size: 14px;
  font-size: 0.875rem;
  text-align: left;
}

.trams__report_meta span {
  color: #ddd;
  margin: 0 .5em;
}

/**
 * Styles that relate to the Innovation Submit Form
 */

.innovation-optionset {
  padding-left: 0;
}

.radio-button-list {
  border-bottom: none;
}

/**
 * Styles that relate to the Innovation Article
 */

.innovation-article h3 {
  font-size: 1.5rem;
}

.innovation-article .innovationarticle-grid .innovationarticle-info-header {
  font-size: .875rem;
}

.innovation-article .innovationarticle-grid .innovationarticle-info-header .list {
  line-height: 1.5em;
  margin-bottom: 0;
  padding-bottom: 0;
  padding-left: 0;
}

.innovation-article .innovationarticle-grid .innovationarticle-info-header .list:after {
  clear: both;
  content: '';
  display: block;
}

.innovation-article .innovationarticle-grid .innovationarticle-info-header .list > li {
  float: left;
}

.innovation-article .innovationarticle-grid .innovationarticle-info-header .list > li:after {
  content: '|';
  color: #555;
}

.innovation-article .innovationarticle-grid .innovationarticle-info-header .list > li:last-child:after {
  content: '';
  display: none;
}

.innovation-article .innovationarticle-grid .innovationarticle-info-header .list > li a {
  font-weight: normal;
}

.innovation-article .innovationarticle-grid .feature-image-container img {
  display: block;
}

.innovation-article .innovationarticle-grid .innovationarticle-overview h3 {
  margin-top: 0;
}

.innovation-article .innovationarticle-grid .innovationarticle-overview .innovation-tally {
  margin-top: .625em;
  color: #004771;
}

@media only screen and (min-width: 37.5em) {
  .innovation-article .innovationarticle-grid .innovationarticle-overview .innovation-tally {
    margin-top: 0;
  }
}

.innovation-article .innovationarticle-grid .innovationarticle-overview .innovation-tally h5 {
  margin-bottom: 0;
}

.innovation-article .innovationarticle-grid .innovationarticle-overview .innovation-count {
  display: block;
  font-size: 2.25em;
}

.innovation-article .innovationarticle-grid .innovationarticle-overview .innovation-count i {
  width: .9em;
  height: .9em;
  margin-bottom: .1em;
  margin-right: .35em;
}

.innovation-article .innovationarticle-grid .innovationarticle-content h3 {
  margin-top: 0;
}

.innovation-article .innovationarticle-grid .innovationarticle-viewmore {
  font-size: 1.125rem;
  font-weight: 700;
}

.innovation-article .innovationarticle-grid .innovationarticle-likebox {
  display: block;
  padding-left: 1em;
  padding-right: 1em;
  color: #fff;
  background-color: #AAB723;
  -webkit-transition: background-color .25s ease-out;
  -moz-transition: background-color .25s ease-out;
  transition: background-color .25s ease-out;
}

@media only screen and (min-width: 37.5em) {
  .innovation-article .innovationarticle-grid .innovationarticle-likebox {
    padding-left: 2em;
    padding-right: 2em;
  }
}

.innovation-article .innovationarticle-grid .innovationarticle-likebox i {
  float: left;
  display: block;
  width: 60px;
  height: 60px;
}

.innovation-article .innovationarticle-grid .innovationarticle-likebox .likebox-lightbulb {
  padding: 0;
  opacity: .5;
  min-width: 65px;
  -webkit-transition: opacity .25s ease-out;
  -moz-transition: opacity .25s ease-out;
  transition: opacity .25s ease-out;
}

.innovation-article .innovationarticle-grid .innovationarticle-likebox h3 {
  font-size: 1.75em;
  line-height: 1.2;
}

.innovation-article .innovationarticle-grid .innovationarticle-likebox .likebox-subhead {
  display: block;
  margin-bottom: 0;
}

.innovation-article .innovationarticle-grid .innovationarticle-likebox .likebox-subhead--liked {
  display: none;
  margin-bottom: 0;
}

.innovation-article .innovationarticle-grid .innovationarticle-likebox--liked {
  background-color: #b4c222;
}

.innovation-article .innovationarticle-grid .innovationarticle-likebox--liked .likebox-lightbulb {
  -webkit-filter: drop-shadow(0 0 1px #e8ff00);
  filter: drop-shadow(0 0 1px #e8ff00);
  opacity: 1;
}

.innovation-article .innovationarticle-grid .innovationarticle-likebox--liked .likebox-subhead {
  display: none;
}

.innovation-article .innovationarticle-grid .innovationarticle-likebox--liked .likebox-subhead--liked {
  display: block;
}

.innovation-article .innovationarticle-grid .related-media-box {
  overflow: hidden;
  margin: 1.65em 0;
  padding: 0;
  border: 1px solid #ccc;
}

.innovation-article .innovationarticle-grid .related-media-box .wrapper {
  margin: 0;
  padding: 0;
}

.innovation-article .innovationarticle-grid .related-media-box h1,
.innovation-article .innovationarticle-grid .related-media-box h2,
.innovation-article .innovationarticle-grid .related-media-box h3,
.innovation-article .innovationarticle-grid .related-media-box h4,
.innovation-article .innovationarticle-grid .related-media-box h5,
.innovation-article .innovationarticle-grid .related-media-box h6 {
  word-wrap: break-word;
  font-weight: normal;
  color: #1a5e8f;
}

.innovation-article .innovationarticle-grid .related-media-box .media-type {
  width: 24px;
  height: 24px;
  margin: 1.1em 0 1.1em 1.1em;
}

.innovation-article .innovationarticle-grid .related-media-box .media-title {
  padding-left: 0.6em;
  padding-top: 0.7em;
  line-height: 1.2em;
}

.innovation-article .innovationarticle-grid .related-media-box .image-preview {
  padding: 0.5em;
  text-align: right;
  vertical-align: middle;
}

.innovation-article .innovationarticle-grid .innovationarticle-share {
  padding-top: .625em;
}

@media only screen and (min-width: 37.5em) {
  .innovation-article .innovationarticle-grid .innovationarticle-share {
    padding-top: 0;
    text-align: right;
  }
}

.innovation-article .innovationarticle-grid .innovationarticle-share:after {
  clear: both;
  content: '';
  display: block;
}

.innovation-article .innovationarticle-grid .innovationarticle-share .share-list {
  padding: 0;
  margin: 0;
}

.innovation-article .innovationarticle-grid .innovationarticle-share .share-list li {
  padding: 0 0.4em;
}

.innovation-article .innovationarticle-tag-section {
  padding-top: 0.75em;
}

.innovation-article .innovationarticle-tag-section h1,
.innovation-article .innovationarticle-tag-section h2,
.innovation-article .innovationarticle-tag-section h3,
.innovation-article .innovationarticle-tag-section h4,
.innovation-article .innovationarticle-tag-section h5,
.innovation-article .innovationarticle-tag-section h6 {
  color: #555;
}

.innovation-article .innovationarticle-tag-section .innovationarticle-tag-list {
  padding-left: 0;
}

.innovation-article .innovationarticle-tag-section .innovationarticle-tag-list li > a {
  font-size: smaller;
  color: white;
}

.innovation-article .innovationarticle-tag-section .innovationarticle-tag {
  padding: 0 0.3em;
  margin: 0 0.4em 0.4em 0;
  background-color: #004771;
  border-radius: 0.25em;
  line-height: 20px;
  width: 5.75em;
  -ms-word-break: break-all;
  word-break: break-all;
}

.innovation-article .innovationarticle-related-section ul {
  padding-left: 0;
}

.innovation-article .innovationarticle-related-section ul li {
  display: block;
}

.innovation-article .innovationarticle-related-section a {
  font-weight: 700;
  line-height: 2;
}

.innovation-article .innovationarticle-related-section .related-pages-summary {
  font-size: .875rem;
}

.innovation-article .innovation-gallery .col--isotope {
  border-bottom-width: 0;
  padding-top: 20px;
  background-color: #ddd;
}

.innovation-article .innovation-gallery .col--isotope:hover {
  background-color: #e7e7e7;
}

.innovation-article .innovation-gallery figcaption {
  text-align: center;
  font-size: 0.85rem;
  overflow: hidden;
  margin-bottom: 10px;
  line-height: 1.2rem;
  color: #333;
}

.innovation-article .innovation-gallery img {
  width: 100%;
}

.innovation-article .innovation-gallery .top {
  display: inline-block;
}

.innovation-article .innovation-gallery .top:before {
  background-position: 0 0;
}

.header__title--ccos {
  color: #555;
}

.header__title--ccos .breadcrumb > li a:after {
  color: #555;
}

div[class*=" header--Ccos"] .banner__overlay {
  display: none;
}

div[class*=" header--Ccos"] .header__image ~ .header__title h1,
div[class*=" header--Ccos"] .header__image ~ .header__title ol.breadcrumb li > *,
div[class*=" header--Ccos"] ol.breadcrumb li > *,
div[class*=" header--Ccos"] ol.breadcrumb li > a:after {
  text-shadow: none;
}

.header--CcosLandingPage .header__image ~ .header__title h1,
.header--CcosLandingPage .header__image ~ .header__title ol.breadcrumb li > *,
.header--CcosLandingPage ol.breadcrumb li > *,
.header--CcosLandingPage ol.breadcrumb li > a:after {
  color: #555;
}

@media only screen and (max-width: 40em) {
  .header--CcosLandingPage {
    background-color: #fff;
  }
}

.header--CcosToolkitPage .header__image ~ .header__title h1,
.header--CcosToolkitPage .header__image ~ .header__title ol.breadcrumb li > *,
.header--CcosToolkitPage ol.breadcrumb li > *,
.header--CcosToolkitPage ol.breadcrumb li > a:after {
  color: #fff;
}

@media only screen and (max-width: 40em) {
  .header--CcosToolkitPage {
    background-color: #00456B;
  }
}

@media only screen and (max-width: 40em) {
  .header--CcosStoryPage .header__title {
    background-color: #fff;
  }
}

@media only screen and (max-width: 37.5em) {
  .page--ccos .theme--paper {
    -webkit-box-shadow: none;
    box-shadow: none;
    padding-top: 0;
  }
}

.page--ccos h2:before,
.page--ccos .ccos h2:after {
  display: none;
}

.ccos__intro.intro,
.news .ccos__intro.news__intro {
  margin-bottom: 40px;
}

@media only screen and (max-width: 37.5em) {
  .ccos__intro.intro,
  .news .ccos__intro.news__intro {
    margin: 20px 0 0;
  }
}

.ccos__small-heading {
  font-size: 14px;
  font-weight: bold;
}

@media only screen and (max-width: 37.5em) {
  .ccos__small-heading {
    margin-top: 40px;
  }
}

.ccos__boxed-heading {
  border: 1px solid #555;
  padding: 0 20px;
  width: 100%;
  margin-bottom: 20px;
}

.ccos__boxed-heading h3 {
  margin: 0;
  padding: 25px 0;
}

.ccos__stories {
  overflow: hidden;
}

.ccos__story {
  padding: 25px;
}

.ccos__story.ivory {
  background: #e9e2cf;
}

.ccos__story.melon {
  background: #f5bdaa;
}

.ccos__story.soft_teal {
  background: #aad2d2;
}

.ccos__story img {
  width: 100%;
}

.ccos__story h3 {
  margin-top: 20px;
}

.ccos__story a,
.ccos__story .i-arrow-r {
  color: #00456B;
}

.ccos__story .i-arrow-r {
  margin-left: 5px;
}

.ccos__story a.ccos__story__read-more {
  text-decoration: underline;
  display: inline-block;
  margin-bottom: 45px;
}

.ccos__story a.ccos__story__read-more:hover {
  text-decoration: none;
}

.ccos__story .ccos__story__divider {
  display: block;
  width: 50px;
  height: 1px;
  background-color: #00456B;
  margin-bottom: 20px;
}

.ccos__story p {
  font-size: 14px;
}

.ccos-graphic {
  margin-top: 30px;
}

@media only screen and (min-width: 37.5em) {
  .ccos-graphic {
    margin-top: 60px;
  }
}

.ccos-graphic.left {
  margin-right: 10%;
}

.ccos-graphic img {
  width: auto;
}

.ccos-graphic img.ccos-graphic--image-small {
  margin: 0;
}

.ccos-graphic__caption {
  position: relative;
}

.ccos-graphic__caption p {
  font-color: #555;
  padding-top: 25px;
}

.ccos-graphic__caption p:before {
  height: 1px;
  display: block;
  width: 22.5%;
  background: #555;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
}

.toolkit {
  margin-top: 60px;
}

.toolkit h2 {
  font-size: 32px;
  font-weight: normal;
  line-height: 1;
}

ul.toolkit__list {
  list-style-type: none;
  counter-reset: my-counter;
  color: #00456B;
  display: table;
}

ul.toolkit__list li {
  display: table-row;
}

ul.toolkit__list li a {
  color: #00456B;
  text-decoration: underline;
  display: inline-block;
  min-height: 30px;
}

ul.toolkit__list li a:hover {
  text-decoration: none;
}

ul.toolkit__list li:before {
  content: counter(my-counter);
  counter-increment: my-counter;
  color: #00456B;
  font-weight: bold;
  display: table-cell;
  text-align: right;
  padding-right: 15px;
  vertical-align: top;
}

/* Slider */

.slick-slider {
  position: relative;
  display: block;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0;
}

.slick-list:focus {
  outline: none;
}

.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block;
}

.slick-track:before,
.slick-track:after {
  content: "";
  display: table;
}

.slick-track:after {
  clear: both;
}

.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none;
}

[dir="rtl"] .slick-slide {
  float: right;
}

.slick-slide img {
  display: block;
}

.slick-slide.slick-loading img {
  display: none;
}

.slick-slide.dragging img {
  pointer-events: none;
}

.slick-initialized .slick-slide {
  display: block;
}

.slick-loading .slick-slide {
  visibility: hidden;
}

.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
  display: none;
}

.partners {
  margin-top: 20px;
  position: relative;
}

@media only screen and (min-width: 60em) {
  .partners {
    margin-top: 100px;
  }
}

.partners h2 {
  font-size: 32px;
  margin: 0 0 40px;
}

ul.partners__slider {
  list-style-type: none;
}

ul.partners__slider li {
  margin: 0;
  padding: 0;
  overflow: hidden;
}

ul.partners__slider li img {
  margin: 0 auto;
  max-width: 240px;
}

@media only screen and (max-width: 60em) {
  ul.partners__slider li img {
    width: 100%;
  }
}

.partners__slider-button {
  z-index: 10;
  position: absolute;
  top: 5px;
  color: #ddd;
  width: 40px;
  height: 40px;
  opacity: 0.3;
}

.partners__slider-button.slick-prev {
  right: 47px;
}

.partners__slider-button.slick-next {
  right: 0;
}

.partners__slider-button:hover {
  opacity: 1;
}

.partners__slider-button:focus {
  outline: none;
}

.partners__slide-nav-divider {
  z-index: 10;
  position: absolute;
  top: 8px;
  right: 43px;
  height: 30px;
  width: 1px;
  background: #ddd;
}

.ccos-sidebar {
  border-top: 1px solid #ddd;
  padding-top: 40px;
}

@media only screen and (min-width: 60em) {
  .ccos-sidebar {
    border-left: 1px solid #ddd;
    border-top: none;
    padding-top: 0px;
  }
}

.ccos-sidebar ul {
  padding-left: 0;
}

@media only screen and (min-width: 60em) {
  .ccos-sidebar ul {
    padding-left: 1.3rem;
  }
}

ul.ccos-sidebar__tabs li:first-child {
  margin-right: 30px;
}

ul.ccos-sidebar__tabs li a {
  font-weight: bold;
  text-transform: uppercase;
  color: #00456B;
  font-size: 14px;
}

ul.ccos-sidebar__tabs li a.is-active {
  border-bottom: 2px solid #00456B;
}

ul.ccos-sidebar__links {
  list-style-type: none;
}

ul.ccos-sidebar__links li a {
  text-decoration: underline;
  color: #00456B;
}

ul.ccos-sidebar__links li a:hover {
  text-decoration: none;
}

ul.ccos-sidebar__links li a.active {
  font-weight: bold;
}

.accordian-item {
  padding: 45px 0 10px;
  border-bottom: 1px solid #ddd;
}

.accordian-item:first-of-type {
  padding-top: 0;
}

.accordian-item:last-of-type {
  border-bottom: 0;
}

.accordian-item__question {
  float: left;
  padding-right: 30px;
}

.accordian-item__answer {
  clear: both;
  padding-right: 30px;
}

.accordian-item__arrow {
  float: right;
  width: 50px;
  height: 50px;
  background: url(../images/ccos-accordian-toggle-down.png) no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
}

.accordian-item__arrow.active {
  background: url(../images/ccos-accordian-toggle-up.png) no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
}

@media only screen and (max-width: 30em) {
  .accordian-item__arrow {
    width: 35px;
    height: 35px;
  }
}

.accordion-extra-target-item {
  padding: 1em 1em;
}

/* add some text shadow for text that's sitting on image (might be white background) */

.header__image ~ .header__title h1,
.header__image ~ .header__title ol.breadcrumb li > * {
  text-shadow: 1px 1px 6px rgba(0, 0, 0, 0.8);
}

.header__title h1 span {
  display: block;
  font-size: 0.9rem;
  margin-top: 0.25rem;
}

/* EXTRA TREATMENT FOR SOME GRID FEATURES */

.grid--margin-bottom {
  margin-bottom: 2rem;
}

.grid--padding-bottom {
  padding-bottom: 2rem;
}

/* THERE'S NO DEGRESS OF FIFTHS IN THE P.L.? */

.one-fifth {
  width: 20%;
}

.two-fifths {
  width: 40%;
}

.three-fifths {
  width: 60%;
}

.four-fifths {
  width: 80%;
}

/* FILTERS */

.filters {
  background: #efefef;
  padding: 1px;
  position: relative;
  z-index: 9;
}

.filters__label {
  z-index: 5;
  /* we use this for detection in the highways.js file */
}

.filters > div {
  margin: .5rem;
}

.filters__label,
.filter__options {
  background: #094771;
  color: #fff;
  border-radius: .25rem;
  position: relative;
}

.filter__options {
  display: none;
}

.filter__options ul {
  display: none;
  position: relative;
  z-index: 10;
  background: #dfe3e8;
  width: 100%;
  padding: 1rem;
  border-radius: 0 0 .25rem .25rem;
}

.filter__options > a.active + ul {
  display: block;
}

.filter__options ul li {
  list-style: none;
}

.filter__options ul li a {
  color: #094771;
  display: block;
  width: 80%;
}

.filters__label a,
.filter__options > a {
  padding: .5rem 1rem;
  margin: 0;
  display: block;
  color: #fff;
  position: relative;
  z-index: 11;
}

.filters__label a:before,
.filter__options > a span:before {
  background: url(png/filter-toggle.png) no-repeat 0 0;
  width: 20px;
  height: 20px;
  -webkit-background-size: 20px 40px;
  background-size: 20px 40px;
  content: '';
  display: inline-block;
  margin-right: 10px;
  position: relative;
  top: 4px;
}

.filters__label a.active:before,
.filter__options > a.active span:before {
  background-position: 0 100%;
}

/* ARROW TOGGLES - for simple show/hide */

.arrow-toggle {
  display: block;
  position: relative;
  cursor: pointer;
}

.arrow-toggle ~ .arrow-toggle__content {
  display: none;
  margin: 1rem 0 2rem;
}

.arrow-toggle__content ul,
.arrow-toggle__content ol {
  margin-bottom: 2rem;
}

/* PROJECT OVERVIEW MAP*/

#project-map {
  padding: 0;
  position: relative;
}

#project-map img {
  width: 100%;
  min-height: 298px;
}

#project-map > div {
  position: absolute;
  left: 0;
  top: 30px;
  width: 85%;
  opacity: .9;
}

#project-map .theme--dark {
  padding: 1rem 0;
}

#project-map .theme--dark h3 {
  font-size: 1rem;
  line-height: 1.1rem;
  padding: 0 1rem;
}

#project-map .theme--dark > a {
  font-size: 0.8rem;
  margin: 0 1rem;
  display: block;
}

#project-map ul {
  margin: 0;
  max-height: 150px;
  overflow-y: auto;
}

#project-map ul li .pill {
  display: block;
  margin: 0;
}

/* PROJECT STATS & UPDATES */

#project-stats {
  min-height: 298px;
}

#project-stats li {
  margin: 0;
  padding: 1rem;
}

#project-stats .action {
  text-align: left;
}

#project-updates h5 {
  margin-bottom: 0;
}

#project-updates .col {
  margin-bottom: 3rem;
}

#project-subscribe .btn--submit {
  margin-bottom: 0;
}

/* PROJECT Details update */

#project-detail-introduction .title-highlight,
#project-detail-introduction .innovation-article .innovationarticle-grid .innovationarticle-overview h3,
.innovation-article .innovationarticle-grid .innovationarticle-overview #project-detail-introduction h3,
#project-detail-introduction .innovation-article .innovationarticle-grid .innovationarticle-content h3,
.innovation-article .innovationarticle-grid .innovationarticle-content #project-detail-introduction h3,
#project-detail-introduction .lesson-alert .lessonalert-grid .lessonalert-overview h1,
.lesson-alert .lessonalert-grid .lessonalert-overview #project-detail-introduction h1,
#project-detail-introduction .lesson-alert .lessonalert-grid .lessonalert-overview h2,
.lesson-alert .lessonalert-grid .lessonalert-overview #project-detail-introduction h2,
#project-detail-introduction .lesson-alert .lessonalert-grid .lessonalert-overview h3,
.lesson-alert .lessonalert-grid .lessonalert-overview #project-detail-introduction h3,
#project-detail-introduction .lesson-alert .lessonalert-grid .lessonalert-overview h4,
.lesson-alert .lessonalert-grid .lessonalert-overview #project-detail-introduction h4,
#project-detail-introduction .lesson-alert .lessonalert-grid .lessonalert-overview h5,
.lesson-alert .lessonalert-grid .lessonalert-overview #project-detail-introduction h5,
#project-detail-introduction .lesson-alert .lessonalert-grid .lessonalert-overview h6,
.lesson-alert .lessonalert-grid .lessonalert-overview #project-detail-introduction h6,
#project-detail-introduction .landing-overview h1,
.landing-overview #project-detail-introduction h1,
#project-detail-introduction .landing-overview h2,
.landing-overview #project-detail-introduction h2,
#project-detail-introduction .landing-overview h3,
.landing-overview #project-detail-introduction h3,
#project-detail-introduction .landing-overview h4,
.landing-overview #project-detail-introduction h4,
#project-detail-introduction .landing-overview h5,
.landing-overview #project-detail-introduction h5,
#project-detail-introduction .landing-overview h6,
.landing-overview #project-detail-introduction h6,
#project-detail-introduction .highwayreview .highwayreview-grid .highwayreview-overview h1,
.highwayreview .highwayreview-grid .highwayreview-overview #project-detail-introduction h1,
#project-detail-introduction .highwayreview .highwayreview-grid .highwayreview-overview h2,
.highwayreview .highwayreview-grid .highwayreview-overview #project-detail-introduction h2,
#project-detail-introduction .highwayreview .highwayreview-grid .highwayreview-overview h3,
.highwayreview .highwayreview-grid .highwayreview-overview #project-detail-introduction h3,
#project-detail-introduction .highwayreview .highwayreview-grid .highwayreview-overview h4,
.highwayreview .highwayreview-grid .highwayreview-overview #project-detail-introduction h4,
#project-detail-introduction .highwayreview .highwayreview-grid .highwayreview-overview h5,
.highwayreview .highwayreview-grid .highwayreview-overview #project-detail-introduction h5,
#project-detail-introduction .highwayreview .highwayreview-grid .highwayreview-overview h6,
.highwayreview .highwayreview-grid .highwayreview-overview #project-detail-introduction h6,
#project-detail-introduction .highwayreview .highwayreview-grid .highwayreview-content h1,
.highwayreview .highwayreview-grid .highwayreview-content #project-detail-introduction h1,
#project-detail-introduction .highwayreview .highwayreview-grid .highwayreview-content h2,
.highwayreview .highwayreview-grid .highwayreview-content #project-detail-introduction h2,
#project-detail-introduction .highwayreview .highwayreview-grid .highwayreview-content h3,
.highwayreview .highwayreview-grid .highwayreview-content #project-detail-introduction h3,
#project-detail-introduction .highwayreview .highwayreview-grid .highwayreview-content h4,
.highwayreview .highwayreview-grid .highwayreview-content #project-detail-introduction h4,
#project-detail-introduction .highwayreview .highwayreview-grid .highwayreview-content h5,
.highwayreview .highwayreview-grid .highwayreview-content #project-detail-introduction h5,
#project-detail-introduction .highwayreview .highwayreview-grid .highwayreview-content h6,
.highwayreview .highwayreview-grid .highwayreview-content #project-detail-introduction h6 {
  margin-top: 0;
}

/* GRID TABLES */

.grid--large--table > .col {
  margin-top: 1rem;
}

.grid--small--table {
  display: table;
  width: 100%;
}

.grid--small--table > .col {
  display: table-cell;
}

/* HIGHWAYS FEATURES */

#highways-features {
  position: relative;
  display: block;
}

#highways-features .highways-features__overlay {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 71, 113, 0.8);
  padding: 1rem;
  font-size: .8rem;
  line-height: 1.2rem;
  color: #fff;
  text-align: center;
}

#highways-features a.col h6 {
  font-size: 0.9rem;
  margin: .5rem 0;
}

#highways-features .large-quarter > div {
  position: relative;
  line-height: 0;
  margin-top: 1rem;
}

#highways-features .large-quarter:hover .arrow-toggle:before {
  background-position: 0 0;
}

/* CONSTRUCTION FEATURES (PROJECT OVERVIEW) */

.construction-highlight {
  margin: .5rem 0 !important;
  padding: 1rem;
}

#highway-construction .arrow-toggle.active {
  /* font-weight: 600; */
  background: #fff;
}

/* LIST VIEW PAGE */

.grid--list-view {
  border-bottom: 1px solid #81a1b7;
  margin-bottom: 2rem;
}

.grid--list-view h4.title-highlight,
.grid--list-view .lesson-alert .lessonalert-grid .lessonalert-overview h4,
.lesson-alert .lessonalert-grid .lessonalert-overview .grid--list-view h4,
.grid--list-view .landing-overview h4,
.landing-overview .grid--list-view h4,
.grid--list-view .highwayreview .highwayreview-grid .highwayreview-overview h4,
.highwayreview .highwayreview-grid .highwayreview-overview .grid--list-view h4,
.grid--list-view .highwayreview .highwayreview-grid .highwayreview-content h4,
.highwayreview .highwayreview-grid .highwayreview-content .grid--list-view h4 {
  margin-top: 0;
}

.grid--list-view .grid {
  height: 0;
  padding-bottom: 66%;
  -webkit-background-size: cover;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 0 0;
  position: relative;
}

.grid--list-view .grid .col {
  position: absolute;
  bottom: 0;
  background: #81a1b7;
  padding-left: .5rem;
  padding-right: .5rem;
}

.grid--list-view .grid .col p {
  margin: 0;
  padding: .5rem 0;
  color: #fff;
  font-size: 0.8rem;
}

.grid--list-view .grid .col.small-4 {
  left: 0;
  background: #5f7f42;
}

.grid--list-view .grid .col.image-overlay-types {
  background: #16582e;
}

.grid--list-view .grid .col.image-overlay-region {
  background: #094771;
}

/* MAP */

#highways-map {
  position: relative;
}

#highways-map__map {
  width: 100%;
  height: 800px;
  background: #efefef;
  position: relative;
  z-index: 0;
}

#map-nav {
  position: absolute;
  left: 0;
  top: 50px;
  z-index: 1;
  width: 350px;
}

.highways-map__header {
  background: #004771;
  border-radius: 0 .5rem 0 0;
  padding: 1rem;
}

.highways-map__header h2 {
  padding: 0;
  margin: .5em 0 0;
  font-size: 1.25rem;
  color: #fff;
}

.highways-map__header h3 {
  padding: 0;
  margin: .5em 0 0;
  font-size: 0.8rem;
  color: #fff;
}

.highways-map__header a {
  font-size: 0.8rem;
  color: #fff;
}

.highways-map__header a.enabled:before {
  content: "<";
  display: inline-block;
  margin-right: .5rem;
}

.highways-map__nav {
  overflow-y: auto;
  position: relative;
}

#map-nav-region {
  width: 100%;
  margin: 0;
  overflow-y: auto;
  overflow-x: hidden;
}

#map-nav ul {
  margin: 0;
  padding: 0;
  width: 100%;
}

#map-nav ul li {
  background: #fff;
}

#map-nav li a {
  display: block;
  padding: .5rem .5rem .5rem 1rem;
  position: relative;
}

#map-nav li a:hover {
  background: #efefef;
}

#map-nav li {
  border-bottom: 1px solid #efefef;
  padding: 1.5px;
}

#map-nav li.active > a {
  background: #dfe3e8;
  font-weight: bold;
  position: absolute;
  left: -9999px;
}

#map-nav ul > li:last-child {
  border-bottom: 1rem solid #fff;
}

.highways-map__projects {
  display: none;
}

.infobox {
  color: #fff;
  border-radius: 10px;
  padding: 10px;
  border: 0;
  text-align: center;
  -webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
  box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
}

.infobox--green {
  background: #31b22d;
}

.infobox--blue {
  background: #084771;
}

.infobox--orange {
  background: #f96600;
}

.infobox h3 {
  font-size: 18px;
  margin: .5em;
}

.infobox p {
  font-size: 11px;
}

.infobox .infobox__arrow {
  width: 0;
  height: 0;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
  border-right-width: 18px;
  border-right-style: solid;
  position: absolute;
  left: -18px;
  top: 17px;
}

.infobox--green .infobox__arrow {
  border-right-color: #31b22d;
}

.infobox--blue .infobox__arrow {
  border-right-color: #084771;
}

.infobox--orange .infobox__arrow {
  border-right-color: #f96600;
}

.highways-map__infobox {
  display: none;
}

.highways-map__infobox > div {
  background: #fff;
  padding: 20px;
}

.highways-map__infobox__images__link {
  display: block;
  top: -5px;
  right: 0px;
  position: relative;
}

.highways-map__infobox__images a {
  font-size: 11px;
}

.highways-map__infobox__images .highways-map__infobox__images__image:nth-child(2n+1) {
  margin-right: 10px;
}

.highways-map__infobox .highways-map__infobox__link {
  width: 100%;
  border-bottom: 1px solid #eceff2;
  padding-top: 0;
}

.highways-map__infobox .btn--primary {
  margin-bottom: .5rem;
}

/* FEEDBACK */

#feedback-options a {
  padding: 2rem;
  color: #236FA6;
}

#feedback-options a:hover {
  color: #333;
}

.red-highlight,
.red-highlight a {
  color: #cb4444;
  line-height: 1;
}

#consultation-dates a {
  text-decoration: underline;
  font-weight: 600;
}

#consultation-dates h5 {
  font-size: 2rem;
}

#consultation-dates .theme--dark span {
  font-size: 1.2rem;
}

#consultation-dates .theme--dark h5 {
  margin: .5rem 0;
}

#consultation-dates .theme--dark a {
  display: block;
  font-size: 1.5em;
  margin-top: 1.5rem;
}

#feedback-stats .col {
  margin-bottom: 1rem;
}

#feedback-stats .fifth {
  text-align: right;
  font-size: 2rem;
  font-weight: 600;
  line-height: 1;
  color: #094771;
}

#feedback-stats .four-fifths {
  color: #333;
}

.feedback-form,
#others-feedback {
  padding-top: 1em;
}

.feedback-form .field--checkbox label {
  color: #999;
  margin-bottom: 1em;
}

.feedback-form .field--checkbox input {
  float: left;
  margin: 5px;
}

.feedback-form textarea {
  width: 100%;
}

#others-feedback {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

#others-feedback h3 a {
  float: right;
  display: block;
  width: 36px;
  height: 36px;
  background: url(png/icon-map.png) no-repeat 100% 0;
  -webkit-background-size: 36px 36px;
  background-size: 36px;
}

#others-feedback h3 a span {
  display: block;
  text-indent: -9999px;
}

#others-feedback > ul {
  background: #fff;
  border: 2px solid #9e9e9d;
  border-radius: 3px;
  padding: 1em 2em;
  overflow-y: auto;
}

#others-feedback > ul > li {
  list-style: none;
  border-left: 2px solid #004589;
  padding-left: 1em;
  margin-bottom: 2em;
}

#others-feedback > ul li.nzta {
  border-left-color: #009b15;
  background: url(png/nzta-small.png) no-repeat 1em 0;
  padding-top: 35px;
}

.others-feedback__name {
  font-size: 1.1rem;
  font-weight: 600;
  color: #305f83;
}

#others-feedback ul li.nzta .others-feedback__name {
  color: #009b15;
}

#others-feedback ul li.nzta .others-feedback__location {
  color: #009b15;
}

.others-feedback_comment {
  color: #333;
}

.others-feedback_date {
  color: #333;
  font-size: 0.9rem;
}

#feedback-map {
  position: relative;
}

#feedback-map > a {
  position: absolute;
  top: 10px;
  right: 10px;
  border-radius: 5px;
  background: #094771 url(png/icon-form.png) no-repeat 2px 2px;
  -webkit-background-size: 40px 40px;
  background-size: 40px;
  padding: 10px 10px 10px 50px;
  color: #fff;
  display: block;
  z-index: 1;
}

#feedback-map__map {
  height: 550px;
  z-index: 0;
}

#feedback-map__sidebar {
  position: absolute;
  left: 0;
  top: 10px;
  z-index: 1;
  display: none;
}

.feedback-map__sidebar {
  margin: 20px 0 0;
  width: 200px;
  /* set this to be narrower than the form, so we can get at the marker that sits underneath */
}

.feedback-map__sidebar__pin {
  padding: 10px;
  width: 200px;
  background: #fff;
  font-weight: 600;
  border-radius: 0 5px 0 0;
}

.feedback-map__sidebar .feedback-form {
  padding: 10px;
  width: 250px;
  background: #fff;
  border-radius: 0 5px 0 0;
  display: none;
}

.feedback-map__sidebar .feedback-form h3 {
  font-size: 1rem;
}

.feedback-map__sidebar__toggle-feedback {
  padding: 10px;
  width: 250px;
  border-radius: 0 0 5px 0;
  display: block;
  color: #fff;
  background-color: #094771;
  background-image: url(png/marker-feedback.png), url(png/marker-feedback.png);
  -webkit-background-size: 26px 26px;
  background-size: 26px;
  background-position: 98% 5px, 96% 8px;
  background-repeat: no-repeat;
}

.feedback-map__sidebar__toggle-feedback:hover {
  color: #efefef;
}

#feedback-confirmation {
  display: none;
  position: relative;
}

.feedback-map__infobox {
  background-color: #e5e5e5;
  color: #333;
  font-size: 1rem;
  text-align: left;
}

.feedback-map__infobox .grid:first-child {
  width: 310px;
  margin-bottom: 10px;
}

.feedback-map__infobox .grid:first-child > .col {
  font-size: 0.9rem;
}

.feedback-map__infobox__name {
  color: #002557;
}

.feedback-map__infobox__feedback__comment {
  max-height: 200px;
  padding-right: 10px;
  overflow-y: auto;
  margin-bottom: 10px;
}

.feedback-map__infobox__reply {
  display: none;
}

.vote {
  display: inline-block;
  margin-left: 5px;
}

.vote span {
  display: inline-block;
  width: 20px;
  height: 19px;
  background-image: url(png/updown.png);
  background-repeat: no-repeat;
  position: relative;
  top: 3px;
}

.vote--up span {
  background-position: 0 100%;
}

.vote--down span {
  background-position: 100% 100%;
  margin-left: 2px;
}

/* ISOTOPE */

.grid--isotope {
  margin: 1rem 0;
}

.color-buttons {
  background: #f1f3f6;
  padding: 20px 20px 15px;
}

.color-buttons--isotope {
  width: 98%;
}

.color-buttons--age {
  background: #dde0e5;
}

.color-buttons h3 {
  font-weight: 600;
  font-size: 1rem;
  margin: 0;
}

.col--isotope {
  width: 45%;
  background: #dde0e5;
  margin: 0 2.5% 20px 2.5%;
  position: relative;
  border-bottom-width: 10px;
  border-bottom-style: solid;
  display: inline-block;
}

.col--isotope__image {
  display: none;
  position: relative;
  left: 10%;
  width: 80%;
  margin-top: 20px;
  -webkit-background-size: cover;
  background-size: cover;
  height: auto;
}

.color-buttons--button {
  color: #fff;
  padding: 5px 10px;
  margin: 0 10px 5px 0;
  border-radius: 3px;
  opacity: 0.8;
  -webkit-transition: opacity .3s;
  -moz-transition: opacity .3s;
  transition: opacity .3s;
  background: #456ea0;
}

.color-buttons--button:hover {
  opacity: 1;
}

.color-buttons--button.active {
  opacity: 1;
  font-weight: 600;
}

.color-buttons--button--all {
  background: #456ea0;
}

.col--isotope__image {
  display: block;
}

.col--isotope h3 {
  line-height: 1;
  margin: 1rem 0 .5rem 0;
}

.col--isotope__description {
  font-size: 0.8rem;
}

.col--isotope__overlay {
  display: none;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  position: absolute;
  top: 0;
  left: 0;
  text-align: center;
  z-index: 1;
}

.col--isotope__link {
  background: #fff;
  padding: 10px;
  position: absolute;
  top: 40%;
  left: 25%;
  width: 50%;
  z-index: 1;
  border-radius: 5px;
  font-weight: 600;
  font-size: 1.1em;
}

/* GALLERY */

.project-gallery-nav li {
  display: inline-block;
}

.project-gallery-nav a {
  display: block;
  color: #fff;
  padding: 5px 10px;
  margin: 0 10px 5px 0;
  border-radius: 3px;
  background: #456ea0;
}

.project-gallery-nav a:hover {
  background: #00456B;
}

.project-gallery figcaption {
  text-align: center;
  font-size: 0.85rem;
  overflow: hidden;
  margin-bottom: 10px;
  line-height: 1.2rem;
  color: #333;
}

.project-gallery figure img {
  width: 100%;
}

.project-galleries .col--isotope {
  border-bottom-width: 0;
  padding-top: 20px;
  background-color: #ddd;
}

.project-galleries .col--isotope:hover {
  background-color: #e7e7e7;
}

.project-galleries figcaption {
  text-align: center;
  font-size: 0.85rem;
  overflow: hidden;
  margin-bottom: 10px;
  line-height: 1.2rem;
  color: #333;
}

.project-galleries img {
  width: 100%;
}

.project-galleries .top {
  display: inline-block;
}

.project-galleries .top:before {
  background-position: 0 0;
}

/* MEDIA SECTION */

.grid--media .col > ul > li {
  margin-bottom: 1em;
}

.grid--media .arrow-toggle {
  margin: 0;
  padding-left: 1em;
}

.grid--media .col .grid .large-3 {
  color: #999;
}

.grid--media .arrow-toggle__content {
  background: #f2f4f7;
  padding: 2rem;
}

.grid--media .title-highlight h3,
.grid--media .innovation-article .innovationarticle-grid .innovationarticle-overview h3 h3,
.innovation-article .innovationarticle-grid .innovationarticle-overview .grid--media h3 h3,
.grid--media .innovation-article .innovationarticle-grid .innovationarticle-content h3 h3,
.innovation-article .innovationarticle-grid .innovationarticle-content .grid--media h3 h3,
.grid--media .lesson-alert .lessonalert-grid .lessonalert-overview h1 h3,
.lesson-alert .lessonalert-grid .lessonalert-overview .grid--media h1 h3,
.grid--media .lesson-alert .lessonalert-grid .lessonalert-overview h2 h3,
.lesson-alert .lessonalert-grid .lessonalert-overview .grid--media h2 h3,
.grid--media .lesson-alert .lessonalert-grid .lessonalert-overview h3 h3,
.lesson-alert .lessonalert-grid .lessonalert-overview .grid--media h3 h3,
.grid--media .lesson-alert .lessonalert-grid .lessonalert-overview h4 h3,
.lesson-alert .lessonalert-grid .lessonalert-overview .grid--media h4 h3,
.grid--media .lesson-alert .lessonalert-grid .lessonalert-overview h5 h3,
.lesson-alert .lessonalert-grid .lessonalert-overview .grid--media h5 h3,
.grid--media .lesson-alert .lessonalert-grid .lessonalert-overview h6 h3,
.lesson-alert .lessonalert-grid .lessonalert-overview .grid--media h6 h3,
.grid--media .landing-overview h1 h3,
.landing-overview .grid--media h1 h3,
.grid--media .landing-overview h2 h3,
.landing-overview .grid--media h2 h3,
.grid--media .landing-overview h3 h3,
.landing-overview .grid--media h3 h3,
.grid--media .landing-overview h4 h3,
.landing-overview .grid--media h4 h3,
.grid--media .landing-overview h5 h3,
.landing-overview .grid--media h5 h3,
.grid--media .landing-overview h6 h3,
.landing-overview .grid--media h6 h3,
.grid--media .highwayreview .highwayreview-grid .highwayreview-overview h1 h3,
.highwayreview .highwayreview-grid .highwayreview-overview .grid--media h1 h3,
.grid--media .highwayreview .highwayreview-grid .highwayreview-overview h2 h3,
.highwayreview .highwayreview-grid .highwayreview-overview .grid--media h2 h3,
.grid--media .highwayreview .highwayreview-grid .highwayreview-overview h3 h3,
.highwayreview .highwayreview-grid .highwayreview-overview .grid--media h3 h3,
.grid--media .highwayreview .highwayreview-grid .highwayreview-overview h4 h3,
.highwayreview .highwayreview-grid .highwayreview-overview .grid--media h4 h3,
.grid--media .highwayreview .highwayreview-grid .highwayreview-overview h5 h3,
.highwayreview .highwayreview-grid .highwayreview-overview .grid--media h5 h3,
.grid--media .highwayreview .highwayreview-grid .highwayreview-overview h6 h3,
.highwayreview .highwayreview-grid .highwayreview-overview .grid--media h6 h3,
.grid--media .highwayreview .highwayreview-grid .highwayreview-content h1 h3,
.highwayreview .highwayreview-grid .highwayreview-content .grid--media h1 h3,
.grid--media .highwayreview .highwayreview-grid .highwayreview-content h2 h3,
.highwayreview .highwayreview-grid .highwayreview-content .grid--media h2 h3,
.grid--media .highwayreview .highwayreview-grid .highwayreview-content h3 h3,
.highwayreview .highwayreview-grid .highwayreview-content .grid--media h3 h3,
.grid--media .highwayreview .highwayreview-grid .highwayreview-content h4 h3,
.highwayreview .highwayreview-grid .highwayreview-content .grid--media h4 h3,
.grid--media .highwayreview .highwayreview-grid .highwayreview-content h5 h3,
.highwayreview .highwayreview-grid .highwayreview-content .grid--media h5 h3,
.grid--media .highwayreview .highwayreview-grid .highwayreview-content h6 h3,
.highwayreview .highwayreview-grid .highwayreview-content .grid--media h6 h3 {
  margin-bottom: .5rem;
}

.grid--media .title-highlight p,
.grid--media .innovation-article .innovationarticle-grid .innovationarticle-overview h3 p,
.innovation-article .innovationarticle-grid .innovationarticle-overview .grid--media h3 p,
.grid--media .innovation-article .innovationarticle-grid .innovationarticle-content h3 p,
.innovation-article .innovationarticle-grid .innovationarticle-content .grid--media h3 p,
.grid--media .lesson-alert .lessonalert-grid .lessonalert-overview h1 p,
.lesson-alert .lessonalert-grid .lessonalert-overview .grid--media h1 p,
.grid--media .lesson-alert .lessonalert-grid .lessonalert-overview h2 p,
.lesson-alert .lessonalert-grid .lessonalert-overview .grid--media h2 p,
.grid--media .lesson-alert .lessonalert-grid .lessonalert-overview h3 p,
.lesson-alert .lessonalert-grid .lessonalert-overview .grid--media h3 p,
.grid--media .lesson-alert .lessonalert-grid .lessonalert-overview h4 p,
.lesson-alert .lessonalert-grid .lessonalert-overview .grid--media h4 p,
.grid--media .lesson-alert .lessonalert-grid .lessonalert-overview h5 p,
.lesson-alert .lessonalert-grid .lessonalert-overview .grid--media h5 p,
.grid--media .lesson-alert .lessonalert-grid .lessonalert-overview h6 p,
.lesson-alert .lessonalert-grid .lessonalert-overview .grid--media h6 p,
.grid--media .landing-overview h1 p,
.landing-overview .grid--media h1 p,
.grid--media .landing-overview h2 p,
.landing-overview .grid--media h2 p,
.grid--media .landing-overview h3 p,
.landing-overview .grid--media h3 p,
.grid--media .landing-overview h4 p,
.landing-overview .grid--media h4 p,
.grid--media .landing-overview h5 p,
.landing-overview .grid--media h5 p,
.grid--media .landing-overview h6 p,
.landing-overview .grid--media h6 p,
.grid--media .highwayreview .highwayreview-grid .highwayreview-overview h1 p,
.highwayreview .highwayreview-grid .highwayreview-overview .grid--media h1 p,
.grid--media .highwayreview .highwayreview-grid .highwayreview-overview h2 p,
.highwayreview .highwayreview-grid .highwayreview-overview .grid--media h2 p,
.grid--media .highwayreview .highwayreview-grid .highwayreview-overview h3 p,
.highwayreview .highwayreview-grid .highwayreview-overview .grid--media h3 p,
.grid--media .highwayreview .highwayreview-grid .highwayreview-overview h4 p,
.highwayreview .highwayreview-grid .highwayreview-overview .grid--media h4 p,
.grid--media .highwayreview .highwayreview-grid .highwayreview-overview h5 p,
.highwayreview .highwayreview-grid .highwayreview-overview .grid--media h5 p,
.grid--media .highwayreview .highwayreview-grid .highwayreview-overview h6 p,
.highwayreview .highwayreview-grid .highwayreview-overview .grid--media h6 p,
.grid--media .highwayreview .highwayreview-grid .highwayreview-content h1 p,
.highwayreview .highwayreview-grid .highwayreview-content .grid--media h1 p,
.grid--media .highwayreview .highwayreview-grid .highwayreview-content h2 p,
.highwayreview .highwayreview-grid .highwayreview-content .grid--media h2 p,
.grid--media .highwayreview .highwayreview-grid .highwayreview-content h3 p,
.highwayreview .highwayreview-grid .highwayreview-content .grid--media h3 p,
.grid--media .highwayreview .highwayreview-grid .highwayreview-content h4 p,
.highwayreview .highwayreview-grid .highwayreview-content .grid--media h4 p,
.grid--media .highwayreview .highwayreview-grid .highwayreview-content h5 p,
.highwayreview .highwayreview-grid .highwayreview-content .grid--media h5 p,
.grid--media .highwayreview .highwayreview-grid .highwayreview-content h6 p,
.highwayreview .highwayreview-grid .highwayreview-content .grid--media h6 p {
  color: #333;
}

.grid--media .arrow-toggle__content > *:last-child {
  padding-bottom: 0;
  margin-bottom: 0;
}

li.media--archive {
  display: none;
}

/* HELPERS */

.hw-close {
  background: url(png/x.png) no-repeat 0 0;
  width: 17px;
  height: 18px;
  display: block;
  position: absolute;
  right: 10px;
  top: 10px;
}

.hw-close span {
  display: block;
  text-indent: -9999px;
}

/**
 * SMALL
 */

.gallery--flickr-link {
  display: inline-block;
}

/**
 * Overview page - Gallery block
 * Note: this inherits and overrides .block-gallery in {@link _blocks.scss}
 */

.block-gallery.block-gallery--highways .grid--gallery__image {
  padding-left: 0;
  padding-right: 0;
}

.block-gallery.block-gallery--highways .grid--gallery__image a,
.block-gallery.block-gallery--highways .grid--gallery__image div {
  margin: 0;
}

/**
 * 	MEDIUM
 */

@media only screen and (min-width: 37.5em) {
  .grid--medium--table {
    display: table;
    width: auto;
  }

  .grid--medium--table > .col {
    display: table-cell;
  }

  .col--isotope {
    width: 30%;
    margin: 0 1.5% 20px 1.5%;
  }

  .color-buttons div {
    margin-left: 110px;
  }

  .color-buttons h3 {
    float: left;
    text-align: right;
    width: 100px;
    margin-right: 10px;
  }

  #consultation-dates p {
    margin-top: 2rem;
  }

  /* social media needs to be positioned absolutely to get it over the left hand margin */

  #social-media {
    position: relative;
  }

  #social-media > div {
    position: absolute;
    left: 0;
    top: 20px;
  }

  #social-media > div > span {
    display: block;
  }

  .others-feedback_date {
    text-align: right;
  }

  .gallery--flickr-link {
    display: none;
  }
}

/*
 * LARGE
 */

@media only screen and (min-width: 60em) {
  .grid--large--table {
    display: table;
    width: auto;
  }

  .grid--large--table > .col {
    display: table-cell;
  }

  .filters {
    padding: 1.5rem 2rem 1.5rem;
    background: #fff;
  }

  .filters__label {
    background: none;
    z-index: 4;
    /* we use this for detection in the highways.js file */
  }

  .filters__label a {
    color: #094771;
    cursor: default;
  }

  .filters__label a:before {
    display: none;
  }

  .filters > div {
    display: inline-block;
  }

  .filter__options {
    width: 200px;
  }

  .filter__options ul {
    position: absolute;
  }

  .col--isotope {
    width: 23%;
    margin: 0 2% 20px 0;
  }

  .feedback-form {
    width: 90%;
  }

  #others-feedback {
    margin-top: -1rem;
  }

  /* COMPACT FORMS */

  .form--compact > div {
    margin-bottom: 15px !important;
  }

  .form--compact label {
    line-height: 1;
    font-size: 0.8rem;
  }

  .form--compact input,
  .form--compact select {
    padding: 2px;
  }

  .form--compact .field--checkbox input {
    margin-top: 1px;
  }

  .form--compact .btn--submit {
    margin-bottom: 1rem;
    line-height: 2rem;
  }
}

/**
 * NZTA Highways Projects (these styles are not in pattern library)
 */

.project-list .project-main-image {
  background-color: #F2F4F7;
}

.project-purpose.theme--dark .project-benefits {
  background: #fff;
  color: #555;
}

.project-purpose.theme--dark .project-benefits .title-highlight,
.project-purpose.theme--dark .project-benefits .innovation-article .innovationarticle-grid .innovationarticle-overview h3,
.innovation-article .innovationarticle-grid .innovationarticle-overview .project-purpose.theme--dark .project-benefits h3,
.project-purpose.theme--dark .project-benefits .innovation-article .innovationarticle-grid .innovationarticle-content h3,
.innovation-article .innovationarticle-grid .innovationarticle-content .project-purpose.theme--dark .project-benefits h3,
.project-purpose.theme--dark .project-benefits .lesson-alert .lessonalert-grid .lessonalert-overview h1,
.lesson-alert .lessonalert-grid .lessonalert-overview .project-purpose.theme--dark .project-benefits h1,
.project-purpose.theme--dark .project-benefits .lesson-alert .lessonalert-grid .lessonalert-overview h2,
.lesson-alert .lessonalert-grid .lessonalert-overview .project-purpose.theme--dark .project-benefits h2,
.project-purpose.theme--dark .project-benefits .lesson-alert .lessonalert-grid .lessonalert-overview h3,
.lesson-alert .lessonalert-grid .lessonalert-overview .project-purpose.theme--dark .project-benefits h3,
.project-purpose.theme--dark .project-benefits .lesson-alert .lessonalert-grid .lessonalert-overview h4,
.lesson-alert .lessonalert-grid .lessonalert-overview .project-purpose.theme--dark .project-benefits h4,
.project-purpose.theme--dark .project-benefits .lesson-alert .lessonalert-grid .lessonalert-overview h5,
.lesson-alert .lessonalert-grid .lessonalert-overview .project-purpose.theme--dark .project-benefits h5,
.project-purpose.theme--dark .project-benefits .lesson-alert .lessonalert-grid .lessonalert-overview h6,
.lesson-alert .lessonalert-grid .lessonalert-overview .project-purpose.theme--dark .project-benefits h6,
.project-purpose.theme--dark .project-benefits .landing-overview h1,
.landing-overview .project-purpose.theme--dark .project-benefits h1,
.project-purpose.theme--dark .project-benefits .landing-overview h2,
.landing-overview .project-purpose.theme--dark .project-benefits h2,
.project-purpose.theme--dark .project-benefits .landing-overview h3,
.landing-overview .project-purpose.theme--dark .project-benefits h3,
.project-purpose.theme--dark .project-benefits .landing-overview h4,
.landing-overview .project-purpose.theme--dark .project-benefits h4,
.project-purpose.theme--dark .project-benefits .landing-overview h5,
.landing-overview .project-purpose.theme--dark .project-benefits h5,
.project-purpose.theme--dark .project-benefits .landing-overview h6,
.landing-overview .project-purpose.theme--dark .project-benefits h6,
.project-purpose.theme--dark .project-benefits .highwayreview .highwayreview-grid .highwayreview-overview h1,
.highwayreview .highwayreview-grid .highwayreview-overview .project-purpose.theme--dark .project-benefits h1,
.project-purpose.theme--dark .project-benefits .highwayreview .highwayreview-grid .highwayreview-overview h2,
.highwayreview .highwayreview-grid .highwayreview-overview .project-purpose.theme--dark .project-benefits h2,
.project-purpose.theme--dark .project-benefits .highwayreview .highwayreview-grid .highwayreview-overview h3,
.highwayreview .highwayreview-grid .highwayreview-overview .project-purpose.theme--dark .project-benefits h3,
.project-purpose.theme--dark .project-benefits .highwayreview .highwayreview-grid .highwayreview-overview h4,
.highwayreview .highwayreview-grid .highwayreview-overview .project-purpose.theme--dark .project-benefits h4,
.project-purpose.theme--dark .project-benefits .highwayreview .highwayreview-grid .highwayreview-overview h5,
.highwayreview .highwayreview-grid .highwayreview-overview .project-purpose.theme--dark .project-benefits h5,
.project-purpose.theme--dark .project-benefits .highwayreview .highwayreview-grid .highwayreview-overview h6,
.highwayreview .highwayreview-grid .highwayreview-overview .project-purpose.theme--dark .project-benefits h6,
.project-purpose.theme--dark .project-benefits .highwayreview .highwayreview-grid .highwayreview-content h1,
.highwayreview .highwayreview-grid .highwayreview-content .project-purpose.theme--dark .project-benefits h1,
.project-purpose.theme--dark .project-benefits .highwayreview .highwayreview-grid .highwayreview-content h2,
.highwayreview .highwayreview-grid .highwayreview-content .project-purpose.theme--dark .project-benefits h2,
.project-purpose.theme--dark .project-benefits .highwayreview .highwayreview-grid .highwayreview-content h3,
.highwayreview .highwayreview-grid .highwayreview-content .project-purpose.theme--dark .project-benefits h3,
.project-purpose.theme--dark .project-benefits .highwayreview .highwayreview-grid .highwayreview-content h4,
.highwayreview .highwayreview-grid .highwayreview-content .project-purpose.theme--dark .project-benefits h4,
.project-purpose.theme--dark .project-benefits .highwayreview .highwayreview-grid .highwayreview-content h5,
.highwayreview .highwayreview-grid .highwayreview-content .project-purpose.theme--dark .project-benefits h5,
.project-purpose.theme--dark .project-benefits .highwayreview .highwayreview-grid .highwayreview-content h6,
.highwayreview .highwayreview-grid .highwayreview-content .project-purpose.theme--dark .project-benefits h6 {
  color: #00456B;
}