Detank/assets/css/style.css

body{
    margin: 0;
    padding: 0;
    font-family: sans-serif;
    background: #232323;
}

.header{
    text-align: center;
}

.header h1{
    display: inline-block;
    font-size: 42px;
    padding-top: 15px;
    padding-bottom: 20px;
    color: #fff;
}

.map{
    width: 1170px;
    height: 460px;
    border: solid 3px #000;
    background: url(../img/bg_sand.png) repeat;
    position: absolute;
    left: 0; 
    right: 0; 
    margin-left: auto; 
    margin-right: auto;
    overflow: hidden;
}

.tank1{
    height: 36px;
    width: 70px;
    background: url(../img/tank_green.png) no-repeat;
    position: absolute;
    border: solid 1px red;
}

.tank2{
    height: 36px;
    width: 70px;
    background: url(../img/tank_orange.png) no-repeat;
    position: absolute;
    left: 50px;
    top: 100px;
    display: none;
}

.bullet{
    height: 6px;
    width: 6px;
    background: #fff;
    position: absolute;
    left: 70px;
    top: 15px;
}


.directionLeft{
    transform: rotate(180deg);
}
.directionRight{
    transform: rotate(0deg);
}
.directionUp{
    transform: rotate(-90deg);
}
.directionDown{
    transform: rotate(90deg);
}