/*city*/



.city_style .point_btn{
    position: absolute;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    padding: 0px;
    margin-left: -8px;
    margin-top: -8px;
    z-index: 1001;
}
.city_style .point_seldiv{
    position: absolute;
    z-index:1000;
    margin-left: -50%;
    margin-top: -70%;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    /*border:1px solid black;*/
}
.city_style .point_sel_showdiv{
    position: absolute;
    z-index: 4;
    margin-left: -64px;
    margin-top: -64px;
    width: 128px;
    height: 128px;
    background-image: url(../EvoCraft/Resources/textures/war/animation/magic_anim2.png);
    animation-name: city_selecting;
    animation-duration: 1s;
    animation-timing-function: step-end;
    animation-iteration-count: infinite;
}
@keyframes city_selecting {
    0%     {background-position: -512px -640px;}
    12.5%  {background-position: -640px -640px;}
    25%    {background-position: -768px -640px;}
    37.5%  {background-position: -896px -640px;}
    50%    {background-position: -0px -768px;}
    62.5%  {background-position: -128px -768px;}
    75%    {background-position: -256px -768px;}
    87.5%  {background-position: -384px -768px;}
    100%   {background-position: -512px -640px;}
}

.city_style .hover_team:hover{
    width: 100% !important;
    height: 100% !important;
    border-radius: 0 !important;
    margin-left: -50% !important;
    margin-top: -70% !important;
}
.city_style .hover_our:hover{
    background: url(../EvoCraft/Resources/textures/war/our_selector.png);
}
.city_style .hover_enemy:hover{
    background: url(../EvoCraft/Resources/textures/war/enemy_selector.png);
}

.city_style .upgrade_building{
    background: url(../EvoCraft/Resources/textures/war/animation/magic_anim0.png);
    position: absolute;
    width: 128px;
    height: 128px;
    margin-top: -80%;
    animation-name: upgrade_building;
    animation-duration: 1s;
    animation-timing-function: step-end;
    animation-iteration-count: infinite;
    z-index: 5;  
}
.city_style .upgrade_loading{
    background: url(../EvoCraft/Resources/textures/war/animation/upgrade_timer.png);
    width: 32px;
    height: 32px;
    position: absolute;
    margin-top: -20%;
    animation-name: upgrade_loading;
    animation-duration: var(--upgrade_loading_time);
    animation-timing-function: step-end;
    animation-iteration-count: infinite;
    z-index: 5;  
}


.city_style .fighting{
    background: url(../EvoCraft/Resources/textures/war/animation/magic_anim0.png);
    width: 128px;
    height: 128px;
    position: absolute;
    margin-left: -50%;
    margin-top: -88%;
    /*background-position: -512px -512px;*/
    /*display: none;*/
    animation-name: fighting;
    animation-duration: 1.5s;
    animation-timing-function: step-end;
    animation-iteration-count: infinite;
    z-index: 6;  
}
.city_style .btn_upgrade{
    width: 48px;
    height: 48px;
    position: absolute;
    margin-left: 10%;
    margin-top: -70%;
    z-index: 1001;
}
.city_style .btn_upgrade .btn_upgrade_img{
background: url(../EvoCraft/Resources/textures/war/gui/gui01.png);
    width: 32px;
    height: 32px;
    background-position: -0px -64px;
    margin: auto;
    animation-name: animate_btn_upgrade_popup;
    animation-duration: 0.5s;
/*    animation-iteration-count: infinite;*/
    animation-timing-function: cubic-bezier(0.27, 1.52, 0.85, 1.5);
    z-index: 1001;
}
@keyframes animate_btn_upgrade_popup {
    from {transform:scale(0.5)}
    to {transform:scale(1)}
}

.city_style .btn_upgrade .btn_upgrade_img:hover{
    zoom:1.1;
    filter: saturate(5) hue-rotate(35deg);
}

.city_style .point_img{
    position: absolute;
    z-index:5;
    width: 100%;
    height: 100%;
    margin-left: -50%;
    margin-top: -85%;
}

.stable .point_img{
    position: absolute;
    z-index:5;
    width: 100%;
    height: 100%;
    margin-left: -50%;
    margin-top: -77%;
}



.city .level_1 .btn_upgrade,
.city .level_2 .btn_upgrade
{
    margin-left: 6%;
    margin-top: -45%;
}
.city .level_3 .btn_upgrade,
.city .level_4 .btn_upgrade,
.city .level_5 .btn_upgrade
{
    margin-left: 6%;
    margin-top: -60%;
}






.myprogress{
position: absolute;
    width: 40%;
    height: 15%;
    border-radius: 5px;
    text-align: center;
    margin-left: -20% !important;
    margin-top: 7% !important;
    overflow: hidden;
    border: 1px solid darkslategray;
    box-shadow: inset -1px 1px 5px 2px rgba(128, 128, 128, 0.5);
    z-index: 5;
}
.poplabel{
        font-size: 1vw;
    margin: 0px auto 0px auto;
    color: ghostwhite;
    z-index: inherit;
        text-shadow: 0px 0px 1px black, 0px 0px 1px black, 0px 0px 1px black;
}
.black_mask{
    height: 105%;
    background: black;
    opacity: 0.6;
    right: -1px;
    position: absolute;
}