In Repair

I’ve ported the “Prima” theme for use on WordPress.com blogs with the CSS upgrade. This was one of the winning themes in the Sandbox Designs Competition and has a brown, orange, and turquoise color scheme. It was designed by Sunaryo Hadi.

Screenshot:

Directions:

1. Set your theme to Sandbox-10 under the Presentations tab on your Dashboard.
2. Click Edit CSS and select “Start from scratch and just use this”.
3. Copy and paste the following code into the CSS Stylesheet Editor:

body {
height:100%;
background:#F1EFE2 url(’http://inrepair.files.wordpress.com/2007/11/bg.jpg’) repeat-x top left;
font:14px “Trebuchet MS”, Arial, Tahoma, Helvetica, sans-serif;
color:#000;
text-align:center;
margin:0 auto;
padding:0;
}

body.loggedin {
background:#F1EFE2 url(’http://inrepair.files.wordpress.com/2007/11/bg.jpg’) repeat-x 0 28px !important;
margin:28px !important;
}

p {
margin:7px 0;
padding:0;
}

a {
color:#1F70A5;
outline:none;
cursor:hand;
}

a:hover {
color:#f60;
}

img.left,img.alignleft {
float:left;
margin-right:10px;
}

img.right,img.alignright {
float:right;
margin-left:10px;
}

#wrapper,#header,#access,#container,#primary,#secondary,#footer {
display:inline-block;
overflow:hidden;
text-align:left;
}

#wrapper {
width:770px;
padding-left:10px;
margin:0 auto;
}

#container {
width:550px;
float:left;
margin-bottom:20px;
}

#header {
width:770px;
height:96px;
background:transparent url(’http://inrepair.files.wordpress.com/2007/11/header-bg.jpg’) no-repeat 0 0;
}

.skip-link {
display:none;
}

#access {
height:28px;
margin-bottom:15px;
background:transparent url(’http://inrepair.files.wordpress.com/2007/11/header-bg.jpg’) no-repeat bottom left;
line-height:1em;
}

#menu {
width:770px;
}

#menu ul {
list-style:none;
margin:0;
padding:0;
}

#menu ul li {
display:inline;
font-size:13px;
font-weight:bold;
}

#menu ul li a {
display:inline-block;
overflow:hidden;
height:28px;
float:left;
border-right:2px solid #C1BDA2;
text-decoration:none;
background:transparent url(’http://inrepair.files.wordpress.com/2007/11/menu-bg.png’) no-repeat top left;
margin:0 5px 0 0;
padding:8px 13px 0 17px;
}

#menu ul li a:hover {
background:transparent url(’http://inrepair.files.wordpress.com/2007/11/menu-bg-hover.png’) no-repeat top left;
}

#header a {
color:#D2CCA2;
text-decoration:none;
}

#header a:hover {
color:#fc0;
}

#blog-title {
font-size:36px Helvetica, “Trebuchet MS”, Arial, Tahoma, sans-serif;
font-weight:bold;
letter-spacing:2px;
line-height:1em;
margin:0;
padding:27px 0 0;
}

#blog-description {
font-size:16px;
font-weight:bold;
line-height:1em;
color:#EBE9D6;
margin:5px 0 0;
padding:0;
}

.post {
padding-bottom:30px;
background:transparent url(’http://inrepair.files.wordpress.com/2007/11/hrbg.gif’) no-repeat bottom center;
margin:0;
}

.entry-title {
font-size:20px;
font-weight:normal;
line-height:1.3em;
color:#433;
margin:5px 0 0;
padding:0;
}

.entry-title a {
text-decoration:none;
color:#f60;
margin:0;
padding:0;
}

.entry-title a:hover {
color:red;
}

.entry-date {
font-size:11px;
border:none;
color:#766;
background:transparent url(’http://inrepair.files.wordpress.com/2007/11/cal.png’) no-repeat 0 0;
line-height:16px;
margin:3px 0;
padding:0 0 0 20px;
}

.entry-content {
line-height:1.5em;
color:#433;
background:#F7F5EE;
border-top:1px solid #fff;
border-left:1px solid #fff;
border-right:1px solid #E2DEC5;
border-bottom:1px solid #E2DEC5;
margin:5px 0;
padding:10px 17px;
}

.published {
text-decoration:none;
border:none;
margin:0;
padding:0;
}

.entry-meta {
color:#777;
font-size:12px;
line-height:1.4em;
text-align:justify;
display:inline-block;
overflow:hidden;
margin:0;
padding:0;
}

.author,.cat-links,.comments-links {
font-size:12px;
line-height:1.4em;
}

.author a {
background:transparent url(’http://inrepair.files.wordpress.com/2007/11/user.png’) no-repeat 0 0;
padding-left:17px;
}

.cat-links a {
background:transparent url(’http://inrepair.files.wordpress.com/2007/11/folder.png’) no-repeat 0 0;
padding-left:18px;
}

.edit-link a {
background:transparent url(’http://inrepair.files.wordpress.com/2007/11/edit.png’) no-repeat 0 0;
padding-left:18px;
}

.comments-link {
background:transparent url(’http://inrepair.files.wordpress.com/2007/11/comment.png’) no-repeat 0 0;
padding-left:18px;
}

.page-title {
color:#83783D;
font-size:16px;
font-weight:bold;
border-top:1px solid #C7BE8D;
border-bottom:1px solid #E2DEC5;
margin:0 0 20px;
padding:1px 0;
}

.page-title span {
color:red;
text-transform:uppercase;
}

#nav-above {
display:inline-block;
overflow:hidden;
margin-bottom:20px;
}

.meta-nav {
display:none;
}

.navigation a {
text-decoration:none;
}

.navigation a:hover {
text-decoration:underline;
}

.nav-previous {
width:250px;
float:left;
display:inline-block;
overflow:hidden;
background:transparent url(’http://inrepair.files.wordpress.com/2007/11/left.png’) no-repeat left 3px;
padding-left:22px;
}

.nav-next {
width:250px;
float:right;
display:inline-block;
overflow:hidden;
text-align:right;
background:transparent url(’http://inrepair.files.wordpress.com/2007/11/right.png’) no-repeat right 3px;
padding-right:22px;
}

#nav-below {
display:none;
}

#primary {
width:200px;
float:right;
font-size:13px;
color:#433;
line-height:1.5em;
}

#primary ul.xoxo,#primary ul.xoxo li ul {
list-style:none;
margin:0;
padding:0 0 7px;
}

#primary ul li {
border-top:1px solid #C7BE8D;
border-bottom:1px solid #E2DEC5;
margin:0 0 25px;
padding:0;
}

#primary h3 {
color:#83783D;
font-size:13px;
font-weight:bold;
background:transparent url(’http://inrepair.files.wordpress.com/2007/11/hrbg.gif’) no-repeat bottom center;
text-align:center;
letter-spacing:1px;
text-transform:uppercase;
margin:0;
padding:3px 7px 15px;
}

#primary li ul li {
border:0;
margin:0;
padding:0 7px 0 14px;
}

#primary ul li ul li a {
border-top:0 solid #E0E8A8;
text-decoration:none;
outline:0;
margin:0;
padding:0;
}

#primary ul li ul li a:hover {
text-decoration:underline;
}

#secondary {
clear:both;
width:770px;
background:#E9E5D1 url(’http://inrepair.files.wordpress.com/2007/11/secondary-bg.png’) no-repeat bottom left;
padding-bottom:10px;
margin-bottom:20px;
line-height:1.4em;
color:#433;
}

#secondary a {
text-decoration:none;
}

#secondary a:hover {
text-decoration:underline;
}

#secondary h3 {
color:#83783D;
font-size:12px;
font-weight:bold;
text-transform:uppercase;
margin:0;
padding:3px 7px 15px;
}

#secondary ul.xoxo {
width:770px;
background:transparent url(’http://inrepair.files.wordpress.com/2007/11/secondary-top.png’) no-repeat top right;
list-style:none;
display:inline-block;
overflow:hidden;
margin:0;
padding:10px 0;
}

#secondary ul.xoxo li {
width:235px;
float:left;
padding-left:15px;
display:inline-block;
overflow:hidden;
}

#secondary ul.xoxo li ul {
list-style:none;
font-size:13px;
margin:0;
padding:0;
}

#secondary ul.xoxo li ul li {
float:none;
}

#secondary ul.xoxo li h3 {
font-size:16px;
margin:0;
padding:5px 0;
}

#footer {
text-align:center;
color:#E2DEC5;
background:transparent url(’http://inrepair.files.wordpress.com/2007/11/hrbg.gif’) no-repeat top center;
padding-top:20px;
margin:0 auto 20px;
}

#footer a {
text-decoration:none;
}

input,textarea {
font:14px/1em “Trebuchet MS”, Arial, Tahoma, Helvetica, sans-serif;
background:#fff url(’http://inrepair.files.wordpress.com/2007/11/input-bg.jpg’) repeat-x bottom left;
border:1px solid #E2DEC5;
margin:0 14px 5px;
padding:3px 5px;
}

form#searchform {
display:inline-block;
overflow:hidden;
margin:0;
padding:5px 0;
}

form#searchform input#s {
width:170px;
}

form#searchform #searchsubmit {
display:none;
}

#comments {
width:550px;
display:inline-block;
overflow:hidden;
margin:0;
padding:0;
}

#comments h3 {
color:#433;
margin:0;
padding:0 0 0 18px;
}

#comments-list,#respond {
padding-bottom:20px;
background:transparent url(’http://inrepair.files.wordpress.com/2007/11/hrbg.gif’) no-repeat bottom center;
}

#comments-list h3 {
background:transparent url(’http://inrepair.files.wordpress.com/2007/11/comment.png’) no-repeat 0 3px;
}

#respond h3 {
background:transparent url(’http://inrepair.files.wordpress.com/2007/11/new.png’) no-repeat 0 3px;
}

#comments ol {
margin:10px 0 10px 20px;
padding:0 0 0 20px;
}

#comments ol li {
margin-bottom:7px;
border-top:1px solid #E2DEC5;
border-left:1px solid #E2DEC5;
border-right:1px solid #FFF;
border-bottom:1px solid #FFF;
background:#EDEBE0;
color:#000;
padding:5px 10px;
}

.formcontainer {
border:1px solid #fff;
border-top:1px solid #E2DEC5;
border-left:1px solid #E2DEC5;
border-right:1px solid #FFF;
border-bottom:1px solid #FFF;
color:#433;
margin:10px 0 10px 20px;
padding:5px 10px;
}

.comment-author {
font-weight:bold;
color:#433;
}

.comment-meta {
font-size:12px;
color:#433;
}

.form-label {
float:left;
width:70px;
display:inline-block;
}

.form-submit {
padding-left:70px;
display:inline;
}

#wp-calendar {
text-align:center;
font-size:13px;
margin:0 auto;
padding:0;
}

#wp-calendar a {
border:0;
}

#wp-calendar tr {
border-top:1px solid #6F6935;
margin:0;
padding:0;
}

#wp-calendar td,#wp-calendar th {
line-height:1em;
border-bottom:1px solid #E2DEC5;
margin:0;
padding:2px 5px;
}

#wp-calendar td.pad,#wp-calendar td#prev,#wp-calendar td#next {
border:0;
}

#secondary #wp-calendar {
margin:0;
}

That’s it! All of the icons/images are already uploaded to WordPress and should display without a problem. If you wish to host your own images, simply upload them to your blog and change the corresponding urls.