/*mapa*/

.mapa-parceiros #mapageral,
.mapa-parceiros #mapageral2{
    position: relative;
    padding-bottom: 40%;
}



.marker{
    width: 32px;
    height: 46px;
    margin-left: -16px;
    margin-top: -46px;
    background: url(bandeira.png) center no-repeat;
    border-radius: 50%;
}

.marker::after{
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 50%;
    top: 50%;
    display: block;
    -webkit-transform: translate3d(-50%, -50%, 0);
    -moz-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0); 
    z-index: -1;
    border-radius: 50%;
    
}

.marker:hover::after,
.marker.active::after{
    animation: hoverMaker linear .8s infinite;
}

/*@keyframes hoverMaker{
    0%{
        width: 100%;
        height: 100%;
        background-color: rgba(253, 224, 0, 0.9);
        transform: translate3d(-50%, -50%, 0) scale(1);
    }
    50%{
        transform: translate3d(-50%, -50%, 0) scale(1.3);
        background-color: rgba(253, 224, 0, 0.4);

    }
    100%{
        transform: translate3d(-50%, -50%, 0) scale(1.6);
        background-color: rgba(253, 224, 0, .0);

    }
}

@keyframes hoverMakerNetzee{
    0%{
        width: 100%;
        height: 100%;
        background-color: rgba(253, 224, 0, 1);
        transform: translate3d(-50%, -50%, 0) scale(1);
    }
    50%{
        transform: translate3d(-50%, -50%, .5) scale(1.2);
        background-color: rgba(253, 224, 0, 0.4);

    }
    100%{
        transform: translate3d(-50%, -50%, 0) scale(1.4);
        background-color: rgba(253, 224, 0, .0);

    }
}
*/

.marker[data-marker_id="azz"]{
    width: 75px;
    height: 75px;
    margin-left: -36.5px;
    margin-top: -36.5px;
    background: url(azz-pointer.png) center no-repeat;
    border-radius: 50%;
    z-index: 9;
}


.marker[data-marker_id="azz"]::after{
    content: "";
    position: absolute;
    
}

.marker[data-marker_id="azz"]::before{
    /*content: url(../images/logo-mapa.png);*/
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    width: 58px;
    height: 18px;
}


.marker[data-marker_id="green"]{
   width: 32px;
    height: 46px;
    margin-left: -16px;
    margin-top: -46px;
    background: url(../images/pointer-green.png) center no-repeat;
    background-size: contain;
    border-radius: 50%;
    z-index: 9;
}
.marker[data-marker_id="orange"]{
   width: 32px;
    height: 46px;
    margin-left: -16px;
    margin-top: -46px;
    background: url(../images/pointer-orange.png) center no-repeat;
    background-size: contain;
    border-radius: 50%;
    z-index: 9;
}
.marker[data-marker_id="red"]{
   width: 32px;
    height: 46px;
    margin-left: -16px;
    margin-top: -46px;
    background: url(../images/pointer-red.png) center no-repeat;
    background-size: contain;
    border-radius: 50%;
    z-index: 9;
}
/*.marker[data-marker_id="green"]::after{
    content: "";
    position: absolute;
    
}

.marker[data-marker_id="green"]::before{
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    width: 58px;
    height: 18px;
}*/




#mapageral > div > div > div:nth-child(1) > div:nth-child(1),
#mapageral2 > div > div > div:nth-child(1) > div:nth-child(1){
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}

#mapageral .lojamap, #mapageral2 .lojamap {
    position: absolute;
    top: 50%;
    left: 100%;
    margin-left: 15px;
    visibility: visible !important;
    transform: translateY(-50%);
    background-color: #ffffff;
    border-radius: 50%;
    height: 153px;
    width: 153px;
    overflow: hidden;
    z-index: 9;
}

#mapageral .lojamap a,
#mapageral2 .lojamap a{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 50%;
}


#mapageral .lojamap::before,
#mapageral2 .lojamap::before{
    content: "";
    display: block;
    height: 0;
    border-top: 24.5px solid transparent;
    border-bottom: 24.5px solid transparent;
    border-right: 12px solid #fff;
    position: absolute;
    left: -7px;
    top: 0;
    bottom: 0;
    margin: auto;
}

#mapageral .lojamap img,
#mapageral2 .lojamap img{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    max-width: 60%;
}



.mapa-parceiros #mapageral,
.mapa-parceiros #mapageral2{
    pointer-events: none;
}