/* CSS Document */
/* =============================================================================
   Typography - can remove
   ========================================================================== */
.berkeley h1,
.berkeley h2,
.berkeley h3,
.berkeley h4,
.berkeley h5,
.berkeley h6,
.berkeley .alpha,
.berkeley .beta,
.berkeley .gamma,
.berkeley .delta,
.berkeley .epsilon,
.berkeley .zeta {
  font-weight: 700;
  margin-bottom: 0;
  color: Blue;
}

.berkeley h1,
.berkeley .alpha {
  font-size: calc(31px + 20 * ((100vw - 540px) / 420));
  line-height: 1;
}

@media screen and (max-width: 540px) {

  .berkeley h1,
  .berkeley .alpha {
    font-size: 31px;
  }
}

@media screen and (min-width: 960px) {

  .berkeley h1,
  .berkeley .alpha {
    font-size: 51px;
  }
}

.berkeley h2,
.berkeley .beta {
  font-size: calc(27px + 0 * ((100vw - 540px) / 420));
  line-height: 1.2;
}

@media screen and (max-width: 540px) {

  .berkeley h2,
  .berkeley .beta {
    font-size: 27px;
  }
}

@media screen and (min-width: 960px) {

  .berkeley h2,
  .berkeley .beta {
    font-size: 27px;
  }
}

.berkeley strong,
.berkeley b {
  font-family: GenericLRGMedium, helvetica, arial, sans-serif;
}

/* Scaffolding styles */
.berkeley .graphicwrap {
  margin: 0 auto;
  width: 1170px;
  position: relative;
}

@media (max-width: 1400px) {
  .berkeley .graphicwrap {
    width: 1000px;
  }
}

@media (max-width: 1000px) {
  .berkeley .graphicwrap {
    max-width: 620px;
    width: 100%;
  }
}

/* Layout styles */
.berkeley {
  font-family: 'Helvetica Neue LT Pro 55 Roman', Helvetica;
  font-size: 25px;
  line-height: 1.35;
  color: #202356;
}

.berkeley .mobile-show {
  display: none;
}

@media (max-width: 1000px) {
  .berkeley .mobile-hide {
    display: none;
  }

  .berkeley .mobile-show {
    display: block;
  }
}

.berkeley a {
  color: inherit;
  text-decoration: underline;
}

.berkeley a:hover {
  text-decoration: none;
}

.berkeley button {
  background: transparent;
  border: none;
  cursor: pointer;
}

.berkeley .img-fluid {
  width: 100%;
  max-width: 100%;
  height: auto;
}

.berkeley .point {
  position: absolute;
  z-index: 3;
}

.berkeley .point__click {
  width: 100%;
  width: 77px;
  display: block;
  padding: 0;
}

.berkeley .point__click img,
.berkeley .point__click svg {
  width: 77px;
}

.berkeley .point__click svg #icon {
  display: none;
}

.berkeley .point__click:hover svg ellipse[stroke="#FFFFFF"] {
  stroke: #202356;
}

@media (max-width: 1000px) {
  .berkeley .point__click {
    display: none;
  }
}

.berkeley .point__reveal {
  color: white;
  background: #202356;
  display: inline-block;
  text-align: center;
  width: 415px;
  display: none;
  position: absolute;
  top: calc(100% - 42px);
  left: 50%;
  transform: translate(-50%, 0);
  padding: 30px;
  padding-top: 70px;
  border-radius: 32px;
  font-size: 18px;
  width: 300px;
}

.berkeley .point__reveal strong {
  margin-bottom: 1rem;
  display: inline-block;
}

.berkeley .point__reveal p {
  margin-bottom: 0;
}

.berkeley .point--open {
  z-index: 4;
}

.berkeley .point--open .point__reveal {
  display: block;
}

.berkeley .point--open .point__reveal svg.point__reveal-icon {
  width: 77px;
  position: absolute;
  top: -38px;
  left: 50%;
  transform: translate(-50%, 0);
  cursor: pointer;
}

.berkeley .point--open .point__reveal svg.point__reveal-icon ellipse {
  fill: white;
}

.berkeley .point--open .point__reveal svg.point__reveal-icon #icon {
  display: block;
  transform: translate(0px, 3px);
}

.berkeley .point--open .point__reveal svg.point__reveal-icon:hover #icon {
  transform: rotate(180deg);
  transform-origin: center;
}

.berkeley .point--open .point__click {
  display: none;
}

.berkeley .point.point-1 {
  top: 24%;
  left: 36%;
}

.berkeley .point.point-1.point--open .point__reveal {
  top: -8em;
  left: -3em;
}

.berkeley .point.point-2 {
  top: 27%;
  left: 73%;
}

.berkeley .point.point-2.point--open .point__reveal {
  top: -8em;
  left: -3em;
}

.berkeley .point.point-3 {
  top: 44%;
  left: 14%;
}

.berkeley .point.point-3.point--open .point__reveal {
  top: 1.4em;
  left: 1.5em;
  top: 2.5em;
}

.berkeley .point.point-4 {
  top: 45%;
  left: 28%;
}

.berkeley .point.point-4.point--open .point__reveal {
  top: 1.4em;
  left: 1.5em;
}

.berkeley .point.point-5 {
  top: 36.7%;
  left: 44.8%;
}

.berkeley .point.point-5.point--open .point__reveal {
  top: 1.4em;
  left: 1.5em;
}

.berkeley .point.point-6 {
  top: 35%;
  left: 83%;
}

.berkeley .point.point-6.point--open .point__reveal {
  top: 1.4em;
  left: 1.5em;
  top: 3.4em;
  left: -0.5em;
}

.berkeley .point.point-7 {
  top: 43%;
  left: 68.9%;
}

.berkeley .point.point-7.point--open .point__reveal {
  top: 4.5em;
  left: -0.7em;
}

.berkeley .point.point-8 {
  top: 58%;
  left: 80.3%;
}

.berkeley .point.point-8.point--open .point__reveal {
  top: 5.8em;
  left: 1.5em;
}

.berkeley .point.point-9 {
  top: 72.1%;
  left: 38.8%;
}

.berkeley .point.point-9.point--open .point__reveal {
  top: -16.2em;
  left: -4.5em;
  top: -21.2em;
  left: 0.5em;
}

@media (max-width: 1000px) {
  .berkeley .point {
    display: block !important;
    position: relative !important;
    top: 0 !important;
    left: 0 !important;
  }

  .berkeley .point .point__reveal {
    display: block !important;
    position: relative !important;
    width: 100%;
    top: 0 !important;
    left: 0 !important;
    transform: none;
    border-radius: 0;
    padding-top: 30px;
  }

  .berkeley .point .point__reveal strong {
    display: block;
  }

  .berkeley .point svg.point__reveal-icon {
    display: none;
  }

  .berkeley .point .point__reveal--number {
    display: inline-block;
    font-family: 'Helvetica Neue LT Pro 75 Bold';
    font-size: 30px;
    border-radius: 50%;
    border: 4px solid white;
    line-height: 1;
    padding: 8px 5px;
    height: 46px;
    width: 46px;
    vertical-align: middle;
    margin-bottom: 14px;
  }
}

.berkeley .bg {
  position: relative;
  z-index: 1;
}

.berkeley .bg3 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.berkeley .bg3.reveal {
  z-index: 2;
}

.berkeley .bg7 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.berkeley .bg7.reveal {
  z-index: 2;
}

.berkeley .bg8 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.berkeley .bg8.reveal {
  z-index: 2;
}

.berkeley .graphic-intro {
  max-width: 1300px;
  margin: 0 auto 100px;
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  padding: 0 15px;
  max-width: 1030px;
}

.berkeley .graphic-intro__heading {
  font-family: 'Helvetica Neue LT Pro 55 Roman';
  font-size: 25px;
  color: #A8C429;
  text-transform: uppercase;
  margin-bottom: 20px;
}

.berkeley .graphic-intro__big {
  font-family: 'Helvetica Neue LT Pro 75 Bold';
  font-size: 40px;
}

.berkeley .graphic-intro__small {
  font-family: 'Helvetica Neue LT Pro 55 Roman';
  font-size: 25px;
  color: #464646;
}

.berkeley .graphic-intro__small:last-of-type {
  margin-bottom: 0;
}

.berkeley .graphic-intro__left {
  flex-basis: 46%;
  max-width: 46%;
}

.berkeley .graphic-intro__right {
  flex-basis: 50%;
  max-width: 50%;
  margin-left: 4%;
}

.berkeley .graphic-intro .graphic-intro__big {
  font-size: 30px;
}

.berkeley .graphic-intro .graphic-intro__small {
  font-size: 18px;
}

@media (max-width: 1000px) {
  .berkeley .graphic-intro {
    display: block;
    margin-bottom: 35px;
  }

  .berkeley .graphic-intro .graphic-intro__left,
  .berkeley .graphic-intro .graphic-intro__right {
    flex-basis: 100%;
    max-width: 100%;
    margin-left: 0;
  }

  .berkeley .graphic-intro .graphic-intro__right {
    margin-top: 20px;
  }
}

.berkeley .footer {
  padding: 60px 15px 45px;
  max-width: 1300px;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  max-width: 1030px;
  padding: 50px 15px 15px;
}

.berkeley .footer__left {
  font-size: 27px;
}

.berkeley .footer__left a {
  font-family: 'Helvetica Neue LT Pro 75 Bold';
}

.berkeley .footer .footer__left {
  font-size: 18px;
}

.berkeley .footer .footer__right .logo {
  width: 260px;
}

@media (max-width: 1000px) {
  .berkeley .footer {
    flex-direction: column;
    text-align: center;
  }
}

@media screen {

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

.group:after {
  content: "";
  display: table;
  clear: both;
}

/*# sourceMappingURL=output.css.map */