Layout
Hi! I made a layout for myself and then I LotS-uped it a bit (because playing with pretty Kahlan and Cara pics is more fun than it ought to be) and I thought I'd share. It's very self-indulgent (I'm in a cheery mood) so it's colourful (nearly tackily so) and image heavy (though, not in a I-kill-your-browser-now sort of way; it's actually light in that sense).
Layout Style: Flexible Squares
Best view: 1024×768 +
Browser(s) Compatible: Tested in Firefox, IE 7 and Opera (I was told it doesn't look so hot in some versions of IE. But IE is evil.)
Work with Nav bar? Yes.
Work with Ads? Yes. (Vertical preferred.)
Credit: faithwood
Preview:
[Live Preview]
(Also, a similar layout @ my LJ.)
Code:
/* Stylesheet by Faith Wood -- http://faithwood.livejournal.com */
body {
background-color: #AFB3FA;
color: #333333;
font-family: "Verdana", sans-serif;
font-size: 14px;
text-align: center;
margin: 0px 0px 0px 0px;
line-height: 150%;
margin-top: 0px !important;
background-image: url(http://pics.livejournal.com/rubylehane/pic/00001ap8);
background-repeat: repeat-y;
background-position: top left;
}
a, a:link, a:visited {
font-weight: bold;
color: #767AD3;
text-decoration: none;
font-family: "Verdana";
}
a:hover {
color: #4349AF;
font-weight: bold;
text-decoration: none;
font-family: "Verdana";
}
p, td, blockquote {
font-size: 14px;
}
code, kbd, pre, tt {
font-family: monospace;
}
font {line-height: normal;}
span {line-height: normal;}
#content {
background-color: transparent;
color: #000000;
width: 100%;
margin: 0px auto;
padding: 0px;
border: 0px;
background-image: url(http://pics.livejournal.com/rubylehane/pic/00002zdf);
background-repeat: no-repeat;
background-position: top right;
}
#maincontent {
color: #8C8D9C;
text-align: left;
font-family: "Verdana", sans-serif;
font-size: 14px;
background-color: #ffffff;
border: 0px solid #000000;
margin: 0px;
margin-right: 300px;
margin-left: 200px;
padding-top: 0px;
padding-right: 15px;
background-image: url(http://pics.livejournal.com/rubylehane/pic/00003b0t);
background-repeat: repeat-y;
background-position: top right;
}
#sidebar {
width: 240px;
color: #000000;
float: right;
clear: both;
padding: 0px !important;
position: relative;
top: 490px;
text-align: left !important;
border: 0px;
background-color: transparent;
margin-right: 20px;
margin-left: 20px;
font-size: 12px;
font-family: "Verdana", sans-serif;
}
#header {
padding: 0px;
margin: 0px;
border: 0px solid #000000;
height: 120px;
width: 100%;
padding-top: 0px;
text-align: center;
font-family: "Georgia", sans-serif;
font-size: 14px;
font-weight: bold;
letter-spacing: 2px;
overflow: visible;
color: #000000;
background-color: #AFB3FA;
background-image: url(http://pics.livejournal.com/rubylehane/pic/00004cdh);
background-position: top left;
background-repeat: repeat-x;
}
#footer {
color: #333333;
border: 0px;
height: 100px;
background-color: transparent;
margin-bottom: -20px;
margin-top: -20px;
margin-right: 0px;
margin-left: 0px;
text-align: center;
padding: 20px;
font-family: "Verdana", sans-serif;
font-size: 14px;
font-weight: bold;
letter-spacing: 1px;
z-index: 100;
clear: both;
}
div#header a, div#header a:link, div#header a:visited {
text-decoration: none;
color: #4349AF;
}
div#header a:hover {
text-decoration: none;
color: #000000;
}
div#footer a, div#footer a:link, div#footer a:visited {
color: #4349AF;
}
div#footer a:hover {
color: #000000;
font-family: "Verdana";
}
.title {
display: none;
}
.subtitle{
width: 800px;
float: center;
position: relative;
top: 40px;
text-align: center;
color: #4349AF;
font-weight: bold;
margin: 0 auto;
font-family: "papyrus";
font-size: 18px;
border: 0px;
line-height: 150%;
font-weight: bold;
background: url(http://pics.livejournal.com/rubylehane/pic/00004cdh) repeat-x
bottom left;
padding-bottom: 10px;
}
.navheader {
position: relative;
right: 20px;
top: 120px;
width: 240px;
font-weight: bold;
text-align: center !important;
color: #333333;
letter-spacing: 1px;
float: right;
clear: both;
border: 0px solid #000000;
font-family: "Verdana";
background-color: transparent;
}
ul.navheader li {
display: block;
background-color: #ffffff;
margin: 0px;
padding: 0px 0px;
height: 36px;
width: 240px;
background: url(http://pics.livejournal.com/rubylehane/pic/00004cdh) repeat-x
bottom left;
border: 0px solid #000000;
}
ul.navheader li a, ul.navheader li a:visited{
display: block;
margin: 0px;
padding: 0px 0px;
background-color: #ffffff;
height: 36px;
width: 240px;
background: url(http://pics.livejournal.com/rubylehane/pic/00004cdh) repeat-x
bottom left;
color: #4349AF;}
ul.navheader li a:hover{
background-color: #000000;
height: 36px;
width: 240px;
background: url(http://pics.livejournal.com/rubylehane/pic/00004cdh) repeat-x
bottom right;
color: #000000;}
ul.navheader {
padding: 0px;
padding: 0px;
}
.defaultuserpic {
display: none;
}
div#sidebar a, div#sidebar a:link, div#sidebar a:visited {
color: #4349AF;
text-align: left !important;
}
div#sidebar a:hover{
color: #000000;
text-align: left !important;
}
.sbarheader {
padding: 0px 5px 0px 5px;
}
.sbarbody {
padding: 0px;
margin-top: 40px;
margin-bottom: 0px;
margin-right: 0px;
background-color: transparent;
border: 0px solid #000000;
}
.sbarbody2 {
padding: 0px;
padding-left: 10px;
margin-top: 0px;
margin-bottom: 0px;
background-color: transparent;
margin-right: 0px;
border: 0px solid #000000;
}
ul.sbarlist{
padding-left: 0px;
margin-left: 0px;
list-style: none;
}
.tagcloud{
padding-left: 15px;
list-style: none;
}
li.sbaritem {
width: 220px;
padding-left: 15px;
margin-left: -10px;
}
li.sbaritem a, li.sbaritem a:link, li.sbaritem a:visited{
display: block;
margin: 0px;
padding: 0px 0px;
height: 30px;
background: url(http://pics.livejournal.com/rubylehane/pic/00004cdh) repeat-x
bottom left;
border: 0px solid #000000;
color: #4349AF;
line-height: normal;
padding-top:5px;
}
li.sbaritem a:hover{
margin: 0px;
padding: 0px 0px;
height: 30px;
background: url(http://pics.livejournal.com/rubylehane/pic/00004cdh) repeat-x
bottom right;
border: 0px solid #000000;
color: #000000;
line-height: normal;
padding-top:5px;
}
#sidebar_summary {
margin: 0px;
padding: 0px 0px;
margin-left: 0px;
margin-right: 0px;
color: #000000;
margin-left: -5px;
}
#sidebar_summary ul.sbaritem {
display: block;
background: transparent;
color: #000000;
}
#sidebar_summary li.sbaritem {
margin: 0 10px;
padding: 10px 0px;
border-bottom: 0px #000000 solid;
background: url(http://pics.livejournal.com/rubylehane/pic/00004cdh) repeat-x
bottom left;
}
#sidebar_summary li.sbaritem a, #sidebar_summary li.sbaritem a:visited{
display: inline;
margin: 0 0px;
padding: 0px 0;
background: transparent;
border: 0px;
height: 100%;
width: 220px;
color: #4349AF;
}
#sidebar_summary li.sbaritem a:hover{
margin: 0 0px;
padding: 0px 0;
background: transparent;
border: 0px;
height: 100%;
width: 220px;
color: #000000;
}
table.calendar {
margin-right: auto;
margin-left: auto;
}
.sbarcalendar {
border: 0px;
text-align: center;
font-family: "Verdana", sans-serif;
font-size: 14px;
}
.sbarcalendarposts {
text-align: center;
font-family: "Verdana", sans-serif;
font-size: 14px;
color: #4349AF;
border: 1px solid #000000;
background-color: #CDCFFB;
}
li.sbartitle {
list-style: none;
color: #333333;
font-weight: bold;
font-family: "papyrus";
font-size: 20px;
text-align: left !important;
background-color: transparent;
border: 0px;
margin-bottom: 10px;
margin-top: 10px;
margin-left: 20px;
margin-right: 20px;
padding: 10px;
}
.subcontent {
}
.subcontent a, .subcontent a:link, .subcontent a:visited {
color: #767AD3;
}
.subcontent a:hover {
color: #4349AF;
}
.entry {
text-align: left !important;
font-family: "Verdana", sans-serif;
font-size: 14px;
background-color: #ffffff !important;
color: #000000;
border: 0px solid #000000;
padding: 20px 20px;
margin: 0px 0px 0px 0px;
padding-left: 40px;
padding-top: 40px;
}
.entry ul li{
padding-left: 5px;
margin-left: 15px;
}
.entry ol li{
padding-left: 5px;
margin-left: 15px;
}
.userpic {
position: absolute;
float: left;
border: 1px solid #000000;
padding: 10px;
background: url(http://pics.livejournal.com/rubylehane/pic/00005ea2) repeat
top left;
margin: 10px;
margin-top: 0px;
margin-left: -185px !important;
z-index: 15;
}
.userpic img {
border: 0px;
padding: 0px;
background: #ffffff !important;
background-color: #ffffff !important;
}
.userpicfriends {
position: absolute;
float: left;
border: 1px solid #000000;
padding: 10px;
background: url(http://pics.livejournal.com/rubylehane/pic/00005ea2) repeat
top left;
font-family: "Verdana", sans-serif;
font-size: 14px;
margin: 10px;
margin-top: 0px;
margin-left: -185px !important;
text-align: center;
z-index: 15;
}
.userpicfriends img {
border: 0px;
padding: 0px;
background: #ffffff !important;
background-color: #ffffff !important;
}
.userpic font a {
color: #4349AF;
}
.userpicfriends font a{
color: #4349AF;
}
.userpic font {
color: #4349AF;
}
.userpicfriends font {
color: #4349AF;
}
.datesubject {
background-color: transparent;
border: 0px solid #000000;
text-align: center;
padding: 10px;
background-color: #ffffff;
margin-top: 0px;
font-family: "Georgia", sans-serif;
font-weight: bold;
font-size: 18px;
background-image: url(http://pics.livejournal.com/rubylehane/pic/000069fb);
background-position: top left;
background-repeat: repeat-x;
color: #4349AF;
}
.subject {
padding: 10px;
border: 0px;
background-color: transparent;
padding-left: 35px;
}
.date {
line-height: 200%;
top: 5px;
text-align: right;
padding-left: 10px;
color: #9FA3F8;
font-size: 14px;
}
.subject a, .subject a:link, .subject a:visited{
font-family: "Georgia", sans-serif;
font-weight: bold;
font-size: 18px;
}
.subject a:hover {
font-family: "Georgia", sans-serif;
font-weight: bold;
font-size: 18px;
}
.skiplinks {
color: #ffffff;
text-align: center;
}
.skiplinks a, .skiplinks a:link, .skiplinks a:visited{
padding: 6px;
color: #4349AF;
border: 1px solid #000000;
background-color: #CDCFFB;
}
.skiplinks a:hover{
padding: 6px;
color: #4349AF;
border: 1px solid #000000;
background-color: #AFB3FA;
}
.currents {
padding-top: 5px;
margin-top: -15px;
padding-bottom: 5px;
margin-right: -20px;
margin-left: -20px;
margin-bottom: -15px;
font-family: "papyrus";
}
.currents, .currentmood, .currentmusic {
font-size: 14px;
background-color: #ffffff;
}
.ljtags {
padding-top: 10px;
margin-bottom: -15px;
margin-right: -20px;
margin-left: -20px;
font-family: "papyrus";
font-size: 14px;
font-weight: bold;
background-color: #ffffff;
border-top: 0px solid #000000;
}
.ljtags a:link, .ljtags a:visited {
padding: 2px 6px;
line-height: 200%;
color: #4349AF;
border: 1px solid #000000;
background-color: #CDCFFB;
font-size: 12px;
font-family: "Georgia", sans-serif;
}
.ljtags a:hover, .ljtags a:active {
padding: 2px 6px;
line-height: 200%;
color: #4349AF;
border: 1px solid #000000;
background-color: #AFB3FA;
font-size: 12px;
font-family: "Georgia", sans-serif;
}
.comments {
font-family: "Georgia", sans-serif;
font-size: 14px;
border: 0px solid #000000;
text-align: center;
background-color: transparent;
position: relative;
top: 0px;
margin-right: -20px;
margin-left: -40px;
margin-top: 0px;
margin-bottom: -42px;
color: #ffffff;
padding: 0px 20px 0px 20px;
background-color: #ffffff;
height: 100px;
background-image: url(http://pics.livejournal.com/rubylehane/pic/000070tp);
background-position: bottom left;
background-repeat: repeat-x;
}
div.comments a, div.comments a:link, div.comments a:visited{
padding: 6px;
color: #4349AF;
border: 1px solid #000000;
text-decoration: none;
background-color: #CDCFFB;
position: relative;
top: 30px;
}
div.comments a:hover{
padding: 6px;
color: #4349AF;
border: 1px solid #000000;
text-decoration: none;
background-color: #AFB3FA;
position: relative;
top: 30px;
}
.datesubjectcomment {
background-color: #AFB3FA;
color: #000000;
padding: 10px;
margin-top: 20px;
background-image: url(http://pics.livejournal.com/rubylehane/pic/00004cdh);
background-position: bottom left;
background-repeat: repeat-x;
font-family: "papyrus";
font-size: 14px;
}
.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #4349AF;
text-align: left;
border: 0px;
padding: 0px;
}
.datesubjectcomment a:hover {
color: #767AD3;
text-align: left;
border: 0px;
padding: 0px;
}
.userpiccomment {
float: left;
border: 1px solid #000000;
padding: 10px;
position: relative;
top: -30px;
left: 0px;
margin: 10px;
z-index: 15;
background: #CDCFFB;
}
.userpiccomment img {
border: 0px;
padding: 0px;
background: #ffffff !important;
background-color: #ffffff !important;
}
.box {
color: #000000;
background-color: #ffffff;
border: 0px;
padding: 10px;
clear: left;
}
.box a, .box a:link, .box a:visited{
color: #767AD3;
}
.box a:hover {
color: #4349AF;
}
.reply {
position: relative;
margin: 20px 30px 10px 30px;
padding: 25px 10px 10px 10px;
text-align: left;
font-family: "Verdana", sans-serif;
font-size: 14px;
line-height: 125%;
color: #000000;
background-color: transparent;
}
.commentreply {
position: relative;
margin: 0px;
font-size: 14px;
font-family: "Verdana", sans-serif;
color: #000000;
background-color: #ffffff;
margin-top: 0px;
padding: 20px;
background-image: url(http://pics.livejournal.com/rubylehane/pic/00004cdh);
background-position: bottom left;
background-repeat: repeat-x;
}
input {
color: #4349AF;
background-color: #CDCFFB;
border: 1px solid #000000;
}
textarea {
color: #000000;
background-color: #ffffff;
}
textarea.textbox {
width: 95% !important;
}
.replytosubject {
background-color: transparent;
font-weight: bold;
}
.commentbox {
padding: 10px 25px;
min-height: 150px;
margin: 10px;
background-color: #AFB3FA;
color: #000000;
text-align: left;
border: 0px;
border-bottom: 1px solid #000000;
background-image: url(http://pics.livejournal.com/rubylehane/pic/000070tp);
background-position: top left;
background-repeat: repeat-x;
}
.commentbox a:link, .commentbox a:visited {
color: #4349AF;
text-align: left;
}
.commentbox a:hover {
color: #767AD3;
text-align: left;
}
.commentboxpartial {
background-color: #AFB3FA;
color: #000000;
text-align: left;
border: 1px solid #000000;
padding: 10px;
margin: 10px;
}
.commentboxpartial a, .commentboxpartial a:link, .commentboxpartial
a:visited{
color: #4349AF;
}
.commentboxpartial a:hover {
color: #767AD3;
}
.commentinfo {
background-color: #ffffff;
margin-top: 10px;
width: 100%;
}
div.box#commentform {
position: absolute;
border-width: 1px;
border-style: solid;
border-color: #ffffff;
background-color: #ffffff;
color: #000000;
text-align: left;
}
div.subcontent {
margin: 0px;
padding: 0px;
height: 1%;
clear: none;
}
small {
font-size: 9px;
}
.separator{
height: 90px;
border: 0px solid #000000;
margin-top: 0px;
margin-left: 0px;
margin-right: 0px;
margin-bottom: -20px;
background-color: #AFB3FA;
background-image: url(http://pics.livejournal.com/rubylehane/pic/00008q82);
background-position: bottom center;
background-repeat: repeat-x;
}
blockquote {
padding: 25px;
padding-left: 15px;
padding-right: 15px;
border-bottom: 1px solid #AFB3FA;
color:#000000;
margin: 10px 40px;
background-color: #D6D9FF;
background-image: url(http://pics.livejournal.com/rubylehane/pic/000091w4);
background-position: top center;
background-repeat: repeat-x;
}
ul.navfooter{
padding: 0px;
margin: 0px;
}
ul.navfooter li {
display: inline;
margin: 0 5px 0 5px;
}
.clearfoot {
clear: both;
}
ul.year {
text-align: center;
padding-bottom: 40px;
}
ul.year li {
display: inline;
}
table.yeartable {
margin-left: auto;
margin-right: auto;
background-color: #AFB3FA;
border: 0px;
border-bottom: 1px solid #000000;
background-image: url(http://pics.livejournal.com/rubylehane/pic/000070tp);
background-position: top left;
background-repeat: repeat-x;
color: #000000;
padding: 20px;
height: 300px;
}
table.yeartable td.yearmonth {
padding: 20px;
font-family: "papyrus";
font-size: 20px;
font-weight: bold;
}
table.yeartable td.yeardate {
border: 0px;
}
table.yeartable a, table.yeartable a:link, table.yeartable a:visited{
padding: 4px;
font-size: 14px;
color: #4349AF;
border: 1px solid #000000;
background-color: #CDCFFB;
}
table.yeartable a:hover {
padding: 4px;
font-size: 14px;
color: #4349AF;
border: 1px solid #000000;
background-color: #AFB3FA;
}
table.yeartable td.yearday {
text-align: center;
font-family: "Georgia";
background-color: transparent;
font-weight: bold;
text-transform: uppercase;
border: 0px;
border-bottom: 2px solid #000000;
}
.clear {
height: 15px;
}
.headerimage {
margin: 0 auto;
background-color: #D4FCDA;
background-image: url(http://pics.livejournal.com/rubylehane/pic/0000atqy);
background-repeat: repeat;
background-position: top center;
width: 100%;
height: 339px;
}
#lj_controlstrip {
background: #AFB3FA;
border-top: 0px;
border-bottom: 0px solid #000000;
background-image: url(http://pics.livejournal.com/rubylehane/pic/00004cdh);
background-position: bottom left;
background-repeat: repeat-x;
}
Instructions:
1. Please upload these images to your own scrapbook or wherever and then find&replace the urls.
http://pics.livejournal.com/rubylehane/pic/00001ap8
http://pics.livejournal.com/rubylehane/pic/00002zdf
http://pics.livejournal.com/rubylehane/pic/00003b0t
http://pics.livejournal.com/rubylehane/pic/00004cdh
http://pics.livejournal.com/rubylehane/pic/00005ea2
http://pics.livejournal.com/rubylehane/pic/000069fb
http://pics.livejournal.com/rubylehane/pic/000070tp
http://pics.livejournal.com/rubylehane/pic/00008q82
http://pics.livejournal.com/rubylehane/pic/000091w4
http://pics.livejournal.com/rubylehane/pic/0000atqy
2. Go to Select Journal Style and type Flexible Squares into the Search box.
3. Select any Flexible Squares theme.
4. Click Customize Journal Style and then Custom CSS and select "No" for every option.
6. Paste the code above into the Custom stylesheet box.
7. Save changes.
If there are any bugs, please let me now, though, I'm not sure whether I'll be able to fix them. Also, you can easily replace the headerimage (the last link in the list). If you're css-savy, edit the code to your heart's desire. Credit/no credit, whatevs.
Mods? ♥ Layout tag, y/y? *\o/*
Layout Style: Flexible Squares
Best view: 1024×768 +
Browser(s) Compatible: Tested in Firefox, IE 7 and Opera (I was told it doesn't look so hot in some versions of IE. But IE is evil.)
Work with Nav bar? Yes.
Work with Ads? Yes. (Vertical preferred.)
Credit: faithwood
Preview:
[Live Preview]
(Also, a similar layout @ my LJ.)
Code:
/* Stylesheet by Faith Wood -- http://faithwood.livejournal.com */
body {
background-color: #AFB3FA;
color: #333333;
font-family: "Verdana", sans-serif;
font-size: 14px;
text-align: center;
margin: 0px 0px 0px 0px;
line-height: 150%;
margin-top: 0px !important;
background-image: url(http://pics.livejournal.com/rubylehane/pic/00001ap8);
background-repeat: repeat-y;
background-position: top left;
}
a, a:link, a:visited {
font-weight: bold;
color: #767AD3;
text-decoration: none;
font-family: "Verdana";
}
a:hover {
color: #4349AF;
font-weight: bold;
text-decoration: none;
font-family: "Verdana";
}
p, td, blockquote {
font-size: 14px;
}
code, kbd, pre, tt {
font-family: monospace;
}
font {line-height: normal;}
span {line-height: normal;}
#content {
background-color: transparent;
color: #000000;
width: 100%;
margin: 0px auto;
padding: 0px;
border: 0px;
background-image: url(http://pics.livejournal.com/rubylehane/pic/00002zdf);
background-repeat: no-repeat;
background-position: top right;
}
#maincontent {
color: #8C8D9C;
text-align: left;
font-family: "Verdana", sans-serif;
font-size: 14px;
background-color: #ffffff;
border: 0px solid #000000;
margin: 0px;
margin-right: 300px;
margin-left: 200px;
padding-top: 0px;
padding-right: 15px;
background-image: url(http://pics.livejournal.com/rubylehane/pic/00003b0t);
background-repeat: repeat-y;
background-position: top right;
}
#sidebar {
width: 240px;
color: #000000;
float: right;
clear: both;
padding: 0px !important;
position: relative;
top: 490px;
text-align: left !important;
border: 0px;
background-color: transparent;
margin-right: 20px;
margin-left: 20px;
font-size: 12px;
font-family: "Verdana", sans-serif;
}
#header {
padding: 0px;
margin: 0px;
border: 0px solid #000000;
height: 120px;
width: 100%;
padding-top: 0px;
text-align: center;
font-family: "Georgia", sans-serif;
font-size: 14px;
font-weight: bold;
letter-spacing: 2px;
overflow: visible;
color: #000000;
background-color: #AFB3FA;
background-image: url(http://pics.livejournal.com/rubylehane/pic/00004cdh);
background-position: top left;
background-repeat: repeat-x;
}
#footer {
color: #333333;
border: 0px;
height: 100px;
background-color: transparent;
margin-bottom: -20px;
margin-top: -20px;
margin-right: 0px;
margin-left: 0px;
text-align: center;
padding: 20px;
font-family: "Verdana", sans-serif;
font-size: 14px;
font-weight: bold;
letter-spacing: 1px;
z-index: 100;
clear: both;
}
div#header a, div#header a:link, div#header a:visited {
text-decoration: none;
color: #4349AF;
}
div#header a:hover {
text-decoration: none;
color: #000000;
}
div#footer a, div#footer a:link, div#footer a:visited {
color: #4349AF;
}
div#footer a:hover {
color: #000000;
font-family: "Verdana";
}
.title {
display: none;
}
.subtitle{
width: 800px;
float: center;
position: relative;
top: 40px;
text-align: center;
color: #4349AF;
font-weight: bold;
margin: 0 auto;
font-family: "papyrus";
font-size: 18px;
border: 0px;
line-height: 150%;
font-weight: bold;
background: url(http://pics.livejournal.com/rubylehane/pic/00004cdh) repeat-x
bottom left;
padding-bottom: 10px;
}
.navheader {
position: relative;
right: 20px;
top: 120px;
width: 240px;
font-weight: bold;
text-align: center !important;
color: #333333;
letter-spacing: 1px;
float: right;
clear: both;
border: 0px solid #000000;
font-family: "Verdana";
background-color: transparent;
}
ul.navheader li {
display: block;
background-color: #ffffff;
margin: 0px;
padding: 0px 0px;
height: 36px;
width: 240px;
background: url(http://pics.livejournal.com/rubylehane/pic/00004cdh) repeat-x
bottom left;
border: 0px solid #000000;
}
ul.navheader li a, ul.navheader li a:visited{
display: block;
margin: 0px;
padding: 0px 0px;
background-color: #ffffff;
height: 36px;
width: 240px;
background: url(http://pics.livejournal.com/rubylehane/pic/00004cdh) repeat-x
bottom left;
color: #4349AF;}
ul.navheader li a:hover{
background-color: #000000;
height: 36px;
width: 240px;
background: url(http://pics.livejournal.com/rubylehane/pic/00004cdh) repeat-x
bottom right;
color: #000000;}
ul.navheader {
padding: 0px;
padding: 0px;
}
.defaultuserpic {
display: none;
}
div#sidebar a, div#sidebar a:link, div#sidebar a:visited {
color: #4349AF;
text-align: left !important;
}
div#sidebar a:hover{
color: #000000;
text-align: left !important;
}
.sbarheader {
padding: 0px 5px 0px 5px;
}
.sbarbody {
padding: 0px;
margin-top: 40px;
margin-bottom: 0px;
margin-right: 0px;
background-color: transparent;
border: 0px solid #000000;
}
.sbarbody2 {
padding: 0px;
padding-left: 10px;
margin-top: 0px;
margin-bottom: 0px;
background-color: transparent;
margin-right: 0px;
border: 0px solid #000000;
}
ul.sbarlist{
padding-left: 0px;
margin-left: 0px;
list-style: none;
}
.tagcloud{
padding-left: 15px;
list-style: none;
}
li.sbaritem {
width: 220px;
padding-left: 15px;
margin-left: -10px;
}
li.sbaritem a, li.sbaritem a:link, li.sbaritem a:visited{
display: block;
margin: 0px;
padding: 0px 0px;
height: 30px;
background: url(http://pics.livejournal.com/rubylehane/pic/00004cdh) repeat-x
bottom left;
border: 0px solid #000000;
color: #4349AF;
line-height: normal;
padding-top:5px;
}
li.sbaritem a:hover{
margin: 0px;
padding: 0px 0px;
height: 30px;
background: url(http://pics.livejournal.com/rubylehane/pic/00004cdh) repeat-x
bottom right;
border: 0px solid #000000;
color: #000000;
line-height: normal;
padding-top:5px;
}
#sidebar_summary {
margin: 0px;
padding: 0px 0px;
margin-left: 0px;
margin-right: 0px;
color: #000000;
margin-left: -5px;
}
#sidebar_summary ul.sbaritem {
display: block;
background: transparent;
color: #000000;
}
#sidebar_summary li.sbaritem {
margin: 0 10px;
padding: 10px 0px;
border-bottom: 0px #000000 solid;
background: url(http://pics.livejournal.com/rubylehane/pic/00004cdh) repeat-x
bottom left;
}
#sidebar_summary li.sbaritem a, #sidebar_summary li.sbaritem a:visited{
display: inline;
margin: 0 0px;
padding: 0px 0;
background: transparent;
border: 0px;
height: 100%;
width: 220px;
color: #4349AF;
}
#sidebar_summary li.sbaritem a:hover{
margin: 0 0px;
padding: 0px 0;
background: transparent;
border: 0px;
height: 100%;
width: 220px;
color: #000000;
}
table.calendar {
margin-right: auto;
margin-left: auto;
}
.sbarcalendar {
border: 0px;
text-align: center;
font-family: "Verdana", sans-serif;
font-size: 14px;
}
.sbarcalendarposts {
text-align: center;
font-family: "Verdana", sans-serif;
font-size: 14px;
color: #4349AF;
border: 1px solid #000000;
background-color: #CDCFFB;
}
li.sbartitle {
list-style: none;
color: #333333;
font-weight: bold;
font-family: "papyrus";
font-size: 20px;
text-align: left !important;
background-color: transparent;
border: 0px;
margin-bottom: 10px;
margin-top: 10px;
margin-left: 20px;
margin-right: 20px;
padding: 10px;
}
.subcontent {
}
.subcontent a, .subcontent a:link, .subcontent a:visited {
color: #767AD3;
}
.subcontent a:hover {
color: #4349AF;
}
.entry {
text-align: left !important;
font-family: "Verdana", sans-serif;
font-size: 14px;
background-color: #ffffff !important;
color: #000000;
border: 0px solid #000000;
padding: 20px 20px;
margin: 0px 0px 0px 0px;
padding-left: 40px;
padding-top: 40px;
}
.entry ul li{
padding-left: 5px;
margin-left: 15px;
}
.entry ol li{
padding-left: 5px;
margin-left: 15px;
}
.userpic {
position: absolute;
float: left;
border: 1px solid #000000;
padding: 10px;
background: url(http://pics.livejournal.com/rubylehane/pic/00005ea2) repeat
top left;
margin: 10px;
margin-top: 0px;
margin-left: -185px !important;
z-index: 15;
}
.userpic img {
border: 0px;
padding: 0px;
background: #ffffff !important;
background-color: #ffffff !important;
}
.userpicfriends {
position: absolute;
float: left;
border: 1px solid #000000;
padding: 10px;
background: url(http://pics.livejournal.com/rubylehane/pic/00005ea2) repeat
top left;
font-family: "Verdana", sans-serif;
font-size: 14px;
margin: 10px;
margin-top: 0px;
margin-left: -185px !important;
text-align: center;
z-index: 15;
}
.userpicfriends img {
border: 0px;
padding: 0px;
background: #ffffff !important;
background-color: #ffffff !important;
}
.userpic font a {
color: #4349AF;
}
.userpicfriends font a{
color: #4349AF;
}
.userpic font {
color: #4349AF;
}
.userpicfriends font {
color: #4349AF;
}
.datesubject {
background-color: transparent;
border: 0px solid #000000;
text-align: center;
padding: 10px;
background-color: #ffffff;
margin-top: 0px;
font-family: "Georgia", sans-serif;
font-weight: bold;
font-size: 18px;
background-image: url(http://pics.livejournal.com/rubylehane/pic/000069fb);
background-position: top left;
background-repeat: repeat-x;
color: #4349AF;
}
.subject {
padding: 10px;
border: 0px;
background-color: transparent;
padding-left: 35px;
}
.date {
line-height: 200%;
top: 5px;
text-align: right;
padding-left: 10px;
color: #9FA3F8;
font-size: 14px;
}
.subject a, .subject a:link, .subject a:visited{
font-family: "Georgia", sans-serif;
font-weight: bold;
font-size: 18px;
}
.subject a:hover {
font-family: "Georgia", sans-serif;
font-weight: bold;
font-size: 18px;
}
.skiplinks {
color: #ffffff;
text-align: center;
}
.skiplinks a, .skiplinks a:link, .skiplinks a:visited{
padding: 6px;
color: #4349AF;
border: 1px solid #000000;
background-color: #CDCFFB;
}
.skiplinks a:hover{
padding: 6px;
color: #4349AF;
border: 1px solid #000000;
background-color: #AFB3FA;
}
.currents {
padding-top: 5px;
margin-top: -15px;
padding-bottom: 5px;
margin-right: -20px;
margin-left: -20px;
margin-bottom: -15px;
font-family: "papyrus";
}
.currents, .currentmood, .currentmusic {
font-size: 14px;
background-color: #ffffff;
}
.ljtags {
padding-top: 10px;
margin-bottom: -15px;
margin-right: -20px;
margin-left: -20px;
font-family: "papyrus";
font-size: 14px;
font-weight: bold;
background-color: #ffffff;
border-top: 0px solid #000000;
}
.ljtags a:link, .ljtags a:visited {
padding: 2px 6px;
line-height: 200%;
color: #4349AF;
border: 1px solid #000000;
background-color: #CDCFFB;
font-size: 12px;
font-family: "Georgia", sans-serif;
}
.ljtags a:hover, .ljtags a:active {
padding: 2px 6px;
line-height: 200%;
color: #4349AF;
border: 1px solid #000000;
background-color: #AFB3FA;
font-size: 12px;
font-family: "Georgia", sans-serif;
}
.comments {
font-family: "Georgia", sans-serif;
font-size: 14px;
border: 0px solid #000000;
text-align: center;
background-color: transparent;
position: relative;
top: 0px;
margin-right: -20px;
margin-left: -40px;
margin-top: 0px;
margin-bottom: -42px;
color: #ffffff;
padding: 0px 20px 0px 20px;
background-color: #ffffff;
height: 100px;
background-image: url(http://pics.livejournal.com/rubylehane/pic/000070tp);
background-position: bottom left;
background-repeat: repeat-x;
}
div.comments a, div.comments a:link, div.comments a:visited{
padding: 6px;
color: #4349AF;
border: 1px solid #000000;
text-decoration: none;
background-color: #CDCFFB;
position: relative;
top: 30px;
}
div.comments a:hover{
padding: 6px;
color: #4349AF;
border: 1px solid #000000;
text-decoration: none;
background-color: #AFB3FA;
position: relative;
top: 30px;
}
.datesubjectcomment {
background-color: #AFB3FA;
color: #000000;
padding: 10px;
margin-top: 20px;
background-image: url(http://pics.livejournal.com/rubylehane/pic/00004cdh);
background-position: bottom left;
background-repeat: repeat-x;
font-family: "papyrus";
font-size: 14px;
}
.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #4349AF;
text-align: left;
border: 0px;
padding: 0px;
}
.datesubjectcomment a:hover {
color: #767AD3;
text-align: left;
border: 0px;
padding: 0px;
}
.userpiccomment {
float: left;
border: 1px solid #000000;
padding: 10px;
position: relative;
top: -30px;
left: 0px;
margin: 10px;
z-index: 15;
background: #CDCFFB;
}
.userpiccomment img {
border: 0px;
padding: 0px;
background: #ffffff !important;
background-color: #ffffff !important;
}
.box {
color: #000000;
background-color: #ffffff;
border: 0px;
padding: 10px;
clear: left;
}
.box a, .box a:link, .box a:visited{
color: #767AD3;
}
.box a:hover {
color: #4349AF;
}
.reply {
position: relative;
margin: 20px 30px 10px 30px;
padding: 25px 10px 10px 10px;
text-align: left;
font-family: "Verdana", sans-serif;
font-size: 14px;
line-height: 125%;
color: #000000;
background-color: transparent;
}
.commentreply {
position: relative;
margin: 0px;
font-size: 14px;
font-family: "Verdana", sans-serif;
color: #000000;
background-color: #ffffff;
margin-top: 0px;
padding: 20px;
background-image: url(http://pics.livejournal.com/rubylehane/pic/00004cdh);
background-position: bottom left;
background-repeat: repeat-x;
}
input {
color: #4349AF;
background-color: #CDCFFB;
border: 1px solid #000000;
}
textarea {
color: #000000;
background-color: #ffffff;
}
textarea.textbox {
width: 95% !important;
}
.replytosubject {
background-color: transparent;
font-weight: bold;
}
.commentbox {
padding: 10px 25px;
min-height: 150px;
margin: 10px;
background-color: #AFB3FA;
color: #000000;
text-align: left;
border: 0px;
border-bottom: 1px solid #000000;
background-image: url(http://pics.livejournal.com/rubylehane/pic/000070tp);
background-position: top left;
background-repeat: repeat-x;
}
.commentbox a:link, .commentbox a:visited {
color: #4349AF;
text-align: left;
}
.commentbox a:hover {
color: #767AD3;
text-align: left;
}
.commentboxpartial {
background-color: #AFB3FA;
color: #000000;
text-align: left;
border: 1px solid #000000;
padding: 10px;
margin: 10px;
}
.commentboxpartial a, .commentboxpartial a:link, .commentboxpartial
a:visited{
color: #4349AF;
}
.commentboxpartial a:hover {
color: #767AD3;
}
.commentinfo {
background-color: #ffffff;
margin-top: 10px;
width: 100%;
}
div.box#commentform {
position: absolute;
border-width: 1px;
border-style: solid;
border-color: #ffffff;
background-color: #ffffff;
color: #000000;
text-align: left;
}
div.subcontent {
margin: 0px;
padding: 0px;
height: 1%;
clear: none;
}
small {
font-size: 9px;
}
.separator{
height: 90px;
border: 0px solid #000000;
margin-top: 0px;
margin-left: 0px;
margin-right: 0px;
margin-bottom: -20px;
background-color: #AFB3FA;
background-image: url(http://pics.livejournal.com/rubylehane/pic/00008q82);
background-position: bottom center;
background-repeat: repeat-x;
}
blockquote {
padding: 25px;
padding-left: 15px;
padding-right: 15px;
border-bottom: 1px solid #AFB3FA;
color:#000000;
margin: 10px 40px;
background-color: #D6D9FF;
background-image: url(http://pics.livejournal.com/rubylehane/pic/000091w4);
background-position: top center;
background-repeat: repeat-x;
}
ul.navfooter{
padding: 0px;
margin: 0px;
}
ul.navfooter li {
display: inline;
margin: 0 5px 0 5px;
}
.clearfoot {
clear: both;
}
ul.year {
text-align: center;
padding-bottom: 40px;
}
ul.year li {
display: inline;
}
table.yeartable {
margin-left: auto;
margin-right: auto;
background-color: #AFB3FA;
border: 0px;
border-bottom: 1px solid #000000;
background-image: url(http://pics.livejournal.com/rubylehane/pic/000070tp);
background-position: top left;
background-repeat: repeat-x;
color: #000000;
padding: 20px;
height: 300px;
}
table.yeartable td.yearmonth {
padding: 20px;
font-family: "papyrus";
font-size: 20px;
font-weight: bold;
}
table.yeartable td.yeardate {
border: 0px;
}
table.yeartable a, table.yeartable a:link, table.yeartable a:visited{
padding: 4px;
font-size: 14px;
color: #4349AF;
border: 1px solid #000000;
background-color: #CDCFFB;
}
table.yeartable a:hover {
padding: 4px;
font-size: 14px;
color: #4349AF;
border: 1px solid #000000;
background-color: #AFB3FA;
}
table.yeartable td.yearday {
text-align: center;
font-family: "Georgia";
background-color: transparent;
font-weight: bold;
text-transform: uppercase;
border: 0px;
border-bottom: 2px solid #000000;
}
.clear {
height: 15px;
}
.headerimage {
margin: 0 auto;
background-color: #D4FCDA;
background-image: url(http://pics.livejournal.com/rubylehane/pic/0000atqy);
background-repeat: repeat;
background-position: top center;
width: 100%;
height: 339px;
}
#lj_controlstrip {
background: #AFB3FA;
border-top: 0px;
border-bottom: 0px solid #000000;
background-image: url(http://pics.livejournal.com/rubylehane/pic/00004cdh);
background-position: bottom left;
background-repeat: repeat-x;
}
Instructions:
1. Please upload these images to your own scrapbook or wherever and then find&replace the urls.
http://pics.livejournal.com/rubylehane/pic/00001ap8
http://pics.livejournal.com/rubylehane/pic/00002zdf
http://pics.livejournal.com/rubylehane/pic/00003b0t
http://pics.livejournal.com/rubylehane/pic/00004cdh
http://pics.livejournal.com/rubylehane/pic/00005ea2
http://pics.livejournal.com/rubylehane/pic/000069fb
http://pics.livejournal.com/rubylehane/pic/000070tp
http://pics.livejournal.com/rubylehane/pic/00008q82
http://pics.livejournal.com/rubylehane/pic/000091w4
http://pics.livejournal.com/rubylehane/pic/0000atqy
2. Go to Select Journal Style and type Flexible Squares into the Search box.
3. Select any Flexible Squares theme.
4. Click Customize Journal Style and then Custom CSS and select "No" for every option.
6. Paste the code above into the Custom stylesheet box.
7. Save changes.
If there are any bugs, please let me now, though, I'm not sure whether I'll be able to fix them. Also, you can easily replace the headerimage (the last link in the list). If you're css-savy, edit the code to your heart's desire. Credit/no credit, whatevs.
Mods? ♥ Layout tag, y/y? *\o/*