/* Variables */

:root {

  --scrollbar-width: 0px;

}

/* Reset */

* {

  padding: 0;

  margin: 0;

  text-decoration: inherit;

  text-transform: inherit;

  list-style-type: inherit;

  list-style-position: inherit;

  letter-spacing: inherit;

  line-height: inherit;

  text-align: inherit;

  font-family: inherit;

  font-weight: inherit;

  font-style: inherit;

  font-size: inherit;

  color: inherit;

  background-color: transparent;

  box-sizing: border-box;

  border: none;

}

/* Generic */

html {

  scroll-behavior: smooth;

}

body {

  font-family: "Gotham SSm A", "Gotham SSm B", helvetica, sans-serif;

  font-weight: 400;

  font-size: 16px;

  color: #012a3a;

}

button:not( [ disabled ] ) {

  cursor: pointer;

}

em {

  font-style: italic;

}

del {
  
  text-decoration: line-through;
  
}

strong {

  font-weight: 700;

}

/* Utilities */

.sr-only,

.sr-only-focusable {

  overflow: hidden;

  position: absolute;

  width: 1px;

  height: 1px;

  padding: 0;

  margin: -1px;

  clip: rect( 0, 0, 0, 0 );

  border: 0;

}

.sr-only-focusable:focus {

  position: relative;

  width: auto;

  height: auto;

  padding: initial;

  margin: initial;

  clip: initial;

  border: initial;

}

.no-transitions,

.no-transitions * {

  transition: none !important;

}

/* Rich Text */

.rich-text {

  overflow: hidden;

}

.rich-text .negate {

  margin: -64px 0;

}

.rich-text .consume {

  margin: 64px 0;

}

.rich-text sup,

.rich-text sub {

  margin-left: 0.1em;

  font-size: 12px;

}

.rich-text a {

  color: #0075bb;

}

.rich-text a:hover,

.rich-text a:focus {

  text-decoration: underline;

}

.rich-text .h2,

.rich-text h2,

.rich-text .h3,

.rich-text h3,

.rich-text .h4,

.rich-text h4,

.rich-text .h5,

.rich-text h5,

.rich-text .h6,

.rich-text h6 {

  font-family: "Gotham A", "Gotham B", helvetica, sans-serif;

  margin: 64px 0 32px 0;

  font-weight: 700;

}

.rich-text .h2,

.rich-text h2 {

  font-size: 28px;

}

.rich-text .h3,

.rich-text h3 {

  font-size: 24px;

}

.rich-text .h4,

.rich-text h4 {

  font-size: 22px;

}

.rich-text .h5,

.rich-text h5 {

  font-size: 20px;

}

.rich-text .h6,

.rich-text h6 {

  font-size: 18px;

}

.rich-text .h2 small,

.rich-text h2 small,

.rich-text .h3 small,

.rich-text h3 small {
  
  display: block;

  margin: 12px 0;

  font-family: "Gotham SSm A", "Gotham SSm B", helvetica, sans-serif;

  font-size: 12px;
  
}

.rich-text .h2 small,

.rich-text h2 small {

  letter-spacing: 3px;

  text-transform: uppercase;

  font-weight: 700;

}

.rich-text .h3 small,

.rich-text h3 small {

  font-weight: 400;
  
  font-style: italic;
  
  opacity: 0.8;

}

.rich-text p {

  margin: 32px 0;

  line-height: 2em;

}

@media ( min-width: 768px ) {
  
  .rich-text p.two-column {
  
    columns: auto 2;
    
  }
  
}

.rich-text .h2 + p,

.rich-text h2 + p,

.rich-text .h3 + p,

.rich-text h3 + p,

.rich-text .h4 + p,

.rich-text h4 + p,

.rich-text .h5 + p,

.rich-text h5 + p,

.rich-text .h6 + p,

.rich-text h6 + p,

.rich-text p + p {

  margin-top: -16px;

}

.rich-text ul,

.rich-text ol {

  list-style-position: outside;

  padding-left: 32px;

  margin: 32px 0;

}

.rich-text ul {

  list-style-type: disc;

}

.rich-text ol {

  list-style-type: decimal;

}

.rich-text li {

  margin: 16px 0;

  line-height: 2em;

}

.rich-text pre,

.rich-text code {

  margin: 64px 0;

  font-family: monospace;

  font-size: 12px;

}

.rich-text blockquote {
  
  margin: 32px 0;
  
  padding-left: 16px;
  
  line-height: 1.5em;
  
  font-family: "Sentinel A", "Sentinel B", helvetica, serif;

  font-size: 26px;
  
  border-left: 4px solid #012a3a;

}

.rich-text .h2 + blockquote,

.rich-text h2 + blockquote,

.rich-text .h3 + blockquote,

.rich-text h3 + blockquote,

.rich-text .h4 + blockquote,

.rich-text h4 + blockquote,

.rich-text .h5 + blockquote,

.rich-text h5 + blockquote,

.rich-text .h6 + blockquote,

.rich-text h6 + blockquote {

  margin-top: -16px;

}

.rich-text blockquote p {
  
  line-height: inherit;
  
}

.rich-text .table {

  overflow-x: scroll;

  margin: 64px 0;

  border-width: 0 1px 1px 1px;

  border-style: solid;

  border-color: #ccc;

}

.rich-text table {

  width: 100%;

  border-spacing: 0;

  border-collapse: collapse;

}

.rich-text table th {

  padding: 12px;

  font-weight: 700;

  border: 1px solid #ccc;

}

.rich-text table td {

  padding: 12px;

  border: 1px solid #ccc;

}

.rich-text table th:first-child,

.rich-text table td:first-child {

  border-left: none;

}

.rich-text table th:last-child,

.rich-text table td:last-child {

  border-right: none;

}

.rich-text img[ tabindex = "0" ] {

  cursor: pointer;

}

@media ( min-width: 768px ) {

  .rich-text .h2,

  .rich-text h2 {

    font-size: 36px;

  }

  .rich-text .h3,

  .rich-text h3 {

    font-size: 32px;

  }

  .rich-text .h4,
  
  .rich-text h4 {

    font-size: 28px;

  }

  .rich-text .h5,
  
  .rich-text h5 {

    font-size: 24px;

  }

  .rich-text .h6,
  
  .rich-text h6 {

    font-size: 20px;

  }

  .rich-text blockquote {

    padding-left: 32px;

    font-size: 30px;
      
  }

}

/* Buttons */

.buttons {

  margin: -6px;

}

.buttons a,

.buttons button,

.buttons .shape {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  max-width: calc( 100% - 12px );

  height: 40px;

  padding: 0 40px;

  margin: 6px;

  text-decoration: none !important;

  font-weight: 700;

  font-size: 14px;

  border-width: 2px;

  border-style: solid;

  border-radius: 20px;

  transition: color 0.25s, background-color 0.25s, border-color 0.25s;

}

.buttons .solid-white,

.buttons .hover-solid-white:hover,

.buttons .hover-solid-white:focus,

a:hover .buttons .hover-solid-white,

a:focus .buttons .hover-solid-white,

button:hover .buttons .hover-solid-white,

button:focus .buttons .hover-solid-white {

  color: #012a3a;

  background-color: #fff;

  border-color: #fff;

}

.buttons .solid-blue,

.buttons .hover-solid-blue:hover,

.buttons .hover-solid-blue:focus,

a:hover .buttons .hover-solid-blue,

a:focus .buttons .hover-solid-blue,

button:hover .buttons .hover-solid-blue,

button:focus .buttons .hover-solid-blue {

  color: #fff;

  background-color: #0075bb;

  border-color: #0075bb;

}

.buttons .solid-navy,

.buttons .hover-solid-navy:hover,

.buttons .hover-solid-navy:focus,

a:hover .buttons .hover-solid-navy,

a:focus .buttons .hover-solid-navy,

button:hover .buttons .hover-solid-navy,

button:focus .buttons .hover-solid-navy {

  color: #fff;

  background-color: #012a3a;

  border-color: #012a3a;

}

.buttons .outline-white,

.buttons .hover-outline-white:hover,

.buttons .hover-outline-white:focus,

a:hover .buttons .hover-outline-white,

a:focus .buttons .hover-outline-white,

button:hover .buttons .hover-outline-white,

button:focus .buttons .hover-outline-white {

  color: #fff;

  background-color: transparent;

  border-color: #fff;

}

.buttons .outline-navy,

.buttons .hover-outline-navy:hover,

.buttons .hover-outline-navy:focus,

a:hover .buttons .hover-outline-navy,

a:focus .buttons .hover-outline-navy,

button:hover .buttons .hover-outline-navy,

button:focus .buttons .hover-outline-navy {

  color: #012a3a;

  background-color: transparent;

  border-color: #012a3a;

}

.buttons i {

  margin: 0 24px;

}

.buttons i:first-child {

  margin-left: -24px;

}

.buttons i:last-child {

  margin-right: -24px;

}

.buttons .text {

  max-width: 100%;

  overflow: hidden;

  white-space: nowrap;

  text-overflow: ellipsis;

}

@media ( min-width: 768px ) {

  .buttons .w768-solid-white,

  .buttons .w768-hover-solid-white:hover,

  .buttons .w768-hover-solid-white:focus,

  a:hover .buttons .w768-hover-solid-white,

  a:focus .buttons .w768-hover-solid-white,

  button:hover .buttons .w768-hover-solid-white,

  button:focus .buttons .w768-hover-solid-white {

    color: #012a3a;

    background-color: #fff;

    border-color: #fff;

  }

  .buttons .w768-solid-blue,

  .buttons .w768-hover-solid-blue:hover,

  .buttons .w768-hover-solid-blue:focus,

  a:hover .buttons .w768-hover-solid-blue,

  a:focus .buttons .w768-hover-solid-blue,

  button:hover .buttons .w768-hover-solid-blue,

  button:focus .buttons .w768-hover-solid-blue {

    color: #fff;

    background-color: #0075bb;

    border-color: #0075bb;

  }

  .buttons .w768-solid-navy,

  .buttons .w768-hover-solid-navy:hover,

  .buttons .w768-hover-solid-navy:focus,

  a:hover .buttons .w768-hover-solid-navy,

  a:focus .buttons .w768-hover-solid-navy,

  button:hover .buttons .w768-hover-solid-navy,

  button:focus .buttons .w768-hover-solid-navy {

    color: #fff;

    background-color: #012a3a;

    border-color: #012a3a;

  }

  .buttons .w768-outline-white,

  .buttons .w768-hover-outline-white:hover,

  .buttons .w768-hover-outline-white:focus,

  a:hover .buttons .w768-hover-outline-white,

  a:focus .buttons .w768-hover-outline-white,

  button:hover .buttons .w768-hover-outline-white,

  button:focus .buttons .w768-hover-outline-white {

    color: #fff;

    background-color: transparent;

    border-color: #fff;

  }

  .buttons .w768-outline-navy,

  .buttons .w768-hover-outline-navy:hover,

  .buttons .w768-hover-outline-navy:focus,

  a:hover .buttons .w768-hover-outline-navy,

  a:focus .buttons .w768-hover-outline-navy,

  button:hover .buttons .w768-hover-outline-navy,

  button:focus .buttons .w768-hover-outline-navy {

    color: #012a3a;

    background-color: transparent;

    border-color: #012a3a;

  }
  
}

/* Bars */

.bars .bar {

  display: grid;

  grid-template: "time" "header" "kicker" "pricing";

  position: relative;

  min-height: 90px;

  margin: 24px 0;

  padding: 12px 0;

  background-color: #fff;

  box-shadow: 0 2px 8px rgba( 0, 0, 0, 0.125 );

  transition: box-shadow 0.25s, transform 0.25s;

}

.bars .bar:hover,

.bars .bar:focus {

  z-index: 1;

  box-shadow: 0 4px 16px rgba( 0, 0, 0, 0.125 );

  transform: scale( 1.05 );

}

.bars .bar .image {

  display: none;

  grid-area: image;

  background-size: cover;

}

.bars .bar time {

  grid-area: time;

  align-self: end;

  margin: 4px 16px;

  letter-spacing: 2.4px;

  text-transform: uppercase;

  font-size: 12px;

  font-weight: 700;

}

.bars .bar h2 {

  display: -webkit-box;

  -webkit-box-orient: vertical;

  overflow: hidden;

  grid-area: header;

  align-self: end;

  margin: 4px 16px;

  line-height: 1.3em;

  font-size: 18px;

  font-weight: 700;

  transition: color 0.25s;

}

.bars .bar:hover h2,

.bars .bar:focus h2 {

  color: #0075bb;

}

.bars .bar .kicker {

  display: -webkit-box;

  -webkit-box-orient: vertical;

  -webkit-line-clamp: 1;

  overflow: hidden;

  grid-area: kicker;

  height: 16px;

  margin: 4px 16px;

  font-size: 14px;

  color: #345561;

}

.bars .bar .pricing {

  display: flex;

  align-items: center;

  grid-area: pricing;

  margin: 4px 12px;

  font-size: 14px;

  color: #345561;

}

.bars .bar .pricing * {
  
  margin: 0 4px;

}

.bars .bar .pricing i {

  color: #00a376;

}

@media ( min-width: 768px ) {

  .bars .bar {

    grid-template:

      "image header time"

      "image kicker pricing" / 180px 1fr;

    padding: 0;

  }

  .bars .bar .image {

    display: block;

    background-position: center;

    background-size: cover;

  }

  .bars .bar h2 {

    -webkit-line-clamp: 2;

  }

  .bars .bar h2,

  .bars .bar time {

    margin-top: 16px;

  }

  .bars .bar .kicker,

  .bars .bar .pricing {

    margin-bottom: 16px;

  }
      
  .bars .bar .pricing {
    
    flex-direction: row-reverse;
    
  }

}

/* Wide and Narrow Cards */

.cards .wide.card,

.cards .narrow.card {

  position: relative;

  margin: 24px 12px;
  
  width: 100%;

  background-color: #fff;

  box-shadow: 0 2px 8px rgba( 0, 0, 0, 0.125 );

  transition: margin 0.25s, opacity 0.25s, visibility 0.25s, box-shadow 0.25s, transform 0.25s;

}

.cards .wide.card[ hidden ],

.cards .narrow.card[ hidden ] {

  display: block;

  opacity: 0;

  visibility: hidden;

}

.cards .wide.card {

  max-width: 384px;
  
  min-width: min( calc( 100vw * ( 282 / 320 ) - var( --scrollbar-width ) ), 384px );

}

.cards .narrow.card {

  max-width: 282px;

  min-width: min( calc( 100vw * ( 282 / 320 ) - var( --scrollbar-width ) ), 282px );

}

.cards .wide.card[ hidden = "to-left" ] {

  margin-left: calc( min( calc( 100vw * ( 294 / 320 ) - var( --scrollbar-width ) ), 396px ) * -1 );

}

.cards .wide.card[ hidden = "to-right" ] {

  margin-right: calc( min( calc( 100vw * ( 294 / 320 ) - var( --scrollbar-width ) ), 396px ) * -1 );

}

.cards .narrow.card[ hidden = "to-left" ] {

  margin-left: calc( min( calc( 100vw * ( 294 / 320 ) - var( --scrollbar-width ) ), 294px ) * -1 );

}

.cards .narrow.card[ hidden = "to-right" ] {

  margin-right: calc( min( calc( 100vw * ( 294 / 320 ) - var( --scrollbar-width ) ), 294px ) * -1 );

}

.cards .wide.card:hover,

.cards .wide.card:focus,

.cards .narrow.card:hover,

.cards .narrow.card:focus {

  z-index: 1;

  box-shadow: 0 4px 16px rgba( 0, 0, 0, 0.125 );

  transform: scale( 1.05 );

}

.cards .wide.card .image,

.cards .narrow.card .image {

  height: 282px;

  background-position: center;

  background-size: cover;

}

.cards .wide.card h2,

.cards .narrow.card h2 {

  margin: 16px;

}

.cards .wide.card h2 small,

.cards .narrow.card h2 small {

  display: -webkit-box;

  -webkit-box-orient: vertical;

  -webkit-line-clamp: 1;

  overflow: hidden;

  margin: 8px 0;

  text-transform: uppercase;

  letter-spacing: 2.5px;

  font-size: 12px;

  font-weight: 700;

  color: #526e78;

}

.cards .wide.card h2 span,

.cards .narrow.card h2 span {

  display: -webkit-box;

  -webkit-box-orient: vertical;

  -webkit-line-clamp: 3;

  overflow: hidden;

  min-height: 2.6em;

  line-height: 1.3em;

  font-size: 18px;

  font-weight: 700;

  transition: color 0.25s;

}

.cards .wide.card:hover h2 span,

.cards .wide.card:focus h2 span,

.cards .narrow.card:hover h2 span,

.cards .narrow.card:focus h2 span {

  color: #0075bb;

}

.cards .wide.card .row,

.cards .narrow.card .row {

  display: flex;

  align-items: center;

  justify-content: space-between;

  margin: 16px;

  font-size: 14px;

  color: #345561;

}

.cards .wide.card time *,

.cards .narrow.card time * {

  vertical-align: top;

}

.cards .wide.card time i,

.cards .narrow.card time i {

  color: #0075bb;

}

.cards .wide.card .pricing,

.cards .narrow.card .pricing,

.cards .wide.card .price,

.cards .narrow.card .price {

  display: -webkit-box;

  -webkit-box-orient: vertical;

  -webkit-line-clamp: 1;

  overflow: hidden;

}

.cards .wide.card .pricing i,

.cards .narrow.card .pricing i,

.cards .wide.card .price i,

.cards .narrow.card .price i {

  color: #00a376;

}

.cards .wide.card .row i + span,

.cards .wide.card .row span + i,

.cards .narrow.card .row i + span,

.cards .narrow.card .row span + i {

  margin-left: 8px;

}

/* Rainbow Cards */

.cards .rainbow.card {

  display: flex;

  flex-direction: column;

  background-color: #fff;

  width: 100%;

  margin: 12px;

  padding: 10px;

  border-radius: 6px;

  border-top: 16px solid;

  box-shadow: 0 2px 8px 0 rgba( 0, 0, 0, 0.15 );

}

.cards .rainbow.card[ data-text-alignment = "center" ] {

  text-align: center;

}

.cards .rainbow.card[ data-vertical-justification = "apart" ] {

  justify-content: space-between;

}

.cards .rainbow.card[ data-color = "none" ] {

  border-top: none;

}

.cards .rainbow.card[ data-color = "turquoise" ] {

  border-top-color: #68d2df;

}

.cards .rainbow.card[ data-color = "green" ] {

  border-top-color: #00a376;

}

.cards .rainbow.card[ data-color = "blue" ] {

  border-top-color: #0075bb;

}

.cards .rainbow.card[ data-color = "purple" ] {

  border-top-color: #9e4fa5;

}

.cards .rainbow.card[ data-color = "navy" ] {

  border-top-color: #012a3a;

}

.cards .rainbow.card[ data-color = "orange" ] {

  border-top-color: #e56a54;

}

.cards .rainbow.card[ data-color = "yellow" ] {

  border-top-color: #ede04b;

}

.cards .rainbow.card h3 {

  margin: 20px 0;

}

.cards .rainbow.card h3 small {

  display: block;

  color: #526e78;

  font-size: 12px;

  font-weight: 700;

  letter-spacing: 3px;

  text-transform: uppercase;

  margin: 20px 0;

}

.cards .rainbow.card h3 span {

  font-family: "Gotham A", "Gotham B", helvetica, sans-serif;

  font-size: 32px;

  font-weight: 700;

}

.cards .rainbow.card p {

  overflow: hidden;

  margin: 20px 0;

  line-height: 1.5em;

  font-size: 14px;

}

.cards .rainbow.card .text a,

.cards .rainbow.card .subtext a {

  color: #0075bb;

}

.cards .rainbow.card .text a:hover,

.cards .rainbow.card .text a:focus,

.cards .rainbow.card .subtext a:hover,

.cards .rainbow.card .subtext a:focus {

  text-decoration: underline;

}

.cards .rainbow.card hr {

  border: 1px solid #d4dbde;

  width: 90%;

  margin: 0 auto;

}

.cards .rainbow.card .price {

  font-size: 32px;

  line-height: 40px;

  letter-spacing: -0.47px;

}

.cards .rainbow.card .pipe {

  color: #d4dbde;

  font-weight: 700;

  margin: 0 15px;

}

.cards .rainbow.card nav {

  overflow: hidden;

  margin: 24px 0 16px 0;

}

.cards .rainbow.card .links {

  margin: 24px 0 16px 0;

}

.cards .rainbow.card .links a {

  font-size: 14px;

  font-weight: 700;

  transition: color 0.25s;

}

.cards .rainbow.card .links a:hover,

.cards .rainbow.card .links a:focus {

  color: #0075bb;

}

.cards .rainbow.card .links a .underline .text {

  line-height: 1.5em;

  padding-bottom: 3px;

  background-size: 0 2px;

  background-repeat: no-repeat;

  background-position: bottom left;

  background-image: linear-gradient( to right, #0075bb 0%, #0075bb 100% );

  transition: background-size 0.25s;

}

.cards .rainbow.card .links a:hover .underline .text,

.cards .rainbow.card .links a:focus .underline .text {

  background-size: 100% 2px;

}

@media ( min-width: 660px ) {
  
  .cards .rainbow.card {
  
    width: 282px;

    min-width: 282px;
    
  }
  
}

/* Grid Cells */

.grid .cell {

  display: flex;

  position: relative;

}

.grid .cell:first-child {

  align-items: flex-end;

  min-height: 534px;

  padding: 16px 32px;

}

.grid .cell:nth-child( n + 2 ) {

  height: 100px;

}

.grid .cell .image {

  min-width: 96px;

  background-position: center;

  background-size: cover;

  --background-gradient: linear-gradient( to bottom, transparent 0%, transparent 100% );

}

.grid .cell:first-child .image {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  --background-gradient: linear-gradient( to bottom, transparent 0%, rgba( 0, 0, 0, 0.8 ) 100% );

}

.grid .cell .content {

  position: relative;

}

.grid .cell:first-child .content {

  color: #fff;
  
  max-width: 384px;

}

.grid .cell:nth-child( n + 2 ) .content {

  display: flex;

  align-items: center;

  width: 100%;

  padding: 0 12px;

}

.grid .cell:not( :first-child ):nth-child( odd ) .content {

  background-color: #fff;

}

.grid .cell:nth-child( even ) .content {

  background-color: #f3f5f6;

}

.grid .cell h3 {

  width: 100%;

  margin: 16px 0;

}

.grid .cell h3 span {

  display: -webkit-inline-box;

  -webkit-box-orient: vertical;

  -webkit-line-clamp: 2;

  overflow: hidden;

}

.grid .cell:first-child h3 span {

  font-size: 24px;

  font-weight: 700;

}

.grid .cell:nth-child( n + 2 ) h3 span {

  font-size: 16px;

  font-weight: 700;

}

.grid .cell:nth-child( n + 2 ) h3 {

  transition: color 0.25s;

}

.grid .cell:hover:nth-child( n + 2 ) h3,

.grid .cell:focus:nth-child( n + 2 ) h3 {

  color: #0075bb;

}

.grid .cell h3 small {
  
  display: -webkit-box;

  -webkit-box-orient: vertical;

  -webkit-line-clamp: 2;

  overflow: hidden;

}

.grid .cell h3 small:first-child {
  
  letter-spacing: 3px;
  
  text-transform: uppercase;
  
  font-size: 12px;
  
  font-weight: 700;
  
}

.grid .cell h3 small:last-child {

  font-style: italic;

  font-size: 14px;

}

.grid .cell:nth-child( n + 2 ) h3 small {

  display: none;

}

.grid .cell:nth-child( n + 2 ) h3 span {

  line-height: 1.5em;

  padding-bottom: 3px;

  background-size: 0 2px;

  background-repeat: no-repeat;

  background-position: bottom left;

  background-image: linear-gradient( to right, #0075bb 0%, #0075bb 100% );

  transition: background-size 0.25s;

}

.grid .cell:hover:nth-child( n + 2 ) h3 span,

.grid .cell:focus:nth-child( n + 2 ) h3 span {

  background-size: 100% 2px;

}

.grid .cell i {

  margin-left: 16px;

  transition: color 0.25s;

}

.grid .cell:hover i,

.grid .cell:focus i {

  color: #0075bb;

}

.grid .cell p {

  display: -webkit-box;

  -webkit-box-orient: vertical;

  -webkit-line-clamp: 4;

  overflow: hidden;

  margin: 16px 0;

  font-size: 14px;

  line-height: 1.5em;

}

.grid .cell .mock-nav {

  margin: 16px 0;

}

.grid .cell .mock-nav .shape {

  height: 32px;

  padding: 0 16px;

  border-width: 1px;

  border-radius: 16px;

}

@media ( min-width: 450px ) {

  .grid .cell .image {

    min-width: 136px;

  }

  .grid .cell:nth-child( n + 2 ) .content {

    padding: 0 16px;

  }

}

@media ( min-width: 768px ) {

  .grid .columns,
  
  .grid .rows {

    display: grid;

    grid-gap: 4px;

    height: 640px;

  }
  
  .grid .columns {

    grid-auto-flow: column;

    grid-template: repeat( 6, 1fr ) / 60% 1fr;

  }
  
  .grid .rows {

    grid-auto-flow: row;

    grid-template: 60% 1fr / repeat( 6, 1fr );

  }

  .grid .columns[ data-count = "5" ],

  .grid .columns[ data-count = "6" ] {

    grid-template: repeat( 6, 1fr ) / 50% 1fr 1fr;

  }
  
  .grid .rows[ data-count = "5" ],

  .grid .rows[ data-count = "6" ] {

    grid-template: 50% 1fr 1fr / repeat( 6, 1fr );

  }

  .grid .cell:first-child {
  
    min-height: initial;
    
  }

  .grid .columns .cell:first-child {

    grid-row-end: span 6;

  }
  
  .grid .rows .cell:first-child {

    grid-column-end: span 6;

  }

  .grid .columns[ data-count = "2" ] .cell:nth-child( 2 ) {

    grid-row-end: span 3;

  }
  
  .grid .rows[ data-count = "2" ] .cell:nth-child( 2 ) {

    grid-column-end: span 3;

  }

  .grid .columns[ data-count = "3" ] .cell:nth-child( 2 ),

  .grid .columns[ data-count = "3" ] .cell:nth-child( 3 ) {

    grid-row-end: span 3;

  }
  
  .grid .rows[ data-count = "3" ] .cell:nth-child( 2 ),

  .grid .rows[ data-count = "3" ] .cell:nth-child( 3 ) {

    grid-column-end: span 3;

  }

  .grid .columns[ data-count = "4" ] .cell:nth-child( 2 ),

  .grid .columns[ data-count = "4" ] .cell:nth-child( 3 ),

  .grid .columns[ data-count = "4" ] .cell:nth-child( 4 ) {

    grid-row-end: span 2;

  }
  
  .grid .rows[ data-count = "4" ] .cell:nth-child( 2 ),

  .grid .rows[ data-count = "4" ] .cell:nth-child( 3 ),

  .grid .rows[ data-count = "4" ] .cell:nth-child( 4 ) {

    grid-column-end: span 2;

  }

  .grid .columns[ data-count = "5" ] .cell:nth-child( 2 ),

  .grid .columns[ data-count = "5" ] .cell:nth-child( 3 ),

  .grid .columns[ data-count = "5" ] .cell:nth-child( 4 ),

  .grid .columns[ data-count = "5" ] .cell:nth-child( 5 ) {

    grid-row-end: span 3;

  }
  
  .grid .rows[ data-count = "5" ] .cell:nth-child( 2 ),

  .grid .rows[ data-count = "5" ] .cell:nth-child( 3 ),

  .grid .rows[ data-count = "5" ] .cell:nth-child( 4 ),

  .grid .rows[ data-count = "5" ] .cell:nth-child( 5 ) {

    grid-column-end: span 3;

  }

  .grid .columns[ data-count = "6" ] .cell:nth-child( 2 ),

  .grid .columns[ data-count = "6" ] .cell:nth-child( 3 ) {

    grid-row-end: span 3;

  }
  
  .grid .rows[ data-count = "6" ] .cell:nth-child( 2 ),

  .grid .rows[ data-count = "6" ] .cell:nth-child( 3 ) {

    grid-column-end: span 3;

  }

  .grid .columns[ data-count = "6" ] .cell:nth-child( 4 ),

  .grid .columns[ data-count = "6" ] .cell:nth-child( 5 ),

  .grid .columns[ data-count = "6" ] .cell:nth-child( 6 ) {

    grid-row-end: span 2;

  }
  
  .grid .rows[ data-count = "6" ] .cell:nth-child( 4 ),

  .grid .rows[ data-count = "6" ] .cell:nth-child( 5 ),

  .grid .rows[ data-count = "6" ] .cell:nth-child( 6 ) {

    grid-column-end: span 2;

  }

  .grid .cell:nth-child( n + 2 ) {

    align-items: flex-end;

    height: 100%;

  }

  .grid .cell:nth-child( n + 2 ) .content {

    display: block;

    color: #fff;

    background-color: transparent !important;

  }

  .grid .cell .image {

    --background-gradient: linear-gradient( to bottom, transparent 0%, rgba( 0, 0, 0, 0.8 ) 100% );

  }

  .grid .cell:nth-child( n + 2 ) .image {

    position: absolute;

    width: 100%;

    height: 100%;

  }

  .grid .cell h3 {

    color: inherit !important;

  }

  .grid .cell:nth-child( n + 2 ) h3 span {

    background-image: linear-gradient( to right, #fff 0%, #fff 100% );

  }

  .grid .cell:nth-child( n + 2 ) h3 small {

    display: -webkit-box;

  }

  .grid .cell i {

    display: none;

  }

}

/* Tiles */

.tiles .tile {

  display: block;
  
  position: relative;

  width: 100%;
  
  height: 452px;

  padding: 36px;

  margin: 2px;

  color: #fff;

  transition: margin 0.25s, opacity 0.25s, visibility 0.25s;

}


.tiles .tile[ hidden ] {

  display: block;

  opacity: 0;

  visibility: hidden;

}

.tiles .wide.tile {
  
  max-width: 384px;
  
  min-width: min( calc( 100vw * ( 282 / 320 ) - var( --scrollbar-width ) ), 384px );
  
}

.narrow.tile {
  
  max-width: 330px;
  
  min-width: min( calc( 100vw * ( 282 / 320 ) - var( --scrollbar-width ) ), 330px );
  
}

.tiles .wide.tile[ hidden = "to-left" ] {
  
  margin-left: calc( min( calc( 100vw * ( 284 / 320 ) - var( --scrollbar-width ) ), 386px ) * -1 );

}

.tiles .wide.tile[ hidden = "to-right" ] {

  margin-right: calc( min( calc( 100vw * ( 284 / 320 ) - var( --scrollbar-width ) ), 386px ) * -1 );

}

.tiles .narrow.tile[ hidden = "to-left" ] {

  margin-left: calc( min( calc( 100vw * ( 284 / 320 ) - var( --scrollbar-width ) ), 332px ) * -1 );

}

.tiles .narrow.tile[ hidden = "to-right" ] {

  margin-right: calc( min( calc( 100vw * ( 284 / 320 ) - var( --scrollbar-width ) ), 332px ) * -1 );

}

.tiles .image {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background-position: center;

  background-size: cover;

  --background-gradient: linear-gradient( to bottom, transparent 30%, rgba( 0, 0, 0, 0.9 ) 100% );

}

.tiles .tile .scroll {

  position: relative;

  overflow: hidden;

  width: 100%;

  height: 100%;

}

.tiles .tile .strip {

  position: relative;

  transform: translateY( 0 );

  transition: transform 0.25s;

}

.tiles .tile:hover .strip,

.tiles .tile:focus .strip {

  transform: translateY( calc( 364px - 100% ) );

}

.tiles .tile .top {

  position: relative;

  height: 364px;

  margin: 16px 0;

}

.tiles .tile .top .content {

  position: absolute;

  bottom: 0;

  width: 100%;

  margin: -16px 0;

}

.tiles .tile h2 {

  margin: 16px 0;

}

.tiles .tile h2 span {

  display: -webkit-box;

  -webkit-box-orient: vertical;

  -webkit-line-clamp: 3;

  overflow: hidden;

  font-size: 24px;

  font-weight: 700;

}

.tiles .tile h2 small {

  display: -webkit-box;

  -webkit-box-orient: vertical;

  -webkit-line-clamp: 2;

  overflow: hidden;

  margin: 8px 0;

  font-size: 14px;

  font-style: italic;

}

.tiles .tile p {

  display: -webkit-box;

  -webkit-box-orient: vertical;

  -webkit-line-clamp: 5;

  overflow: hidden;

  margin: 16px 0;

  font-size: 14px;

  line-height: 1.5em;

}

.tiles .tile .mock-nav {

  margin: 16px 0;

}

.tiles .tile .mock-nav .shape {

  height: 32px;

  padding: 0 16px;

  border-width: 1px;

  border-radius: 16px;
  
  transition-delay: 0.15s;

}

/* Pagination */

.pagination {

  display: flex;

  justify-content: center;

  align-items: center;

  margin: 24px 0;

}

.pagination > * {

  margin: 0 2px;

}

.pagination a,

.pagination .number {

  display: flex;

  justify-content: center;

  align-items: center;

  width: 40px;

  height: 40px;

  font-weight: 700;

  color: #012a3a;

  border-radius: 50%;

}

.pagination a {

  transition: color 0.25s, background-color 0.25s;

}

.pagination a:hover,

.pagination a:focus {

  color: #fff;

  background-color: #012a3a;

}

.pagination .number {

  color: #fff;

  background-color: #0075bb;

}

.pagination .dots {

  opacity: 0.5;

}

/* Dialogs */

[ role = "dialog" ] {

  position: fixed;

  top: 0;

  left: 0;

  z-index: 4;

  width: 100%;

  height: 100%;

  background-color: rgba( 0, 0, 0, 0.9 );

  transition: opacity 0.25s, visibility 0.25s;

}

[ role = "dialog" ][ hidden ] {

  display: block;

  opacity: 0;

  visibility: hidden;

}

[ role = "dialog" ] > button {

  display: flex;

  align-items: center;

  justify-content: center;

  position: absolute;

  top: 0;

  right: 0;

  z-index: 1;

  width: 64px;

  height: 64px;

  margin: 32px;

  font-size: 32px;

  color: #0075bb;

  background-color: #fff;

  transition: color 0.25s, background-color 0.25s;

}

[ role = "dialog" ] > button:hover,

[ role = "dialog" ] > button:focus {

  color: #fff;

  background-color: #0075bb;

}

[ role = "dialog" ].video iframe {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

}

/* Header */

#header {

  position: sticky;

  top: 0;

  left: 0;

  z-index: 3;

  max-width: 1920px;

  margin: 0 auto;

  box-shadow: 0 4px 8px -4px rgba( 0, 0, 0, 0.2 );

  transition: top 0.5s, box-shadow 0.5s;

}

#header[ hidden ] {

  display: block;

  top: -104px;

  box-shadow: 0 4px 8px -4px transparent;

}

#header .lock {

  display: flex;

  position: relative;

  padding: 0 16px;

}

@media ( min-width: 768px ) {

  #header[ hidden ] {

    top: -122px;

  }

  #header .lock {

    padding: 0 32px;

  }

}

#header a .underline .text,

#header button .underline .text {

  line-height: 1.5em;

  padding-bottom: 3px;

  background-size: 0 2px;

  background-repeat: no-repeat;

  background-position: bottom left;

  background-image: linear-gradient( to right, #fff 0%, #fff 100% );

  transition: background-size 0.25s;

}

#header a:hover .underline .text,

#header a:focus .underline .text,

#header button:not( [ disabled ] ):hover .underline .text,

#header button:not( [ disabled ] ):focus .underline .text {

  background-size: 100% 2px;

}

#header .skip {

  overflow: hidden;

  font-weight: 700;

  color: #fff;

  background-color: #e56a54;

}

#header .skip a:focus {

  display: block;

  margin: 15px 0;

}

#header .utility {

  display: block;

  background-color: #f3f5f6;

}

#header .utility .lock {

  height: 40px;

}

#header .utility .hours,

#header .utility .hours > * {

    display: flex;

    align-items: center;

    height: 100%;

}

#header .utility .hours {

  margin-right: 16px;

  white-space: nowrap;

  text-transform: uppercase;

  letter-spacing: 2px;

  font-size: 10px;

}

#header .utility .label span:first-child {

  display: none;

}

#header .utility .range {

  font-weight: 700;

}

#header .utility a .underline .text,

#header .utility button .underline .text {

  background-image: linear-gradient( to right, #0075bb 0%, #0075bb 100% );

}

#header .utility .tickets {

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 0 32px;

  margin: 0 -16px 0 auto;

  white-space: nowrap;

  font-size: 14px;

  font-weight: 700;

  color: #fff;

  background-color: #0075bb;

  transition: background-color 0.25s;

}

#header .utility .tickets:hover,

#header .utility .tickets:focus {

  background-color: #012a3a;

}

#header .utility .tickets :first-child {

  display: none;

}

#header .utility nav,

#utility-toggle-search {

  display: none;

}

@media ( min-width: 390px ) {

  #header .utility .hours span:first-child {

    display: initial;

  }

}

@media ( min-width: 420px ) {

  #header .utility .tickets :first-child {

    display: initial;

  }

}

@media ( min-width: 768px ) {

  #header .utility .tickets {

    display: none;

  }

  #header .utility nav {

    display: flex;

    height: 100%;

    margin-left: auto;

    text-transform: uppercase;

    letter-spacing: 2px;

    font-weight: 700;

    font-size: 10px;

  }

  #header .utility nav a {

    display: flex;

    align-items: center;

    position: relative;

    height: 100%;

    padding: 0 16px;

    transition: color 0.25s;

  }

  #header .utility nav a:hover,

  #header .utility nav a:focus {

    color: #0075bb;

  }

  #header .utility nav a::after {

    position: absolute;

    top: 25%;

    right: 0;

    width: 1px;

    height: 50%;

    content: "";

    background-color: #d4dbdf;

  }

  #utility-toggle-search {

    display: block;

    margin-right: -15px;

    padding: 0 20px;

    font-size: 14px;

    color: #0075bb;

  }

  #utility-toggle-search[ disabled ] {

    color: #ccc;

    cursor: not-allowed;

  }

}

#header .principal {

  position: relative;

  z-index: 2;

  background-color: #fff;

}

#header .principal .lock {

  height: 64px;

}

#header .home {

  display: flex;

  align-items: center;

  margin-right: auto;

}

#header .home img {

  display: block;

  width: 100%;

  max-width: 340px;

}

#toggle-menu,

#principal-toggle-search {

  display: flex;

  align-items: center;

  justify-content: center;

  min-width: 44px;

  max-width: 44px;

  height: 100%;

  font-size: 20px;

}

#principal-toggle-search {

  margin-left: 8px;

  color: #0075bb;

}

#principal-toggle-search[ disabled ] {

  color: #ccc;
  
  cursor: not-allowed;

}

#menu {

  overflow-x: hidden;

  overflow-y: scroll;

  position: fixed;

  top: 0;

  left: 0;

  z-index: 1;

  width: 100%;

  height: 100%;

  color: #fff;

  background-color: #012a3a;

  transition: transform 0.25s, visibility 0.25s;

}

#menu[ hidden ] {

  display: block;

  transform: translateX( 100% );

  visibility: hidden;

}

#menu .collapse {

  display: flex;

  align-items: center;

  position: sticky;

  top: 0;

  left: 0;

  z-index: 1;

  width: 100%;

  height: 64px;

  padding: 0 16px;

  color: #fff;

  background-color: #011a24;

}

#menu .collapse .logo {

  margin-right: auto;

}

#menu .collapse img {

  display: block;

  width: 100%;

  max-width: 340px;

}

#menu .collapse i {

  margin-left: 16px;

  font-size: 20px;

}

#menu button:not( .collapse ) {

  display: none;

}

#menu nav {

  display: block;

  position: relative;

  padding: 10px 0;

}

#menu nav:not( :first-of-type )::before {

  position: absolute;

  top: 0;

  left: 16px;

  width: calc( 100% - 32px );

  height: 2px;

  content: "";

  background-color: #fff;

  opacity: 0.1;

}

#menu nav a {

  display: inline-flex;

  align-items: center;

  width: 100%;

  padding: 16px;

}

#menu nav a:first-child {

  font-size: 24px;

}

#menu nav a .underline {

  margin-right: 16px;

}

#menu nav a i {

  margin-left: auto;

  font-size: 16px;

  opacity: 0.5;

  transition: opacity 0.25s;

}

#menu nav a:hover i,

#menu nav a:focus i {

  opacity: 1;

}

#menu .tickets {

  display: none;

}

@media ( min-width: 768px ) {

  #header .principal .lock {

    height: 82px;

  }

  #toggle-menu,

  #principal-toggle-search,

  #menu .collapse {

    display: none;

  }

  #menu {

    display: flex;

    align-items: center;

    overflow: initial;

    position: initial;

    width: auto;

    background-color: transparent;

  }

  #menu button:not( .collapse ) {

    display: flex;

    align-items: center;

    height: 100%;

    padding: 0 16px;

    font-size: 14px;

    font-weight: 700;

    color: #012a3a;

  }

  #menu button:not( .collapse )[ aria-expanded = "true" ] {

    color: #fff;

    background-color: #012a3a;

  }

  #menu button:not( .collapse )[ aria-expanded = "false" ] .underline .text {

    background-image: linear-gradient( to right, #0075bb 0%, #0075bb 100% );

  }

  #menu nav {

    position: absolute;

    top: 82px;

    right: 0;

    width: 100%;

    max-width: 768px;

    padding: 32px;

    column-count: 2;

    color: #fff;

    background-color: #012a3a;

    -webkit-clip-path: polygon( 0 0, 100% 0, 100% 100%, 0 100% );

    clip-path: polygon( 0 0, 100% 0, 100% 100%, 0 100% );

    transition: -webkit-clip-path 0.25s, clip-path 0.25s, transform 0.25s, visibility 0.25s;

  }

  #menu nav[ hidden ] {

    -webkit-clip-path: polygon( 0 100%, 100% 100%, 100% 100%, 0 100% );

    clip-path: polygon( 0 100%, 100% 100%, 100% 100%, 0 100% );

    transform: translateY( -100% );

    visibility: hidden;

  }

  /* Edge 12 to 15 */

  @supports ( -ms-accelerator: true ) {

    #menu nav {

      transition: none !important;

    }

  }

  /* Edge 16+ */

  @supports ( -ms-ime-align: auto ) {

    #menu nav {

      transition: none !important;

    }

  }

  #menu nav::before {

    display: none;

  }

  #menu nav a:first-child {

    font-size: inherit;

  }

  #menu .tickets {

    display: flex;

    align-items: center;

    width: 100%;

    height: 40px;

    padding: 0 16px;

    margin-left: 16px;

    white-space: nowrap;

    font-size: 14px;

    font-weight: 700;

    color: #fff;

    background-color: #0075bb;

    border-radius: 20px;

    transition: color 0.25s, background-color 0.25s;

  }

  #menu .tickets:hover,

  #menu .tickets:focus {

    background-color: #012a3a;

  }

  #menu .tickets span:first-child {

    display: none;

  }

}

@media ( min-width: 960px ) {

  #menu button:not( .collapse ) {

    padding: 0 32px;

  }

  #menu .tickets {

    padding: 0 32px !important;

    margin-left: 32px;

  }

  #menu .tickets span:first-child {

    display: initial;

  }

}

/* Search */

#search {

  overflow: hidden;

  position: relative;

  height: 150px;

  color: #fff;

  background-color: #0075bb;

  background-image: url( ../images/topographic-dark-translucent.svg );

  transition: height 0.5s, visibility 0.5s;

}

#search[ hidden ] {

  display: block;

  height: 0;

  visibility: hidden;

}

#search .lock {

  display: flex;

  align-items: center;

  justify-content: center;

  height: 100%;

  padding: 0 16px;

}

#search .input {

  position: relative;

  width: 100%;

  height: 50px;

}

#search-query {

  position: relative;

  z-index: 1;

  width: 100%;

  height: 100%;

  padding: 0 16px;

  text-overflow: ellipsis;

  font-size: 22px;

  transition: color 0.25s;

  -webkit-appearance: none;

}

#search-query:focus {

  color: #012a3a;

}

#search-query::placeholder {

  color: rgba( 255, 255, 255, 0.5 );

  transition: color 0.25s;

}

#search-query:focus::placeholder {

  color: rgba( 0, 0, 0, 0.5 );

}

#search-query::-ms-input-placeholder {

  color: rgba( 255, 255, 255, 0.5 );

  transition: color 0.25s;

}

#search-query:focus::-ms-input-placeholder {

  color: rgba( 0, 0, 0, 0.5 );

}

#search-query:-ms-input-placeholder {

  color: rgba( 255, 255, 255, 0.5 );

  transition: color 0.25s;

}

#search-query:focus:-ms-input-placeholder {

  color: rgba( 0, 0, 0, 0.5 );

}

#search-query::-webkit-search-cancel-button {

  display: none;

}

#search .input .background {

  position: absolute;

  bottom: 0;

  left: 0;

  width: 100%;

  height: 2px;

  content: "";

  background-color: #fff;

  transition: height 0.25s;

}

#search-query:focus + .background {

  height: 100%;

}

#search .submit {

  display: flex;

  align-items: center;

  justify-content: center;

  position: relative;

  min-width: 50px;

  height: 50px;

  font-size: 22px;

  transition: color 0.25s;

}

#search .submit:focus,

#search .submit:hover {

  color: #0075bb;

}

#search .submit::before {

  position: absolute;

  bottom: 0;

  left: 0;

  width: 100%;

  height: 2px;

  content: "";

  background-color: #fff;

  transition: height 0.25s;

}

#search .submit:focus::before,

#search .submit:hover::before {

  height: 100%;

}

#search .submit::after {
  
  position: absolute;
  
  top: 50%;
  
  left: 50%;
  
  width: 45px;
  
  height: 45px;
  
  content: '';
  
  border: 3px solid transparent;
  
  border-top-color: #fff;
  
  border-radius: 50%;
  
  opacity: 0;
  
  transform: translate( -50%, -50% );
  
  transition: border-color 0.25s, opacity 0.25s;

}

#search .submit[ disabled ]::after {
  
  opacity: 1;
  
  animation: search-submit-after 1.5s linear infinite;
    
}

#search .submit:focus::after,

#search .submit:hover::after {

  border-top-color: #0075bb;

}

@keyframes search-submit-after {
  
  from {
    
    transform: translate( -50%, -50% ) rotate( 0deg );
  
  }
  
  to {
    
    transform: translate( -50%, -50% ) rotate( 360deg );
  
  }
  
}

#search .submit i {

  position: relative;

}

#search .collapse {

  display: flex;

  align-items: center;

  justify-content: center;

  position: relative;

  min-width: 50px;

  height: 50px;

  margin-left: 16px;

  transition: color 0.25s;

}

#search[ data-collapsable = "false" ] .collapse {

  display: none;

}

#search .collapse:hover,

#search .collapse:focus {

  color: #0075bb;

}

#search .collapse::before {

  position: absolute;

  bottom: 0;

  left: 0;

  width: 100%;

  height: 0;

  content: "";

  background-color: #fff;

  transition: height 0.25s;

}

#search .collapse:focus::before,

#search .collapse:hover::before {

  height: 100%;

}

#search .collapse i {

  position: relative;

  font-size: 22px;

}

#search .collapse .label {

  position: absolute;

  bottom: 0;

  left: 0;

  width: 100%;

  text-align: center;

  letter-spacing: 2px;

  font-size: 12px;

  font-weight: 700;

  opacity: 1;

  transition: opacity 0.25s;

}

#search .collapse:hover .label,

#search .collapse:focus .label {

  opacity: 0;

}

@media ( min-width: 768px ) {

  #search .lock {

    max-width: 1264px;

    padding: 0 32px;

    margin: 0 auto;

  }

  #search .collapse {

    margin-left: 32px;

  }

}

@media ( min-width: 960px ) {

  #search {

    height: 200px;

  }

  #search .input {

    height: 70px;

  }

  #search-query {

    font-size: 32px;

  }

  #search .submit {

    min-width: 70px;

    height: 70px;

    font-size: 24px;

  }

  #search .collapse {

    min-width: 70px;

    height: 70px;

    margin-left: 32px;

  }

  #search .collapse i {

    font-size: 32px;

  }

  #search .collapse .label {

    font-size: 14px;

  }

}

@media ( min-width: 1200px ) {

  #search .collapse {

    margin-left: 128px;

  }

}

/* Warning */

#warning {
  
  max-width: 1920px;

  margin: 0 auto;
  
  background-color: #fff0f0;
  
}

#warning .lock {
  
  overflow: hidden;
  
  padding: 0 32px;
  
}

#warning .rich-text {
  
  overflow: hidden;
  
  margin: 20px 0;
  
}

#warning .rich-text strong {

  color: #f00;
  
}

@media ( min-width: 768px ) {
  
  #warning .lock {
    
    max-width: 1124px;
    
    padding: 0 64px;
    
    margin: 0 auto;
    
  }
  
}

/* Alert */

#alert {
  
  max-width: 1920px;

  margin: 0 auto;
  
  background-color: #fcfae4;
  
}

#alert .lock {
  
  overflow: hidden;
  
  padding: 0 32px;
  
}

#alert .mock-header {
  
  margin: 20px 0;
  
  font-family: "Gotham A", "Gotham B", helvetica, sans-serif;

  font-weight: 700;
  
  font-size: 22px;
  
}

#alert .rich-text {
  
  overflow: hidden;
  
  margin: 20px 0;
  
}

#alert nav {
  
  margin: 24px 0;
  
}

@media ( min-width: 768px ) {
  
  #alert .lock {
    
    display: flex;
    
    align-items: center;
    
    justify-content: center;
    
    max-width: 1124px;
    
    padding: 0 64px;
    
    margin: 0 auto;
    
  }
  
  #alert .content {
    
    flex: 1;

    max-width: 792px;
    
  }
  
  #alert .mock-header {
    
    font-size: 28px;
    
  }
  
  #alert nav {
    
    min-width: 180px;
    
    margin-left: 24px;
    
  }
  
  #alert nav a {
    
    white-space: nowrap;
    
  }
  
}

/* Subheader */

#subheader {

  max-width: 1920px;

  margin: 0 auto;

}

#subheader[ data-theme = "light" ] {

  color: #012a3a;

}

#subheader[ data-theme = "dark" ] {

  color: #fff;

}

#breadcrumbs {

  margin: 8px 0;

  text-transform: uppercase;

  letter-spacing: 3px;

  font-size: 12px;

  font-weight: 700;

}

#breadcrumbs .wrapper {

  margin: -6px;

}

#breadcrumbs a {

  display: inline-block;

  white-space: nowrap;

}

#breadcrumbs a > * {

  display: inline-block;

  margin: 6px;

}

#subheader .title h1 {

  font-family: "Gotham A", "Gotham B", helvetica, sans-serif;

  font-size: 36px;

  font-weight: 800;

  letter-spacing: -1px;

  margin: 8px 0;

}

#subheader .title p {

  font-family: "Sentinel A", "Sentinel B", helvetica, serif;

  font-size: 18px;

  line-height: 1.5em;

  max-width: 900px;

  margin: 8px 0;

}

#subheader .title time,

#subheader .title .categories {

  display: block;

  letter-spacing: 1px;

  font-size: 14px;

  margin: 16px 0;
  
  list-style: none;

}

#subheader .title .categories > * {

  display: inline;
  
}

#subheader .title .categories a:hover,

#subheader .title .categories a:focus {

  text-decoration: underline;

}

@media ( min-width: 768px ) {

  #subheader .title h1 {

    font-size: 48px;

  }

  #subheader .title p {

    font-size: 20px;

  }

}

@media ( min-width: 1124px ) {

  #subheader .title h1 {

    font-size: 64px;

  }

  #subheader .title p {

    font-size: 24px;

  }

}

/* Default Subheader */

#subheader.default[ data-image ] .title .image {

  width: 100%;

  height: 200px;

  background-position: center;

  background-size: cover;

  --background-gradient: linear-gradient( to bottom, transparent 40%, rgba( 0, 0, 0, 0.85 ) 100% );

}

#subheader.default .title .content {

  padding: 40px 16px;

  background-image: url( ../images/topographic-dark-translucent.svg );

}

#subheader.default[ data-theme = "dark" ] .title .content {

  background-image:

    url( ../images/topographic-dark-translucent.svg ),

    linear-gradient( to bottom, #012a3a 0%, #012a3a 100% );

}

#subheader.default .sidebar {

  color: #fff;

  background-image:

    url( ../images/topographic-dark-translucent.svg ),

    linear-gradient( to bottom, #001e2b 0%, #001e2b 100% );

}

#toggle-sidebar-anchors {

  display: flex;

  align-items: center;

  width: 100%;

  margin-right: 16px;

  font-size: 14px;

  font-weight: 700;

  letter-spacing: 3px;

  text-transform: uppercase;

  padding: 24px 16px;

}

#toggle-sidebar-anchors i {

  margin-left: auto;

}

#toggle-sidebar-anchors[ aria-expanded = "true" ] .nai-icon-caret-down,

#toggle-sidebar-anchors[ aria-expanded = "false" ] .nai-icon-caret-up {

  display: none;

}

#sidebar-anchors {

  overflow: hidden;

  transition: height 0.25s, visibility 0.25s;

}

#toggle-sidebar-anchors[ aria-expanded = "false" ] + #sidebar-anchors {

  height: 0;

  visibility: hidden;

}

#sidebar-anchors a {

  display: flex;

  align-items: center;

  padding: 16px;

}

#sidebar-anchors a .underline {

  margin-right: 16px;

}

#sidebar-anchors a .underline .text {

  line-height: 1.5em;

  padding-bottom: 3px;

  background-size: 0 2px;

  background-repeat: no-repeat;

  background-position: bottom left;

  background-image: linear-gradient( to right, #fff 0%, #fff 100% );

  transition: background-size 0.25s;

}

#sidebar-anchors a:hover .underline .text,

#sidebar-anchors a:focus .underline .text {

  background-size: 100% 2px;

}

#sidebar-anchors a i {

  margin-left: auto;

}

@media ( min-width: 768px ) {

  #subheader.default {

    display: flex;

  }

  #subheader.default .title {

    display: flex;

    align-items: flex-end;

    justify-content: center;

    position: relative;

    width: 100%;

  }

  #subheader.default[ data-image ] .title {

    min-height: 600px;

  }

  #subheader.default[ data-sidebar ] .title {

    justify-content: flex-end;

  }

  #subheader.default[ data-image ] .title .image {

    position: absolute;

    width: 100%;

    height: 100%;

  }

  #subheader.default .title {

    background-image: url( ../images/topographic-dark-translucent.svg );

  }

  #subheader.default[ data-theme = "dark" ] .title {

    background-image:

      url( ../images/topographic-dark-translucent.svg ),

      linear-gradient( to bottom, #013a4a 0%, #012b3b 100% );

  }

  #subheader.default .title .content {

    position: relative;

    width: 100%;

    max-width: 1328px;

    padding: 0 64px;

    margin: 64px 0 40px 0;

  }

  #subheader.default[ data-sidebar ] .title .content {

    padding: 0 32px 0 64px;

  }

  #subheader.default .title .content,

  #subheader.default[ data-theme = "dark" ] .title .content {

    background-image: initial;

  }

  #subheader.default .sidebar {

    display: flex;

    flex-direction: column;

    justify-content: flex-end;

    position: relative;

    z-index: 1;

    min-width: 300px;

    max-width: 300px;

    min-height: 368px;

    margin-bottom: -32px;

    background-image:

      url( ../images/topographic-dark-translucent.svg ),

      linear-gradient( to bottom, #013442 0%, #01212e 100% );

  }

  #toggle-sidebar-anchors {

    padding: 24px 32px;

    margin-top: 64px;

  }

  #toggle-sidebar-anchors i {

    display: none;

  }

  #sidebar-anchors {

    margin-bottom: 16px;

  }

  #sidebar-anchors a {

    padding: 16px 32px;

  }

}

@media ( min-width: 1328px ) {

  #subheader.default[ data-sidebar ] .title .content {

    max-width: calc( 1028px + ( 100vw - var( --scrollbar-width ) - 1328px ) / 592 * 296 );

  }

}

@media ( min-width: 1920px ) {

  #subheader.default[ data-sidebar ] .title .content {

    max-width: 1324px;

  }

}

/* Event Subheader */

#subheader.event .title {

  position: relative;

}

#subheader.event .title .image {
  
  position: absolute;

  width: 100%;

  height: 100%;

  background-position: center;

  background-size: cover;

  --background-gradient: linear-gradient( to bottom, rgba( 0, 0, 0, 0.42 ), rgba( 0, 0, 0, 0.42 ) 100% );

}

#subheader.event .title .content {

  display: flex;
  
  align-items: center;
  
  justify-content: center;

  position: relative;

  max-width: 792px;

  padding: 96px 16px;
  
  margin: 0 auto;

}

#subheader.event .title .logo {

  display: block;
  
  max-height: 132px;
  
  max-width: 176px;
  
  margin: 48px auto;
  
}

#subheader.event .title time {

  width: 176px;
  
  padding: 20px 16px;
  
  margin: 48px auto;
  
  text-align: center;
  
  background-color: rgba( 0, 0, 0, 0.25 );
  
  border: 2px solid #fff;
  
  border-radius: 6px;
  
}

#subheader.event .title time .month,

#subheader.event .title time .time {
  
  line-height: 1.5em;

  letter-spacing: normal;

  font-size: 16px;

  font-weight: 700;
  
}

#subheader.event .title time .time span {

  white-space: nowrap;
  
}

#subheader.event .title time .day {

  margin: 16px 0;

  line-height: 1em;

  letter-spacing: -1px;

  font-family: "Gotham A", "Gotham B", helvetica, sans-serif;

  font-size: 48px;
  
  font-weight: 800;
  
}

#subheader.event .title .text {
  
  margin: 48px 0;
  
  text-align: center;

}

#subheader.event .title h1 {

  margin: 8px 0 32px 0;
  
}

#subheader.event .jumper {
  
  background-image: url( ../images/topographic-dark-translucent.svg ), linear-gradient( to right, #0075bb, #012b3b 100% );
  
}

#toggle-jumper-anchors {

  display: flex;

  align-items: center;

  width: 100%;

  margin-right: 16px;

  font-size: 14px;

  font-weight: 700;

  letter-spacing: 3px;

  text-transform: uppercase;

  padding: 24px 16px;

}

#toggle-jumper-anchors i {

  margin-left: auto;

}

#toggle-jumper-anchors[ aria-expanded = "true" ] .nai-icon-caret-down,

#toggle-jumper-anchors[ aria-expanded = "false" ] .nai-icon-caret-up {

  display: none;

}

#jumper-anchors {

  overflow: hidden;

  transition: height 0.25s, visibility 0.25s;

}

#toggle-jumper-anchors[ aria-expanded = "false" ] + #jumper-anchors {

  height: 0;

  visibility: hidden;

}

#jumper-anchors a {

  display: flex;

  align-items: center;

  padding: 16px;

}

#jumper-anchors a .underline {

  margin-right: 16px;

}

#jumper-anchors a .underline .text {

  line-height: 1.5em;

  padding-bottom: 3px;

  background-size: 0 2px;

  background-repeat: no-repeat;

  background-position: bottom left;

  background-image: linear-gradient( to right, #fff 0%, #fff 100% );

  transition: background-size 0.25s;

}

#jumper-anchors a:hover .underline .text,

#jumper-anchors a:focus .underline .text {

  background-size: 100% 2px;

}

#jumper-anchors a i {

  margin-left: auto;

}

@media ( min-width: 768px ) {
  
  #subheader.event .title .content {
    
    justify-content: flex-start;
    
    height: 100%;
    
    padding: 96px 32px;
  
  }
  
  #subheader.event .title h1 {
  
    margin: 16px 0 32px 0;
    
  }
  
  #subheader.event .title .logo {
    
    min-width: 180px;
    
    max-height: 135px;
      
    margin: 48px 0;
    
  }
  
  #subheader.event .title .row {
    
    display: flex;
    
    align-items: flex-start;
    
    margin: 48px -12px;
  
  }
  
  #subheader.event .title time {
    
    max-width: 180px;
    
    min-width: 180px;
    
    margin: 0 12px;
    
  }
  
  #subheader.event .title time .day {
  
    font-size: 48px;
    
  }
  
  #subheader.event .title .text {
    
    margin: 0 12px;
    
    text-align: left;
  
  }
  
  .jumper,
  
   #jumper-anchors {
    
    display: flex;
    
    align-items: center;
    
    justify-content: center;
    
  }
  
  #toggle-jumper-anchors,
  
  #jumper-anchors a i {
  
    display: none;
    
  }
  
  #jumper-anchors a {
  
    padding: 32px 24px;
    
    font-weight: 700;
    
  }
  
  #jumper-anchors a .underline {
  
    margin-right: 0;
  
  }
  
}

@media ( min-width: 1124px ) {
  
  #subheader.event .title .content {
    
    max-width: 1328px;
    
    height: 720px;
    
    padding: 64px;
  
  }
  
  #subheader.event .title .logo {
    
    max-width: 282px;
    
    max-height: 212px;
    
  }
  
  #subheader.event .title time .day {
  
    font-size: 64px;
    
  }
  
}

/* Collection Subheader */

#subheader.collection .title {

  overflow: hidden;

  --background-gradient: linear-gradient( to bottom, rgba( 0, 0, 0, 0.5 ) 0%, rgba( 0, 0, 0, 0.75 ) 100% );

}

#subheader.collection .title .content {

  padding: 40px 16px;

  --background-gradient: linear-gradient( to bottom, rgba( 0, 0, 0, 0.5 ) 0%, rgba( 0, 0, 0, 0.5 ) 100% );

}

#subheader.collection[ data-theme = "light" ]:not( [ data-image ] ) .title .content {

  background-image: url( ../images/topographic-dark-translucent.svg );

}

#subheader.collection[ data-theme = "dark" ]:not( [ data-image ] ) .title .content {

  background-image:

    url( ../images/topographic-dark-translucent.svg ),

    linear-gradient( to bottom, #012a3a 0%, #012a3a 100% );

}

#subheader.collection[ data-image ] .title .content {

  background-position: center;

  background-size: cover;

}

#subheader.collection .drawer {

  color: #fff;

  background-image:

    url( ../images/topographic-dark-translucent.svg ),

    linear-gradient( to bottom, #001e2b 0%, #001e2b 100% );

}

#toggle-filters {

  display: flex;

  align-items: center;

  width: 100%;

  margin-right: 16px;

  font-size: 14px;

  font-weight: 700;

  letter-spacing: 3px;

  text-transform: uppercase;

  padding: 24px 16px;

}

#toggle-filters i {

  margin-left: auto;

}

#toggle-filters[ aria-expanded = "true" ] .nai-icon-caret-down,

#toggle-filters[ aria-expanded = "false" ] .nai-icon-caret-up {

  display: none;

}

#filters {

  overflow: hidden;

  padding: 0 16px;

  font-size: 14px;

  transition: height 0.25s, visibility 0.25s;

}

#toggle-filters[ aria-expanded = "false" ] + #filters {

  height: 0;

  visibility: hidden;

}

#filters select {

  display: flex;

  width: 100%;

  height: 40px;

  padding: 0 46px 0 16px;

  margin: 16px 0;

  font-weight: 700;

  background-image: url( ../images/caret-white.svg );

  background-position: calc( 100% - 16px ) center;

  background-repeat: no-repeat;

  background-size: 12px;

  border: 1px solid #fff;

  border-radius: 20px;

  -webkit-appearance: none;

  -moz-appearance: none;

  -ms-appearance: none;

  -o-appearance: none;

  appearance: none;

  cursor: pointer;

}

#filters select:hover,

#filters select:focus,

#filters select[ data-dirty ] {

  color: #012a3a;

  background-color: #fff;

  background-image: url( ../images/caret-blue.svg );

}

#filters label:not( .sr-only ) {

  display: flex;

  align-items: center;

  width: 100%;

  height: 40px;

  padding: 0 16px;

  margin: 16px 0;

  font-weight: 700;

  border: 1px solid #fff;

  border-radius: 32px;

  -webkit-user-select: none;

  -moz-user-select: none;

  -ms-user-select: none;

  user-select: none;

  cursor: pointer;

}

#filters input:hover + label,

#filters input:focus + label,

#filters input:checked + label {

  color: #012a3a;

  background-color: #fff;

}

#filters input:checked + label span {

  margin-right: 16px;

}

#filters label i {

  display: none;

}

#filters input:checked + label i {

  display: inline;

  margin-left: auto;

}

#filters .reset {

  display: flex;

  align-items: center;

  justify-content: center;

  width: 100%;

  height: 40px;

  margin: 16px 0;

  white-space: nowrap;

}

#filters .reset i {

  margin-right: 8px;

}

#filters .reset span {

  position: relative;

  font-weight: 700;

}

#filters .reset span::before {

  position: absolute;

  left: 0;

  bottom: -0.25em;

  width: 0;

  height: 2px;

  content: "";

  background-color: #fff;

  transition: width 0.25s;

}

#filters .reset:hover span::before,

#filters .reset:focus span::before {

  width: 100%;

}

@media ( min-width: 768px ) {

  #subheader.collection[ data-theme = "light" ]:not( [ data-image ] ) .title {

    background-image: url( ../images/topographic-dark-translucent.svg );

  }

  #subheader.collection[ data-theme = "dark" ]:not( [ data-image ] ) .title {

    background-image:

      url( ../images/topographic-dark-translucent.svg ),

      linear-gradient( to bottom, #013a4a 0%, #012b3b 100% );

  }

  #subheader.collection[ data-image ] .title {

    background-position: center;

    background-size: cover;

  }

  #subheader.collection .title .content {

    background-image: initial !important;

  }

  #subheader.collection .title .content,

  #subheader.collection .title .drawer {

    max-width: 1328px;

    padding: 0 64px;

    margin: 40px auto;

  }

  #subheader.collection .title .content {

    margin-top: 64px;

  }

  #subheader.collection .title .drawer {

    color: inherit;

    background-image: initial;

  }

  #toggle-filters {

    padding: 0;

    margin: 16px 0;

  }

  #toggle-filters::before,

  #toggle-filters::after {

    display: block;

    height: 1px;

    content: "";

  }

  #subheader[ data-theme = "dark" ] #toggle-filters::before,

  #subheader[ data-theme = "dark" ] #toggle-filters::after {

    background-color: #fff;

  }

  #subheader[ data-theme = "light" ] #toggle-filters::before,

  #subheader[ data-theme = "light" ] #toggle-filters::after {

    background-color: #012a3a;

  }

  #toggle-filters::before {

    min-width: 16px;

    margin-right: 8px;

  }

  #toggle-filters::after {

    width: 100%;

    margin-left: 8px;

  }

  #toggle-filters i {

    display: none;

  }

  #filters {

    display: flex;

    padding: 0;

  }

  #filters .fields {

    width: 100%;

    margin-left: -4px;

  }

  #filters select,

  #filters label:not( .sr-only ),

  #filters .reset {

    display: inline-flex;

    width: auto;

  }

  #filters select,

  #filters label:not( .sr-only ) {

    margin: 8px 4px;

  }

  #filters .reset {

    padding: 0 8px;

    margin: 8px auto;

  }

  #subheader[ data-theme = "light" ] #filters select {

    background-image: url( ../images/caret-blue.svg );

  }

  #subheader[ data-theme = "light" ] #filters select,

  #subheader[ data-theme = "light" ] #filters input + label {

    border-color: #012a3a;

  }

  #subheader[ data-theme = "light" ] #filters select:hover,

  #subheader[ data-theme = "light" ] #filters select:focus,

  #subheader[ data-theme = "light" ] #filters select[ data-dirty ],

  #subheader[ data-theme = "light" ] #filters input:hover + label,

  #subheader[ data-theme = "light" ] #filters input:focus + label,

  #subheader[ data-theme = "light" ] #filters input:checked + label,

  #subheader[ data-theme = "light" ] #filters .reset span::before {

    color: #fff;

    background-color: #012a3a;

  }

  #subheader[ data-theme = "light" ] #filters select:hover,

  #subheader[ data-theme = "light" ] #filters select:focus,

  #subheader[ data-theme = "light" ] #filters select[ data-dirty ] {

    background-image: url( ../images/caret-white.svg );

  }

}

/* Split Subheader */

#subheader.split .image {

  height: 100vw;

  background-position: center;

  background-size: cover;

}

#subheader.split .title {

  overflow: hidden;

}

#subheader.split .title .content {

  padding: 40px 16px;

  background-image: url( ../images/topographic-dark-translucent.svg );

}

#subheader.split[ data-theme = "dark" ] .title .content {

  background-image:

    url( ../images/topographic-dark-translucent.svg ),

    linear-gradient( to bottom, #012a3a 0%, #012a3a 100% );

}

@media ( min-width: 768px ) {

  #subheader.split {

    display: flex;

    flex-direction: row-reverse;

  }

  #subheader.split .title {

    display: flex;

    align-items: center;

    justify-content: flex-end;

    width: 100%;

    background-image: url( ../images/topographic-dark-translucent.svg );

  }

  #subheader.split[ data-theme = "dark" ] .title {

    background-image:

      url( ../images/topographic-dark-translucent.svg ),

      linear-gradient( to bottom, #013a4a 0%, #012b3b 100% );

  }

  #subheader.split .title .content,

  #subheader.split[ data-theme = "dark" ] .title .content {

    background-image: initial;

  }

  #subheader.split .title .content {

    width: 100%;

    max-width: 656px;

    padding: 0 32px 0 64px;

    margin: 40px 0;

  }

  #subheader.split .image {

    position: relative;

    z-index: 1;

    width: 100%;

    max-width: 716px;

    height: 532px;

    margin-bottom: -32px;

  }

}

@media ( min-width: 1432px ) {

  #subheader.split .title .content {

    max-width: calc( 656px + ( 100vw - var( --scrollbar-width ) - 1432px ) / 488 * 244 );

  }

}

@media ( min-width: 1920px ) {

  #subheader.split .title .content {

    max-width: 900px;

  }

}

/* Error Subheader */

#subheader.error {

  overflow: hidden;

  background-image: url( ../images/error-background.jpg );

  background-size: cover;

}

#subheader.error .title {

  max-width: 1124px;

  padding: 0 16px;

  margin: 40px auto;

}

#subheader.error .title h1 {

  max-width: 900px;

  margin: 0 auto;

  text-align: center;

}

#subheader.error .title h1 small {

  display: block;

  margin: 8px 0;

  text-transform: uppercase;

  letter-spacing: 2px;

  font-size: 12px;

  font-weight: 700;

}

@media ( min-width: 768px ) {

  #subheader.error .title {

    padding: 0 64px;

    margin: 64px auto;

  }

}

/* Accordion */

main section.accordion {

  max-width: 1920px;

  margin: 96px auto;

}

main section.accordion .lock {

  padding: 0 32px;

}

main section.accordion .lock > .rich-text {

  margin: 32px 0;

}

main section.accordion button {

  display: flex;

  align-items: center;

  width: 100%;

  padding: 0 16px;

  border-top: 1px solid #B4B4B4;

}

main section.accordion button[ aria-expanded = "true" ] .nai-icon-plus-sign,

main section.accordion button[ aria-expanded = "false" ] .nai-icon-minus-sign {

  display: none;

}

main section.accordion i {

  margin-right: 16px;

  font-size: 22px;

  color: #a0b0b7;

}

main section.accordion button[ aria-expanded = "true" ] i {

  color: #0075bb;

}

main section.accordion button span {

  font-family: "Gotham A", "Gotham B", helvetica, sans-serif;

  font-size: 24px;

  margin: 32px 0;

  font-weight: 700;

}

main section.accordion .item {

  overflow: hidden;

  padding: 0 16px;

  transition: height 0.25s;

}

main section.accordion button[ aria-expanded = "false" ] + .item {

  height: 0;

}

main section.accordion button[ aria-expanded = "false" ] + .item > * {

  visibility: hidden;

}

main section.accordion .item:last-child {

  border-bottom: 1px solid #b4b4b4;

}

main section.accordion .item .rich-text {

  margin-bottom: 32px;

}

@media ( min-width: 768px ) {

  main section.accordion .lock {

    max-width: 920px;

    padding: 0 64px;

    margin: 0 auto;

  }

  main section.accordion .item {

    padding-left: 48px;

  }

}

/* Banner */

main section.banner {

  max-width: 1920px;

  margin: 0 auto;

}

main section.banner .image {

  height: 56.25vw;

  min-height: 400px;

  max-height: 720px;

  background-size: cover;

}

main section.banner button.image {

  display: flex;

  align-items: center;

  justify-content: center;

  width: 100%;

}

main section.banner button.image::after {

  width: 96px;

  height: 96px;

  content: "";

  background-image: url( /images/play-icon.svg );

  background-size: cover;

}

/* Blockquote */

main section.blockquote {

  max-width: 1920px;

  margin: 96px auto;

}

main section.blockquote .lock {

  max-width: 920px;

  padding: 0 32px;

  margin: 0 auto;

}

main section.blockquote blockquote {
  
  padding: 0;
  
  border: none;
  
}

main section.blockquote nav {
  
  overflow: hidden;
  
  margin: 32px 0;
  
}

@media ( min-width: 768px ) {

  main section.blockquote .lock {

    padding: 0 64px;

  }

}

/* Callout */

main section.callout {

  display: flex;

  flex-direction: column;

  max-width: 1920px;

  margin: 0 auto;

  color: #fff;

  background-image: url( ../images/topographic-dark-translucent.svg );

}

main section.callout[ data-theme = "blue" ] {

  background-color: #0075bb;

}

main section.callout[ data-theme = "navy" ] {

  background-color: #012a3a;

}

main section.callout[ data-image ] .image {

  height: 400px;

  background-size: cover;

  background-repeat: no-repeat;

}

main section.callout[ data-image-hidden-on-mobile ] .image {

  display: none;

}

main section.callout .rich-text {

  width: 100%;

  max-width: 920px;

  padding: 0 32px;

  margin: 64px auto;

}

main section.callout[ data-theme = "blue" ] .rich-text :not( .buttons ) > a,

main section.callout[ data-theme = "navy" ] .rich-text :not( .buttons ) > a {

  text-decoration: underline;

  color: #fff;

}

main section.callout nav {

  overflow: hidden;

  margin: 32px 0;

}

@media ( min-width: 768px ) {
  
  main section.callout .rich-text {
  
    text-align: center;
  
  }
  
}

@media ( min-width: 920px ) {

  main section.callout[ data-image = "right" ] {

    flex-direction: row-reverse;

  }

  main section.callout[ data-image = "left" ] {

    flex-direction: row;

  }

  main section.callout[ data-image ] .rich-text {

    width: 50%;

    max-width: 856px;

    max-width: 664px;

    padding: 0 64px;

    text-align: left;

  }

  main section.callout[ data-image = "right" ] .rich-text {

    margin: 96px 0 96px auto;

  }

  main section.callout[ data-image = "left" ] .rich-text {

    margin: 96px auto 96px 0;

  }

  main section.callout[ data-image ] .image {

    display: block;

    width: 50%;

    height: auto;

  }

}

/* Carousel */

main section.carousel {

  overflow: hidden;

  max-width: 1920px;

  margin: 96px auto;

}

main section.carousel .lock {

  display: flex;

  flex-direction: column;

  margin: -24px 0;

}

main section.carousel[ data-background-color ]:not( [ data-background-color = "none" ] ) .lock,

main section.carousel[ data-background-pattern ]:not( [ data-background-pattern = "none" ] ) .lock,

main section.carousel[ data-background-image = "true" ] .lock {

  padding: 40px 0;

  margin: 0;

}

main section.carousel[ data-background-color = "blue" ] .lock {

  background-color: #0075bb;

}

main section.carousel[ data-background-color = "gray" ] .lock {

  background-color: #f3f5f6;

}

main section.carousel[ data-background-color = "navy" ] .lock {

  background-color: #012a3a;

}

main section.carousel[ data-background-pattern = "topographic" ] .lock {

  background-image: url( ../images/topographic-dark-translucent.svg );

}

main section.carousel[ data-background-image = "true" ] .lock {

  background-repeat: no-repeat;

  background-size: cover;

}

main section.carousel .rich-text {
  
  width: 100%;
  
  padding: 0 16px;

  margin: 24px auto;

}

main section.carousel[ data-foreground-color = "white" ] .rich-text {

  color: #fff;

}

main section.carousel[ data-foreground-color = "white" ] .rich-text :not( .buttons ) > a {

  text-decoration: underline;

  color: #fff;

}

main section.carousel .carousel {

  position: relative;

  width: 100%;
  
  padding: 0 16px;

  margin: 24px auto;

}

main section.carousel .cards {

  display: flex;

  position: relative;

  margin: -24px -12px;

}

main section.carousel .tiles {

  display: flex;

  position: relative;

  margin: -2px;

}

main section.carousel .carousel > * > :first-child[ hidden ] ~ :nth-child( n + 5 ),

main section.carousel .carousel > * > :first-child:not( [ hidden ] ) ~ :nth-child( n + 4 ) {

  opacity: 0;

  visibility: hidden;

}

main section.carousel .controls button {

  display: flex;

  align-items: center;

  position: absolute;

  top: 50%;

  right: 0;

  z-index: 1;

  width: 45px;

  height: 60px;

  padding-left: 20px;

  font-size: 24px;

  color: #012a3a;

  background-color: #fff;

  border-radius: 30px 0 0 30px;

  transform: translateY( -50% );

}

main section.carousel .controls button[ disabled ] {

  opacity: 0.1 !important;
  
  cursor: not-allowed;

}

main section.carousel .controls .previous {

  display: none;

}

@media ( min-width: 768px ) {

  main section.carousel .rich-text {
  
    max-width: 856px;
  
    padding: 0 32px;
  
  }

  main section.carousel .carousel {
  
    max-width: 856px;
    
    padding: 0 32px;
  
  }

  main section.carousel .controls {

    display: flex;

    margin-top: 32px;

  }

  main section.carousel .controls button {

    display: flex !important;

    align-items: center;

    justify-content: center;

    position: initial;

    width: 44px;

    height: 44px;

    padding: initial;

    margin-right: 5px;

    font-size: inherit;

    color: #fff;

    background-color: #012a3a;

    opacity: 0.6;

    transform: initial;

    transition: opacity 0.25s;

  }

  main section.carousel[ data-foreground-color = "white" ] .controls button {
    
    color: #012a3a;

    background-color: #fff;

  }

  main section.carousel .controls button:hover,

  main section.carousel .controls button:focus {

    opacity: 1;

  }

  main section.carousel .controls .previous {

    border-radius: 22px 0 0 22px;

  }

  main section.carousel .controls .next {

    border-radius: 0 22px 22px 0;

  }

}

@media ( min-width: 920px ) {

  main section.carousel .lock {

    flex-direction: row;

    align-items: center;

    max-width: 1328px;

    margin: -64px auto;

  }

  main section.carousel[ data-background-color ]:not( [ data-background-color = "none" ] ) .lock,

  main section.carousel[ data-background-pattern ]:not( [ data-background-pattern = "none" ] ) .lock,

  main section.carousel[ data-background-image = "true" ] .lock {

    padding: 0;

    margin: 0 auto;

  }

  main section.carousel .rich-text {

    min-width: 488px;

    max-width: 488px;

    margin: 64px 0;

    padding: 0 64px;

  }

  main section.carousel .carousel {

    max-width: initial;

    padding: 0;

    margin: 64px 0;

  }

}

/* Checlist */

main section.checklist {

  max-width: 1920px;

  margin: 96px 0;

}

main section.checklist .lock {

  max-width: 856px;

  padding: 0 32px;
  
  margin: 0 auto;
    
}

main section.checklist .lock > .rich-text {
  
  margin: 32px 0;
  
}

main section.checklist .list,

main section.checklist nav {
  
  overflow: hidden;

  margin: 32px 0;

}

main section.checklist .list .wrapper {
  
  display: flex;
  
  flex-wrap: wrap;
  
  align-items: center;
    
  margin: -16px;
  
}

main section.checklist .list .item {
  
  display: flex;
  
  align-items: center;
  
  width: 100%;
  
  margin: 16px;
  
}

main section.checklist .list i {

  color: #0075bb;

  margin-right: 16px;

}

main section.checklist .list .rich-text p {

  line-height: 1.25em;

}

@media ( min-width: 768px ) {

  main section.checklist .lock > .rich-text,
  
  main section.checklist nav {
    
    text-align: center;
    
  }

  main section.checklist .list .item {

    width: calc( 50% - 32px );

  }

}

/* Daily Schedule */

main section.daily-schedule .schedule {

  padding: 0 16px;
  
  margin: 96px auto;

}

main section.daily-schedule .rich-text,

main section.daily-schedule .bars,

main section.daily-schedule nav {

  margin: 48px 0;

}

main section.daily-schedule nav {
  
  overflow: hidden;
      
}

main section.daily-schedule .information {

  overflow: hidden;
    
  line-height: 1.5em;

  font-size: 14px;
  
  color: #fff;
  
  background-color: #012a3a;

}

main section.daily-schedule .information a .underline .text {

  line-height: 1.5em;

  padding-bottom: 3px;

  background-size: 0 2px;

  background-repeat: no-repeat;

  background-position: bottom left;

  background-image: linear-gradient( to right, #fff 0%, #fff 100% );

  transition: background-size 0.25s;

}

main section.daily-schedule .information a:hover .underline .text,

main section.daily-schedule .information a:focus .underline .text {

  background-size: 100% 2px;

}

main section.daily-schedule .information .list {

  overflow: hidden;

  padding: 0 16px;

  margin: 48px 0;

}

main section.daily-schedule .information ul {
  
  margin: -32px 0;
  
}

main section.daily-schedule .information li {

  margin: 32px 0;
  
  list-style: none;
  
}

main section.daily-schedule .information h2 {

  display: flex;

  text-transform: uppercase;

  line-height: 14px;

  letter-spacing: 2px;
  
  font-weight: 700;

}

main section.daily-schedule .information h2 i {

  display: inline-flex;

  width: 20px;
  
  align-items: center;
  
  justify-content: center;
  
  margin-right: 8px;

  color: #68d2df;

}

main section.daily-schedule .information address,

main section.daily-schedule .information p {

  margin-top: 8px;

  padding-left: 28px;
  
}

@media ( min-width: 768px ) {

  main section.daily-schedule .information {
    
    display: flex;
    
  }
  
  main section.daily-schedule .information .image {
    
    min-width: 50%;
    
    background-size: cover;
    
  }

  main section.daily-schedule .information .list {
  
    padding: 0 64px;
    
  }
  
  main section.daily-schedule .schedule {
    
    width: 100%;
  
    max-width: 856px;
  
    padding: 0 32px;
  
  }

}

@media ( min-width: 1200px ) {
  
  main section.daily-schedule {
  
    max-width: 1920px;
  
    margin: 96px auto;
  
  }
  
  main section.daily-schedule .lock {
  
    display: flex;
    
    flex-direction: row-reverse;
    
    justify-content: space-between;
    
    max-width: 1328px;
    
    margin: 0 auto;
    
  }
  
  main section.daily-schedule .information {
    
    flex-direction: column;
    
    min-width: 384px;
    
  }
  
  main section.daily-schedule .information .image {
    
    flex: 1;
    
  }
  
  main section.daily-schedule .information .list {
  
    padding: 0 40px;
    
  }
  
  main section.daily-schedule .schedule {
    
    max-width: 920px;
  
    padding: 0 64px;
    
    margin: -48px 0;
  
  }
  
}

/* Conservation */

main section.feature {

  max-width: 1920px;

  margin: 96px auto;

}

main section.feature .image {
  
  height: 376px;
  
  background-size: cover;
  
  background-position: center;
  
}

main section.feature .rich-text {
  
  padding: 0 16px;

  margin: 48px 0;

}

main section.feature nav {

  overflow: hidden;

  margin: 32px 0;

}

main section.feature .items a {
  
  display: flex;
  
  align-items: center;

  padding: 16px;
  
  background-color: #fff;
  
  box-shadow: 0 2px 8px rgba( 0, 0, 0, 0.125 );
  
}

main section.feature .items .content {
  
  width: 100%;
  
}

main section.feature .items h3 {
  
  display: -webkit-box;

  -webkit-box-orient: vertical;

  overflow: hidden;

  margin: 8px 0;
  
  font-size: 16px;
  
  font-weight: 700;
  
  transition: color 0.25s;
  
}

main section.feature .items a:hover h3,

main section.feature .items a:focus h3 {
  
  color: #0075bb;
  
}

main section.feature .items h3 span {

  line-height: 1.5em;

  padding-bottom: 3px;

  background-size: 0 2px;

  background-repeat: no-repeat;

  background-position: bottom left;

  background-image: linear-gradient( to right, #0075bb 0%, #0075bb 100% );

  transition: background-size 0.25s;
  
}

main section.feature .items a:hover h3 span,

main section.feature .items a:focus h3 span {
  
    background-size: 100% 2px;
    
}

main section.feature .items p {

  display: -webkit-box;

  -webkit-box-orient: vertical;

  overflow: hidden;

  margin: 8px 0;
  
  line-height: 1.5em;
  
  font-size: 14px;
  
  color: #395965;

}
  
main section.feature .items i {
  
  margin-left: 16px;
  
  transition: color 0.25s;
  
}

main section.feature .items a:hover i,

main section.feature .items a:focus i {

  color: #0075bb;
  
}

@media ( min-width: 768px ) {
  
  main section.feature {
    
    margin: 96px auto 180px;
    
  }
  
  main section.feature .lock {
    
    display: grid;
    
    max-width: 1328px;
  
    margin: 0 auto;
  
  }
  
  main section.feature .lock > * {
  
    grid-column-start: 1;
    
    grid-row-start: 1;
    
  }
  
  main section.feature .image {
    
    height: 100%;
    
    --background-gradient: linear-gradient( to right, rgba( 0, 0, 0, 0.8 ) 0, rgba( 0, 0, 0, 0.1 ) 1328px );
    
  }
  
  main section.feature .wrapper {
    
    max-width: 668px;
    
    padding: 0 32px;
    
    margin: 80px 0 -64px;
    
  }
  
  main section.feature .rich-text {
  
    padding: 0 32px;
    
    color: #fff;
  
  }
  
  main section.feature .items {
    
    padding: 0 8px;
    
  }
  
  main section.feature .items a {
  
    padding: 24px 36px;
    
  }
  
  main section.feature .items h3 {
    
    -webkit-line-clamp: 1;

    font-size: 18px;
    
  }
  
  main section.feature .items h3 span {
  
    padding-bottom: 0.15em;
    
  }
  
  main section.feature .items p {
  
    -webkit-line-clamp: 2;
  
  }

}

/* Figure */

main section.figure {

  max-width: 1920px;

  margin: 96px auto;

}

main section.rich-text + section.figure {

  margin-top: -32px;

}

main section.figure + section.rich-text {

  margin-top: -32px;

}

main section.figure .lock {

  max-width: 996px;

  margin: 0 auto;

}

main section.figure figure {

  position: relative;

}

main section.figure img {

  display: block;

  width: 100%;

}

main section.figure figcaption {

  padding: 16px;

  font-size: 12px;

  line-height: 1.5em;

  background-color: #f3f5f6;

}

@media ( min-width: 768px ) {

  main section.figure figcaption {

    position: absolute;

    left: 0;

    bottom: 0;

    max-width: 489px;

  }

}

/* Form */

main section.form {

  max-width: 1920px;

  margin: 96px auto;

}

main section.form .lock {

  max-width: 920px;

  padding: 0 32px;

  margin: 0 auto;

}

main section.form button[ type = "submit" ].freeform-processing {

  display: inline-flex;

  flex-wrap: nowrap;

  align-items: center;

}

main section.form button[ type = "submit"].freeform-processing:before {

  content: "";

  display: block;

  flex: 1 0 11px;

  width: 11px;

  height: 11px;

  margin-right: 10px;

  border-style: solid;

  border-width: 2px;

  border-color: transparent transparent #fff #fff;

  border-radius: 50%;

  animation: freeform-processing .5s linear infinite;

}

@keyframes freeform-processing {

  0% {

    transform: rotate( 0 );

  }

  100% {

    transform: rotate( 1turn );

  }

}

main section.form .freeform-pages {

  display: flex;

  padding: 0;

  margin: 0 0 10px;

  list-style: none;

}

main section.form .freeform-pages li {

  margin: 0 10px 0 0;

}

main section.form .freeform-row {

  display: flex;

  justify-content: space-between;

  margin: 0 -15px;

}

main section.form .freeform-row .freeform-column {

  flex: 1 0;

  padding: 10px 0;

  margin: 0 15px;

  box-sizing: border-box;

}

main section.form .freeform-row .freeform-column > .freeform-row:first-child {

  margin-top: -10px;

}

main section.form .freeform-row .freeform-column label {

  display: block;

}

main section.form .freeform-row .freeform-column .input-group-one-line {

  display: flex;

  flex-wrap: wrap;
  
}

main section.form .freeform-row .freeform-column .input-group-one-line label {

  padding-right: 10px;

}

main section.form .freeform-row .freeform-column .freeform-label,

main section.form .freeform-group .freeform-label {

  font-weight: bold;

}

main section.form .freeform-row .freeform-column .freeform-label.freeform-required:after {

  content: "*";

  margin-left: 5px;

  color: red;

}

main section.form .freeform-row .freeform-column .freeform-input {

  width: 100%;

  display: block;

  box-sizing: border-box;

}

main section.form .freeform-row .freeform-column .freeform-input[ type = "checkbox" ],

main section.form .freeform-row .freeform-column .freeform-input[ type = "radio" ] {

  width: auto;

  display: inline;

  margin-right: 5px;

}

main section.form .freeform-row .freeform-column .freeform-input.StripeElement {

  padding: 4px 2px;

  border: 1px solid #ccc;

  height: 36px;

}

main section.form .freeform-row .freeform-column .freeform-input-only-label {

  font-weight: normal;

}

main section.form .freeform-row .freeform-column .freeform-input-only-label > .freeform-input {

  display: inline-block;

  width: auto;

  margin-right: 5px;

}

main section.form .freeform-row .freeform-column .freeform-errors {

  list-style: none;

  padding: 0;

  margin: 5px 0 0;

}

main section.form .freeform-row .freeform-column .freeform-errors > li {

  color: red;

}

main section.form .freeform-row .freeform-column .freeform-instructions {

  margin: 0 0 5px;

  font-size: 13px;

  color: #aba7a7;

}

main section.form .freeform-form-errors {

  padding: 15px;

  border: 1px solid #f5c6cb;

  background: #f8d7da;

  border-radius: 5px;

  color: #721c24;

}

main section.form .freeform-form-errors > p {

  margin: 0;

}

main section.form .freeform-group {

  width: 100%;

  padding: 0 15px;
  
}

@media ( min-width: 768px ) {

  main section.form .lock {

    padding: 0 64px;

  }

}

/* Gallery */

main section.gallery {
  
  max-width: 1920px;

  margin: 96px auto;

}

main section.gallery .top {

  margin: 48px 0;

}

main section.gallery .top .rich-text {

  padding: 0 32px;

}

main section.gallery[ data-text-alignment = "center" ] .top .rich-text {

  text-align: center;

}

@media ( min-width: 768px ) {

  main section.gallery .top .lock {

    max-width: 920px;
    
    margin: 0 auto;
    
  }
  
  main section.gallery .top .rich-text {

    padding: 0 64px;

  }

}

main section.gallery .bottom .lock {

  max-width: 792px;

  margin: 0 auto;

}

main section.gallery .bottom .items {
  
  display: flex;
  
  flex-direction: column;
  
  margin: 48px auto;
  
}

main section.gallery .bottom .figures {
  
  position: relative;

  width: 100%;
  
}

main section.gallery .bottom .scroll {

  display: flex;
  
  overflow-x: scroll;
  
  scroll-behavior: smooth;
  
  scroll-snap-type: x mandatory;
  
  scrollbar-width: none;
  
  scrollbar-height: none;
  
  -ms-overflow-style: none;
  
}

main section.gallery .bottom .scroll::-webkit-scrollbar {

  width: 0;

  height: 0;

}

main section.gallery .bottom figure {
  
  scroll-snap-align: start;
  
  position: relative;

  min-width: 100%;

  min-height: 1px;

  -webkit-user-select: none;

  -moz-user-select: none;

  -ms-user-select: none;

  user-select: none;
  
}

main section.gallery .bottom img {
  
  display: block;
  
  width: 100%;
  
}

main section.gallery .bottom figcaption {

  padding: 16px;

  font-size: 12px;

  line-height: 1.5em;

  background-color: #f3f5f6;

}

main section.gallery .bottom .figures .controls {
  
  display: flex;
  
  align-items: center;
  
  margin: 16px;
  
  pointer-events: none;
  
  touch-action: none;
  
}

main section.gallery .bottom .figures button {
  
  display: flex;
  
  align-items: center;
  
  justify-content: center;
  
  width: 44px;
  
  height: 44px;
  
  margin: 16px;
  
  font-size: 22px;
  
  background-color: #fff;
  
  border: 2px solid #012a3a;
  
  border-radius: 50%;
  
  box-shadow: 0 2px 8px rgb( 0 0 0 / 20% );
  
  transition: color 0.25s, background-color 0.25s, border-color 0.25s;
  
  pointer-events: initial;
  
  touch-action: initial;
  
}

main section.gallery .bottom .figures button:not( [ disabled ] ):hover,

main section.gallery .bottom .figures button:not( [ disabled ] ):focus {
  
  color: #fff;
  
  background-color: #012a3a;
  
}

main section.gallery .bottom .figures button[ disabled ] {

  color: #aaa;
  
  background-color: #eee;
  
  border-color: #aaa;
  
  cursor: not-allowed;
  
}

main section.gallery .bottom .text {

  display: grid;

  margin: 0 32px;

}

main section.gallery .bottom .text .rich-text {

  grid-row-start: 1;
  
  grid-column-start: 1;
  
}

@media ( min-width: 768px ) {
  
  main section.gallery .bottom .figures {
  
    margin-bottom: 32px;
    
  }

  main section.gallery .bottom .figures .controls {

    justify-content: space-between;

    position: absolute;
    
    top: 0;
    
    left: 0;
    
    width: 100%;
    
    margin: calc( 50% / 1.5 ) 0 0 0;
    
    transform: translateY( -50% );
    
  }
  
  main section.gallery .bottom figcaption {

    position: absolute;

    left: 0;

    bottom: 0;

    max-width: 489px;

  }

}

@media ( min-width: 920px ) {

  main section.gallery .bottom .text {

    margin: 0;

  }

}

@media ( min-width: 1024px ) {

  main section.gallery .bottom .lock {

    max-width: 1272px;

  }

  main section.gallery[ data-items-alignment = "center" ] .bottom .lock {

    max-width: 856px;

  }
  
  main section.gallery .bottom .items {

    padding: 0 16px;

  }

  main section.gallery[ data-items-alignment = "left" ] .bottom .items {

    flex-direction: row;

  }

  main section.gallery[ data-items-alignment = "right" ] .bottom .items {

    flex-direction: row-reverse;
    
  }
  
  main section.gallery:not( [ data-items-alignment = "center" ] ) .bottom .items > * {

    margin: 0 16px;

  }
  
  main section.gallery[ data-items-alignment = "center" ] .bottom .figures {

    margin-bottom: 32px;
    
  }
  
  main section.gallery:not( [ data-items-alignment = "center" ] ) .bottom figcaption {

   position: relative;

  }
  
  main section.gallery:not( [ data-items-alignment = "center" ] ) .bottom .rich-text {

    width: 384px;

  }

}

@media ( min-width: 1170px ) {

  main section.gallery:not( [ data-items-alignment = "center" ] ) .bottom figcaption {

    position: absolute;

  }

}

/* Grid */

main section.grid {

  overflow: hidden;

  max-width: 1920px;

  margin: 96px auto;

}

main section.grid .lock {

  display: flex;

  flex-direction: column;

  margin: -24px auto;

}

main section.grid[ data-background-color ]:not( [ data-background-color = "none" ] ) .lock,

main section.grid[ data-background-pattern ]:not( [ data-background-pattern = "none" ] ) .lock,

main section.grid[ data-background-image = "true" ] .lock {

  padding-top: 40px;

  margin: 0 auto -24px auto;

}

main section.grid[ data-background-color = "blue" ] .lock {

  background-color: #0075bb;

}

main section.grid[ data-background-color = "gray" ] .lock {

  background-color: #f3f5f6;

}

main section.grid[ data-background-color = "navy" ] .lock {

  background-color: #012a3a;

}

main section.grid[ data-background-pattern = "topographic" ] .lock {

  background-image: url( ../images/topographic-dark-translucent.svg );

}

main section.grid[ data-background-image = "true" ] .lock {

  background-repeat: no-repeat;

  background-size: cover;

}

main section.grid .rich-text {

  width: 100%;

  padding: 0 32px;

  margin: 24px auto;

}

main section.grid[ data-foreground-color = "white" ] .rich-text {

  color: #fff;

}

main section.grid[ data-foreground-color = "white" ] .rich-text :not( .buttons ) > a {

  text-decoration: underline;

  color: #fff;

}

main section.grid .columns,

main section.grid .rows {

  width: 100%;

  margin: 24px auto;

}

main section.grid .rich-text nav {

  overflow: hidden;

}

@media ( min-width: 768px ) {

  main section.grid .lock {

    max-width: 1328px;

    margin: -24px auto;

  }

  main section.grid[ data-background-color ]:not( [ data-background-color = "none" ] ) .lock,

  main section.grid[ data-background-pattern ]:not( [ data-background-pattern = "none" ] ) .lock,

  main section.grid[ data-background-image = "true" ] .lock {

    padding: 40px 0;

  }

  main section.grid .rich-text,
  
  main section.grid .columns,
  
  main section.grid .rows {
  
    max-width: 856px;

    padding: 0 32px;

  }

}

@media ( min-width: 1280px ) {

  main section.grid .lock {

    flex-direction: row;

    align-items: center;

    max-width: 1328px;

    margin: -64px auto;

  }
  
  main section.grid[ data-background-color ]:not( [ data-background-color = "none" ] ) .lock,

  main section.grid[ data-background-pattern ]:not( [ data-background-pattern = "none" ] ) .lock,

  main section.grid[ data-background-image = "true" ] .lock {

    padding: 0;

    margin: 0 auto;

  }

  main section.grid[ data-grid-alignment = "left" ] .lock {

    flex-direction: row-reverse;

  }

  main section.grid .rich-text {

    min-width: 488px;

    max-width: 488px;

    padding: 0 64px;

    margin: 64px 0;

  }
  
  main section.grid .columns,
  
  main section.grid .rows {

    margin: 64px 0;

    padding: 0;

  }

  main section.grid[ data-grid-alignment = "left" ] .columns,
  
  main section.grid[ data-grid-alignment = "left" ] .rows {

    padding-left: 32px;

  }
  
  main section.grid[ data-grid-alignment = "right" ] .columns,
  
  main section.grid[ data-grid-alignment = "right" ] .rows {

    padding-right: 32px;

  }

}

/* Listing */

main section.listing {

  max-width: 1920px;

  margin: 96px auto;

}

main section.listing[ data-background-color ]:not( [ data-background-color = "none" ] ),

main section.listing[ data-background-pattern ]:not( [ data-background-pattern = "none" ] ),

main section.listing[ data-background-image = "true" ] {

  margin: 0;

}

main section.listing .lock {

  display: flex;

  flex-direction: column;

  padding: 0 16px;

  margin: -24px auto;

}

main section.listing[ data-background-color ]:not( [ data-background-color = "none" ] ) .lock,

main section.listing[ data-background-pattern ]:not( [ data-background-pattern = "none" ] ) .lock,

main section.listing[ data-background-image = "true" ] .lock {

  padding: 40px 16px;

  margin: 0 auto;

}

main section.listing[ data-background-color = "blue" ] .lock {

  background-color: #0075bb;

}

main section.listing[ data-background-color = "gray" ] .lock {

  background-color: #f3f5f6;

}

main section.listing[ data-background-color = "navy" ] .lock {

  background-color: #012a3a;

}

main section.listing[ data-background-pattern = "topographic" ] .lock {

  background-image: url( ../images/topographic-dark-translucent.svg );

}

main section.listing[ data-background-image = "true" ] .lock {

  background-repeat: no-repeat;

  background-size: cover;

}

main section.listing .rich-text {

  width: 100%;

  max-width: 792px;

  margin: 24px auto;

}

main section.listing[ data-text-alignment = "center" ] .rich-text {

  text-align: center;

}

main section.listing[ data-foreground-color = "white" ] .rich-text {

  color: #fff;

}

main section.listing[ data-foreground-color = "white" ] .rich-text :not( .buttons ) > a {

  text-decoration: underline;

  color: #fff;

}

main section.listing .listing {

  width: 100%;

  max-width: 1200px;

  margin: 24px auto;

}

main section.listing .bars {

  max-width: 792px;

  margin: -24px auto;

}

main section.listing .cards {

  display: flex;

  justify-content: center;

  flex-wrap: wrap;

  margin: -24px -12px;

}

main section.listing .tiles {

  display: flex;

  justify-content: center;

  flex-wrap: wrap;

  margin: -2px;

}

main section.listing nav {

  width: 100%;

  max-width: 792px;

  margin: 24px auto;

}

main section.listing[ data-text-alignment = "center" ] nav {

  text-align: center;

}

@media ( min-width: 768px ) {

  main section.listing .lock {

    padding: 0 64px;

  }

  main section.listing[ data-background-color ]:not( [ data-background-color = "none" ] ) .lock,

  main section.listing[ data-background-pattern ]:not( [ data-background-pattern = "none" ] ) .lock,

  main section.listing[ data-background-image = "true" ] .lock {

    padding: 40px 64px;

  }

}

@media ( min-width: 1440px ) {

  main section.listing[ data-background-color ]:not( [ data-background-color = "none" ] ),
  
  main section.listing[ data-background-pattern ]:not( [ data-background-pattern = "none" ] ),
  
  main section.listing[ data-background-image = "true" ] {
  
    margin: 96px auto;
  
  }
  
  main section.listing .lock {
    
    max-width: 1328px;
    
  }
  
}

/* Logos */

main section.logos {

  margin: 96px 0;

}

main section.logos .lock {

  max-width: 1060px;

  margin: 0 auto;

  padding: 0 32px;

}

main section.logos .rich-text,

main section.logos .logos {
  
  overflow: hidden;
  
  margin: 64px 0;
  
}

main section.logos .rich-text h2[ data-text-alignment = "center" ] {

  text-align: center;

}

main section.logos .rich-text .description[ data-text-alignment = "center" ] {

  text-align: center;

}

main section.logos .logos .wrapper {

  display: flex;
  
  align-items: center;
  
  flex-wrap: wrap;
  
  margin: -16px;
  
}

main section.logos .logos a {
  
  display: block;
  
  width: 139px;
    
  margin: 16px;
  
}

main section.logos img {

  width: 100%;

  filter: grayscale( 1 );

  transition: filter 0.25s;

}

main section.logos a:hover img {

  filter: grayscale( 0 );

}

/* Notice */

main section.notice {

  max-width: 1920px;

  margin: 96px 16px;

}

main section.notice .lock {

  max-width: 920px;

  padding: 32px 16px;

  margin: 0 auto;

  text-align: center;

  background-color: #f3f5f6;

}

/* Overview */

main section.overview {

  max-width: 1920px;

  margin: 64px auto 96px auto;

}

main section.overview .lock {

  display: flex;

  flex-direction: column;

  max-width: 1124px;

  padding: 0 32px;

  margin: 0 auto;

}

main section.overview .details {

  overflow: hidden;

  margin-bottom: 64px;

}

main section.overview .details .negate {

  margin: -32px 0;

}

main section.overview .details .consume {

  margin: 32px 0;

}

main section.overview .details .list {

  overflow: hidden;

  margin: 32px 0;

}

main section.overview .details ul {

  list-style: none;

  margin: -32px 0;

}

main section.overview .details li {

  margin: 32px 0;

}

main section.overview .details h2 {

  display: flex;

}

main section.overview .details h2 i {

  display: inline-flex;

  width: 20px;

  align-items: center;

  justify-content: center;

  margin-right: 8px;

  color: #80949c;

}

main section.overview .details h2 span {

  vertical-align: top;

  text-transform: uppercase;

  letter-spacing: 1px;

  font-size: 12px;

  font-weight: 700;

}

main section.overview .details p {

  padding-left: 28px;

  margin-top: 8px;

  line-height: 1.5em;

  font-size: 14px;

}

main section.overview .details p a {

  color: #0075bb;

}

main section.overview .details p a:hover,

main section.overview .details p a:focus {

  text-decoration: underline;

}

main section.overview .details nav {

  overflow: hidden;

  margin: 32px 0;

}

@media ( min-width: 768px ) {

  main section.overview {

    margin: 96px auto;

  }

  main section.overview .lock {

    padding: 0 64px;

  }

  main section.overview .details ul {

    display: flex;

    flex-wrap: wrap;

    margin: -16px;

  }

  main section.overview .details li {

    min-width: calc( 50% - 32px );

    max-width: calc( 50% - 32px );

    margin: 16px;

  }

}

@media ( min-width: 960px ) {

  main section.overview {

    margin: 64px auto 96px auto;

  }

  main section.overview .lock {

    flex-direction: row-reverse;

  }

  main section.overview .rich-text {

    width: 100%;

  }

  main section.overview .details  {

    flex: 0 0 282px;

    margin: 64px 0 0 128px;

  }

  main section.overview .details ul {

    display: block;

    margin: -32px 0;

  }

  main section.overview .details li {

    min-width: initial;

    max-width: initial;

    margin: 32px 0;

  }

}

/* Rainbow Cards */

main section.rainbow-cards {

  max-width: 1920px;

  margin: 96px auto;

}

main section.rainbow-cards .lock {

  overflow: hidden;

  max-width: 1328px;

  padding: 0 32px;

  margin: 0 auto;

  background-color: #f3f5f6;

}

main section.rainbow-cards .rich-text {

  max-width: 856px;

  margin: 64px auto 48px auto;

}

main section.rainbow-cards .list {

  margin: 48px auto 64px auto;

}

main section.rainbow-cards .list[ data-columns = "2" ] {

  max-width: 588px;

}

main section.rainbow-cards .list[ data-columns = "3" ] {

  max-width: 894px;

}

main section.rainbow-cards .list[ data-columns = "4" ] {

  max-width: 1200px;

}

main section.rainbow-cards .list .cards {

  display: flex;

  justify-content: center;

  flex-wrap: wrap;

  margin: -24px;

}

@media ( min-width: 660px ) {

  main section.rainbow-cards .rich-text h2,

  main section.rainbow-cards .rich-text .description[ data-text-alignment = "center" ] {
    
    text-align: center;
    
  }
  
}

/* Raised */

main section.raised {

  position: relative;

  max-width: 1920px;

  margin: 96px auto;

}

main section.raised .image {

  background-size: cover;

  background-repeat: no-repeat;

  width: 100%;

  height: 56.25vw;

}

main section.raised .rich-text {
  
  padding: 40px 32px;
  
}

main section.raised[ data-theme = "white" ] .rich-text {

  background-color: #fff;

}

main section.raised[ data-theme = "navy" ] .rich-text {

  color: #fff;

  background-color: #012a3a;

}

main section.raised blockquote {
  
  padding: 0;
  
  border: none;
  
}

main section.raised[ data-theme = "navy" ] .rich-text :not( .buttons ) > a {

  text-decoration: underline;

  color: #fff;

}

main section.raised nav {

  margin: 32px 0;

}

main section.raised hr {

  border: 1px solid #f3f5f6;

}

@media ( min-width: 600px ) {

  main section.raised .lock {

    padding: 0 16px;

    margin-top: -40px;

  }

  main section.raised .rich-text {

    padding: 40px;
    
    margin: -40px 0 0 0;
    
    box-shadow: 0 2px 8px 0 rgba( 0, 0, 0, 0.15 );

  }

}

@media ( min-width: 768px ) {

  main section.raised .image {

    position: absolute;

    width: 70%;

    height: calc( 100% - 40px );

  }

  main section.raised[ data-image = "right" ] .image {

    right: 0;

  }

  main section.raised .lock {

    position:  relative;

    padding: 100px 32px 0;

    margin: 0 0 0 auto;

  }

  main section.raised .rich-text {

    max-width: 400px;

  }

  main section.raised[ data-image = "left" ] .rich-text {

    margin: 0 0 0 auto;

  }

  main section.raised[ data-image = "right" ] .rich-text {

    margin: 0 auto 0 0;

  }

}

@media ( min-width: 1024px ) {

  main section.raised .image {

    height: 100%;

  }

  main section.raised .lock {

    max-width: 1264px;

    padding: 160px 32px 80px 32px;
    
    margin: 0 auto;

  }

  main section.raised .rich-text {

    max-width: 600px;

  }

}

/* Raised Hours */

main section.raised.hours .rich-text {
  
  transition: opacity 0.25s, visibility 0.25s;
  
}

main section.raised.hours .item {
  
  margin: 24px 0;
  
}

main section.raised.hours .item > * {

  margin: 8px 0;
  
}

main section.raised.hours .item .label {
  
  font-weight: 700;
  
}

main section.raised.hours hr {

  margin: 32px 0;
  
}

main section.raised.hours .mock-nav {

  overflow: hidden;
  
  margin: 32px 0;
  
}

@media ( min-width: 400px ) {

  main section.raised.hours .item {
    
    display: flex;
    
    justify-content: space-between;
    
    margin: 24px 0;
    
  }

  main section.raised.hours .item > * {

    margin: 0;
    
  }

}

/* Recovery */

main section.recovery {

  margin: 96px auto;

}

main section.recovery .lock {

  padding: 0 32px;

}

main section.recovery img {

  display: block;

  margin: 48px auto;

}

main section.recovery h2 {

  margin: 32px auto;

  text-align: center;

  font-size: 28px;

  font-weight: 700;

}

main section.recovery nav {

  margin: 32px;

  text-align: center;

}

main section.recovery nav .wrapper {

  margin: -8px;

}

main section.recovery nav a {

  display: inline-block;

  margin: 8px;

  font-weight: 700;

  transition: color 0.25s;

}

main section.recovery nav a:hover,

main section.recovery nav a:focus {

  color: #0075bb;

}

main section.recovery nav a .underline .text {

  line-height: 1.5em;

  padding-bottom: 3px;

  background-size: 0 2px;

  background-repeat: no-repeat;

  background-position: bottom left;

  background-image: linear-gradient( to right, #0075bb 0%, #0075bb 100% );

  transition: background-size 0.25s;

}

main section.recovery nav a:hover .underline .text,

main section.recivery nav a:focus .underline .text {

  background-size: 100% 2px;

}

@media ( min-width: 768px ) {

  main section.recovery .lock {

    padding: 0 64px;

  }

}

/* Reel */

main section.reel {

  max-width: 1920px;
  
  margin: 0 auto;
  
  color: #fff;
  
  background-color: #000;

}

main section.reel .top {
 
  display: grid;

  height: 200px;
  
}
  
main section.reel .top > * {

  grid-row-start: 1;
  
  grid-column-start: 1;

}

main section.reel .control {
  
  display: flex;
  
  align-items: flex-end;
  
  height: 100%;
  
  padding: 0 16px;
  
}

main section.reel .control button {
  
  z-index: 2;
  
  margin-bottom: 16px;

}

main section.reel .control button span {
  
  display: grid;
  
  align-items: center;
  
  text-align: center;
  
}

main section.reel .control button span > * {
  
  grid-row-start: 1;
  
  grid-column-start: 1;
      
}

main section.reel .control svg {
  
  filter: drop-shadow( 0 0 5px rgba( 0, 0, 0, 0.75 ) );
  
}

main section.reel .control circle:last-child {

  transform: rotate( -90deg );

  transform-origin: 50% 50%;
  
}

main section.reel .control i {
  
  display: none;
  
}

main section.reel[ data-state = "paused" ] .control .nai-icon-play,

main section.reel[ data-state = "playing" ] .control .nai-icon-pause,

main section.reel[ data-state = "upward" ] .control .nai-icon-arrow-up,

main section.reel[ data-state = "rightward" ] .control .nai-icon-arrow-right,

main section.reel[ data-state = "downward" ] .control .nai-icon-arrow-down,

main section.reel[ data-state = "leftward" ] .control .nai-icon-arrow-left {
  
  display: initial;
  
}

main section.reel .top .items {
 
  display: grid;

  overflow: hidden;

  height: 100%;
  
}

main section.reel .top .item {
  
  grid-row-start: 1;
  
  grid-column-start: 1;
  
  height: 100%;
  
  background-size: cover;
  
  background-position: center;
  
  transition: transform 0.5s;
  
}

main section.reel .top .item[ hidden ] {
  
  display: block;
  
}

main section.reel .top .item[ hidden = "" ] {

  visibility: hidden;
  
}

main section.reel .top .item[ hidden = "upward" ] {
  
  transform: translateY( -100% );
  
}

main section.reel .top .item[ hidden = "downward" ] {
  
  transform: translateY( 100% );
  
}

main section.reel .top .item[ hidden = "leftward" ] {
  
  transform: translateX( -100% );
  
}

main section.reel .top .item[ hidden = "rightward" ] {
  
  transform: translateX( 100% );
  
}

main section.reel .top video {

  display: block;

  width: 100%;
  
  height: 100%;
  
  object-fit: cover;

  object-position: center;

}

main section.reel .bottom {

  overflow: hidden;
  
  background-color: #0075bb;
  
  background-image: url( /images/topographic-dark-translucent.svg );
  
}

main section.reel .dots {

  display: flex;

  padding: 0 4px;

  margin: 16px 0;

}

main section.reel .dots button {

  display: flex;

  align-items: center;

  justify-content: center;

  z-index: 2;

  width: 40px;

  height: 40px;

}

main section.reel .dots button::after {

  display: block;

  width: 10px;

  height: 10px;

  content: "";

  border: 2px solid #fff;

  border-radius: 50%;

}

main section.reel .dots button.current::after {

  background-color: #fff;

}

main section.reel .bottom .items {
  
  display: grid;
  
  align-items: center;
  
  width: 100%;

  margin: 16px 0;
  
}

main section.reel .rich-text {
  
  grid-row-start: 1;
  
  grid-column-start: 1;
 
  padding: 0 16px;
    
  transition: opacity 0.25s, visibility 0.25s;
  
}

main section.reel .rich-text[ hidden ] {
  
  display: block;
  
  height: 0;
  
  opacity: 0;
  
  visibility: hidden;
  
}

@media ( min-width: 768px ) {

  main section.reel {
   
    display: grid;
    
  }

  main section.reel > * {

    grid-row-start: 1;
    
    grid-column-start: 1;
    
    height: 100% !important;
    
  }
  
  main section.reel,
  
  main section.reel .top .item {
    
    height: 56.25vw;
    
    max-height: 644px;
    
  }
  
  main section.reel .control {
    
    justify-content: flex-end;
    
    width: 100%;
    
    max-width: 1920px;
    
    height: 50%;
    
    padding: 0 32px;
    
  }
  
  main section.reel .bottom {
    
    display: grid;
    
    align-items: end;
   
    z-index: 1;
    
    background-color: transparent;
    
    background-image: linear-gradient( to bottom, transparent 0%, rgba( 0, 0, 0, 0.75 ) 100% );
    
  }

  main section.reel .dots {

    flex-direction: column;

    align-items: flex-end;

    grid-row-start: 1;
    
    grid-column-start: 1;

    width: 100%;

    max-width: 1920px;

    height: 50%;

    padding: 0 32px;

    margin: 0 auto;

  }
  
  main section.reel .dots button::after {
    
    box-shadow: 0 0 10px rgba( 0, 0, 0, 0.75 );
    
  }

  main section.reel .bottom .items {
    
    grid-row-start: 1;
    
    grid-column-start: 1;
    
    align-items: end;
    
    max-width: 1324px;
    
    margin: 0 auto;
    
  }

  main section.reel .rich-text {
    
    width: calc( 100% - 104px );
    
    max-width: 792px;
    
    padding: 0 32px;
    
    margin: 64px 0;
    
  }
  
  main section.reel .rich-text[ hidden ] {
    
    height: auto;
    
  }

}

@media ( min-width: 920px ) {
  
  main section.reel .rich-text {
    
    padding: 0 64px;
    
    margin: 96px 0;
    
  }
  
  main section.reel .rich-text h2 {
    
    font-size: 64px;
    
  }
  
}

/* Search Results */

main section.results {

  margin-bottom: 96px;

}

main section.results .bar {

  max-width: 1920px;

  margin: 0 auto;

  background-color: #f3f5f6;

}

main section.results .bar .lock {

  padding: 16px;

}

main section.results .bar p {

  margin-bottom: 0;

  font-size: 18px;

}

main section.results .results .lock {

  padding: 0 16px;

}

main section.results .results {

  max-width: 1920px;

  margin: 0 auto;

}

main section.results .list {

  margin: 24px 0;

}

main section.results .list a {

  display: block;

  padding: 20px 16px;

  transition: background-color 0.25s;

}

main section.results .list a:hover,

main section.results .list a:focus {

  background-color: #f3f5f6;

}

main section.results .list a[ hidden ] {

  display: none;
  
}

main section.results .list h2 {

  margin: 16px 0;

}

main section.results .list h2 small {

  display: block;

  margin: 8px 0;

  letter-spacing: 3px;

  text-transform: uppercase;

  font-size: 11px;

  font-weight: 700;

  color: #506c76;

}

main section.results .list h2 span {

  font-size: 18px;

  font-weight: 700;

  color: #002a3a;

  margin-bottom: 8px;

}

main section.results .list p {

  margin: 16px 0;

  line-height: 1.5em;

  font-size: 14px;

  color: #345561;

}

main section.results .list a em {

  font-style: normal;

  font-weight: bold;

  color: #0075bb;

}

main section.results .list .mock-nav {

  margin: 30px auto 0 auto;
  
  text-align: center;
  
}

main section.results .list .mock-nav button[ disabled ],

main section.results .list .mock-nav button[ disabled ]:hover,

main section.results .list .mock-nav button[ disabled ]:focus {

  color: #fff;

  background-color: #ccc;
  
  border-color: #ccc;
  
  cursor: not-allowed;
  
}

main section.results .sidebar {

  display: none;

}

main section.results .cards {

  display: flex;

  justify-content: center;

  flex-wrap: wrap;

  margin: -24px -12px;

}

@media ( min-width: 768px ) {

  main section.results .bar .lock {

    max-width: 996px;

    padding: 16px 32px;

    margin: 0 auto;

  }

  main section.results .bar p {

    font-size: 20px;

  }

  main section.results .results .lock {

    padding: 0 32px;

  }

  main section.results .results .list a {

    padding: 20px 32px;

  }

}

@media ( min-width: 960px ) {

  main section.results .bar p {

    font-size: 24px;

  }

  main section.results .results .lock {

    display: flex;

    max-width: 1060px;

    margin: 0 auto;

  }

  main section.results .results .list {

    width: 100%;

  }
  
  main section.results .results .sidebar {

    display: block;

    min-width: 282px;

    max-width: 282px;

    margin: 24px 0 24px 86px;

  }

}

/* Rich Text */

main section.rich-text {

  max-width: 1920px;

  margin: 96px auto;

}

main section.rich-text .lock {

  max-width: 920px;

  padding: 0 32px;

  margin: 0 auto;

}

@media ( min-width: 768px ) {

  main section.rich-text .lock {

    padding: 0 64px;

  }

}

/* Series */

main section.series {
  
  margin: 96px 0;

}

main section.series .rich-text {

  padding: 0 16px;

  margin: 32px 0;

}

main section.series .series {
  
  display: flex;

  align-items: flex-end;
  
  position: relative;
  
  width: 100%;
  
  min-height: 550px;
  
  padding: 16px 32px;
  
  color: #fff;

}

main section.series .series .image {

  position: absolute;
  
  top: 0;
  
  left: 0;
  
  width: 100%;
  
  height: 100%;
  
  background-position: center;

  background-size: cover;
  
  --background-gradient: linear-gradient( to bottom, transparent 0%, rgba( 0, 0, 0, 0.8 ) 100% );
  
}

main section.series .series .content {
  
  position: relative;
  
}

main section.series .series h3 {

  margin: 16px 0;

}

main section.series .series h3 small {
  
  display: block;

  margin: 8px 0;
  
  letter-spacing: 3px;
  
  text-transform: uppercase;
  
  font-size: 12px;
  
  font-weight: 700;
  
}

main section.series .series h3 span {

  font-size: 24px;

  font-weight: 700;
  
}

main section.series .series p {

  max-width: 384px;

  margin: 16px 0;

  font-size: 14px;

  line-height: 1.5em;

}

main section.series .series .mock-nav {

  overflow: hidden;

  margin: 24px 0 16px;

}

main section.series .stories {

  width: 100%;
  
  background-color: #fff;
  
}

main section.series .stories h3 {

  padding: 24px 16px;
  
  font-size: 18px;
  
  font-weight: 700;

}

main section.series .stories a {

  display: flex;
  
  align-items: center;
  
  background-color: #fff;
  
}

main section.series .stories a:nth-child( even ) {

  background-color: #f3f5f6;

}

main section.series .stories .content {
  
  width: 100%;
  
  padding: 16px;

}

main section.series .stories h4 {

  margin: 8px 0;

  font-size: 16px;

  font-weight: 700;

  transition: color 0.25s;

}

main section.series .stories a:hover h4,

main section.series .stories a:focus h4 {
  
  color: #0075bb;
  
}

main section.series .stories h4 span {

  line-height: 1.5em;

  padding-bottom: 3px;

  background-size: 0 2px;

  background-repeat: no-repeat;

  background-position: bottom left;

  background-image: linear-gradient( to right, #0075bb 0%, #0075bb 100% );

  transition: background-size 0.25s;

}

main section.series .stories a:hover h4 span,

main section.series .stories a:focus h4 span {

  background-size: 100% 2px;

}

main section.series .stories time {

  display: block;
  
  margin: 8px 0;

  color: #395965;

  font-size: 14px;

}

@media ( min-width: 500px ) {
  
  main section.series .stories .image {

    min-width: 100px;
    
    height: 100px;
    
    background-size: cover;
    
    background-position: center;

  }
  
}

@media ( min-width: 768px ) {

  main section.series {
    
    max-width: 1920px;
    
    margin: 0 auto;

    background-color: #0075bb;

    background-image: url( ../images/topographic-dark-translucent.svg );
    
    background-repeat: repeat;
    
    background-position: center;

  }
  
  main section.series .lock {
  
    overflow: hidden;
    
    max-width: 832px;
    
    padding: 0 32px;
    
    margin: 0 auto;
    
  }
  
  main section.series .rich-text,
  
  main section.series .selection {
    
    margin: 64px 0;
    
  }
  
  main section.series .rich-text {
    
    padding: 0;
    
    color: #fff;
    
    text-align: center;
    
  }
  
  main section.series .stories a {
    
    height: 160px;
    
    padding: 20px 24px;
    
  }
  
  main section.series .stories .image {

    min-width: 180px;
    
    height: 120px;

  }
  
  main section.series .stories .content {
    
    padding: 0 24px;
  
  }
  
  main section.series .stories h4 {
  
    font-size: 18px;
    
  }
  
  main section.series .stories h4 span {
  
    background-image: none;
    
  }
  
  main section.series .stories a {
    
    position: relative;
    
    transition: box-shadow 0.25s, transform 0.25s;
    
  }
  
  main section.series .stories a:hover,
  
  main section.series .stories a:focus {
  
    z-index: 1;

    box-shadow: 0 4px 16px rgba( 0, 0, 0, 0.125 );

    transform: scale( 1.05 );
    
  }

}

@media ( min-width: 1264px ) {

  main section.series .lock {
  
    max-width: 1264px;
    
  }
  
  main section.series .selection {
  
    display: flex;
    
  }
  
  main section.series .series {
  
    max-width: 588px;
    
  }
  
}

/* Split */

main section.split {

  max-width: 1920px;

  margin: 96px auto;

}

main section.split[ data-image ] .image {

  height: 56.25vw;

  min-height: 400px;

  margin-bottom: 64px;

  background-size: cover;

  background-repeat: no-repeat;

}

main section.split[ data-image-hidden-on-mobile ] .image {

  display: none;

}

main section.split .rich-text {

  padding: 0 32px;

  margin: 0 auto;

}

main section.split nav {

  margin: 32px 0;

}

@media ( min-width: 920px ) {
  
  main section.split .lock {

    display: flex;

    align-items: center;

    max-width: 1264px;

    margin: 0 auto;

    padding: 0 32px;

  }

  main section.split[ data-image = "right" ] .lock {

    flex-direction: row-reverse;

  }

  main section.split[ data-image = "left" ] .lock {

    flex-direction: row;

  }

  main section.split[ data-image ] .image {

    display: initial !important;

    align-self: stretch;

    width: 50%;

    height: auto;

    min-height: 440px;

    margin: 0;

  }

  main section.split[ data-image ] .rich-text {

    width: 50%;

    text-align: left;

  }

  main section.split[ data-image = "right" ] .rich-text {

    padding: 0 128px 0 0;

  }

  main section.split[ data-image = "left" ] .rich-text {

    padding: 0 0 0 128px;

  }

}

/* Stats */

main section.stats {

  max-width: 1920px;

  margin: 96px 0;

}

main section.stats .lock {

  max-width: 792px;

  padding: 0 32px;

  margin: 0 auto;

}

main section.stats .stat {

  margin: 48px 0;

  text-align: center;

}

main section.stats .number {

  font-family: "Sentinel A", "Sentinel B", helvetica, serif;

  font-size: 48px;

  font-weight: 700;

  color: #0075bb;

}

main section.stats .text {

  font-size: 18px;

  font-weight: 700;

}

@media ( min-width: 640px ) {

  main section.stats .lock {

    display: flex;

    justify-content: center;
    
    padding: 0;

  }

  main section.stats .stat {

    width: 290px;

    padding: 0 32px;

    margin: 0;

  }

  main section.stats .stat:not( :first-child ) {

    border-left: 2px solid #d4dbde;

  }

}

@media ( min-width: 768px ) {

  main section.stats .lock {
    
    padding: 0 32px;

  }
  
}

/* Upcoming */

main section.upcoming {

  overflow: hidden;

  max-width: 1920px;

  margin: 0 auto;

  background-color: #f3f5f6;

}

main section.upcoming .lock {

  max-width: 920px;

  padding: 0 32px;

  margin: 96px auto;

}

main section.upcoming h2 {

  margin: 32px 0;

  font-size: 28px;

  font-weight: 700;

}

main section.upcoming li {

  padding: 8px 16px;

  background-color: #fff;

  border-width: 1px 0;

  border-style: solid;

  border-color: #f3f5f6;

  display: grid;

  grid-template: 
      "time"
      "price"
      "spots";

  list-style-type: none;

}

main section.upcoming li:nth-child( n + 6 ) {

  display: none;

}

main section.upcoming time {

  display: block;
  
  grid-area: time;

  margin: 8px 0 4px;

  line-height: 1.5em;

  font-weight: 700;

}

main section.upcoming time span {

  display: inline;

}

main section.upcoming .price {

  color: #345561;

  font-size: 14px;

  grid-area: price;

  margin: 4px 0 4px;


}

main section.upcoming .spots {

  display: flex;

  align-items: center;

  grid-area: spots;

  margin: 4px 0 8px;

}

main section.upcoming .spots i {

  margin-right: 8px;

  color: #00a376;

}

@media ( min-width: 768px ) {

  main section.upcoming li:nth-child( n + 6 ) {

    display: grid;
  
  }

  main section.upcoming .lock {

    padding: 0 64px;

  }

  main section.upcoming h2 {

    font-size: 36px;

  }

  main section.upcoming ul {

    overflow-x: hidden;

    overflow-y: scroll;

    max-height: 290px;

  }

  main section.upcoming li {

    grid-template: 
      "time spots"
      "price .";

  }

  main section.upcoming .price {
  
    margin: 4px 0 8px;
  
  }

  main section.upcoming .spots {

    flex-direction: row-reverse;
    
    margin: 8px 0 4px;

  }

  main section.upcoming .spots i {

    margin-left: 8px;

    margin-right: 0;

  }

}

/* Video */

main section.video {

  max-width: 1920px;

  margin: 96px auto;

}

main section.video .lock {

  max-width: 996px;

  margin: 0 auto;

}

main section.video .wrapper {

  position: relative;

}

main section.video .wrapper[ data-aspect-ratio = "16:9" ] {

  max-height: 560px;

  padding-bottom: 56.25%;

}

main section.video .wrapper[ data-aspect-ratio = "4:3" ] {

  max-height: 747px;

  padding-bottom: 75%;

}

main section.video .wrapper iframe {

  position: absolute;

  width: 100%;

  height: 100%;

}

/* Footer */

#footer {

  max-width: 1920px;

  margin: 0 auto;

  color: rgba( 255, 255, 255, 0.65 );

}

#footer a {

  transition: color 0.25s;

}

#footer a:hover,

#footer a:focus {

  color: #fff;

}

#footer a .underline .text,

#footer button .underline .text {

  line-height: 1.5em;

  padding-bottom: 3px;

  background-size: 0 2px;

  background-repeat: no-repeat;

  background-position: bottom left;

  background-image: linear-gradient( to right, #fff 0%, #fff 100% );

  transition: background-size 0.25s;

}

#footer a:hover .underline .text,

#footer a:focus .underline .text,

#footer button:not( [ disabled ] ):hover .underline .text,

#footer button:not( [ disabled ] ):focus .underline .text {

  background-size: 100% 2px;

}

#footer .title {

  position: relative;

  background-color: #012a3a;

}

#footer .title .lock {

  position: relative;

  padding: 40px 16px;

}

#footer .title .lock::after {

  position: absolute;

  bottom: 0;

  left: 16px;

  width: calc( 100% - 32px );

  height: 2px;

  content: "";

  background-color: #fff;

  opacity: 0.1;

}

#footer .title a {

  display: block;

  margin: 32px 0;

}

#footer .title img {

  display: block;

  width: 100%;

  max-width: 340px;

}

#footer .title p {

  max-width: 570px;

  margin: 32px 0;

  line-height: 1.5em;

  font-family: "Sentinel A", "Sentinel B", helvetica, serif;

  font-size: 20px;

}

@media ( min-width: 768px ) {

  #footer .title .lock {

    padding: 40px 32px;

  }

  #footer .title .lock::after {

    left: 32px;

    width: calc( 100% - 64px );

  }

}

@media ( min-width: 1124px ) {

  #footer .title .lock {

    display: flex;

    align-items: center;

    max-width: 1264px;

    padding: 70px 32px;

    margin: 0 auto;

  }

  #footer .title .home {

    margin-right: 100px;

  }

}

#footer .supplemental {

  background-color: #012a3a;

}

#footer .supplemental .lock {

  display: flex;

  flex-wrap: wrap;

  justify-content: center;

  padding: 25px 0;

}

#footer .supplemental nav {

  width: 100%;

  margin: 32px 0;

}

#footer .supplemental nav:not( .support ) a {

  padding: 16px;

}

#footer .supplemental nav:not( .support ) a {

  display: flex;

  align-items: center;

}

#footer .supplemental nav:not( .support ) a .underline {

  margin-right: 16px;

}

#footer .supplemental nav:not( .support ) a i {

  margin-left: auto;

}

#footer .supplemental nav:not( .support ) > :first-child {

  font-weight: 700;

  color: #fff;

}

#footer .supplemental nav.support {

  max-width: 240px;

  padding: 0 16px;

}

#footer .supplemental nav.support > a {

  display: flex;

  align-items: center;

  justify-content: center;

  height: 40px;

  padding: 0 32px;

  margin-bottom: 16px;

  font-weight: 700;

  font-size: 14px;

  color: #fff;

  background-color: #012a3a;

  border: 2px solid #fff;

  border-radius: 20px;

  transition: color 0.25s, background-color 0.25s, border-color 0.25s;

}

#footer .supplemental nav.support > a:hover,

#footer .supplemental nav.support > a:focus {

  color: #fff;

  background-color: #0075bb;

  border-color: #0075bb;

}

#footer .supplemental nav.support .tickets {

  color: #012a3a;

  background-color: #fff;

}

#footer .supplemental nav .social {

  display: flex;

  justify-content: center;

}

#footer .supplemental nav .social a {

  width: 20%;

  padding: 16px 0;

  text-align: center;

}

@media ( min-width: 640px ) {

  #footer .supplemental nav {

    max-width: 230px;

  }

  #footer .supplemental nav:not( .support ) a i {

    display: none;

  }

}

@media ( min-width: 768px ) {

  #footer .supplemental .lock {

    max-width: 1264px;

    padding: 0 16px;

    margin: 0 auto;

  }

}

@media ( min-width: 1232px ) {

  #footer .supplemental .lock {

    flex-wrap: initial;

    padding: 0 16px;

  }

  #footer .supplemental nav.support {

    margin-left: auto;

  }

}

#footer .ancillary {

  overflow: hidden;

  background-color: #001e2b;

}

#footer .ancillary .lock {

  padding: 8px 0;

  line-height: 1.5em;

  font-size: 14px;

}

#footer .ancillary .language {

  display: flex;

}

#footer .ancillary .language a,

#footer .ancillary .information > * {

  display: flex;

  align-items: center;

  position: relative;

  padding: 16px;

}

@media ( min-width: 768px ) {

  #footer .ancillary .lock {

    padding: 8px 16px;

  }

}

@media ( min-width: 1060px ) {

  #footer .ancillary .lock {

    display: flex;

    max-width: 1264px;

    padding: 0 16px;

    margin: 0 auto;

  }

  #footer .ancillary .information {

    display: flex;

    margin-left: auto;

  }

  #footer .ancillary .information > *:not( :last-child )::after {

    position: absolute;

    top: 25%;

    right: 0;

    width: 1px;

    height: 50%;

    content: "";

    background-color: rgba( 255, 255, 255, 0.2 );

  }

}

/* Olark */

.olark-launch-button {

  text-align: center;

}