lazarus/components/wiki/css/wiki.css

body {
    margin: 0;
    color: #111111;
    background-color: #FFFFFF;
    font-family: "Segoe UI", "Trebuchet MS", Arial, Verdana, sans-serif;
    font-size: 10pt;
    text-align: left;
    padding: 0.7em;
}


/* Bi-Directional support */

*[lang="he"], *[lang="ar"] /* not supported by IE */
{
    direction: rtl;
    text-align: right;
}

body[lang="he"], body[lang="ar"]
{
    margin: 0;
    color: #111111;
    background-color: #FFFFFF;
    font-family: "Segoe UI", "Trebuchet MS", Arial, Verdana, sans-serif;
    text-align: right;
    direction: rtl;
    margin-right: 10.2em;
    padding-right: 0.7em;
}

p {
    line-height: 1.25em;
    margin: 5px 0 5px 0;
}

a {
    color:#4D87CE;
    text-decoration:none;
}
a:hover {
    color:#2a65ad;
}

ul li {
    list-style-image:url(../pic/backgrounds/li.gif);
    text-align:left;
    margin-bottom: 2px;
    margin-top: 2px;
}

#logoheader {
    width:80%;
    margin:0 auto 0 auto;
    text-align:right;
}

#content {
    margin:0 40px;
    padding:0;
    text-align:left;
}


/* Headers */

h1 { 
    font-family: "Century Gothic", "Trebuchet MS", "Arial Narrow", Arial, sans-serif;
    font-size:150%;
    font-weight:normal;
    text-transform:uppercase;
    border-bottom:1px solid #eeeeee;
    margin-top: 10px;
}

#content h1 {
    font-family:"Century Gothic", "Trebuchet MS", "Arial Narrow", Arial, sans-serif;
    font-size:150%;
    margin-bottom: 10px;
}

h2 {
    font-family: "Century Gothic", "Trebuchet MS", "Arial Narrow", Arial, sans-serif;
    font-size: 130%;
    margin-top: 25px;
    margin-bottom: 10px;
    border-bottom: 1px solid #CCCCCC;
}

h3 {
    font-family: "Century Gothic", "Trebuchet MS", "Arial Narrow", Arial, sans-serif;
    font-size:120%;
    margin-top: 15px;
    margin-bottom: 5px;
}

h4, h5, h6, .subTitle {
    font-family: sans-serif;
    font-size: 100%;
    font-weight: bold;
    margin-bottom: 5px;
}


/* Code */

pre, .pascal {
    background-color: #F9F9F9;
    border: 1px dashed #2F6FAB;
    color: black;
    padding: 8px;
    overflow: auto;
    line-height: 125%;
}

.num {
    color: #0000DD;
}

.string {
    color: #800080;
}

.var {
    color: #000000;
}

.key {
    font-weight:bold;
}

.sym {
    color: red;
}

.cmt {
    color: #777777;
    font-style: italic;
}

blockquote {
    margin: 0 3%;
}


/* templates */

div.template-with-icon {
    border-width: 1px;
    border-color: #C0C0C0;
    padding: 4px 8px 8px 8px;
    border-style:solid;
    display: block;
    margin-top: 10px;
    min-height: 28px;
}

div.icon {
    clear: left;
    float: left;
    margin-right: 8px;
    margin-top:0px;
}

span.keypress {
    border: 0.2em outset #cecbc7;
    background: #f0ece8;
    padding: 0.1em 0.4em;
    font-size: 80%;
    white-space: nowrap;
}

div.catlinks {
    background-color: #F9F9F9;
    border: 1px solid #aaa;
    color: #aaa;
    padding: 10px;
    margin-top: 20px;
}


/* images */

div.image {
    border: 1px solid $C0C0C0;
    padding: 3px;
    margin: 8px;
    font-size: 80%;
    vertical-align: text-top;
}

.image-no-border {
    border: 0px;
    padding: 0px;
    margin: 8px;
    font-size: 80%;
    vertical-align: text-top;
}


/* roadmap.css */

table {
    margin-top: 10px;
    margin-bottom: 10px;
    border-collapse: collapse;
    padding: 4px;
    font-family: "Segoe UI", "Trebuchet MS", Arial, Verdana, sans-serif;
    font-size: 10pt;
}

th {
    border: 1px solid #999;
    border-collapse: collapse;
    padding: 4px;
    background-color: #CCCCCC;
    font-size: 10pt;
    font-weight: bold;
    text-align: center;
}

td {
    border: 1px solid #999;
    border-collapse: collapse;
    background-color: #F7F7F7;
    padding: 3px;
    font-size: 10pt;
}

td.working {
    background-color: #88FF88;
    padding: 3px;
    text-align: center;
}

td.unknown {
    background-color: #FFFFFF;
    padding: 3px;
    text-align: center;
}

td.partial {
    background-color: #FFFF88;
    padding: 3px;
    text-align: center;
}

td.not {
    background-color: #FF8888;
    padding: 3px;
    text-align: center;
}

td.progress {
    background-color: #8888FF;
    padding: 3px;
    text-align: center;
}

tr.working {
    background-color: #88FF88;
    padding: 3px;
    text-align: center;
}

tr.unknown {
    background-color: #FFFFFF;
    padding: 3px;
    text-align: center;
}

tr.partial {
    background-color: #FFFF88;
    padding: 3px;
    text-align: center;
}

tr.not {
    background-color: #FF8888;
    padding: 3px;
    text-align: center;
}

tr.progress {
    background-color: #8888FF;
    padding: 3px;
    text-align: center;
}