Как мне получить номера упорядоченного списка для выравнивания под заголовком div?

Jsfiddle здесь: Jsfiddle

Что касается желтого квадрата div, который я нарисовал, я хочу, чтобы мои упорядоченные номера списков выровнялись прямо под коробкой. Он не появляется на JSFiddle, но на моей домашней машине, из-за другого монитора разрешения, цифры появляются за пределами желтого блока div, например:

Я хочу, чтобы мои номера были выровнены под желтой рамкой. Как я могу это сделать?

Я пробовал играть с полями, но это просто кажется таким произвольным и может не работать кросс-браузер/кросс-система

margin-left: 20px;
margin-right: auto;