/*
- * www.debian.org stylesheet proposal
- *
- * Kalle Soderman, 2008 debian.css
- *
- * Copyleft : This work is free, you can copy, spread, and modify it under
- * the terms of the Free Art License http://artlibre.org/licence/lal/en/
- *
- *
- * Font size table
- * ---------------
- * Browser default 16px
- *
- * 14px 87.5% body
- * 24px 1.714em
- * 18px 1.286em
- * 16px 1.143em
- * 12px 0.857em
- * 11px 0.786em
- * 8px 0.57em
- */
-
-html {
- background-color: transparent;
+ http://www.debian.org Stylesheet
+
+ Copyright 2011 Kalle Söderman
+
+ This stylesheet is free software; you can redistribute it and/or modify it
+ under the terms of the GNU General Public License, version 2, as published by
+ the Free Software Foundation.
+
+ This program is distributed in the hope that it will be useful, but WITHOUT ANY
+ WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A
+ PARTICULAR PURPOSE. See the GNU General Public License for more details.
+
+ You should have received a copy of the GNU General Public License along with
+ this program; if not, write to the Free Software Foundation, Inc., 51 Franklin
+ Street, Fifth Floor, Boston, MA 02110-1301 USA.
+
+ The license text can also be found at http://www.gnu.org/copyleft/gpl.html and
+ /usr/share/common-licenses/GPL-2 on Debian GNU/Linux.
+*/
+
+/*
+ Font size table (Browser default 16px)
+
+ pixels relative
+ --------------------
+ 36px 2.25em
+ 31px 0.5161em
+ 24px 1.5em
+ 21px 1.3125em
+ 18px 1.125em
+ 16px 1em
+ 14px 0.875em
+ 12px 0.75em
+ 11px 0.6875em
+ 10px 0.625em
+ 9px 0.5625em
+ --------------------
+*/
+
+/* Reset */
+
+html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p,
+blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em,
+font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl,
+dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody,
+tfoot, thead, tr, th, td {
+ margin: 0;
+ padding: 0;
+ border: 0;
+ outline: 0;
+ font-weight: inherit;
+ font-style: inherit;
+ font-size: 100%;
+ font-family: inherit;
+ vertical-align: baseline;
}
+body { line-height: 1; color: black; background: white; }
+ol, ul { list-style: none; }
+table { border-collapse: separate; border-spacing: 0; }
+blockquote, q { quotes: "" ""; }
+html { background-color: transparent; }
+:focus { outline: 0; }
+caption, th, td { text-align: left; font-weight: normal; }
+blockquote:before, blockquote:after, q:before, q:after { content: ""; }
+
+/* Main */
+
body {
margin: 0;
- font: normal 87.5% sans-serif;
- line-height: 1.6;
- color: black;
+ font: normal 100% sans-serif;
+ line-height: 1.5;
+ color: #222;
background-color: white;
+ background-image:url('Pics/gradient.png');
+ background-position: 0 0;
+ background-repeat: repeat-x;
+ /* Uncomment to show baseline grid
+ background-image: url('24grid.png');
+ background-position: 30px 9px;
+ */
}
-
-#outer {
- margin: 0 10px 0 62px;
+#content {
+ margin: 0 10px 0 52px;
+}
+#inner {
+ position: relative;
+}
+#maincol {
+ margin: 0 15em 1.5em 0;
}
-/*
- * Header
- */
+/* Header */
#header {
margin:0;
- padding:0 10px 0 62px;
- font-size: 1em;
- background-image:url('Pics/gradient.png');
- background-position: 0 0;
- background-repeat: repeat-x;
+ padding:0 10px 0 52px;
}
-
#header a:link
-, #second-nav a:link {
+, #header a:visited
+, #second-nav a:link
+, #second-nav a:visited {
text-decoration: none;
}
-
#header a:hover
, #second-nav a:hover {
text-decoration: underline;
}
-
#breadcrumbs {
- font-size: 0.786em;
+ margin:0;
+ font-size: 0.75em;
+ text-transform: lowercase;
+ line-height: 2;
background-color: transparent;
background-color: #f5f6f7;
- margin:0;
- padding: 6px 0.25em 7px 0.25em;
border-bottom: 1px solid #d2d3d7 ;
- text-transform:lowercase;
- line-height: 1;
+ min-height: 20px;
+}
+#breadcrumbs:before {
+ content: "/";
+ margin-left: 0.5em;
+ margin-right: 0.5em;
}
-
p.section {
+ margin: 0;
+ padding: 0 5px 0 5px;
font-family:monospace;
- position:absolute;
- top: 0px;
- left:62px;
+ line-height: 16px;
+ color:white;
text-transform: uppercase;
letter-spacing: 0.08em;
+ position:absolute;
+ top: 0px;
+ left:52px;
background-color: #c70036;
- line-height: 16px;
+}
+p.section a {
+ color: white;
+ text-decoration: none;
+}
+p.section a:hover {
color:white;
- padding: 0 5px 0 5px;
- margin:0;
- font-size: 1em;
+ text-decoration: underline;
}
-
#navbar {
background-color: transparent;
list-style:none;
padding: 0;
margin-top:0;
margin-bottom:0;
- line-height:1;
}
-
#navbar ul {
- margin:0 ;
- padding:0 ;
- height: 54px;
+ margin: 0;
+ padding: 0;
clear: both;
overflow: hidden;
+ min-height: 45px;
}
-
#navbar li {
list-style: none;
float: left;
padding: 0;
margin: 0;
- font-size: 1em;
}
-
#navbar a:link
, #navbar a:visited {
- padding: 30px 1em 10px 1em;
+ padding: 1.75em 0.5em 0.25em 0.5em;
border-left: 1px solid transparent;
border-right: 1px solid transparent;
display: block;
+ text-decoration: none;
}
-
#navbar a:visited {
color: #54638c;
}
-
#navbar a:hover
, #navbar a:visited:hover {
- background-color: #efefef;
+ background-color: #f5f6f7;
border-left: 1px solid #d2d3d7;
border-right: 1px solid #d2d3d7;
+ text-decoration: underline;
}
-
-#sitetools {
+ul.subnav {
+ list-style: none;
+ margin-left: 0;
+ padding-left: 0;
+ margin-top: 0;
+}
+ul.subnav li {
+ display: inline;
+ margin-right: 1em;
+}
+#searchbox {
text-align:left;
- margin: 0 10px 0 0;
- padding: 0px 0 1px 0;
+ line-height: 1;
+ margin: 0 10px 0 0.5em;
+ padding: 1px 0 1px 0;
position: absolute;
top:0;
right:0;
- border-right: 1px solid white;
- border-left: 1px solid #d2d3d7;
- line-height: 1;
+ font-size: 0.75em;
+}
+#searchbox p {
+ margin: 0;
+ padding: 0;
}
-
#upperheader {
margin:0;
padding:0;
}
-
#logo {
position:absolute;
top:0;
background-color: transparent;
border: 1px solid transparent;
border-top: 0;
+ width: 50px;
+ height: 5.07em;
+ min-height: 65px;
}
-
#logo a {
display: block;
- height:71px;
- padding: 8px 5px 0 5px;
+ position: relative;
+ padding: 0;
+ height: 100%;
+ min-height: 65px;
}
-
#logo img {
margin-top: 5px;
+ position: absolute;
+ bottom: 0.3em;
+ overflow: auto;
}
-
#logo:hover {
border: 1px solid #d2d3d7 ;
border-top: 0;
- background-color: #eee;
+ background-color: #f5f6f7;
}
-/*
- * Links
- */
+/* Links */
-a:link {
+a:link {
color: #0035c7;
text-decoration: underline;
}
-
a:visited {
color: #54638c;
}
-
-a:hover {
+a:link:hover {
text-decoration: none;
color: #00207a;
}
-
+a:visited:hover {
+ text-decoration: none;
+}
a:active {
color:#c2c3c7;
}
-
a img {
border:0;
}
+a.rss_logo {
+ font-size: 0.75em;
+ float: right;
+ width: 35px;
+ line-height: 10px;
+ color: #ffffff;
+ background-color: #ff6600;
+ font-weight: bold;
+ font-family: sans-serif;
+ text-align: center;
+ text-decoration: none;
+ padding: 0.25em;
+ margin-left: 0.25em;
+ border: 1px solid #ff6600;
+}
-/*
- * Leftcol (Should be renamed secondnav)
- */
+a.rss_logo:hover {
+ background-color: white;
+ border: 1px solid #ff6600;
+ color: #ff6600;
+}
+
+a.rss_logo.generic {
+ background-color: #ff8800;
+}
+
+a.rss_logo.generic:hover {
+ background-color: #ee7700;
+}
+
+
+/* Secondnav */
#second-nav {
width: 16em;
- float:right;
- padding:0 0 0 1em;
- margin: 1em 0 10px 1em;
- border-left:1px solid #d3d6df;
- font-size: 0.786em;
+ font-size: 0.75em;
line-height: 1.5;
+ float: right;
+ top: 0;
+ right: 0;
+ margin: 3em 0 0 0;
+ padding: 0 0 0 1em;
+ border-left: 1px solid #d2d3d7 ;
}
-
#second-nav ul {
padding:0;
margin:0;
list-style:none;
}
-
#second-nav ul ul {
margin-left: 1em;
}
-
#second-nav li {
font-weight: normal;
- margin-top:0.5em;
+ margin:0;
+ padding:0;
}
-
#second-nav p {
- line-height: 1;
+ line-height: 2;
font-weight: bold;
+ margin: 0;
}
-
#second-nav h2 {
margin:0;
}
-
-/*
- * Typography
- */
+/* Typography */
p {
- margin: 0 0 1em 0;
+ margin: 1.5em 0 1.5em 0;
+}
+strong {
+ font-weight: bold;
+}
+em {
+ font-style: italic;
+ color: #444;
+}
+small {
+ font-size: 0.75em;
+}
+sup {
+ font-size: 0.75em;
+ vertical-align:top;
}
-
h1
, h2
, h3
-, h4 {
+, h4
+, h5
+, h6 {
font-weight: 600;
- margin-bottom: 0.5em;
- margin-top: 1em;
+ color: black;
}
-
h1 {
- line-height: 1em;
+ font-weight: normal;
+ font-size: 1.8em;
+ line-height: 0.83333;
+ margin: 0.83333em 0 0.83333em 0;
}
-
-h4 {
- font-size: 1em;
+h2 {
+ font-size: 1.4em;
font-weight: normal;
- font-style: italic;
+ line-height: 1.0714286;
+ margin: 1.0714286em 0 1.0714286em 0;
}
-
h3 {
- font-size: 1em;
+ font-size: 1.125em;
+ line-height: 1.333em;
+ margin: 1.333em 0 0 0;
}
-
-h2 {
- font-size: 1.143em;
+h4 {
+ font-weight: normal;
+ font-style: italic;
+ margin: 1.5em 0 1.5em 0;
+ color: #444;
+}
+h5 {
+ font-style: italic;
+ font-size: 0.75em;
+ margin: 2em 0 2em 0;
}
-
ol,ul {
- padding-left: 2em;
+ padding-left: 1.5em;
margin-left:0;
+ margin: 1.5em 0 1.5em 0;
+}
+ol>ol, ul>ul, li>ol, li>ul {
+ margin: 0;
}
+ol {
+ list-style-type: decimal;
+}
+ul {
+ list-style-type: disc;
+}
+th {
+ font-weight: bold;
+ margin: 1.5em 0 1.5em 0;
+}
hr {
border: none;
background-color: #bbb;
height: 1px;
+ margin: 1.4375em 0 1.5em 0;
}
-
-.hidecss {
- display: none;
-}
-
pre {
+ margin: 1.5em 0 1.5em 0;
overflow: auto;
+ font-family: monospace;
+ white-space: pre;
+ color: black;
+}
+tt, code {
+ font-family: monospace;
+ white-space: pre;
+ color: black;
+}
+dt {
+ margin: 1.5em 0 0 0;
+ font-weight: bold;
}
-
dd {
- margin-left: 2em;
- margin-bottom: 1em;
+ margin: 0 0 0 1.5em;
+}
+blockquote {
+ font-size: 0.75em;
+ margin: 2em;
+ line-height: 2;
+}
+cite {
+ font-style: italic;
+ color: #444;
+}
+acronym, abbr {
+ text-transform: uppercase;
+ font-size: 0.9em;
}
-
.toc {
- font-size: 0.8em;
+ font-size: 0.75em;
list-style:none;
- margin: 1em 0 1em 0;
background-image: url('Pics/greydot.png');
background-position: bottom left;
background-repeat: repeat-x;
- line-height:1.5;
+ line-height:1.833;
padding: 0;
- max-width: 67%;
+ max-width: 62%;
+ margin: 2em 0 2em 0;
}
-
.toc li {
background-image: url('Pics/greydot.png');
background-position: top left;
background-repeat: repeat-x;
- padding: 0.25em 0 0.25em 0;
+ padding: 0.0833em 0 0.0833em 0;
}
-
.toc a {
display:block;
+ text-decoration: none;
}
-
.toc a:hover {
display:block;
background-color: #f0f0f4;
+ text-decoration: underline;
+}
+.toc dt {
+ margin: 0;
+ background-image: url('Pics/greydot.png');
+ background-position: top left;
+ background-repeat: repeat-x;
+ padding: 0.0833em 0 0.0833em 0;
}
-/*
- * Sitemap
- */
+/* Sitemap */
.card {
clear:both;
- margin:2em 0 2em 0;
+ margin:1.5em 0 1.5em 0;
background-position: 0 -50px;
background-repeat: repeat-x;
- padding:8px 0 8px 0;
+ padding:0;
}
-
.card ul {
- margin:0.5em 0 1em 0;
}
-
.card ul li {
list-style:none;
}
-
.card h2 {
- margin:0;
}
-
.lefthalf {
float:left;
}
-
.righthalf {
margin-left:50%;
}
-
.lefthalf ul {
margin-top:0;
}
-/*
- * Footer
- */
+/* Footer */
#footer {
- font-size: 0.786em;
+ font-size: 0.75em;
border: 1px solid #dfdfe0;
- border-bottom: 0;
padding:1em;
- background-color: #f2f3f6;
- margin: 0 0 0 0;
+ background-color: #f5f6f7;
+ margin: 0 10px 0 52px;
+ line-height: 1.5em;
+ border-left: 0;
+ border-right: 0;
+}
+#content #footer {
+ margin-left: 0;
+}
+#footer p {
+ margin: 1em 0 1em 0;
}
-
#footer hr {
border-top: 1px solid #d2d3d7;
border-bottom: 1px solid white;
height: 0;
}
-
#footer .editbar li {
display: inline;
margin-right: 2em;
}
-
#footer .info {
- font-size: 1em;
}
-
#fineprint {
margin-bottom: 1em;
}
-
#footermap {
list-style:none;
margin: 0 0 0 0;
padding: 0;
width:100%;
- font-size: 11px;
overflow: hidden;
- line-height: 1.6;
border: 0;
}
-
ul#footermap-cola a
, ul#footermap-colb a
, ul#footermap-colc a
, ul#footermap-cole a {
padding-left: 0;
}
-
ul#footermap-cola
, ul#footermap-colb
, ul#footermap-colc
float:left;
width: 19%;
min-width: 11em;
- height: 12em; /* Update when adding items */
+ height: 12em; /* Update when adding items */
margin:0 1% 0 0;
- padding: 10px 0 0 0;
+ padding: 2em 0 0 0;
list-style: none;
}
-
ul#footermap-cole {
width: 18.9%;
margin-right:0;
}
-
#footermap-wrap {
- padding:1em;
+ padding:2em;
border-top: 1px solid white;
}
-
#footermap a {
margin: 0;
}
-
#footermap ul{
list-style: none;
padding:0;
}
-
#footermap li {
text-indent:0;
background-color: transparent;
font-weight:bold;
- margin-top: 0.5em;
}
-
#footermap li ul {
margin: 0;
- padding: 0:
+ padding: 0;
}
-
#footermap li li {
margin:0;
text-indent:0;
padding:0;
font-weight:normal;
- line-height: 1.5;
border:0;
background-image:none;
background-color:transparent;
}
-
-#sitetools form {
- margin:0;
- padding:0;
-}
-
-#sitetools input {
- margin: 0 0 0 0.25em;
- padding-left: 4px;
- font-size: 0.786em;
- padding-right: 4px;
-}
-
-#sitetools select {
- font-size: 0.786em;
- margin-left: 0.5em;
-}
-
-#sitetools form p {
- display: inline;
- line-height: 1;
- margin:0;
- padding:0;
- font-size: 0.786em;
-}
-
-.sitetool a {
- margin: 0.5em 0 0.5em 1em;
- padding: 0 0 0 0;
- float: left;
+#serverselect {
}
-
-.sitetool {
- margin:0;
- padding: 2px 5px 2px 5px;
- border-left: 1px solid white;
- border-right: 1px solid #d2d3d7;
- display:block;
- float:left;
-}
-
#serverselect input
, #serverselect option
, #serverselect select {
- font-size: 11px;
}
-
#serverselect ul {
display: inline;
margin-left: 2em;
}
-
#serverselect li {
list-style: none;
display: inline;
padding:0 1em 0 1em;
margin:0;
}
-
#serverselect form p {
margin:0;
padding:0;
line-height: 1;
}
-
-
-
.lcol50 {
float: left;
width: 49%;
- font-size:0.8em;
+ font-size:0.75em;
margin:0 0 0 0;
padding:0 0.5em 0 0;
}
-
.lcol50 h2 {
margin-top:0;
}
-
.rcol50 {
margin:0 0 0 51%;
padding:0;
- font-size:0.8em;
+ font-size:0.75em;
+}
+form#pageLang {
+ display: inline;
}
-/*
- * Extras
- */
+/* Extras */
+input:focus {
+ background-color:#FFFFCB;
+
+}
+.hidecss {
+ display: none;
+}
.clear {
clear:both
}
-
#clear {
clear:both;
border:0;
height:1px;
display:block;
- }
-
+}
.quicklist:before {
content: "Quick Links: ";
font-weight: bold;
}
-
.quicklist {
list-style: none;
- font-size: 0.8em;
- margin:0;
+ font-size: 0.75em;
+ margin: 2em 0 2em 0;
padding:0;
text-indent:0;
+ line-height: 2em;
}
-
.quicklist li {
display:inline;
}
-
.item p{
margin: 0;
}
-
.item h2
, .item p
, .item ul{
margin-right: 10px
}
+.item h2
+, .item h3
+, .item h4
+, .item h5 {
+ margin-top: 0;
+}
+.line {
+ padding: 0;
+ width: auto;
+ overflow: hidden;
+ }
+div.downloads {
+ border-top: 0.17em solid #339900;
+ margin: 1.33em 0 0 0;
+}
+.downloads ul.downlist {
+ margin:0;
+}
+div.downloads .col50 {
+ border-top: 0.15em solid #339900;
+}
+ul.downlist {
+ padding-left: 30px;
+ text-indent:0;
+ background: url('Pics/emblem-downloads.png') no-repeat 0 0.15em;
+ /*
+ * border-top: 0.17em solid #339900;
+ */
+}
+ul.quicklist.downlist {
+ border-top: 0.17em solid #339900;
+ padding-top: 0.25em;
+ margin-top: 1.6em;
+}
+ul.downlist li {
+ display: inline;
+}
+ul.downlist li:after {
+ content: ', ';
+}
+ul.downlist li:last-child:after {
+ content: '';
+}
+div.tip
+, div.important
+, div.warning
+, div.note
+, p.trans-note {
+ padding:0 2em 0 4em;
+ margin: 1.85em 0 1.85em 0;
+ background-repeat: no-repeat;
+ background-position: 0.5em 1em;
+ font-size: 0.75em;
+ line-height: 2em;
+ background-color:#FFFFCB;
+ border:0.15em solid #CCCCA3;
+}
+div.tip p
+, div.important p
+, div.warning p
+, div.note p {
+ margin: 1em 0 1em 0;
+}
+div.tip
+, p.trans-note {
+ background-image: url('Pics/admon-tip.png');
+}
+div.important{
+ background-image: url('Pics/admon-important.png');
+}
+div.warning {
+ background-image: url('Pics/admon-warning.png');
+}
+div.note {
+ background-image: url('Pics/admon-note.png');
+}
-.col50 {
- width:50%;
+/* Layout Elements */
+
+.col50
+, .cardleft
+, .cardright {
+ width:47.5%;
float: left;
+ padding-bottom: 1.5em;
}
-
-.lastcol {
+.lastcol
+, .cardright {
margin: auto;
- width: 50%;
+ width: 47.5%;
float:left;
+ padding-right: 0;
+ margin-left: 5%;
}
-
.lastcol h2
, .lastcol p
, .lastcol ul {
- margin-left: 10px;
margin-right:0;
}
-
-.line {
- clear: both;
- display: block;
- margin: 0 0 2em 0;
- padding: 0;
- width: auto;
- overflow: hidden;
+.cardleft h2 {
+ margin-right: 1em;
}
-
-.cardleft {
- width:50%;
- float: left;
+.cardright div {
+ margin-left: 1.5em;
}
-
-.cardright {
- margin: auto;
- width: 50%;
- float:left;
+.cardright h2 {
+ margin-left: 1em;
}
-
-.cardleft div
-, .cardleft h2 {
- margin-right: 0.5em;
+.votemenu a {
+ display:block;
}
-
-.cardright div
-, .cardight h2 {
- margin-left: 0.5em;
+table.vote td, table.vote th {
+ padding-right: 1.5em;
}
-
-ul.votemenu {
- font-size: 0.8em;
- list-style:none;
- margin: 1em 0 1em 0;
- background-image: url('Pics/greydot.png');
- background-position: bottom left;
- background-repeat: repeat-x;
- line-height:1.5;
- padding: 0;
- max-width: 67%;
+#maincol.with-toolbox {
+ margin-right: 14em;
}
-
-.votemenu li {
- background-image: url('Pics/greydot.png');
+div.tabular table, table.tabular, table.vendors {
+/* border-bottom: 1px solid #a9abb3;
+ border-top: 1px solid #a9abb3; */
+ border-bottom: 0.15em solid #666;
+ border-top: 0.15em solid #666;
+ width: auto;
+ font-size: 0.75em;
+ line-height: 2em;
+ margin-bottom: 4em;
+ margin-top: -0.169em;
+}
+table td {
+ padding-right: 1.5em;
+}
+div.tabular table tr, table.tabular tr, table.vendors tr {
+ width: 100%;
+}
+table th {
+ padding-right: 1.5em;
+}
+div.tabular table td, table.tabular td, table.vendors td {
+ background-image: url(Pics/greydot.png);
background-position: top left;
background-repeat: repeat-x;
- padding: 0.25em 0 0.25em 0;
- }
-
-.votemenu a {
- display:block;
}
-
-.votemenu a:hover {
- display:block;
- background-color: #f0f0f4;
+div.tabular table > td:fist-child, table.tabular > td:fist-child, table.vendors > td:fist-child {
+ background-image: none;
+}
+#pageLang p, #pageLang form {
+ display: inline;
+}
+.inline a {
+ float: left;
+ margin-right: 1em;
}