body {
}

/*dl {
    width: 100%;
    overflow: hidden;
    background: #ff0;
    padding: 0;
    margin: 0
}

dt {
    float: left;
    width: 50%;*/
    /* adjust the width; make sure the total of both is 100% */
    /*background: #cc0;
    padding: 0;
    margin: 0
}

dd {
    float: right;
    width: 50%;*/
    /* adjust the width; make sure the total of both is 100% */
    /*background: #dd0 padding: 0;
    margin: 0
}*/

/*dl.inline dd {
    display: inline;
    margin: 0;
}

    dl.inline dd:after {
        display: block;
        content: '';
    }

dl.inline dt {
    display: inline-block;
    min-width: 100px;
}

dl.inline-flex {
    display: flex;
    flex-flow: row;
    flex-wrap: wrap;
    width: 300px;*/ /* set the container width*/
    /*overflow: visible;
}

    dl.inline-flex dt {
        flex: 0 0 50%;
        text-overflow: ellipsis;
        overflow: hidden;
    }

    dl.inline-flex dd {
        flex: 0 0 50%;
        margin-left: auto;
        text-align: left;
        text-overflow: ellipsis;
        overflow: hidden;
    }*/

dl.inline {
    display: grid;
    grid-template-columns: max-content auto;
}

dl.inline dt {
    grid-column-start: 1;
}

dl.inline dd {
    grid-column-start: 2;
}