body { margin: 0; background: #111; overflow: hidden;}

#player {
    position:absolute;
    width:100px;
    height: 111px;
}
#hexagon {
    width: 100px;
    height: 57.735px;
    background: red;
    position: absolute;
    margin-top: 25px;
}
#hexagon::before {
    content: "";
    position: absolute;
    top: -28.8675px;
    left: 0;
    width: 0;
    height: 0;
    border-left: 50px solid transparent;
    border-right: 50px solid transparent;
    border-bottom: 28.8675px solid red;
}
#hexagon::after {
    content: "";
    position: absolute;
    bottom: -28.8675px;
    left: 0;
    width: 0;
    height: 0;
    border-left: 50px solid transparent;
    border-right: 50px solid transparent;
    border-top: 28.8675px solid red;
}

.obstacle {
    background: yellow;
    position: absolute;
    transition: left 1s cubic-bezier(1, 1, 0, 0);
}
    
#restart {
    font-family: monospace;
    position: absolute;
    width: calc(100vw - 160px);
    margin: 80px;
    height: calc(100vh - 160px);
    font-size: 20rem;
    background: black;
    color: white;
    display: none;
    border: 60px black solid;
    cursor: pointer;
    border-radius: 200px;
}

#restart:hover {
    color: aqua
}