@charset "UTF-8";

html { font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }


@-ms-viewport { width: device-width; }


@media (max-width: 767px) {
  > .cell [class*="col-"] { width: 100%; } }


@media (max-width: 485px) { /*cut the text for very small mobiles to stop text overlay issues.*/ }

@media (max-width: 350px) { /*hide the text.*/ }


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


.fade { opacity: 0; transition: opacity 0.15s linear; }

.fade.in { opacity: 1; }

.collapse { display: none; visibility: hidden; }

.collapse.in { display: block; visibility: visible; }

.tooltip { position: absolute; z-index: 1070; display: block; visibility: visible; font-family: "HelveticaNeue", "Helvetica", "Arial", sans-serif; font-size: 12px; font-weight: normal; line-height: 1.4; opacity: 0; filter: alpha(opacity=0); }

.tooltip.in { opacity: 0.9; filter: alpha(opacity=90); }

.tooltip.top { margin-top: -3px; padding: 5px 0; }

.tooltip.right { margin-left: 3px; padding: 0 5px; }

.tooltip.bottom { margin-top: 3px; padding: 5px 0; }

.tooltip.left { margin-left: -3px; padding: 0 5px; }

.tooltip-inner { max-width: 200px; padding: 3px 8px; color: #fff; text-align: center; text-decoration: none; background-color: #000; border-radius: 0; }

.tooltip-arrow { position: absolute; width: 0; height: 0; border-color: transparent; border-style: solid; }

.tooltip.top .tooltip-arrow { bottom: 0; left: 50%; margin-left: -5px; border-width: 5px 5px 0; border-top-color: #000; }

.tooltip.top-left .tooltip-arrow { bottom: 0; right: 5px; margin-bottom: -5px; border-width: 5px 5px 0; border-top-color: #000; }

.tooltip.top-right .tooltip-arrow { bottom: 0; left: 5px; margin-bottom: -5px; border-width: 5px 5px 0; border-top-color: #000; }

.tooltip.right .tooltip-arrow { top: 50%; left: 0; margin-top: -5px; border-width: 5px 5px 5px 0; border-right-color: #000; }

.tooltip.left .tooltip-arrow { top: 50%; right: 0; margin-top: -5px; border-width: 5px 0 5px 5px; border-left-color: #000; }

.tooltip.bottom .tooltip-arrow { top: 0; left: 50%; margin-left: -5px; border-width: 0 5px 5px; border-bottom-color: #000; }

.tooltip.bottom-left .tooltip-arrow { top: 0; right: 5px; margin-top: -5px; border-width: 0 5px 5px; border-bottom-color: #000; }

.tooltip.bottom-right .tooltip-arrow { top: 0; left: 5px; margin-top: -5px; border-width: 0 5px 5px; border-bottom-color: #000; }

.tooltip-inner a:hover { border-bottom: 0; text-decoration: underline; }

.tooltip.top { margin-top: -8px; padding: 4px 0 6px 0; }

.tooltip.in { opacity: 1; }

.tooltip-inner { background: #3B3B3A; box-shadow: 0 0 4px 1px rgba(0, 0, 0, 0.16); border-radius: 4px; max-width: 296px; padding: 16px; text-align: left; width: 296px; }

.tooltip.top > .tooltip-mask { background-color: #3B3B3A; bottom: 0; height: 16px; left: 50%; margin: 0 0 6px -12px; position: absolute; width: 24px; }

.tooltip.top > .tooltip-arrow { background-color: #3B3B3A; border-radius: 2px; border-width: 0; box-shadow: 0 0 4px 1px rgba(0, 0, 0, 0.16); height: 16px; margin-left: -8px; width: 16px; -ms-transform: rotate(45deg); transform: rotate(45deg); }

.tooltip-inner h1 { color: #fff; font-size: 14px; font-weight: 600; margin: 0 0 8px 0; line-height: 24px; text-transform: uppercase; }

.tooltip-inner p { font-size: 14px; font-weight: 300; margin: 0; line-height: 20px; }

.tooltip-inner a { background: #fff; border-radius: 2px; color: #3B3B3A; display: inline-block; font-size: 12px; font-weight: 600; margin-top: 12px; padding: 8px 12px; text-transform: uppercase; }


/* Journey Module START: CMS values
** Can be overidden by inline styles
*/
.j-wrapper { margin: 0 auto; max-width: 1200px; padding-bottom: 20px; }

/*Added Colour themes*/
.journey-aqua { /* Section background colour */ /* Dots border colour */ /* Heading underline colour */ /* Button background colour */ /*Added section 4*/ /* Button background colour */ }

.journey-aqua #j-sec-1 { background-color: #e8eeee; }

.journey-aqua #j-sec-1 .j-dots li > span.j-label::after { background: #68c3c9 !important; border-color: #e8eeee !important; }

.journey-aqua #j-sec-1 > h1 { border-bottom-color: #68c3c9 !important; }

.journey-aqua #j-sec-1 .j-btn, .journey-aqua #j-sec-1 .j-mask { background-color: #68c3c9 !important; }

.journey-aqua #j-sec-2 { background-color: #eef3f3; }

.journey-aqua #j-sec-2 .j-dots li > span.j-label::after { background: #3896a5 !important; border-color: #eef3f3 !important; }

.journey-aqua #j-sec-2 > h1 { border-bottom-color: #3896a5 !important; }

.journey-aqua #j-sec-2 .j-btn, .journey-aqua #j-sec-2 .j-mask { background-color: #3896a5 !important; }

.journey-aqua #j-sec-3 { background-color: #f6f8f8; }

.journey-aqua #j-sec-3 .j-dots li > span.j-label::after { background: #195761 !important; border-color: #f6f8f8 !important; }

.journey-aqua #j-sec-3 > h1 { border-bottom-color: #195761 !important; }

.journey-aqua #j-sec-3 .j-btn, .journey-aqua #j-sec-3 .j-mask { background-color: #195761 !important; }

.journey-aqua #j-sec-1 .j-btn, .journey-aqua #j-sec-1 .j-mask, .journey-aqua #j-sec-1 .tooltip-inner, .journey-aqua #j-sec-1 .tooltip.top > .tooltip-mask, .journey-aqua #j-sec-1 .tooltip.top > .tooltip-arrow { background-color: #68c3c9 !important; }

.journey-aqua #j-sec-2 .j-btn, .journey-aqua #j-sec-2 .j-mask, .journey-aqua #j-sec-2 .tooltip-inner, .journey-aqua #j-sec-2 .tooltip.top > .tooltip-mask, .journey-aqua #j-sec-2 .tooltip.top > .tooltip-arrow { background-color: #3896a5 !important; }

.journey-aqua #j-sec-3 .j-btn, .journey-aqua #j-sec-3 .j-mask, .journey-aqua #j-sec-3 .tooltip-inner, .journey-aqua #j-sec-3 .tooltip.top > .tooltip-mask, .journey-aqua #j-sec-3 .tooltip.top > .tooltip-arrow { background-color: #195761 !important; }

.journey-aqua #j-sec-4 .j-btn, .journey-aqua #j-sec-4 .j-mask, .journey-aqua #j-sec-4 .tooltip-inner, .journey-aqua #j-sec-4 .tooltip.top > .tooltip-mask, .journey-aqua #j-sec-4 .tooltip.top > .tooltip-arrow { background-color: #002731 !important; }



.journey-aqua .j-dots li > span.j-label::before { background: #195761; }

.journey-aqua .j-secs { background-color: #e8eeee; /* NOTE: border-bottom-color used to set line color */ border: 0 #195761; }

.journey-blue { /* Section background colour */ /* Dots border colour */ /* Heading underline colour */ /* Button background colour */ /*Added section 4*/ /* Button background colour */ }

.journey-blue #j-sec-1 { background-color: #e8eeee; }

.journey-blue #j-sec-1 .j-dots li > span.j-label::after { background: #84C6EE !important; border-color: #e8eeee !important; }

.journey-blue #j-sec-1 > h1 { border-bottom-color: #84C6EE !important; }

.journey-blue #j-sec-1 .j-btn, .journey-blue #j-sec-1 .j-mask, .journey-blue #j-sec-1 .tooltip-inner, .journey-blue #j-sec-1 .tooltip.top > .tooltip-mask, .journey-blue #j-sec-1 .tooltip.top > .tooltip-arrow { background-color: #84C6EE !important; }

.journey-blue #j-sec-1 .tooltip-inner a { color: #84C6EE; }

.journey-blue #j-sec-2 { background-color: #eef3f3; }

.journey-blue #j-sec-2 .j-dots li > span.j-label::after { background: #2E92D1 !important; border-color: #eef3f3 !important; }

.journey-blue #j-sec-2 > h1 { border-bottom-color: #2E92D1 !important; }

.journey-blue #j-sec-2 .j-btn, .journey-blue #j-sec-2 .j-mask, .journey-blue #j-sec-2 .tooltip-inner, .journey-blue #j-sec-2 .tooltip.top > .tooltip-mask, .journey-blue #j-sec-2 .tooltip.top > .tooltip-arrow { background-color: #2E92D1 !important; }

.journey-blue #j-sec-2 .tooltip-inner a { color: #2E92D1; }

.journey-blue #j-sec-3 { background-color: #f6f8f8; }

.journey-blue #j-sec-3 .j-dots li > span.j-label::after { background: #1c4e80 !important; border-color: #f6f8f8 !important; }

.journey-blue #j-sec-3 > h1 { border-bottom-color: #1c4e80 !important; }

.journey-blue #j-sec-3 .j-btn, .journey-blue #j-sec-3 .j-mask, .journey-blue #j-sec-3 .tooltip-inner, .journey-blue #j-sec-3 .tooltip.top > .tooltip-mask, .journey-blue #j-sec-3 .tooltip.top > .tooltip-arrow { background-color: #1c4e80 !important; }

.journey-blue #j-sec-3 .tooltip.top > .tooltip-arrow { border-top-color: #1c4e80 !important; }

.journey-blue #j-sec-3 .tooltip-inner a { color: #1c4e80; }

.journey-blue #j-sec-4 { background-color: #e8eeee; }

.journey-blue #j-sec-4 .j-dots li > span.j-label::after { background: #002655 !important; border-color: #e8eeee !important; }

.journey-blue #j-sec-4 > h1 { border-bottom-color: #002655 !important; }

.journey-blue #j-sec-4 .j-btn, .journey-blue #j-sec-4 .j-mask, .journey-blue #j-sec-4 .tooltip-inner, .journey-blue #j-sec-4 .tooltip.top > .tooltip-mask, .journey-blue #j-sec-4 .tooltip.top > .tooltip-arrow { background-color: #002655 !important; }

.journey-blue #j-sec-4 .tooltip-inner a { color: #002655; }

.journey-blue .j-dots li > span.j-label::before { background: #0a0d30; }

.journey-blue .j-secs { background-color: #e8eeee; /* NOTE: border-bottom-color used to set line color */ border: 0 #002655; }


/* End of theme styles */
#j-sec-1 .tooltip-inner a:hover { border-bottom: 0; text-decoration: underline; }
/* Button x, y position */
#j-sec-1 .j-btn { top: 330px; left: 40px; }

#j-sec-2 .j-btn { top: 405px; }

#j-sec-3 .j-btn { top: 380px; left: -37px; }

.closed.left#j-sec-2 .j-btn { top: 307px; left: 5px; }
/* Dots x, y position */
@media (min-width: 992px) { #j-sec-1 .j-dot-1 { margin-left: 24px; }
  /*Added point number adjustments*/
  /*One slide styles*/
  /*Two slide styles*/
  /*Three slide styles*/
  .j-sec-3-secs { /*tab version styles*/ /* Section 1*/ /* Section 2*/ /* Section 3*/ }
  .j-sec-3-secs #j-sec-1.j-sec-8-points .j-dot-1 { top: -15px; }
  .j-sec-3-secs #j-sec-1.j-sec-8-points .j-dot-2 { top: -35px; }
  .j-sec-3-secs #j-sec-1.j-sec-8-points .j-dot-3 { top: -43px; }
  .j-sec-3-secs #j-sec-1.j-sec-8-points .j-dot-4 { top: -42px; }
  .j-sec-3-secs #j-sec-1.j-sec-8-points .j-dot-5 { top: -30px; }
  .j-sec-3-secs #j-sec-1.j-sec-8-points .j-dot-6 { top: -11px; }
  .j-sec-3-secs #j-sec-1.j-sec-8-points .j-dot-7 { top: 18px; }
  .j-sec-3-secs #j-sec-1.j-sec-8-points .j-dot-8 { top: 37px; }
  .j-sec-3-secs #j-sec-2.j-sec-3-points .j-dot-1 { top: -43px; }
  .j-sec-3-secs #j-sec-2.j-sec-3-points .j-dot-2 { top: 0px; }
  .j-sec-3-secs #j-sec-2.j-sec-3-points .j-dot-3 { top: 51px; }
  .j-sec-3-secs #j-sec-3.j-sec-3-points .j-dot-1 { top: -17px; }
  .j-sec-3-secs #j-sec-3.j-sec-3-points .j-dot-2 { top: 45px; }
  .j-sec-3-secs #j-sec-3.j-sec-3-points .j-dot-3 { top: 39px; }
  /*Four Slides*/ }

/*Mobile*/
@media (max-width: 991.98px) { /* Section 1*/
  #j-sec-1 .j-dot-1 { left: 0; }
  #j-sec-1 .j-dot-2 { left: 5px; }
  #j-sec-1 .j-dot-3 { left: 0px; }
  #j-sec-1 .j-dot-4 { left: -1px; }
  #j-sec-1 .j-dot-5 { left: 4px; }
  #j-sec-1 .j-dot-6 { left: -2px; }
  #j-sec-1 .j-dot-7 { left: -2px; }
  /* Section 2*/
  #j-sec-2 .j-dot-1 { left: 4px; }
  #j-sec-2 .j-dot-2 { left: -5px; }
  #j-sec-2 .j-dot-3 { left: 5px; }
  /* Section 3*/
  .j-dot-1 { left: 7px; }
  .j-dot-2 { left: -3px; }
  .j-dot-3 { left: 2px; } }

#j-sec-2 .j-txt { width: 488px; }

#j-sec-3 .j-txt { width: 576px; }

/* END: CMS values */
.j-secs { -ms-flex-align: stretch; align-items: stretch; display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; margin: 0; -webkit-padding-start: 0; padding-inline-start: 0; padding: 0; }

.j-secs *, .j-secs :after, .j-secs :before { box-sizing: content-box; }

.j-sec { list-style-type: none; margin: 0; padding: 16px; position: relative; }

.j-sec > h1 { font-size: 16px; font-weight: 600; text-transform: uppercase; border-bottom: 8px solid; margin: 16px 0 40px 0; padding-bottom: 8px; line-height: 32px; }

.j-sec > h1 > span { display: block; width: 160px; }

.j-graph { height: 192px; margin: 176px -16px 120px -16px; position: relative; }

.j-canvas-wrapper { height: 100%; overflow: hidden; position: absolute; width: 100%; }

.j-dots-wrapper { position: relative; padding: 0; }

li.j-sec:first-child .j-graph { margin-left: 0; }

li.j-sec:last-child .j-graph { margin-right: 0; }

.j-dots { -ms-flex-align: stretch; align-items: stretch; display: -ms-flexbox; display: flex; -ms-flex-pack: space-evenly; justify-content: space-evenly; list-style-type: none; -webkit-padding-start: 0; padding-inline-start: 0; padding: 0; width: 100%; }

.j-dots > li { display: block; -ms-flex: 0 1 100%; flex: 0 1 100%; position: relative; text-align: center; }

.j-dots li > span.j-label::before { border-radius: 4px; content: ""; display: block; position: absolute; height: 80px; width: 4px; margin: 0 auto; left: 0; right: 0; bottom: 0; }

.j-dots li > span.j-label::after { content: ""; border-radius: 24px; display: block; position: absolute; height: 24px; width: 24px; margin: 0 auto; left: 0; right: 0; bottom: 0; border-style: solid; border-width: 4px; }

.j-dots li:not(.top) > span.j-label::before, .j-dots li:not(.top) > span.j-label::after { top: 0; }

.j-dots > li:last-of-type { margin-right: 16px; }

.j-dots > li > span.j-label { cursor: pointer; display: block; font-weight: 600; font-size: 12px; margin: 0; text-align: center; max-width: 176px; line-height: 24px; text-transform: uppercase; position: relative; margin: 0 auto; }

.j-sec.closed .j-dots > li > span.j-label { cursor: default; }

.j-txt { font-size: 17px; font-weight: 300; margin: 80px 0 40px 24px; width: 400px; line-height: 32px; }

.j-bg { position: absolute; bottom: 0; left: 0; width: 800px; }

.j-line { position: absolute; top: 0; height: 100%; width: 100%; }

.j-btn { cursor: pointer; display: block; height: 48px; width: 48px; border: 4px solid #fff; border-radius: 50%; position: absolute; margin: auto; left: 0; right: 0; top: 0; z-index: 99; }

.j-btn:hover { text-decoration: none; border-color: #fff; }

.j-btn:hover.pulse .j-pulse-1, .j-btn:hover.pulse .j-pulse-2, .j-btn:hover.pulse .j-pulse-3 { animation: 0; }

.j-btn.pulse .j-pulse-1, .j-btn.pulse .j-pulse-2, .j-btn.pulse .j-pulse-3 { height: 100%; width: 100%; border-radius: 50%; }

.j-btn.pulse .j-pulse-1 { animation: j-btn-pulse-1 5.44s 4s infinite ease-in-out; }

.j-btn.pulse .j-pulse-2 { animation: j-btn-pulse-2 5.44s 4.48s infinite ease-in-out; }

.j-btn.pulse .j-pulse-3 { animation: j-btn-pulse-3 5.44s 4.96s infinite ease-in-out; }

@keyframes j-btn-pulse-1 { 0% { box-shadow: 0 0 0 0px rgba(56, 150, 165, 0.48); }
  8% { box-shadow: 0 0 0 12px rgba(56, 150, 165, 0); }
  100% { box-shadow: 0 0 0 12px rgba(56, 150, 165, 0); } }

@keyframes j-btn-pulse-2 { 0% { box-shadow: 0 0 0 0px rgba(56, 150, 165, 0.48); }
  8% { box-shadow: 0 0 0 12px rgba(56, 150, 165, 0); }
  100% { box-shadow: 0 0 0 12px rgba(56, 150, 165, 0); } }

@keyframes j-btn-pulse-3 { 0% { box-shadow: 0 0 0 0px rgba(56, 150, 165, 0.48); }
  8% { box-shadow: 0 0 0 12px rgba(56, 150, 165, 0); }
  100% { box-shadow: 0 0 0 12px rgba(56, 150, 165, 0); } }

.j-btn.pulse .j-arrow { animation: j-arrow-pulse 5.44s 4s infinite ease-in-out; }

@keyframes j-arrow-pulse { 0% { margin-left: 0; }
  4% { margin-left: 12px; }
  8% { margin-left: 0; }
  12% { margin-left: 12px; }
  16% { margin-left: 0; }
  20% { margin-left: 12px; }
  25% { margin-left: -3px; }
  26% { margin-left: 0; }
  100% { margin-left: 0; } }

.j-arrow-wrapper { width: 16px; height: 16px; position: absolute; top: 16px; left: 14px; }

.j-arrow { width: 100%; height: 100%; background-color: #fff; position: relative; left: 0; margin-left: 0; -ms-transform: rotate(225deg); transform: rotate(225deg); transition: all 0.16s ease-out; }

.j-mask { width: 100%; height: 100%; position: absolute; left: 25%; top: -25%; }

.j-tail { width: 0; height: 25%; position: absolute; background-color: #fff; right: 0; top: 6px; transition: all 0.16s ease-out; }

/* START: Desktop */
@media (min-width: 992px) { .j-sec > h1 > span { min-height: 64px; }
  .j-btn:hover .j-arrow { animation: 0; margin-left: 7px; }
  .j-btn:hover .j-tail { margin-right: -6px; width: 28px; }
  .j-nav-wrapper { display: none; }
  .closed { width: 168px; }
  .j-sec.opened { width: 840px; z-index: 100; }
  .j-sec { max-width: 768px; min-width: 168px; /*min-height: 840px;*/ }
  .j-dots li.top > span.j-label { padding-bottom: 96px; }
  .j-dots li:not(.top) > span.j-label { padding-top: 96px; }
  /* NOTE: Hide elements to stop them flashing onload */
  .j-sec.closed .j-txt, .j-sec.closed .j-bg { display: none; }
  .j-sec.opened .j-btn { display: none; }
  .j-sec .j-dots li { opacity: 0; }
  .j-dots > li.top { margin-top: 12px; }
  .j-dots > li:not(.top) { margin-top: 76px; }
  .j-txt.j-txt-margin { margin-bottom: 120px; }
  /*Added to handle image without bg text*/
  /*tab version styles*/ }

/* END: Desktop */
/* START: Mobile */
@media (max-width: 991.98px) { .j-nav-wrapper { display: none; position: fixed; overflow: visible; top: 0; width: 100%; z-index: 999; }
  .j-nav { overflow-x: scroll; -ms-overflow-style: none; display: block; background: #fff; box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.24); margin: 0 0 4px 0; scrollbar-width: none; }
  .j-nav::-webkit-scrollbar { display: none; }
  .j-nav ul { list-style: none; padding: 14px 16px; white-space: nowrap; margin: 0; }
  .j-nav ul li { display: inline-block; margin: 0; padding: 0; white-space: nowrap; margin-right: 8px; }
  .j-nav ul li:not(:last-of-type) { margin-right: 16px; }
  .j-nav ul li.active > a { font-weight: 600; color: #000; }
  .j-nav ul li > a { text-transform: uppercase; text-decoration: none; color: #b5b5b5; cursor: pointer; font-weight: 400; font-size: 16px; line-height: 24px; border-bottom: 0; }
  .j-nav-fade { position: absolute; background: linear-gradient(90deg, white, white 2px, rgba(255, 255, 255, 0)); width: 16px; height: 52px; top: 0; left: 0; }
  .j-nav-fade.right { left: unset; right: 0; -ms-transform: rotate(180deg); transform: rotate(180deg); }
  .j-secs { display: table; min-height: unset !important; }
  .j-sec { min-height: 184px; overflow: visible !important; }
  /*Added to handle image without bg text*/
  /*.j-sec:last-child .j-dots > li { margin-bottom: 0; }*/
  .j-sec.closed > h1 { margin-top: 16px; }
  .j-sec > h1 { margin-bottom: 24px; }
  .j-sec h1 > span { width: 100% !important; }
  .j-graph { height: unset !important; margin: 40px 0 40px 16px !important; }
  .j-sec.closed > .j-graph { display: none; }
  .j-dots { display: table; }
  .j-dots > li { margin: 32px 0; }
  .j-dots > li:first-child { margin-top: 0; }
  .j-dots > li > span.j-label { cursor: default; /*margin: 4px 0 4px 0;*/ margin-left: 0px; max-width: 200px; text-align: left; display: block; padding-left: 96px; }
  .j-dots li > span.j-label::before { border-radius: 4px; content: ""; display: block; position: absolute; height: 4px; width: 80px; margin: auto 0; top: 0; left: 0; }
  .j-dots li > span.j-label::after { content: ""; background: #68c3c9; border: 4px solid #e8eeee; border-radius: 24px; display: block; position: absolute; height: 24px; width: 24px; margin: auto 0; top: 0; left: 0; }
  .closed .j-txt { margin-bottom: 32px; display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
  .j-txt { margin: 0; width: 100% !important; }
  .j-txt { display: block; }
  .j-bg { display: none; }
  .j-btn { -ms-transform: rotate(90deg) !important; transform: rotate(90deg) !important; top: unset !important; left: 0 !important; bottom: -24px !important; margin: 0 auto; z-index: 99; } }



.page-content { position: relative; z-index: 1; backface-visibility: hidden; }



body { padding-top: 60px; }

@media (min-width: 992px) { body { padding-top: 0; } }

@media (min-width: 768px) { body { padding-bottom: 0; } }

.page-content { background-color: #fff; }

@media (min-width: 768px) { .page-content { min-height: 800px; } }


@supports (-ms-accelerator: true) { { /* IE Edge 12+ CSS */ } }

@supports (-ms-ime-align: auto) { { /* IE Edge 16+ CSS */ } }