html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline; }

html {
  line-height: 1; }

ol, ul {
  list-style: none; }

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

caption, th, td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle; }

q, blockquote {
  quotes: none; }
  q:before, q:after, blockquote:before, blockquote:after {
    content: "";
    content: none; }

a img {
  border: none; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
  display: block; }

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

.abs-pos, #wrapper, #click_through {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 970px;
  height: 250px;
  overflow: hidden; }

#wrapper {
  position: relative;
  visibility: hidden;
  background-color: #000; }
  #wrapper.show {
    visibility: visible; }

#click_through {
  z-index: 10;
  cursor: pointer;
  background-color: rgba(255, 255, 255, 0);
  border: 1px solid #000000; }

#logo {
  position: absolute;
  width: 100%;
  height: inherit;
  top: 50%;
  left: 50%;
  opacity: 1;
  background: url("../img/logo.png") no-repeat;
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%); }

#tiles_left {
  position: absolute;
  width: 970px;
  height: 250px;
  background: url("../img/tiles_left.png") no-repeat;
  top: 50%;
  left: 50%;
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%); }

#tiles_right {
  position: absolute;
  width: 970px;
  height: 250px;
  background: url("../img/tiles_right.png") no-repeat;
  top: 50%;
  left: 50%;
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%); }

#f1_copy {
  position: absolute;
  width: 970px;
  height: 250px;
  background: url("../img/f1_copy.png") no-repeat;
  top: 50%;
  left: 50%;
  opacity: 0;
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%); }

.globe-mask {
  position: absolute;
  width: 177px;
  height: 177px;
  left: 396px;
  margin: 53px auto;
  z-index: 20; }
  .globe-mask .globe {
    width: 177px;
    height: 177px;
    background-image: url("../img/globe.jpg");
    background-size: 200% 100%;
    background-position: 0 0;
    border-radius: 50%;
    overflow: hidden; }
    .globe-mask .globe .globe-side {
      position: absolute;
      width: 177px;
      height: 177px;
      top: 0;
      left: 0; }
    .globe-mask .globe #globe_back {
      display: none;
      opacity: 0;
      -moz-transform: translateX(100%);
      -ms-transform: translateX(100%);
      -webkit-transform: translateX(100%);
      transform: translateX(100%); }

#path_svg {
  position: absolute;
  top: 0; }

#path_svg2 {
  position: absolute;
  top: -12px;
  left: -12px; }

.flight-path {
  stroke: #FFFFFF;
  stroke-width: 2;
  fill: none; }

.chevron {
  position: absolute;
  top: 129px;
  width: 50px;
  height: 50px;
  z-index: 10;
  background-repeat: no-repeat;
  opacity: 0;
  cursor: pointer; }

#chevron_left {
  left: 283px;
  background: url("../img/chevron_left.png") no-repeat; }

#chevron_right {
  left: 648px;
  background: url("../img/chevron_right.png") no-repeat; }

.popup-container {
  position: absolute;
  display: none;
  opacity: 0;
  z-index: 5; }

.popup {
  background-color: #007bd7;
  border: 1px solid #FFFFFF;
  border-radius: 12px;
  background-repeat: no-repeat;
  position: relative; }

.shine {
  position: absolute;
  left: -4px;
  top: -4px;
  -webkit-filter: blur(1.5px);
  /* Chrome, Safari, Opera */
  filter: blur(1.5px); }

#popup1 {
  left: 122px;
  top: 56px;
  width: 245px;
  height: 81px; }
  #popup1 .popup {
    background-image: url("../img/popup1_copy.png");
    width: 245px;
    height: 81px; }

#popup2 {
  left: -165px;
  top: 32px; }

#popup2 .popup {
  background-image: url("../img/popup2_copy.png");
  width: 238px;
  height: 101px; }

#popup3 {
  left: 121px;
  top: 24px; }

#popup3 .popup {
  background-image: url("../img/popup3_copy.png");
  width: 255px;
  height: 83px; }

#popup4 {
  left: -163px;
  top: 47px; }

#popup4 .popup {
  background-image: url("../img/popup4_copy.png");
  width: 241px;
  height: 102px; }

#popup5 {
  left: 90px;
  top: 8px; }

#popup5 .popup {
  background-image: url("../img/popup5_copy.png");
  width: 137px;
  height: 84px; }

#popup6 {
  left: -248px;
  top: 71px; }

#popup6 .popup {
  background-image: url("../img/popup6_copy.png");
  width: 281px;
  height: 83px; }

#popup7 {
  left: 115px;
  top: 13px; }

#popup7 .popup {
  background-image: url("../img/popup7_copy.png");
  width: 261px;
  height: 83px; }

#popup8 {
  left: 94px;
  top: 103px; }

#popup8 .popup {
  background-image: url("../img/popup8_copy.png");
  width: 258px;
  height: 80px; }

#popup9 {
  left: 86px;
  top: 51px; }

#popup9 .popup {
  background-image: url("../img/popup9_copy.png");
  width: 229px;
  height: 81px; }

#popup10 {
  left: -170px;
  top: 78px; }

#popup10 .popup {
  background-image: url("../img/popup10_copy.png");
  width: 211px;
  height: 83px; }

#tip_start {
  position: absolute;
  width: 970px;
  height: 250px;
  background: url("../img/start.png") no-repeat;
  top: 0;
  left: 0;
  z-index: 30; }

#tip_learnmore {
  background: url("../img/learnmoreBtn.png") no-repeat;
  width: 56px;
  height: 19px;
  position: absolute;
  top: 167px;
  left: 627px;
  opacity: 0;
  z-index: 10;
  cursor: pointer; }

#cta {
  position: absolute;
  opacity: 0;
  width: 87px;
  height: 27px;
  right: 15px;
  bottom: 15px;
  background: url("../img/cta.png") no-repeat;
  background-color: #0078D7;
  transition: bottom 0.25s;
  z-index: 11;
  cursor: pointer; }

#cta.adover {
  bottom: 20px; }

.dot {
  position: absolute;
  width: 8px;
  height: 8px;
  border-radius: 4px;
  border: 1px solid #fff;
  background-color: #2641e2;
  transition: background-color 0.4s;
  z-index: 4;
  /*
  &:hover {
      background-color: #8ac204;
  }
  */ }

.dot.active,
.dot.visited.active {
  background-color: #8ac204;
  transition: background-color 0.4s; }

.dot.visited {
  background-color: #6930b0;
  /*
  &:hover {
      background-color: #8ac204;
  }
  */ }

#globe-lines {
  width: 177px;
  height: 177px; }