.topic{
    text-align: center;
    padding: 40px 16px;
}
.topic h1{
    color: #004080;
}

.topic dl{
    max-width: 720px;
    margin: 24px auto 0;
    padding: 0;
    text-align: left;
    border-top: 2px dotted #b8d1ec;
}

.topic dt{
    color: #004080;
    font-weight: bold;
    padding: 14px 0 4px;
}

.topic dd{
    color: #333;
    margin: 0;
    padding: 0 0 14px;
    border-bottom: 2px dotted #b8d1ec;
}
.topic dd a{
    color: #333;
    text-decoration: none;
}
.topic dd a:hover,
.topic dd a:focus-visible{
    color: #004080;
    text-decoration: underline;
}

@media (min-width: 600px){
    .topic dl{
        display: grid;
        grid-template-columns: 140px 1fr;
        column-gap: 16px;
    }
    .topic dt{
        padding: 14px 0;
        border-bottom: 2px dotted #b8d1ec;
    }
    .topic dd{
        padding: 14px 0;
    }
}