/* Add here all your css styles (customizations) */
.body-column-1 img, .body-column-2 img, .body-column-3 img {
  max-width: 100%;
}

h5, .h5 {
  font-weight: 700;
}

@media (min-width: 768px) {
  .body-column-2 {
    -webkit-column-count: 2;
            column-count: 2;
    margin-bottom: 20px;
    -webkit-column-gap: 2em;
            column-gap: 2em;
  }
  .body-column-3 {
    -webkit-column-count: 3;
            column-count: 3;
    margin-bottom: 20px;
    -webkit-column-gap: 2em;
            column-gap: 2em;
  }
  article, section {
    -webkit-column-break-inside: avoid;
    /* Chrome, Safari, Opera */
    /* Firefox */
    break-inside: avoid;
    /* IE 10+ */
  }
}

.break-out {
  width: 100vw;
  position: relative;
  left: calc(-1 * (100vw - 100%) / 2);
}

body {
  color: #212529;
}

.bubble-primary .bubbleText {
  border: 5px solid #2DB44B;
}

.bubble-secondary .bubbleText {
  border: 5px solid #6FA7CF;
}

.bubble-magenta .bubbleText {
  border: 5px solid #DE0F66;
}

.bubble-yellow .bubbleText {
  border: 5px solid #FFC928;
}

circle.yellow {
  cursor: pointer;
  stroke: #FFC928;
}

circle.magenta {
  cursor: pointer;
  stroke: #DE0F66;
}

circle.secondary {
  cursor: pointer;
  stroke: #6FA7CF;
}

circle.primary {
  cursor: pointer;
  stroke: #2DB44B;
}

.hamburger-inner, .hamburger-inner::after, .hamburger-inner::before {
  width: 100%;
  height: 3px;
  border-radius: 0;
}

.active .u-btn-outline-primary {
  color: #fff;
  background-color: #2DB44B;
}
