body {
    font-size: 90%;
    text-align: center;
    font-family: Tahoma, 'Lucida Grande CE', lucida, sans-serif;
}

#frame {
    max-width: 1000px;
    margin: 0 auto;
    text-align: left;
    color: #333;
    position: relative;
}

h1, h2, h3 {
    font-family: 'Trebuchet MS', 'Geneva CE', lucida, sans-serif;
}


h1{
    font-size: 200%;
}

h1 a {
    text-decoration: none;
    color: #333;
}

h1 a:hover, h1 a:focus {
    color: red;
    text-decoration: underline;
}

h2{
    margin: 15px 0;
    cursor: pointer;
}

h2 span.switch {
    color: #aaa;
    font-size: 95%;
    padding: 5px 8px 5px 0px;
    cursor: pointer;
}

a.hook{
    color: #bbb;
    font-weight: normal;
    text-decoration: none;
    margin-left: 2px;
}

a.hook:hover{
    text-decoration: underline;
    color: #999;
}




table {
    width: 100%;
    border-collapse: collapse;
    }

    table td {
        padding: 8px;
        /* vertical-align: top; */
    }
    
    table th {
        text-align: center;
        font-size: 90%;
        font-weight: bold;
        color: #666;

        overflow: hidden;
    }

    tr.info td{
        border-top: solid #aaa 1px;
    }

    tr:hover td{
        background-color: #f5f5f5;
    }

    tr.hide td.name {
        color: #aaa;
    }

    
    th.name         { width: 18%; }
    th.ip           { width: 20%; }
    th.domain       { width: 30%; }

    th.domain-virt  { width: 22%; }
    th.hypervisor   { width: 8%; }
    
    th.admin        { width: 20%; }
    th.monitoring   { width: 10%; }




    td.name {
        font-weight: bold;
        font-size: 92%;
    }

    td.ips {
            overflow: hidden;
        }
    
        td.ips code {
            display: block;
        }

    td.domains {
        
        }
        td.domains a.domain {
            text-decoration: none;
            color: inherit;
        }
        td.domains a.domain:hover,
        td.domains a.domain:active,
        td.domains a.domain:focus {
            text-decoration: underline;
            color: blue;
        }
    
    td.monitoring{
        text-align: center;
    }

    td.backup{
        text-align: center;
    }

    td.note {
        font-size: 90%;
        color: #666;
    }
    
    td.admins{
        font-size: 90%;
    }

    td span.owner{
        padding: 0 0 0 25px;
        margin: 0;
        display: block;
        background-image: url(imgs/ico-shield.png);
        background-position: center left;
        background-repeat: no-repeat;
    }   

    td span.admins{
        display: block;
        padding: 0 0 0 25px;
        margin: 4px 0 0 0;
        background-image: url(imgs/ico-user.png);
        background-position: left 3px;
        background-repeat: no-repeat;
    } 

    td div.note{
        padding: 4px 0 4px 30px;
        background-image: url(imgs/ico-note.png);
        background-position: left 4px;
        background-repeat: no-repeat;
        font-size: 90%;
    }


    td div.vars{
        padding: 4px 0 4px 30px;
        background-image: url(imgs/ico-vars.png);
        background-position: left 6px;
        background-repeat: no-repeat;
        font-size: 100%;
        font-family: monospace;
        }
        td div.vars div.var{
            padding: 2px 0 4px 0px;
        }
        

    td div.virtuals{
        padding: 3px 0 3px 30px;
        background-image: url(imgs/ico-servers.png);
        background-position: left 4px;
        background-repeat: no-repeat;
        font-size: 90%;
        line-height: 150%;
    }

    tr.hide td.name {
        color: #ccc;
    }

div.items.tail {
    display: none;
}

a.more-link {
    font-size: 80%;
}

span.label {
    background-color: #333;
    color: #fff;
    padding: 2px 5px;
    font-size: 85%;
    cursor: default;

    -webkit-border-radius: 4px;
    border-radius: 4px;
    }

    span.label.ok { background-color: #007A01; }
    span.label.warn { background-color: #CB7B00; }
    span.label.err { background-color: #990000; }
    span.label.unknown { background-color: #999; }
    
    span.label.attr { 
        cursor: help;
        
    }


.anchor,
tr.anchor td{
    background-color: #FFE780;
}



div.section {
    padding: 10px 0 10px 10px;
    margin-left: 10px;
    border-left: dotted #aaa 1px;

    background-position: left bottom;
    background-repeat: no-repeat;
    background-image: url(imgs/section-bg.png);
}


#filter{
    position: absolute;
    top: 15px;
    right: 0px;
    }
    #filter input {
        width: 200px;
        font-size: 105%;
    }

#footer{
    margin: 20px 0 10px 0;
    padding: 10px;
    border-top: solid #999 1px;
    font-size: 90%;
    color: #666;
    text-align: right;
    position: relative;
}

#date{
    text-align: left;
}

#copy{
    position: absolute;
    top: 10px;
    right: 10px;
}


.highlight {
    background-color: #ffc; 
    background-color: rgba(255, 255, 0, 0.2);
}