body, html{
    height:100%
}
body{
    overflow-y: hidden;
}
header{
    height: 100px;
}
header h1{
    text-align: center;
    margin-top: 30px;
}
.content{
    height: calc(100% - 150px);
    margin-top: -35px;
}

.tree{
    background-image: url("/images/tree.png");
    background-size: contain;
    background-repeat: no-repeat;
    overflow: hidden;
    background-position: center bottom;
    height: 100%;
    position: relative;
    bottom: -50px;
}
.door{
    background-image: url("/images/close_door1_small.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center bottom;
    height: 12%;
    width: 100%;
    position: absolute;
    z-index: 10;
    bottom: 3%;
    cursor: pointer;
}
.door:hover{
    background-image: url("/images/open_door1_small.png");
}
footer{
    height: 5%;
    overflow: hidden;
    background-image: url("/images/trava_small.png");
    background-size: contain;
    background-position: center;
    z-index: 100;
    position: absolute;
    width: 100%;
    bottom: 0px;
}
footer p{
    text-align: right;
}
footer span{
    margin-right: 50px;
}