/* general */
html, body {
    margin: 0;
    padding: 0;
    background-color: #7f7f8e;
    color: #000;
}

body {
    margin: 0 20px 2em 20px;
    padding: 0 20px 2em 20px;
    background-color: #fff;
    color: #000;
    border-left: solid 5px #9494a5;
    border-right: solid 5px #9494a5;
    border-bottom: solid 5px #9494a5;
    box-shadow: 2px 2px 10px #333;
    -webkit-box-shadow: 2px 2px 10px #333;
}

/* links */
a[href^="http"] {
    background-image: url(images/external.png);
    background-position: right top;
    background-repeat: no-repeat;
    padding-right: 14px;
}
a[href^="mailto:"] {
    background-image: url(images/email.png);
    background-position: left -2px;
    background-repeat: no-repeat;
    padding-left: 20px;
}
a[href^="mailto:"]:hover {
    background-image: url(images/email_open.png);
}

#langs {
    position: absolute;
    top: 1.2em;
    right: 45px;
    font-family: Verdana, Arial, sans-serif;
    font-size: .8em;
}
    #langs a {
        color: #666;
        background-color: inherit;
        text-decoration: none;
    }
    #langs a.selected {
        color: #fff;
        background-color: #666;
        padding: 2px 5px 2px 5px;
        font-weight: bold;
    }

/* footer */
#footer {
    float: right;
    margin-top: 5em;
    padding-bottom: 1em;
}
    #footer p {
        margin: 0 0 0 10px;
        padding: .2em .5em;
        color: #333;
        background-color: #ccc;
        border: solid 2px #666;
        float: left;
        box-shadow: 2px 2px 5px #333;
        -webkit-box-shadow: 2px 2px 5px #333;
    }
        #footer p a {
            color: #333;
            background-color: inherit;
        }
        #footer p a:hover {
            color: #666;
            text-decoration: none;
            background-color: inherit;
        }
    #footer p.googlemoderator {
        background-color: #67A7E3;
        color: #fff;
        border: solid 2px #fff;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
    }
        #footer p.googlemoderator a {
            background-image: url(images/google_moderator.png);
            background-repeat: no-repeat;
            background-position: left center;
            padding: 0 0 0 20px;
            background-color: #67A7E3;
            color: #fff;
            text-decoration: none;
            font-family: Verdana, sans-serif;
            font-size: .8em;
            font-weight: bold;
        }

/* headers */
h1, h2, h3 {
    color: #1B6FC0;
    font-family: Georgia, serif;
    background-color: #fff;
    text-shadow: 2px 2px 4px #999;
    clear: both;
}
h1 {
    margin: 0;
    border-bottom: solid 2px #9494a5;
}
    h1 a {
        color: #1B6FC0;
        background-color: #fff;
    }
h3 {
    font-size: 1em;
}
/* table */
table {
    width: 100%;
    border: solid 2px #1B6FC0;
    box-shadow: 2px 2px 10px #999;
    -webkit-box-shadow: 2px 2px 10px #999;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    margin-bottom: .5em;
    
    clear: both;
}
table.doctypes tfoot, table.attributes tfoot {
    display: none;
}
    table thead {
        
    }
        table thead th {
            white-space: nowrap;
            text-align: left;
            padding: 0.5em 0.5em 0.2em 0.5em;
            border-bottom: solid 2px #1B6FC0;
            color: #fff;
            background-color: #1B6FC0;
            text-shadow: 1px 1px 2px #000;
            
            -webkit-border-top-left-radius: 6px;
            -webkit-border-top-right-radius: 6px;
            -moz-border-radius: 6px 6px 0 0;
        }
            table thead th a {
                color: #fff;
                background-color: #1B6FC0;
                font-size: .9em;
            }
            table thead th a:hover {
                text-decoration: none;
            }
    table tfoot {
        
    }
        table tfoot td {
            white-space: nowrap;
            text-align: left;
            padding: .5em .5em .2em .5em;
            border-bottom: solid 2px #666;
            color: #fff;
            background-color: #666;
            text-shadow: 1px 1px 2px #000;
            
            -webkit-border-bottom-left-radius: 6px;
            -webkit-border-bottom-right-radius: 6px;
            -moz-border-radius: 0 0 6px 6px;
        }
    table tbody {
        
    }
        table tbody tr:hover td {
            background-color: #F7F2D5;
            color: #000;
        }
        table tbody td {
            padding: .2em .5em;
            border-top: solid 1px #ccc;
        }
        table tbody td.doctype {
            background-color: #fff;
            color: #000;
            font-family: Verdana, Helvetica, Arial, sans-serif;
            font-weight: bold;
            font-size: .7em;
            white-space: nowrap;
        }
        table tbody td.declaration {
            background-color: #fff;
            color: #000;
            font-family: Courier, monospace;
            font-size: .8em;
        }
        table tbody td.value {
            font-family: Courier, monospace;
            font-size: .8em;
            white-space: nowrap;
        }

        table tbody td.element {
            background-color: #fff;
            color: #000;
            font-family: Courier, monospace;
            font-weight: bold;
            font-size: 1em;
            white-space: nowrap;
        }
            table tbody td.element a {
                background-color: inherit;
                color: #000;
            }
            table tbody td.element a:hover {
                text-decoration: none;
            }
        table tbody td.description {
            background-color: #fff;
            color: #000;
            font-size: .8em;
            font-family: Verdana, Arial, sans-serif;
        }
        table tbody td.yes {
            background-color: #ccffcc;
            color: #ccffcc;
            font-size: .6em;
            font-family: Verdana, Arial, sans-serif;
            white-space: nowrap;
        }
            table tbody td.yes img {
                vertical-align: text-bottom;
            }
        table tbody tr:hover td.yes {
            background-color: #aaffaa;
            color: #000;
        }
        table tbody td.no {
            background-color: #ffcccc;
            color: #ffcccc;
            font-size: .6em;
            font-family: Verdana, Arial, sans-serif;
            white-space: nowrap;
        }
            table tbody td.no img {
                vertical-align: text-bottom;
            }
        table tbody tr:hover td.no {
            background-color: #ffaaaa;
            color: #000;
        }

/* code */
pre.code {
    background-color: #ffffdd;
    color: #000;
    font-family: Courier, monospace;
    padding: 1em;
    border: dotted 1px #666;
    overflow: auto;
}


/* lists */
ul.doctypes {
    margin: 0;
    padding: 0;
}
    ul.doctypes li {
        display: inline;
        margin-right: .5em;
        padding-left: .5em;
        border-left: solid 1px #000;
    }
    ul.doctypes li:first-child {
        border-left: none;
        padding-left: 0;
    }
ul.legend {
    list-style: none;
    margin: 1em 0 0 0;
    padding: 0;
}
    ul.legend img {
        vertical-align: text-bottom;
    }

ul.filters {
    margin: 0;
    padding: 0;
    list-style: none;
}
    ul.filters li {
        float: left;
        margin-right: 1em;
        margin-bottom: 0.5em;
    }
        ul.filters li a {
            color: #336;
            background-color: #fff;
        }
        ul.filters li a:hover {
            text-decoration: none;
        }
ul.legend {
    list-style: none;
    margin: 0 0 0 0;
    padding: 0;
    display: inline;
}
    ul.legend li {
        display: inline;
        margin-right: 20px;
    }
    ul.legend img {
        vertical-align: top;
        margin-right: 2px;
    }
p.legend {
    display: inline;
    font-weight: bold;
}

/* element list */
ul.elementList {
    list-style: none;
    margin: 0 0 2em 0;
    padding: 0;
}
    ul.elementList li {
        float: left;
        width: 7em;
        border: solid 1px #ccc;
        background-color: #eee;
        color: #666;
        margin: 0 4px 4px 0;
        border-radius: 10px;
        -moz-border-radius: 10px;
        -webkit-border-radius: 10px;
    }
        ul.elementList li a, ul.elementList li span {
            text-decoration: none;
            background-color: inherit;
            color: inherit;
            display: block;
            padding: 2px 5px;
            -moz-border-radius: 8px;
            -webkit-border-radius: 9px;
        }
        ul.elementList li a:hover {
            background-color: #666;
            color: #fff;
        }
            ul.elementList li a span.extra {
                position: absolute;
                border: solid 1px #000;
                background-color: #ffd;
                color: #000;
                padding: 2px 5px;
                margin: 5px 0 0 -3px;
                display: none;
            }
            ul.elementList li a:hover span.extra {
                display: block;
            }
ul.elementList+h2 {
    padding-top: 1em;
}
ul.elementList+p {
    clear: both;
    padding-top: 1em;
}

/* comments */
dl.comments {
    margin: 0;
}
    dl.comments dt {
        border-left: solid 1px #1B6FC0;
        border-top: solid 1px #1B6FC0;
        border-right: solid 1px #1B6FC0;
        padding: 2px 5px;
        margin-top: 10px;
        background-color: #1B6FC0;
        color: #fff;
        font-weight: bold;
        
        -webkit-border-top-left-radius: 5px;
        -moz-border-radius-topleft: 5px;
        border-top-left-radius: 5px;
        -webkit-border-top-right-radius: 5px;
        -moz-border-radius-topright: 5px;
        border-top-right-radius: 5px;
    }
    dl.comments dd {
        margin: 0;
        padding: 2px 5px;
    }
    dl.comments dd.date {
        border-left: solid 1px #1B6FC0;
        border-right: solid 1px #1B6FC0;
        color: #999;
        background-color: inherit;
        font-size: .6em;
        font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    }
    dl.comments dd.message {
        border-left: solid 1px #1B6FC0;
        border-bottom: solid 1px #1B6FC0;
        border-right: solid 1px #1B6FC0;
        
        -webkit-border-bottom-left-radius: 5px;
        -moz-border-radius-bottomleft: 5px;
        border-bottom-left-radius: 5px;
        -webkit-border-bottom-right-radius: 5px;
        -moz-border-radius-bottomright: 5px;
        border-bottom-right-radius: 5px;
    }
form.commentform {
    margin-top: 20px;
    border: solid 1px #1B6FC0;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
    form.commentform ul {
        list-style: none;
        margin: 0;
        padding: 0;
    }
    form.commentform li {
        padding: 5px;
    }
    form.commentform label {
        width: 7em;
        float: left;
    }
        form.commentform label:after {
            content: ":";
        }
    form.commentform textarea {
        width: 30em;
        height: 5em;
    }
    form.commentform p {
        padding: 5px;
        margin: 0;
    }

.disqus {
    font-size: .6em;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    color: #1B6FC0;
    background-color: inherit;
    text-align: right;
    margin: 0;
}