» style -- Flexible Squares, S2
» works with -- Free, Paid & Sponsored
»

uploading instructions. READ THEM.
/* BY: Minty_Peach -- (http://minty_peach.livejournal.com) DO NOT STEAL, DO NOT REPOST */ BODY { margin: 100px 0px 50px 0px; background-color: #DDDDDD; text-align: left; font-size: 10px; color: #8e8e8e; font-family: "Verdana", sans-serif; background-image: url(''); background-repeat: repeat; } i, s, u { color: #afafaf; } a, a:link, a:visited { color: #87B2F8; font-style: italic; text-transform: lowercase; text-decoration: none; } a:hover{ color: #555555; } blockquote { margin: 7px; padding: 7px; color: #777777; background-color: #f5f5f5; font-size: 10px; border: 1px solid #cccccc; text-align: justify; line-height: 16px; } p, td { font-size: 10px; } code, kbd, pre, tt { font-family: monospace; } #content { width: 800px; margin-left: auto; margin-right: auto; background-color: #FDFDFD; } #maincontent { margin: 0px 0px 0px 0px; } #sidebar { width: 100%; color: #cccccc; background-color: #DDDDDD; font-family: "verdana" Helvetica, sans-serif; font-size: 10px; line-height: 14px; text-align: justify; float: center; } .defaultuserpic { float: left; padding: 7px; background-color: #FDFDFD; margin-bottom: 10px; margin-right: 20px; margin-top: -20px; border: 1px solid #cccccc; } .sbarheader { padding: 0px; } .sbarbody { padding: 0px; } .sbarbody2 { padding: 0px; } table.calendar { margin-right: auto; margin-left: auto; } .sbarcalendar { padding: 3px; border: 1px solid #ddd; background: #FEFEFE; text-align: center; font-family: "Verdana", Helvetica, sans-serif; color: #bbbbbb; font-size: 10px; } .sbarcalendarposts { padding: 3px; border: 1px solid #ccc; background: #eee; text-align: center; font-family: "Verdana", Helvetica, sans-serif; color: #EB8A00; font-size: 10px; } ul.sbarlist { margin-left: 0px; list-style: none; padding-left: 0px; } li.sbaritem { padding-left: 5px; list-style: none; } li.sbaritem:hover { background-color: #eeeeee; } li.sbartitle { display: none; list-style: none; text-align: left; text-transform: lowercase; color: #eeeeee; font-family: "arial" Helvetica, sans-serif; font-size: 1pt; } ul.ljtaglist li{ padding: 0px; margin: 5px; list-style: decimal-leading-zero; list-style-position: outside; } /**************************************************** HEADER & FOOTER LINKS - NOT THE HEADERIMAGE **************************************************/ #header { width: auto; border: 10px solid #DDDDDD; line-height: 50px; text-align: center; background-color: #444444; font-size: 11pt; color: #cccccc; text-transform: uppercase; font-style: italic; } #footer { width: auto; border: 10px solid #DDDDDD; line-height: 50px; text-align: center; background-color: #444444; font-size: 11pt; color: #cccccc; clear: both; text-transform: uppercase; font-style: italic; } div#header a, div#header a:link, div#header a:visited { color: #aaaaaa; font-size: 11pt; text-transform: uppercase; } div#footer a, div#footer a:link, div#footer a:visited { color: #aaaaaa; font-size: 11pt; text-transform: uppercase; } div#header a:hover { color: #777777; } div#footer a:hover { color: #777777; } ul.navheader { padding: 0 3px 0 3px; margin: 0 3px 0 3px; } ul.navheader li { display: inline; list-style: none; padding: 0; } div#header li.view { color: #bbbbbb; } div#footer li.viewing { color: #bbbbbb; } #footer .viewing { display:none; } ul.navfooter { padding: 0 2px 0 2px; margin: 0 2px 0 2px; } ul.navfooter li { display: inline; margin: 0 0px 0 0px; } .clearfoot { display: none; } ul.navfooter { padding: 0px; margin: 0px; } ul.navfooter li { display: inline; margin: 0 0px 0 0px; } /******************* title & subtitle *********************/ .title { display: none; } .subtitle { display: none; } /******************************* TAGS PAGE LAYOUT ********************************/ .ljtaglist { list-style-type: none; margin: -1px 20px 0px 20px; margin-left: 70px; width: 50%; text-transform: uppercase; text-align: left; background: #FDFDFD; } .ljtaglist li { background: #FDFDFD; border-bottom: 1px solid #cccccc; padding: 6px 3px 6px 20px; color: #666666; } H2 { background: #FDFDFD; margin: 30px; text-align: left; padding: 10px; line-height: 12px; font-weight: normal; font-style: italic; font-size: 12px; text-transform: uppercase; font-family: arial; color: #888888; } /*********************************************** ENTRY, TAGS LIST, SUB CONTENT, EXTRA ***********************************************/ ul.ljtaglist { color: #bbb; font-family: "Tahoma", Helvetica, sans-serif; font-size: 9pt; padding: 8px 8px 8px 12px; text-align: left; margin-right: auto; margin-left: auto; padding: 25px; } .subcontent { padding: 0px; background: #FFFFFF; border: 10px solid #DDDDDD; } .entry{ padding: 20px; background: #FFFFFF; color: #666666; font-family: "verdana" Helvetica, sans-serif; font-size: 10px; line-height: 16px; text-align: justify; border: 1px solid #cccccc; } .entry ul li { padding-left: 0px; margin-left: 0px; list-style: decimal-leading-zero; list-style-position: outside; } .entry ol li { padding-left: 0px; margin-left: 0px; list-style: decimal-leading-zero; list-style-position: outside; } /*********************************************** USERPICS, FRIENDS PAGE USERPICS, DATE, SUBJECT &MORE ************************************************/ .userpic { display: none; /* remove this line to view userpics */ position: relative; float: left; padding: 10px; margin-right: 10px; margin-bottom: 10px; z-index: 15px; background-color: #DDDDDD; } .userpicfriends { position: relative; float: left; padding: 10px; margin-right: 10px; margin-bottom: 10px; z-index: 15px; text-align: left; font-size: 7pt; background-color: #DDDDDD !important; } .userpicfriends font { color: #555555 !important; text-transform: lowercase; } .userpicfriends br { display: block; height: 0; } .date { text-align: left; font-style: italic; font-weight: normal; padding-right: 15px; font-size: 8pt; color: #AAAAAA; text-transform: uppercase; float: left; } .subject { text-align: left; font-style: italic; padding-bottom: 1px; color: #777777; font-size: 8pt; text-transform: uppercase; } .subject a, .subject a:link, .subject a:visited { color: #aaaaaa; text-transform: lowercase; } .subject a:hover { color: #999; } .datesubject { padding: 10px; background-color: #444444; border-bottom: 10px solid #DDDDDD; } .currents { background-color: transparent; } .currents strong{ font-weight: normal; text-transform: uppercase; font-size: 7pt; color: #999999; } .currentlocation { padding-left: 12px; font-size: 7pt; background: url('http://i30.tinypic.com/2l972iu.png') 0px 2px no-repeat; } .currentmood { padding-left: 12px; font-size: 7pt; background: url('http://i30.tinypic.com/2l972iu.png') 0px 2px no-repeat; } .currentmusic { padding-left: 12px; font-size: 7pt; background: url('http://i30.tinypic.com/2l972iu.png') 0px 2px no-repeat; } .ljtags { margin-top: 25px; padding-left: 12px; text-transform: uppercase; font-size: 7pt; color: #999999; background: url('http://i30.tinypic.com/2l972iu.png') 0px 2px no-repeat; } .ljtags a, .ljtags a:link, .ljtags a:visited { font-size: 7pt; padding-left: 5px; color: #CEA500; text-transform: none; } .currentlocation a, .currentlocation a:link, .currentlocation a:visited { color: #F53F3F; text-transform: lowercase; } .currentlocation a:hover, .ljtags a:hover { color: #555555; text-transform: lowercase; text-decoration: none; } .comments { font-size: 8pt; text-align: right; font-weight: none; padding: 3px; position: relative; color: #aaaaaa; top: 5px; border-top: 1px dashed #DDDDDD; } div.comments a, div.comments a:link, div.comments a:visited { color: #aaaaaa; text-transform: uppercase; } div.comments a:hover { color: #777777; } /*********************************************** ARCHIVE PAGE/CALENDAR ******************************************/ ul.year{ text-align: center; padding: 4px 4px 4px 4px; border: 0px solid #454545; } ul.year li { color: #999999; display: inline; } table.yeartable { margin-left: auto; margin-right: auto; padding: 4px; border: 0px solid #454545; } table.yeartable td.yeardate, table.yeartable td.yearday { color: #888888; padding: 4px; border: 1px solid #999999; text-align: center; } table.yeartable td.yearday { background: #cccccc; border: 1px solid #aaaaaa; padding: 4px; text-align: center; } td.yearmonth { color: #999999; border-style: none; } /*********************************************** HEADER IMAGE ******************************************/ .headerimage { position: relative; width: 0px; height: 0px; margin-left: auto; margin-right: auto; margin-bottom: 0px; background-image: url(''); background-repeat: no-repeat; } .separator { height: 10px; background-color: #DDDDDD; } /*********************************************** COMMENT PAGES ******************************************/ .clear { display: none; } .skiplinks { text-transform: lowercase; text-align: center; background-color: #FFFFFF; padding: 15px; border-width: 20px 10px 20px 10px; border-style: solid; border-color: #DDDDDD; color: #999999; } .datesubjectcomment { background-color: #444444; padding: 10px; border-bottom: 10px solid #DDDDDD; } .userpiccomment { position: relative; background-color: #DDDDDD; top: -10px; left: 0px; margin: 0px 10px -20px -10px; z-index: 15; float: left; padding-right: 10px; padding-bottom: 10px; } .box { width: auto; background-color: #DDDDDD; clear: left; padding-top: 30px; padding-bottom: 10px; border-left: 10px solid #DDDDDD; } input, textarea { background-color: #eeeeee; color: #555555; } textarea.textbox{ width: 75% !important; } .reply{ position: relative; margin: 5px 5px 5px 5px; padding: 5px 5px 5px 5px; text-align: left; font-size: 10px; line-height: 125%; color: #EB8A00; } .replytosubject { font-weight: bold; } .commentreply { position: relative; padding: 10px 10px 20px 130px; font-size: 10px; color: #777777; } .commentbox { border-top: 20px solid #DDDDDD; background-color: #FFFFFF; padding: 0px; margin: 10px; } .datesubjectcomment a:link, .datesubjectcomment a:visited { color: #666666; } .datesubjectcomment a:hover { color: #999999; } .commentboxpartial { background-color: #FFFFFF; padding: 5px; margin: 12px; } .commentinfo { margin-top: 10px; width: 100%; }

1. the sidebar has been converted to a "topbar". blurb-only suggested.
2. the "topbar" is controlled by the customize sidebar page.


This next code creates the three gray boxes that make up the "topbar".
Add your info, and then paste this in the BLURB section:
<table width="100%" bgcolor="#DDDDDD" cellspacing="10" cellpadding="15"><tr><td bgcolor="#444444" width="33%" valign="top"><div text align="justify"><i>one.</i> Write anything here. Write anything here. Write anything here. <td bgcolor="#444444" width="34%" valign="top"><div text align="justify"><i>two.</i> Write anything here. Write anything here. Write anything here. <td bgcolor="#444444" width="33%" valign="top"><div text align="justify"><i>three.</i> Write anything here. Write anything here. Write anything here. </div></div></div></td></td></td></tr></table>