Gennaro is named after Gennaro Gattuso, the Inter Milan and former Glasgow Rangers footballer. I always liked his playing style and wish he played for Newcastle United… anyhow, it’s nerazzuri. Its features include:

• being easy on the eye;
• focus on the content of posts;
• small spectrum of blues and blacks.

/*
THEME NAME: Gennaro for Sandbox
DESCRIPTION: A theme named after Gennaro Gattuso
VERSION: 0.2
AUTHOR: Stephen Broughton
AUTHOR URI: http://geoffbrady.net/
TEMPLATE: sandbox
*/

body {
	background-color:#123;
	font:0.9em/1.3em UnDotum, Calibri, Helvetica, Arial, sans-serif;
	margin:0;
	padding:20px 0 0;
}

#menu {
	background:url('http://stevieb.files.wordpress.com/2008/04/menu.gif') bottom repeat-x black;
	border-bottom:1px solid #234;
	position:absolute;
	top:0;
	width:100%;
	padding:20px 0 0;
}

#menu ul {
	margin:20px 0 4px;
	padding:0 20px;
}

#menu ul li {
	display:inline;
}

#menu ul li a {
	color:#eee;
	text-decoration:none;
	padding:5px 20px;
}

#menu ul li.current_page_item a {
	background-color:#123;
	border:1px solid #234;
	color:#cde;
	padding:5px 19px;
}

#menu li a:hover {
	background-color:#234;
	border-top:1px solid #345;
	border-right:1px solid #345;
	border-left:1px solid #345;
	padding:5px 19px;
}

#menu li.current_page_item a:hover {
	background-color:#234;
	border-top:1px solid #345;
	border-right:1px solid #345;
	border-left:1px solid #345;
	color:#eee;
}

h1 {
	font-size:2.4em;
	margin:60px 0 20px 20px;
}

h1 a {
	color:#ddd;
	font-weight:normal;
	text-decoration:none;
}

#blog-description {
	color:#456;
	line-height:80%;
	margin:0 20px;
	padding:0 0 10px;
}

.skip-link {
	position:absolute;
	right:40px;
	top:40px;
}

.skip-link a {
	color:#234;
	font-weight:bold;
	letter-spacing:0.2em;
	text-decoration:none;
	text-transform:uppercase;
}

#header,#nav-above {
	border-bottom:1px solid #234;
}

#nav-below {
	display:none;
}

.navigation {
	font-size:18px;
	height:20px;
}

.navigation a {
	color:#567;
	letter-spacing:0.2em;
	text-decoration:none;
	text-transform:uppercase;
}

.nav-previous {
	float:left;
	padding:0 20px;
}

.nav-next {
	float:right;
	padding:0 20px;
}

.hentry,.comments {
	border-bottom:1px solid #234;
	clear:left;
	float:left;
	width:550px;
	margin:0 20px 10px;
	padding:10px 0;
}

.entry-title {
	color:#567;
	font-size:1.7em;
	font-weight:normal;
	text-transform:uppercase;
	margin:0;
	padding:10px 0 0;
}

.entry-title a {
	color:#567;
	text-decoration:none;
}

.published {
	border:none;
	color:#345;
	font-style:italic;
}

.entry-content {
	color:#89a;
	width:475px;
}

.entry-content img {
	max-width:475px;
}

.entry-content a > img {
	border:3px double #345;
}

.entry-content a:hover > img {
	border:3px solid #345;
}

.entry-content a,.comment a {
	border-bottom:1px solid #345;
	color:#789;
	text-decoration:none;
}

.entry-content a:hover,.comment a:hover {
	border-bottom:3px double #345;
}

.entry-content ul {
	list-style-type:square;
	list-style-position:inside;
	margin:0;
	padding:5px 0 10px 5px;
}

.entry-content li {
	padding:5px 0 2px;
}

.entry-meta {
	color:#345;
	font-weight:bold;
	padding:10px 0;
}

.entry-meta a {
	color:#567;
	font-weight:normal;
	text-decoration:none;
}

.entry-meta a:hover {
	color:#789;
}

h3 {
	font-size:1.7em;
	margin:0;
	padding:20px 0 0;
}

h4 {
	font-size:1.5em;
	margin:0;
	padding:18px 0 0;
}

h5 {
	font-size:1.3em;
	margin:0;
	padding:15px 0 0;
}

h6 {
	font-size:1.2em;
	margin:0;
	padding:12px 0 0;
}

h3,h4,h5,h6 {
	color:#567;
	font-weight:normal;
}

.sidebar,#respond {
	color:#789;
	width:200px;
	margin:10px 10px 10px 650px;
	padding:10px;
}

.sidebar ul {
	list-style-type:none;
	margin:0;
	padding:0;
}

.sidebar h3,#respond h3,#comments h3 {
	font-weight:normal;
	letter-spacing:0.1em;
	text-transform:uppercase;
}

.sidebar ul ul,#searchform {
	padding:10px 20px;
}

.sidebar a,#respond a {
	color:#999;
	text-decoration:none;
}

.sidebar a:hover,#respond a:hover {
	color:#ccc;
}

#searchform input,#respond input,#respond textarea {
	background-color:#234;
	border:1px solid #345;
	color:#678;
}

#footer {
	clear:both;
	color:#123;
	font-size:1.7em;
	font-weight:bold;
	letter-spacing:0.3em;
	text-align:center;
	text-transform:uppercase;
	padding:20px 0;
}

#footer a {
	color:#234;
	text-decoration:none;
}

#footer a:hover {
	color:#345;
}

.comment-author {
	color:#456;
	font-size:1.4em;
	font-weight:bold;
	letter-spacing:0.1em;
	text-transform:uppercase;
}

.comment-author a {
	border:none;
	color:#567;
	text-decoration:none;
}

.comment-author a:hover {
	border:none;
	color:#789;
}

.comment-meta {
	color:#345;
	font-size:0.9em;
	font-style:italic;
}

.comment-meta a {
	color:#567;
	text-decoration:none;
}

.comment-meta a:hover {
	color:#999;
}

#comments ol {
	color:#89a;
	list-style-type:none;
	margin:0;
	padding:0;
}

.comment,.trackback,.pingback {
	border-top:1px solid #234;
	margin:10px 20px 0;
	padding:10px 0;
}

blockquote {
	border-left:3px solid #345;
	margin:10px;
	padding:0 10px;
}

dt {
	color:#567;
	font-weight:bold;
	margin:10px 0 0;
}

.alignleft {
	float:left;
	margin:2px 5px 2px -10px;
}

img.alignleft {
	border:3px solid #567;
}

pre {
	background-color:#345;
	border:1px solid #567;
	padding:5px;
}

As seen in the Sandbox Designs Competition.

CITYscape is a theme styled around its header image. Its features include:

• bold titles;
• two-column sidebar;
• simple sans-serif fonts with line-height paragraph spacing optimal for readability.

/*
THEME NAME: CITYscape for Sandbox
THEME URI: http://geoffbrady.net/sandbox/cityscape/
DESCRIPTION: A city skin for the Sandbox theme
VERSION: 1.8
AUTHOR: Stephen Broughton
AUTHOR URI: http://geoffbrady.net/
TEMPLATE: sandbox
*/

body {
 border-top: 4px #345 solid;
 color: #123;
 font-family: Calibri, Arial, sans-serif;
 width: 800px;
 margin: 20px 20px;
 font-size: 0.8em;
}

#content {
 margin: 0 330px 0 0;
}

.sidebar {
 float: left;
 overflow: hidden;
 width: 150px;
 padding: 1px 0;
}

#primary {
 margin: 0 0 0 -330px;
}

#secondary {
 margin: 0 0 0 -170px;
}

#wrapper {
 padding: 10px 0;
}

#header {
 background-color: #345;
 height: 50px;
 padding: 0 0;
 margin: 0 0;
 width: 100%;
}

h1#blog-title {
 background-color: white;
 height: 50px;
 float: left;
 text-transform: uppercase;
 margin: 0 0 0 50px;
 padding: 10px 10px 0 10px;
 font-size: 200%;
}

h1#blog-title, h1#blog-title a {
 color: #345;
 text-decoration: none;
}

h1#blog-title a:hover, h1#blog-title a:active {
 color: black;
}

#blog-description {
 display: none;
}

#access {
 margin: 10px 0 0 0;
 clear: both;
 height: 200px;
 width: 800px;
 background: url('http://stevieb.files.wordpress.com/2008/07/header.gif') no-repeat center;
}

.skip-link, #menu {
 display: none;
}

#container {
 padding: 0 20px 0 0;
 margin: 0 0 20px 0;
 float: left;
}

.navigation {
 height: 30px;
 margin: 0 0 10px 0;
 padding: 0 0;
 font-size: 150%;
 clear: both;
 border-bottom: 1px solid #89a;
}

.navigation a {
 color: #345;
 text-decoration: none;
 text-transform: uppercase;
 padding: 1px 5px;
 font-weight: bold;
 background-color: white;
 height: 20px;
}

.nav-previous {
 background-color: #345;
 padding: 0 0 0 25px;
 float: left;
}

.nav-next {
 background-color: #345;
 padding: 0 25px 0 0;
 float: right;
}

.hentry {
 border-bottom: 1px solid #89a;
 padding: 0 0;
 margin: 10px 0;
 clear: both;
 background-color: #345;
}

.single #nav-below {
 display: none;
}

#nav-above {
 padding: 10px 0 0 0;
 margin: 10px 0 0 0;
 border-top: 1px solid #89a;
}

h2.entry-title, h3.entry-title {
 background-color: white;
 color: #345;
 text-transform: uppercase;
 font-size: 160%;
 margin: 0 0 0 25px;
 padding: 1px 5px;
}

h2.entry-title a, h3.entry-title a {
 color: #345;
 text-decoration: none;
 background-color: white;
}

.entry-content h2 {
 text-transform: uppercase;
 font-size: 130%;
}

.entry-content {
 padding: 1px 0 1px 30px;
 margin: 0 0;
 font-size: 120%;
 line-height: 150%;
 background-color: white;
}

.entry-date {
 text-align: right;
 background-color: white;
 margin: 0 0;
 padding: 5px 0 10px 0;
}

abbr.published {
 border-bottom: 1px #89a solid;
}

.meta-nav {
 display: none;
}

.home .entry-meta {
 display: none;
}

.entry-meta {
 background-color: white;
 padding: 20px 20px;
 border-top: 1px solid #89a;
 line-height: 140%;
}

.entry-meta a {
 text-decoration: none;
 color: #345;
 font-weight: bold;
}

.entry-meta a:hover {
 color: #678;
}

.entry-content a {
 color: #345;
 font-weight: bold;
 text-decoration: none;
}

.entry-content a:hover {
 color: #678;
}

.entry-content h3 {
 font-size: 160%;
 color: #345;
 margin: 25px 0 0 0;
}

.entry-content h4 {
 font-size: 150%;
 color: #345;
 margin: 25px 0 0 0;
}

.entry-content h5 {
 font-size: 140%;
 color: #345;
 margin: 25px 0 0 0;
}

.entry-content h6 {
 font-size: 130%;
 color: #345;
 margin: 25px 0 0 0;
}

.entry-content img {
 max-width: 400px;
}

pre, tt, code {
 font-family: 'Courier New', monospace;
 font-size: 90%;
}

#footer {
 clear: both;
 border-top: 1px solid #89a;
 padding: 10px 10px;
 margin: 10px 0 0 0;
 background-color: #345;
 font-size: 120%;
}

#footer p {

 margin: 2px 0;
 padding: 0 0;
}

#footer, #footer a {
 color: white;
}

#footer a {
 text-decoration: none;
 font-weight: bold;
}

#respond {
 clear: both;
 background-color: #345;
 padding: 0 0;
 margin: 0 0 20px 0;
 color: #345;
}

#respond a {
 color: #345;
 text-decoration: none;
}

#respond a:hover {
 color: #678;
}

#respond h3 {
 background-color: white;
 margin: 0 0 0 20px;
 padding: 0 5px;
 font-size: 150%;
 text-transform: uppercase;
}

.formcontainer {
 background-color: white;
 padding: 0 0 0 20px;
 margin: 0 0;
}

#respond form {
 margin: 0 0 0 22px;
 padding: 0 0;
}

#respond form p {
 margin: 0 0;
 padding: 10px 0;
}

.entry-content ul {
 list-style-type: square;
}

#archives-page h3 {
 margin: 20px 0 0 20px;
 padding: 0 5px;
 font-size: 140%;
 text-transform: uppercase;
}

#links-page h3 {
 margin: 20px 0 0 20px;
 padding: 0 5px;
 font-size: 120%;
 text-transform: uppercase;
 background-color: white;
}

h2.page-title {
 text-transform: uppercase;
 font-size: 180%;
 color: #345;
}

.comment h2, .trackback h2, .pingback h2 {
 padding: 0 0;
 margin: 0 0;
 background-color: white;
 font-weight: normal;
 color: #345;
 text-transform: uppercase;
 font-size: 140%;
}

.comment h2 a, .trackback h2 a, .pingback h2 a {
 text-decoration: none;
 color: #345;
 font-weight: bold;
}

.comment, .trackback, .pingback {
 clear: both;
 background-color: white;
 padding: 15px 0;
 border-bottom: 1px solid #89a;
 font-size: 120%;
}

.comments ol {
 list-style-type: none;
 margin: 0 0;
 padding: 0 0;
}

.comments ol li {
 padding: 10px 0 10px 0;
}

.comments {
 clear: left;
 background-color: #345;
 margin: 20px 0;
 padding: 0 0;
}

.comments h3 {
 background-color: white;
 text-transform: uppercase;
 color: #345;
 margin: 0 0 0 20px;
 padding: 0 5px;
 font-size: 140%;
}

.alignleft {
 float: left;
}

.alignright {
 float: right;
}

.center {
 text-align: center;
}

dt {
 border-bottom: 1px solid #89a;
 margin: 10px 0 0 0;
}

dd {
 margin: 0 0 0 30px;
}

.tags {
 text-align: justify;
 line-height: 200%;
}

.tags a {
 color: #345;
 text-decoration: none;
}

.tags a:hover {
 color: #678;
}

ul#links-page, ul#archives-page {
 padding: 10px 0 1px 0;
 margin: 0 0 10px 0;
 background-color: white !important;
}

.sidebar ul.xoxo {
 padding: 0 0;
 margin: 0 0 10px 0;
}

ul.xoxo {
 list-style-type: none;
 background-color: white !important;
}

ul.xoxo li {
 margin: 20px 0 0 0;
 background-color: #345;
}

ul.xoxo li li, .textwidget {
 margin: 0 0 !important;
 background-color: white;
}

.textwidget {
 padding: 10px 0;
}

.textwidget a {
 font-weight: bold;
}

ul.xoxo li h3 {
 text-transform: uppercase;
 margin: 0 0 0 20px;
 padding: 0 5px;
 font-size: 130%;
 background-color: white;
 color: #345;
}

ul.xoxo ul, ul.xoxo form {
 background-color: white;
 list-style-type: square;
 padding: 10px 0 20px 20px;
 margin: 0 0;
 color: #345;
 border-bottom: 1px solid #89a;
}

ul.xoxo ul ul {
 padding: 5px 0 5px 10px !important;
 border-bottom: none;
}

.sidebar a {
 color: #345;
 text-decoration: none;
}

.fn {
 text-transform: uppercase;
 color: #345;
 font-size: 120%;
}

.fn a {
 color: #345;
 text-decoration: none;
 font-weight: bold;
}

.comment-meta {
 margin: 0 0 0 40px;
}

.comment-meta a {
 color: #345;
 font-weight: bold;
 text-decoration: none;
}

.comment a {
 color: #345;
 font-weight: bold;
 text-decoration: none;
}

.comment-author a {
 text-transform: uppercase;
 font-weight: bold;
 color: #345;
 text-decoration: none;
}

.entry-content a img {
 border: 1px solid #345;
}

.entry-content img {
 margin: 5px 10px;
}

ins {
 color: #567;
}

del {
 color: #89a;
}

cite {
 font-style: italic;
 color: #89a;
}

.comment p, .trackback p, .pingback p {
 padding: 5px 0 5px 40px;
}

.entry-content blockquote {
 border-left: 1px solid #89a;
 padding: 0 20px;
 margin: 5px 20px;
}

.comment blockquote {
 border-left: 1px solid #89a;
 padding: 0 0;
 margin: 5px 0 5px 60px;
}

.required {
 font-weight: bold;
 color: red;
}

As seen in the Sandbox Designs Competition.

Chocolate Vanilla is a theme predominantly coloured in brown shades. Its features include:

• careful use of fonts to blend serif stylised titles with simple sans serif content, with extra line-height for attractiveness and greater readability;
• medium contrast between text and background to ensure comfort while reading whilst also providing enough contrast to remain clear and readable;
• a menu bar near the top indicating which page is currently being browsed.

/*
THEME NAME: Chocolate Vanilla
THEME URI: http://geoffbrady.net/sandbox/chocolate-vanilla/
DESCRIPTION: A theme that concentrates on simple typography
VERSION: 0.4
AUTHOR: Stephen Broughton
AUTHOR URI: http://geoffbrady.net
TEMPLATE: sandbox-10
*/

#container {
 clear: right;
 float: right;
 width: 450px;
}

#footer {
 clear: both;
 padding: 10px 0;
}

#header {
 height: 100px;
 float: left;
 width: 350px;
}

#menu {
 height: 100px;
 width: 400px;
}

#primary, #secondary {
 clear: left;
 float: left;
 width: 250px;
}

#wrapper {
 width:760px;
}

a.more-link, #archives-page ul, #comments a, .entry-content a,
.entry-meta a, .entry-title, .entry-title a, #footer a, input,
#link-page ul, #menu li a,.navigation a, .page-link a,
.sidebar li a, .navigation a:hover, .page-link a:hover textarea {
 color:#530;
}

body {
 color:#000;
}

a.more-link:hover, h1#blog-title, h1#blog-title a,
h1#blog-title a:hover, #menu li.current_page_item > a {
 color:#fff;
}

.tags a {
 color:#530;
}

a.more-link, #container, .navigation a, .page-link a, #wrapper {
 background-color:#edb;
}

a.more-link:hover, #comments a:hover, .entry-meta a:hover,
.entry-content a:hover, #footer, .formcontainer a:hover, #header,
#menu, #menu li a, .sidebar li a:hover, #comments-list li.alt,
#trackbacks-list li.alt, .navigation a:hover, .page-link a:hover {
 background-color:#dca;
}

body, input, textarea {
 background-color:#fbedda;
}

#footer a:hover, #menu li a:hover,
#menu li.current_page_item > a:hover {
 background-color:#a97;
}

#menu li.current_page_item > a {
 background-color:#753;
}

.sidebar {
 background:url(http://geoffbrady.net/wp-content/themes/chocolate-vanilla/bg.png);
}

a.more-link, .navigation a, .page-link a {
 border-bottom:1px solid #edb;
}

a.more-link:hover, .navigation a:hover, .page-link a:hover {
 border-bottom:1px solid #a97;
}

blockquote {
 border-left:4px solid #a97;
}

#footer {
 border-top:4px solid #a97;
}

.entry-title a {
 border-bottom:none !important;
}

#comments h3, .entry-title, .entry-title a, .entry-title a:hover,
#header, #menu, #primary, #respond h3, #trackbacks-list h3 {
 border-bottom:4px solid #a97;
}

#comments a, dt, .entry-meta a, .entry-content a, #footer a,
.formcontainer a, .sidebar li a {
 border-bottom:1px solid #a97;
}

.byuser {
 border:1px solid #a97;
}

input, .bypostauthor, textarea {
 border:1px solid #530;
}

#footer a:hover	{
 border-bottom:	1px solid #530;
}

#archives-page ul, #links-page ul {
 margin: 10px 20px;
 padding: 0;
}

blockquote {
 margin-left: 20px;
 padding-left: 20px;
}

#blog-description {
 margin: 0 20px;
}

body, #menu ul {
 padding: 0;
 margin: 0;
}

#comments {
 margin: 50px 0 20px 10px;
}

#container {
 padding: 0 0 0 20px;
}

dt {
 margin: 10px 0 5px;
}

.entry-content h3, .entry-content h4, .entry-content h5,
.entry-content h6 {
 margin: 25px 0 0;
 padding: 0 0;
}

.entry-content p {
 margin: 10px 0;
 padding: 0 0;
}

.entry-meta {
 margin: 10px 10px;
}

.entry-title {
 margin: 40px 0 0;
}

#footer {
 padding: 10px 0;
}

h1#blog-title {
 margin: 10px 5px;
}

#header {
 margin: 0;
 padding: 5px 0;
}

.hentry {
 clear: left;
 width: 400px;
 margin: 10px;
}

img {
 max-width: 400px;
}

input#s {
 width: 150px;
}

li.widget, li#pages, li#categories, li#search, li#archives,
li.linkcat, li#rss-links, li#meta {
 margin: 40px 0;
}

#menu {
 padding: 5px 0 5px 10px;
 margin-left: 350px;
}

#menu li {
 margin: 2px 0;
 width: 100%;
}

#menu li a {
 display: block;
 padding: 0 20px;
}

.nav-next {
 float: right;
 margin: 10px 20px 10px 0;
}

.nav-previous {
 float: left;
 margin: 10px 0 10px 20px;
}

.page-link a {
 padding: 0 2px;
 margin: 0 2px;
}

.sidebar {
 margin: 0;
 padding: 0 20px;
}

#comments h3, .sidebar h3 {
 padding: 0;
 margin: 0 0 5px;
}

.sidebar li li {
 margin: 1px 0;
}

.sidebar ul {
 margin: 0;
 padding: 0;
}

#trackbacks-list li, #comments-list li {
 margin: 40px 0;
 width: 350px;
 padding: 10px 10px;
}

ul#archives-page, ul#links-page {
 padding: 0;
 margin: 10px 0;
}

ul.children {
 margin: 2px 10px;
 padding: 0;
}

ul.xoxo {
 padding: 10px 10px;
 margin: 10px 10px;
}

#wrapper {
 margin: 0 auto;
}

#archives-page ul, .entry-content ul, #links-page ul {
 list-style-type:square;
}

.skip-link {
 display:none;
}

#comments-list li, #menu ul, #trackbacks-list li, .sidebar ul,
ul#archives-page, ul#links-page {
 list-style-type:none;
}

ins {
 text-decoration:none;
}

del, ins {
 color:#753;
 background: url('http://geoffbrady.net/wp-content/themes/chocolate-vanilla/bg.png');
}

#archives-page h3, #comments h3, .entry-content h3,
.entry-content h4, .entry-content h5,.entry-content h6,
.entry-title, h2.page-title, #links-page h3, #respond h3,
.sidebar h3, #trackbacks-list h3 {
 font-family:'Bookman Old Style', 'Times New Roman', serif;
 font-style:italic;
 font-weight:normal;
}

#archives-page ul, #links-page ul {
 color:#530;
}

body {
 font-family:'Lucida Sans Unicode', Tahoma, Verdana, sans-serif;
 font-size:0.7em;
}

code, pre {
 font-family:'Courier New', consolas, monospace;
}

.entry-date {
 text-align:right;
}

#footer {
 text-align:center;
}

.entry-content {
 line-height:180%;
}

.entry-meta {
 line-height:160%;
}

.tags {
 line-height:220%;
}

h2.page-title {
 font-size:220%;
}

.entry-title, .sidebar h3 {
 font-size:200%;
}

#comments h3, h1#blog-title, h1#blog-title a, .entry-content h3	{
 font-size:140%;
}

.entry-content h4 {
 font-size:135%;
}

.entry-content h5 {
 font-size:130%;
}

.entry-content h6 {
 font-size:125%;
}

code, pre {
 font-size:110%;
}

.entry-meta {
 font-size:90%;
}

a, .entry-title, .entry-title a, .entry-title a:hover,
h1#blog-title, h1#blog-title a, #menu li a {
 text-decoration:none;
}

I’ve restarted this site again. My apologies if you came here expecting to see something different, but hopefully you shall find this site a little more useful, particularly if you are a WordPress user.

I shall be releasing a few of my Sandbox skins from here. So whether you have your own standalone WordPress install, or whether you have a blog on wordpress.com with the custom design upgrade, you can feel free to use any of these skins in conjunction with Sandbox.

Each skin is released under the GNU General Public Licence. This means, in a nutshell, that you can do pretty much what you like with it – take it or leave it. That said, I truly appreciate any credit when you use my work; even just to know that my empire is expanding!

Enjoy!