/* TC partial start */
#tcHolder {
    /*background: none;
    text-align: center;*/
    z-index: 1;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: transparent;
}

#tcHolder .header {
    background: black;
}
/* TEMPORARZ UNTI LIT-s REWORKED! */
#tcHolder .tc-holder {
    /*transform: scale(0.75);*/
    left: 160px;
    position: relative;
    top: -70px;
}
#tcHolder .road {
    position: absolute;

    width: 674px;
    height: 400px;

    left: 0px;
    top: 150px;

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

    pointer-events: none;
}
#tcHolder .menu {
    position: absolute;

    width: 413px;
    height: 337px;

    left: 124px;
    top: 108px;

    /*border-radius: 48px 48px 110px 110px;*/

    /*background: radial-gradient(circle farthest-side at 50% 60%, #ffe800, #f79420);*/
    background: url('../images/new/warZone/tc/bg.png');

    /*box-shadow: 0 0 16px black;*/
}
#tcHolder .menu .header {
    position: absolute;

    width: 100%;
    height: 80px;

    top: 4px;

    font: 50px/50px 'titilliumWebBold';
    text-align: center;

    color: #231f20;
    background: none;
}
#tcHolder .menu .text-a {
    position: absolute;

    width: 260px;
    height: 60px;

    left: 30px;
    top: 52px;


    font: 14px/22px 'titilliumWebSemiBold';
    text-align: left;

    color: #231f20;
}
#tcHolder .menu .text-b {
    position: absolute;

    width: 150px;
    height: 60px;

    left: 125px;
    top: 206px;

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

    color: #231f20;
}
#tcHolder .menu .text-c {
    position: absolute;

    width: 40px;
    height: 200px;

    left: 338px;
    top: 47px;

    font: 17px/22px 'titilliumWebBold';
    text-align: left;

    color: #231f20;

    transform-origin: 0 0;
    transform: scaleX(1.0) scaleY(0.8);
}
#tcHolder .menu .bar {
    border-radius: 24px;
    border: 2px solid #333333;

    background: #333333;

    overflow: hidden;

    transform-origin: 0 50%;
    transform: scaleY(1.25);
    color: white;
}
#tcHolder .menu .bar:hover {
    background: white;
    color: black;
}
#tcHolder .menu .bar-shadow {
    border-radius: 24px;

    margin-top: 4px;

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

    transform-origin: 0 50%;
    transform: rotate(-4deg) scaleY(1.25);
}
#tcHolder .menu .bar .bar-text {
    position: relative;
    padding-top: 3px;
    font: 30px/30px 'titilliumWebBold';
    text-align: center;

    /*color: white;*/

    transform: scaleY(0.8);
}
#tcHolder .menu .bar.click, #tcHolder .menu .bar-shadow.click {
    position: absolute;

    width: 140px;
    height: 36px;

    left: 130px;
    top: 150px;

    cursor: url("public_html/assets/images/cursorPointer.ico"), pointer;
    cursor: url("../images/cursorPointer.ico") 11 1, pointer;
}
.times-left{
    position: absolute;
    left: 28px;
    top: 105px;
    color: white;
    font: 16px/16px 'titilliumWebSemiBold';
}
.barrel{
    position: absolute;
    width: 88px;
    height: 80px;
    background: url('../images/new/warZone/tc/barrels.png');

    color: white;
    font: 23px/38px 'titilliumWebBold';
    text-align: center;
}
.barrel.a{
    left: 15px;
    top: 216px;
    background-position-x: 0px;
}
.barrel.b{
    left: 85px;
    top: 262px;
    background-position-x: 264px;

}
.barrel.c{
    left: 244px;
    top: 265px;
    background-position-x: 176px;
}
.barrel.d{
    left: 326px;
    top: 218px;
    background-position-x: 88px;
}
.barrel-a {
    position: absolute;

    width: 84px;
    height: 82px;

    left: 10px;
    top: 250px;

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

    transition: top 0.125s ease-in-out;

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

    color: white;

    text-shadow: 1px 1px 0 black, -1px 1px 0 black, 1px -1px 0 black, -1px -1px 0 black;
}
.barrel-b {
    position: absolute;

    width: 88px;
    height: 80px;

    left: 70px;
    top: 320px;

    /*background: url("../images/warZone/tc_1/barrel_b.png");*/
    background: url('../images/new/warZone/tc/barrels.png');

    transition: top 0.125s ease-in-out;


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

    color: white;

    text-shadow: 1px 1px 0 black, -1px 1px 0 black, 1px -1px 0 black, -1px -1px 0 black;
}
.barrel-c {
    position: absolute;

    width: 129px;
    height: 60px;

    left: 220px;
    top: 330px;

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

    transition: top 0.125s ease-in-out;


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

    color: white;

    text-shadow: 1px 1px 0 black, -1px 1px 0 black, 1px -1px 0 black, -1px -1px 0 black;
}
.barrel-d {
    position: absolute;
    z-index: 2;

    width: 73px;
    height: 72px;

    left: 330px;
    top: 275px;

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

    transition: top 0.125s ease-in-out;

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

    color: white;

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

@keyframes anim_barrels {
    0%		{ transform: scaleX(1.0) scaleY(1.0); }
    50%		{ transform: scaleX(0.5) scaleY(2.0); }
    100%	{ transform: scaleX(1.0) scaleY(1.0); }
}

#tcHolder .finish-line {
    position: absolute;
    z-index: 2;

    left: 680px;
    top: 45px;

    transition: top 0.125s ease-in-out;

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

    color: white;

    text-shadow: 1px 1px 0 black, -1px 1px 0 black, 1px -1px 0 black, -1px -1px 0 black;
}
#tcHolder .menu .fuel-bar {
    position: absolute;

    width: 36px;
    height: 215px;

    left: 290px;
    top: 47px;

    border-radius: 12px;

    background: #4bada4;

    overflow: hidden;
}
#tcHolder .menu .fuel-bar .bar-fill {
    position: absolute;

    left: -100px;
    /*top: -17px;*/
    top: 207px;

    width: 150px;
    height: 210px;

    background: #3c2612;

    transform-origin: 100% 0;
    transform: rotate(-20deg);

    transition: top 1.0s ease-in-out;
}
#tcHolder .menu .time-bar {
    position: absolute;

    width: 296px;
    height: 28px;

    left: 30px;
    top: 13px;

    border-radius: 10px;

    /*background: white;*/
    background: rgba(255, 255, 255, 0.54);

    overflow: hidden;
}
#tcHolder .menu .time-bar .bar-fill {
    position: absolute;

    width: 500px;
    height: 122px;

    /*left: -405px;*/
    left: -47px;
    top: 20px;

    background: #999999;

    transform-origin: 0 0;
    transform: rotate(-20deg);
}
#tcHolder .menu .time-bar .bar-text {
    position: relative;

    margin-right: 8px;

    font: 16px/28px 'titilliumWebLight';
    text-align: right;

    color: white;
}

#tcHolder .menu-end {
    position: absolute;
    display: none;

    width: 413px;
    height: 337px;

    left: 124px;
    top: 107px;

    /*
    border-radius: 48px 48px 110px 110px;

    background: radial-gradient(circle farthest-side at 50% 60%, #ffe800, #f79420);*/
    background: url('../images/new/warZone/tc/bg.png');

    box-shadow: 0 0 16px black;
}
#tcHolder .menu-end .header {
    position: absolute;

    width: 96%;
    height: 80px;

    top: 34px;

    font: 39px/55px 'titilliumWebBold';
    text-align: center;

    color: #231f20;
    background: none;
}
#tcHolder .menu-end .text-a {
    position: absolute;

    width: 348px;
    height: 60px;

    left: 37px;
    top: 115px;
    font: 16px/22px 'titilliumWebRegular';
    text-align: center;

    color: #231f20;
}
#tcHolder .menu-end .text-b {
    position: absolute;

    width: 150px;
    height: 60px;

    left: 125px;
    top: 220px;

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

    color: #231f20;
}
#tcHolder .menu-end .text-c {
    position: absolute;

    width: 417px;
    right: 10px;
    top: 156px;
    text-align: center;

    font: 16px/16px 'titilliumWebRegular';
    color: #231f20;

    /*
    transform-origin: 100% 0;
    transform: scaleX(1.35) scaleY(0.8);*/
}
#tcHolder .menu-end .bar {
    border-radius: 24px;
    border: 2px solid #333333;

    background: #333333;

    overflow: hidden;

    transform-origin: 0 50%;
    transform: scaleY(1.25);
    color: white;
}
#tcHolder .menu-end .bar:hover {
    background: white;
    color: black;
}
#tcHolder .menu-end .bar-shadow {
    border-radius: 24px;

    margin-top: 4px;

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

    transform-origin: 0 50%;
    transform: rotate(-4deg) scaleY(1.25);
}
#tcHolder .menu-end .bar .bar-text {
    position: relative;

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

    transform: scaleY(0.8);
}
#tcHolder .menu-end .bar.end, #tcHolder .menu-end .bar-shadow.end {
    position: absolute;

    width: 140px;
    height: 36px;

    left: 130px;
    top: 270px;

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

#tcHolder .truck {
    position: absolute;

    width: 108px;
    height: 91px;

    left: 10px;
    top: 100px;

    background: url("../images/warZone/tc_1/truck.png");
}

/* END TC partial */