"

From 2014.igem.org

.hierarchical { width: 100%; counter-reset: ol0; margin: 1em 0; }

.hierarchical th { width: 25%; padding: 2px; }

.hierarchical td { padding: 2px; }

.hierarchical .ul { list-style-type: disc; padding-left: 40px; text-align: left; }

.hierarchical .ul.indent1 { list-style-type: circle; padding-left: 80px; }

.hierarchical .ul.indent2 { list-style-type: square; }

.hierarchical .ol { list-style: none; padding-left: 40px; text-align: left; }

.hierarchical .ul.indent1, .hierarchical .ol.indent1 { padding-left: 80px; }

.hierarchical .ul.indent2, .hierarchical .ol.indent2 { padding-left: 120px; }

.hierarchical .ol .li:before { position: absolute; width: 2em; margin-left: -2.5em; text-align: right; }

.hierarchical .ol:not(.indent1):not(.indent2) .li:before { counter-increment: ol0; content: counter(ol0) "."; counter-reset: ol1; }

.hierarchical .ol.indent1 .li:before { counter-increment: ol1; content: counter(ol1) "."; position: absolute; counter-reset: ol2; }

.hierarchical .ol.indent2 .li:before { counter-increment: ol2; content: counter(ol2) "."; position: absolute; }

.hierarchical .li { display: list-item; }

.form-control { display: inline-block; }

.input-group { display: inline-table; }

.form-table { width: 100%; }

.form-table th { white-space: nowrap; max-width: 50%; padding: 2px; }

.form-table td { width: 100%; padding: 2px; }

table.hierarchical > * > th, table.hierarchical > * > td { vertical-align: baseline; }

table.hierarchical > * > td > textarea { vertical-align: top; margin-top: -7px; /* derived from 6px padding-top + 1px border */ }

.notes { white-space: pre; overflow: auto; }