// Turns a vertical list into a horizontal one spaced with separators
.contact-legend {
    color: #555;
    text-align: center;

    ul, li {
        list-style: none;
        margin: 0;
        padding: 0;
    }
    ul { display: inline; }
    li {
        border-left: 1px solid #333;
        display: inline-block;
        .ie7-inline-block();
        padding: 0 0.5em;

        &:first-child { border-left: 0; }

        img { vertical-align: text-top; }
    }
}

// Prefixed table is neccessary to override some other previously defined rules
table.contact-header {
    margin: auto;

    img { vertical-align: text-top; }
    td {
        background-color: #f2f2f2;
        padding: 3px 0.5em;
        text-align: center;
        vertical-align: middle;

        &:hover { background-color: #ced8f2; }

        // Active state
        &.active {
            background-color: #e2e2e2;
            border: 1px solid #888;

            &:hover { background-color: #b7c2e2; }

            a {
                color: #f00;
                font-weight: bold;
            }
        }
        &.empty a { color: #999; }
    }
}