﻿
/*######################
  screen.css - MoinMoin Explorer Styles
###################### */


/*######################
  General Styles
###################### */
html {
    /* This ensures, that the general font height is the same as the system font */
    padding: 1em;
    font-family: verdana, arial, helvetica, sans-serif; font-size: 8pt;
    overflow: hidden;
    background: #528abd url("../img/gradient-L.png") top repeat-x;
}

body {
    color: black; font-size: 1em;
}

a:link, a:visited { text-decoration: none; color: blue; }
a:link:hover, a:link:active { text-decoration: underline; color: blue; }
a:visited:hover, a:visited:active { text-decoration: underline; color: #EF8700; }

a.download {
    font-size: 120%; 
    letter-spacing: 0.05em;
    font-weight: bold;
    background: #E7E7E7;
    border: 1px solid #9C9C9C;
    padding: 0.5em;
    text-align: center;
}

#content > form {
    padding: .5em;
    background: #d0e0fe url("../img/gradient-L.png") top repeat-x; color: black;
    border: #d0e0fe 2px groove;
}

form, form input, form select {
    font-family: verdana, arial, helvetica, sans-serif;
    font-size: 1em;
}

textarea {
    font-family: 'Courier New', Courier, monospace;
    font-size: 1.2em; 
}

.bottom, #content_bottom { clear: both; }

        

/*######################
  Header
###################### */

#header {
    padding: .5em .5em 0px 1em; vertical-align: top;
    background: #d0e0ff url("../img/gradient-L.png") top repeat-x; color: black;
    border-top: #ffb03a .25em solid;
}
*[dir="rtl"] #header { padding: .5em 1em 0px .5em; }
#logo {
    float: left; margin-bottom: 0em;
    font-size: 1.6em; text-align: center; vertical-align: middle;
}
*[dir="rtl"] #logo { float: right; }
#logo img { padding: 1pt; margin: 1px; vertical-align: middle; }
#logo a, #logo a:hover { text-decoration: none; color: black; }

#username {
    float: right; margin: 0px 0px .5em 2em; padding: 0px;
}
*[dir="rtl"] #username {
    float: left; margin: 0px 2em .5em 0px;
}
#username li { display: inline; }
#username li:before { content: " \B7  "; }
#username li:first-child:before { content: ""; }


#searchform {
    display: inline; padding: 0px; vertical-align: middle;
    background: none; border: none; /* Overwrites general form settings */
    white-space: nowrap;
}
#searchform > div { display: inline; }
#searchform_container { float: right; margin: 0px 0px .5em 2em; }
*[dir="rtl"] #searchform_container { float: left; margin: 0px 2em .5em 0px; }


#navibar {
    display: block; clear: both;
    margin: 0px; padding: 0px;
    text-align: right; overflow: hidden; white-space: nowrap;
}
*[dir="rtl"] #navibar { text-align: left; white-space: nowrap; }

#navibar li { display: inline; white-space: nowrap; }
li.wikilink a, li.userlink a, li.current a {
    display: inline; padding: .1em 1em; margin: 0px .2em; line-height: 1.4em;
    background: #d0e0ff url("../img/gradient-S.png") top repeat-x;
    border: 1px outset #d0e0ff; border-bottom-width: 0px;
    color: black; text-decoration: none;   
}
li.userlink a { background-color: white; border-color: white; }
li.current a { background-color: #528abd; border-color: #528abd; color: white; }
#navibar a:hover {
    background-color: #ffb03a; border-color: #ffb03a;
    color: black; text-decoration: none;
}


#pageline {
    margin: 0px; padding: 0px;
    /* sync these values, line-height is needed for IE */
    height: .4em; line-height: .4em;
    background: #528abd; border-bottom: 1px outset #528abd;
}



/*######################
  Pagetrail / Iconbar
###################### */
#iconbar, #pagetrail { 
    padding: .1em .5em; margin: 0px;
    background: #d0e0fe url("../img/gradient-M.png") top repeat-x; color: black;
    font-family: verdana, arial, helvetica, sans-serif; font-size: 1em;
    border-bottom: #d0e0fe 1px outset; border-top: #d0e0fe 1px outset;
}
#pagetrail { padding: .2em .5em; }

#pagetrail li { display: inline; margin: 0px; }

#pagetrail li:before { content: " \BB  "; }
*[dir="rtl"] #pagetrail li:before { content: " \AB  "; }
#pagetrail li:first-child:before { content: ""; }


.iconbar {
    display: inline; display: inline-block;
    padding: 0px 0px 0px .2em; margin: .1em 0px .1em .2em;
    border-left: #d0e0fe groove 2px;
    vertical-align: middle;
}
*[dir="rtl"] .iconbar {
    padding: 0px .2em 0px 0px; margin: .2em .2em .2em 0px;
    border-right: #d0e0fe groove 2px; border-left: none;
}
.iconbar:first-child, .iconbar:empty { margin: .2em 0px; padding: 0px; border: none; }

.iconbar li { display: inline; display: inline-block; padding: 0px; margin: 0px; }
.iconbar img { padding: 2pt; margin: 1px; vertical-align: middle; }
.iconbar a img:hover {
    outline: #ffb03a 1px outset; background-color: #ffb03a;
}
.iconbar .ib_selected img { outline: #d0e0fe 1px inset; }



/*######################
  Main
###################### */
#main {
    position: fixed; right: 1em; left: 1em; display: block;
    height: 500px;
    background: white url("../img/gradient-L.png") top repeat-x; color: black;
    border-top: white 1px outset; border-bottom: white 1px outset;
    /* height: expression((header.offsetLeft)+"px"); */
}



/*######################
  Page
###################### */
#page_area {
    display: block; position: absolute;
    top: 0px; bottom: 0px; right: 0px; left: 20em;
    margin: 0px; margin-left: 3pt; padding: 0px;
    border-left: transparent solid 2px; 
}
*[dir="rtl"] #page_area {
    right: 20em; left: 0px;
    margin: 0px; margin-right: 3pt;
    border-left: none; border-right: transparent solid 2px; 
}


/*
  Page Header
###################### */
#page_header {
    padding: .5em 1em .5em 2.5em;
    background: #d0e0ff url("../img/gradient-L.png") top repeat-x; color: black;
    border-bottom: #d0e0ff 1px outset;
}
*[dir="rtl"] #page_header { padding: .5em 2.5em .5em 1em; }

#parents { margin: 0px; padding: 0px; }
#parents li { display: inline; margin: 0px; }
#parents li:before { content: " | "; }
#parents li:first-child:before { content: ""; }

#page_header_info { margin: .5em 0px 0px 0px; }

#page_summary {
    margin: .0em .5em .2em 1.2em; padding-left: .8em;
    float: right;
    border-left: 2px #d4dfff groove;
    list-style-type: none;
}
*[dir="rtl"] #page_summary {
    margin: .0em 1.2em .2em .5em; padding-right: .8em; padding-left: 0px;
    float: left;
    border-right: 2px #d4dfff groove; border-left: none;
}


/*
  Message box
###################### */
#message {
    padding: .5em .5em .5em 2.5em;
    background: #FFF3C6 url("../img/gradient-L.png") top repeat-x; color: black;
    border-top: #FFF3C6 1px outset; border-bottom: #FFF3C6 1px outset;
}
*[dir="rtl"] #message { padding: .5em 2.5em .5em .5em; }
#message p { margin: 0px 0px .5em 0px; padding: 0px; }

#message div.buttons { display: inline; }


.dialog form { margin: 0px .5em; }

.dialog td { border: none; padding: .5em; }

.dialog td.label { text-align: right; font-weight: bold; width: 25%; }
*[dir="rtl"] .dialog td.label { text-align: left; }

.dialog td.content input { width: 100%; }



/*
  Page Content
###################### */
#content_area { position: absolute; left: 0px; right: 0px; }
#page_content { overflow: auto; height: 100%; }


#attachments {
    padding: .5em .5em .5em 2.5em;
    background: #d0e0fe url("../img/gradient-L.png") top repeat-x; color: black;
    border-top: #d0e0fe 1px outset; border-bottom: #d0e0fe 1px outset;
}
*[dir="rtl"] #attachments { padding: .5em 2.5em .5em .5em; }
#attachments ul { margin: 0px; padding: 0px; }


#page_title {
    padding: 1em 1em 0em 2.5em; text-align: center;
}
*[dir="rtl"] #page_title { padding: .5em 2.5em .5em 1em; }

#page { padding: 2em 1em 2em 2.5em; background-color: white; color: black; }
*[dir="rtl"] #page { padding: 2em 2.5em 2em 1em; }
#content > *:first-child { margin-top: 0px; }



/*
  Diffs
###################### */
.diff { width: 99%; }
.diff-header { font-weight: bold; }
.diff-title { background-color: #d0e0ff;}
.diff-added { background-color: #E0FFE0; vertical-align: sub; }
.diff-removed { background-color: #FFFFE0; vertical-align: sub; }
.diff-added span { background-color: #80FF80; }
.diff-removed span { background-color: #FFFF80; }



/*
  Editor
###################### */
/* We use here dumb css1 ids because of IE suckiness */
#editor-textarea, #editor-help {
    border: 1px solid #8cacbb;  
    color: black;
    background-color: white;
    padding: 3px;
    width: 100%;
    margin-top: .5em;
}

#editor-help {
    font-family: 'Courier New', Courier, monospace;
    font-size: 1.2em; 
    background: #FFF3C6 url("../img/gradient-L.png") top repeat-x; color: black;
}

#editor-comment {
    border: 1px solid #D0E0F0;
    color: black;
    background-color: white;
    vertical-align: middle;
    padding: 1px;
    display: inline;
    width: 70%;
}

#preview, #previewbelow {
    border: 1px solid #D0E0F0;
    padding: 2em 1em 2em 2.5em;
    background: url(../img/draft.png);
    margin-top: .5em;
}
*[dir="rtl"] #preview, *[dir="rtl"] #previewbelow {
    border: 1px solid #D0E0F0;
    padding: 2em 2.5em 2em 1em;
}


/*
  Navigation macro
###################### */
table.navigation { float: right; margin: 1em 0px 1em 2em; }
*[dir="rtl"] table.navigation { float: left; margin: 1em 2em 1em 0px; }


/*######################
  Split Bar
###################### */
#splitbar {
    position: absolute; top: 0px; bottom: 0px; left: 20em; display: inline; display: inline-block;
    width: 4px; margin: 0px;
    background: #d0e0fe url("../img/handle.png") no-repeat center 45%; color: black;
    cursor: e-resize;
    border: #d0e0fe 1px outset;
}
#splitbar:hover { background-color: #ffb03a; }
*[dir="rtl"] #splitbar { right: 20em; left: auto; }


/*######################
  Side Bar
###################### */
#sidebar {
    position: absolute; white-space: nowrap;
    width: 3em; top: 0px; bottom: 0px; left: 0px; margin: 0px; border: none; padding: 0px;
    overflow: auto;
}
*[dir="rtl"] #sidebar { left: auto; right: 0px; }


.wiki_tree { padding: 0px; margin: 0px 0px 0px 15px; list-style: none; display: block; }
*[dir="rtl"] .wiki_tree { margin: 0px 15px 0px 0px; }
.wiki_tree img { vertical-align: middle; margin-bottom: 1px; }
#sidebar > ul, *[dir="rtl"] #sidebar > ul { margin: .4em; }


a.node:link,
a.node:visited,
a#node_selected:link,
a#node_selected:visited {
    margin: 0px .1em; padding: 0px .1em;
    color: black; cursor: default;
}

a#node_selected:link,
a#node_selected:visited {
    background: #528abd url("../img/gradient-S.png") top repeat-x; color: white;
}

a.node:hover,
a.node:active,
a#node_selected:active,
a#node_selected:hover {
    background: #ffb03a url("../img/gradient-S.png") top repeat-x; color: black;
    text-decoration: none;
}

.toggle { margin: 0px 2px; }
.leaf { margin: 0px 0px 0px 15px;  }
*[dir="rtl"] .leaf { margin: 0px 15px 0px 0px; }


/*######################
  Footer
###################### */
#footer, #timings {
    position: fixed; left: 1em; right: 1em; bottom: 1em;
    padding: 1pt .5em; margin: 0px;
    background: #d0e0fe url("../img/gradient-M.png") top repeat-x; color: black;
    border-top: #d0e0fe 1px outset; border-bottom: #ffb03a .25em solid;
    text-align: right;
}
*[dir="rtl"] #footer, *[dir="rtl"] #timings { text-align: left; }



#wiki_summary { display: inline; display: inline-block; margin: 0px; padding: 0px; }
#wiki_summary li { display: inline; display: inline-block; margin: 0px; }
#wiki_summary li:before { content: ", "; }
#wiki_summary li:first-child:before { content: ""; }


#credits, #version { margin: 0px; padding: 0px; }
#credits li, #timings li { display: inline; margin: 0px; padding: 0px; }
#credits li:before , #timings li:before { content: " \A0 |\A0  "; }
#credits li:first-child:before, #timings li:first-child:before  { content: ""; }
#credits img { vertical-align: middle; }

#openididentifier {
    background: url(../../common/openid.png) no-repeat;
    background-position: 0 50%;
    padding-left: 18px;
}
