body {
    font-family: Verdana, sans-serif;
    font-size: 14px;
    text-size-adjust: none;
}
table {
    border-spacing: 0px;
    width: 65%;
    font-size: 14px;
}
table.condensed tr td {
    padding: 7px 15px;
}
th, td {
    padding: 15px;
    border-bottom: 1px solid #ddd;
    vertical-align:top;
}
tr:nth-child(even) {
    background-color: #f2f2f2;
}
th.problem {
    background-color: #af2e2e;
}
th.warning {
    background-color: darkorange;
}
th.success {
    background-color: forestgreen;
}
th {
    background-color: #2E7CAF;
    color: white;
    font-weight: 300;
    text-align: left;
}
td.version {
    width: 75px;
}
.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
}
.tooltip .tooltiptext {
    visibility: hidden;
    background-color: black;
    color: #fff;
    white-space: nowrap;
    text-align: left;
    padding: 5px;
    font-size: 14px;
    position: absolute;
    z-index: 1;
    margin-top: 7px;
    top: 100%;
    left: 0%;
}
.tooltip .tooltiptext::after {
    content: " ";
    position: absolute;
    bottom: 100%;  /* At the top of the tooltip */
    left: 5%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent black transparent;
}
.tooltip:hover .tooltiptext {
    visibility: visible;
}

.success-chain {
    color: #00CC00;
}
.fail {
    color: #CC0000;
}

@media only screen and (max-width: 1350px) {
    body, table {
        font-size: 25px;
    }
    table {
        width: 95%;
    }
    td.version {
        width: 35px;
    }
}