/*
 * Global Ignite Variables
 *
 * 1. Ignite custom typography settings for prose (See _prose.scss for explanation).
 *
 * 2. Establish custom spacing variables based on line height to
 *    facilitate vertical rhythm
 *
 * 3. Black/white colour variables
 *
 * 4. Brand visited & focused styles
 *
 * 5. Brand border
 *
 */
/* [1] */
/* [2] */
/* [3] */
/* [4] */
/* [5] */
/*
 * Mixins
 *
 * 1. Intrinsic ratios (eg: Used by _responsive-ratio)
 *
 * 2. Cross browser opacity
 *
 * 3. Font smoothing
 *
 * 4. Px to Em https://web-design-weekly.com/snippets/converts-pixels-to-ems-with-sass/
 *
 * 5. WebKit-style focus
 */
/*
 * Breakpoints
 *
 * Map Bootstrap breakpoints to nice mixins
 */
/* line 6, ../scss/component/_additive.scss */
.tool__popup.additive.additive--methane, .tool__popup.additive.additive--toluene, .tool__popup.additive.additive--acetone, .tool__popup.additive.additive--nicotine, .tool__popup.additive.additive--batteries {
  right: 0px;
  left: inherit;
}
@media (min-width: 992px) {
  /* line 16, ../scss/component/_additive.scss */
  .tool__popup.additive.additive--co {
    top: 28%;
  }
  /* line 17, ../scss/component/_additive.scss */
  .tool__popup.additive.additive--batteries {
    top: 21%;
  }
}
@media (min-width: 1200px) {
  /* line 1, ../scss/component/_additive.scss */
  .tool__popup.additive {
    left: 60px;
  }
  /* line 23, ../scss/component/_additive.scss */
  .tool__popup.additive.additive--toluene {
    top: 12%;
  }
  /* line 24, ../scss/component/_additive.scss */
  .tool__popup.additive.additive--butane {
    top: 20%;
  }
  /* line 25, ../scss/component/_additive.scss */
  .tool__popup.additive.additive--acetone {
    top: 26%;
  }
  /* line 26, ../scss/component/_additive.scss */
  .tool__popup.additive.additive--beryllium, .tool__popup.additive.additive--formaldehyde {
    top: 6%;
  }
  /* line 28, ../scss/component/_additive.scss */
  .tool__popup.additive.additive--nicotine, .tool__popup.additive.additive--batteries {
    top: 23%;
  }
  /* line 30, ../scss/component/_additive.scss */
  .tool__popup.additive.additive--co {
    top: 40%;
  }
  /* line 32, ../scss/component/_additive.scss */
  .tool__popup.additive.additive--methane, .tool__popup.additive.additive--toluene, .tool__popup.additive.additive--acetone, .tool__popup.additive.additive--nicotine, .tool__popup.additive.additive--batteries {
    right: 60px;
  }
}
@media (min-width: 1420px) {
  /* line 1, ../scss/component/_additive.scss */
  .tool__popup.additive {
    left: 175px;
  }
  /* line 44, ../scss/component/_additive.scss */
  .tool__popup.additive.additive--methane, .tool__popup.additive.additive--toluene, .tool__popup.additive.additive--acetone, .tool__popup.additive.additive--nicotine, .tool__popup.additive.additive--batteries {
    right: 175px;
  }
}
/* line 53, ../scss/component/_additive.scss */
.tool__popup.additive img {
  max-height: 120px;
}
@media (min-width: 768px) {
  /* line 53, ../scss/component/_additive.scss */
  .tool__popup.additive img {
    max-height: inherit;
  }
}

/* line 62, ../scss/component/_additive.scss */
.additive__graphic {
  margin-bottom: 28px;
}

/* line 66, ../scss/component/_additive.scss */
.additive .additive__graphic {
  max-width: 75%;
  height: auto;
  margin-left: auto;
  margin-right: auto;
}

/* line 73, ../scss/component/_additive.scss */
.additive--formaldehyde .additive__graphic,
.additive--butane .additive__graphic,
.additive--ammonia .additive__graphic {
  max-width: 55%;
}

/* line 79, ../scss/component/_additive.scss */
.additive--toluene .additive__graphic,
.additive--batteries .additive__graphic {
  max-width: 40%;
}

/* line 85, ../scss/component/_additive.scss */
.additive__list {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
/* line 93, ../scss/component/_additive.scss */
.additive__list > ul {
  color: #ffffff;
  font-weight: bold;
  font-style: italic;
  font-size: 2rem;
  text-align: center;
  list-style: none;
  padding: 5%;
  margin: 0;
  position: absolute;
  width: 100%;
}
@media (min-width: 768px) {
  /* line 93, ../scss/component/_additive.scss */
  .additive__list > ul {
    font-size: 2.5rem;
  }
}
/* line 110, ../scss/component/_additive.scss */
.additive__list:before, .additive__list:after {
  content: '';
  height: 48%;
  position: absolute;
  width: 100%;
  z-index: 100;
  left: 0;
}
/* line 119, ../scss/component/_additive.scss */
.additive__list:before {
  top: 0;
  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzFmMmMzMyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjAiLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2dyYWQpIiAvPjwvc3ZnPiA=');
  background-size: 100%;
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #1f2c33), color-stop(100%, rgba(0, 0, 0, 0)));
  background-image: -moz-linear-gradient(#1f2c33, rgba(0, 0, 0, 0));
  background-image: -webkit-linear-gradient(#1f2c33, rgba(0, 0, 0, 0));
  background-image: linear-gradient(#1f2c33, rgba(0, 0, 0, 0));
}
/* line 124, ../scss/component/_additive.scss */
.additive__list:after {
  bottom: 0;
  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjAiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMxZjJjMzMiLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2dyYWQpIiAvPjwvc3ZnPiA=');
  background-size: 100%;
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(100%, #1f2c33));
  background-image: -moz-linear-gradient(rgba(0, 0, 0, 0), #1f2c33);
  background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0), #1f2c33);
  background-image: linear-gradient(rgba(0, 0, 0, 0), #1f2c33);
}
/* line 129, ../scss/component/_additive.scss */
.additive__list > ul > li {
  margin-top: 8px;
  margin-bottom: 8px;
}

/* line 1, ../scss/component/_pin.scss */
.pin {
  position: absolute;
  top: 0;
  left: 0;
  height: 30px;
  width: 30px;
  margin: 100px;
  background-color: #ffffff;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px;
  border-radius: 15px;
  border: 6px solid #b2c7d2;
  -moz-transition: all 0.2s ease-in;
  -o-transition: all 0.2s ease-in;
  -webkit-transition: all 0.2s ease-in;
  transition: all 0.2s ease-in;
}

/* line 14, ../scss/component/_pin.scss */
.pin--marker {
  cursor: pointer;
  -moz-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  -moz-transform-origin: 50% 50% 50%;
  -ms-transform-origin: 50% 50% 50%;
  -webkit-transform-origin: 50% 50% 50%;
  transform-origin: 50% 50% 50%;
  fill: #ffffff;
  stroke-width: 7;
}
/* line 22, ../scss/component/_pin.scss */
.touch .pin--marker {
  r: 10px;
}
/* line 26, ../scss/component/_pin.scss */
.pin--marker:hover, .pin--marker:focus, .pin--marker.js-active {
  r: 15px;
}
/* line 30, ../scss/component/_pin.scss */
.pin--marker.pin--pulse {
  -moz-transform: none;
}
@media (max-width: 480px) {
  /* line 14, ../scss/component/_pin.scss */
  .pin--marker {
    -webkit-transform: scale(1.4);
  }
}

/* line 40, ../scss/component/_pin.scss */
.pin--marker-lg {
  stroke: #91a7aa;
  stroke-width: 7;
}
/* line 44, ../scss/component/_pin.scss */
.touch .pin--marker-lg {
  r: 16px;
}
/* line 48, ../scss/component/_pin.scss */
.pin--marker-lg:hover, .pin--marker-lg:focus, .pin--marker-lg.js-active, .pin--marker-lg.pin--pulse {
  stroke: #4e9d2d;
  stroke-width: 9;
}

/* line 56, ../scss/component/_pin.scss */
.pin--hidden {
  opacity: 0;
}

/* line 61, ../scss/component/_pin.scss */
.pin--line {
  stroke: #526773;
  stroke-width: 2;
  opacity: 0;
  -moz-transition: opacity 0.2s ease;
  -o-transition: opacity 0.2s ease;
  -webkit-transition: opacity 0.2s ease;
  transition: opacity 0.2s ease;
}
@media (min-width: 992px) {
  /* line 68, ../scss/component/_pin.scss */
  .js-active + .pin--line {
    opacity: 1;
  }
  /* line 72, ../scss/component/_pin.scss */
  .cancer-is-revealed .pin--line.pin--line-cancer {
    opacity: 1;
  }
}

/* line 79, ../scss/component/_pin.scss */
.pin--cancer-cell > path {
  fill: #806297;
}
/* line 82, ../scss/component/_pin.scss */
.pin--cancer-cell > path + path {
  fill: #583972;
}

/* line 13, ../scss/whats-in-a-cigarette.scss */
.tool--whats-in-a-cigarette .tool__section {
  height: 720px;
}
/* line 17, ../scss/whats-in-a-cigarette.scss */
.tool--whats-in-a-cigarette .tool__section:before {
  content: '';
  position: absolute;
  -moz-box-shadow: 0 0 150px #1f2c33;
  -webkit-box-shadow: 0 0 150px #1f2c33;
  box-shadow: 0 0 150px #1f2c33;
  top: 6%;
  left: 50%;
  width: 50px;
  height: 92%;
  z-index: -2;
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
@media (min-width: 768px) {
  /* line 17, ../scss/whats-in-a-cigarette.scss */
  .tool--whats-in-a-cigarette .tool__section:before {
    width: 120px;
  }
}
@media (min-width: 992px) {
  /* line 17, ../scss/whats-in-a-cigarette.scss */
  .tool--whats-in-a-cigarette .tool__section:before {
    -moz-box-shadow: 0 0 120px #1f2c33;
    -webkit-box-shadow: 0 0 120px #1f2c33;
    box-shadow: 0 0 120px #1f2c33;
  }
}
@media (min-width: 1200px) {
  /* line 17, ../scss/whats-in-a-cigarette.scss */
  .tool--whats-in-a-cigarette .tool__section:before {
    -moz-box-shadow: 0 0 160px #1f2c33;
    -webkit-box-shadow: 0 0 160px #1f2c33;
    box-shadow: 0 0 160px #1f2c33;
    top: 6%;
  }
}
/* line 35, ../scss/whats-in-a-cigarette.scss */
.tool--whats-in-a-cigarette .tool__see-all {
  position: absolute;
  bottom: 25%;
  z-index: 200;
  left: 50%;
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
/* line 43, ../scss/whats-in-a-cigarette.scss */
.tool--whats-in-a-cigarette .js-overlay-toggle {
  background-color: #ab5b2f;
  border-color: #ab5b2f;
  -moz-box-shadow: 0 0 8px rgba(31, 44, 51, 0.2);
  -webkit-box-shadow: 0 0 8px rgba(31, 44, 51, 0.2);
  box-shadow: 0 0 8px rgba(31, 44, 51, 0.2);
}
/* line 48, ../scss/whats-in-a-cigarette.scss */
.tool--whats-in-a-cigarette .js-overlay-toggle:hover, .tool--whats-in-a-cigarette .js-overlay-toggle:focus {
  background-color: #1f2c33;
  border-color: #1f2c33;
}
