[html]<div class="reserv"><input type="submit" class="button" name="reserv" value="придержать персонажа"></div>
<style type="text/css">
.topicpost .post-author, .topicpost h3, .topicpost .pl-email {display: none;}
.topicpost .post-body {width: 100%;}
.gbook {
position: relative;
margin: 0 auto;
display: grid;
place-items: center;
gap: 1em;
grid-template-columns: 1fr 1fr;
grid-template-rows: repeat(3, auto);
grid-template-areas:
"ave need"
"held need";
}
.gbook .ave {grid-area: ave;}
.gbook .held {grid-area: held;}
.gbook .need {grid-area: need;}
.gbook > div {
display: block;
width: 100%;
min-height: 5em;
height: 100%;
overflow-y: auto;
white-space: break-spaces;
}
.gbook > div p span {
text-transform: uppercase;
font-size: 1.1em;
font-weight: bold;
}
.gbook .ave strong {border-bottom: 1px dashed;}
.gbook .ave p span a {text-transform: lowercase;}
.reserv {
text-align: center;
width: 50%;
}
#pun .post-content .gbook hr {
width: 80%;
margin: 0 auto;
}

.gbook .need img {
max-width: 50%;
    padding: 1rem;
}
/*** МОБИЛЬНЫЙ ***/
@media screen and (max-width: 540px) {
.gbook {
    grid-template-columns: 1fr;
    grid-template-rows: repeat(5, auto);
    grid-template-areas:
    "ave"
    "need"
    "held";
}
.reserv {
    width: 100%;
}
}
</style>[/html]