.building, .communityMap {
  /* apply a natural box layout model to all elements */
  /* HTML5 display-role reset for older browsers */
}
.building div, .building span, .building applet, .building object, .building iframe, .building h1, .building h2, .building h3, .building h4, .building h5, .building h6, .building p, .building blockquote, .building pre, .building a, .building abbr, .building acronym, .building address, .building big, .building cite, .building code, .building del, .building dfn, .building em, .building img, .building ins, .building kbd, .building q, .building s, .building samp, .building small, .building strike, .building strong, .building tt, .building var, .building b, .building u, .building i, .building center, .building dl, .building dt, .building dd, .building ol, .building ul, .building li, .building fieldset, .building form, .building label, .building legend, .building table, .building caption, .building tbody, .building tfoot, .building thead, .building tr, .building th, .building td, .building article, .building aside, .building canvas, .building details, .building embed, .building figure, .building figcaption, .building footer, .building header, .building hgroup, .building menu, .building nav, .building output, .building ruby, .building section, .building summary, .building time, .building mark, .building audio, .building video, .communityMap div, .communityMap span, .communityMap applet, .communityMap object, .communityMap iframe, .communityMap h1, .communityMap h2, .communityMap h3, .communityMap h4, .communityMap h5, .communityMap h6, .communityMap p, .communityMap blockquote, .communityMap pre, .communityMap a, .communityMap abbr, .communityMap acronym, .communityMap address, .communityMap big, .communityMap cite, .communityMap code, .communityMap del, .communityMap dfn, .communityMap em, .communityMap img, .communityMap ins, .communityMap kbd, .communityMap q, .communityMap s, .communityMap samp, .communityMap small, .communityMap strike, .communityMap strong, .communityMap tt, .communityMap var, .communityMap b, .communityMap u, .communityMap i, .communityMap center, .communityMap dl, .communityMap dt, .communityMap dd, .communityMap ol, .communityMap ul, .communityMap li, .communityMap fieldset, .communityMap form, .communityMap label, .communityMap legend, .communityMap table, .communityMap caption, .communityMap tbody, .communityMap tfoot, .communityMap thead, .communityMap tr, .communityMap th, .communityMap td, .communityMap article, .communityMap aside, .communityMap canvas, .communityMap details, .communityMap embed, .communityMap figure, .communityMap figcaption, .communityMap footer, .communityMap header, .communityMap hgroup, .communityMap menu, .communityMap nav, .communityMap output, .communityMap ruby, .communityMap section, .communityMap summary, .communityMap time, .communityMap mark, .communityMap audio, .communityMap video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
.building .box-size, .communityMap .box-size {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.building article, .building aside, .building details, .building figcaption, .building figure, .building footer, .building header, .building hgroup, .building main, .building menu, .building nav, .building section, .communityMap article, .communityMap aside, .communityMap details, .communityMap figcaption, .communityMap figure, .communityMap footer, .communityMap header, .communityMap hgroup, .communityMap main, .communityMap menu, .communityMap nav, .communityMap section {
  display: block;
}
.building button, .communityMap button {
  border: none;
  margin: 0;
  padding: 0;
  width: auto;
  overflow: visible;
  cursor: pointer;
  background: transparent;
  /* inherit font & color from ancestor */
  color: inherit;
  font: inherit;
  /* Normalize `line-height`. Cannot be changed from `normal` in Firefox 4+. */
  line-height: normal;
  /* Corrects font smoothing for webkit */
  -webkit-font-smoothing: inherit;
  -moz-osx-font-smoothing: inherit;
  /* Corrects inability to style clickable `input` types in iOS */
  -webkit-appearance: none;
}

.communityMap {
  font-family: "Inter";
  font-weight: 400;
  font-size: 14px;
  position: relative;
  background-image: url("../../../content/dam/illumina-marketing/images/company/corporate-citizenship/gradient_bg.png");
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  padding: 80px 20px;
}
.communityMap .communityMap__heading {
  color: #fff;
  text-align: center;
  font-size: 56px;
  font-weight: 300;
  margin-bottom: 60px;
  line-height: 1;
}
.communityMap .communityMap__heading br {
  display: none;
}
.communityMap .communityMap__innerWrap {
  max-width: 1300px;
  margin: 0 auto;
  position: relative;
}
.communityMap .mapImg {
  position: relative;
  z-index: 1;
  text-align: center;
  overflow: hidden;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -moz-box-pack: center;
  justify-content: center;
  margin-left: -20px;
  margin-right: -20px;
}
.communityMap .mapImg svg {
  width: 100%;
  height: 100%;
  min-width: 600px;
  min-height: 340px;
}
.communityMap .pinDot {
  opacity: 0;
}
.communityMap .mapPin {
  cursor: pointer;
}
.communityMap .mapPin path {
  fill: -ms-linear-gradient(#225de6, #a664fd) !important;
}
.communityMap .mapPin.active .pinDot {
  opacity: 1;
}
.communityMap .mapInfo {
  background-color: rgba(93, 95, 239, 0.95);
  border-radius: 20px;
  padding: 30px 30px 30px 30px;
  position: absolute;
  z-index: 4;
  display: none;
}
.communityMap .mapInfo.active {
  display: block;
}
.communityMap .mapInfo h2 {
  color: #fff;
  font-size: 18px;
  line-height: 1.4;
}
.communityMap .mapInfo p {
  color: #fff;
  font-size: 16px;
  line-height: 1.4;
}
.communityMap .mapInfo--1 {
  max-width: 315px;
  top: 32%;
  left: 16%;
}
.communityMap .mapInfo--2 {
  max-width: 300px;
  top: 37%;
  left: 17%;
}
.communityMap .mapInfo--3 {
  max-width: 290px;
  top: 47%;
  left: 33%;
}
.communityMap .mapInfo--4 {
  max-width: 385px;
  top: 50%;
  left: 69%;
}
.communityMap .mapInfo--5 {
  max-width: 385px;
  top: 46%;
  left: 73%;
}
.communityMap .mapInfo--6 {
  max-width: 385px;
  top: 58%;
  left: 78%;
}
.communityMap .mapInfo--7 {
  max-width: 216px;
  top: 44%;
  left: 80%;
}
.communityMap .mapInfo--8 {
  max-width: 343px;
  top: 66%;
  right: 18.4%;
}
@media (max-width: 1200px) {
  .communityMap .communityMap__heading br {
    display: block;
  }
  .communityMap .mapInfo--4 {
    left: 25%;
  }
  .communityMap .mapInfo--5 {
    top: 39%;
    left: 29%;
  }
  .communityMap .mapInfo--6 {
    left: 28%;
  }
  .communityMap .mapInfo--7 {
    top: 40%;
    left: 56%;
  }
}
@media (max-width: 992px) {
  .communityMap .mapInfo p {
    font-size: 14px;
  }
}
@media (max-width: 767px) {
  .communityMap .communityMap__heading {
    font-size: 44px;
    margin-bottom: 30px;
  }
  .communityMap .mapInfo {
    max-width: 100%;
    display: block;
    position: relative;
    left: auto;
    right: auto;
    top: auto;
  }
  .communityMap .mapInfo + .mapInfo {
    margin-top: 15px;
  }
  .communityMap .mapPin {
    display: none;
  }
  .communityMap .mapImg {
    margin-bottom: -150px;
  }
}

.building {
  font-family: "Inter";
  font-weight: 400;
  font-size: 14px;
  width: 100%;
  max-width: 1170px;
  margin: 0 auto;
  position: relative;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
.building .buildingHeading {
  display: none;
}
.building .building__bg {
  width: 100%;
}
.building .footnote {
  max-width: 300px;
  position: absolute;
  bottom: 20px;
  left: 20px;
  color: #fff;
  font-size: 12px;
}
.building .footnote {
  max-width: 100%;
  bottom: auto;
  font-size: 12px;
  left: auto;
  position: relative;
  color: #000;
  padding: 0 20px;
  text-align: center;
}
.building .dot {
  position: absolute;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -moz-box-pack: center;
  justify-content: center;
  border-radius: 50%;
  z-index: 0;
  outline: none;
}
.building .dot:before {
  content: "";
  height: 30px;
  width: 30px;
  background-color: #ffc076;
  border-radius: 50%;
  z-index: 1;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -moz-box-pack: center;
  justify-content: center;
}
.building .dot--1 {
  top: 28%;
  left: 17.6%;
}
.building .dot--1 .dot__info {
  min-width: 245px;
}
.building .dot--2 {
  top: 21%;
  left: 20.5%;
}
.building .dot--2 .dot__info {
  min-width: 150px;
}
.building .dot--3 {
  top: 76%;
  left: 40.5%;
}
.building .dot--3 .dot__info {
  min-width: 190px;
}
.building .dot--4 {
  top: 11%;
  left: 58.5%;
}
.building .dot--4 .dot__info {
  min-width: 200px;
}
.building .dot--5 {
  top: 27%;
  left: 47.5%;
}
.building .dot--5 .dot__info {
  min-width: 140px;
}
.building .dot--6 {
  top: 55%;
  left: 45.5%;
}
.building .dot--6 .dot__info {
  min-width: 170px;
}
.building .dot--7 {
  top: 52%;
  left: 60%;
}
.building .dot--7 .dot__info {
  min-width: 240px;
}
.building .dot--8 {
  top: 59%;
  left: 27.5%;
}
.building .dot--8 .dot__info {
  min-width: 310px;
}
.building .dot--9 {
  top: 13%;
  left: 32.5%;
}
.building .dot--9 .dot__info {
  min-width: 130px;
}
.building .dot--10 {
  top: 83%;
  left: 26.5%;
}
.building .dot--10 .dot__info {
  min-width: 260px;
}
.building .dot--11 {
  top: 82%;
  left: 60.5%;
}
.building .dot--11 .dot__info {
  min-width: 300px;
}
.building .dot--12 {
  top: 36%;
  left: 80.5%;
}
.building .dot--12 .dot__info {
  min-width: 240px;
}
.building .dot--13 {
  top: 67%;
  left: 80.5%;
}
.building .dot--13 .dot__info {
  min-width: 240px;
}
.building .dot--14 {
  top: 15%;
  left: 94.5%;
}
.building .dot--14 .dot__info {
  min-width: 240px;
}
.building .dot--right .dot__info {
  left: auto;
  right: -10px;
  padding-left: 20px;
  padding-right: 51px;
}
.building .dot--right .dot__info:before {
  left: auto;
  right: 5px;
}
.building .dot__info {
  min-width: 200px;
  min-height: 50px;
  position: absolute;
  left: -10px;
  z-index: 0;
  border-radius: 25px;
  padding-left: 51px;
  padding-right: 20px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  align-items: center;
  background: -webkit-linear-gradient(#225de6, #a664fd);
  background: -moz-gradient(#225de6, #a664fd);
  background: -ms-gradient(#225de6, #a664fd);
  background: -webkit-gradient(linear, left top, left bottom, from(#225de6), to(#a664fd));
  background: -moz- oldlinear-gradient(#225de6, #a664fd);
  background: linear-gradient(#225de6, #a664fd);
  display: none;
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
  -moz-box-flex: 1;
  flex-grow: 1;
  -webkit-flex-basis: 0;
  flex-basis: 0;
}
.building .dot__info:before {
  content: "";
  height: 38px;
  width: 38px;
  border-radius: 50%;
  z-index: 1;
  border: 1px solid #fff;
  position: absolute;
  left: 5px;
  top: 5px;
}
.building .dot__info p {
  color: #fff;
  font-size: 20px;
  white-space: nowrap;
  font-weight: 300;
  margin: 14px 0;
  position: relative;
}
.building .dot.active {
  z-index: 1;
}
.building .dot.active .dot__info {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: flex;
  top: -10px;
}
.building .mobileDots {
  display: none;
}
.building .mobileDots__dot {
  position: absolute;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -moz-box-pack: center;
  justify-content: center;
  border-radius: 50%;
  z-index: 0;
}
.building .mobileDots__dot:before {
  content: "";
  height: 30px;
  width: 30px;
  background-color: #ffc076;
  border-radius: 50%;
  z-index: 1;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -moz-box-pack: center;
  justify-content: center;
}
.building .mobileDots__dot--1 {
  top: 29%;
  left: 16.6%;
}
.building .mobileDots__dot--1:before {
  content: "1";
}
.building .mobileDots__dot--2 {
  top: 21%;
  left: 20.5%;
}
.building .mobileDots__dot--2:before {
  content: "2";
}
.building .mobileDots__dot--3 {
  top: 76%;
  left: 40.5%;
}
.building .mobileDots__dot--3:before {
  content: "3";
}
.building .mobileDots__dot--4 {
  top: 11%;
  left: 58.5%;
}
.building .mobileDots__dot--4:before {
  content: "4";
}
.building .mobileDots__dot--5 {
  top: 27%;
  left: 47.5%;
}
.building .mobileDots__dot--5:before {
  content: "5";
}
.building .mobileDots__dot--6 {
  top: 55%;
  left: 45.5%;
}
.building .mobileDots__dot--6:before {
  content: "6";
}
.building .mobileDots__dot--7 {
  top: 52%;
  left: 60%;
}
.building .mobileDots__dot--7:before {
  content: "7";
}
.building .mobileDots__dot--8 {
  top: 59%;
  left: 27.5%;
}
.building .mobileDots__dot--8:before {
  content: "8";
}
.building .mobileDots__dot--9 {
  top: 13%;
  left: 32.5%;
}
.building .mobileDots__dot--9:before {
  content: "9";
}
.building .mobileDots__dot--10 {
  top: 83%;
  left: 26.5%;
}
.building .mobileDots__dot--10:before {
  content: "10";
}
.building .mobileDots__dot--11 {
  top: 82%;
  left: 60.5%;
}
.building .mobileDots__dot--11:before {
  content: "11";
}
.building .mobileDots__dot--12 {
  top: 36%;
  left: 80.5%;
}
.building .mobileDots__dot--12:before {
  content: "12";
}
.building .mobileDots__dot--13 {
  top: 67%;
  left: 80.5%;
}
.building .mobileDots__dot--13:before {
  content: "13";
}
.building .mobileDots__dot--14 {
  top: 15%;
  left: 93%;
}
.building .mobileDots__dot--14:before {
  content: "14";
}
@media (max-width: 992px) {
  .building .dot__info p {
    font-size: 16px;
  }
}
@media (max-width: 767px) {
  .building .buildingInnerWrap {
    position: relative;
  }
  .building .dot {
    width: 100%;
    display: block;
    position: relative;
    left: auto;
    top: auto;
    margin: 5px 0;
    padding: 0;
    z-index: 1;
  }
  .building .dot:before {
    position: absolute;
    left: 10px;
    top: -webkit-calc(50% - 14px);
    top: -moz-calc(50% - 14px);
    top: calc(50% - 14px);
  }
  .building .dot--1:before {
    content: "1";
  }
  .building .dot--2:before {
    content: "2";
  }
  .building .dot--3:before {
    content: "3";
  }
  .building .dot--4:before {
    content: "4";
  }
  .building .dot--5:before {
    content: "5";
  }
  .building .dot--6:before {
    content: "6";
  }
  .building .dot--7:before {
    content: "7";
  }
  .building .dot--8:before {
    content: "8";
  }
  .building .dot--9:before {
    content: "9";
  }
  .building .dot--10:before {
    content: "10";
  }
  .building .dot--11:before {
    content: "11";
  }
  .building .dot--12:before {
    content: "12";
  }
  .building .dot--13:before {
    content: "13";
  }
  .building .dot--14:before {
    content: "14";
  }
  .building .dot.active .dot__info {
    top: auto;
  }
  .building .dot__info {
    min-width: auto !important;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: flex;
    position: relative;
    left: auto;
    top: auto;
  }
  .building .dot__info:before {
    top: -webkit-calc(50% - 19px);
    top: -moz-calc(50% - 19px);
    top: calc(50% - 19px);
  }
  .building .dot__info p {
    white-space: normal;
    text-align: left;
  }
  .building .dot--right .dot__info {
    right: auto;
    padding-right: 20px;
    padding-left: 51px;
  }
  .building .dot--right .dot__info:before {
    left: 5px;
    right: auto;
  }
  .building .mobileDots {
    display: block;
  }
}
@media (max-width: 567px) {
  .building .mobileDots__dot:before {
    height: 25px;
    width: 25px;
  }
}