#warZone .background {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 550px;
    background: url("../images/new/warZone/bg_wz_minimized.png");
}
#warZone .background.bg_4 {
    background: url('../images/new/warClicks/shop/rework/premium/1_wz_min.jpg') center;
}
#warZone .background.bg_11 {
    background: url('../images/new/warClicks/shop/rework/premium/wz_11.jpg') center;
}
#warZone .background.bg_12 {
    background: url('../images/new/warClicks/shop/rework/premium/wz_12.jpg') center;
}
#warZone .warZone_holder {
    position: relative;

    width: 1000px;
    height: 100%;

    margin: 0 auto;
}
#warZone .warZone_holder > .window:not(#w_main) {
    /*z-index: 940;*/
}
#warZone #notifications_holder{
    position: absolute;

    top: calc(140px - 45px);
    left: 200px;
    z-index: 1020;
}
#warZone #notifications {
	position: relative;
}
#warZone .notification {
    position: absolute;
    width: 600px;
    background: #c2b49b;
    top: 0;
    left: 0;
    display: none;

    border-radius: 8px;

    box-shadow: 1px 2px 3px rgba(0,0,0,0.75);
    transform: scale(0.01);
}
#warZone .notification .divider {
	position: relative;

	width: 94%;
	height: 8px;
	
	margin: 8px 3% 0 3%;
	
	border-top: 1px solid #453a26;
}
#warZone .notification .sharing {
    z-index: 1020;
    text-align: center;
    width: 90%;
}
#warZone .notification .title {
	position: relative;
	
	width: 100%;
	
	padding: 12px 0 0 0;
	
	font: 25px/29px 'MyriadPro';
    font-weight: bold;
	text-align: center;
	
	color: #453a26;
}
#warZone .notification .content {
	position: relative;
	
	width: 94%;
	
	padding: 0 3%;
	
	font: 18px/22px 'MyriadPro';
	text-align: center;
	
	color: #453a26;
}
#warZone .notification .banner {
	position: relative;
	
	width: 564px;
	height: 138px;
	
	margin: 8px 3% 0 3%;
}
#warZone .notification .x {
    position: absolute;
    width: 22px;
    height: 22px;

    right: 5px;
    top: 5px;

    border-radius: 8px;

    background: #dad5d0;

    font: 18px/22px 'titilliumWebBold';
    text-align: center;

    color: #453a26;

    box-shadow: 1px 1px 2px rgba(0,0,0,0.5) inset;
}
#warZone .notification .x:hover {
    box-shadow: 1px 1px 2px rgba(0,0,0,0.5) inset, 0 0 8px white, 0 0 8px white, 0 0 8px white;
}
#warZone .battle_star {
    position: absolute;

    width: 24px;
    height: 38px;

    transform-origin: 100% 100%;
    transform: scale(0.5);

    background: url("../images/warZone/battle_star.png");
}
#warZone .battle_star.gold {
    background-position: 0 0;
}
#warZone .battle_star.silver {
    background-position: -24px 0;
}
#warZone .battle_star.bronze {
    background-position: -48px 0;
}
#warZone .battle_star.back {
    position: absolute;

    width: 32px;
    height: 46px;

    left: 12px;
    top: 14px;

    border-radius: 12px;

    transform: scaleX(0.75) scaleY(0.5);

    background: #ffffff;
}
#warZone .note {
    position: absolute;

    top: 0;
    left: 318px;

	min-width: 400px;
	max-width: 400px; /*480px*/
	min-height: 24px;
    max-height: 24px;
	
	padding: 4px 16px;
	
	border-radius: 0 0 4px 4px;

    font: 18px/24px 'titilliumWebRegular';
    text-align: left;

    color: #453a26;

    background: #e6ded0;
	
	box-shadow: 1px 2px 3px rgba(0,0,0,0.5);
	
	overflow: hidden;

    animation: anim_note_down 0.5s ease-in;
}
#warZone .note > span:nth-child(1) {
	font-style: italic;
	margin-right: 48px;
}
#warZone .note > span:nth-child(2) {
	font-weight: bold;
}
#warZone .note > span:nth-child(2):hover {
	color: #96876b;
}
#warZone .note > .divider {
	min-width: 416px;
	max-width: 496px;
	height: 1px;
	
	margin: 4px -8px 0 -8px;
	
	background: #453a26;
	
	box-shadow: 0 1px 0 #f2eee7;
}
#warZone .note > .content {
	min-width: 480px;

	margin: 8px 0 6px 0;

    line-height: 20px;
}
#warZone .note .x {
    position: absolute;

    width: 22px;
    height: 22px;

    right: 5px;
    top: 5px;

    border-radius: 8px;

    background: #dad5d0;

    font: 18px/22px 'titilliumWebBold';
    text-align: center;

    color: #453a26;

    box-shadow: 1px 1px 2px rgba(0,0,0,0.5) inset;
}
#warZone .note .x:hover {
    box-shadow: 1px 1px 2px rgba(0,0,0,0.5) inset, 0 0 8px white, 0 0 8px white, 0 0 8px white;
}
#warZone #w_main .menu_upgrades {
    position: absolute;
    display: none;

    top: 0;
    left: 0;

    width: 100%;
    pointer-events: none;
}
#warZone .warZone_holder #w_all_ranks {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}
#warZone .warZone_holder #w_all_ranks .massive-holder{
    /*background: #eaeeef;*/
    background: #ecf0f1;
    width: 685px;
    height: 476px;
    position: absolute;
    left: 250px;
    top: 63px;
    margin: 0 auto;
    z-index:1;
}
#warZone .warZone_holder #w_all_ranks .massive-holder .header-div{
    width: 685px;
    height: 57px;
    position: relative;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
#warZone .warZone_holder #w_all_ranks .massive-holder .header-div .text{
    font: 25px/30px 'titilliumWebRegular';
    color: #f7931e;
    position: absolute;
    left: 14px;
    top: 16px;
}
#warZone .warZone_holder #w_all_ranks .massive-holder .header-div .info-button {
     margin-left: 115px;
     margin-top: 23px;
}
#warZone .warZone_holder #w_all_ranks .massive-holder .header-div .legend {
    width: 70px;
    height: 27px;
    font: 13px/26px 'titilliumWebBold';
    position: absolute;
    left: 193px;
    top: 15px;
    text-align: center;
    color: white;
    border-radius: 4px;
}
#warZone .warZone_holder #w_all_ranks .massive-holder .header-div .close{
    position: absolute;
    top: 6px;
    right: 10px;
    width: 36px;
    height: 36px;
    background: url("../images/new/warClicks/wc_splosno/sp_2_close_min.png");
}
#warZone .warZone_holder #w_all_ranks .massive-holder .header-div .close:hover{
    background-position-y: 36px;
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
}
#warZone .warZone_holder #w_all_ranks .massive-holder .left-div{
    background-color:yellow;
    width: 191px;
    height: 419px;
    position: relative;
    float: left;
    background: url("../images/new/warZone/image.png?v=2") 0 0;
}
#warZone .warZone_holder #w_all_ranks .massive-holder .right-div{
    width: 493px;
    height: 419px;
    overflow-x: hidden;
    overflow-y: scroll;
    position: relative;
    float: left;
    -webkit-transform: translateZ(0);
}
#warZone .warZone_holder #w_all_ranks .massive-holder .right-div > div:nth-child(odd){
    background: #e0e5e6;
}
#warZone .warZone_holder #w_all_ranks .massive-holder .one-rank{
    width: 477px;
    height: 56px;
    position: relative;
}
#warZone .warZone_holder #w_all_ranks .massive-holder .one-rank.current{
    background-color: #bbaf9f !important;
    color: white;
}
#warZone .warZone_holder #w_all_ranks .massive-holder .one-rank.current.show {
    animation-delay: 2s;
    animation-duration: 0.7s;
    animation-iteration-count: 3;
    animation-name: current_rank_show;
    animation-timing-function: ease-in-out;
}
#warZone .warZone_holder #w_all_ranks .massive-holder .one-rank .sequential-number{
    width: 35px;
    height: 25px;
    position: relative;
    float: left;
    display: inline-block;
    padding: 18px 1px 12px 27px;
    font: 16px/21px 'titilliumWebRegular';
}
#warZone .warZone_holder #w_all_ranks .massive-holder .one-rank .lock-holder{
    width: 60px;
    height: 56px;
    position: relative;
    float: left;
}
#warZone .warZone_holder #w_all_ranks .massive-holder .one-rank .lock-holder .lock-img{
    width: 25px;
    height: 24px;
    position: relative;
    background: url("../images/warZone/lock_unlock.png") 0 0 no-repeat ;
    top: 15px;
    left: 15px;
    border-radius: 50%;
}
#warZone .warZone_holder #w_all_ranks .massive-holder .one-rank .lock-holder .lock-img.current{
    border: solid #d7d0c9;
}
#warZone .warZone_holder #w_all_ranks .massive-holder .one-rank .flag-holder{
    width: 80px;
    height: 56px;
    position: relative;
    float: left;
}
#warZone .warZone_holder #w_all_ranks .massive-holder .one-rank .flag-holder .flag-img{
    position: relative;
    top: 9px;
    width: 83px;
    height: 38px;
    background: url("../images/warZone/ranks.png") 0 0 no-repeat ;
    transform: scale(0.70) rotate(180deg);
}
#warZone .warZone_holder #w_all_ranks .massive-holder .one-rank .flag-holder .flag-img.unknown{
    background: url("../images/new/warZone/wz_splosno/unknown_rank.png") 0 0 no-repeat ;
    background-position-x: 0 !important;
    background-position-y: 0 !important;
}
#warZone .warZone_holder #w_all_ranks .massive-holder .rank-name-holder{
    width: 250px;
    height: 56px;
    position: relative;
    float: left;
    left: 7px;
    font: 14px/69px 'titilliumWebRegular';
}
#warZone .warZone_holder #w_all_ranks .massive-holder .rank-name-holder.specStyle{
    font: 14px/55px 'titilliumWebRegular';
}
#warZone .warZone_holder #w_all_ranks .massive-holder .rank-name-holder .username{
    margin-left: 15px;
}
#warZone .warZone_holder #w_all_ranks .massive-holder .rank-name-holder > .reward-holder{
    display: inline-block;
    width: 107px;
    font: 11px/18px 'titilliumWebSemiBold' !important;
    height: 45px;
    right: -10px;
    position: absolute;
    padding-top: 8px;
}
#warZone .warZone_holder #w_all_ranks .massive-holder .rank-name-holder > .reward-holder{
    display: inline-block;
    width: 107px;
    font: 11px/17px 'titilliumWebSemiBold' !important;
    height: 45px;
    right: 2px;
    position: absolute;
    padding-top: 10px;
    text-align: right;
}
#warZone .warZone_holder #w_all_ranks .massive-holder .deal-damage{
    position: absolute;
    left: 209px;
    top: 12px;
    font: 10px/12px 'titilliumWebLight';
    /*text-transform: uppercase;*/
}
#warZone #w_main .menu_upgrades .container {
    position: relative;

    width: 630px;
    height: 502px;

    margin: 0 auto;

    background: #96876b;

    pointer-events: auto;

    box-shadow: 0 0 5px black;
}
#warZone #w_main .menu_upgrades .container >.head {
    width: calc(100% - 2 * 5px);
    height: calc(52px - 2 * 5px);

    padding: 5px;
}
#warZone #w_main .menu_upgrades .container .head >.content {
    width: 100%;
    height: 100%;

    border-radius: 8px;

    background: #c2b49b;
}
#warZone #w_main .menu_upgrades .container .head .content .title {
    display: inline-block;

    padding: 0 8px;
    font: 38px/42px 'titilliumWebSemiBold';
    color: black;
}
#warZone #w_main .menu_upgrades .container .head .content .close {
    float: right;

    margin: 3px;

    padding: 0 8px;

    font: 30px/36px 'titilliumWebRegular';
    color: black;

    border-radius: 6px;

    background: #96876b;
}
#warZone #w_main .menu_upgrades .container .head .content .close:hover {
    text-shadow: 0 0 6px white;
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
}
#warZone #w_main .menu_upgrades .container >.main {
    width: calc(100% - 2 * 5px);
    height: calc(100% - 52px - 5px);

    padding: 0 5px 5px 5px;
}
#warZone #w_main .menu_upgrades .container .main >.content {
    width: 100%;
    height: 100%;

    overflow-y: scroll;
}
#warZone #w_main .menu_upgrades .container .main .content >.top {
    display: inline-block;
    float: left;

    width: 100%;
}
#warZone #w_main .menu_upgrades .container .main .content >.bottom {
    float: left;
    width: 100%;
}
#warZone #w_main .menu_upgrades .container .main .content .back {
    position: relative;
    margin-right: 5px;
}
#warZone #w_main .menu_upgrades .container .main .content .back .button {
    position: absolute;

    bottom: 4px;
    right: 4px;

    padding: 0 16px;

    font: 14px/28px 'titilliumWebSemiBold';
    color: #c2b49b;

    border-radius: 8px;

    background: black;
}
#warZone #w_main .menu_upgrades .container .main .content .back .button.disabled {
    border: 1px solid black;
    line-height: 26px;
    padding: 0 14px;

    color: black;
    background: none;
}
#warZone #w_main .menu_upgrades .container .main .content .back .button:hover:not(.disabled) {
    border: 1px solid black;
    line-height: 26px;
    padding: 0 14px;

    color: black;
    background: #c2b49b;
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
}

#warZone #w_main .menu_upgrades .container .main .content .back.special {
    display: inline-block;

    width: calc(50% - 5px);
    height: 155px;
    background: #c2b49b;
}
#warZone #w_main .menu_upgrades .container .main .content .back.special >.inner {
    position: relative;
    display: inline-block;

    width: calc(100% - 2 * 5px);
    height: calc(100% - 2 * 5px);

    margin: 5px;

    background: linear-gradient(to bottom, #96876b 0%, #96876b 70%, #448967 70%, #448967 100%);
}
#warZone #w_main .menu_upgrades .container .main .content .back.special .inner >.top {
    position: relative;
    float: left;

    height: 70%;
    width: 100%;
}
#warZone #w_main .menu_upgrades .container .main .content .back.special .inner .top .name {
    position: absolute;

    top: 8px;
    left: 8px;

    font: 16px/16px 'titilliumWebSemiBold';
    color: black;
    text-align: left;
}
#warZone #w_main .menu_upgrades .container .main .content .back.special .inner .top .cost {
    position: absolute;

    bottom: 8px;
    right: 25px;

    font: 16px/16px 'titilliumWebSemiBold';
    color: black;
    text-align: right;
}
#warZone #w_main .menu_upgrades .container .main .content .back.special .inner .top .upgrade_unit {
    margin: 5px auto;
}
#warZone #w_main .menu_upgrades .container .main .content .back.special .inner >.bottom {
    position: relative;
    float: left;

    width: 100%;
    height: 30%;
}
#warZone #w_main .menu_upgrades .container .main .content .back.special .inner .bottom >.inner {
    position: relative;

    width: calc(100% - 2 * 3px);
    height: calc(100% - 2 * 3px);

    margin: 3px;
}
#warZone #w_main .menu_upgrades .container .main .content .back.special .inner .bottom .stats {
    position: relative;

    width: 80%;
    height: 100%;

    font: 16px/16px 'titilliumWebSemiBold';
    color: black;
}
#warZone #w_main .menu_upgrades .container .main .content .back.special .inner .bottom .stats >span {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}
#warZone #w_main .menu_upgrades .container .main .content .back.special .inner .bottom .stats span {
    color: #c2b49b;
}
#warZone #w_main .menu_upgrades .container .main .content .back.special .inner .bottom .stats >.left {
    display: inline-block;
    width: 50%;
    padding: 0 5px;
    vertical-align: middle;
}
#warZone #w_main .menu_upgrades .container .main .content .back.upgrade {

    width: calc(100% - 5px);
    height: 106px;

    margin-top: 5px;

    background: linear-gradient(to bottom, #c2b49b 0%, #c2b49b 56%, #448967 56%, #448967 100%);
}
#warZone #w_main .menu_upgrades .container .main .content .back.upgrade >.left {
    position: relative;
    display: inline-block;

    width: calc(106px - 2 * 5px);

    margin: 5px;

    vertical-align: top;

    background: #96876b;
}
#warZone #w_main .menu_upgrades .container .main .content .back.upgrade >.right {
    position: relative;
    display: inline-block;

    width: calc(100% - 106px - 2 * 5px);
    height: calc(106px - 2 * 5px);

    margin: 5px;

    vertical-align: top;
}
#warZone #w_main .menu_upgrades .container .main .content .back.upgrade .right >.top {
    position: relative;

    height: 57%;

    font: 16px/20px 'titilliumWebRegular';
    color: black;
}
#warZone #w_main .menu_upgrades .container .main .content .back.upgrade .right >.bottom {
    position: relative;

    height: 43%;
}
#warZone #w_main .menu_upgrades .container .main .content .back.upgrade .right .bottom .stats {
    position: relative;

    width: 80%;
    height: 100%;

    font: 16px/16px 'titilliumWebSemiBold';
    color: black;
}
#warZone #w_main .menu_upgrades .container .main .content .back.upgrade .right .bottom .stats >span {
    display: inline-block;

    height: 100%;

    vertical-align: middle;
}
#warZone #w_main .menu_upgrades .container .main .content .back.upgrade .right .bottom .stats span {
    color: #c2b49b;
}
#warZone #w_main .menu_upgrades .container .main .content .back.upgrade .right .bottom .stats >.left {
    display: inline-block;

    width: 50%;

    vertical-align: middle;
}
#warZone #w_main .menu_upgrades .container .main .content .back.upgrade .right .bottom .stats >.right {
    display: inline-block;

    width: 50%;

    vertical-align: middle;
}
#warZone #w_main .menu_upgrades .container .main .content .back.upgrade .right .top .cost {
    position: absolute;
    display: inline-block;

    bottom: 8px;
    right: 25px;

    font: 16px/16px 'titilliumWebRegular';
    color: black;
    text-align: right;
}
#warZone #w_main .menu_upgrades .container .main .content .back.upgrade .upgrade-peak {
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.6);
    position: absolute;
    left: 0;
    top: 0;
}
#warZone #w_main .menu_left {
    position: absolute;

    top: 0;
    left: 0;

    width: 165px;
    height: calc(310px - 40px);

    background: #c2b49b;
	
	box-shadow: 1px 2px 3px rgba(0,0,0,0.5);

    animation: anim_m_left_a 1.0s ease-out;
}
#warZone #w_main .menu_left .fighting-for{
    text-align:center;
    background-color:#7a736c;
    height:50px;
}
/*
#warZone #w_main .menu_left .rank-holder-big{
    padding:7px;
    background-color:#b8ac86;
}
#warZone #w_main .menu_left .rank-holder-big .animated-ranks{
    height:110px;
    overflow:hidden;
    position:relative;
    margin-top: 0px;
}
#warZone #w_main .menu_left .rank-holder-big .animated-ranks .animated-holder{
    position:absolute;
    top:-50px;
    left:7px;
    width:100%;
}
#warZone #w_main .menu_left .rank-holder-big .animated-ranks .animated-holder.show {
    animation-duration: 2s;
    animation-iteration-count: 1;
    animation-name: anim_slide_ranks_down;
    animation-timing-function: ease-in-out;
}
#warZone #w_main .menu_left .rank-holder-big .animated-ranks .animated-holder > div{
    position: relative;
}
#warZone #w_main .menu_left .rank-holder-big .animated-ranks .animated-holder .ranks-delimiter{
    margin-top:-34px;
    margin-left: 10px;
    width: 133px;
    color: lightgray;
}
#warZone #w_main .menu_left .rank-holder-big .animated-ranks .animated-holder > div:nth-of-type(1) hr{
    opacity:0;
}
#warZone #w_main .menu_left .rank-holder-big .animated-ranks .animated-holder > div:nth-of-type(3) hr{
    opacity:0;
}
#warZone #w_main .menu_left .rank-holder-big .animated-ranks #circle1{
    position: absolute;
    margin-top:20px;
    margin-left:2px;
    width: 10px;
    height: 10px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background: white;
}
#warZone #w_main .menu_left .rank-holder-big .animated-ranks #circle2{
    position: absolute;
    margin-top: 75px;
    margin-left: 2px;
    width: 10px;
    height: 10px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background: white;
}
#warZone #w_main .menu_left .rank-holder-big .animated-ranks #circle2.show {
    animation-duration: 1s;
    animation-iteration-count: 3;
    animation-name: anim_circle_slide_up;
    animation-timing-function: ease-in-out;
}
#warZone #w_main .menu_left .rank-holder-big .animated-ranks .next-next-rank{
    height: 50px;
    opacity: 0.5;
}
#warZone #w_main .menu_left .rank-holder-big .animated-ranks .next-rank{
    height: 50px;
    margin: 5px 0;
    opacity: 0.5;
}
#warZone #w_main .menu_left .rank-holder-big .animated-ranks .current-rank{
    height: 50px;
}
#warZone #w_main .menu_left .rank-holder-big .animated-ranks .username{
    height: 18px;
    width: 80px;
    position: absolute;
    left: 62px;
    top: 11px;
    font-size: 13px;
}
#warZone #w_main .menu_left .rank-holder-big .animated-ranks .usernameNext{
    height:18px;
    width: 80px;
    position: absolute;
    left: 62px;
    top: 11px;
    font-size: 13px;
}
#warZone #w_main .menu_left .rank-holder-big .animated-ranks .usernameNextNext{
    height:18px;
    width:80px;
    position:absolute;
    left:62px;
    top:11px;
    font-size:13px;
}
#warZone #w_main .menu_left .rank-holder-big .ranks-all{
    background-color:#3b4c3d;
    height:20px;
    text-align:center;
    border-radius:5px;
    border: 1px solid #6a5b40;
    line-height:17px;
}
#warZone #w_main .menu_left .rank-holder-big .ranks-all:hover{
    border-color: white;
}
#warZone #w_main .menu_left .rank-holder-big .ranks-all .text{
    color:white;
    font-family: 'titilliumWebBold';
    font-size:10px;
}



#warZone #w_main .menu_left .level-holder-big{
    padding:5px;
    background-color:#d6d6d6;

    height:48px;
}
*/

#warZone #w_main .menu_left .font_a {
    font-family: 'titilliumWebRegular';
    font-size: 12px;
    line-height: 16px;
    text-align: left;

    color: black;
}
#warZone #w_main .menu_left .font_a.info {
    position: relative;
    font-family: 'titilliumWebRegular';
    font-size:13px;
    vertical-align:middle;
    left: -21px;
    top: 15px;
    color:white;

}
#warZone #w_main .menu_left .font_a.rank {
    width: 100%;
    background-color:pink;
    left: 20px;
    top: 108px;
    text-align: left;
}
#warZone #w_main .menu_left .font_a.rank_name {
    width: 100%;
    position: relative;
    font-size: 12px;
    margin-left: 10px;
    top: -7px;
}
#warZone #w_main .menu_left .font_a.next_rank_name {
    width: 100%;
    position:relative;
    font-size:12px;
    top:-37px;
    margin-left:10px;
}
#warZone #w_main .menu_left .font_a.next_next_rank_name {
    position: relative;
    width: 100%;
    font-size:12px;
    top: -37px;
    margin-left:10px;
    text-align: left;
}
#warZone #w_main .menu_left .font_a.level {
    margin-bottom: 4px;
    left: 20px;
    top: 145px;
}
#warZone #w_main .menu_left .font_a.fuel {
    left: 20px;
    top: 200px;
}
#warZone #w_main .menu_left .bar {
    height: 29px;

    border-radius: 12px;
    border: 1px solid #BDBDBD;

    background: white;

    overflow: hidden;
    transform-origin: 0 50%;
}
#warZone #w_main .menu_left .bar .bar_fill {
     position: absolute;
     left:9px;
     top: -75px;
     width:133px;
     height: 150px;

     background: #3b4c3d;

     transform-origin: 0 50%;
     transform: rotate(30deg);
}

#warZone #w_main .menu_left .bar .bar_fill.level {
    position: absolute;
    left:9px;
    top: -80px;
    width:138px;
    height: 150px;

    background: #3b4c3d;

    transform-origin: 0 50%;
    transform: rotate(30deg);
}
#warZone #w_main .menu_left .bar .bar_text {
    position: relative;
    font: 12px/29px 'titilliumWebSemiBold';
    text-align: center;

    color: #ffffff;

    text-shadow: 1px 1px 0 #3b4c3d, -1px 1px 0 #3b4c3d, 1px -1px 0 #3b4c3d, -1px -1px 0 #3b4c3d, 1px 0 0 #3b4c3d, 0 1px 0 #3b4c3d, -1px 0 0 #3b4c3d, 0 -1px 0 #3b4c3d;
}
#warZone #w_main .menu_left .bar.rank {
    position: relative;

    height: 21px;
}
#warZone #w_main .menu_left .bar.rank .bar_fill {
    top: -85px;
}
#warZone #w_main .menu_left .bar.fuel .bar_fill {
}
#warZone #w_main .menu_left .bar.level .bar_fill {
}
#warZone #w_main .menu_left .bar.level {
    position: relative;

    height: 25px;
}
#warZone #w_main .menu_left .bar.fuel {
    left: 15px;
    top: 217px;
}
#warZone #w_main .menu_left .rank_text {
    position: absolute;
    display: none;

    left: 30px;
    top: 110px;

    font: 18px/18px 'titilliumWebRegular';

    color: white;

    text-shadow: 1px 1px 0 black, -1px 1px 0 black, 1px -1px 0 black, -1px -1px 0 black, 1px 0 0 black, 0 1px 0 black, -1px 0 0 black, 0 -1px 0 black;

    transform-origin: 0% 150%;
}
#warZone #w_main .menu_left .level_text {
    position: absolute;
    display: none;

    left: 30px;
    top: 150px;

    font: 18px/18px 'titilliumWebRegular';

    color: white;

    text-shadow: 1px 1px 0 black, -1px 1px 0 black, 1px -1px 0 black, -1px -1px 0 black, 1px 0 0 black, 0 1px 0 black, -1px 0 0 black, 0 -1px 0 black;

    transform-origin: 0% 150%;
}
#warZone #w_main .menu_left .btn_profile {
    position: absolute;

    left: 30px;
    bottom: 15px;

    width: calc(80px * 1.25);
    height: 24px;
    font: 13px/24px 'titilliumWebSemiBold';
    color: white;
    text-align: center;

    border-radius: 12px;
    border: 1px solid #6a5b40;

    background: #96876b;
}
/*not used anymore*/
/*#warZone #w_main .menu_left .btn_profile:hover {*/
    /*border-color: white;*/
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
/*}
#warZone #w_main .menu_right {
    position: absolute;

    top: 0;
    right: 0;

    width: 165px;
    height: calc(310px - 40px);

    background: #b8ac86;

    box-shadow: 1px 2px 3px rgba(0,0,0,0.5);

    animation: anim_m_right_a 1.0s ease-out;
}
#warZone #w_main .menu_right .bar {
    position:relative;
    height: 26px;

    border-radius: 12px;
    border: 1px solid #BDBDBD;

    background: white;

    overflow: hidden;
    transform-origin: 0 50%;
}
#warZone #w_main .menu_right .bar .bar_fill {
    position: absolute;
    left: -130px;
    top: -75px;
    width:133px;
    height: 150px;

    background: #3b4c3d;

    transform-origin: 0 50%;
    transform: rotate(30deg);
}

#warZone #w_main .menu_right .bar .bar_fill.fuel {
    position: absolute;
    left: -130px;
    top: -78px;

    width:135px;
    height: 150px;

    background: #3b4c3d;

    transform-origin: 0 50%;
    transform: rotate(30deg);
}
#warZone #w_main .menu_right .bar .bar_text {
    position: relative;

    font: 12px/27px 'titilliumWebSemiBold';
    text-align: center;

    color: #ffffff;

    text-shadow: 1px 1px 0 #3b4c3d, -1px 1px 0 #3b4c3d, 1px -1px 0 #3b4c3d, -1px -1px 0 #3b4c3d, 1px 0 0 #3b4c3d, 0 1px 0 #3b4c3d, -1px 0 0 #3b4c3d, 0 -1px 0 #3b4c3d;
}
#warZone #w_main .menu_right .bar.fuel {
    position: relative;
}
#warZone #w_main .menu_right .font_a.fuel {
    font: 11px/15px 'titilliumWebSemiBold';
}
#warZone #w_main .menu_right .inner-holder{
    padding:7px;
}
#warZone #w_main .menu_right .fuel-holder{
    margin-top:8px;
    background-color:#d6d6d6;
    padding: 3px 7px 12px 7px;
}
#warZone #w_main .menu_right .top {
    position: relative;
    width: 100%;
}
#warZone #w_main .menu_right .h_line {
    position: relative;

    width: calc(100% - 2 * 15px);
    height: 1px;

    margin-left: 15px;
    margin-bottom: -1px;

    background: #ed1c24;
}
#warZone #w_main .menu_right .bottom {
    position: relative;
    width: 100%;
    height: 60%;
}
#warZone #w_main .menu_right .icons {
    position: relative;
    display: inline-block;

    margin-left: -43%;

    width: 143%;
    height: 100%;
}
#warZone #w_main .menu_right .icons .icon {
    position: relative;
    float: left;
    margin: 7px;

    width: 55px;
    height: 40px;

    border-radius: 12px;

    background: url("../images/warZone/menu_top_icons.png") 0 0, white;

    font: 14px/18px 'titilliumWebSemiBold';
    color: white;
    text-align: center;

    text-shadow: 1px 1px 0 #3b4c3d, -1px 1px 0 #3b4c3d, 1px -1px 0 #3b4c3d, -1px -1px 0 #3b4c3d, 1px 0 0 #3b4c3d, 0 1px 0 #3b4c3d, -1px 0 0 #3b4c3d, 0 -1px 0 #3b4c3d;
}
#warZone #w_main .menu_right .icons .icon >span.unlock {
    position: absolute;
    display: none;

    margin: 0;
    left: 0;
    top : 0;

    width: 55px;
    height: 40px;

    background: url("../images/warZone/unlock.png");

    cursor: url("public_html/assets/images/cursorPointer.ico"), pointer;
    cursor: url("../images/cursorPointer.ico") 11 1, pointer;
}

#warZone #w_main .menu_right .icons .icon:hover {
    cursor: url("public_html/assets/images/cursorPointer.ico"), pointer;
    cursor: url("../images/cursorPointer.ico") 11 1, pointer;
    opacity:0.7;
}

#warZone #w_main .menu_right .icons .icon.disabled {
    background-position-y: -80px;
}
#warZone #w_main .menu_right .icons .icon.transparent {
    opacity: 0.0;
    pointer-events: none;
}
#warZone #w_main .menu_right .icons .icon.wheel {
    background-position-x: calc(0px - 5 * 55px);
    left:-20px;
}
#warZone #w_main .menu_right .icons .icon.wheel:hover {
    border: none;
}
#warZone #w_main .menu_right .icons .icon.rewards {
    background-position-x: calc(0px - 4 * 55px);
    left:-20px;
}
#warZone #w_main .menu_right .icons .icon.rewards:hover {
    border: none;
    cursor: url("public_html/assets/images/cursorPointer.ico"), pointer;
    cursor: url("../images/cursorPointer.ico") 11 1, pointer;
}
#warZone #w_main .menu_right .icons .icon.attack {
    background-position-x: calc(0px - 0 * 55px);
}
#warZone #w_main .menu_right .icons .icon.defend {
    background-position-x: calc(0px - 1 * 55px);
}
#warZone #w_main .menu_right .icons .icon.tc {
    background-position-x: calc(0px - 3 * 55px);
}
#warZone #w_main .menu_right .icons .icon.invasion {
    background-position-x: calc(0px - 7 * 55px);
}
#warZone #w_main .menu_right .btn_buy {
    margin-top:8px;
    height:32px;

    border-radius: 5px;
    border: 1px solid #6a5b40;
    background: #3b4c3d;

    font: 13px/29px 'titilliumWebSemiBold';
    color: white;
    text-align: center;
}
#warZone #w_main .menu_right .btn_buy:hover {
    border-color: white;

    cursor: url("public_html/assets/images/cursorPointer.ico"), pointer;
    cursor: url("../images/cursorPointer.ico") 11 1, pointer;
}
#warZone #w_main .menu_right .btn_buy.achievements {
    bottom: calc(2 * (31px + 12px) + 15px);
}
#warZone #w_main .menu_right .btn_buy.refer {
    bottom: calc(1 * (31px + 12px) + 15px);
}
#warZone #w_main .menu_right .font_fly {
    font: 120px/120px 'titilliumWebRegular';
    text-align: center;
    z-index: 920;
    letter-spacing: 1px;

    color: black;
    position: absolute;
    opacity: 0;

    width: 65px;

    right: 138px;
    text-shadow: 0 0 32px #f6b673, 0 0 32px #f6b673, 0 0 32px #f6b673;
    transform-origin: 250% 150%;
    pointer-events: none;
}
#warZone #w_main .menu_right .font_fly.bronze {
    top: -115px;
    right: 108px;

    color: #f6b673;
}
#warZone #w_main .menu_right .font_fly.golden {
    top: -55px;
    right: 118px;

    color: #ffdd64;
}
*/

/*not used anymore*/
/*
#warZone .menu_unlock {
    position: absolute;
    display: none;
    top: 7px;

    width: 180px;
    height: 190px;

    background:#b8ac86;

    box-shadow: 1px 2px 3px rgba(0,0,0,0.5);
}
#warZone .menu_unlock.def {
    right: 170px;
}
#warZone .menu_unlock.def .get_more:hover {
    text-shadow: 1px 1px 0 white, -1px 1px 0 white, 1px -1px 0 white, -1px -1px 0 white, 1px 0 0 white, 0 1px 0 white, -1px 0 0 white, 0 -1px 0 white;
    cursor: url("public_html/assets/images/cursorPointer.ico"), pointer;
    cursor: url("../images/cursorPointer.ico") 11 1, pointer;
}
#warZone .menu_unlock.tc {
    right: 170px;
}
#warZone .menu_unlock.tc .get_more:hover {
    text-shadow: 1px 1px 0 white, -1px 1px 0 white, 1px -1px 0 white, -1px -1px 0 white, 1px 0 0 white, 0 1px 0 white, -1px 0 0 white, 0 -1px 0 white;

    cursor: url("public_html/assets/images/cursorPointer.ico"), pointer;
    cursor: url("../images/cursorPointer.ico") 11 1, pointer;
}
#warZone .menu_unlock.money {
    right: 170px;
}
#warZone .menu_unlock .inner {
    position: relative;

    margin: 8px;

    width: calc(100% - 16px);
}
#warZone .menu_unlock .inner .yes {
    position: relative;
    display: inline-block;

    float: left;

    margin-top: 5px;
    margin-left: 50px;

    width: 27px;
    height: 27px;

    background: url('../images/warZone/wc_yes_no.png');

    transform: scale(0.8);
}
#warZone .menu_unlock .inner .yes:hover {
    transform: scale(1.0);
    cursor: url("public_html/assets/images/cursorPointer.ico"), pointer;
    cursor: url("../images/cursorPointer.ico") 11 1, pointer;
}
#warZone .menu_unlock .inner .no {
    position: relative;
    display: inline-block;

    float: left;

    margin-top: 5px;
    margin-left: 10px;

    width: 27px;
    height: 27px;

    background: url('../images/warZone/wc_yes_no.png') -27px 0;

    transform: scale(0.8);
}
#warZone .menu_unlock .inner .no:hover {
    transform: scale(1.0);

    cursor: url("public_html/assets/images/cursorPointer.ico"), pointer;
    cursor: url("../images/cursorPointer.ico") 11 1, pointer;
}
#warZone .menu_unlock .inner .text_a {
    position: relative;

    width: 100%;
    font: 16px/22px 'titilliumWebRegular';
    color: black;

    text-align: center;
}
#warZone .menu_unlock .inner .bar {
    margin-left: 28px;
    width: calc(100% - 56px);
    height: 29px;
    border-radius: 12px;

    background: #96876a;
}
#warZone .menu_unlock .inner .bar .white_box {
    float: left;

    margin-top: 1px;
    margin-left: 1px;
    width: 27px;
    height: 27px;

    border-radius: 12px;
    background: #ffffff;
}
#warZone .menu_unlock .inner .bar .white_box .coins {
    display: inline-block;

    margin-top: 4px;
    margin-left: 4px;
    width: 21px;
    height: 20px;

    background: url("../images/value_icon.png");
}
#warZone .menu_unlock .inner .bar .text_b {
    float: right;

    margin-right: 10px;

    font: 16px/29px 'titilliumWebRegular';
    font-weight: bold;
    color: black;
}
#warZone .menu_unlock .inner .text_c {
    position: relative;

    width: 100%;

    font: 12px/18px 'titilliumWebRegular';
    color: black;

    text-align: center;
}
#warZone .menu_unlock .inner .image {
    position: relative;

    margin-left: 40px;
    margin-top: -24px;
    margin-bottom: 24px;

    width: 100px;
    height: 100px;

    background: url("../images/shop/shop_gold.png") -100px 0;
}
*/

#warZone #w_main .menu_soldier {
    position: relative;
    top: calc(315px - 40px);
    left: 0;

    width: 165px;
    height: 160px;

    background:#FFFFFF;
    box-shadow: 1px 2px 3px rgba(0,0,0,0.5);
    animation: anim_m_left_a 1.0s ease-out;
}
#warZone #w_main .menu_soldier > div:not(:first-child) {
    display: none;
}
#warZone #w_main .menu_soldier .cloud {
    position: absolute;

    top: -10px;
    left: 160px;

    width: 159px;
    height: 170px;

    background: url('../images/warZone/wc_cloud.png');
}
#warZone #w_main .menu_soldier .cloud .inner_text {
    position: relative;
    margin: 8px;
    width: 153px;
}
/*se en uporablaj več slosumo recheck*/
#warZone #w_main .menu_soldier .cloud .yes {
    position: relative;
    display: inline-block;

    float: left;
    margin-top: 5px;
    margin-left: 40px;

    width: 27px;
    height: 27px;

    background: url('../images/warZone/wc_yes_no.png');
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
}
#warZone #w_main .menu_soldier .cloud .no {
    position: relative;
    display: inline-block;
    float: left;

    margin-top: 5px;
    margin-left: 20px;

    width: 27px;
    height: 27px;
    background: url('../images/warZone/wc_yes_no.png') -27px 0;
    /*se en uporablaj več slosumo recheck*/
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
}
#warZone #w_main .menu_soldier .soldier {
    position: relative;
    width: 100%;
    height: 100%;

    background: #7a736c;
    overflow: auto;
}
#warZone #w_main .menu_soldier .soldier .inner {
    position: relative;

    width: calc(100% - 2 * 8px);
    height: calc(100% - 2 * 8px);
    margin: 8px;
    background:white;
}
#warZone #w_main .menu_soldier .soldier .inner .image {
    position: absolute;

    margin-left: -2px;
    margin-top: 8px;

    width: 149px;
    height: 132px;
    background: url('../images/warZone/wc_soldier.png');
}
#warZone #w_main .menu_soldier .soldier .inner .image2 {
    position: absolute;
    margin-left: -2px;
    margin-top: 8px;

    width: 149px;
    height: 132px;
    background: url('../images/warZone/wc_soldier_empty.png');
}
#warZone #w_main .menu_soldier .soldier .inner_text {
    position: absolute;
    margin: 50px 8px;
    width: 129px;
}
#warZone #w_main .menu_soldier .mission {
    position: absolute;
    top: 0;

    width: 100%;
    height: 100%;
    background:white;

    overflow: auto;
}
#warZone #w_main .menu_soldier .mission .inner {
    position: relative;
    display: inline-block;

    width: calc(100% - 2 * 8px);
    height: calc(100% - 2 * 8px);
    margin: 8px;

    background:#FFFFFF;
}
#warZone #w_main .menu_soldier .mission .inner .text_a {
    position: relative;

    width: 100%;
    font: 16px/22px 'titilliumWebRegular';
    color: black;

    text-align: center;
}
#warZone #w_main .menu_soldier .mission .inner .bar {
    height: 29px;

    border-radius: 12px;
    border: 1px solid #BDBDBD;
    background: white;
    overflow: hidden;
}
#warZone #w_main .menu_soldier .mission .inner .bar .bar_fill {
    position: absolute;
    left:-146px;
    top: -80px;

    width: 133px;
    height: 150px;

    background: #3b4c3d;
    transform-origin: 0 50%;
    transform: rotate(30deg);
}
#warZone #w_main .menu_soldier .mission .inner .bar .bar_text {
    position: relative;

    font: 12px/25px 'titilliumWebSemiBold';
    text-align: center;
    color: #ffffff;
    text-shadow: 1px 1px 0 #3b4c3d, -1px 1px 0 #3b4c3d, 1px -1px 0 #3b4c3d, -1px -1px 0 #3b4c3d, 1px 0 0 #3b4c3d, 0 1px 0 #3b4c3d, -1px 0 0 #3b4c3d, 0 -1px 0 #3b4c3d;

}
#warZone #w_main .menu_soldier .mission .inner .bar.progress {
    position: relative;
    height: 25px;

    margin-top: 5px;
    margin-bottom: 3px;
}
#warZone #w_main .menu_soldier .reward {
    position: relative;
    width: 100%;
    height: 100%;
    background:#FFFFFF;
    overflow: auto;
}
#warZone #w_main .menu_soldier .reward .inner {
    position: relative;
    display: inline-block;

    width: calc(100% - 2 * 8px);
    height: calc(100% - 2 * 8px);

    margin: 8px;
}
#warZone #w_main .menu_soldier .text_a {
    position: relative;

    width: 100%;
    font: 16px/22px 'titilliumWebRegular';
    color: black;

    text-align: center;
}
#warZone #w_main .menu_soldier .reward .inner .button {
    width: 140px;
    height:32px;

    margin-top: 16px;
    margin-left: 5px;
    border-radius: 5px;

    background: #3b4c3d;

    font: 13px/29px 'titilliumWebBold';
    color: white;
    text-align: center;
}
/*sploh ne obstaja več*/
#warZone #w_main .menu_soldier .reward .inner .button:hover {
    cursor: url("public_html/assets/images/cursorPointer.ico"), pointer;
    cursor: url("../images/cursorPointer.ico") 11 1, pointer;
}
/*sploh ne obstaja več*/
/*
#warZone #w_main .menu_tutorial {
    display: none;
    position: absolute;

    top: calc(315px - 40px);

    width: 165px;
    height: 160px;

    background: #c2b49b;
    box-shadow: 1px 2px 3px rgba(0,0,0,0.5);
    animation: anim_m_left_a 1.0s ease-out;
}
#warZone #w_main .menu_tutorial .tutorial-cloud {
    position: absolute;
    padding-bottom: 5px;
    z-index: 1020;

    bottom: 0px;
    left: 160px;

    width: 179px;
    height: auto;
    background: url('../images/warZone/wc_cloud.png');
    background-size: 100% 100%;
}
#warZone #w_main .menu_tutorial .tutorial-cloud .inner_text {
    position: relative;

    margin: 8px 10px 8px 14px;
    width: 160px;
}
#warZone #w_main .menu_tutorial .tutorial-cloud .got-it {
    text-align: center;
    margin-top: 5px;
    display: inline-block;
    float: right;
}
#warZone #w_main .menu_tutorial .tutorial-cloud .got-it:hover div {
    transform: scale(1);
    cursor: url("public_html/assets/images/cursorPointer.ico"), pointer;
    cursor: url("../images/cursorPointer.ico") 11 1, pointer;
}
#warZone #w_main .menu_tutorial .tutorial-cloud .got-it span {
    position: relative;
    font: 16px/18px 'titilliumWebRegular';
    color: #004422;

    text-align: center;
}
#warZone #w_main .menu_tutorial .tutorial-cloud .got-it div {
    display: inline-block;
    vertical-align: middle;
    margin-left: 0px;

    width: 27px;
    height: 27px;

    background: url('../images/warZone/wc_yes_no.png');
    transform: scale(0.8);
}
#warZone #w_main .menu_tutorial .tutorial-cloud .hide-tutorial {
    text-align: center;
    margin-top: 5px;
    display: inline-block;
    margin-left: 15px;
}
#warZone #w_main .menu_tutorial .tutorial-cloud .hide-tutorial:hover div {
    transform: scale(0.8);

    cursor: url("public_html/assets/images/cursorPointer.ico"), pointer;
    cursor: url("../images/cursorPointer.ico") 11 1, pointer;
}
#warZone #w_main .menu_tutorial .tutorial-cloud .hide-tutorial span {
    position: relative;
    font: 12px/14px 'titilliumWebRegular';
    color: #ed1c24;

    text-align: center;
}
#warZone #w_main .menu_tutorial .tutorial-cloud .hide-tutorial div {
    display: inline-block;
    vertical-align: middle;
    margin-left: 0px;

    width: 27px;
    height: 27px;

    background: url('../images/warZone/wc_yes_no.png') -27px 0;
    transform: scale(0.6);
}
#warZone #w_main .menu_tutorial .text_a {
    position: relative;

    width: 100%;

    font: 16px/22px 'titilliumWebRegular';
    color: black;

    text-align: center;
}
#warZone #w_main .menu_tutorial .text_a:nth-of-type(1) {
    font-weight: 700;
}
#warZone #w_main .menu_tutorial .soldier {
    position: relative;
    display: inline-block;
    width: 100%;
    height: 100%;
}
#warZone #w_main .menu_tutorial .soldier .inner {
    position: relative;

    width: calc(100% - 2 * 8px);
    height: calc(100% - 2 * 8px);

    margin: 8px;

    background: #c2b49b;
}
#warZone #w_main .menu_tutorial .soldier .inner .image {
    position: absolute;

    margin-left: -2px;
    margin-top: 8px;

    width: 149px;
    height: 132px;
    background: url('../images/warZone/wc_soldier.png');
}
*/



#flag_holder  {
    position: relative;
    vertical-align:middle;
    left: 115px;
    top: -9px;
}
.flag_inline {
    display:inline-block;
}
.ach_reward .img{
    display: inline-block;
    background: url("../images/warZone/battle_star.png") -48px 0;
    vertical-align: middle;
    margin-top: -3px;

    width: 24px;
    height: 38px;
    transform: scale(0.5);
}
.ach_progress {
    display: inline-block;
    float: right;
    margin-top: 10px;
    margin-right: 10px;
}
#warZone #w_main .center_attack {
    position: absolute;

    left: 310px;
    top: 88px;

    width: 400px;
    height: 320px;
    backface-visibility: hidden;
}
#warZone #w_main .center_attack .overflow {
    position: absolute;

    left: 0;
    top: 0;
    width: 375px;
    height: 300px;
    border-radius: 50% 50%;
    overflow: hidden;
}
#warZone #w_main .center_attack .bg {
    position: absolute;

    left: -12px;
    top: -10px;

    width: 400px;
    height: 320px;
}
#warZone #w_main .center_attack .info {
    position: absolute;

    left: 200px;
    top: -20px;

    width: 181px;
    height: 58px;

    background: url("../images/warZone/center_info.png");
    font: 20px/48px 'titilliumWebBold';
    text-align: center;

    color: white;
}
#warZone #w_main .center_attack .click {
    position: absolute;
    left: -6px;
    top: 0;

    width: 380px;
    height: 300px;

    border-radius: 50% 50%;
    cursor: none;
}
#warZone #w_main .center_attack .line {
    position: absolute;

    left: -12px;
    top: -10px;

    width: 400px;
    height: 320px;
    background: url("../images/warZone/center_line.png");
}
#warZone #w_main .center_attack .bar {
    width: 112px;
    height: 29px;

    border-radius: 16px;
    border: 2px solid #ed1c24;

    background: white;

    overflow: hidden;

    transform-origin: 0 50%;
    transform: scaleX(1.25);
}
#warZone #w_main .center_attack .bar_shadow {
    width: 112px;
    height: 29px;

    border-radius: 16px;

    margin-top: 4px;

    box-shadow: 0 6px 2px rgba(0,0,0,0.25);

    transform-origin: 0 50%;
    transform: rotate(-4deg) scaleX(1.25);
}
#warZone #w_main .center_attack .bar .bar_fill {
    position: absolute;

    left: -125px;
    top: -75px;

    width: 112px;
    height: 150px;

    background: #ed1c24;

    transform-origin: 0 50%;
    transform: rotate(30deg);

/*    transition: left 0.25s ease-out;*/
}
#warZone #w_main .center_attack .bar .bar_text {
    position: relative;

    font: 14px/29px 'titilliumWebBold';
    text-align: center;

    color: #ffffff;

    text-shadow: 1px 1px 0 #ed1c24, -1px 1px 0 #ed1c24, 1px -1px 0 #ed1c24, -1px -1px 0 #ed1c24, 1px 0 0 #ed1c24, 0 1px 0 #ed1c24, -1px 0 0 #ed1c24, 0 -1px 0 #ed1c24;

    transform: scaleX(0.8);
}
#warZone #w_main .center_attack .bar.health, #warZone #w_main .center_attack .bar_shadow.health {
    position: absolute;
    left: 10px;
    top: 6px;
}
#warZone #w_main .center_defend {
    position: absolute;
    display: none;

    left: 310px;
    top: 88px;

    width: 375px;
    height: 300px;
    backface-visibility: hidden;
    transform: rotateY(180deg);
}
#warZone #w_main .center_defend .overflow {
    position: absolute;

    left: 0;
    top: 0;

    width: 375px;
    height: 300px;

    border-radius: 50% 50%;
    overflow: hidden;
}
#warZone #w_main .center_defend .bg {
    position: absolute;

    left: -12px;
    top: -10px;

    width: 400px;
    height: 320px;
}
#warZone #w_main .center_defend .info {
    position: absolute;

    left: 200px;
    top: -20px;

    width: 181px;
    height: 58px;

    background: url("../images/warZone/def_center_info.png");
    font: 20px/48px 'titilliumWebBold';
    text-align: center;

    color: white;
}
#warZone #w_main .center_defend .click {
    position: absolute;

    left: -6px;
    top: 0;

    width: 380px;
    height: 300px;

    border-radius: 50% 50%;

    cursor: none;
}
#warZone #w_main .center_defend .line {
    position: absolute;

    left: -12px;
    top: -10px;

    width: 400px;
    height: 320px;

    background: url("../images/warZone/def_center_line.png");
}
#warZone #w_main .center_defend .center_text {
    position: absolute;

    width: 96%;

    margin: 100px 3% 0 3%;

    font: 36px/40px 'titilliumWebBold';
    text-align: center;

    letter-spacing: 1px;

    color: white;

    text-shadow: 0 0 12px #13528c, 0 0 12px #13528c;
}
#warZone #w_main .center_defend .def_timer {
    position: absolute;

    left: 330px;
    top: 20px;

    width: 117px;
    height: 115px;

    background: url("../images/warZone/center_defend_timer.png");
}
#warZone #w_main .center_defend .def_timer .text {
    width: 90%;

    margin-left: 5px;

    font: 56px/90px 'titilliumWebBold';
    text-align: center;

    color: white;

    text-shadow: 0 0 12px #13528c, 0 0 12px #13528c, 0 0 12px #13528c, 0 0 12px #13528c;
}
#warZone #w_main .center_defend .timer_info {
    position: absolute;

    width: 150px;

    left: 375px;
    top: 125px;

    font: 16px/18px 'titilliumWebBold';
    text-align: center;

    text-transform: uppercase;

    color: white;

    text-shadow: 1px 1px 0 black, -1px 1px 0 black, 1px -1px 0 black, -1px -1px 0 black, 1px 0 0 black, 0 1px 0 black, -1px 0 0 black, 0 -1px 0 black,
    0 0 6px white, 0 0 6px white, 0 0 6px white, 0 0 6px white, 0 0 6px white, 0 0 6px white, 0 0 6px white, 0 0 6px white;

    animation: anim_def_timer_info 1.0s linear infinite;
}
#warZone #w_main .center_defend .day_info {
    position: absolute;

    left: 85px;
    top: -77px;
	
	width: 200px;
	
	letter-spacing: -4px;

    font: 48px/46px 'titilliumWebBold';
    text-align: center;

    text-transform: uppercase;

    color: white;

    text-shadow: 1px 1px 0 black, -1px 1px 0 black, 1px -1px 0 black, -1px -1px 0 black, 1px 0 0 black, 0 1px 0 black, -1px 0 0 black, 0 -1px 0 black,
					1px 1px 2px rgba(0,0,0,0.5);
	
	transform: scaleX(0.5);
}
#warZone #w_main .center_defend .bar {
    width: 112px;
    height: 29px;

    border-radius: 16px;
    border: 2px solid #1d8eed;

    background: white;

    overflow: hidden;
    transform-origin: 0 50%;
    transform: scaleX(1.25);
}
#warZone #w_main .center_defend .bar_shadow {
    width: 112px;
    height: 29px;
    border-radius: 16px;

    margin-top: 4px;

    box-shadow: 0 6px 2px rgba(0,0,0,0.25);

    transform-origin: 0 50%;
    transform: rotate(-4deg) scaleX(1.25);
}
#warZone #w_main .center_defend .bar .bar_fill {
    position: absolute;

    left: -125px;
    top: -75px;

    width: 112px;
    height: 150px;

    background: #1d8eed;
    transform-origin: 0 50%;
    transform: rotate(30deg);
}
#warZone #w_main .center_defend .bar .bar_text {
    position: relative;

    text-align: center;
    font: 14px/29px 'titilliumWebBold';

    color: #ffffff;
    text-shadow: 1px 1px 0 #1d8eed, -1px 1px 0 #1d8eed, 1px -1px 0 #1d8eed, -1px -1px 0 #1d8eed, 1px 0 0 #1d8eed, 0 1px 0 #1d8eed, -1px 0 0 #1d8eed, 0 -1px 0 #1d8eed;

    transform: scaleX(0.8);
}
#warZone #w_main .center_defend .bar.health, #warZone #w_main .center_defend .bar_shadow.health {
    position: absolute;
    left: 10px;
    top: 6px;
}
#warZone #w_main .center_defend .bar.timer, #warZone #w_main .center_defend .bar_shadow.timer {
    position: absolute;
    left: 10px;
    top: 6px;
}
#warZone #w_main .unit_name {
    position: absolute;
    top: 240px;
    left: -10px;

    width: 100%;
    font: 14px/29px 'titilliumWebBold';
    color: black;
    text-align: center;

    text-shadow: -1px -1px 0 white, -1px 1px 0 white, 1px -1px 0 white, 1px 1px 0 white;
}
#warZone #w_main .unit_holder {
    position: absolute;
}
#warZone #w_main .unit {
    position: absolute;

    left: 50px;
    top: -440px;

    width: 290px;
    height: 290px;
    background: url('../images/warZone/unit.png');
}


#warZone #w_main .splash {
    position: absolute;

    width: 100px;
    height: 100px;

    background: url("../images/warZone/splash.png");

    pointer-events: none;
    opacity: 0;
}
#warZone #w_main .particle {
    position: absolute;

    width: 8px;
    height: 8px;

    pointer-events: none;

    border: 1px solid black;
}
#warZone #w_main .unit_part {
    position: absolute;

    width: 97px;
    height: 97px;
    pointer-events: none;
}
/*sploh ne obstaja več*/
/*
#warZone #w_main .menu_achievements {
    position: absolute;
    z-index: 900;
    width: 625px;
    height: 520px;

    left: 190px;
    top: -750px;

    background: #c2b49b;

    box-shadow: 0 0 5px black;
}
#warZone #w_main .menu_achievements .close {
    position: absolute;

    right: 11px;
    top: 11px;

    padding: 10px 8px 10px 12px;

    font: 24px/24px 'titilliumWebBold';
    text-align: center;
    line-height: 10px;

    letter-spacing: 3px;

    border-radius: 4px;

    background: #c2b49b;

    color: #231f20;

    box-shadow: 1px 1px 2px rgba(0,0,0,0.5);
}
#warZone #w_main .menu_achievements .close:hover {
    text-shadow: 0 0 8px #e6ded0, 0 0 8px #e6ded0, 0 0 12px #e6ded0, 0 0 12px #e6ded0;
    cursor: url("public_html/assets/images/cursorPointer.ico"), pointer;
    cursor: url("../images/cursorPointer.ico") 11 1, pointer;
}
#warZone #w_main .menu_achievements .head {
    margin: 8px;
    font: 38px/36px 'titilliumWebBold';
    text-align: center;
    letter-spacing: 1px;
    text-shadow: 1px 0 0 #96876b, 2px 0 0 #453a26;
    background: #96876b;
    color: #453a26;
    box-shadow: 1px 1px 2px rgba(0,0,0,0.5) inset;
}
#warZone #w_main .menu_achievements .head.progress {
    font-size: 28px;
    line-height: 36px;

    color: #453a26;

    background: #e6ded0;

    text-shadow: 1px 0 0 #e6ded0, 2px 0 0 #453a26;

    box-shadow: 1px 1px 2px rgba(0,0,0,0.5);
}
#warZone #w_main .menu_achievements .head.progress .bar {
    position: absolute;

    right: 12px;
    top: 56px;

    width: 200px;
    height: 24px;

    border: 2px solid #ed1c24;

    background: #e6ded0;

    overflow: hidden;

    box-shadow: 1px 1px 2px rgba(0,0,0,0.5), 1px 1px 2px rgba(0,0,0,0.5) inset;
}
#warZone #w_main .menu_achievements .head.progress .bar .bar_fill {
    position: absolute;

    top: -150px;

    width: 200px;
    height: 200px;

    background: #ed1c24;

    transform-origin: 0 50%;
    transform: rotate(30deg);
}
#warZone #w_main .menu_achievements .head.progress .bar .bar_text {
    position: relative;

    margin-right: 10px;
    text-align: right;
    font: 12px/24px 'titilliumWebBold';

    color: #ed1c24;

    text-shadow: 1px 1px 0 #e6ded0, -1px 1px 0 #e6ded0, 1px -1px 0 #e6ded0, -1px -1px 0 #e6ded0,
				1px 0 0 #e6ded0, 0 1px 0 #e6ded0, -1px 0 0 #e6ded0, 0 -1px 0 #e6ded0;
}
#warZone #w_main .menu_achievements .inner_scroll {
    width: 97%;
    height: 79.5%;

    margin: 0 1.5%;
	
	white-space: nowrap;

	overflow-y: scroll;
	overflow-x: visible;
}
#warZone #w_main .menu_achievements .arrow {
	position: relative;
	
	font: 78px/82px 'symbols';
	
	color: #e6ded0;
	
	text-shadow: -1px -1px 0 rgba(255,255,255,0.5), 1px -1px 0 rgba(128,128,128,0.5), -1px 1px 0 rgba(128,128,128,0.5), 1px 1px 0 rgba(0,0,0,0.5);
}
#warZone #w_main .menu_achievements .arrow:hover {
	text-shadow: -1px -1px 0 rgba(255,255,255,0.5), 1px -1px 0 rgba(128,128,128,0.5), -1px 1px 0 rgba(128,128,128,0.5), 1px 1px 0 rgba(0,0,0,0.5),
				0 0 8px white, 0 0 8px white;

    cursor: url("public_html/assets/images/cursorPointer.ico"), pointer;
    cursor: url("../images/cursorPointer.ico") 11 1, pointer;
}
*/


#warZone .barrel_vert {
    position: absolute;
    top: 200px;
    left: 450px;
}
/*se ne uporablja več */
/*#warZone .barrel_extra {*/
    /*cursor: url("public_html/assets/images/cursorPointer.ico"), pointer;*/
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
/*}*/
#warZone .gold_vert {
    position: absolute;

    top: 200px;
    left: 450px;
}
/*se ne uporablja več*/
/*#warZone .gold_extra {*/
    /*position: absolute;*/

    /*width: 100px;*/
    /*height: 100px;*/

    /*background: url("../images/shop/shop_gold.png") -200px 0;*/

    /*font: 48px/100px 'titilliumWebBold';*/
    /*text-align: center;*/

    /*color: white;*/

    /*text-shadow: 1px 1px 0 black, -1px 1px 0 black, 1px -1px 0 black, -1px -1px 0 black;*/

    /*cursor: url("public_html/assets/images/cursorPointer.ico"), pointer;*/
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
/*}*/

/*se ne uporablja*/
/*.get_gold_offer, .start_ads {*/
    /*cursor: url("public_html/assets/images/cursorPointer.ico"), pointer;*/
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
/*}*/
#warZone .rank_holder {
	width: 85px;
	height: 38px;
	background: url("../images/warZone/ranks.png") ;
}
#warZone .rank_holder.main {
    position:relative;
    left: -9px;
    transform: scale(0.55) rotate(180deg);
}
#warZone .rank_holder.next {
    position:relative;
    left: -9px;
    transform: scale(0.55) rotate(180deg);
}
#warZone .rank_holder.next-next {
    position:relative;
    left: -9px;
    transform: scale(0.55) rotate(180deg);
}
#warZone .req-score-diff {
    position:relative;
    top:-29px;
    left:77px;
    width: 70px;
    height: 30px;
    text-transform: uppercase;
    text-align: center;
    font: 9px/9px 'titilliumWebRegular';
}
#warZone .req-score-diff-next-next {
    position:relative;
    top:-29px;
    left:77px;
    width: 70px;
    height: 30px;
    text-transform: uppercase;
    text-align: center;
    font: 9px/9px 'titilliumWebRegular';
}
#warZone .rank_not_img {
    display: inline-block;
    vertical-align: middle;
    margin: 10px auto;
    width: 85px;
    height: 38px;
    background: url("../images/warZone/ranks.png");
}
/*se ne uporablja več*/
/*.double_dpc_icon {*/
    /*position: absolute;*/
    /*display: none;*/

    /*left: 173px;*/
    /*top: 8px;*/

    /*width: 90px;*/
    /*height: 90px;*/

    /*padding-bottom: 24px;*/

    /*background: url("../images/shop/shop_icons.png") 0 0 no-repeat, #ed1c24;*/

    /*box-shadow: 1px 2px 3px rgba(0,0,0,0.5);*/

    /*transform-origin: 0 0;*/
    /*transform: scale(0.733);*/

    /*cursor: url("public_html/assets/images/cursorPointer.ico"), pointer;*/
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
/*}*/
/*.double_dpc_icon >div {*/

    /*color: white;*/

    /*text-shadow: 0 0 1px black, 0 0 1px black, 0 0 1px black, 0 0 1px black;*/
    /*transform: scale(1.364);*/
    /*pointer-events: none;*/
/*}*/
/*.double_dpc_icon .amount {*/
    /*position: absolute;*/

    /*right: 5px;*/
    /*top: 3px;*/
    /*font: 24px/24px 'titilliumWebBold';*/
    /*text-align: right;*/

    /*transform-origin: 100% 0;*/
/*}*/
/*.double_dpc_icon .timer {*/
    /*position: absolute;*/

    /*left: 3px;*/
    /*bottom: 3px;*/

    /*width: 70%;*/

    /*font: 16px/16px 'titilliumWebSemiBold';*/
    /*text-align: center;*/

    /*transform-origin: 0 100%;*/
/*}*/
.double_dpc_info {
    position: absolute;
    display: none;

    font: 16px/16px 'titilliumWebSemiBold';
    text-align: left;
    color: white;

    text-shadow: 0 0 1px black, 0 0 1px black, 0 0 1px black, 0 0 1px black;
    pointer-events: none;
}
/* auto clicker */

/*#warZone #w_main #auto_clicker {*/
    /*position: absolute;*/
    /*right: 0;*/
    /*top: calc(315px - 45px);*/
    /*width: 165px;*/
    /*height: 160px;*/
    /*background: #ffffff;*/
    /*box-shadow: 1px 2px 3px rgba(0,0,0,0.5);*/
    /*animation: anim_m_right_a 1.0s ease-out;*/
    /*border-bottom: solid 5px red;*/
/*}*/
/*#warZone #w_main #auto_clicker >.inner {*/
    /*position: relative;*/
    /*text-align: center;*/
/*}*/
/*#warZone #w_main #auto_clicker .inner >.title {*/
    /*width: 100%;*/
    /*height: 52px;*/
    /*padding: 2px 0;*/
    /*background: url('../images/warZone/autoclicker.png') #ffffff no-repeat center;*/
/*}*/

/*#warZone #w_main #auto_clicker .inner >.title .text{*/
    /*color: white;*/
    /*position: relative;*/
    /*top: 16px;*/
    /*font-family: titilliumWebBold;*/
/*}*/

/*#warZone #w_main #auto_clicker .inner .padded-holder {*/
    /*padding: 0 7px;*/
/*}*/
/*#warZone #w_main #auto_clicker .inner .padded-holder >.status {*/
    /*width: 100%;*/

    /*font: 11px/30px 'titilliumWebRegular';*/
    /*text-align: center;*/

    /*background: #ffffff;*/
/*}*/
/*#warZone #w_main #auto_clicker .inner .padded-holder >.status.active {*/
    /*line-height: 20px;*/
/*}*/
/*#warZone #w_main #auto_clicker .inner .padded-holder .status >span {*/
    /*color: #ed1c24;*/
/*}*/
/*#warZone #w_main #auto_clicker .inner .padded-holder >.ac-enabled {*/
    /*position: relative;*/
    /*display: inline-block;*/

    /*width:100%;*/

    /*padding-top:5px;*/

    /*font: 12px/14px 'titilliumWebSemiBold';*/
    /*opacity: 0;*/
/*}*/
/*#warZone #w_main #auto_clicker .inner .padded-holder .ac-enabled >span {*/
    /*vertical-align: middle;*/
    /*margin-left: 18px;*/
    /*float: left;*/
/*}*/

/*#warZone #w_main #auto_clicker .inner .padded-holder .ac-enabled >span:first-of-type {*/
    /*margin-top: 5px;*/
/*}*/
/*#warZone #w_main #auto_clicker .inner .padded-holder .ac-enabled >span.switch {*/
    /*display: inline-block;*/
    /*float:right;*/

    /*width: 44px;*/
    /*height:25px;*/

    /*background: url('../images/warZone/wc_yes_no.png');*/

    /*transform: scale(0.85);*/
/*}*/
/*#warZone #w_main #auto_clicker .inner .padded-holder .ac-enabled >span.switch:hover {*/
    /*transform: scale(1.0);*/
/*}*/
/*#warZone #w_main #auto_clicker .inner .padded-holder .ac-enabled >span.switch:hover:not(.chosen) {*/
    /*cursor: url("public_html/assets/images/cursorPointer.ico"), pointer;*/
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
/*}*/
/*#warZone #w_main #auto_clicker .inner .padded-holder .ac-enabled >span.switch.chosen {*/
 /*}*/
/*#warZone #w_main #auto_clicker .inner .padded-holder .ac-enabled >span.switch.yes {*/
    /*background: url('../images/warZone/disable_enable.png')*/
/*}*/
/*#warZone #w_main #auto_clicker .inner .padded-holder .ac-enabled >span.switch.no {*/
    /*background: url('../images/warZone/disable_enable.png') 0 25px;*/
/*}*/
/*#warZone #w_main #auto_clicker .inner .padded-holder >.progress.bar {*/
    /*position: relative;*/

    /*margin: 0 auto;*/

    /*height:21px;*/

    /*border-radius: 16px;*/
    /*border: 1px solid #BDBDBD;*/

    /*background: white;*/

    /*overflow: hidden;*/
/*}*/
/*#warZone #w_main #auto_clicker .inner .padded-holder .progress.bar >.bar_fill {*/
    /*position: absolute;*/

    /*left: -114px;*/
    /*top:-76px;*/

    /*width:140px;*/
    /*height:93px;*/

    /*background: #3b4c3d;;*/

    /*transform-origin: 0 50%;*/
    /*transform: rotate(30deg);*/
/*}*/
/*#warZone #w_main #auto_clicker .inner .padded-holder >.available {*/
    /*position: relative;*/
    /*display: none;*/

    /*width: 100%;*/

    /*font: 10px/20px 'titilliumWebRegular';*/
/*}*/
/*#warZone #w_main #auto_clicker .inner .padded-holder .available >.get_more {*/
    /*font: 8px/22px 'titilliumWebRegular';*/
    /*vertical-align: top;*/
/*}*/
/*#warZone #w_main #auto_clicker .inner .padded-holder .available >.get_more:hover {*/
    /*text-shadow: 1px 1px 0 white, -1px 1px 0 white, 1px -1px 0 white, -1px -1px 0 white, 1px 0 0 white, 0 1px 0 white, -1px 0 0 white, 0 -1px 0 white;*/
    /*cursor: url("public_html/assets/images/cursorPointer.ico"), pointer;*/
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
/*}*/
/*#warZone #w_main #auto_clicker .inner .padded-holder >.locked {*/
    /*width: 43px;*/
    /*height: 47px;*/
    /*background: url('../images/warZone/auto_clicker_lock.png');*/
    /*position: absolute;*/
    /*bottom: 7px;*/
    /*right: 10px;*/
/*}*/



/* END auto clicker */

@keyframes tutArrow {
    0%     { transform: scale(0.8); }
    50%    { transform: scale(0.5); }
}
@keyframes tutArrowUp {
    0%     { transform: scale(0.8) rotate(-90deg); }
    50%    { transform: scale(0.5) rotate(-90deg); }
}
#warZone .tutArrowHolder {
    position: absolute;
    display: none;
    z-index: 1;

    top: 0;
    left: 0;

    pointer-events: none;
    pointer-events: auto;
}
#warZone .tutArrowHolder.flipHoriz {
    transform-origin: 14% 50%;
    transform: scaleX(-1);
}
#warZone .tutArrow {
    position: relative;

    margin-top: -29px;
    margin-left: -96px;

    width: 120px;
    height: 73px;

    background: url("../images/arrow_white.png");

    transform-origin: 14% 50%;
    transform: scale(0.8);

    animation: tutArrow 1.0s ease-in-out infinite;
}
#warZone .tutArrow.up {
    margin-top: 52px;
    margin-left: -13px;

    transform: scale(0.8) rotate(-90deg);

    animation: tutArrowUp 1.0s ease-in-out infinite;
}
#warZone .tutArrowInfo {
    position: absolute;

    left: -150px;
    top: 40px;

    width: 200px;
    font: 14px/18px 'titilliumWebSemiBold';
    color: white;
    text-align: center;

    text-shadow: 1px 1px 0 black, 1px -1px 0 black, -1px 1px 0 black, -1px -1px 0 black;
}
#warZone .tutArrowInfo.up {
    left: 40px;
    top: 50px;
    text-align: left;
}
#main_container .bsChangeHolder {
    position: absolute;
    left: 0;
    bottom: 0;
}
#main_container .bsChange {
    position: absolute;
    z-index: 1100;
    opacity: 0.0;

    left: 4px;
    top: -32px;

    font: 16px/16px 'titilliumWebSemiBold';
    color: black;
    white-space: nowrap;

    text-shadow: 0 0 1px white, 0 0 2px white, 0 0 4px white, 0 0 8px white, 0 0 16px white, 0 0 24px white, 0 0 32px white, 0 0 64px white, 0 0 64px white;

    pointer-events: none;
}
#main_container .bsChange.anim_1 {
    animation: bsChange_1 0.75s linear;
}
@keyframes bsChange_1 {
    0%      { opacity: 0.0; transform: translate(0, 0) scale(0.25); }
    50%     { opacity: 1.0; transform: translate(16px, -32px) scale(1.0); }
    100%    { opacity: 0.0; transform: translate(32px, -64px) scale(1.25); }
}
#main_container .goldChangeHolder {
    position: absolute;

    left: 0;
    bottom: 0;
}
#main_container .goldChange {
    position: absolute;
    z-index: 1100;
    opacity: 0.0;

    left: calc(4px + 200px);
    top: -32px;

    font: 16px/16px 'titilliumWebSemiBold';
    color: black;
    white-space: nowrap;

    text-shadow: 0 0 1px white, 0 0 2px white, 0 0 4px white, 0 0 8px white, 0 0 16px white, 0 0 24px white, 0 0 32px white, 0 0 64px white, 0 0 64px white;

    pointer-events: none;
}
#main_container .goldChange.anim_1 {
    animation: goldChange_1 0.75s linear;
}

@keyframes goldChange_1 {
    0%      { opacity: 0.0; transform: translate(0, 0) scale(0.25); }
    50%     { opacity: 1.0; transform: translate(16px, -32px) scale(1.0); }
    100%    { opacity: 0.0; transform: translate(32px, -64px) scale(1.25); }
}

#main_container .dpcChangeHolder {
    position: absolute;

    left: 0;
    bottom: 0;
}
#main_container .dpcChange {
    position: absolute;
    z-index: 1100;
    opacity: 0.0;

    left: calc(4px + 200px + 300px);
    top: -32px;

    font: 16px/16px 'titilliumWebSemiBold';
    color: black;
    white-space: nowrap;

    text-shadow: 0 0 1px white, 0 0 2px white, 0 0 4px white, 0 0 8px white, 0 0 16px white, 0 0 24px white, 0 0 32px white, 0 0 64px white, 0 0 64px white;

    pointer-events: none;
}
#main_container .dpcChange.anim_1 {
    animation: goldChange_1 0.75s linear;
}
@keyframes dpcChange_1 {
    0%      { opacity: 0.0; transform: translate(0, 0) scale(0.25); }
    50%     { opacity: 1.0; transform: translate(16px, -32px) scale(1.0); }
    100%    { opacity: 0.0; transform: translate(32px, -64px) scale(1.25); }
}


/*#warZone #w_main .free-gifts-icon{*/
    /*position: absolute;*/
    /*left: 674px;*/
    /*top: 7px;*/
    /*width: 99px;*/
    /*height: 99px;*/
    /*background: url("../images/warZone/gift.png") center;*/
    /*animation: anim_scale_0809 0.8s infinite ease-in-out;*/
/*}*/
/*#warZone #w_main .free-gifts-icon:hover{*/
    /*cursor: url("public_html/assets/images/cursorPointer.ico"), pointer;*/
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
    /*filter: brightness(127%);*/
/*}*/
#warZone #w_main .gift-icon-image{
    width: 90px;
    height: 90px;
    left: 4px;
    margin-left: 3px;
    margin-top: 13px;
    background: url("../images/warZone/shop_icons_spread_nova.png");
    transform: scale(0.29);
}
#warZone #w_main .free-gifts-icon.hidden{
    display:none;
}
#warZone #w_main .free-gifts-icon.shown{
   display:block;
}
#warZone #w_main .free-gifts-icon.shown{
    display:block;
}
#warZone #w_main .gifts-popup-holder{
    z-index:11;
    position:absolute;
    left: 674px;
    top: 7px;
    width:371px;
    height:171px;
    background:white;
    pointer-events: none;
}
#warZone #w_main .gifts-popup-holder .top-line{
    width: 375px;
    height: 7px;
    background: black;
    border-radius: 4px;
    margin-left: -2px;
}
#warZone #w_main .gifts-popup-holder .left{
    display:inline-block;
    width: 140px;
    height: 164px;
}
#warZone #w_main .gifts-popup-holder .icon-holder{
    position:absolute;
    width: 90px;
    height: 90px;
    background: url("../images/warZone/shop_icons_spread_nova.png") 90px 0;
    transform: scale(1.6);
    margin-left: 38px;
    margin-top: 36px;
    z-index:1;
}
#warZone #w_main .gifts-popup-holder .right{
    display:inline-block;
    width: 230px;
    height: 164px;
}
#warZone #w_main .gifts-popup-holder .right .congrats{
    position: absolute;
    width: 197px;
    height: 57px;
    text-align: center;
    margin-top: 20px;
    font: 27px/27px 'titilliumWebBold';
}
#warZone #w_main .gifts-popup-holder .right .congrats .gained{
    font: 21px/21px 'titilliumWebRegular';
}
#warZone #w_main .gifts-popup-holder .right .black-holder{
    width: 63%;
    height: 50px;
    font-family: titilliumWebRegular;
    background: black;
    position: absolute;
    margin-top: 102px;
    margin-left: -2px;
    color:white;
    text-align: center;
    font-size: 19px;
    line-height: 46px;

}
/* NEW WARZONE CSS */

#command-panel{
    position: absolute;
    width: 879px;
    height: 442px;
    top: 82px;
    left: 132px;
    left: 112px;
    /*background: url("../images/new/warZone/base_wz.png") 0 0;*/
    background: url("../images/new/warZone/monitor/new/new_monitor_longer.png") 0 0;
}
#command-panel > .fill-holder{
    position: absolute;
    width: 553px;
    height: 16px;
    background: url("../images/new/warZone/monitor/progress_bar.png") 0 0;
    left: 212px;
    top: 8px;
    overflow: hidden;
}
#command-panel > .fill-holder > .bar-fill{
    width: 547px;
    height: 10px;
    background: url("../images/new/warZone/monitor/progress_bar_inside.png") 0 0;
    transform: translateX(-547px);
    margin-top: 3px;
}
#command-panel .rank-holder{
    position: absolute;
    left: 767px;
    top: 9px;
    width: 30px;
    height: 13px;
    background: url("../images/warZone/ranks.png") ;
    background-size: 390%;
    transform: rotate(180deg);
}
#command-panel .rank-holder:hover {
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
}
#command-panel .progress-number {
    position: absolute;
    top: -9px;
    left: 128px;
    text-align: center;
    width: 167px;
    height: 16px;
    border-radius: 11px;
    color: white;
    font: 12px/16px 'titilliumWebRegular';
}
#command-panel .progress-number .icon{
    margin-top: -6px;
}
#command-panel .next-rank-number {
    position: absolute;
    left: 771px;
    top: -7px;
    width: 30px;
    height: 15px;
    color: white;
    font: 11px/13px 'titilliumWebRegular';
}
#command-panel .next-rank-number:hover {
    /*cursor: url("../images/cursorDefault.ico") 11 1, pointer;*/
}
#command-panel .next-rank-damage {
    position: absolute;
    left: 752px;
    top: -14px;
}
#command-panel .left-bar-background{
    position: absolute;
    width: 140px;
    height: 20px;
    margin-top: 54px;
    background: white;
}
#command-panel .left_holder{
    position:absolute;
    width: 151px;
    height: 218px;
    background: url("../images/new/warZone/left_square.png") 0 0;
}
.autoclicker-widget{
    position: absolute;
    /*width: 121px;*/
    width: 128px;
    height: 170px;
    top: 177px;
    top: 161px;
    left: -14px;
    padding: 0 9px;
    padding-top: 9px;
}
.autoclicker-widget.original-double-turret{
    margin-top: 14px;
}
.autoclicker-widget.turret4{
    top: 161px;
    background: url("../images/new/warZone/upgrades/autoclicker_background.png") 0 0;
}
.autoclicker-widget.turret4 .guns-holder{
    margin-top: 35px;
}
.autoclicker-widget .ac-image{
    width: 83px;
    height: 31px;
    background: url("../images/new/warZone/upgrades/turret_2.png") 0 0;
    margin-left: 32px;
    margin-top: 7px;
}
.autoclicker-widget .ac-image.special{
    width: 69px;
    height: 36px;
    background: url("../images/new/warZone/upgrades/turret_3.png") 0 0;
    margin-left: 32px;
    margin-top: 7px;
}
.autoclicker-widget .ac-image.turret4{
    width: 77px;
    height: 38px;
    background: url("../images/new/warZone/upgrades/turret4.png?v=1") 0 0;
    margin-left: 32px;
    margin-top: 7px;
}
.autoclicker-widget .ac-image.special.turret1{
    margin-left: 64px;
    margin-top: -1px;
}
.autoclicker-widget .ac-image.special.turret2{
    margin-left: 46px;
    margin-top: -8px;
}
.autoclicker-widget .ac-image.special.turret3{
    margin-left: 25px;
    margin-top: -8px;
}
.autoclicker-widget .progress-bar{
    width: 126px;
    height: 6px;
    background: linear-gradient(to right, green , yellow,  red);
    margin-top: 37px;
    border-radius: 0px;
}
.autoclicker-widget.turret4 .progress-bar{
    margin-top: 8px;
}
.autoclicker-widget .progress-bar::after{
    background: black;
    transition: transform 50ms linear;
    transform-origin: 100% 0;
    border-radius : 0px;
}
.autoclicker-widget .button{
    width: 127px;
    height: 27px;
    background: url("../images/new/warZone/upgrades/button_2.png") 0 0;
    margin-top: 4px;
}
.autoclicker-widget .button:not(.disabled):hover{
    filter: brightness(170%);
}
.autoclicker-widget .button .text{
    color: white;
    font: 12px/19px 'titilliumWebBold';
    text-align: center;
    padding-top: 3px;
}
#attackOverlay {
    position: absolute;
    width: 147px;
    height: 247px;
    left: 140px;
    top: 77px;
}
#attackOverlay .support {
    float: left;
    width: 100px;
    font: 13px/21px 'titilliumWebBold';
}
#attackOverlay .support .support-disabled{
    position: absolute;
    width: 147px;
    height: 84px;
    margin-top: 19px;
    background: url("../images/new/warZone/wz_splosno/support_power_locked.png");
}
#attackOverlay .support .info-button {
    margin-top: -2px;
    margin-left: 5px;
    transform: scale(0.9);
}
#attackOverlay .support .support-disabled .info-button{
     margin-left: 118px;
     display: inline-block;
     width: 19px;
     height: 19px;
     background: url("../images/new/bootCamp/question_mark.png");
     vertical-align: middle;
     margin-top: 42px;
}
#attackOverlay .support .support-disabled .info-button:hover {
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
}

#attackOverlay .support .left_holder{
    position:absolute;
    width: 146px;
    height: 217px;
    /*margin-left: 139px;
    margin-top: 79px;*/
    background: url("../images/new/warZone/left_square.png") 0 0;
}
#attackOverlay .support .left_holder .subHolder {
    width: 85%;
    margin: 0 auto;
}
#attackOverlay .support .left_holder .power-text{
    text-align: center;
    color: #f7931e;
    font: 12px/22px 'titilliumWebBold';
    margin-top: 11px;
}
#attackOverlay .active-clicking {
    float: left;
    width: 150px;
}
#attackOverlay .power {
    text-align: center;
    color: white;
}
#attackOverlay .power .type-bonus-power{
    color: #25bdc2;
    font: 12px/21px 'titilliumWebBold';
}
#attackOverlay .activate-text{
    margin-top: 34px;
    display: inline-block;
    color: white;
}
#attackOverlay .switch{
    display: inline-block;
    width: 30px;
    height: 20px;
    margin-top: 35px;
    float: right;
}
#attackOverlay .switch:hover {
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
}
#attackOverlay .switch.no{
    background: url('../images/new/warZone/on_off_button.png') 0 20px;
}
#attackOverlay .switch.yes{
    background: url('../images/new/warZone/on_off_button.png') 0 0px;
}
/*ni več v uporabi*/
/*#attackOverlay .activate.active {*/
    /*opacity: 1;*/
/*}*/
/*#attackOverlay .activate:hover {*/
    /*opacity: 1;*/
    /*cursor: url("public_html/assets/images/cursorPointer.ico"), pointer;*/
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
/*}*/
#attackOverlay .attacks-left {
    position: absolute;
    width: 129px;
    left: 8px;
    top: 55px;
    color:#ffffff;
    background: #404651;
    /*text-shadow: 1px 1px 0 #f7931e, -1px 1px 0 #f7931e, 1px -1px 0 #f7931e, -1px -1px 0 #f7931e, 1px 0 0 #f7931e, 0 1px 0 #f7931e, -1px 0 0 #f7931e, 0 -1px 0 #f7931e;*/

    text-align: center;
}
#attackOverlay .type {
    height: 24px;
    margin-bottom: 3px;
    color: #ffffff;
    opacity: 0.6;
}
#attackOverlay .type:hover {
    opacity: 1;
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
}
#attackOverlay .type.active {
    background: grey;
    opacity: 1;
}
#attackOverlay .type:not(.active).bonus {
    animation: bonusPower 1s ease-in-out alternate infinite;
}
@keyframes bonusPower {
    0%     { background: rgba(75,173,164, 0.5); }
    100%    { background: rgba(75,173,164, 1.0); }
}
#attackOverlay .type.active .state{
    background-position: 0 0;
}
#attackOverlay .type .name {
    width: 38px;
    display: inline-block;
    vertical-align: middle;
}
#attackOverlay .type .type-icon {
    width: 30px;
    height: 20px;
    display: inline-block;
    vertical-align: middle;
    background: url("../images/new/warZone/asl_icons-04.png");
}
#attackOverlay .type .type-icon.land {
    background-position: 0px 0;
}
#attackOverlay .type .type-icon.air {
    background-position: -30px 0;
}
#attackOverlay .type .type-icon.sea {
    background-position: -60px 0;
}
#attackOverlay .type .state {
    vertical-align: middle;
    width: 20px;
    height: 20px;
    margin-left: 26px;
    display: inline-block;
    background: url("../images/new/warZone/check_uncheck-03.png") 0 -20px;
}
#attackOverlay .land.type {
    margin-top: 9px;
}
#attackOverlay .air {
}
#attackOverlay .water {
}
#attackOverlay .army-setup {
    position: absolute;
    width: 144px;
    height: 34px;
    color: #ffffff;
    margin-top: 223px;
    text-align: center;
    font: 11px/34px 'titilliumWebSemiBold';
    background: url("../images/new/warZone/monitor/new/army_setup_button.png") 0 0;
}
#attackOverlay .army-setup:hover {
    opacity: 1;
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
}
#attackOverlay .army-setup .pending-icon{
    margin-top: -50px;
    margin-left: 59px;
    width: 22px;
    height: 22px;
    background: url("../chat/chat_notification_icon.png");
}
#attackMonitor {
    position: absolute;
    left: 289px;
    top: 45px;

    width: 516px;
    height: 355px;
    font: 15px/28px 'titilliumWebBold';
}
#attackMonitor .right-panel {
    position: absolute;
    right: -9px;
    top: 34px;
    width: 147px;
    height: 259px;
}

#attackMonitor .right-panel .icon.country-hq {
    position: absolute;
    top: 0;
    right: 0;
    width: 144px;
    height: 34px;
    text-align: center;

    margin: 0;
    font: 11px/34px 'titilliumWebSemiBold';
    color: #ffffff;
    background: url('../images/new/warZone/monitor/new/country_invasion_button.png') no-repeat;
}
#attackMonitor .right-panel .icon.country-hq:hover {
    filter: brightness(137%);
}
#attackMonitor .right-panel .icon.country-hq .pending-tasks{
    margin-top: -50px;
    margin-left: 59px;
    width: 22px;
    height: 22px;
    background: url("../chat/chat_notification_icon.png");
}
#attackMonitor .right-panel .mini-games {
    position: absolute;
    top: 55px;
    right: 16px;
    width: 131px;
    height: 34px;
    text-align: center;

}
#attackMonitor .right-panel .mini-games .icon {
    /*margin-left: 5px;
    margin-top: 6px;*/
    display: inline-block;
    width: 34px;
    height: 34px;
    /*background: url('../images/new/warClicks/wc_splosno/sp_4_wz_icons-min.png');*/

    background: url('../images/new/warZone/monitor/new/spin_the_wheel_rewards_sprite.png');
}
#attackMonitor .right-panel .mini-games .icon:hover {
    background-position-y: -34px;
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
}
#attackMonitor .right-panel .icon.tc {
    background-position-x: 0px;
}
#attackMonitor .right-panel .icon.invasion {
    left: 63px;
    background-position-x: -53px;
}
#attackMonitor .right-panel .icon.rewards {
   /*top: 43px;*/
    background-position-x: -0px;
}
#attackMonitor .right-panel .icon.spw {
    /*top: 43px;
    left: 63px;*/
    background-position-x: -34px;
}

/*#attackMonitor .right-panel .icon .timer {
    position: absolute;
    bottom: 3px;
    width: 100%;
    text-align: center;
    font: 10px/10px 'titilliumWebSemiBold';
    color: #ffffff;*/
    /*text-shadow: 1px 1px 0 #000000, -1px 1px 0 #000000, 1px -1px 0 #000000, -1px -1px 0 #000000;*/
/*}*/

#attackMonitor .right-panel .fuel-info {
    position: absolute;
    top: 110px;
    right: 0px;
    width: 145px;
    height: 38px;
    background: url('../images/new/warZone/monitor/new/refuel_menu.png');
}
#attackMonitor .right-panel .fuel-info .fuel {
    position: absolute;
    left: 32px;
    bottom: 7px;

    display: inline-block;
    font:12px/14px 'titilliumWebSemiBold';
    color: #ffffff;
}
#attackMonitor .right-panel .fuel-info .refuel {
    position: absolute;
    right: 0px;
    bottom: 0px;
    width: 67px;
    height: 38px;
}
#attackMonitor .right-panel .fuel-info .refuel .timer {
    position: absolute;
    top: -12px;
    width: 67px;
    text-align: center;
    font: 11px/12px 'titilliumWebSemiBold';
    color: #b3b3b3;
}
#attackMonitor .right-panel .fuel-info .refuel .tc {

    position: absolute;
    right: 0px;
    bottom: 0px;
    width: 67px;
    height: 25px;

    text-align: center;
    font: 11px/25px 'titilliumWebSemiBold';
    color: #000000;

    background: url('../images/new/warZone/monitor/new/refuel_sprite.png');
    background-position-y: -25px;
}
#attackMonitor .right-panel .fuel-info .refuel .tc:hover {
    filter: brightness(137%);
}
#attackMonitor .right-panel .fuel-info .refuel .tc.disabled {
    background-position-y: 0px;
    opacity: 1;
}
#attackMonitor .right-panel .fuel-info .refuel .tc.blink {
    animation: anim_scale_101112 1.1s 3 ease-in-out;
}
#attackMonitor .right-panel .dpc-info {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 145px;
    height: 112px;
    background: url('../images/new/warZone/monitor/new/dpc_menu.png');
}
#attackMonitor .dpc-boosts {
    text-align: center;
    margin-top: 20px;
    padding: 2px 2px;
    height: 43px;
}
#attackMonitor .dpc-boosts .icon {
    position: relative;
    display: inline-block;
    width: 33px;
    height: 33px;
    background: url('../images/new/warZone/monitor/new/dpc_icons_sprite.png');
}
#attackMonitor .dpc-boosts .icon:last-child {
    left: -82px;
}
#attackMonitor .dpc-boosts .icon.double-dpc-cons:hover {
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
    filter: brightness(116%);
}
#attackMonitor .dpc-boosts .icon.double-dpc-cons {
}
#attackMonitor .dpc-boosts .icon.double-dpc {
    background-position-y: -33px;
}
#attackMonitor .dpc-boosts .icon.double-dpc:hover {
    /*cursor: url("../images/cursorDefault.ico") 1 1, default !important;*/
    filter: brightness(100%);
}
#attackMonitor .dpc-boosts .icon.triple-dpc {
    background-position-y: -66px;
    left: 82px;
}
#attackMonitor .dpc-boosts .icon.triple-dpc:hover {
    /*cursor: url("public_html/assets/images/cursorDefault.ico"), default;*/
    /*cursor: url("../images/cursorDefault.ico") 1 1, default;*/
    filter: brightness(100%);
}
#attackMonitor .dpc-boosts .icon .info {
    position: absolute;
    top: -12px;
    width: 33px;
    text-align: center;
    color: #999999;
    font: 11px/11px 'titilliumWebSemiBold';
}
#attackMonitor .dpc-boosts .icon .timer {
    position: absolute;
    bottom: -10px;
    left: -3px;
    width: 37px;
    text-align: center;
    font: 9px/9px 'titilliumWebSemiBold';
    color: #ffffff;
    background: #2d323a;
    border: 1px solid #e6e6e6;
    text-align: center;
    padding: 2px 0;
    /*text-shadow: 1px 1px 0 #000000, -1px 1px 0 #000000, 1px -1px 0 #000000, -1px -1px 0 #000000;*/
}
#attackMonitor .dpc-info .dpc-holder {
    font: 12px/12px 'titilliumWebSemiBold';
    color: #ffffff;
    text-align: center;
}
#attackMonitor .dpc-info .dpc-holder .dpc-text {
    display: inline-block;
    margin-top: 16px;
}
#attackMonitor .dpc-info .dpc-holder .dpc {
    display: inline-block;
}
#attackMonitor .battle-info {
    text-align: left;
    margin-left: /*46*/5px;
    color: #ffffff;
    margin-top:-10px;
    padding-bottom: 4px;
    padding-top: 0px;
    width: 176px;
}
/* kept for now*/
#attackMonitor .battle-info .battle-id {
    display: none;
}
#attackMonitor .battle-icons {
    position:absolute;
    width: 218px;
    height: 45px;
    color: #ffffff;
    left: /*110*/78px;
    top: -14px;
    overflow: hidden;
}
#attackMonitor .battle-icons hr {
    position: absolute;
    width: 100%;
    left: 23px;
    top: 7px;
}
#attackMonitor .battle-icons > div {
    width: 920px;
    will-change: transform;
    transition: transform 1000ms;
    transform-origin: 0 0;
    margin-top: 1px;
}
#attackMonitor .battle-icons .icon {
    position: relative;
    z-index: 1;
    width: 32px;
    height: 32px;
    margin-left: 60px;
    background: url("../images/new/warZone/monitor/new/asl_icons_bar_sprite.png");
    background-position-y: -32px;
}
#attackMonitor .battle-icons .icon > span {
    position: absolute;
    bottom: -11px;
    left: 0;
    width: 100%;
    text-align: center;
    font: 12px/12px 'titilliumWebBold';
    color: #ffffff;
}
#attackMonitor .battle-icons .icon:first-child {
    margin-left: 0;
}
#attackMonitor .battle-icons .icon-shade {
    opacity: 0;
    position: absolute;
    display: block;
    width: 28px;
    height: 28px;
    top: 2px;
    border-radius: 14px;
    box-shadow: 0px 0px 5px #f9a600, 0px 0px 5px #f9a600;
}
#attackMonitor .battle-icons .icon-shade.active {
    opacity: 1;
}
#attackMonitor .battle-icons .battle-progress-bar {
    position: absolute;
    top: 10px;
    width: 70px;
    height: 13px;
    background: url("../images/new/warZone/monitor/new/bar_sprite_v2.png");
}
#attackMonitor .battle-icons .battle-progress-bar:after {
    background: url("../images/new/warZone/monitor/new/bar_sprite_v2.png");
    background-position-y: -13px;
    transition: transform 200ms;
}
#attackMonitor .battle-icons .icon.active {
    background-position-y: 0px;
}
#attackMonitor .battle-icons .icon:nth-of-type(1) {
    margin-left: 0;
}
#attackMonitor .battle-icons .icon.land {
    background-position-x: -64px;
}
#attackMonitor .battle-icons .icon.air {
    background-position-x: 0px;
}
#attackMonitor .battle-icons .icon.water {
    background-position-x: -32px;
}
#attackMonitor .battle-icons .icon.boss {
    background-position-x: -96px;
    background-position-y: 0px;
}
#attackMonitor .battle-icons .icon.pvp {
    background-position-x: -128px;
    background-position-y: 0px;
}
#attackMonitor .farming-toggle {
    position: absolute;
    top: -8px;
    right: 172px;
    width: 23px;
    height: 23px;
    background: url('../images/new/warZone/monitor/farming_sprite.png');
    background-position-y: 0;
}
#attackMonitor .farming-toggle:hover {
    opacity: 0.9;
}
#attackMonitor .farming-toggle.off {
    background-position-y: -23px;
}
#attackMonitor .farming-toggle.animFarm {
    animation: glowFarmAnim;
    animation-duration: 1.4s;
    animation-iteration-count: 1;
}
#attackMonitor #unit {
    position: relative;
    top: 19px;
    width: 358px;
    height: 230px;
    margin-left: 10px;
    background: url('../images/new/warZone/monitor/ozadja/als_sprite_min.png');
    overflow: hidden;
}
#attackMonitor #unit .unit-attack {
    position: relative;
    width: 100%;
    height: 100%;
    background: url('../images/new/warZone/monitor/enote/damaged_min.png');
    will-change: transform;
    transition: transform 500ms;
    transform-origin: 0 0;
    /*cursor: none;*/
}
#attackMonitor #unit .unit-damage {
    position: absolute;
    opacity: 0;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url('../images/new/warZone/monitor/enote/damaged_min.png');
    background-position-y: -230px;
    pointer-events: none;
}
#attackMonitor #unit .name {
    color: #ff0000;
}
#attackMonitor #unit .health {
    position: relative;
    margin: 0 auto;
    height: 20px;
    padding: 2px 2px;
    background: #ffffff;
}
#attackMonitor #unit .health .fill {
    position: absolute;
    left: 2px;
    top: 2px;
    width: 296px;
    height: 20px;
    background: #ff0000;
}
#attackMonitor #unit .health-info {
    position: absolute;
    display: inline-block;
    width: 100%;
    color: #000000;
    text-align: center;
}
#attackMonitor #unitExplosions {
    position: absolute;
    width: 358px;
    height: 230px;
    top: 0px;
    left: 0px;
    pointer-events: none;
}
#attackMonitor #unitExplosions > div {
    transform: scale(1);
}
#attackMonitor #outOfFuel {
    top: 0;
    left: 0;
    opacity: 0;
    position: absolute;
    pointer-events: none;
    width: 358px;
    height: 230px;
    text-align: center;
    background: rgba(0,0,0, 0.53) url('../images/new/warZone/out_of_fuel.png') center no-repeat;

}
#attackMonitor #outOfFuel.show {
    animation: fadeInOut  1s 3 ease-in-out;
}
#attackMonitor .button.fuel.show {
    animation: fadeInOut  1s 3 ease-in-out;
}

#unit .nozzle-flash {
    position: absolute;
    top: 7px;
    left: 105px;
    height: 100px;
    width: 100px;
    background: url('../images/warZone/splash.png');
    opacity: 0;
    /*transform: scale(0.8);*/
    pointer-events: none;
    box-shadow: 0 0 0 #000;
    transform: translate3d(0,0,0);
    will-change: transform;
}
@keyframes nozzleFlashRegular {
    0%		{ transform: scale(0.25); opacity: 1.0; }
    100%	{ transform: scale(1); opacity: 0; }
}

@keyframes fadeInOut {
    0%		{ opacity: 0;}
    30%		{ opacity: 1;}
    100%	{ opacity: 0;}
}
#attackMonitor .red-overlay {
    position: absolute;
    opacity: 0.8;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url('../images/new/warZone/monitor/ozadja/boss_fight.png');
    pointer-events: none;
}
@keyframes shakeUnit0 {
    0%, 100% {transform: translate(0);}
    10%, 30%, 50%, 70%, 90% {transform: translateY(-2px);}
    20%, 40%, 60%, 80% {transform: translateX(1px);}
}
@keyframes shakeUnit1 {
    0%, 100% {transform: translate(0);}
    10%, 30%, 50%, 70%, 90% {transform: translateY(-1px);}
    20%, 40%, 60%, 80% {transform: translateX(2px);}
}
@keyframes shakeUnit2 {
    0%, 100% {transform: translate(0);}
    10%, 30%, 50%, 70%, 90% {transform: translateY(1px);}
    20%, 40%, 60%, 80% {transform: translateX(-1px);}
}
/* animation for unit */
.hide-unit {
    transform: translateX(100%);
    opacity: 0;
}
.cursor.target {
    position: absolute;
    z-index: 0;
    background: url("../images/cursor.png") -228px 0;
}

/* particles testing */
@keyframes anim_unit_in {
    0%		{ transform: translateY(-440px); }
    100%	{ transform: translateY(-10px); }
}
@keyframes anim_unit_out {
    0%		{ transform: translateY(-10px); }
    100%	{ transform: translateY(440px); }
}
@keyframes glowFarmAnim {
    0%      {
        filter: brightness(100%);
        transform: scale(1.0);
    }
    50%     {
        filter: brightness(147%);
        transform: scale(1.5);
    }
    100% {
        filter: brightness(100%);
        transform: scale(1.0);
    }
}
.unit-part {
    position: absolute;

    width: 97px;
    height: 97px;

    pointer-events: none;
}
/* end particles testog
/* end animation for unit */


#attackMonitor #battleLoading {
    position: absolute;
    left: 0;
    top: 0;
    width: calc(100% - 40px);
    height: calc(100% - 100px);
    background: rgba(0,0,0,0.7);
    color: #ffffff;
    font-size: 18px;
    padding: 50px 20px;
    text-align: center;
}
#attackMonitor #bossTimer {
    position: absolute;
    right: 15px;
    bottom: 15px;
    font: 20px/21px 'titilliumWebBold';
    color: #ffffff;
    text-align: right;
    pointer-events: none;
}
#attackMonitor #bossTimer > span:not(.info-button) {
    display: inline-block;
    background: #2b9a95;
}
#attackMonitor #bossTimer .info-button {
    pointer-events: auto;
    vertical-align: top;
    margin-top: 1px;
    margin-left: 2px;
    margin-right: 1px;
    opacity: 0.7;
}
#attackMonitor #bossTimer .info-button:hover {
    opacity: 1;
}
/*#attackMonitor #bossTimer .started {
    animation: tutArrow 1s infinite;
}*/
#attackMonitor .battle-progress {
    position: absolute;
    top: 25px;
    right: 0px;
    padding: 5px 10px 5px 30px;
    font: 14px/16px 'titilliumWebBold';
    color: #ffffff;
    background: linear-gradient(to right, rgba(77,77,77,0),rgba(77,77,77,1));
    text-shadow: 1px 1px 0 black, -1px 1px 0 black, 1px -1px 0 black, -1px -1px 0 black;
}
#attackMonitor .boss-time{
    color: white;
    width: 32px;
    height: 21px;
    position: absolute;
    top: 87px;
    right: 3px;
    font-size: 17px;
}
#attackMonitor .boss-time.started{
    animation: tutArrow 1s infinite;
}
#attackMonitor .boss-text{
    color: white;
    position: absolute;
    width: 131px;
    height: 21px;
    top: 4px;
    left: 108px;
}
#attackMonitor #sacrifice {
    position: absolute;
    pointer-events: none;
    opacity: 0;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #b3b3b3;
    font: 16px/19px 'titilliumWebRegular';
    color: black;
    transition: opacity 2s;
}
#attackMonitor #sacrifice .sacrifice-holder {
    padding: 28px 18px 40px 18px;
    text-align: center;
}
#attackMonitor #sacrifice .sacrifice-holder > div {
    padding: 5px;
    color: #ffffff;
    display: inline-block;
    font: 15px/19px 'titilliumWebSemiBold';
    text-align: center;
    width: 93px;
    margin-top: 26px;
    border: solid 1px white;
    border-radius: 3px;
}
#attackMonitor #sacrifice .sacrifice-holder .info-button {
    margin-top: 0;
    margin-left: 5px;
    margin-bottom: 10px;
    vertical-align: top;
    pointer-events: auto;
}
#attackMonitor #sacrifice .sacrifice-holder > div:hover {
    opacity: 0.7;
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
}
#attackMonitor #sacrifice .sacrifice{
    background: #f7931e;
    margin-left: 31px;
    pointer-events: auto;
}
#attackMonitor #sacrifice .farm{
    background: #3f4651;
    margin-left: -5px;
    pointer-events: auto;
}
#attackMonitor #pvpHolder {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}
#attackMonitor #pvpHolder.select {
    background: url('../images/new/warZone/upgrades/bg_4.png?v=1');
}
#attackMonitor #pvpHolder.battle {
    background: url('../images/new/warZone/upgrades/bg.png');
}
#attackMonitor .pvp-header {
    display: none;
    position: absolute;
    top: 32px;
    width: 169px;
    height: 48px;
    left: calc(50% - 160px);
    background: url('../images/new/warZone/upgrades/title_tag.png');
    color: #ffffff;
    font: 14px/16px 'titilliumWebBold';
    text-align: center;
    margin-left: 16px;
}
#attackMonitor .pvp-header > div {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}
#attackMonitor .pvp-header > span {
    display: inline-block;
    vertical-align: middle;
}
#attackMonitor .pvp-header > span > span {
    display: inline-block;
    vertical-align: top;
    font: 14px/16px 'titilliumWebRegular';
    text-align: center;
    margin-top: 0;
}
#attackMonitor .pvp-header > span > span.with-info {
    padding-left: 30px;
}
#attackMonitor .pvp-header > span .info-button {
    margin-left: 20px;
    padding-left: 0;
}
#attackMonitor .pvp-header > span > span > span {
    font: 10px/12px 'titilliumWebRegular';
}
#attackMonitor #pvpLoading {
    position: relative;
    left: 0;
    top: 0;
    padding-top: 90px;
    width: 100%;
    height: calc(100% - 90px);
    background: #50555c;
    color: #ffffff;

    opacity: 0;
    transition: opacity 1.5s ease-in-out;
}
#attackMonitor #pvpLoading .loading-info {
    text-align: center;
}
#attackMonitor #pvpLoading .type-icon {
    display: inline-block;

    animation: bounce_loading 1.5s infinite;
    transform:scale(.5);
}
#attackMonitor #pvpLoading .type-icon:nth-of-type(2) {
    animation-delay: 0.5s;
}
#attackMonitor #pvpLoading .type-icon:nth-of-type(3) {
    animation-delay: 1s;
}
@keyframes bounce_loading {
    0%{
        transform:scale(1);
    }
    100%{
        transform:scale(.5);
    }
}
#attackMonitor #pvpChoose {
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    color: #ffffff;
    overflow-x: hidden;
}
#attackMonitor #pvpChoose .player {
    float: left;
    width: 45%;
    height: 183px;
    margin-top: 29px;
    margin-left: 10px;
}
#attackMonitor #pvpChoose .player > div {
    position: relative;
    width: calc(100% - 20px);
    padding: 0 9px;
    height: 183px;
    overflow: hidden;
}
#attackMonitor #pvpChoose .player.right > div {
    width: 100%;
    padding: 0;
}
#attackMonitor #pvpChoose .player.right {
    float: right;
}
#attackMonitor #pvpChoose .player .prof-image {
    position: absolute;
    top: 24px;
    /*left: 18px;*/
    left: 11px;
    width: 40px;
    height: 40px;
}
#attackMonitor #pvpChoose .player .prof-image .macro-holder {
    left: -62px;
    top: -61px;

    backface-visibility: hidden;
}
#attackMonitor #pvpChoose .player .p-username {
    font: 12px/15px 'titilliumWebBold';
    margin-top: 17px;
    margin-left: 36px;
    margin-right: 26px;
    text-align: center;
}
#attackMonitor #pvpChoose .player .level {
    font: 12px/15px 'titilliumWebRegular';
    margin-left: 56px;
}
#attackMonitor #pvpChoose .player .score:not(.icon) {
    font: 12px/14px 'titilliumWebRegular';
    margin-left: 27px;
}
#attackMonitor #pvpChoose .player .score.icon {
    margin-left: 10px;

    backface-visibility: hidden;
}
#attackMonitor #pvpChoose .pvp-power-mx {
    font: 12px/14px 'titilliumWebRegular';
    margin-top: 8px;
    text-align: right;
    margin-right: 15px;
    margin-bottom: 3px;
}
#attackMonitor #pvpChoose .player .unit-type-info {
    padding-top: 0px;
}
#attackMonitor #pvpChoose .player .unit-type-info > div{
    display: inline-block;
    vertical-align: middle;
    text-align: center;
}
#attackMonitor .type-icon {
    width: 30px;
    height: 30px;
    background: url("../images/new/warZone/monitor/asl_icons_bar_sprite_min.png");
}
#attackMonitor .type-icon.land {
    background-position-x: -60px;
}
#attackMonitor .type-icon.air {
    background-position-x: 0px;
}
#attackMonitor .type-icon.water {
    background-position-x: -30px;
}
#attackMonitor .type-icon.boss {
    background-position-x: -90px;
}
#attackMonitor .type-icon.pvp {
    background-position-x: -120px;
}
#attackMonitor .unit-type-count {
    font: 14px/14px 'titilliumWebSemiBold';
    width: 77px;
}
#attackMonitor #pvpChoose .opponents {
    position: relative;
    /*width: 300%;*/
    width: 500%;
}
#attackMonitor #pvpChoose .opponent-info {
    position: relative;
    display: inline-block;
    /*width: calc(33.33334% - 18px);*/
    width: calc(20% - 18px);
    padding: 0 9px;

    backface-visibility: hidden;
}
#attackMonitor #pvpChoose .button {
    position: absolute;
    top: 5px;
    display: inline-block;
    width: 22px;
    height: 14px;
    background: url("../images/new/warZone/upgrades/back_forward.png");

    backface-visibility: hidden;
}
#attackMonitor #pvpChoose .button:hover {
    background-position-y: -15px;
    opacity: 0.7;
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
}
#attackMonitor #pvpChoose .opponent-info .prev {
    right: 45px;
    background-position-x: 0;
    top: 2px;
}
#attackMonitor #pvpChoose .opponent-info .next {
    right: 13px;
    top: 2px;
    background-position-x: -22px;
}
#attackMonitor #pvpSimulation {
    position: relative;
    width: 100%;
    height: calc(100% - 43px);
    padding-top: 43px;
    color: #000000;
}
#attackMonitor #pvpSimulation > div {
    display: inline-block;
}
#attackMonitor #pvpSimulation .players {
    display: block;
    height: 20px;
    padding: 7px 20px;
    font: 14px/19px 'titilliumWebRegular';
}
#attackMonitor #pvpSimulation .p1 {
    float: left;
}
#attackMonitor #pvpSimulation .p2 {
    float: right;
}
#attackMonitor #pvpSimulation .p1-units,
#attackMonitor #pvpSimulation .p2-units {
    width: 69px;
    height: 153px;
    text-align: center;
    float: left;
}
#attackMonitor #pvpSimulation .p2-units {
    float: right;
}
#attackMonitor #pvpSimulation .unit {
    position: relative;
    display: inline-block;
    width: 48px;
    height: 22px;
    background: url("../images/new/warZone/upgrades/units_sprite_min.png") 0 0;
    background-size: auto 100%;
    margin-bottom: 1px;

    backface-visibility: hidden;
}
#attackMonitor #pvpSimulation .unit-power {
    position: absolute;
    bottom: -8px;
    left: 0;
    right: 0;
    font: 8px/12px 'titilliumWebSemiBold';
    color: black;

    backface-visibility: hidden;
}
#attackMonitor #pvpSimulation .simulation {
    float: left;
    width: 220px;
    height: 150px;
    overflow-x: hidden;
    overflow-y: scroll;
}
#attackMonitor #pvpSimulation .simulation .unit {
    width: 74px;
    height: 34px;

    backface-visibility: hidden;
}
#attackMonitor #pvpSimulation .unit.destroyed {
    opacity: 0.2;
}
#attackMonitor #pvpSimulation .unit.destroyed .unit-power {
    display: none;
}
#attackMonitor #pvpSimulation .simulation .power-bar {
    position: relative;
    border-radius: 4px;
    width: 75px;
    height: 8px;
    background: #697484;
    overflow: hidden;

    backface-visibility: hidden;
}
#attackMonitor #pvpSimulation .power-bar::after {
    background: #34373a;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}
#attackMonitor #pvpSimulation .step {
    overflow: hidden;
}
#attackMonitor #pvpSimulation .step.s0 {
    padding-top: 40px;
}
#attackMonitor #pvpSimulation .step:last-child:not(.final-step) {
    padding-bottom: 30px;
}
#attackMonitor #pvpSimulation .step:not(:first-child) {
    margin-top: 10px;
}
#attackMonitor #pvpSimulation .wave {
    text-align: center;
    clear: both;
    font: 14px/14px 'titilliumWebSemiBold';
    margin-bottom: 5px;
}
#attackMonitor #pvpSimulation .player1,
#attackMonitor #pvpSimulation .player2 {
    position: relative;
    padding-left: 10px;
    width: 80px;
    float: left;
    line-height: 0;
}
#attackMonitor #pvpSimulation .player2 {
    float: right;
}
#attackMonitor #pvpSimulation .berserk:after {
    content: 'x2';
    position: absolute;
    top: 0;
    right: 0;
    /* če hočš da je na levi strani berserk right: 56px; */
    display: inline-block;

    /*height: 25px;
    width: 25px;
    background: url('../images/new/warZone/upgrades/berserk_mode.png');*/
    /*height: 37px;
    width: 37px;*/
    height: 22px;

    width: 20px;
    background: url('../images/new/warZone/berserk_icon.png');
    background-size: 100%;
    padding-left: 17px;

    text-shadow: 1px 1px 0 black, -1px 1px 0 black, 1px -1px 0 black, -1px -1px 0 black;
    color: white;
    font: 13px/20px 'titilliumWebBold';
    padding-top: 12px;

    backface-visibility: hidden;
}
#attackMonitor #pvpSimulation .wave-result {
    padding-top: 5px;
    text-align: center;
    clear: both;
    font: 12px/12px 'titilliumWebRegular';
}
#attackMonitor #pvpSimulation .battle-result {
    min-height: 140px;
    text-align: center;
    clear: both;

    padding: 10px;
    font: 12px/14px 'titilliumWebRegular';
}
#attackMonitor #pvpSimulation .battle-result .outcome {
    margin-top: 10px;
    font: 12px/14px 'titilliumWebBold';
}
#attackMonitor .active-clicking {
    position: absolute;
    margin-left: 398px;
    margin-top: -53px;
    color: white;
}
#attackMonitor .active-clicking .fuel-holder.low {
    animation: anim_color_fuel 1.1s infinite ease-in-out;
}
#attackMonitor .active-clicking .fuel-text {
    position: relative;
    display: inline-block;
    margin-top: 1px;
}
#attackMonitor .active-clicking .fuel-text:hover {
    /*cursor: url("../images/cursorDefault.ico") 11 1, pointer;*/
}
#attackMonitor .active-clicking .fuel {
    display: inline-block;
}
#attackMonitor .right-panel .fuel-info .fuel.low {
    color: #ff3333;
}
#attackMonitor .active-clicking .dpc{
    position: relative;
    display: inline-block;
}
#attackMonitor .active-clicking .dpc-text{
    display: inline-block;
    margin-top: 16px;
}
#attackMonitor .active-clicking .dpc-text:hover{
    /*cursor: url("../images/cursorDefault.ico") 11 1, pointer;*/
}
#attackMonitor .battle-unit-info {
    width: 241px;
    height: 67px;
    position: absolute;
    top: 266px;
    left: 62px;
    background: url("../images/new/warZone/name_square.png");

    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
#attackMonitor .battle-unit-info .name {
    position: relative;
    color: white;
    width: 100%;
    text-align: center;
    margin-top: 33px;
}
/* THIS IS basically just PvP mostly */
#attackMonitor .battle-unit-info .pvp-cover {
    position: absolute;
    top: 10px;
    left: 10px;
    width: calc(100% - 20px);
    height: calc(100% - 20px);
    background: #3f4651;
    text-align: center;

    backface-visibility: hidden;
}
#attackMonitor .battle-unit-info .pvp-cover .button {
    display: none;
    margin: 10px auto;
    background: #f7931e;
    padding: 0 40px;
    color: #ffffff;
    border-radius: 5px;
    border: 1px solid transparent;
}
#attackMonitor .battle-unit-info .pvp-cover .button:hover {
    color: #000000;
    border: 1px dashed #ffffff;
    filter: none;
}

/* END */

#attackMonitor .health {
    position: absolute;
    margin: 0 auto;
    margin-top: 28px;
    height: 20px;
    padding: 2px 2px;
    background: #ffffff;
    width: 191px;
    left: 85px;
    overflow: auto;
}
#attackMonitor .health::after {
    background: #f7931e;
    transition: transform 100ms;

}
#attackMonitor .health-info {
    /* HMM - z index ?? */
    position: absolute;
    top: 275px;
    width: 190px;
    left: 88px;
    display: inline-block;
    color: white;
    text-align: center;
    font: 14px/28px 'titilliumWebRegular';
    text-shadow: 1px 1px 0 #f7931e, -1px 1px 0 #f7931e, 1px -1px 0 #f7931e, -1px -1px 0 #f7931e, 1px 0 0 #f7931e, 0 1px 0 #f7931e, -1px 0 0 #f7931e, 0 -1px 0 #f7931e;

    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
#dropsHolder {
    position: absolute;
    bottom: 80px;
    left: 270px;
    width: 400px;
}
#dropsHolder .drop {
    position: absolute;
    transform: translateX(400px) translateY(-200px) scale(0.9);
    will-change: transform;
    transition: transform 1s;
}
#dropsHolder .drop:hover {
    transform: scale(1);
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
}
.drop.fuel {
    width: 80px;
    height: 72px;
    background: url('../images/new/warZone/tc/barrels.png');
    background-size: auto 100%;
}
.drop.fuel:hover {
    width: 89px;
    height: 80px;
}
.drop.gold {
    width: 70px;
    height: 70px;
    background: url('../images/shop/shop_gold.png');
    background-size: auto 100%;
    background-position-x: -140px;
}
.drop.gold:hover {
    width: 80px;
    height: 80px;
    background-position-x: -160px;
}
.drop.not-collectable {
    pointer-events: none;
}
.drop > div {
    width: 100%;
    text-align: center;
    font: 40px/80px 'titilliumWebBold';
    color: #ffffff;
    display: none;
    text-shadow: 1px 1px 0 black, -1px 1px 0 black, 1px -1px 0 black, -1px -1px 0 black;
}
#tempStats {
    position: absolute;
    left: 0;
    top: 180px;
    width: 150px;
    height: 100px;
    background: rgba(255,255,255,0.7);
}
/* ANDRAZ CSS */
#upgradesHolder {
    font: 12px/14px 'titilliumWebRegular';
}
#upgradesHolder .header{
    padding: /*1*/5px 10px;
    height: 42px;
}
#upgradesHolder .header .title-icon {
    background-position-x: -160px;
}
#upgradesHolder .header .reset-sort {
    padding: 3px 10px;
    display: inline-block;
    vertical-align: middle;
    background: #f7931e;
    position: relative;
    border-radius: 5px;
    margin-left: 95px;
    top: -5px;
    font: 12px/14px 'titilliumWebRegular';
    color: #ffffff;
}
#upgradesHolder .header .reset-sort:hover {
    filter: brightness(127%);
}
#upgradesHolder .tabs {
    background: #3f4651;
    height: 38px;
}
#upgradesHolder .tabs .tab.pvp .pending-icon {
    margin-top: -28px;
    margin-left: 32px;
    width: 22px;
    height: 22px;
    background: url("../chat/chat_notification_icon.png");
}

/*#upgradesHolder .tabs .tab:hover{*/
    /*color: red;*/
/*}*/
#upgradesHolder .tabs .tab:hover .pending-icon {
    margin-top: -28px;
}
.button.tab {
    position: relative;
    width: 135px;
    height: 35px;
    display: inline-block;
    padding: 0 10px;
    margin: 0 5px;
    color: #ffffff;
    font: 16px/35px 'titilliumWebSemiBold';
}
.button.tab:hover {
    background: #4bada4;
    top: -5px;
    /*top: -2px;*/
    height: 45px;
    line-height: 45px;
    vertical-align: top;
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
}
.button.tab.active {
    background: #4bada4;
    top: -5px;
    height: 45px;
    line-height: 45px;
    vertical-align: top;
    pointer-events: none;
}
.button.tab.disabled {
    height: 34px;
    font: 16px/12px 'titilliumWebSemiBold';
    padding-top: 8px;
    border: 2px solid #cccccc;
    margin-top: -5px;
    background: #3f4651;
    opacity: 1;
}
.button.tab:not(.active):not(.disabled) {
   vertical-align: top;
   /* margin-top: -12px;*/
}
.button.tab > .lock{
    display: inline-block;
    width: 13px;
    height: 15px;
    background: url("../images/new/warZone/upgrades/lock.png");
    margin-right: 7px;
}
.button.tab > .lock.disabled{
    display: none;
}
.button.tab > span {
    font: 11px/12px 'titilliumWebSemiBold';
    color: #cccccc;
}
#upgradesHolder .upgrades-info {
    background: #dbdbdb;
    margin-top: 9px;
    position: relative;
}
#upgradesHolder #moreInfo {
    position: absolute;
    top: 25px;
    right: 0;
    width: 200px;
    padding: 20px;
    background: #3f4651;
    color: #ffffff;
    z-index: 1;
    font: 12px/14px 'titilliumWebRegular';
    border: 1px solid white;
}
#upgradesHolder #moreInfo .desc {
    padding-top: 7px;
}
#upgradesHolder #moreInfo .x {
    pointer-events: auto;
    position: absolute;
    top: -1px;
    right: 0px;
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
}
#upgradesHolder .upgrades-info > div:not(.bg1):not(.amount-selector-holder) {
    display: inline-block;
    /*width: 36%;*/
    width: 42%;
    font: 16px/41px 'titilliumWebRegular';
    color: #000000;
    padding-left: 17px;
}
#upgradesHolder .upgrades-info > div:not(.amount-selector-holder) {
    display: inline-block;
}
#upgradesHolder .upgrades-info > .availPVP {
    width: auto !important;
}
#upgradesHolder .upgrades-info > .availPVP .bg1 {
    background: #c9c9c9;
    display: inline-block;
    position: absolute;
    top: 8px;
    height:21px;
    margin-left: 10px;
    border-radius: 9px;
    padding: 2px 9px;
    width: 60px;
}
#upgradesHolder .upgrades-info > .availPVP .bg1 .icon {
    margin-top: -24px;
}
#upgradesHolder .upgrades-info > .availPVP .bg1 .pvpPoints{
    vertical-align: top;
    width: 14px;
    height: 20px;
    display: inline-block;
    font: 15px/20px 'titilliumWebSemiBold';
    margin-left: 6px;
}
#upgradesHolder .upgrades-info > .availPVP .bg1 .unlocksCompleted{
    vertical-align: top;
    width: 42px;
    height: 20px;
    display: inline-block;
    font: 15px/20px 'titilliumWebSemiBold';
    margin-left: 2px;
    text-align: center;
}
#upgradesHolder .upgrades-info > .availPVP .more {
    margin-left: 96px;
    margin-top: -4px;
}
#upgradesHolder .upgrades-info > div > span{
    font: 16px/41px 'titilliumWebSemiBold';
}
#upgradesHolder .upgrades-info .more {
    position: relative;
    display: inline-block;
    width: 20px !important;
    height: 19px;
    background: #ffffff;
    border-radius: 10px;
    vertical-align: middle;
    /*margin-left: 23px;*/
    margin-left: 19px;
    margin-top: -2px;
    background: url("../images/new/warZone/upgrades/forward.png");
}
#upgradesHolder .upgrades-info .more:hover {
    filter: brightness(130%);
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
}
#upgradesHolder .upgrades-info .more.more-visible {
    pointer-events: none;
    z-index: 1;
}
#upgradesHolder .content-holder {
    position: relative;
    height: 320px;
    padding: 8px;
}
#upgradesHolder .content {
    position: absolute;
    display: none;
    width: calc(100% - 16px);
    height: calc(100% - 16px);
}
#upgradesHolder .content.support,
#upgradesHolder .content.pvp{
    width: calc(100% - 30px);
}
#upgradesHolder .content.active {
    display: block;
}
#upgradesHolder .content > div {
    width: calc(50% - 30px);
    border: solid 1px #9bceca;

}
#upgradesHolder .content .special-upgrades .effect {
    margin-top: 17px;
}
#upgradesHolder .scroll-y {
    padding: 35px 10px 10px 10px;
    position: relative;
    overflow-y: scroll;
    /*height: calc(100% - 87px);*/
    height: calc(100% - 48px);
}
#upgradesHolder .content > div .title {
    height: 28px;
    width: 152px;
    font: 14px/28px 'titilliumWebSemiBold';
    background: url('../images/new/warZone/upgrades/name_basic_upgrades.png');
    text-align: center;
    color: #ffffff;
    position: absolute;
    top: 0;
    left: 0;
}
#upgradesHolder .amount-selector-holder {
    position: absolute;
    top: 11px;
    left: 215px;
    background: #f7931e;
    color: white;
    width: 64px;
    height: 19px;
    text-align: left;
    font: 13px/18px 'titilliumWebBold';
    padding-left: 10px;
}
#upgradesHolder .amount-selector-holder:hover {
    cursor: pointer;
    filter: brightness(127%);
}
#upgradesHolder .amount-selector-holder .amount-selector {
    display: inline-block;
}
#upgradesHolder .content .special-upgrades {
    float: right;
    width: calc(50% - 30px);
}
#upgradesHolder .content .dpc-upgrades {
    float: left;
    width: calc(50% - 25px);
}
#upgradesHolder .content .dpc-upgrades .icon,
#upgradesHolder .content .special-upgrades .icon{
    margin-left: -3px;
}
#upgradesHolder .support-upgrades,
#upgradesHolder .pvp-upgrades {
    width: auto !important;
    border: 1px solid #c2e0dc;
}
#upgradesHolder .support-upgrades .unit-info .other .amount{
    left: 143px;
}
#upgradesHolder .support-upgrades .unit-info .other .name{
    padding-left: 3px;
}
#upgradesHolder .support-upgrades .button.buy{
    width: 167px;
}
#upgradesHolder .upgrade {
    color: #000000;
    background: #ffffff;
    margin-bottom: 5px;
    height: 88px;
    position: relative;
    border: solid 1px lightgrey;
}
#upgradesHolder .pvp .upgrade {
    height: 95px;
}
#upgradesHolder .support-upgrades.autoclicker .upgrade {
    width: 315px;
    display: inline-block;
    color: #000000;
    background: #ffffff;
    margin-bottom: 10px;
    height: 92px;
    position: relative;
    border: solid 1px lightgrey;
}
#upgradesHolder .support-upgrades .upgrades.pvp  .effect {
    display: block;
    /*font: 16px/21px 'titilliumWebSemiBold';*/
    font: 11px/15px 'titilliumWebSemiBold';
    color: #009245;
    text-align: right;
    margin-top: 0px;
}
#upgradesHolder .autoclicker .upgrade.green {
    /*background: #617a46;*/
    background: linear-gradient(to right, #46573B , #7A8F66);
    color: white;
}
/*#upgradesHolder .autoclicker .upgrade:nth-child(2n) {
    margin-left: 16px;
}*/
#upgradesHolder .upgrade > div {
    display: inline-block;
    vertical-align: top;
}
#upgradesHolder .upgrade .upgrade-info {
    padding: 5px;
    padding-top: 7px;
    width: 88px;
    /*height: 53px;*/
    /*height: 75px;*/
    height: 79px;
    border-right: 1px solid #dfeded;
}
#upgradesHolder .dpc-upgrades .upgrade .upgrade-info {
    /*width: 113px;*/
    width: 100px;
    padding-top: 4px;
}
#upgradesHolder .special-upgrades .upgrade .upgrade-info {
    padding-top: 4px;
}
/* custom css for sorting ugprades on army setup */

#upgradesHolder .content .dpc-upgrades {
    display: flex;
    flex-direction: column;
}
#upgradesHolder .content .dpc-upgrades .disabled-upgrade {
    order: 1;
}
.green-upgrade {
    background: rgba(200,255,200,0.5) !important;
}
#upgradesHolder .dpc-upgrades > .upgrade:not(.disabled-upgrade) {
    background: rgba(210,240,255,0.5);
}
#upgradesHolder .dpc-upgrades > .upgrade:not(.disabled-upgrade) ~ .upgrade:not(.disabled-upgrade),
#upgradesHolder .dpc-upgrades .ignore-sort
{
    background: white !important;
}
#upgradesHolder .dpc-upgrades > .upgrade:not(.disabled-upgrade) ~ .upgrade:not(.disabled-upgrade):before,
#upgradesHolder .dpc-upgrades .ignore-sort:before{
    content: none !important;
}
#upgradesHolder .content .dpc-upgrades .green-upgrade.disabled-upgrade:not(:nth-of-type(2)),
#upgradesHolder .content .dpc-upgrades .green-upgrade.disabled-upgrade {
    margin-top: 20px;
}
#upgradesHolder .dpc-upgrades > .upgrade:not(.disabled-upgrade):not(.green-upgrade):before {
    display: inline-block;
    content: 'Best DPC/BS ratio you can buy!';
    position: absolute;
    top: -20px;
    background: #00c0ff;
    right: 0;
    padding: 3px 10px;
    color: white;
}
#upgradesHolder .content .dpc-upgrades .green-upgrade:before {
    display: inline-block;
    content: 'Best DPC/BS ratio!';
    position: absolute;
    top: -20px;
    background: #4bada4;
    right: 0;
    padding: 3px 10px;
    color: white;
}
/* end custom css for sorting */
#upgradesHolder .upgrade .upgrade-info-buy .cost,
#upgradesHolder .support-upgrades .cost {
    /*font: 10px/18px 'titilliumWebRegular';*/
    font: 12px/25px 'titilliumWebSemiBold';
    /*padding-left: 4px;*/
    padding-left: 1px;
 }
#upgradesHolder .content.support .support-upgrades .cost {
    padding-left: 5px;
}
.cost,#upgradesHolder .support-upgrades .cost{
    /*margin-left: 4px;*/
    font: 13px/26px 'titilliumWebSemiBold';
}
#upgradesHolder .support-upgrades .upgrades .amount {
    font: 14px/18px 'titilliumWebSemiBold';
    padding-top: 4px;
    padding-left: 10px;
}
#upgradesHolder .support-upgrades.pvp .upgrades .amount {
    font: 12px/18px 'titilliumWebRegular';
}
#upgradesHolder .support-upgrades.pvp .upgrades .amount > span{
    font: 14px/25px 'titilliumWebSemiBold';
}
#upgradesHolder .support-upgrades .upgrades.power .effect,
#upgradesHolder .support-upgrades .upgrades.dpc .effect
{
    padding-right: 1px;
    display: block;
    font: 15px/21px 'titilliumWebSemiBold';
    color: #009245;
    text-align: right;
    margin-top: -3px;
}
#upgradesHolder .support-upgrades .upgrades.pvp .desc {
    font: 14px/18px 'titilliumWebSemiBold';
}
#upgradesHolder .icon {
    margin-top: -4px;
}
#upgradesHolder .upgrades.pvp .icon.pvp  {
    margin-left: 9px;
}
#upgradesHolder .support-upgrades.pvp .type-heading > div:first-child  {
    width: 199px;
}
#upgradesHolder .upgrade .name {
    display: block;
    color: #666666;
    font: 14px/17px 'titilliumWebSemiBold';
    margin-top: -2px;
}
#upgradesHolder .dpc-upgrades .upgrade .name {
    color: #4d4d4d;
    font: 12px/14px 'titilliumWebSemiBold';
    margin-top: 0px;
}
#upgradesHolder .special-upgrades .upgrade .name {
    color: #4d4d4d;
    font: 12px/14px 'titilliumWebSemiBold';
    margin-top: 0px;
    text-align: center;
}
#upgradesHolder .upgrade .upgrade-info .amount {
    display: block;
    font: 14px/18px 'titilliumWebSemiBold';
}
#upgradesHolder .dpc-upgrades .upgrade .upgrade-info .amount {
    display: inline;
    font: 12px/16px 'titilliumWebSemiBold';
    color: #22b573;
}
#upgradesHolder .dpc-upgrades .upgrade .upgrade-info .upgrade-lvl {
    font: 12px/14px 'titilliumWebSemiBold';
    color: #000000;
}
#upgradesHolder .upgrade .upgrade-info .upgrade-icon {
    margin-top: 7px;
    width: 90px;
    height: 50px;
    background: url("../images/new/warZone/upgrades/10_upgrades_sprite.png?v=2");
}
#upgradesHolder .dpc-upgrades .upgrade .upgrade-info .upgrade-icon {
    position: absolute;
    bottom: 0px;
    left: 9px;
}
#upgradesHolder .upgrade .upgrade-info .upgrade-icon.fuel {
    margin-top: -3px;
    width: 88px;
    height: 80px;
    background: url('../images/new/warZone/tc/barrels.png');
    transform: scale(0.7);
}
#upgradesHolder .upgrade .upgrade-info .upgrade-icon.doubleDPC {
    margin-top: 12px;
    margin-left: 22px;
    width: 44px;
    height: 43px;
    background: url('../images/new/warZone/2xdpc.png');
}
#upgradesHolder .upgrade .upgrade-info-buy {
    width: calc(100% - 126px);
    padding: 10px 16px;
    padding-top: 7px;
    padding-right: 7px;
}
#upgradesHolder .dpc-upgrades .upgrade .upgrade-info-buy {
    /*background: url('../images/new/warZone/upgrades/upgrade_square.png');*/
    margin-top: 3px;

    margin-left: -1px;
    padding: 0px;
}
#upgradesHolder .upgrade .upgrade-info-buy .tier-info {
    /*width: 154px;*/
    width: 167px;
    height: 25px;
    padding: 6px 7px 4px 7px;

    margin-top: -4px;
    font: 10px/15px 'titilliumWebRegular';
    color: #666666;

    background: url('../images/new/warZone/upgrades/upgrade_square.png') no-repeat;
    background-size: 100% 100%;
}
#upgradesHolder .upgrade .upgrade-info-buy .tier-info .tier-lvl {

}
#upgradesHolder .dpc-upgrades .upgrade .upgrade-info-buy .upgrades-to-tier {
    /*font: 10px/15px 'titilliumWebBold';*/
}
#upgradesHolder .upgrade .upgrade-info-buy .tier-info .tier-progress {
    border: 1px solid #fbb03b;
    background: #ffffff;
    height: 5px;
    transition: transform 100ms;
}
#upgradesHolder .upgrade .upgrade-info-buy .tier-info .tier-progress:after {
    background: #fbb03b;
    border-radius: 0;
    transition: transform 100ms;
}
#upgradesHolder .upgrade .upgrade-info-buy .additional-upgrade-info {
    display: block;
    font: 9px/10px 'titilliumWebRegular';
    color: black;
    font-style: italic;
    text-align: right;
    margin-top: -1px;
    margin-right: 21px;
    position: absolute;
}
#upgradesHolder .upgrade .upgrade-info-buy .effect {
    display: block;
    font: 14px/21px 'titilliumWebSemiBold';
    color: #009245;
    text-align: right;
    margin-top: 23px;
    margin-right: 10px;
}
#upgradesHolder .upgrade .upgrade-info-buy .effect.hq-effect {
    margin-top: 0px;
    margin-right: 6px;
    font: 13px/21px 'titilliumWebSemiBold';

    color: #009245;
}
#upgradesHolder .upgrade > span {
    display: inline-block;
    padding: 3px;
    margin-left: 10px;
    min-width: 50px;
    font: 12px/12px 'titilliumWebRegular';
    border: 1px solid #000000;
}
#upgradesHolder .button.buy {
    display: inline-block;
    /*width: 155px;*/
    /*width: 147px;*/
    width: 151px;
    width: 165px;
    border-radius: 5px;
    background: #cfd6d7;
    color: #000000;
    /*height: 25px;*/
    height: 23px;
    font: 10px/12px 'titilliumWebSemiBold';
    line-height: 23px;
    position: absolute;
    bottom: 8px;
    padding: 3px 0 3px 5px;
    /*right: 4px;*/
}
#upgradesHolder .dpc-upgrades .button.buy {
    /*right: 7px;*/
    right: 5px;
    bottom: 6px;
}
#upgradesHolder .special-upgrades .button.buy {
    bottom: 6px;
    right: 8px;
}
#upgradesHolder .autoclicker .button.buy {
    width: auto;
    padding: 3px 0 3px 0px;
}
#upgradesHolder .button.buy.disabled {
    opacity: 0.7;
    pointer-events: none;
}
#upgradesHolder .button.buy > span:not(.cost) {
    border: 1px #f7931e solid;
    display: inline-block;
    background: #f7931e;
    color: #ffffff;
    width: 60px;
    font: 13px/28px 'titilliumWebBold';
    border-radius: 5px;
    padding: 0 5px;
    /*height: 29px;*/
    height: 27px;
    text-align: center;
    float: right;
    margin-top: -3px;

}
#upgradesHolder .support-upgrades.regular .button.buy > span:not(.cost) {
    font: 13px/27px 'titilliumWebBold';
}
#upgradesHolder .button.buy.disabled {
    pointer-events: none;
    background: #808080;
}
#upgradesHolder .button.buy:hover {
    opacity: 1;
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
}
#upgradesHolder .button.buy:hover > span:not(.cost) {
    border: 1px #ffffff dashed;
}
#upgradesHolder .support .headings {
    width: calc(100% - 30px);
    border: none;
    margin-left: 6px;

    border-right: 1px solid #4bada4;
}
#upgradesHolder .headings > div {
    display: inline-block;
    padding: 5px 20px;
    width: calc(30% - 1px - 40px);
    border-left: 1px solid #ffffff;
    font: 14px/15px 'titilliumWebSemiBold';
}
#upgradesHolder .headings > div:first-child {
    width: calc(40% - 1px - 40px);
}
#upgradesHolder .headings > div {
    background: #4bada4;
    color: #ffffff;
}
#upgradesHolder .headings > div:first-child {
    background: none;
}
#upgradesHolder .support .scroll
{
    overflow-y: scroll;
    width: auto;
    height: calc(100% - 19px);
    padding: 0 6px;
    border: none
}
#upgradesHolder .pvp .scroll {
    overflow-y: scroll;
    width: auto;
    height: calc(100% - 1px);
    padding: 0 6px;
    border: none
}
#upgradesHolder .autoclicker .scroll {
    overflow-y: scroll;
    width: auto;
    height: calc(100% - 1px);
    padding: 0 6px;
    border: none
}
#upgradesHolder .support-upgrades > div > div {
    display: inline-block;
    padding: 5px 20px;
    width: calc(30% - 1px - 20px);
    border-left: 1px solid #ffffff;
    padding-right: 0px;
}
#upgradesHolder .support-upgrades.pvp > div > div {
    padding: 5px 0;
    width: calc(33% - 1px);
}
#upgradesHolder .support-upgrades.pvp > div > div.pvp {
    width: calc(27% - 1px);
}
#upgradesHolder .support-upgrades.pvp .unit-info {
    width: calc(40% - 1px - -22px);
}
#upgradesHolder .support-upgrades.pvp .upgrades:not(.pvp) {
    width: calc(33% - 36px);
}
#upgradesHolder .support-upgrades.autoclicker .upgrades1 {
    padding-left: 0px;
    padding-top: 15px;
    border-left: none;
    font: 12px/15px 'titilliumWebRegular';
}
#upgradesHolder .support-upgrades.autoclicker .upgrades2 {
    margin-left: 14px;
    height: 100%;
    width: 86px;
    color: #f7931e;
}
#upgradesHolder .support-upgrades.autoclicker .upgrades2 > .desc {
    font: 11px/13px 'titilliumWebBold';
    margin-top: 28px;
}
#upgradesHolder .support-upgrades.autoclicker .upgrades2 > .desc > .price-value {
    padding-left: 16px;
    display: inline-block;
}
#upgradesHolder .support-upgrades.autoclicker .upgrades2  .check-image {
    width: 36px;
    height: 28px;
    background: url('../images/new/warZone/upgrades/check.png') center no-repeat;
    margin: 24px auto;
}
#upgradesHolder .support-upgrades > div > div:first-child {
    width: calc(40% - 1px - 15px);
}
#upgradesHolder .support-upgrades .headings > div {
    background: #4bada4;
    color: #ffffff;
}
#upgradesHolder .support-upgrades .headings > div:first-child {
    background: none;
}
#upgradesHolder .support-upgrades .type-heading  > div {
    padding: 5px 20px;
    background: #3f4651;
    color: #ffffff;
}
#upgradesHolder .support-upgrades .type-heading  > div:not(:first-child) {
    background: #6b7982;
    vertical-align: top;
    font: 15px/16px 'titilliumWebSemiBold';
}
#upgradesHolder .support-upgrades .type-heading  > div:first-child {
    padding-left: 25px;
    margin-left: -10px;
    width: 213px;
}
#upgradesHolder .support-upgrades .type-heading  > div:nth-child(2) {
    width: 147px;
}
#upgradesHolder .support-upgrades .type-heading  > div:nth-child(3) {
    margin-left: -2px;
    width: 148px;
}
#upgradesHolder .support-upgrades .type-heading .icon-type {
    vertical-align: bottom;
    margin-left: 20px;
}
#upgradesHolder .support-upgrades .unit-info {
    padding-left: 0;
}
#upgradesHolder .support-upgrades .icon-type {
    display: inline-block;
    width: 26px;
    height: 16px;
    background: url('../images/new/warZone/monitor/asl_icons_sprite.png') no-repeat;
    margin-left: -6px;
    margin-right: 10px;
}
#upgradesHolder .support-upgrades .icon-type.air {
    background-position: -26px;
}
#upgradesHolder .support-upgrades .icon-type.water {
    background-position: -52px;
}
#upgradesHolder .support-upgrades .upgrade {
    margin-bottom: 5px;
}
#upgradesHolder .support-upgrades .upgrade .unit-info > div {
    display: inline-block;
}
#upgradesHolder .unit-info .name {
    display: inline-block;
    padding-left: 8px;
}
#upgradesHolder .unit-info .icon-type {
    background-color: #3f4651;
    background-origin:content-box;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
    padding: 5px 0;
    border-right: 15px solid #3f4651;
    border-left: 15px solid #3f4651;
}
#upgradesHolder .unit-info .unit-icon {
    width: 74px;
    height: 34px;
    padding: 17px 2px;
    background-origin: content-box;
    background: #dddddd url('../images/new/warZone/upgrades/units_inside_tents_min.png') center no-repeat;
    border: 1px solid grey;
    /*margin-right: 15px;*/
    margin-right: 4px;
    margin-top: 2px;
    margin-left: -3px;
}
#upgradesHolder .pvp .unit-info .unit-icon {
    margin-top: 7px;
}
#upgradesHolder .autoclicker .unit-info .unit-icon {
    background: url('../images/new/warZone/upgrades/turret.png') center no-repeat;
    border: none;
}
#upgradesHolder .unit-info .other {
    padding-top: 0px;
    vertical-align: top;
    font: 19px/15px 'titilliumWebSemiBold';
    width: 63px;
}
#upgradesHolder .autoclicker .unit-info .other {
    margin-top: -21px;
}
#upgradesHolder .unit-info .other .name{
    padding-top: 2px;
}
#upgradesHolder .pvp .unit-info .other .name {
    padding-top: 5px;
}
#upgradesHolder .unit-info .other .amount{
    font: 20px/15px 'titilliumWebRegular';
    display: inline-block;
    position: absolute;
    /*left: 153px;*/
    left: 147px;
    top: 60px;
}
#upgradesHolder .pvp .unit-info .other .amount {
    margin-top: 5px;
}
#upgradesHolder .support-upgrades .button.buy {
    display: block;
    margin: 0 5px;
    /*margin-left: 11px;*/
}
#upgradesHolder .support-upgrades.pvp .button.buy {
    margin: 0 7px;
    /*margin-left: 14px;*/
}
#upgradesHolder .support-upgrades .button.buy.extended {
    padding-top: 30px;
}
#upgradesHolder .support-upgrades .price{
    position: absolute;
    font: 12px/15px 'titilliumWebRegular';
    top: 28px;
    right: 6px;
}
#upgradesHolder .support-upgrades .sale-plaquette{
    position: absolute;
    font: 13px/38px 'titilliumWebSemiBold';
    background: url("../images/new/warZone/upgrades/price.png");
    width: 41px;
    height: 40px;
    top: -8px;
    right: -12px;
    padding: 0;
    border: none;
    color: white;
    text-align: center;
}
#upgradesHolder .support-upgrades .old-price{
    position: absolute;
    font: 12px/13px 'titilliumWebSemiBold';
    width: 60px;
    height: 9px;
    right: 30px;
    top: 11px;
    padding: 0;
    border: none;
    text-align: center;
}
#upgradesHolder .support-upgrades .old-price > .icon.gold{
    position: relative;
    top: 1px;
}
#upgradesHolder .support-upgrades .old-price > .line{
    position: absolute;
    background: url("../images/new/warZone/upgrades/line.png");
    width: 51px;
    height: 9px;
    top: 3px;
}
/* END ANDRAZ CSS */

#dailyTaskHolder{
    position: absolute;
    top: 100px;
    left: 254px;
    width: 687px;
    height: 351px;
    font: 14px/28px 'titilliumWebRegular';
    background: url("../images/new/warZone/bg.png");
}
#dailyTaskHolder .top {
    position: relative;
    margin: 21px;
    margin-top: 17px;
    width: 95%;
    height: 20%;
    font: 14px/22px 'titilliumWebBold';
}
#dailyTaskHolder .top .upgrade-info {
    position: absolute;
    margin-left: 23px;
    margin-top: 17px;
    width: 268px;
    height: 98px;
}
#dailyTaskHolder  .top .daily-task-info > div {
    display: inline-block;
    vertical-align: middle;
}
#dailyTaskHolder  .top .daily-task-info .daily-task-icon {
    display:inline-block;
    width: 40px;
    height: 36px;
    background: url("../images/new/warZone/icon_daily_missions.png");
}
#dailyTaskHolder .top .daily-task-info .daily-task-header {
    display: inline-block;
    color: #f7931e;
    font-size: 23px;
    margin-top: 8px;
    margin-left: 14px;
}
#dailyTaskHolder .top .daily-task-info .info-button {
    display: inline-block;
    margin-top: 12px;
    margin-left:17px;
    width: 19px;
    height: 19px;
    background: url("../images/new/bootCamp/question_mark.png");
}
#dailyTaskHolder .top .countdown-timer {
    position: absolute;
    right: auto;
    bottom: auto;
    left: 335px;
    top: 47px;
    width: auto;
    padding: 1px 15px 0px 8px;
    font: 13px/22px 'titilliumWebSemiBold';
    color: white;
    text-align: center;
    border: 1px solid grey;
}
#dailyTaskHolder .top .daily-mission-note {
    position: absolute;
    right: auto;
    bottom: auto;
    left: -2px;
    top: 49px;
    width: auto;
    padding: 1px 15px 0px 8px;
    font: 13px/19px 'titilliumWebRegular';
    color: white;
    text-align: center;
    border-radius: 0px;
}
#dailyTaskHolder .bottom {
    position: relative;
    margin-top: -10px;
    width: 100%;
    height: 80%
}
#dailyTaskHolder .bottom .bottom-header{
    color: white;
}
#dailyTaskHolder .bottom .description{
    margin-top: 10px;
    font: 14px/20px 'titilliumWebRegular';
}
#dailyTaskHolder .bottom .reward-holder{
    position:absolute;
    right: 0px;
    font: 12px/24px 'titilliumWebRegular';
    color: white;
    float: right;
    top: 137px;
    margin-right: 21px;
}
#dailyTaskHolder .bottom .icon{
    position: absolute;
    right: 0px;
    top: 140px;
    margin-right: -2px;
    transform: scale(0.8);
}
#dailyTaskHolder .bottom .button{
    position:absolute;
    right: 0px;
    color: white;
    float: right;
    padding: 2px 13px;
    border-radius: 4px;
    top: 169px;
    font: 14px/24px 'titilliumWebBold';
}
#dailyTaskHolder .left {
    position: relative;
    float: left;
    margin-top: 15px;
    margin-left: 40px;
    width: 40%;
    height: 71%;
}
#dailyTaskHolder .right {
    position: relative;
    float: left;
    margin-top: 13px;
    margin-left: 55px;
    width: 41%;
    height: 71%;
}
#achievementsHolder {
   /* z-index: 12;*/
}
#achievementsHolder .header .title-icon {
    background-position-x: -84px;
}
#achievementsHolder .header .close:hover {
    background-position-x: -25px;
    /*cursor: url("../images/cursorPointer.ico") 11 1, pointer;*/
}
#achievementsHolder .achievements-progress-text {
    display: inline-block;
    margin-left: 17px;
    vertical-align: middle;
    font: 16px/22px 'titilliumWebSemiBold';
}
#achievementsHolder .achievements-progress {
    width: 459px;
    height: 20px;
    background: #000000;
    margin-left: 12px;
    border-radius: 8px;
    overflow: hidden;
    display: inline-block;
    vertical-align: middle;
}
#achievementsHolder .achievements-progress.progress-bar:after {
    background: orange;
}
#achievementsHolder .achievements-progress .percentage-done {
    color: white;
    position: relative;
    z-index: 1;
    left: 192px;
    font: 16px/21px 'titilliumWebSemiBold';
    text-shadow: 1px 1px 0 black, 1px -1px 0 black, -1px 1px 0 black, -1px -1px 0 black;
}
#achievementsHolder .achievements-progress-ratio {
    font: 14px/22px 'titilliumWebRegular';
    display:inline-block;
    margin-left: 7px;
    position: relative;
    top: 2px;
}
#achievementsHolder .achievements-progress-ratio .amount{
    color: orange;
    font: 19px/22px 'titilliumWebSemiBold';
}
#achievementsHolder .achievements-units-holder {
    height: 389px;
    margin-top: 11px;
    overflow-y: scroll;
}
#achievementsHolder .achievements-unit {
    position: relative;
    margin-left: 15px;
    margin-top: 8px;
    width: 307px;
    height: 95px;
    display: inline-block;
    background: url('../images/new/bootCamp/square.png') 0 0px;
}
#achievementsHolder .achievements-unit .left{
    display: inline-block;
    width: 92px;
    height: 93px;
}
#achievementsHolder .achievements-unit .left .achievement-icon{
    margin-left: 6px;
    margin-top: -3px;
    width: 80px;
    height: 80px;
    background: url('../images/new/warZone/achievements/sprite_units_min_vse.png');
}
#achievementsHolder .achievements-unit .left .done-value{
    position: absolute;
    top: 67px;
    width: 92px;
    height: 16px;
    color: white;
    text-align: center;
    font: 12px/22px 'titilliumWebRegular';
}
#achievementsHolder .achievements-unit .left .done-value .denom{
    color: #f7931e;
    font: 18px/22px 'titilliumWebBold';
}
#achievementsHolder .achievements-unit .right{
    display: inline-block;
    width: 193px;
    height: 93px;
    margin-left: 17px;
    margin-top: 13px;
    position: absolute;
}
#achievementsHolder .achievements-unit .right > div{
    text-align:left;
    color: white;
}
#achievementsHolder .achievements-unit .right .title{
    width: 189px;
    height: 16px;
    font: 12px/22px 'titilliumWebBold';
}
#achievementsHolder .achievements-unit .right .instructions{
    width: 190px;
    height: 22px;
    font: 12px/22px 'titilliumWebRegular';
}
#achievementsHolder .single-achievement-progress {
    position: absolute;
    margin-top: 12px;
    width: 104px;
    height: 10px;
    background: #000000;
    margin-left: 0px;
    border-radius: 8px;
    overflow: hidden;
    display: inline-block;
    vertical-align: middle;
}
#achievementsHolder .single-achievement-progress.progress-bar:after {
    background: orange;
}
#achievementsHolder .achievements-unit .right .reward{
    font: 12px/22px 'titilliumWebRegular';
    margin-top: 21px;
    width: 198px;
    height: 22px;
}
#quickBuyCurtain{
    position:relative;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
}
#quickBuy {
    position: relative;
    position: absolute;
    top: 168px;
    left: 470px;
    width: 200px;
    margin: 0 auto;
    padding: 18px;
    font: 12px/19px 'titilliumWebSemiBold';
    color: white;
    /*top: 123px;*/
    background: #3f4651;
    border: 1px solid darkgrey;
    padding-right: 33px;
}
#quickBuy > .note{
    font: 11px/13px 'titilliumWebSemiBold';
    font-style: italic;
    color: #cccccc;
    margin-top: 4px;
    display: inline-block;
}
#quickBuy .or-special{
    font: 12px/27px 'titilliumWebSemiBold';
}
#quickBuy .x{
    top: 0px;
    right: 1px;
}
#quickBuy > .next-chance{
    font: 11px/19px 'titilliumWebRegular';
    color: #cccccc;
}
#quickBuy .button.quick-buy {
    background: #ecf0f1;
    width: 129px;
    height: 20px;
    border-radius: 5px;
    color: #333333;
    font: 12px/19px 'titilliumWebSemiBold';
    margin-top: 6px;
}
#quickBuy .button.quick-buy.DPC30s {
    margin-top: 10px;
}
#quickBuy .button.quick-buy.DPC30s.disabled {
    opacity: 0.7;
}
#quickBuy .button.quick-buy.unlock {
    margin-top: 10px;
}
#quickBuy .button.quick-buy:nth-of-type(1) {
    margin-top: 10px;
}
#quickBuy .button.quick-buy > span:nth-of-type(1){
    width: 62px;
    display: inline-block;
    text-align: center;
    font: 11px/19px 'titilliumWebBold';
    color: #333333;
}
#quickBuy .button.quick-buy > div{
    background: #f7931e;
    color: white;
    width: 67px;
    height: 100%;
    display: inline-block;
    float: right;
    border-radius: 5px;
    text-align:center;
    font: 11px/19px 'titilliumWebBold';
}
#quickBuy .button.quick-buy .icon_07{
    margin-top: -8px;
}
#quickBuy .quick-time{
    border: 1px solid white;
    border-radius: 4px;
    color: white;
    display: inline-block;
    text-align: center;
    width: 26px;
    margin-top: 5px;
}
#quickBuy .watch-to-unlock{
    font: 11px/19px 'titilliumWebBold';
    background: #4bada4;
    border-radius: 6px;
    color: white;
    width: 129px;
    text-align: center;
    padding: 1px 0;
}
#quickBuy .watch-to-unlock > div{
    display: inline-block;
}
#quickBuy .icon.video{
    width: 20px;
    height: 20px;
    background: url('../images/new/warZone/monitor/new/video.png');
}

/* autoclicker */

#minigunFlash1 {
    position: absolute;
    top: 13px;
    left: 117px;
    height: 34px;
    width: 34px;
    background: url('../images/new/warZone/sprite_Explosion_small.png');
    opacity: 0;
    transform: scale(0.8);
}
#minigunFlash1.turret1 {
    top: 4px;
    left: 133px;
}
#minigunFlash2 {
    position: absolute;
    top: 51px;
    left: 117px;
    height: 34px;
    width: 34px;
    background: url('../images/new/warZone/sprite_Explosion_small.png');
    opacity: 0;
    transform: scale(0.8);
}
#minigunFlash2.turret2 {
    top: 32px;
    left: 113px;
}
#minigunFlash3 {
    position: absolute;
    top: 44px;
    left: 105px;
    height: 34px;
    width: 34px;
    background: url('../images/new/warZone/sprite_Explosion_small.png');
    opacity: 0;
    transform: scale(0.8);
}
#minigunFlash3.turret3 {
    top: 61px;
    left: 93px;
}
#minigunFlash1.turret4 {
    top: 40px;
    left: 108px;
}
#minigunFlash2.turret4{
    top: 85px;
    left: 109px;
}
.minigun-shooting.enabled {
    animation: minigunFlash 0.2s infinite;
    animation-timing-function: steps(1);
}
@keyframes minigunFlash {
    0%		{ background-position: 0 0; opacity: 1.0; }
    11%		{ background-position: -34px 0; }
    22%		{ background-position: -68px 0; }
    33%		{ background-position: 0 -34px; }
    44%		{ background-position: -34px -34px; }
    55%		{ background-position: -68px -34px; }
    66%		{ background-position: 0px -68px; }
    77%		{ background-position: -34px -68px; }
    88%		{ background-position: -68px -68px; opacity: 0.5; }
    99%		{ background-position: -68px -68px; opacity: 0; }
    100%    { background-position: -68px -68px; opacity: 0; }
}

#requirementsPopupCurtain {
    width: 1000px;
    height: 550px;
    background: rgba(0, 0, 0, 0.7);
    position: absolute;
    top: 0px;
}
#requirementsPopupHolder {
    position: relative;
    margin: 0 auto;
    margin-top: 126px;
    width: 357px;
    height: 307px;
    background: yellow;
    background: url('../images/new/warZone/wz_splosno/requirements_popup_sprite.png');
    padding-left: 18px;
    padding-right: 18px;
    left: 109px;
    left: 0px;
}
#requirementsPopupHolder.country-hq {
    background-position-x: -393px;
}
#requirementsPopupHolder.spw {
    background-position-x: -786px;
}
#requirementsPopupHolder.daily-rewards {
    background-position-x: 0px;
}
#requirementsPopupHolder.support-power {
    background-position-x: -1179px;
}
#requirementsPopupHolder > .x{
    top: 5px;
    right: 13px;
}
#requirementsPopupHolder .header{
    font: 14px/47px 'titilliumWebBold';
    color: #f7931e;
    height: 47px;
    width: 100%;
}
#requirementsPopupHolder .info-text{
    padding-top: 17px;
    font: 12px/21px 'titilliumWebSemiBold';
    color: white;
}
#requirementsPopupHolder .info-text > .stressed{
    font: 14px/23px 'titilliumWebSemiBold';
    color: #00A99D;
}
/*#dailyResetInfoHolder {*/
    /*position: relative;*/
    /*margin: 0 auto;*/
    /*margin-top: 12px;*/
    /*width: 304px;*/
    /*height: 522px;*/
    /*background: yellow;*/
    /*background: url('../images/new/warClicks/wc_splosno/daily_reset_base.png');*/
    /*padding-left: 18px;*/
    /*padding-right: 18px;*/
/*}*/
/*#dailyResetInfoHolder .close{*/
    /*width: 15px;*/
    /*height: 16px;*/
    /*background: url('../images/new/warClicks/wc_splosno/daily_reset_close.png');*/
    /*position: absolute;*/
    /*right: 12px;*/
    /*top: 11px;*/
/*}*/
/*#dailyResetInfoHolder .close:hover{*/
    /*transform: scale(1.1);*/
    /*filter: brightness(120%);*/
/*}*/
/*#dailyResetInfoHolder > .header {*/
    /*font: 14px/18px 'titilliumWebBold';*/
    /*color: #f7931e;*/
    /*height: 53px;*/
    /*padding-top: 13px;*/
/*}*/
/*#dailyResetInfoHolder > .sub-header {*/
    /*font: 12px/28px 'titilliumWebBold';*/
    /*color: white;*/
    /*height: 64px;*/
    /*padding-top: 7px;*/
/*}*/
/*#dailyResetInfoHolder > .sub-header .daily-reset {*/
    /*width: 70px;*/
    /*height: 29px;*/
    /*background: url('../images/new/warClicks/wc_splosno/daily_reset_icon.png');*/
    /*margin-left: 14px;*/
    /*display: inline-block;*/
/*}*/
/*#dailyResetInfoHolder > .sub-header .daily-reset .time-left {*/
    /*font: 10px/14px 'titilliumWebSemiBold';*/
    /*width: 40px;*/
    /*height: 14px;*/
    /*margin-left: 5px;*/
    /*margin-top: 3px;*/
/*}*/
/*#dailyResetInfoHolder > .sub-header .daily-reset .time-left > div {*/
    /*color: white;*/
    /*display: inline-block;*/
/*}*/
/*#dailyResetInfoHolder > .sub-header .daily-reset .time-left > .minutes-left{*/
    /*margin-left: 1px;*/
/*}*/
/*#dailyResetInfoHolder > .info-text {*/
    /*padding-top: 6px;*/
    /*font: 12px/23px 'titilliumWebSemiBold';*/
    /*color: white;*/
/*}*/
/*#dailyResetInfoHolder > .info-text > .title{*/
    /*font: 14px/23px 'titilliumWebSemiBold';*/
    /*color: #00A99D;*/
/*}*/
/*#dailyResetInfoHolder > .info-text > .entries{*/
     /*font: 12px/23px 'titilliumWebSemiBold';*/
/*}*/
/*#dailyResetInfoHolder > .info-text > .tip{*/
    /*font: 12px/14px 'titilliumWebSemiBold';*/
    /*font-style: italic;*/
    /*color: #999999;*/
/*}*/

#ranksPopupHolder{
    position: absolute;
    width: 218px;
    height:130px;
    background: url('../images/new/warZone/wz_splosno/popup_base.png?v2');
    top: 10px;
    left: 11px;
    padding: 10px;
    padding-left: 16px;
    padding-right: 18px;
    font: 12px/17px 'titilliumWebSemiBold';
    color: #cccccc;
}
#ranksPopupHolder .x{
    top: 2px;
    right: 5px;
}
#ranksPopupHolder .orange{
    color: #f7931e;
}
#ranksPopupHolder .rank-holder{
    margin-top: 5px;
}
#ranksPopupHolder .bs-reward-holder{
    font: 12px/12px 'titilliumWebSemiBold';
    color: #39b54a;
    display: inline-block;
}
#ranksPopupHolder .bs-reward-holder > div{
    display: inline-block;
}
#ranksPopupHolder .bs-reward-holder .value{
    display: inline-block;
    margin-left: 21px;
}
#ranksPopupHolder .baseDPC-reward-holder{
    font: 12px/12px 'titilliumWebSemiBold';
    color: #39b54a;
    display: inline-block;
    position: absolute;
    right: 22px;
    margin-top: 2px;
}
#ranksPopupHolder .reward-generic-text{
    font: 12px/12px 'titilliumWebSemiBold';
    color: #cccccc;
}
#ranksPopupHolder .reward-holder{
    margin-top: 14px;
}
#ranksPopupHolder .rank-name{
    color: #00a99d;
    display: inline-block;
    margin-left: 6px;
    vertical-align: top;
    font: 12px/38px 'titilliumWebSemiBold';
}
#ranksPopupHolder .rank-img{
    display: inline-block;
    margin-left: -20px;
    left: 767px;
    top: 9px;
    width: 88px;
    height: 38px;
    background: url("../images/warZone/ranks.png");
    background-position-x: 0%;
    background-position-y: 0%;
    transform: scale(0.6) rotate(180deg);
}
#promoCodeRewardHolder{
    z-index: 1;
    position: absolute;
    width: 344px;
    height: 211px;
    background: url('../images/new/warZone/wz_splosno/square_popup.png');
    top: 49px;
    right: 211px;
    padding: 10px;
    padding-left: 16px;
    padding-right: 18px;
    font: 12px/17px 'titilliumWebSemiBold';
    color: #cccccc;
    text-align: center;
}
#promoCodeRewardHolder .header{
    margin-top: 9px;
    text-align: center;
    color: #ffff00;
    font: 16px/17px 'titilliumWebBold';
}
#promoCodeRewardHolder .text{
    margin-top: 13px;
    text-align: center;
    color: #333333;
    font: 12px/12px 'titilliumWebRegular';
}
#promoCodeRewardHolder .icon-holder{
    margin: 0 auto;
    margin-top: 5px;
    width: 313px;
    height: 87px;
    background: url('../images/new/warZone/paper_small.png');
    text-align: center;
}
#promoCodeRewardHolder .icon-holder .reward-icon {
    position: relative;
    width: 84px;
    height: 84px;
    top: 16px;
    margin-left: 10px;
    background: url("../images/new/warClicks/shop/rework/icon_sprite.png?v=2");
    background-position-x: 0%;
}
#promoCodeRewardHolder .icon-holder .reward-icon.gold{
    top: 15px;
}
#promoCodeRewardHolder .icon-holder .reward-icon.spw {
    top: 2px;
    background-position: -588px;
    transform: scale(0.63);
    margin-left: -2px;
}
#promoCodeRewardHolder .icon-holder .reward-icon.pvp {
    width: 55px;
    height: 55px;
    background: url("../images/new/warZone/wz_splosno/inside_squares_v2.png");
    top: 11px;
}
#promoCodeRewardHolder .icon-holder .reward-icon.tc {
    width: 55px;
    height: 55px;
    background: url("../images/new/warZone/wz_splosno/inside_squares_v2.png");
    background-position-x: -55px;
    top: 15px;
}
#promoCodeRewardHolder .icon-holder .reward-icon.double_dpc {
    width: 55px;
    height: 55px;
    background: url("../images/new/warZone/wz_splosno/inside_squares_v2.png");
    background-position-x: -110px;
    top: 14px;
    margin-left: 3px;
}
#promoCodeRewardHolder .icon-holder .reward-icon.unlock-tc {
    background-position: -420px;
}
#promoCodeRewardHolder .icon-holder .reward-icon.event_power_up {
    width: 37px;
    height: 43px;
    background: url("../images/new/eventGame/muscle_man/steroids.png");
    background-size: 100% 100%;
}
#promoCodeRewardHolder .icon-holder .reward-icon.research_points {
    width: 37px;
    height: 43px;
    background: url("../images/new/warClicks/wc_splosno/research_system/icons/command_centre_icon.png");
    background-size: 100% 100%;
}
#promoCodeRewardHolder .icon-holder .reward-description {
    position: absolute;
    top: 117px;
    font: 12px/18px 'titilliumWebSemiBold';
    color: #999;
    font-style: italic;
    right: 55px;;
}
#promoCodeRewardHolder .icon-holder > div {
    display: inline-block;
}
#promoCodeRewardHolder .icon-holder .reward-icon.gold{
    background-position-x: 0px;
    background: url("../images/new/warZone/inside_squares.png");
    width: 55px;
    height: 55px;
    transform: scale(1.0);
    margin-left: 1px;
}
#promoCodeRewardHolder .icon-holder .reward-icon.tw{
    background: url("../images/new/warZone/wz_splosno/icon_for_popup.png");
    width: 42px;
    height: 41px;
    top: 21px;
}
#promoCodeRewardHolder .reward-multiplier{
    font: 18px/18px 'titilliumWebSemiBold';
    color: #999999;
    margin-left: 6px;
    position: absolute;
    margin-top: 34px;
    vertical-align: middle;
    left: 130px;
}
#promoCodeRewardHolder .reward-title{
    font: 18px/18px 'titilliumWebSemiBold';
    color: #999999;
    margin-left: 6px;
    margin-top: 33px;
    vertical-align: top;
    left: 205px;
}
#promoCodeRewardHolder .subtext {
    color: #333333;
    font: 12px/12px 'titilliumWebRegular';
    text-align: center;
}
#promoCodeRewardHolder .thanks{
    width: 134px;
    height: 46px;
    background: url("../images/new/warZone/thanks_button_txt.png");
    margin-top: 7px;
    display: inline-block;
}
#promoCodeRewardHolder .x{
    display: none;
}
#promoCodePopupCurtain {
    z-index: 1;
    width: 1000px;
    height: 551px;
    background: rgba(0, 0, 0, 0.5);
    position: absolute;
    top: 0px;
}
#cvcEncitementPopup {
    position: absolute;
    bottom: 49px;
    left: 385px;
    width: 429px;
    /*height: 42px;*/
    height: 52px;
    border: solid 1px white;
    background: #202328;
    font: 11px/13px 'titilliumWebRegular';
    color: white;
}
#cvcEncitementPopup > .wave {
    position: absolute;
    top: 10px;
    left: 14px;
    width: 23px;
    height: 24px;
    background: url("../images/new/warZone/clap.png");
}
#cvcEncitementPopup > .req {
    color: #00ffff;
}
#cvcEncitementPopup > .info-text {
    width: 80%;
    left: 50px;
    position: relative;
    top: 7px;
}
#cvcEncitementPopup > .x {
    transform: scale(0.82);
    top: -5px;
    right: -1px;
}