/*
 * This is the common CSS styling for the various documentation filter
 * KIO workers (incl. kio_man, kio_info, kio_perldoc, etc.)
 *
 * It is designed to mimic the look of the kde.org website (although the css
 * for the website has since drifted itself...)
 *
 * Unfortunately at this point to get the proper effect you cannot use XHTML
 * STRICT (as was used in kio_info).
 */

body {
    /* If you specify a background color you should also specify a regular color */
    background-color: white;
    color: black;
    padding: 0px;
}

#header {
    width: 100%;
    color: #535353;
    background: #eeeeee;
    border-bottom: #bcbcbc 1px solid;
}

#header_top {
    margin: 0 auto;
    padding: 0;
    width: 60em;
    min-width: 770px;
    max-width: 45em;
    vertical-align: middle;
    color: #ffffff;
    background-repeat: repeat-x;
    background-position: bottom;
    background-color: #0057ae;
}

/*
 * The header_top div div stuff seems to automatically setup the images but
 * I'm not sure that it's actually any better than just manually creating a
 * sequences of non-nested divs and setting an image that way.
 */
#header_top div {
    margin: 0 auto;
    padding: 0;
    background-repeat: no-repeat;
    background-position: bottom left;
}

#header_top div div {
    margin: 0 auto;
    padding: 0;
    vertical-align: middle;
    text-align: left;
    font-size: 1.7em;
    font-weight: bold;
    background-repeat: no-repeat;
    background-position: bottom right;
}

/*
 * If the generated HTML does not use an <img> tag in the div div header
 * sequence then the text will be aligned wrong due to the missing margin
 * provided by the image.
 */
#header_top div div img {
    margin:8px 0px 9px 18px;
    vertical-align: middle;
}

#header_bottom {
    margin: 0 auto;
    padding: 0.1em 0em 0.3em 0;
    width: 60em;
    min-width: 770px;
    max-width: 45em;
    vertical-align: middle;
    text-align: right;
    background: #eeeeee;
}

/* Used for the text and footer area at the bottom. */
#footer {
    width: 100%;
    background-color: #eeeeee;
    padding-top: 12pt;
    padding-bottom: 12pt;
    border-top: #bcbcbc 1px solid;
    margin-top: 12pt;
}

#footer_text {
    text-align:center;
    vertical-align: middle;
}