.board{
    height: 100vh;
    display:grid;
    background-color: cadetblue;

}
.display-none{
    display: none !important;
}
.restart{
    position: fixed;
    width: 50px;
    height: 50px;
    background: url(../images/restart.png)no-repeat center center/cover;
    bottom: 0;
    left:0;
    cursor: pointer;
}
.menu{
    position: absolute;
    width: 50px;
    height: 50px;
    background: url(../images/menu.png)no-repeat center center/cover;
    top: 0;
    left:0;
    cursor: pointer;
}
.health-bar{
    display: grid;
    grid-template-rows: repeat(10,5vh);
    position: fixed;
    width: 5vw;
    bottom: 50px;
    left:0;
    transition: all 0.2s ease;
}
.hearts{
    background: url(../images/heart.png)no-repeat center center/cover;
}
/* blocks */
.dirt{
    background: url(../images/dirt.jpg)no-repeat center center/cover;
    position: relative;
}
.grass{
    position: relative;
    background: url(../images/grass.jpg)no-repeat center 0.1px/cover;
}
.sky{
    background:#8cbffb;
}
.log{
    background: url(../images/log.png)no-repeat center center/cover;
    position: relative;
}
.leaves{
    background: url(../images/leaves.png)no-repeat center center/cover;
    position: relative;
}
.stone{
    background: url(../images/block.jpg)no-repeat center center/cover;
    position: relative;
}
.water{
    background: url(../images/water.jpg)no-repeat center center/cover;
    position: relative;
}
.lava{
    background: url(../images/lava.jpg)no-repeat center center/cover;
    position: relative;
}
.obsidian{
    background: url(../images/obsidian.png)no-repeat center center/cover;
    position: relative;
}
/* items */
.pickaxe{
    background: url(../images/pickaxe.png)no-repeat center center/cover;
}
.axe{
    background: url(../images/axe.png)no-repeat center center/cover;
}
.shovel{
    background: url(../images/shovel.png)no-repeat center center/cover;
}
.sword{
    background: url(../images/sword.png)no-repeat center center/cover;
}
.bucket{
    background: url(../images/bucket.png)no-repeat center center/cover;
}
.zombie-head{
    background: url(../images//zombie\ head\ .jpg)no-repeat center center/cover;
    /* grid-row: span 2; */
}
.head-burn{
    background:url(../images/head\ burn.png)no-repeat center center/cover;
}
.zombie-body{
    background: url(../images//zombie\ legs.jpg)no-repeat center center/cover;
}
.on-fire{
    background: url(../images/onFire.png)no-repeat center center/cover;
}
.meat{
    position: relative;
    background: url(../images/meat.jpg)no-repeat center center/cover;
}
.number-of-elements{
    background: gray;
    color: white;
    position: absolute;
    bottom: 0;
    left: 0;
}
#have-access{
    position:fixed;
    width:6vw;
    height: 5vh;
    top: 0;
    right: 0;
    background: transparent;
    font-weight: 1000;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-size: 1.5rem;
    cursor: pointer;
}