* {
    box-sizing: border-box;
}

.wrapper > div {
    border: 2px solid rgb(133, 133, 133);
    border-radius: 5px;
    background-color: rgba(255, 255, 255);
    padding: 1em;
    color: #000000;
    font-family: sans-serif;
}  
  
.wrapper {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    grid-auto-rows: minmax(40px, auto);
}

.menu {
    grid-column: 1 / 4;
    grid-row: 1;
}

.header {
    grid-column: 1 / 4;
    grid-row: 2;
}

.summary {
    grid-column: 1 / 4;
    grid-row: 3;
}

.details {
    grid-column: 1;
    grid-row: 4;
}

.deckplan {
    grid-column: 2;
    grid-row: 4;
}

.combatCard {
    grid-column: 3;
    grid-row: 4;
}

.copyright {
    grid-column: 1 / 4;
    grid-row: 5;
}