.seasonal-map-wrapper {
  width: 540px;
  position: relative;
  padding: 20px;
  left: 50%;
  margin-left: -250px;
}

.seasonal-map-wrapper .seasonal-map-container {
  position: relative;
  z-index: 1;
}

.seasonal-map-wrapper .socialCircle-item a {
    color: #ffffff;
    text-decoration: none;
    display: block;
    line-height: 40px;
    text-align: center;
    box-sizing: border-box;
}


.seasonal-map-wrapper .seasonal-map-container img {
  max-width: 100%;
  height: auto;
}

.seasonal-map-wrapper .location {
  z-index: 3;
  color: #dad7d7;
  text-shadow: 1px 2px 3px #000;
  text-decoration: none;
}

.seasonal-map-wrapper .location.perth, .seasonal-map-wrapper .location.peel, .seasonal-map-wrapper .location.southwest, .seasonal-map-wrapper .great-southern {
  color: #666666;
  text-shadow: 1px 2px 3px transparent;
}

.seasonal-map-wrapper .kimberley {
  position: absolute;
  top: 9px !important;
  left: 8px !important;
}

.seasonal-map-wrapper .pilbara {
  position: absolute;
  top: 15px !important;
  left: 12px !important;
}

.seasonal-map-wrapper .gascoyne {
  position: absolute;
  top: 0 !important;
  left: 2px !important;
}

.seasonal-map-wrapper .midwest {
  position: absolute;
  top: 9px !important;
  left: 6px !important;
}

.seasonal-map-wrapper .goldfields {
  position: absolute;
  top: 0 !important;
  left: 0 !important;
}

.seasonal-map-wrapper .wheatbelt {
  position: absolute;
  top: 0 !important;
  left: 0 !important;
}

.seasonal-map-wrapper .perth {
  position: absolute;
  top: 6px !important;
  left: 4px !important;
  z-index: 3;
}

.seasonal-map-wrapper .peel {
  position: absolute;
  top: 0 !important;
  left: 16px !important;
  z-index: 3;
}

.seasonal-map-wrapper .southwest {
  position: absolute;
  top: -19px !important;
  left: 0 !important;
  z-index: 3;
}

.seasonal-map-wrapper .great-southern {
  position: absolute;
  top: 10px !important;
  left: 0 !important;
  z-index: 3;
}

.seasonal-map-wrapper .pointer {
  border-top: solid 2px #928f8f;
  display: block;
}

.seasonal-map-wrapper .pointer.perth {
  width: 110px;
  position: absolute;
  left: 59px !important;
  top: 387px !important;
  -ms-transform: rotate(7deg);

  -webkit-transform: rotate(7deg);

  transform: rotate(7deg);
}

.seasonal-map-wrapper .pointer.perth:after {
  content: "";
  background-color: #928f8f;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: block;
  position: absolute;
  right: -5px;
  top: -5px;
}

.seasonal-map-wrapper .pointer.peel {
  width: 110px;
  position: absolute;
  left: 65px !important;
  top: 415px !important;
  -ms-transform: rotate(-7deg);

  -webkit-transform: rotate(-7deg);

  transform: rotate(-7deg);
}

.seasonal-map-wrapper .pointer.peel:after {
  content: "";
  background-color: #928f8f;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: block;
  position: absolute;
  right: -5px;
  top: -5px;
}

.seasonal-map-wrapper .pointer.southwest {
  width: 110px;
  position: absolute;
  left: 76px !important;
  top: 448px !important;
  -ms-transform: rotate(-20deg);

  -webkit-transform: rotate(-20deg);

  transform: rotate(-20deg);
}

.seasonal-map-wrapper .pointer.southwest:after {
  content: "";
  background-color: #928f8f;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: block;
  position: absolute;
  right: -5px;
  top: -5px;
}

.seasonal-map-wrapper .pointer.great-southern {
  width: 60px;
  position: absolute;
  left: 206px !important;
  top: 459px !important;
  -ms-transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

.seasonal-map-wrapper .pointer.great-southern:after {
  content: "";
  background-color: #928f8f;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: block;
  position: absolute;
  right: -5px;
  top: -6px;
}

.seasonal-map-wrapper .kimberley-hover {
  position: absolute;
  right: 56px;
  top: 20px;
  z-index: 2;
  display: none;
}

.seasonal-map-wrapper .pilbara-hover {
  position: absolute;
  right: 53px;
  top: 138px;
  z-index: 2;
  display: none;
}

.seasonal-map-wrapper .gascoyne-hover {
  position: absolute;
  right: 342px;
  top: 202px;
  z-index: 2;
  display: none;
}

.seasonal-map-wrapper .midwest-hover {
  position: absolute;
  right: 155px;
  top: 218px;
  z-index: 2;
  display: none;
}

.seasonal-map-wrapper .goldfields-hover {
  position: absolute;
  right: 44px;
  top: 212px;
  z-index: 2;
  display: none;
}

.seasonal-map-wrapper .wheatbelt-hover {
  position: absolute;
  right: 247px;
  top: 346px;
  z-index: 2;
  display: none;
}

.seasonal-map-wrapper .perth-hover {
  position: absolute;
  right: 359px;
  top: 385px;
  z-index: 2;
  display: none;
}

.seasonal-map-wrapper .peel-hover {
  position: absolute;
  right: 347px;
  top: 403px;
  z-index: 2;
  display: none;
}

.seasonal-map-wrapper .southwest-hover {
  position: absolute;
  right: 329px;
  top: 416px;
  z-index: 2;
  display: none;
}

.seasonal-map-wrapper .great-southern-hover {
  position: absolute;
  right: 269px;
  top: 411px;
  z-index: 2;
  display: none;
}

.seasonal-map-wrapper .icon {
  width: 100%;
  height: 100%;
  font-size: 1em;
}

.seasonal-map-wrapper .icon-wet {
    background-color: #004228;
    border-radius: 50%;
    text-decoration: none;
}

.seasonal-map-wrapper .icon-winter {
  background-color: #005583;
  border-radius: 50%;
}

.seasonal-map-wrapper .icon-dry {
  background-color: #774a39;
  border-radius: 50%;
}

.seasonal-map-wrapper .icon-summer {
  background-color: #c93106;
  border-radius: 50%;
}

.seasonal-map-wrapper .icon-spring {
  background-color: #697300;
  border-radius: 50%;
}

.seasonal-map-wrapper .icon-autumn {
  background-color: #7c1d01;
  border-radius: 50%;
}

.seasonal-map-wrapper, .seasonal-map-wrapper div {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}


    .socialCircle-item {
        width: 40px;
        height: 40px;
        position: absolute;
        background: #333;
        margin: 50%;
        text-align: center;
        color: #ffffff;
        font-size: 20px;
        cursor: pointer;
        border: solid 2px #ffffff;
        border-radius: 50%!important;
        box-shadow: 0 3px 3.76px 0.24px rgba(0, 0, 0, 0.4);
            pointer-events: auto;
    }

    .socialCircle-container-kimberley {
        position: absolute;
        width: 80px;
        height: 80px;
        top: 52px;
        right: 98px;
        z-index: 999;
    }

    .socialCircle-container-pilbara {
        position: absolute;
        width: 70px;
        height: 70px;
        top: 147px;
        right: 185px;
        z-index: 999;
    }

    .socialCircle-container-gascoyne {
        position: absolute;
        width: 70px;
        height: 70px;
        top: 238px;
        right: 381px;
        z-index: 999;
    }

    .socialCircle-container-midwest {
        position: absolute;
        width: 70px;
        height: 70px;
        top: 226px;
        right: 238px;
        z-index: 998;
    }

    .socialCircle-container-goldfields {
        position: absolute;
        width: 70px;
        height: 70px;
        top: 297px;
        right: 114px;
        z-index: 999;
    }

    .socialCircle-container-wheatbelt {
        position: absolute;
        width: 65px;
        height: 65px;
        top: 352px;
        right: 282px;
        z-index: 999;
    }

    .socialCircle-container-perth {
        position: absolute;
        width: 45px;
        height: 45px;
        top: 357px;
        right: 479px;
        z-index: 999;
    }

    .socialCircle-container-peel {
        position: absolute;
        width: 40px;
        height: 40px;
        top: 409px;
        right: 481px;
        z-index: 999;
    }

    .socialCircle-container-southwest {
        position: absolute;
        width: 75px;
        height: 40px;
        top: 450px;
        right: 463px;
        z-index: 900;
    }

    .socialCircle-container-great-southern {
        position: absolute;
        width: 105px;
        height: 40px;
        top: 472px;
        right: 247px;
        z-index: 999;
    }

    .socialCircle-center {
        width: auto;
        height: 50px;
        position: absolute;
        top: 98px!important;
        text-align: center;
        left: 72px!important;
        color: #333333;
        font-size: 14px;
        border-radius: 0 !important;
    }

    .hoverImage, .sNav, .rNav, .pointer {
        pointer-events: none;
    }

    .socialCircle-container-southwest .sNav, .socialCircle-container-perth .sNav, .socialCircle-container-peel .sNav, .socialCircle-container-great-southern .sNav {
        pointer-events: auto;
        cursor: pointer;
    }

    area {
        outline: 0;
        cursor: pointer;
    }

    .rNav.stored .socialCircle-item {
        display: none;
    }


.socialCircle-item .tooltiptext {
    font-family: Arial, Helvetica, "Nimbus Sans L", sans-serif;
    font-size: 60%;
    line-height: 14px;
    visibility: hidden;
    width: 120px;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    position: absolute;
    z-index: 9;
    bottom: 130%;
    left: 50%;
    margin-left: -60px;
    pointer-events: none;
}

.socialCircle-item .tooltiptext::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: black transparent transparent transparent;
}

.socialCircle-item:hover .tooltiptext {
    visibility: visible;
}