.map-main-fold{
    padding: 88px 0 100px;
    position: relative;
}
.map-main-fold-inner{
    max-width: 1120px;
    margin: 0 auto;
}
.map-main-fold-inner h2{
    font-family: 'avenir_next_worldbold', 'Verdana';
    font-size: 32px;
    line-height: 40px;
    text-align: center;
    color: #222;
    margin-bottom: 8px;
}
.map-yellow-bg{
    flex-shrink: 0;
    /* background: #FFEBAD; */
    filter: blur(80px);
    position: absolute;
    z-index: -1;
    /* width: 99%; */
    height: 670.618px;
    transform: rotate(-176.365deg);
}
.sub-title{
    font-size: 16px;
font-style: normal;
font-weight: normal;
color: #222;
line-height: 28px;
text-align: center;
margin-bottom: 58.5px;
font-family: 'avenir_next_worldmedium', 'Verdana';
}
.map-inner{
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    max-width: 1120px;
    margin: 0 auto;
    border-radius: 24px;
    overflow: hidden;
}
.main-map{
    z-index: 1;
    width: 764px;
    height: auto;
    flex-shrink: 0;
    /* margin: 77px auto 32px; */
    margin: 77px 217px 32px 138px;
}
.perth-marker{
    position:absolute;
    left: 16.6%;
    bottom: 34%;
    z-index: 2;
}
.hover-marker-perth{
    position: absolute;
    left: 16.6%;
    bottom: 34%;
    z-index: 2;
    transition: opacity 0.3s ease-in-out;
}

.perth-area:hover .perth-marker,
.adelaide-area:hover .adelaide-marker,
.melbourne-area:hover .melbourne-marker,
.sydney-area:hover .sydney-marker,
.brisbane-area:hover .brisbane-marker,
.auckland-area:hover .auckland-marker,
.melbourne-area-dark:hover .melbourne-dark-marker{
    opacity: 0; 
}
.melbourne-area:hover .melbourne-area-dark .mel-dark{
    display: none;
}

.perth-area:hover .hover-marker-perth,
.adelaide-area:hover .hover-marker-adelaide,
.melbourne-area:hover .hover-marker-melbourne,
.sydney-area:hover .hover-marker-sydney,
.brisbane-area:hover .hover-marker-brisbane,
.auckland-area:hover .hover-marker-auckland,
.melbourne-area-dark:hover .hover-marker-melbourne-dark{
    opacity: 1; 
}
.perth-area:hover .map-area-name,
.adelaide-area:hover .map-area-name,
.melbourne-area:hover .map-area-name,
.sydney-area:hover .map-area-name,
.brisbane-area:hover .map-area-name,
.auckland-area:hover .map-area-name,
.melbourne-area-dark:hover .map-area-name{
    background: #5442C7;
    border: 1px solid #5442C7;
}
.perth-area:hover .map-area-name span,
.adelaide-area:hover .map-area-name span,
.melbourne-area:hover .map-area-name span,
.sydney-area:hover .map-area-name span,
.brisbane-area:hover .map-area-name span,
.auckland-area:hover .map-area-name span,
.melbourne-area-dark:hover .map-area-name span{
    color: #fff;
}
.adelaide-marker, .hover-marker-adelaide{
    position:absolute;
    left: 43.3%;
    bottom: 29.6%;
    z-index: 2;
}
.melbourne-dark-marker, .hover-marker-melbourne-dark{
    position:absolute;
    left: 47.4%;
    bottom: 23.6%;
    z-index: 2;
}
.melbourne-marker, .hover-marker-melbourne{
    position:absolute;
    left: 52.2%;
    bottom: 21.6%;
    z-index: 2;
}
.sydney-marker, .hover-marker-sydney{
    position:absolute;
    right: 41.9%;
    bottom: 30.6%;
    z-index: 2;
}
.marker-img{
    width: 26.251px;
    cursor: pointer;
    transition: transform 0.5s ease;
}

.brisbane-marker, .hover-marker-brisbane{
    position:absolute;
    right: 39%;
    bottom: 40%;
    z-index: 2;
}
.auckland-marker, .hover-marker-auckland{
    position:absolute;
    right: 19.3%;
    bottom: 31.1%;
    z-index: 2;
}
.map-popup{
    display:none;
    width: 288px;
    height: auto;
    position: fixed;
    /* z-index: 99991; */
    z-index: 9;
    /* display:block; */
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    position: relative;
    left: 65%;
    bottom: 680px;
    height: 0px;
}
.map-popup-inner{
    background: #fff;
    border-radius: 20px;
    box-shadow: -8px 8px 8px 0px rgba(113, 113, 113, 0.10);
    width: 288px;
    position: relative;
    text-align: center;
    padding: 56px 0px 40px 0px;
}
.map-popup .close-btn{
    position: absolute;
    right: 0;
    top: 0;
    cursor: pointer;
}
.map-popup .close-btn svg{
    width: 14px;
    height: 14px;
    position: absolute;
    top: 24px;
    right: 24px;
}
.map-popup-inner .popup-title{
    font-family: 'avenir_next_worldbold', 'Verdana';
    font-size: 20px;
    line-height: 28px;
    color: #000000;
    margin-bottom: 4px;
}
.map-popup-inner p{
    font-family: 'avenir_next_worldmedium', 'Verdana';
    font-size: 14px;
    line-height: 24px;
    color: #000000;
    margin-bottom: 16px;
}
.map-popup .popup1-cta{
    font-family: 'avenir_next_worlddemi', 'Verdana';
    font-size: 14px;
    color: #000 !important;
    cursor: pointer;
    background:#FFE28C;
    border-radius: 8px;
    padding: 10px 30px;
    display: inline-block;
}
.map-popup .popup1-cta:hover{
    background: #FECE56 !important;
}
.map-area-name{
    display: inline-flex;
    padding: 4px 16px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    position: absolute;
    left: 13.2%;
    bottom: 26%;
    z-index: 2;
    border-radius: 26.556px;
    border: 1px solid #FFB300;
    background: #FFF;
}
.adelaide-mp-name{
    left: 31%;
    bottom: 23%;
}
.melbourne-mp-name{
    left: 44%;
    bottom: 15%;
}
.sydney-mp-name{
    left: 57.6%;
    bottom: 25%;
}
.brisbane-mp-name{
    left: 61%;
    bottom: 38%;
}
.auckland-mp-name{
    left: 80%;
    bottom: 37%;
}
.map-area-name span{
    color: #8C4800;
    text-align: center;
    font-family: 'avenir_next_worlddemi', 'Verdana';
    font-size: 16px;
    font-style: normal;
    font-weight: normal;
    line-height: 28px;
    cursor: pointer;
}

.map-area-name:hover span{
    color: #fff;
}
.mobile {
    display: none;
}

@media (max-width:991px){
    .plain-icon, .pencil-icon{
        display:none;
    }
    .main-map{
        width: 664px;
    }
    .perth-marker, .hover-marker-perth{
        left: 6.9%;
        bottom: 35%;
    }
    .map-area-name{
        left: 2.2%;
        bottom: 27%;
    }
    .adelaide-marker, .hover-marker-adelaide {
        left: 40.3%;
        bottom: 30.6%;
    }
    .melbourne-marker, .hover-marker-melbourne{
        left: 51.2%;
        bottom: 21.6%;
    }
    .melbourne-dark-marker, .hover-marker-melbourne-dark {
        left: 44.4%;
        bottom: 23.6%;
    }
    .sydney-marker, .hover-marker-sydney {
        right: 39.9%;
        bottom: 32.6%;
    }
    .brisbane-marker, .hover-marker-brisbane {
        right: 39%;
        bottom: 44%;
    }
    .auckland-marker, .hover-marker-auckland {
        right: 12%;
        bottom: 31%;
    }
    .auckland-mp-name {
        left: 85%;
        bottom: 40%;
    }
    .brisbane-mp-name {
        left: 63%;
        bottom: 43%;
    }
    .sydney-mp-name {
        left: 59.6%;
        bottom: 28%;
    }
    .melbourne-mp-name {
        left: 38%;
        bottom: 14%;
    }
    .adelaide-mp-name {
        left: 25%;
        bottom: 28%;
    }
    .map-popup{
        left: 73%;
        bottom: 646px;
    }
    .map-popup-inner{
        padding: 35px 0px 35px 0px;
    }
}
@media (max-width:767px){
    img.main-map.desktop{
        display: none !important;
    }
    .map-inner{
        max-width: 100%;
    }
    .main-map{
        padding: 36px 52px 36px 20px;
        margin: auto;
    }
    .sub-title.desktop,
    .map-yellow-bg svg.desktop{
        display: none;
    }
    .map-main-fold .mobile{
        display: block !important;
        width: 100%; 
    }
    .main-map.mobile{
        height: auto;
    }
    .map-yellow-bg{
        filter: blur(2px);
        position: absolute;
        width: 390.345px;
        height: 196px;
        bottom: -148px;
    }
    .map-yellow-bg svg.mobile{
        height: 500px;
        width: 120%;
    }
    .sub-title.mobile{
        margin-bottom: 40px;
    }
    .map-main-fold{
        padding: 48px 16px;
    }
    .map-main-fold-inner h2{
        margin:0 auto;
        margin-bottom: 16px;
    }
    .marker-img{
        width: 8.747px;
        height: 13.121px;
    }
    .map-popup-inner .popup-title{
        font-size: 16px;
        line-height: 24px;
    }
    .map-popup-inner{
        width: 280px;
        padding: 32px 0px 32px 0px;
    }
    .map-popup{
        width: 280px;
    }
    .sub-title{
        margin-bottom: 0px;
    }
    .map-area-name{
        padding: 1.333px 5.331px;
        border-radius: 8.849px;
        border: 0.333px solid #FFB300;
        background: #FFF;
    }
    .map-area-name span{
        font-size: 8px;
        line-height: 8px;
    }
    .perth-marker, .hover-marker-perth{
        left: 11.9%;
        bottom: 37%;
    }
    .map-area-name{
        left: 4.2%;
        bottom: 32%;
    }
    .adelaide-marker, .hover-marker-adelaide {
        left: 42.3%;
        bottom: 35.6%;
    }
    .melbourne-marker, .hover-marker-melbourne{
        left: 52.2%;
        bottom: 29.6%;
    }
    .melbourne-dark-marker, .hover-marker-melbourne-dark {
        left: 46.4%;
        bottom: 31.6%;
    }
    .sydney-marker, .hover-marker-sydney {
        right: 41.9%;
        bottom: 37.6%;
    }
    .brisbane-marker, .hover-marker-brisbane {
        right: 39%;
        bottom: 44%;
    }
    .auckland-marker, .hover-marker-auckland {
        right: 15.3%;
        bottom: 37%;
    }
    .auckland-mp-name {
        left: 82%;
        bottom: 44%;
    }
    .brisbane-mp-name {
        left: 61%;
        bottom: 49%;
    }
    .sydney-mp-name {
        left: 57.6%;
        bottom: 34%;
    }
    .melbourne-mp-name {
        left: 44%;
        bottom: 23%;
    }
    .adelaide-mp-name {
        left: 25%;
        bottom: 35%;
    }
    .map-popup{
        position: relative;
        left: 50%;
        bottom: 285px;
        height: 0px;
    }
}