.panel-list {
    margin-bottom: 0;
    padding-bottom: 1em;
    max-height: calc(100vh - 13em);
    text-align: center;
}

.panel-list .ui.button {
    margin: 0.25em auto;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    width: 24em;
    max-width: calc(100vw - 2em);
}

@media (orientation : portrait) {
    .home-header .logo-box,
    #panel-list-container h1,
    #panel-list-container h2,
    #panel-list-container h3,
    #panel-list-container h4 {
        text-align: center;
    }

    .panel-list.many {
        display: flex;
        flex-wrap: wrap;
        align-items: stretch;
        flex-direction: row;
        justify-content: center;
        align-content: flex-start;
        overflow-y: auto;
        overflow-x: hidden;
    }
    .panel-list.many .ui.button {
        margin: 0.25em;
    }
}

@media (orientation : landscape) {
    .panel-list.many {
        display: flex;
        flex-wrap: wrap;
        align-items: stretch;
        flex-direction: column;
        justify-content: flex-start;
        align-content: flex-start;
        overflow-y: hidden;
        overflow-x: auto;
    }
    .panel-list.many .ui.button {
        margin: 0.25em;
    }
}