Add layout styles/images for new website design.

Submitted by:  Emily Boyd
Sponsored by:  Google Summer of Code

en/layout/Makefile

@@ -0,0 +1,14 @@
+# $FreeBSD: www/en/gnome/Makefile,v 1.20 2004/11/25 04:29:18 marcus Exp $
+
+.if exists(../Makefile.conf)
+.include "../Makefile.conf"
+.endif
+.if exists(../Makefile.inc)
+.include "../Makefile.inc"
+.endif
+
+SUBDIR=		css
+SUBDIR+=	images
+SUBDIR+=	js
+
+.include "${WEB_PREFIX}/share/mk/web.site.mk"

en/layout/Makefile.inc

@@ -0,0 +1,4 @@
+# $FreeBSD: www/en/news/Makefile.inc,v 1.2 2000/11/07 04:05:18 kuriyama Exp $
+
+WEBBASE?=	/data/layout
+WEB_PREFIX?=	${.CURDIR}/../../..

en/layout/css/Makefile

@@ -0,0 +1,12 @@
+# $FreeBSD: www/en/gifs/Makefile,v 1.53 2005/05/08 15:49:57 murray Exp $
+
+.if exists(../Makefile.conf)
+.include "../Makefile.conf"
+.endif
+.if exists(../Makefile.inc)
+.include "../Makefile.inc"
+.endif
+
+DATA=   fixed.css fixed_large.css global.css iefixes.css layout.css navigation.css table.css text.css
+
+.include "${WEB_PREFIX}/share/mk/web.site.mk"

en/layout/css/fixed.css

@@ -0,0 +1,19 @@
+/*
+  FreeBSD.org - "Red" Style
+	
+  Inspired by AListApart, PositionIsEverything, Mozilla, Red Hat, and many more.
+  
+  Copyright (c) 2004, 2005 The FreeBSD Project
+  Copyright (c) 2004, 2005 Emily Boyd <emily at emilyboyd.com>
+  
+  This file, and any imported stylesheets are licensed under the BSD license.
+ 
+*/
+
+@import url("global.css");
+@import url("layout.css");
+@import url("text.css");
+@import url("navigation.css");
+@import url("table.css");
+
+@import url("iefixes.css");

en/layout/css/fixed_large.css

@@ -0,0 +1,7 @@
+/* FreeBSD Global Style - Large Text Version */
+
+@import url("fixed.css");
+
+body {
+  font-size: 93%;
+}

en/layout/css/global.css

@@ -0,0 +1,84 @@
+/*
+  FreeBSD.org - Global Styles
+*/
+
+body {
+  margin: 0;
+  padding: 0;
+  font-family: verdana, sans-serif;
+  font-size: 69%;
+  color: #000;
+  background-color: #fff;  
+  background: url("../images/hdr_fill.png") repeat-x; 
+}
+
+h1 {
+  font-size: 1.4em;
+  font-weight: bold;
+  margin: 0em 0em 1.2em 0em;
+}
+
+h2 {
+  font-size: 1.2em;
+  margin: 1.2em 0em 1.2em 0em;
+  font-weight: bold;
+}
+
+h3 {
+  font-size: 1.0em;
+  margin: 1.2em 0em 1.2em 0em;
+  font-weight: bold;
+}
+
+h4 {
+  font-size: 0.95em;
+  margin: 1.2em 0em 1.2em 0em;
+  font-weight: bold;
+}
+
+h5 {
+  font-size: 0.9em;
+  margin: 1.2em 0em 1.2em 0em;
+  font-weight: bold;
+}
+
+h6 {
+  font-size: 0.85em;
+  margin: 1.2em 0em 1.2em 0em;
+  font-weight: bold;
+}
+
+img {
+  border: 0;
+}
+
+ol, ul, li {
+  font-size: 1.0em;
+  line-height: 1.2em;
+  margin-top: 0.2em;
+  margin-bottom: 0.1em; 
+}
+
+p {
+  font-size: 1.0em;
+  line-height: 1.2em;
+  margin: 1.2em 0em 1.2em 0em;
+}
+
+li > p {
+  margin-top: 0.2em;
+}
+
+pre {
+  font-family: monospace;
+  font-size: 1.4em;
+}
+
+tt {
+  font-family: monospace;
+  font-size: 1.4em;
+}
+
+strong, b {
+  font-weight: bold;
+}

en/layout/css/iefixes.css

@@ -0,0 +1,50 @@
+/*
+  FreeBSD.org - Fixes for Internet Explorer
+*/
+
+/*Win IE fix \*/
+
+* html #TOPNAVLIST li { margin: 0 0.5em 0 -0.5em; }
+* html #topnavlist li { margin: 0 0.5em 0 -0.5em; }
+
+* html #languagenavlist li { padding: 0 0.1em 0 0.4em; }
+* html #languagenavlist li.last-child { padding: 0 0em 0 0.4em; }
+
+* html #searchnavlist li { padding: 0 0.4em 0 0.8em; }
+* html #searchnavlist li.last-child { padding: 0 0 0 0.8em; }
+* html #SEARCHNAVLIST li { padding: 0 0.4em 0 0.8em; }
+* html #SEARCHNAVLIST li.last-child { padding: 0 0 0 0.8em; }
+
+* html #SEARCH, #search { height: 1%; }
+
+* html #MIRROR, #mirror { height: 1%; }
+
+/*End Win IE fix*/
+
+/*Win IE fix \*/
+
+* html pre { font-size: 1.0em; }
+
+* html tt { font-size: 1.0em; }
+
+/*End Win IE fix*/
+
+/*Win IE fix \*/
+
+* html #FRONTSHORTCUTS, #frontshortcuts { height: 1%; }
+
+* html #FRONTSHORTCUTSWRAP, #frontshortcutswrap { height: 1%; }
+
+* html #FRONTSHORTCUTSCONTENT, #frontshortcutscontent { height: 1%; }
+
+* html #FRONTSHORTCUTSLIST, #frontshortcutslist { height: 1%; }
+
+* html #FRONTRELEASES, #frontreleases { height: 1%; }
+
+* html #FRONTRELEASESWRAP, #frontreleaseswrap { height: 1%; }
+
+* html #FRONTRELEASESCONTENT, #frontreleasescontent { height: 1%; }
+
+* html #FRONTRELEASESLIST, #frontreleaseslist { height: 1%; }
+
+/*End Win IE fix*/

en/layout/css/layout.css

@@ -0,0 +1,490 @@
+/*
+  FreeBSD.org - Layout Styles
+*/
+
+/* Container Definitions */
+
+/* Page Container */
+
+#CONTAINERWRAP, #containerwrap {
+  text-align: center; /* Win IE5 */
+}
+
+#CONTAINER, #container {
+  margin: 0em auto;
+  width: 765px;
+  padding: 0;
+  padding-top: 0px;
+  padding-bottom: 15px;
+  text-align: left; /* Win IE5 */
+}
+
+/* Header */
+
+#HEADERCONTAINER, #headercontainer {
+  padding-bottom: 2px;
+}
+
+#HEADER, #header {
+  position: relative;
+  height: 76px;
+  margin: 0;
+  padding: 0;
+  clear: both;
+}
+
+#HEADERLOGOLEFT, #headerlogoleft {
+  position: relative;
+  border: 0px;
+  padding: 0px;
+  top: 19px;
+  margin: 0px;
+  float: left;
+}
+
+#HEADERLOGOLEFT img, #headerlogoleft img { 
+  border: 0px; 
+}
+
+#HEADERLOGORIGHT, #headerlogoright {
+  position: relative;
+  border: 0px;
+  padding: 0px;
+  margin: 0px;
+  float: right;
+}
+
+#HEADERLOGORIGHT img, #headerlogoright img {
+  border: 0px;
+}
+
+/* Search */
+
+#SEARCH, #search {
+  position: relative;
+  text-align: right;
+  padding: 0;
+  margin: 0;
+  margin-top: 6px;
+  color: #666;
+}
+
+#SEARCH form, #search form {
+  position: relative;
+  top: 5px;
+  right: 0;
+  margin: 0; /* need for IE Mac */
+  text-align: right; /* need for IE Mac */
+  white-space: nowrap; /* for Opera */
+}
+
+#SEARCH form label, #search form label { 
+  color: #666;
+  font-size: 0.8em; 
+}
+
+#SEARCH form input, #search form input { 
+  font-size: 0.8em; 
+}
+
+#SEARCH form #SUBMIT, #search form #submit {
+  font-size: 0.8em;
+  background: transparent;
+  color: #fff;
+  border-right: 1px solid #DADADA;
+  border-bottom: 1px solid #DADADA;
+  border-top: 1px solid #DADADA;
+  border-left: 1px solid #DADADA;
+  padding: 1px 5px 1px 5px;
+}
+
+#SEARCH form #WORDS, #search form #words {
+  font-size: 0.8em;
+  width: 120px;
+  border: 1px solid #DADADA;
+  background: #FFFFFF;
+  color: #666;
+  padding: 2px 2px 2px 5px;
+}
+
+/* Mirror Select */
+
+#MIRROR, #mirror {
+  text-align: right;
+  padding: 0;
+  margin: 0;
+  margin-top: 6px;
+  color: #666;
+}
+
+#MIRROR form, #mirror form {
+  padding-top: 5px;
+  right: 0;
+  margin: 0; /* need for IE Mac */
+  text-align: right; /* need for IE Mac */
+  white-space: nowrap; /* for Opera */
+}
+
+#MIRROR form label, #mirror form label { 
+  color: #666;
+  font-size: 0.8em; 
+}
+
+#MIRROR form select, #mirror form select { 
+  font-size: 0.8em; 
+}
+
+#MIRROR form #mirrorsel, #mirror form #mirrorsel {
+  font-size: 0.8em;
+  width: 150px;
+  border: 1px solid #DADADA;
+  background: #FFFFFF;
+  color: #666;
+}
+
+/* Content */
+
+#CONTENT, #content {
+  clear: both;
+  display: block;
+}		
+
+#FRONTCONTAINER, #frontcontainer {
+  width: 100%;
+  float: left;
+}
+
+#FRONTFEATURECONTAINER, #frontfeaturecontainer {
+  clear: both;
+}
+
+#FRONTFEATURELEFT, #frontfeatureleft{
+  width: 273px;
+  margin: 0;
+  padding: 0;
+  float: left;
+}
+
+#FRONTFEATURELEFT h2, #frontfeatureleft h2 {
+  border: none;
+  margin-top: 0;
+}
+
+#FRONTFEATURELEFT p, #frontfeatureleft p {
+  margin: 0 0 1em 0;
+}
+
+	#FRONTFEATURECONTENT, #frontfeaturecontent {
+	  margin: 10px 10px 10px 13px;
+	}
+
+#FRONTFEATUREMIDDLE, #frontfeaturemiddle {
+  float: left;
+  margin-top: 20px;
+  background: url(../images/beastie.png) no-repeat top left;
+  min-height: 196px;
+}
+
+#FRONTFEATURERIGHT, #frontfeatureright {
+  position: relative;
+  border: 0px;
+  padding: 0px;
+  margin: 0px;
+  width: 162px;
+  float: right;
+}
+
+/* News/Events/Media/Security Box */
+
+#FRONTNEMSCONTAINER, #frontnemscontainer {
+  background: #eee;
+  display: inline;
+  float: left;
+  margin-top: 8px;
+  margin-bottom: 8px;
+}
+
+#FRONTNEWS, #frontnews {
+  width: 191px;
+  margin: 0;
+  padding: 0;
+  float: left;
+}
+
+#FRONTNEWSCONTENT, #frontnewscontent {
+  margin: 17px 15px 24px 18px;
+}
+
+#FRONTEVENTS, #frontevents {
+  width: 189px;
+  margin: 0;
+  padding: 0;
+  float: left;
+}
+
+#FRONTEVENTSCONTENT, #fronteventscontent {
+  margin: 17px 15px 24px 14px;
+}
+
+#FRONTMEDIA, #frontmedia {
+  width: 189px;
+  margin: 0;
+  padding: 0;
+  float: left;
+}
+
+#FRONTMEDIACONTENT, #frontmediacontent {
+  margin: 17px 15px 24px 14px;
+}
+
+#FRONTSECURITY, #frontsecurity {
+  width: 190px;
+  margin: 0;
+  padding: 0;
+  float: left;
+}
+
+#FRONTSECURITYCONTENT, #frontsecuritycontent {
+  margin: 17px 15px 24px 14px;
+}
+
+/* No way to get equal columns in pure CSS - setting height is a temporary hack */
+.frontseparator {
+  width: 1px;
+  height: 317px;
+  margin: 0;
+  padding: 0;
+  background-color: #fff;
+  float: left;
+}
+
+.newseventswrap {
+  padding-left: 5px;
+}
+
+.newseventslist {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  display: inline;
+}
+
+.newseventslist img.rssimage {
+  display: inline;
+  border: 0;
+  vertical-align: bottom;
+}
+
+.newseventslist li {
+  padding: 0 0.3em 0 0.5em;
+  display: inline;
+  border-right: 1px solid #E1E1E1;
+}
+
+.newseventslist li a {
+}
+
+.newseventslist li.last-child {
+  border-right: 0;
+  padding-right: 0;
+}
+
+.newseventslist li.first-child {
+  padding-left: 0;
+}
+
+.newseventslist li.only-child {
+  border-right: 0;
+  padding-left: 0;
+}
+		
+/ * Shortcuts */
+
+#FRONTSHORTCUTS, #frontshortcuts {
+  margin: 0;
+  padding: 0;
+  color: #666;
+}
+
+#FRONTSHORTCUTSCONTENT, #frontshortcutscontent {
+  margin: 0;
+  padding: 0;
+  padding-left: 15px;
+  padding-top: 20px;
+}
+
+#FRONTSHORTCUTSLIST, #frontshortcutslist {
+  margin: 0;
+  padding: 0;
+  margin-left: 5px;
+  margin-top: 5px;
+  list-style: none;
+}
+
+#FRONTSHORTCUTSLIST li, #frontshortcutslist li {
+  margin: 0;
+  padding-left: 12px;
+  background-image: url(../images/blt_red_arrow.png);
+  background-repeat: no-repeat;
+  background-position: 0px 0.5em;
+}
+
+/* Latest Releases */
+
+#FRONTRELEASES, #frontreleases {
+  padding: 0;
+  margin: 0;
+  margin-left: 162px;
+  margin-top: 15px;
+  padding-bottom: 50px;
+  color: #666;
+  width: 155px;
+}
+
+#FRONTRELEASESCONTENT, #frontreleasescontent {
+  margin: 0;
+  padding: 0;
+}
+
+#FRONTRELEASESLIST, #frontreleaseslist {
+  margin: 0;
+  padding: 0;
+  margin-left: 5px;
+  margin-top: 5px;
+  list-style: none;
+}
+
+#FRONTRELEASESLIST li, #frontreleaseslist li {
+  margin: 0;
+  padding-left: 12px;
+  background-image: url(../images/blt_red_arrow.png);
+  background-repeat: no-repeat;
+  background-position: 0px 0.5em;
+}
+
+/* New User Box */
+
+ /* set background images for corners */
+.frontnewroundbox { background: url(../images/front_new_back.png) repeat; }
+.frontnewtop div  { background: url(../images/front_new_tl.png) no-repeat top left; }
+.frontnewtop      { background: url(../images/front_new_tr.png) no-repeat top right; }
+.frontnewbot div  { background: url(../images/front_new_bl.png) no-repeat bottom left; }
+.frontnewbot      { background: url(../images/front_new_br.png) no-repeat bottom right; }
+
+ /* height and width details */
+.frontnewtop div, .frontnewtop, .frontnewbot div, .frontnewbot {
+  width: 100%;
+  height: 12px;
+  font-size: 1px;
+}
+
+.frontnewcontent {
+  margin: 0;
+  padding: 0;
+  margin-top: -4px;
+  margin-bottom: -4px;
+  text-align: center;
+  font-size: 1.1em;
+  font-weight: bold;
+}
+
+.frontnewcontent a, .frontnewcontent a:link, .frontnewcontent a:visited, .frontnewcontent a:active, .frontnewcontent a:hover {
+  color: #990000;
+  text-decoration: none;
+}
+
+.frontnewroundbox {
+  margin: 0;
+  padding: 0;
+  margin-top: 52px;
+  width: 150px;
+}
+
+/* Get FreeBSD Box */
+
+ /* set background images for corners */
+.frontgetroundbox { background: url(../images/front_get_back.png) repeat; }
+.frontgettop div  { background: url(../images/front_get_tl.png) no-repeat top left; }
+.frontgettop      { background: url(../images/front_get_tr.png) no-repeat top right; }
+.frontgetbot div  { background: url(../images/front_get_bl.png) no-repeat bottom left; }
+.frontgetbot      { background: url(../images/front_get_br.png) no-repeat bottom right; }
+
+ /* height and width details */
+.frontgettop div, .frontgettop, .frontgetbot div, .frontgetbot {
+  width: 100%;
+  height: 18px;
+  font-size: 1px;
+}
+
+.frontgetcontent {
+  margin: 0;
+  padding: 0;
+  margin-top: -8px;
+  margin-bottom: -8px;
+  text-align: center;
+  font-size: 1.4em;
+  font-weight: bold;
+}
+
+.frontgetcontent a, .frontgetcontent a:link, .frontgetcontent a:visited, .frontgetcontent a:active, .frontgetcontent a:hover {
+  color: #990000;
+  text-decoration: none;
+}
+
+.frontgetroundbox {
+  margin: 0;
+  padding: 0;
+  margin-top: 50px;
+  margin-left: 140px;
+  width: 190px;
+}
+
+/* Secondary Pages */
+
+#SIDEWRAP, #sidewrap {
+  float: left;
+  width: 166px;
+  margin-top: 15px;
+  margin-right: -170px;
+}
+
+#RIGHTWRAP, #rightwrap {
+  float: right;
+  width: 166px;
+  margin-left: 15px;
+}
+
+#CONTENTWRAP, #contentwrap {
+  margin-left: 170px;
+  padding-top: 15px;
+}
+
+/* Footer */
+
+#FOOTER, #footer {
+  font-size: 0.9em; 
+  color: #737373; 
+  line-height: 1.3em; 
+  padding-top: 5px;
+  clear: both;
+}
+
+/* Misc Classes */
+
+.clearboth {
+  clear: both;
+  margin: 0;
+  padding: 0;
+}
+
+.blockhide {
+  display: none;
+  height: 0;
+  width: 0;
+  overflow: hidden;
+  position: absolute;  /* IE5 Mac */
+}
+
+img {
+  border: 0;
+}

en/layout/css/navigation.css

@@ -0,0 +1,292 @@
+/*
+  FreeBSD.org - Navigation (and List) Styles
+*/
+
+/* Site Navigation */
+
+#TOPNAV, #topnav {
+  text-align: left;
+  color: #666;
+  font-size: 0.9em;
+  margin: 0;
+  padding: 0;
+  height: 29px;
+  overflow: visible;
+  margin-top: 7px;
+}
+
+#TOPNAVLEFT, #topnavleft {
+  width: 7px;
+  height: 29px;
+  border: 0px;
+  padding-right: 10px;
+  margin: 0px;
+  float: left;
+}
+
+#TOPNAVLEFT img, #topnavleft img {
+  border: 0px;
+  margin: 0;
+  padding: 0;
+}
+
+#TOPNAVRIGHT, #topnavright {
+  width: 7px;
+  height: 29px;
+  border: 0px;
+  padding: 0px;
+  margin: 0px;
+  float: right;
+}
+
+#TOPNAVRIGHT img, #topnavright img {
+  border: 0px;
+  margin: 0;
+  padding: 0;
+}
+
+#TOPNAVLIST, #topnavlist {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  height: 29px;
+}
+
+#TOPNAVLIST li, #topnavlist li {
+  padding: 0 1em 0 1.2em;
+  display: inline;
+  border-left: 1px solid #B4B4B4;
+}
+
+#TOPNAVLIST li a, #topnavlist li a {
+  color: #666;
+  font-weight: bold; 
+  text-decoration: none;
+}
+
+#TOPNAVLIST li:first-child, #topnavlist li:first-child {
+  border-left: 0;
+  padding-left: 0;
+}
+
+/* Language selection */
+
+#LANGUAGENAV, #languagenav {
+  text-align: right;
+  color: #666;
+  font-size: 0.9em;
+  margin: 0px 0px 0px 0px;
+  right: 0px;
+  padding: 0;
+}
+
+#LANGUAGENAVLIST, #languagenavlist {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+
+#LANGUAGENAVLIST li, #languagenavlist li {
+  padding: 0 0.5em 0 0.2em;
+  display: inline;
+  border-right: 1px solid #B6B6B6;
+}
+
+#LANGUAGENAVLIST li.last-child, #languagenavlist li.last-child {
+  padding: 0 0em 0 0.2em;
+  border-right: 0;
+}
+
+#LANGUAGENAVLIST li a, #languagenavlist li a {
+  text-decoration: underline;
+}
+
+#LANGUAGENAVLIST li a:hover, #languagenavlist li a:hover {
+}
+
+/* The search navigation is the list of links above the search box. */
+
+#SEARCHNAV, #searchnav {
+  position: relative;
+  text-align: right;
+  color: #fff;
+  font-size: 0.9em;
+  margin: 0px 0px 0px 0px;
+  margin-top: 8px;
+  right: 0px;
+  padding: 0;
+}
+
+#SEARCHNAVLIST, #searchnavlist {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+
+#SEARCHNAVLIST li, #searchnavlist li {
+  padding: 0 0.6em 0 0.3em;
+  display: inline;
+  border-right: 1px solid #fff;
+}
+
+#SEARCHNAVLIST li.last-child, #searchnavlist li.last-child {
+  padding: 0 0 0 0.3em;
+  border-right: 0;
+}
+
+#SEARCHNAVLIST li a, #searchnavlist li a {
+  color: #FFCC66;
+  text-decoration: underline;
+}
+
+#SEARCHNAVLIST li a:hover, #searchnavlist li a:hover {
+  color: #fff;
+}
+
+/* Category Navigation */
+
+#SIDENAV, #SIDENAV ul, #SIDENAV ul ul, #sidenav, #sidenav ul, #sidenav ul ul {
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  font-size: 1.0em;
+}
+
+#SIDENAV, #sidenav {
+  width: 150px;
+  background-color: #eee;
+  border: 1px solid #D4D4D4;
+}
+
+#SIDENAV ul, #sidenav ul {
+  padding: 8px 4px 12px 4px;
+}
+
+#SIDENAV ul ul, #sidenav ul ul {
+  background: none;
+  background-color: #eee;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+#SIDENAV ul ul li, #sidenav ul ul li {
+  background: none;
+  border: none;
+}
+
+#SIDENAV ul li, #sidenav ul li {
+  border-bottom: 1px solid #eee;
+  margin: 0;
+  padding-left: 12px;
+  background-image: url(../images/blt_red_arrow.png);
+  background-repeat: no-repeat;
+  background-position: 12px 0.65em;
+}
+
+#SIDENAV ul li.active, #sidenav ul li.active {
+  font-weight: bold;
+}
+
+#SIDENAV ul li.active span, #sidenav ul li.active span {
+  display: none;
+}
+
+#SIDENAV ul li a, #sidenav ul li a {
+  display: block;
+  color: #990000;
+  text-decoration: underline;
+  padding: 3px 5px 3px 12px;
+  margin: 0;
+}
+
+#SIDENAV ul ul li a.active, #sidenav ul ul li a.active {
+  font-weight: bold;
+}
+
+#SIDENAV ul ul li a, #sidenav ul ul li a {
+  display: block;
+  padding-left: 12px;
+  margin: 0;
+}
+
+#SIDENAV ul li a:hover, #sidenav ul li a:hover {
+  color: #000;
+}
+
+/* Right Navigation */
+
+.RIGHTNAV, .RIGHTNAV ul, .RIGHTNAV ul ul, .rightnav, .rightnav ul, .rightnav ul ul {
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  font-size: 1.0em;
+}
+
+.RIGHTNAV, .rightnav {
+  width: 150px;
+  background-color: #eee;
+  border: 1px solid #D4D4D4;
+}
+
+.RIGHTNAV ul, .rightnav ul {
+  padding: 8px 4px 12px 4px;
+}
+
+.RIGHTNAV ul ul, .rightnav ul ul {
+  background: none;
+  background-color: #eee;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+.RIGHTNAV ul ul li, .rightnav ul ul li {
+  background: none;
+  border: none;
+}
+
+.RIGHTNAV ul li, .rightnav ul li {
+  border-bottom: 1px solid #eee;
+  margin: 0;
+  padding-left: 12px;
+  background-image: url(../images/blt_red_arrow.png);
+  background-repeat: no-repeat;
+  background-position: 12px 0.65em;
+}
+
+.RIGHTNAV ul li.active, .rightnav ul li.active {
+  font-weight: bold;
+}
+
+.RIGHTNAV ul li.active span, .rightnav ul li.active span {
+  display: none;
+}
+
+.RIGHTNAV ul li a, .rightnav ul li a {
+  display: block;
+  color: #990000;
+  text-decoration: underline;
+  padding: 3px 5px 3px 12px;
+  margin: 0;
+}
+
+.RIGHTNAV ul ul li a.active, .rightnav ul ul li a.active {
+  font-weight: bold;
+}
+
+.RIGHTNAV ul ul li a, .rightnav ul ul li a {
+  display: block;
+  padding-left: 12px;
+  margin: 0;
+}
+
+.RIGHTNAV ul li a:hover, .rightnav ul li a:hover {
+  color: #000;
+}
+
+.RIGHTNAV h1, .RIGHTNAV h2, .RIGHTNAV h3, .RIGHTNAV h4, .RIGHTNAV h5, .RIGHTNAV h6, .RIGHTNAV p,
+.rightnav h1, .rightnav h2, .rightnav h3, .rightnav h4, .rightnav h5, .rightnav h6, .rightnav p {
+  padding-left: 10px;
+  padding-right: 10px;
+}

en/layout/css/table.css

@@ -0,0 +1,30 @@
+/*
+  FreeBSD.org - Table Styles
+*/
+
+.tblbasic {
+  background-color: #eee;
+  border-spacing: 0px;
+  border: 1px solid #CACACA;
+  border-bottom: 0;
+  border-collapse: collapse;
+}
+
+.tblbasic thead {
+  font-weight: bold;
+}
+
+.tblbasic th {
+  font-weight: bold;
+  padding: 8px;
+  border-bottom: 1px solid #D4D4D4;
+}
+
+.tblbasic td {
+  padding: 8px;
+  border-bottom: 1px solid #D4D4D4;
+}
+
+.tblbasic td+td, .tblbasic th+th {
+  border-left: 1px solid #D4D4D4;
+}

en/layout/css/text.css

@@ -0,0 +1,124 @@
+/*
+  FreeBSD.org - Text Styles
+*/
+
+/* Heading Definitions */
+
+h1 {
+  color: #990000;
+}
+
+h2 {
+  color: #990000;
+}
+
+h3 { 
+  color: #990000;
+}
+
+h4 { 
+  color: #990000;
+}
+
+/* Text Styles */
+
+.txtcolumn1 {
+  width: 50%;
+  line-height: 1.3em;
+}
+
+.txtcolumn2 {
+  width: 50%;
+  line-height: 1.5em;
+}
+
+.txtcurrentlocation {
+  font-weight: bold;
+}
+
+.txtdivider { 
+  font-size: 0.8em; 
+  color: #E1E1E1; 
+  padding-left: 4px; 
+  padding-right: 4px; 
+}
+
+.txtnewsevent { 
+  font-size: 0.9em; 
+  color: #000000;
+}
+
+.txtshortcuts { 
+  font-size: 0.9em; 
+  color: #000000; 
+}
+
+.txtdate { 
+  font-size: 0.9em;
+  color: #666; 
+}
+
+.txtmediumgrey { 
+  color: #666; 
+}
+
+.txtformlabel { 
+  color: #666; 
+  font-weight: bold; 
+  text-align: right; 
+  vertical-align: top;
+}
+
+.txtrequiredfield {
+  color: #EC5800;
+}
+
+.txtimportant {
+  color: #EC5800;
+}
+
+.txtoffscreen {
+  position: absolute;
+  left: -1999px;
+  width: 1990px;
+}
+
+#TXTFRONTFEATUREHEADING, #txtfrontfeatureheading {
+  padding-bottom: 0em;
+}
+
+#TXTFRONTFEATURELINK a, #txtfrontfeaturelink a {
+  font-size: 1.2em;
+  font-weight: bold;
+  padding-left: 5px;
+}
+
+/* Link Styles */
+
+a:link                          { color:#990000; text-decoration: underline; }
+a:visited                       { color:#990000; text-decoration: underline; }
+a:active                        { color:#990000; text-decoration: underline; }
+a:hover                         { color:#000000; text-decoration: underline; }
+
+#FOOTER a:link, #footer a:link                { color:#666; text-decoration: underline; }
+#FOOTER a:visited, #footer a:visited             { color:#666; text-decoration: underline; }
+#FOOTER a:active, #footer a:active              { color:#666; text-decoration: underline; }
+#FOOTER a:hover, #footer a:hover               { color:#000000; text-decoration: underline; }
+
+#FRONTNEMSCONTAINER h2, #frontnemscontainer h2 {
+  margin: 0;
+  padding: 0;
+  font-size: 1.1em;
+}
+
+#FRONTSHORTCUTS h2, #frontshortcuts h2 {
+  margin: 0;
+  padding: 0;
+  font-size: 1.1em;
+}
+
+#FRONTRELEASES h2, #frontreleases h2 {
+  margin: 0;
+  padding: 0;
+  font-size: 1.1em;
+}

en/layout/images/Makefile

@@ -0,0 +1,12 @@
+# $FreeBSD: www/en/gifs/Makefile,v 1.53 2005/05/08 15:49:57 murray Exp $
+
+.if exists(../Makefile.conf)
+.include "../Makefile.conf"
+.endif
+.if exists(../Makefile.inc)
+.include "../Makefile.inc"
+.endif
+
+DATA=   beastie.png blt_gry_arrow.png blt_red_arrow.png front_get_back.png front_get_bl.png front_get_br.png front_get_tl.png front_get_tr.png front_new_back.png front_new_bl.png front_new_br.png front_new_tl.png front_new_tr.png hdr_fill.png ico_rss.png logo.png nav_rgt.png nav_tbl_btm.png nav_tbl_top.png
+
+.include "${WEB_PREFIX}/share/mk/web.site.mk"

en/layout/js/Makefile

@@ -0,0 +1,12 @@
+# $FreeBSD: www/en/gifs/Makefile,v 1.53 2005/05/08 15:49:57 murray Exp $
+
+.if exists(../Makefile.conf)
+.include "../Makefile.conf"
+.endif
+.if exists(../Makefile.inc)
+.include "../Makefile.inc"
+.endif
+
+DATA=   styleswitcher.js
+
+.include "${WEB_PREFIX}/share/mk/web.site.mk"

en/layout/js/styleswitcher.js

@@ -0,0 +1,105 @@
+/* http://www.alistapart.com/articles/alternate/ */
+
+var is_khtml = /Konqueror|Safari|KHTML/i.test(navigator.userAgent);
+var is_safari = /Safari/i.test(navigator.userAgent);
+var is_konq = is_khtml&&!is_safari;
+
+function
+setActiveStyleSheet (title)
+{
+  var i, a, main;
+  for (i = 0; (a = document.getElementsByTagName ("link")[i]); i++)
+    {
+      if (a.getAttribute ("rel").indexOf ("style") != -1
+	  && a.getAttribute ("title"))
+	{
+	  a.disabled = true;
+	  if (a.getAttribute ("title").indexOf(title) != -1)
+	    a.disabled = false;
+	}
+    }
+}
+
+function
+getActiveStyleSheet ()
+{
+  var i, a;
+  for (i = 0; (a = document.getElementsByTagName ("link")[i]); i++)
+    {
+      if (a.getAttribute ("rel").indexOf ("style") != -1
+	  && a.getAttribute ("title") && !a.disabled)
+	return a.getAttribute ("title");
+    }
+  return null;
+}
+
+function
+getPreferredStyleSheet ()
+{
+  var i, a;
+  for (i = 0; (a = document.getElementsByTagName ("link")[i]); i++)
+    {
+      if (a.getAttribute ("rel").indexOf ("style") != -1
+	  && a.getAttribute ("rel").indexOf ("alt") == -1
+	  && a.getAttribute ("title"))
+	return a.getAttribute ("title");
+    }
+  return null;
+}
+
+function
+createCookie (name, value, days)
+{
+  if (days)
+    {
+      var date = new Date ();
+      date.setTime (date.getTime () + (days * 24 * 60 * 60 * 1000));
+      var expires = "; expires=" + date.toGMTString ();
+    }
+  else
+    expires = "";
+  document.cookie = name + "=" + value + expires + "; path=/";
+}
+
+function
+readCookie (name)
+{
+  var nameEQ = name + "=";
+  var ca = document.cookie.split (';');
+  for (var i = 0; i < ca.length; i++)
+    {
+      var c = ca[i];
+      while (c.charAt (0) == ' ')
+	c = c.substring (1, c.length);
+      if (c.indexOf (nameEQ) == 0)
+	return c.substring (nameEQ.length, c.length);
+    }
+  return null;
+}
+
+window.onload = function (e)
+{
+  if (is_konq) {
+    document.getElementById("searchnavlist").getElementsByTagName("li")[0].style.display = 'none';
+    return;
+  }
+  var cookie = readCookie ("style");
+  var title = cookie ? cookie : getPreferredStyleSheet ();
+  setActiveStyleSheet (title);
+}
+
+window.onunload = function (e)
+{
+  if (is_konq) {
+    return;
+  }
+  var title = getActiveStyleSheet ();
+  createCookie ("style", title, 365);
+}
+
+/* Stylesheet switching does not work in Konqueror */
+if (!is_konq) {
+	var cookie = readCookie ("style");
+	var title = cookie ? cookie : getPreferredStyleSheet ();
+	setActiveStyleSheet (title);
+}