updated for the new design (quite a rewrite)

CVS version numbers

english/debian.css: 1.81 -> 1.82

1 files changed, 720 insertions, 590 deletions

diff --git a/english/debian.css b/english/debian.css
index c7f3d4329f6..1abbf704393 100644
--- a/english/debian.css
+++ b/english/debian.css
@@ -1,702 +1,867 @@
-/* css file for debian web site - Jutta Wrage 2004 */
-/* please see README_CSS.txt for more information */
+/*
+	http://www.debian.org Stylesheet
 
-html, body {
-	color: #000000;
-	background-color: #FFFFFF;
-	margin: 0 4px 0 4px;
-	padding: 0;
-}
+	Copyright 2011 Kalle Söderman
 
-img { border: 0; }
+	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.
 
-h1 { text-align: center; }
+	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.
 
-acronym {
-	border-bottom: 1px dotted #000000;
-}
+	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.
 
-hr.hidecss {
+	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: 1px dotted grey; }
+caption, th, td { text-align: left; font-weight: normal; }
+blockquote:before, blockquote:after, q:before, q:after { content: ""; }
+
+/* Main */
+
+body {
+	margin: 0;
+	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; 
+	*/
+}
+#content {
+	margin: 0 10px 0 52px;
 }
-
-hr {
-	border-bottom: 0;
-	border-top: 1px solid #BFC3DC;
-}
-
-samp {
-	display: block;
-	margin-left: 2em;
+#inner {
+	position: relative;
 }
-div.sampleblock {
-	width: 80%;
-	margin: auto;
-	font-family:courier, serif;
-	font-size: 90%;
-}
-.centerblock {
-        width: 90%;
-	margin-left: auto;
-	margin-right: auto;
-}		
-div.quoteblock {
-	width: 75%;
-	margin: auto;
-	font-size: 90%;
-	text-align: justify;
+#maincol {
+	margin: 0 15em 1.5em 0;
 }
 
-.quoteblock div.preimg {
-	float: left;
-	margin-top: 0.2em;
+/* Header */
+
+#header {
+	margin:0;
+	padding:0 10px 0 52px; 
 }
-.quoteblock cite {
-	display: block;
-	text-align: right;
+#header a:link
+, #header a:visited
+, #second-nav a:link
+, #second-nav a:visited {
+	text-decoration: none;
 }
-blockquote.question {
-	font-style: italic;
+#header a:hover
+, #second-nav a:hover {
+	text-decoration: underline;
+}
+#breadcrumbs {
+	margin:0;
+	font-size: 0.75em;
+	text-transform: lowercase;
+	line-height: 2;
+	background-color: transparent;
+	background-color: #f5f6f7;
+	border-bottom: 1px solid #d2d3d7 ;
+	min-height: 20px;
+}
+#breadcrumbs:before {
+	content: "/";
+	margin-left: 0.5em;
+	margin-right: 0.5em;
 }
-blockquote.question p span {
-	font-style: normal;
-	width: 10%;
+p.section {
+	margin: 0;
+	padding: 0 5px 0 5px;
+	font-family:monospace;
+	line-height: 16px;
+	color:white;
+	text-transform: uppercase;
+	letter-spacing: 0.08em;
+	position:absolute;
+	top: 0px;
+	left:52px;
+	background-color: #c70036;
+}
+p.section a {
+	color: white;
+	text-decoration: none;
 }
-#pagewidth {
-	width: 100%;
-	text-align: left;
+p.section a:hover {
+	color:white;
+	text-decoration: underline;
 }
-
-/* now the header*/
-#header {
-	margin-left: -3px;
-	width: 100%;
-	height: auto;
+#navbar {
+	background-color: transparent;
+	list-style:none;
+	display:block;
+	border-bottom:1px solid #c70036;
+	text-indent:0;
+	padding: 0;
+	margin-top:0;
+	margin-bottom:0;
 }
-
-/* upper nested header box*/
-#upperheader {
-	width: 100%;
-	margin-top: 11px;
-	height: auto;
-	background: #FFFFFF;
+#navbar ul {
+	margin: 0;
+	padding: 0;
+	clear: both;
+	overflow: hidden;
+	min-height: 45px;
 }
-
-#logo {
+#navbar li {
+	list-style: none;
 	float: left;
-	margin-left: 6px;
-	background: #FFFFFF;
+	padding: 0;
+	margin: 0;
 }
-
-#serverselect {
-	float: right;
+#navbar a:link
+, #navbar a:visited {
+	padding: 1.75em 0.5em 0.25em 0.5em;
+	border-left: 1px solid transparent;
+	border-right: 1px solid transparent;
 	display: block;
-	padding-top: 1px;
-	margin-right: 6px;
-	margin-left: auto;
-	text-align: right;
-	top: 0;
-	right: 0;
+	text-decoration: none;
 }
-
-#serverselect p {
-	color: #990000;
-	font-size: 0.8em;
-	font-weight: normal;
+#navbar a:visited {
+	color: #54638c;
 }
-
-#serverselect p select {
-	font-size: 88%;
+#navbar a:hover
+, #navbar a:visited:hover {
+	background-color: #f5f6f7;
+	border-left: 1px solid  #d2d3d7;
+	border-right: 1px solid #d2d3d7;
+	text-decoration: underline;
 }
-
-#serverselect p input {
-	font-size: 88%;
+ul.subnav {
+	list-style: none;
+	margin-left: 0;
+	padding-left: 0;
+	margin-top: 0;
 }
-.centerlogo {
-	margin-left: 260px;
-	margin-right: auto;
-	width: 125px;
-	text-align: center;
-	vertical-align: bottom;
+ul.subnav li {
+	display: inline;
+	margin-right: 1em;
 }
-#cdlogo {
+#searchbox {
+	text-align:left;
+	line-height: 1;
+	margin: 0 10px 0 0.5em;
+	padding: 1px 0 1px 0;
+	position: absolute;
+	top:0;
+	right:0;
+	font-size: 0.75em;
+}
+#searchbox p {
+	margin: 0;
+	padding: 0;
 }
-
-#hpacketsearch {
+#upperheader {
+	margin:0;
+	padding:0;
+}
+#logo {
+	position:absolute;
+	top:0;
+	left:0;
+	padding: 0;
+	background-color: transparent;
+	border: 1px solid transparent;
+	border-top: 0;
+	width: 50px;
+	height: 5.07em;
+	min-height: 65px;
+}
+#logo a {
 	display: block;
-	padding-top: 1px;
-	padding-left: 5px;
-	margin-right: 0.2em;
-	margin-left: auto;
-	text-align: left;
-	width: 25em;
-	top: 0em;
-	right: 0em;
-}
-
-#hpacketsearch p small {
-	color: #990000;
-	font-size: 0.8em;
-	font-weight: normal;
+	position: relative;
+	padding: 0;
+	height: 100%;
+	min-height: 65px;
 }
-
-#hpacketsearch p select {
-	font-size: 88%;
+#logo img {
+	margin-top: 5px;
+	position: absolute;
+	bottom: 0.3em;
+	overflow: auto;
 }
-
-#hpacketsearch p input {
-	font-size: 88%;
+#logo:hover {
+	border: 1px solid #d2d3d7 ;
+	border-top: 0;
+	background-color: #f5f6f7;
 }
 
-#navbar {
-	/* margin-top: 1em; */
-	clear: both;
-	padding-left: 0px;
-	/* margin-top: 5px; */
-	padding-top: 6px;
-	padding-bottom: 4px;
-	width: 100%;
-	height: auto;
-	text-align: center;
-	background: #BF1238;
+/* Links */
+
+a:link {
+	color: #0035c7;
+	text-decoration: underline;
 }
-#navbar ul {
-	display: inline;
-	list-style-type: none; 
-	padding-left: 0px;
-	line-height: 1.5em;
+a:visited {
+	color: #54638c;
 }
-#navbar ul li {
-	display: inline;
-	margin: 0;
-	white-space: nowrap;
+a:link:hover {
+	text-decoration: none;
+	color: #00207a;
 }
-#navbar a {
-	color: #FFFFFF;
+a:visited:hover {
 	text-decoration: none;
-	padding: 0.2em 0.4em 0.2em 0.4em;
-	background-color: #000084;
-	border: 1px solid #000084;
-	font-family: Arial, Helvetica, sans-serif;
-	font-weight: bold;
-	font-size: 0.9em;
 }
-#navbar a:hover {
-	background: #0000CC;
+a:active {
+	color:#c2c3c7;
 }
-#navbar .hidecss, .hidecss {
-	display: none;
+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;
 }
 
-/* the rest of page out of two nested boxes around */
+a.rss_logo:hover {
+	background-color: white;
+	border: 1px solid #ff6600;
+	color: #ff6600;
+}
 
-#outer {
-	background-color: #FFFFFF;
-	width: auto;
-	/* border:solid white 2px; */
+a.rss_logo.generic {
+	background-color: #ff8800;
 }
 
-#inner {
-	margin: -2px;
-	margin-top: 0;
-	width: 100%;
-	background: #FFFFFF;
-	/* overflow: auto; */
+a.rss_logo.generic:hover {
+	background-color: #ee7700;
 }
 
-#leftcol {
-	float: left;
-	margin: 0em 0.4em 0 0;
-	padding-left: 0;
-	padding-bottom: 1em;
-	width: auto;
-	background: #BBDDFF;
-	font-size: 0.9em;
-	font-family: Arial, Helvetica, sans-serif;
-	border: 1px solid #BBDDFF;
-	/* overflow: auto; */
+
+/* Secondnav */
+
+#second-nav {
+	width: 16em;
+	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 ;
 }
-#leftcol a:link, #leftcol a:visited {
-	display: block;
+#second-nav ul {
+	padding:0;
+	margin:0;
+	list-style:none;
 }
-#leftcol a:hover {
-	background-color: #DDEEFF;
-	/* background-color: #FFFFFF; */
+#second-nav ul ul {
+	margin-left: 1em;
 }
-#leftcol ul {
-	margin: 2px;
-	padding: 0;
-	list-style-type: none;
+#second-nav li {
+	font-weight: normal;
+	margin:0;
+	padding:0;
+}
+#second-nav p {
+	line-height: 2;
 	font-weight: bold;
+	margin: 0;
 }
-#leftcol ul.votemenu {
-	width: 11em;
+#second-nav h2 {
+	margin:0;
 }
-#leftcol ul.cdmenu {
-	width: 12em;
+
+/* Typography */
+
+p {
+	margin: 1.5em 0 1.5em 0;
 }
-#leftcol ul.votemenu ul li, #leftcol ul.cdmenu ul li {
-	padding-bottom: 0.4em;
+strong {
+	font-weight: bold;
 }
-#leftcol li ul {
-	display: inline;
+em {
+	font-style: italic;
+	color: #444;
 }
-#leftcol ul li {
-	padding: 0.2em 0;
+small {
+	font-size: 0.75em;
 }
-#leftcol ul ul {
-	font-size: 0.9em;
-	margin: 0;
+sup {
+	font-size: 0.75em;
+	vertical-align:top;
 }
-#leftcol ul li a {
-	line-height: 1.2em;
-	padding-right: 0.5em;
-	/* padding: 0.2em 0 0.3em 0em; */
+h1
+, h2
+, h3
+, h4
+, h5
+, h6 {
+	font-weight: 600;
+	color: black;
 }
-#leftcol ul ul li a {
+h1 {
 	font-weight: normal;
-	padding: 0.1em 0.5em;
-	line-height: 1.1em;
-}
-#leftcol ul ul li {
-	padding-top: 0;
-}
-#leftcol p {
-	margin-left: 2px;
-	margin-right: 2px;
+	font-size: 1.8em;
+	line-height: 0.83333;
+	margin: 0.83333em 0 0.83333em 0;
 }
-#leftcol p a {
-	display: block;
-	margin: 0;
+h2 {
+	font-size: 1.4em;
+	font-weight: normal;
+	line-height: 1.0714286;
+	margin: 1.0714286em 0 1.0714286em 0;
 }
-#leftcol p img {
-	margin-left: 1em;
+h3 {
+	font-size: 1.125em;
+	line-height: 1.333em;
+	margin: 1.333em 0 0 0;
 }
-#leftcol .menuselected {
-	color: #BF1238;
+h4 {
+	font-weight: normal;
+	font-style: italic;
+	margin: 1.5em 0 1.5em 0;
+	color: #444;
 }
-#leftcol ul ul .menuselected {
-	text-indent: 0.5em;
+h5 {
+	font-style: italic;
+	font-size: 0.75em;
+	margin: 2em 0 2em 0;
 }
-#maincol {
-	background: #FFFFFF;
-	margin-left: 12em;
-	margin-right: 0.5em;
-	margin-bottom: 1em;
+ol,ul {
+	padding-left: 1.5em;
+	margin-left:0;
+	margin: 1.5em 0 1.5em 0;
 }
-
-#lefthalfcol {
-	float: left;
-	margin-left: 0em;
-	width: 49%;
+ol>ol, ul>ul, li>ol, li>ul {
+	margin: 0;
 }
 
-#lefthalfcol h4, #lefthalfcol h3 , #righthalfcol h4, #righthalfcol h3 {
-	margin: 0em;
+ol {
+	list-style-type: decimal;
 }
-	
-#lefthalfcol dl {
-	margin-top: 0em;
+ul {
+	list-style-type: disc;
 }
-
-#righthalfcol {
-	margin-left: 50%;
-	width: 49%;
+th {
+	font-weight: bold;
+	margin: 1.5em 0 1.5em 0;
 }
-
-#righthalfcol dl {
-	margin-right: 0.2em;
+hr {
+	border: none;
+	background-color: #bbb;
+	height: 1px;
+	margin: 1.4375em 0 1.5em 0;
 }
-
-#footer {
-	clear: both;
-	width: 100%;
-	padding-top: 3px;
-	bottom: 0;
-	text-align: center;
-	margin: 0px;
+pre {
+	margin: 1.5em 0 1.5em 0;
+	overflow: auto;
+	font-family: monospace;
+	white-space: pre;
+	color: black;
 }
-
-#fineprint {
-	margin-top: 0.2em;
-	padding-top: 3px;
-	text-align: center;
-	font-size: 0.85em;
+tt, code {
+	font-family: monospace;
+	white-space: pre;
+	color: black;
 }
-
-#outer>#inner { border-bottom: 1px solid #BFC3DC; }
-.bordertop { border-top: 1px solid #BFC3DC; }
-
-dl.gloss dt {
+dt {
+	margin: 1.5em 0 0 0;
 	font-weight: bold;
 }
-
-#footer ul {
-	display: inline;
-	list-style-type: none;
+dd {
+	margin:  0 0 0 1.5em;
 }
-
-#footer ul li {
-	display: inline;
+blockquote {
+	font-size: 0.75em;
+	margin: 2em;
+	line-height: 2;
 }
-
-#footer ul li a, table.y2k td {
-	white-space: nowrap;
+cite {
+	font-style: italic;
+	color: #444;
 }
-
-#footer p {
-	margin: 0px;
+acronym, abbr {
+	text-transform: uppercase;
+	font-size: 0.9em;
 }
-
-#main {
-	background: #bbddff;
-	padding: 1em 0; /* have some padding to get rid of collapsed margins */
+.toc {
+	font-size: 0.75em;
+	list-style:none;
+	background-image: url('Pics/greydot.png');
+	background-position: bottom left;
+	background-repeat: repeat-x;
+	line-height:1.833;
+	padding: 0;
+	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.0833em 0 0.0833em 0;
+ }
+.toc a {
+	display:block;
+	text-decoration: none;
 }
-
-/* classes for cards */
-
-.cardleft {
-	margin: 0 0 1em;
-	float: left;
-	width: 49%;
+.toc a:hover {
+	display:block;
+	background-color: #f0f0f4;
+	text-decoration: underline;
 }
-.cardright {
-	margin-left: 50%
-	/*margin: 0 1% 2em 50%; */
+.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 */
+
 .card {
-	clear: left;
-	margin: 0 0 1em;
+	clear:both;
+	margin:1.5em 0 1.5em 0;
+	background-position: 0 -50px;
+	background-repeat: repeat-x;
+	padding:0;
 }
-
-.cardleft h2, .cardright h2, .card h2 {
-	font-size: 120%;
-	background: #000000;
-	color: #FFD400;
-	display: inline;
-	padding: 0.2em 0.4em;
-	margin: 0 10px;
-	font-family: Arial, Helvetica, sans-serif;
-	letter-spacing: 0.2em;
+.card ul {
 }
-
-.cardleft dl dd, .cardright dl dd , .card dl dd {
-	padding-bottom: 0.5em;
+.card ul li {
+	list-style:none;
 }
-
-.cardleft div, .cardright div, .card div {
-	border: 2px solid #000000;
-	background: #FFFFFF;
-	padding: 0.5em;
-	margin: 2px 10px;
-	/* the next two lines xpand the div to heigth of left inner div */
-	overflow: auto;
+.card h2 {
 }
-
-div.lefthalf {
-	float: left;
-	width: 49%;
-	border: 0;
-	margin: 0; 
-	padding: 0;
+.lefthalf {
+	float:left;
 }
-
-div.righthalf {
-	border: 0;
-	margin: 0;
-	padding: 0;
+.righthalf {
+	margin-left:50%;
 }
-/* classes and div names for package pages */
-
-#pdesc, #pdeps, #pdownload, #pmoreinfo {
-	margin-left: 1em;
-	margin-right: 1em;
+.lefthalf ul {
+	margin-top:0;
 }
 
-#pdesc p {
-	text-align: justify;
-}
+/* Footer */
 
-.pdescshort {
-	text-align: left;
-	font-size: large;
-	font-weight: bold;
+#footer {
+	font-size: 0.75em;
+	border: 1px solid #dfdfe0;
+	padding:1em;
+	background-color: #f5f6f7;
+	margin: 0 10px 0 52px;
+	line-height: 1.5em;
+	border-left: 0;
+	border-right: 0;
+	clear: both;
 }
-
-#pdeps table tr td {
-	font-size: 0.9em;
+#content #footer {
+	margin-left: 0;
 }
-
-#pdeps ul {
-	list-style-type: none;
-	padding-left: 2em;
+#footer p {
+	margin: 1em 0 1em 0;
 }
-
-#pdeps li {
-	text-indent: -2em;
+#footer hr {
+	border-top: 1px solid #d2d3d7;
+	border-bottom: 1px solid white;
+	height: 0;
 }
-
-#pdeps ul.uldep, #pdeps ul.uladep {
-	list-style-type: disc;
-	list-style-image: url(http://packages.debian.org/Pics/dep.gif);
+#footer .editbar li {
+	display: inline;
+	margin-right: 2em;
 }
-
-#pdeps ul.ulrec, #pdeps ul.ulidep {
-	list-style-type: disc;
-	list-style-image: url(http://packages.debian.org/Pics/rec.gif);
+#footer .info {
 }
-
-#pdeps ul.ulsug {
-	list-style-type: disc;
-	list-style-image: url(http://packages.debian.org/Pics/sug.gif);
+#fineprint {
+	margin-bottom: 1em;
 }
-
-#pdeps ul.uldep li, #pdeps ul.ulrec li, #pdeps ul.ulsug li, #pdeps ul.uladep li, #pdeps ul.ulidep li {
-	padding-left: 2em;
+#footermap {
+	list-style:none;
+	margin: 0 0 0 0;
+	padding: 0;
+	width:100%;
+	overflow: hidden;
+	border: 0;
+}
+ul#footermap-cola a
+, ul#footermap-colb a
+, ul#footermap-colc a
+, ul#footermap-cold a
+, ul#footermap-cole a {
+	padding-left: 0;
 }
-#pdeps dl {
+ul#footermap-cola
+, ul#footermap-colb
+, ul#footermap-colc
+, ul#footermap-cold
+, ul#footermap-cole {
+	float:left;
+	width: 19%;
+	min-width: 11em;
+	height: 12em;		/* Update when adding items */
+	margin:0 1% 0 0;
+	padding: 2em 0 0 0;
+	list-style: none;
+}
+ul#footermap-cole {
+	width: 18.9%;
+	margin-right:0;
+}
+#footermap-wrap {
+	padding:2em;
+	border-top: 1px solid white;
+}
+#footermap a {
 	margin: 0;
 }
-
-#pdownload p, #pdownload form, #pdownload submit {
-	display: inline;
+#footermap ul{
+	list-style: none;
+	padding:0;
 }
-
-#pdownload td {
-	font-size: 0.85em;
-	text-align: center;
+#footermap li {
+	text-indent:0;
+	background-color: transparent;
+	font-weight:bold;
 }
-
-#pmoreinfo p {
-	font-size: 0.85em;
+#footermap li ul {
+	margin: 0;
+	padding: 0;
 }
-
-/* colors for packages, warnings and news in ports */
-.pred, .warning, dt.new, .no {
-	color: red; /* FF0000 */
+#footermap li li {
+	margin:0;
+	text-indent:0;
+	padding:0;
+	font-weight:normal;
+	border:0;
+	background-image:none;
+	background-color:transparent;
 }
-
-.psmallcenter, .psmalltrademark {
-	clear: both;
-	font-size: 0.85em;
-	text-align: center;
+#serverselect {
 }
-
-.psmalltrademark {
-	color: green;
+#serverselect input
+, #serverselect option 
+, #serverselect select {
 }
-#pdownload table, table.ridgetable, table.reltable {
-	border-width: 4px;
-	border-color: gray;
-	margin: 0 1em 1em 1em;
-	border-style: ridge;
-	border-collapse: collapse;
+#serverselect ul {
+	display: inline;
+	margin-left: 2em;
 }
-table.vote {
-	margin: 0 auto;
-	border-width: 3px;
-	border-color: gray;
-	border-style: ridge;
-	border-collapse: collapse;
+#serverselect li {
+	list-style: none;
+	display: inline;
+	padding:0 1em 0 1em;
+	margin:0;
 }
-#pdownload th, #pdownload td, table.ridgetable th, table.ridgetable td,
-	table.reltable td, table.reltable th {
-	border: 2px gray;
-	border-style: ridge;
-	padding: 0.1em;
+#serverselect form p {
+	margin:0;
+	padding:0;
+	line-height: 1;
 }
-table.reltable th {
-	background-color: #44CCCC;
+.lcol50 {
+	float: left;
+	width: 49%;
+	font-size:0.75em;
+	margin:0 0 0 0;
+	padding:0 0.5em 0 0;
 }
-table.vote th {
-	border: 1px solid gray;
-	background-color: #DDDDDD;
+.lcol50 h2 {
+	margin-top:0;
 }
-table.vote td {
-	border: 1px solid gray;
-	padding: 4px;
+.rcol50 {
+	margin:0 0 0 51%;
+	padding:0;
+	font-size:0.75em;
 }
-table.reltable tr.odd {
-	background-color: #FFFFFF;
+#pageLang {
+	position: relative;	/*  establish a containing box. needed for
+				    langContainer */
 }
-table.reltable tr.even {
-	background-color: #DDDDDD;
+form#pageLang {
+	display: inline;
 }
-table.stattrans {
-	margin: 0 auto;
-	width: 95%;
-	border: 1px solid black;
-	background-color: #cdc9c9;
+
+/* Extras */
+
+input:focus {
+	background-color:#FFFFCB;
+	
 }
-table.stattrans th {
-	text-align: center;
-	padding: 2px;
+.hidecss {
+	display: none;
 }
-table.stattrans td {
-	text-align: right;
-	padding: 2px;
+.clear {
+	clear:both
 }
-table.stattrans tbody th {
-	text-align: left;
-	font-weight: normal;
+#clear {
+	clear:both;
+	border:0;
+	height:1px;
+	display:block;
 }
-table.volatile {
-	border-collapse: collapse;
+.quicklist {
+	list-style: none;
+	font-size: 0.75em;
+	margin: 2em 0 2em 0;
+	padding:0;
+	text-indent:0;
+	line-height: 2em;
 }
-.volatile th, .volatile td {
-	text-align: left;
-	border: 1px solid black;
-	padding: 0.2em;
+.quicklist li  {
+	display:inline;
 }
-.volatile thead {
-	background-color: silver;
-	color: #000000;
+.item p{
+	margin: 0;
 }
-table.volatile tr.country {
-	color: #ffffff;
-	background-color: #df0451;
-}
-
-/* partners */
-.partnertype {
-	background-color: #BF1238;
-	padding: 0.2em 0 0.2em 1em;
-	color: #FFFFFF;
-	-moz-border-radius-bottomleft:15px;
-	-moz-border-radius-bottomright:15px;
-	-moz-border-radius-topleft:15px;
-	-moz-border-radius-topright:15px;
-	border-radius:15px;
-}
-div.partnerlogo {
-	display: table-cell;
-	vertical-align: middle;
-	text-align: center;
-	width: 300px;
+.item h2
+, .item p
+, .item ul{
+	margin-right: 10px 
 }
-div.partnerlogo2 {
-	display: table-cell;
-	vertical-align: middle;
-	text-align: center;
-	width: 300px;
-	border-top: 1px solid #BFC3DC;
-	padding: 0.2em 0 0.2em 1em;
-}
-div.partnerdesc {
-	display: table-cell;
-	font-size: 85%;
-}
-div.partnerdesc2 {
-	display: table-cell;
-	font-size: 85%;
-	border-top: 1px solid #BFC3DC;
-	padding: 0.2em 0 0.2em 1em;
-}
-div.partnerdefinedcellwidth1 {
-	display: table-cell;
-	padding: 0.2em 0 0.2em 1em;
-	font-size: 85%;
-	width: 200px;
-	border-top: 1px solid #BFC3DC;
-}
-div.partnertablerow {
-	display: table-row;
-}
-div.partnerdisplaytable {
-	display: table;
-	width: 98%;
-	margin: 10px 1% 10px 1%;
-}
-div.partnerdisplayblock {
-	display: block;
+.item h2
+, .item h3
+, .item h4
+, .item h5 {
+	margin-top: 0;
 }
-div.cdflash {
-	background-color: #BBDDFF;
-	width: 80%;
-	margin: auto;
-	text-align: center;
+.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;
+	min-height: 23px;
+	/* 
+	 * 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;
 }
-.cdrsync {
-	color: #6B1300;
+ul.downlist li:after {
+	content: ', ';
+}
+ul.downlist li:last-child:after {
+	content: '';
+}
+div.tip
+, div.important
+, div.warning
+, div.note 
+, div.trans-note {
+	padding:0 2em 0 4em;
+	margin: 1.85em 0 1.85em 0;
+	background-repeat: no-repeat;
+	background-position: 0.5em 0.5em;
+	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 
+, div.trans-note p {
+	margin: 1em 0 1em 0;
+}
+div.tip {
+	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
+, div.trans-note  {
+	background-image: url('Pics/admon-note.png');
+}
+
+/* Layout Elements */
+
+.col50
+, .cardleft
+, .cardright {
+	width:47.5%;
+	float: left;
+	padding-bottom: 1.5em;
 }
-/* debian installer */
-
-.dierror {
-	background-color: #FF6060;
+.lastcol
+, .cardright {
+	margin: auto;
+	width: 47.5%;
+	float:left;
+	padding-right: 0;
+	margin-left: 5%;
 }
-.dibad {
-	background-color: #F7FF60;
+.lastcol h2
+, .lastcol p
+, .lastcol ul {
+	margin-right:0;
 }
-.digood {
-	background-color: #7AFF71;
+.cardleft h2 {
+	margin-right: 1em;
 }
-
-/* useful classes */
-
-th.eventheader {
-	background-color: #BBDDFF;
+.cardright div {
+	margin-left: 1.5em;
 }
-.center {
-	text-align: center;
+.cardright h2 {
+	margin-left: 1em;
 }
-.right {
-	text-align: right;
+.votemenu a {
+	display:block;
 }
-ul.circlelist {
-	list-style-type: circle;
+table.vote td, table.vote th {
+	padding-right: 1.5em;
 }
-.centerdiv table {
-	margin-left: auto;
-	margin-right: auto;
+#maincol.with-toolbox {
+	margin-right: 14em;
 }
-ul.discless {
-	list-style-type: none;
+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;
 }
-.top, img.ico {
-	vertical-align: top;
+table td {
+	padding-right: 1.5em;
 }
-img.ico {
-	float: left;
-	margin: 0 0.2em 0 0;
+div.tabular table tr, table.tabular tr, table.vendors tr {
+	width: 100%;
 }
-img.rightico {
-	float: right;
-	vertical-align: top;
-	margin: 0 0 0 0.2em;
+table th {
+	padding-right: 1.5em;
 }
-img.cve {
-	vertical-align: -25px;
+div.tabular table td, table.tabular td, table.vendors td {
+	background-image: url(Pics/greydot.png);
+	background-position: top left;
+	background-repeat: repeat-x;
 }
-.y2kok, .yes {
-	color: #00BB00;
+div.tabular table > td:fist-child, table.tabular  > td:fist-child, table.vendors  > td:fist-child {
+	background-image: none;
 }
-.y2kok2 {
-	color: #00BBBB;
+#pageLang p, #pageLang form {
+	display: inline;
 }
-.bluehead {
-	color: #0000FF !important;
+.inline  a {
+	float: left;
+	margin-right: 1em;
 }
-span.halfsize {
-	font-size: 80%;
+#langSelector {
+	color: #0035c7;
+	text-decoration: underline;
 }
-span.ddpbooktitle, span.merchtitle {
-	font-size: larger;
+#langSelector:hover {
+	cursor: pointer;
+	text-decoration: none;
 }
-a:link { color: #0000FF; }
-a:visited { color: #800080; }
-a:hover { color: #F000FF; }
-a:active { color: #FF0000; }
-
-.navpara a, col.y2k {
-	white-space: nowrap;
-	/* this is to keep from breaking at whitespace in anchors */
+#langContainer {
+	#background-color: #f5f6f7;
+	background-color: white;
+	background-image:url('Pics/gradient-flipped.png');
+	background-position: bottom;
+	background-repeat: repeat-x;
+	display: none;
+	position: absolute;
+	left: -1em;
+	border-bottom: 1px solid #dfdfe0;
+	margin-right: -1em;
+	min-width: 100%;        /* make it reach the right edge if only a few
+				   languages are available */
+	padding: 0.5em 1em 1em 1em;
+}
+#langContainer a {
+	margin-right: 1em;
+}
+#pageLang:hover #langContainer {
+    display: block;
 }
-
-
-.underline { text-decoration: underline; }
-.clr { clear:both; }
-/*.content{padding:5px;} */ /*padding for content */
-/* #header .content{padding-bottom:0;} */ /*padding bottom 0 to remove space in IE5 Mac*/
 
 /* for l10n-arabic */
 .bidi {
@@ -704,38 +869,3 @@ a:active { color: #FF0000; }
 	text-align: right;
 }
 
-#leftcol, #navbar, #navbar a {
-	-moz-border-radius: 15px;
-	-webkit-border-radius: 15px;
-	/* these go to the end as the css validator does not like them
-	will be replaced by border-radius with css3 */
-	border-radius: 15px;
-	padding-left: 5px;
-}
-
-/* /CD/vendors/ */
-table.vendors {
-	width: 100%;
-	border-collapse: collapse;
-	border: 1px solid #AAAAAA;
-}
-
-table.vendors th {
-	background: #BBDDFF;
-	font-size: 0.9em;
-	font-family: Arial, Helvetica, sans-serif;
-	color: #3e4955;
-	padding: 0.2em;
-	border: 1px solid #AAAAAA;
-	border-bottom: none;
-	text-align: left;
-}
-
-table.vendors tr.b td {
-	background-color: #EEEEEE;
-}
-
-table.vendors td {
-	padding: 0.2em;
-	vertical-align: top;
-}