.marker, .marker:hover
{
  color:#fff;
  text-decoration:none;
}


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

.map {
  position: relative;
  padding-top: 100%;
  margin: -15% 0 -5% 0;
  z-index: 101; 
  margin-bottom: 4rem;
}

.map img {
  display: block;
  width: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

}

.map-popup {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 99;
  width: 80vw;
  max-width: 480px;
  padding: 2rem;
  background-color: #fff;
  transition: all 300ms ease-in;
  transform: translate(-50%,-50%);
  box-shadow: 0 0 24px rgba(0,0,0,0.22);
  opacity: 0;
  visibility: hidden;
  z-index: 101;
}

.map-popup > *:first-child { margin-top: 0; }
.map-popup > *:last-child { margin-bottom: 0; }

.map-popup.open {
  opacity: 1;
  visibility: visible;
}

.marker {
  position: absolute;
  z-index: 1;
  display: inline-block;
  width: 36px;
  height: 36px;
  color: #fff;
  font-weight: bolder;
  line-height: 36px;
  text-align: center;
  text-decoration: none;
  border-radius: 50%;
  background-color: #e81d1f;
  transition: all 300ms;
}

.marker1 {
  left: 20%;
  top: 69%;
}

.marker2 {
  left: 65%;
  top: 23%;
}

.marker3 {
  left: 78%;
  top: 66%;
}

.marker4 {
  left: 89%;
  top: 66%;
}

.marker5 {
  left: 34%;
  top: 55%;
}

.marker6 {
  left: 60%;
  top: 27%;
}

.marker7 {
  left: 60%;
  top: 22%;
}

.marker8 {
  left: 50%;
  top: 65%;
}

.marker9 {
  left: 53%;
  top: 52%;
}

.marker10 {
  left: 41%;
  top: 50%;
}
.marker11 {
  left: 34%;
  top: 47%;
}
.marker12 {
  left: 74%;
  top: 36%;
}
.marker13 {  
  left: 52%;
  top: 27%;
}
.marker14 {  
  left: 46%;
  top: 55%;
}


@media only screen and (min-width:48em) {
  .map-item {
    position: absolute;
    width: 36px;
    height: 36px;
    }
    .map-item .marker {
      top: auto;
      left: auto;
    }

.map-item1 {
  left: 20%;
  top: 69%;
}

.map-item2 {
  left: 65%;
  top: 23%;
}

.map-item3 {
  left: 78%;
  top: 66%;
}

.map-item4 {
  left: 89%;
  top: 66%;
}

.map-item5 {
  left: 34%;
  top: 55%;
}

.map-item6 {
  left: 60%;
  top: 27%;
}

.map-item7 {
  left: 60%;
  top: 22%;
}

.map-item8 {
  left: 50%;
  top: 65%;
}

.map-item9 {
  left: 50%;
  top: 53%;
}

.map-item10 {
  left: 41%;
  top: 50%;
}
.map-item11 {
  left: 34%;
  top: 47%;
}
.map-item12 {
  left: 74%;
  top: 36%;
}
.map-item13 {  
  left: 52%;
  top: 27%;
}
.map-item14 {  
  left: 46%;
  top: 55%;
}

  .map-popup {
    position: absolute;
    left: 58px;
    width: 420px;
    transform: translateY(-50%);
  }
  .map-popup:before {
    content: "";
    position: absolute;
    top: 50%;
    left: -16px;
    margin-top: -16px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 16px 16px 16px 0;
    border-color: transparent #fff transparent transparent;
  }

  .map-popup.edge {
    left: auto;
    right: calc(100% + 24px);
  }
  .map-popup.edge:before {
    left: auto;
    right: -16px;
    border-width: 16px 0 16px 16px;
    border-color: transparent transparent transparent #fff;
  }
}


.map-popup .image {
  padding-top: 50%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  margin: 0 0 1rem 0;
}
.mailing {
  background: #333;
  color: #fff;
  padding-top: 75px;
  padding-bottom: 75px;
}

input:not([type="submit"]), textarea, select {
    background-color: rgba(255,255,255,0.03);
    box-shadow: none;
    border-color: rgba(0,0,0,0.09);
    color: white!important;
    border-radius: 0px;
    text-decoration: none;
    margin: 4px 2px;
}

input[type=button], input[type=submit], input[type=reset] {
border-radius: 0px!important;
background-color: #000;
border: none;
color: white;
padding: 7px 0px;
text-decoration: none;
margin: 4px 2px;
cursor: pointer;
width: 100%;
}

.callout, .callout-text{
  font-size: 150%;
}

.container-fluid .row > div:first-child {
  padding-left: calc((100vw - 1280px)/2);
  background-size: cover;
  background-position: center center;
  min-height: 100vh;
}


.container-fluid .row > div + div {
  padding-right: calc((100vw - 1280px)/2);
  min-height: 100vh;
  display: flex;
}

.container-fluid .row > div > div {
  width: 100%;
}

.accordion {
  position: relative;
}


#video {
  margin-top: -50px;
  height: calc(100vh - 196px);
  position: relative;
  overflow: hidden;
}

@media (max-width: 991px) {
  .map {
    transform: scale(1.1);
  }
  .marker {
    width: 24px;
    height: 24px;
    line-height: 24px;
  }
  #video {  
    height: calc(56vw);
  }
  
}

#video video {
  
  width: 100%;
  height: auto;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}

section { position: relative; }
.c2a {position: absolute; bottom: 2rem; left: 50%; transform: translateX(-50%); z-index: 100;}