/* Breakpoints
// ========================================================================== */
/* 320px */
/* 480px */
/* 599px */
/* 600px */
/* 768px */
/* 967px */
/* 960px */
/* 1400px */
/* Colors 
// ========================================================================== */
/* Convert px to ems
// ========================================================================== */
/* Mixins
// ========================================================================== */
/* Media Query Watcher
// ========================================================================== */
#getActiveMQ-watcher {
      font-family: "break-0";
    }
    @media (min-width: 20em) {
      #getActiveMQ-watcher {
        font-family: "break-1";
      }
    }
    @media (min-width: 30em) {
      #getActiveMQ-watcher {
        font-family: "break-2";
      }
    }
    @media (min-width: 37.5em) {
      #getActiveMQ-watcher {
        font-family: "break-3";
      }
    }
    @media (min-width: 48em) {
      #getActiveMQ-watcher {
        font-family: "break-4";
      }
    }
    @media (min-width: 60em) {
      #getActiveMQ-watcher {
        font-family: "break-5";
      }
    }
    
    /* =Map Pin Animation
    // ========================================================================== */
    @-webkit-keyframes pulsate {
      0% {
        -webkit-transform: scale(0.2);
        transform: scale(0.2);
        opacity: 1;
      }
      100% {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
        opacity: 0;
      }
    }
    @-moz-keyframes pulsate {
      0% {
        -webkit-transform: scale(0.2);
        transform: scale(0.2);
        opacity: 1;
      }
      100% {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
        opacity: 0;
      }
    }
    @keyframes pulsate {
      0% {
        -webkit-transform: scale(0.2);
        transform: scale(0.2);
        opacity: 1;
      }
      100% {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
        opacity: 0;
      }
    }
    .animated {
      -webkit-animation-duration: 1s;
      animation-duration: 1s;
      -webkit-animation-fill-mode: both;
      animation-fill-mode: both;
    }
    
    @-webkit-keyframes bounceInDown {
      0% {
        opacity: 0;
        -webkit-transform: translateY(-2000px);
        transform: translateY(-2000px);
      }
      60% {
        opacity: 1;
        -webkit-transform: translateY(30px);
        transform: translateY(30px);
      }
      80% {
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px);
      }
      100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
      }
    }
    @keyframes bounceInDown {
      0% {
        opacity: 0;
        -webkit-transform: translateY(-2000px);
        -ms-transform: translateY(-2000px);
        transform: translateY(-2000px);
      }
      60% {
        opacity: 1;
        -webkit-transform: translateY(30px);
        -ms-transform: translateY(30px);
        transform: translateY(30px);
      }
      80% {
        -webkit-transform: translateY(-10px);
        -ms-transform: translateY(-10px);
        transform: translateY(-10px);
      }
      100% {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
      }
    }
    .bounceInDown {
      -webkit-animation-name: bounceInDown;
      animation-name: bounceInDown;
    }
    
    /* =Places Map
    // ========================================================================== */
    #places-map {
      background: #272d33;
      padding: 5.25em 0 0;
      position: relative;
    }
    #places-map h1 {
      font-size: 1.3125em;
      margin-top: 0.9523809524em;
      text-align: center;
    }
    @media (min-width: 37.5em) {
      #places-map h1 {
        font-size: 2.1875em;
        margin-top: 0.9428571429em;
      }
    }
    #places-map .wu-logo {
      display: none;
      height: 3.875em;
      width: 11.3125em;
    }
    @media (min-width: 60em) {
      #places-map .wu-logo {
        background: url(http://jeffbridgforth.com/codepen/wu-logo.jpg) no-repeat;
        display: block;
        position: absolute;
        bottom: 1.875em;
        left: 2em;
      }
    }
    @media (min-width: 87.5em) {
      #places-map .wu-logo {
        left: 50%;
        margin-left: -43.75em;
      }
    }
    #places-map img {
      height: auto;
      position: relative;
      width: 100%;
      z-index: 1;
    }
    .secondary-page #places-map .content {
      margin: 0;
      position: relative;
    }
    @media (min-width: 60em) {
      .secondary-page #places-map .content {
        margin: 0 auto;
      }
    }
    #places-map .map {
      position: relative;
      max-width: 56.4375em;
      margin-left: auto;
      margin-right: auto;
    }
    #places-map .map-pins {
      position: absolute;
      height: 100%;
      top: 0;
      left: 0;
      width: 100%;
    }
    #places-map .map-location-marker {
      /* background: url(../images/small-marker.png) no-repeat; */
      cursor: pointer;
      position: absolute;
      margin-top: -1.875em;
      z-index: 3;
      display: flex;
      flex-direction: column;
      align-items: center;
    }
    #places-map .map-location-marker img{
      width: 4em;
    }
    #places-map .map-location-marker:hover{
      text-decoration: none !important;
    }
    #places-map .map-location-marker h4{
      color: #fff;
      line-height: 10px;
      font-size: 20px;
      font-weight: 200;
    }
    #places-map .main-branch h4 {
       color: #44aa35 !important;
    }
    #places-map .main-branch img{
      width: 8em ;
      /* background: url(../images/big-marker.png) no-repeat !important; */
      /* width: 10em !important; */
    }
    #places-map .map-location-marker i{
          font-size: 5em;
          color: #236b61;
    }
    @media (min-width: 48em) {
      .js #places-map .map-location-marker {
        visibility: hidden;
      }
      .js #places-map .map-location-marker.bounceInDown {
        visibility: visible;
      }
    }
    #places-map .marker-san-francisco {
      left: 8%;
      top: 30%;
    }
    @media (max-width: 37.4375em) {
      #places-map .marker-san-francisco {
        left: 6%;
        top: 32%;
      }
    }
    #places-map .marker-denver {
      left: 13%;
      top: 29%;
      -webkit-animation-delay: .1s;
      animation-delay: .1s;
    }
    #places-map .marker-argentina {
      left: 29.5%;
      bottom: 21.5%;
      -webkit-animation-delay: .3s;
      animation-delay: .3s;
    }
    #places-map .marker-dubai {
      left: 50%;
      top: 65%;
      -webkit-animation-delay: .6s;
      animation-delay: .6s;
    }
    #places-map .marker-costa-rica {
      left: 17.5%;
      top: 50%;
      -webkit-animation-delay: .2s;
      animation-delay: .2s;
    }
    #places-map .marker-peterborough {
      left: 8.5%;
      top: 0;
      -webkit-animation-delay: .4s;
      animation-delay: .4s;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
    }
    #places-map .marker-peterborough p{
      color: #fff;
      font-size: 18px;
      width: 60%;
      margin: 0 auto;
      text-align: center;
    }
    #places-map .marker-vilnius {
      left: 52%;
      top: 18%;
      -webkit-animation-delay: .5s;
      animation-delay: .5s;
    }
    #places-map .marker-singapore {
      left: 79%;
      bottom: 42%;
      -webkit-animation-delay: .7s;
      animation-delay: .7s;
    }
    #places-map .marker-manila {
      left: 78.5%;
      top: 48%;
      -webkit-animation-delay: .8s;
      animation-delay: .8s;
    }
    #places-map .marker-sydney {
      bottom: 14%;
      right: 7.5%;
      -webkit-animation-delay: .9s;
      animation-delay: .9s;
    }
    /* #places-map .map-location-marker i:after {
      -webkit-animation: pulsate 2s ease-in-out infinite;
      -moz-animation: pulsate 2s ease-in-out infinite;
      animation: pulsate 2s ease-in-out infinite;
      background: transparent;
      border: 2px solid #fff;
      border-radius: 50%;
      content: "";
      display: block;
      height: 100px;
      left: -20px;
      opacity: 0;
      position: absolute;
      top: -10px;
      -webkit-transition: all .25s linear;
      -moz-transition: all .25s linear;
      -o-transition: all .25s linear;
      transition: all .25s linear;
      width: 100px;
      z-index: 2;
    } */
    .main-branch i{
          color: #47a939!important;
          font-size: 10em !important;
    }
    #page-places {
      position: relative;
    }
    
    #map-info {
      background: #000;
      color: #fff;
      position: absolute;
      top: -1.5625em;
      left: 50%;
      margin-left: -7.8125em;
      padding: 1.125em;
      width: 15.625em;
      z-index: 10;
    }
    #map-info .close-btn {
      background: url(http://jeffbridgforth.com/codepen//close-btn.png) no-repeat;
      cursor: pointer;
      display: block;
      height: 0.6875em;
      width: 0.6875em;
      position: absolute;
      right: 1.125em;
      top: 1.125em;
    }
    @media (min-width: 30em) {
      #map-info {
        top: 50%;
        margin-top: -8.875em;
      }
    }
    @media (min-width: 60em) {
      #map-info {
        margin-left: -8.875em;
        width: 17.75em;
      }
    }
    @media (min-width: 48em) {
      #map-info {
        margin-left: 0;
        margin-top: 0;
      }
      #map-info:before {
        content: "";
        display: block;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 13px 16px 13px 0;
        border-color: transparent #000 transparent transparent;
        position: absolute;
        left: -16px;
      }
      #map-info.san-francisco {
        left: 11%;
        top: 23%;
      }
      #map-info.denver {
        left: 16%;
        top: 21.5%;
      }
      #map-info.argentina {
        left: 32.5%;
        bottom: 0;
        top: auto;
      }
      #map-info.argentina:before {
        top: 152px;
      }
      #map-info.costa-rica {
        bottom: 5%;
        left: 20%;
        top: auto;
      }
      #map-info.costa-rica:before {
        top: 45px;
      }
      #map-info.peterborough {
        top: 12.5%;
        left: 58%;
      }
      #map-info.vilnius {
        top: 10.5%;
        left: 54.5%;
      }
      #map-info.dubai {
        top: 35%;
        left: 66.5%;
      }
      #map-info.singapore {
        left: auto;
        top: auto;
        bottom: 0%;
        right: 24%;
      }
      #map-info.singapore:before {
        border-width: 13px 0 13px 16px;
        border-color: transparent transparent transparent #000;
        left: auto;
        right: -16px;
        top: 55px;
      }
      #map-info.manila {
        left: auto;
        top: auto;
        bottom: 1.75%;
        right: 18.5%;
      }
      #map-info.manila:before {
        border-width: 13px 0 13px 16px;
        border-color: transparent transparent transparent #000;
        left: auto;
        right: -16px;
      }
      #map-info.sydney {
        left: auto;
        top: auto;
        right: 11.5%;
        bottom: 0;
      }
      #map-info.sydney:before {
        border-width: 13px 0 13px 16px;
        border-color: transparent transparent transparent #000;
        left: auto;
        right: -16px;
        bottom: 50px;
      }
    }
    #map-info h1 {
      float: left;
      font-size: 1.375em;
      line-height: 1;
      margin-bottom: 0.7272727273em;
      margin-top: 0;
    }
    #map-info a {
      color: #ffdf1c;
      display: block;
      font-size: 0.75em;
      float: right;
      margin-right: 2.5em;
      margin-top: 0.6666666667em;
      text-decoration: underline;
    }
    #map-info img {
      height: auto;
      max-width: 100%;
    }

    .tooltip{
          opacity: 1;
          font-style: normal;
    }

@media (max-width:767px){
  #places-map .main-branch img{
    width: 2em;
  }
  #places-map .map-location-marker h4{
    font-size: 15px;
  }
  #places-map .marker-peterborough p{
    font-size: 12px;
    width: 80%;
    line-height: 14px;
  }
  #places-map .map-location-marker img{
    width: 1em;
  }
  #places-map .marker-costa-rica{
    left: 8.5%;
  }
  #places-map .marker-dubai{
    left: 37%;
    top:83%;
  }
  #places-map .marker-manila{
    left: 65.5%;
    top: 62%;
  }
}