@keyframes wave1 {
    0% {
        transform: scale(.9);
        opacity: 1;
    }

    30% {
        transform: scale(1.5);
        opacity: .8;
    }
    50% {
        transform: scale(2);
        opacity: .6;
    }
    70% {
        transform: scale(2.5);
        opacity: .3;
    }
    80% {
        transform: scale(3);
        opacity: .1;
    }
    100% {
        transform: scale(3.5);
        opacity: 0;
    }
}
@keyframes rec {
    0% {
        opacity: 1;
    }
    49% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}

/*0A8C3F*/
/*048037*/
/*0b9b45*/

@-webkit-keyframes pulseShadow {
    0% {
        opacity: 0;
    }
    2% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
@keyframes pulseShadow {
    0% {
        opacity: 0;
    }
    2% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@keyframes resizeDot {
    0%, 50%, 100% {
        transform: scale(1);
    }
    25% {
        transform: scale(1.5);
    }
}

@keyframes resizeDot2 {
    0%, 50%, 100% {
        transform: scale(1);
    }
    25% {
        transform: scale(2);
    }
}

@keyframes leftRight {
    0% { transform:translate(0,0) }
    25% { transform:translate(5px, 0); }
    50% { transform:translate(0,0); }
    75% { transform:translate(-5px,0); }
    100% { transform:translate(0,0); }
}


@keyframes upDown {
    0% { transform:translate(0,0) }
    25% { transform:translate(0, 5px); }
    50% { transform:translate(0,0); }
    75% { transform:translate(0,-5px); }
    100% { transform:translate(0,0); }
}

@keyframes bounce {
    from,
    20%,
    53%,
    80%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    40%,
    43% {
        -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        -webkit-transform: translate3d(0, -6px, 0);
        transform: translate3d(0, -6px, 0);
    }

    70% {
        -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        -webkit-transform: translate3d(0, -3px, 0);
        transform: translate3d(0, -3px, 0);
    }

    90% {
        -webkit-transform: translate3d(0, -1px, 0);
        transform: translate3d(0, -1px, 0);
    }
}

@keyframes shake {
    0%,
    50% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    5%,
    15%,
    25%,
    35%,
    45% {
        -webkit-transform: translate3d(-2px, 0, 0);
        transform: translate3d(-2px, 0, 0);
    }

    10%,
    20%,
    30%,
    40% {
        -webkit-transform: translate3d(2px, 0, 0);
        transform: translate3d(2px, 0, 0);
    }
}

@keyframes heartBeat {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    14% {
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
    }

    28% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    42% {
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
    }

    70% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}
@keyframes heartBeat2 {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    14% {
        -webkit-transform: scale(1.5);
        transform: scale(1.5);
    }

    28% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    42% {
        -webkit-transform: scale(1.5);
        transform: scale(1.5);
    }

    70% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes showIn {
    to {
        transform: scale(1);
    }
}
@keyframes pulse3 {
    0% { -webkit-transform: scale(1); transform:scale(1); }
    50% { -webkit-transform: scale(1.05); transform:scale(1.05); }
    100% { -webkit-transform: scale(1); transform:scale(1); }
}


@keyframes spin {
    0% { -webkit-transform: rotate(0deg); transform:rotate(0deg); }
    50% { -webkit-transform: rotate(0deg); transform:rotate(0deg); }
    75% { -webkit-transform: rotate(360deg); transform:rotate(360deg); }
    100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); }
}
@keyframes zoomIn {
    0% { -webkit-transform: scale(1); transform:scale(1); }
    50% { -webkit-transform: scale(1.2); transform:scale(1.2); }
    100% { -webkit-transform: scale(1); transform:scale(1); }
}
@keyframes zoomIn2 {
    0% { -webkit-transform: scale(.72); transform:scale(.72); }
    50% { -webkit-transform: scale(.67); transform:scale(.67); }
    100% { -webkit-transform: scale(.72); transform:scale(.72); }
}
@-webkit-keyframes pulse {
    0% { box-shadow:0 0 8px #ffffff, inset 0 0 8px #ffffff; }
    50% { box-shadow:0 0 16px #ffffff, inset 0 0 14px #ffffff; }
    100% { box-shadow:0 0 8px #ffffff, inset 0 0 8px #ffffff; }
}

@keyframes flash {
    0% {
        opacity: 0;
    }
    10% {
        opacity: 1;
    }
    20% {
        opacity: .8;
    }
    60% {
        opacity: .2;
    }
    100% {
        opacity: 0;
    }
}

@keyframes pulse1 {
    0% {
        transform: scale(.6);
        opacity: 0;
    }

    50% {
        transform: scale(.6);
        opacity: 0;
    }
    60% {
        transform: scale(.9);
        opacity: .1;
    }
    70% {
        transform: scale(1.1);
        opacity: .25;
    }
    80% {
        transform: scale(1.25);
        opacity: .1;
    }
    100% {
        transform: scale(1.4);
        opacity: 0;
    }
}

@keyframes pulse2 {
    0% {
        transform: scale(1);
        opacity: 0;
    }

    40% {
        transform: scale(1.2);
        opacity: .25;
    }
    50% {
        transform: scale(1.3);
        opacity: .51;
    }
    60% {
        transform: scale(1.4);
        opacity: .63;
    }
    80% {
        transform: scale(1.5);
        opacity: .81;
    }
    100% {
        transform: scale(1.6);
        opacity: 0;
    }
}

@keyframes shine {
    0% {
        opacity: 1;
    }
    50% {
        top: -30%;
        left: -30%;
        opacity: 0;
    }
    99% {
        opacity: 0;
        top: -110%;
        left: -210%;
    }
    100% {
        opacity: 0;
        top: -110%;
        left: -210%;
    }
}

/* circles */
.olPopup, .olPopup>div{
    overflow: visible!important;
}
.gmaps-face span {
    background: none;
    cursor: pointer;
}
.gmaps_girl a {
    z-index: 1;
    position: relative;
}

/* true-class */
.type-simple.gmaps_girl .gmaps-face span {
    background: url(/image/g-f-inactive.svg) no-repeat;
    height: 110px;
    background-size: 90px;
}

.type-online.gmaps_girl .gmaps-face span {
    background: url(/image/g-active.svg) no-repeat;
    height: 110px;
    background-size: contain;
}
.type-online .gmaps-face span::after {
    content: '';
    position: absolute;
    width: 90px;
    height: 90px;
    border-radius: 50px;
    left: 0;
    top: 0;
    opacity: 0;
    will-change: opacity;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation: pulseShadow 2s 0s ease-out infinite;
    animation: pulseShadow 2s 0s ease-in infinite;
    -webkit-box-shadow: 0 0 14px 6px #0A8C3F, 0 0 12px 25px #0A8C3F67;
    box-shadow: 0 0 14px 6px #0A8C3F, 0 0 12px 25px #0A8C3F67;
}
.type-cam.gmaps_girl .gmaps-face a,
.type-simple.gmaps_girl .gmaps-face a,
.type-online.gmaps_girl .gmaps-face a {
    border: 2px solid transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 50%;
    width: 90px;
    height: 90px;
}

.type-cam img {
    animation:zoomIn 2s linear infinite;
}
.type-cam.gmaps_girl .gmaps-face span {
    background: url(/image/g-shape.svg) no-repeat;
    height: 110px;
    background-size: 90px;
}
.type-cam .gmaps-face span::before {
    content: '';
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    background: url(/image/message-watch.svg) no-repeat;
    width: 77px;
    height: 40px;
    left: 7px;
    top: -28px;
    background-size: 100% 100%;
    z-index: 5;
    font-size: 12px;
    line-height: 12px;
    padding-bottom: 1px;
    padding-left: 8px;
    padding-right: 8px;
    text-align: center;
    font-weight: 500;
    animation: shake 2s linear .8s infinite;
}
.type-cam .gmaps-face span::before {
    animation: bounce 1s linear .8s infinite;
}
.type-cam .gmaps-face span::after {
    content: '';
    position: absolute;
    background: url(/image/live2.svg) no-repeat;
    width: 39px;
    height: 17px;
    left: 50%;
    top: 71%;
    transform: translate(-50%,0);
}
.type-cam:after {
    content: '';
    position: absolute;
    width: 5px;
    height: 5px;
    background: #ff0200;
    border-radius: 50%;
    left: 31px;
    z-index: 3;
    top: 84px;
    animation: rec 1.5s linear infinite;
}

.members-girls-div a {
    display: block;
    width: 90px;
    height: 110px;
    position: relative;
}
.members-girls-div.gmaps_girl a:after {
    position: absolute;
    content: '';
    left: 0;
    top: 0;
    z-index: 10;
    display: block;
    width: 90px;
    height: 110px;
    background: url(/image/in.svg) no-repeat;
    background-size: contain;
}
.members-girls-div.gmaps_girl:nth-child(2) a:after, .members-girls-div.gmaps_girl:nth-child(3) a:after {
    background: url(/image/liveInsta.svg) no-repeat;
    background-size: contain;
}
.members-girls-div:nth-child(2) img, .members-girls-div:nth-child(3) img {
    transform: scale(0.72);
    animation: zoomIn2 1s linear infinite;
}
.members-girls-div.gmaps_girl a:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 90px;
    height: 90px;
    background: #000;
    border-radius: 50px;
}
.members-girls-div .gmaps-face span {
    background: none;
    overflow: hidden;
    border-radius: 90px;
}

@media (max-width: 1024px) {
    .type-cam.gmaps_girl .gmaps-face a,
    .type-simple.gmaps_girl .gmaps-face a,
    .type-online.gmaps_girl .gmaps-face a,
    .members-girls-div.gmaps_girl .gmaps-face a{
        width: 80px;
        height: 80px;
    }
    .type-simple.gmaps_girl .gmaps-face span {
        background-size: 80px;
    }

    .type-online.gmaps_girl .gmaps-face span {
        background-size: contain;
        width: 80px !important;
        height: 100px !important;
    }
    .type-online .gmaps-face span::after {
        width: 80px !important;
        height: 80px !important;
    }

    .type-cam.gmaps_girl .gmaps-face span {
        background-size: 80px;
    }
    .type-cam .gmaps-face span::before {
        left: 0;
    }
    .type-cam:after {
        left: 26px;
        top: 74px;
    }

    .members-girls-div::before{
        position: absolute;
    }
    .members-girls-div.gmaps_girl a:after {
        width: 80px;
        background-size: contain;
    }
    .members-girls-div.gmaps_girl a:before {
        width: 80px;
        height: 80px;
    }
    .members-girls-div .gmaps-face span {
        height: 80px !important;
    }
}
@media (max-width: 359px) {
    .members-girls-div.gmaps_girl, .members-girls-div.gmaps_girl .gmaps-face {
        width: 72px!important;
        height: 80px!important;
    }
    .members-girls-div.gmaps_girl .gmaps-face img {
        width: 70px;
        height: 70px;
    }
    .members-girls-div.gmaps_girl a:before {
        width: 70px;
        height: 70px;
    }
    .members-girls-div.gmaps_girl a:after{
        width: 70px;
    }
}
/* end true-class */



/* NEW MAP START */
.static-map-wrapper {
    overflow: hidden;
    height: 450px;
    display: flex;
    justify-content: center;
    flex-wrap: nowrap;
    position: relative;
    background-color: #222323;
}

.profile-wrapper {
    min-width: 1924px;
    min-height: 450px;
    overflow: hidden;
    margin: 0 auto;
    text-align: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.profile-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.4);
}

.profile {
    display: inline-block;
    position: relative;
    width: 90px;
    height: 110px;
    z-index: 2;
    cursor: pointer;
    background-image: url(/image/g-f-inactive.svg);
    background-size: contain;
}

.profile img {
    padding: 3px;
    border-radius: 50%;
    width: 90px;
    height: 90px;
    z-index: 3;
}

.profile-online{
    background-image: url(/image/g-active.svg);
}

.profile-online::after{
    content: '';
    position: absolute;
    width: 90px;
    height: 90px;
    border-radius: 50px;
    left: 0;
    top: 0;
    opacity: 0;
    will-change: opacity;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation: pulseShadow 2s 0s ease-out infinite;
    animation: pulseShadow 2s 0s ease-in infinite;
    -webkit-box-shadow: 0 0 14px 6px #0A8C3F, 0 0 12px 25px #0A8C3F67;
    box-shadow: 0 0 14px 6px #0A8C3F, 0 0 12px 25px #0A8C3F67;
}

@media (max-width: 1024px) {
    .profile {
        width: 80px;
        height: 100px;
    }

    .profile img {
        width: 80px;
        height: 80px;
        z-index: 3;
    }

    .profile-online::after {
        width: 80px;
        height: 80px;
    }
}
/* NEW MAP END */
