Title: Neon Rainbow by
street_of_mercyStyle: S2 Flexible Squares
Accounts: Basic, Paid, and Sponsored
Features: Custom Comment Pages, Mini Icons and Sidebar
Browser: Firefox & Internet Explorer
Live Preview:
HERE with header |
HERE without header
how to do & what to do
Stylesheet with header
/*------------------------------------------------
LAYOUT: "Original - Neon Rainbow (with header)"
BY: Mercy @ street_of_mercy
STYLE: S2 Flexible Squares
NOTE: Mini icons by street_of_mercy
------------------------------------------------*/
/* ------ MAIN ------ */
body {
background-image: url(
http://i9.photobucket.com/albums/a56/mercscilla/Layouts/rainbow_background.png); background-position: left top;
background-repeat: repeat;
color: #666666;
font-family: "Arial";
font-size: 12px;
margin: 0px;
}
a, a:link, a:visited {
font-family: "Tahoma", sans-serif;
font-size: 12px;
color: #5bb5da;
text-decoration: none;
}
a:hover {
color: #999999;
text-decoration: none;
}
b {
color: #9ada5b;
font-family: "Tahoma", sans-serif;
font-size: 12px;
}
i {
color: #e2477a;
font-family: "Tahoma", sans-serif;
font-size: 12px;
}
u {
color: #e2b13c;
font-family: "Tahoma", sans-serif;
font-size: 12px;
}
s {
color: #bbbbbb;
font-family: "Tahoma", sans-serif;
font-size: 12px;
}
blockquote {
font-family: "Tahoma", sans-serif;
font-size: 12px;
color: #888888;
padding: 10px;
background-color: #eeeeee;
border-left: 6px solid #e2477a;
border-right: 6px solid #9ada5b;
}
blockquote:first-letter {
font-family: "Georgia", sans-serif;
font-size: 14px;
font-style: italic;
color: #5bb5da;
}
::-moz-selection {
color: #222222;
background: #e2b13c;
}
input, textarea {
background-color: #f7f7f7;
color: #666666;
}
h2 {
padding: 10px;
font-family: Palatino Linotype, Palatino, serif;
font-size: 14px;
font-style: italic;
text-transform: uppercase;
color: #e2477a;
}
p, td {
}
code, kbd, pre, tt {
font-family: monospace;
}
/* ------ CONTAINING ELEMENTS ------ */
#content-outer
{
width: 100%;
margin: 0 auto;
padding: 0px;
background-color: #e9e9e9;
background-image: url(
http://i9.photobucket.com/albums/a56/mercscilla/Layouts/rainbow_background.png); background-position: left top;
background-repeat: repeat-x;
}
#content {
width: 860px;
background-color: #e9e9e9;
margin-left: auto;
margin-right: auto;
padding: 0px 0px 0px 0px;
text-align: justify;
}
#maincontent {
font-family: "Arial";
font-size: 12px;
color: #666666;
text-align: center;
margin-left: 270px;
margin-top: 20px;
}
#sidebar {
padding: 0px 5px 0px 5px;
margin-top: 8px;
font-family: "Arial";
font-size: 12px;
color: #666666;
width: 240px;
float: left;
text-align: left;
}
#header {
width: 100%;
position: relative;
background-image: url(
http://i9.photobucket.com/albums/a56/mercscilla/Layouts/rainbow_background.png); background-position: left top;
background-repeat: repeat-x;
border-bottom: 30px solid #e9e9e9;
position: relative;
color: #cccccc;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
padding: 8px 0px 5px 0px;
text-transform: uppercase;
letter-spacing: 1px;
text-align: center;
clear: both;
}
#footer
{
width: 100%;
bottom: 0px;
padding: 5px 0px 5px 0px;
text-align: center;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
text-transform: uppercase;
letter-spacing: 1px;
color: #5bb5da;
z-index: 100;
}
/* ------ HEADER ------ */
div#header a, div#header a:link, div#header a:visited {
color: #aaaaaa;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
div#header a:hover {
color: #222222 !Important;
background-color: #bbbbbb;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
ul.navheader
{
padding: 0px;
margin: 0px;
}
ul.navheader li {
display: inline;
}
/* ------ HEADER NAV ------ */
div#header a[href*=".livejournal.com/"] {
color: #aaaaaa;
border-bottom: 4px solid #5bb5da !Important;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
div#header a:hover[href*=".livejournal.com/"], body.lj-view-recent div#header li.view {
color: #222222 !Important;
background-color: #5bb5da !Important;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
div#header a[href*="/calendar"] {
color: #aaaaaa;
border-bottom: 4px solid #9ada5b !Important;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
div#header a:hover[href*="/calendar"], body.lj-view-archive div#header li.view {
color: #222222 !Important;
background-color: #9ada5b !Important;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
div#header a[href*="/friends"] {
color: #aaaaaa;
border-bottom: 4px solid #e2477a !Important;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
div#header a:hover[href*="/friends"], body.lj-view-friends div#header li.view {
color: #222222 !Important;
background-color: #e2477a !Important;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
div#header a[href*="/profile"] {
color: #aaaaaa;
border-bottom: 4px solid #e2b13c !Important;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
div#header a:hover[href*="/profile"] {
color: #222222 !Important;
background-color: #e2b13c !Important;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
div#header a[href*="
http://community.livejournal.com/street_of_mercy/"] {
color: #aaaaaa;
border-bottom: 4px solid #bbbbbb !Important;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
div#header a:hover[href*="
http://community.livejournal.com/street_of_mercy/"] {
color: #222222 !Important;
background-color: #bbbbbb !Important;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
/* ------ FOOTER ------ */
div#footer a, div#footer a:link, div#footer a:visited {
color: #e2477a;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
div#footer a:hover {
color: #9ada5b;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
ul.navfooter{
padding: 0px;
margin: 0px;
}
ul.navfooter li {
margin: 0px;
display: inline;
}
.clearfoot {
clear: both;
}
/* ------ TITLE -- SUBTITLE ------ */
.title
{
display: none;
}
.subtitle
{
display: none;
}
/* ------ SIDEBAR MAIN ------ */
.defaultuserpic {
padding: 10px 10px 10px 10px;
text-align: center;
display: none;
}
.defaultuserpic img{
padding: 10px;
background-color: #F8F8F8;
display: none;
}
li.sbartitle, #sidebar_calendar li.sbartitle, #sidebar_linklist li.sbartitle, #sidebar_tags li.sbartitle, #sidebar_summary
li.sbartitle {
background-color: #222222;
font-family: "Georgia", sans-serif;
font-size: 16px;
font-style: italic;
color: #cccccc;
text-align: center;
padding: 10px 0px 10px 5px;
}
.sbartitle:first-letter {
color: #5bb5da;
font-size: 20px;
}
#sidebar_linklist li.sbartitle:first-letter {
color: #e2477a;
font-size: 20px;
}
#sidebar_tags li.sbartitle:first-letter {
color: #9ada5b;
font-size: 20px;
}
#sidebar_summary li.sbartitle:first-letter {
color: #e2b13c;
font-size: 20px;
}
#sidebar_calendar, #sidebar_linklist, #sidebar_tags, #sidebar_summary {
margin: 20px 0px 0px 0px;
}
.sbarheader {
background-color: #222222;
padding: 0px;
}
.sbarbody {
background-color: #f7f7f7;
padding: 0px 0px 5px 0px;
}
.sbarbody2 {
background-color: #f7f7f7;
padding: 0px 5px 5px 12px;
}
li.sbaritem {
font-family: "Tahoma", sans-serif;
font-size: 12px;
border-bottom: 1px solid #dddddd;
text-align: left;
text-transform: lowercase;
list-style: none;
margin: 3px 5px 0px 5px;
padding: 3px 2px 2px 0px;
}
li.sbaritem a
{
list-style: none;
color: #5bb5da;
}
li.sbaritem a:hover
{
list-style: none;
color: #999999;
}
ul.sbarlist {
padding-left: 0px;
margin-left: 0px;
list-style: none;
}
/* ------ SIDEBAR CALENDAR ------ */
#sidebar_calendar
{
display: none;
font-family: "Tahoma", sans-serif;
font-size: 12px;
}
.sbarcalendar, .sbarcalendarposts {
text-align: center;
border: 1px solid #dddddd;
padding: 2px 2px 2px 10px;
}
#sidebar .sbarcalendarposts a, #sidebar .sbarcalendarposts a:link, #sidebar .sbarcalendarposts a:visited {
font-family: "Tahoma", sans-serif;
font-size: 12px;
color: #aaaaaa;
padding: 0px;
text-align: center;
}
#sidebar .sbarcalendarposts a:hover {
font-family: "Tahoma", sans-serif;
font-size: 12px;
color: #999999;
padding: 0px;
text-align: center;
}
table.calendar {
margin-right: auto;
margin-left: auto;
}
/* ------ SIDEBAR FREE BOX ------ */
div#sidebar a, div#sidebar a:link, div#sidebar a:visited {
font-family: "Tahoma", sans-serif;
font-size: 12px;
color: #5bb5da;
padding: 3px 5px 2px 3px;
text-decoration: none;
}
div#sidebar a:hover {
padding: 3px 5px 2px 3px;
color: #999999;
}
/* ------ SIDEBAR LINK LIST ------ */
div#sidebar_linklist a, div#sidebar_linklist a:link, div#sidebar_linklist a:visited {
font-family: "Tahoma", sans-serif;
font-size: 12px;
padding: 3px 5px 2px 3px;
color: #e2477a;
}
div#sidebar_linklist a:hover {
padding: 3px 5px 2px 3px;
color: #999999;
}
/* ------ SIDEBAR TAGS ------ */
div#sidebar_tags a, div#sidebar_tags a:link, div#sidebar_tags a:visited {
font-family: "Tahoma", sans-serif;
font-size: 12px;
padding: 3px 5px 2px 3px;
color: #9ada5b;
text-decoration: none;
}
div#sidebar_tags a:hover {
padding: 3px 5px 2px 3px;
color: #999999;
text-decoration: none;
}
#sidebar_tags ul.sbarcontent {
}
/* ------ SIDEBAR SUMMARY ------ */
div#sidebar_summary a, div#sidebar_summary a:link, div#sidebar_summary a:visited {
font-family: "Tahoma", sans-serif;
font-size: 12px;
padding: 3px 5px 2px 3px;
color: #e2b13c;
text-decoration: none;
}
div#sidebar_summary a:hover {
padding: 3px 5px 2px 3px;
color: #999999;
text-decoration: none;
}
/* ------ MAINCONTENT ------ */
ul.ljtaglist li {
list-style: none;
text-align: justify;
margin-bottom: 5px;
margin-left: 10px;
}
ul.ljtaglist {
background-color: #f7f7f7;
border-top: 10px solid #222222;
color: #666666;
font-family: "Arial", sans-serif;
font-size: 12px;
padding: 12px 0px 12px 20px;
}
.subcontent {
background-color: #f7f7f7;
min-height: 120px;
}
.entry {
padding: 15px 15px 0px 15px;
color: #666666;
font-family: "Arial", sans-serif;
font-size: 12px;
text-align: justify;
}
hr {
color: transparent;
height: 1px;
border-style : none;
border-bottom: 2px dotted #CCCCCC;
}
.entry ul li, ol li, li
{
padding-left: 0px;
margin-left: 0px;
}
/* ------ USERPICS ------ */
.userpic
{
position: relative;
float: right;
margin: 0px -130px 10px 10px;
z-index: 15;
border: 10px solid #222222;
background-color: #222222 !important;
font-family: "Verdana", sans-serif;
font-size: 11px;
text-align: center;
}
.userpic a font, .userpic a:link font, .userpic a:visited font
{
color: #bbbbbb !important;
text-align: center !important;
}
.userpic a:hover font
{
color: #999999 !important;
text-decoration: none;
}
.userpicfriends
{
position: relative;
float: right;
margin: 0px -130px 10px 10px;
border: 10px solid #222222;
background-color: #222222 !important;
font-family: "Verdana", sans-serif;
font-size: 11px;
z-index: 15;
text-align: center;
}
.userpicfriends a font, .userpicfriends a:link font, .userpicfriends a:visited font
{
color: #bbbbbb !important;
text-align: center !important;
}
.userpicfriends a:hover font
{
color: #999999 !important;
text-decoration: none;
}
/* ------ DATE SUBJECT ------ */
.date {
padding: 5px 5px 0px 0px;
text-align: right;
color: #9ada5b;
top: 5px;
font-family: Palatino Linotype, Palatino, serif;
font-size: 12px;
font-style: italic;
text-transform: lowercase;
letter-spacing: 1px;
background-color: #222222;
}
.subject, .subject a, .subject a:link, .subject a:visited, .subject a:hover {
padding: 0px 0px 5px 6px;
color: #e2477a;
font-family: "Georgia", sans-serif;
font-size: 16px;
font-style: italic;
letter-spacing: 1px;
background-color: #222222;
}
.datesubject {
background-color: transparent;
padding: 0px;
text-align: left;
}
/* ------ CURRENTS ------ */
.ljtags
{
margin-top: 20px;
color: #888888;
font-weight: lighter;
text-transform: lowercase;
font-family: "Tahoma", sans-serif;
font-size: 11px;
font-style: normal;
padding: 5px 0px 5px 0px;
border-top: 1px solid #e2b13c;
border-bottom: 1px solid #e2b13c;
}
.currentlocation
{
background: url(
http://i9.photobucket.com/albums/a56/mercscilla/Layouts/rainbow_location.png) no-repeat left
center;
padding: 8px 0px 0px 18px;
}
.currentmood
{
background: url(
http://i9.photobucket.com/albums/a56/mercscilla/Layouts/rainbow_mood.png) no-repeat left
center;
padding: 8px 0px 0px 18px;
}
.currentmusic
{
background: url(
http://i9.photobucket.com/albums/a56/mercscilla/Layouts/rainbow_music.png) no-repeat left
center;
padding: 8px 0px 0px 18px;
}
.currents strong, .currentmood strong, .currentmusic .currentlocation, .ljtags strong
{
display: none;
color: #777777;
font-weight: lighter;
text-transform: lowercase;
font-family: "Tahoma", sans-serif;
font-size: 11px;
font-style: normal;
padding: 4px 0 4px 0;
}
.currents, .currentmood, .currentmusic, .currentlocation {
color: #888888;
font-weight: lighter;
font-family: "Tahoma", sans-serif;
font-size: 11px;
font-style: normal;
}
.ljtags a, .ljtags a:link, .ljtags a:visited {
color: #e2b13c;
font-weight: lighter;
font-family: "Tahoma", sans-serif;
font-size: 11px;
font-style: normal;
}
.currentlocation a, .currentlocation a:link, .currentlocation a:visited {
color: #9ada5b;
font-weight: lighter;
font-family: "Tahoma", sans-serif;
font-size: 11px;
font-style: normal;
}
.currentmusic a, .currentmusic a:link, .currentmusic a:visited
{
color: #5bb5da;
font-weight: lighter;
font-family: "Tahoma", sans-serif;
font-size: 11px;
font-style: normal;
}
.ljtags a:hover, .currentlocation a:hover, .currentmusic a:hover
{
color: #999999;
font-weight: lighter;
font-family: "Tahoma", sans-serif;
font-size: 11px;
font-style: normal;
}
/* ------ COMMENTS ------ */
.comments
{
line-height: .2;
font-style: italic;
font-family: "Georgia", sans-serif;
font-size: 14px;
color: #f7f7f7;
text-align: right;
padding: 0px 0px 10px 0px;
position: relative;
margin: 0 -150px 0 0;
text-transform: lowercase;
clear: right;
border: 0px;
}
div.comments a, div.comments a:link, div.comments a:visited
{
line-height: 2;
padding: 1px 10px;
display: block;
color: #5bb5da;
background-color: #222222;
width: 100px;
margin: 0 3px 0 auto;
border-right: 4px solid #9ada5b;
}
div.comments a:hover
{
color: #e2477a;
border-right: 4px solid #e2b13c;
}
/* ------MAINCONTENT -- ENTRY, REPLY PAGES ------ */
.datesubjectcomment {
margin-top: 20px;
text-align: left;
padding: 5px;
color: #cccccc;
background-color: #222222;
}
.userpiccomment {
border: 5px #222222 solid;
background-color: #222222 !important;
position: relative;
top: -30px;
left: 0px;
padding: 5px;
margin: 25px 10px -20px 10px;
z-index: 15;
float: right;
}
.box {
width: 650px;
margin-left: auto;
margin-right: auto;
padding: 10px;
margin-top: 0px;
text-align: left;
clear: right;
}
form div.box {
text-align:center;
}
div#content input, div#content textarea, div#content select {
color: #666666;
}
.reply {
background-color: #f7f7f7;
position: relative;
margin: 20px 30px 10px 30px;
padding: 25px 10px 10px 10px;
text-align: left;
font-family: "Arial", sans-serif;
font-size: 12px;
line-height: 125%;
color: #666666;
border: 0px;
}
.replytosubject {
padding: 10px 0px 3px 6px;
color: #e2477a;
font-family: "Georgia", sans-serif;
font-size: 12px;
letter-spacing: 1px;
background-color: #222222;
}
.replytoposter {
color: #666666;
background-color: #222222;
text-transform: lowercase;
padding: 5px;
}
/* ------MAINCONTENT -- COMMENTS ------ */
.commentreply {
text-align: justify;
position: relative;
margin: 10px;
font-family: "Arial", sans-serif;
font-size: 12px;
color: #666666;
}
.commentbox {
padding: 0px;
margin: 0px;
text-align: left;
background-color: #f7f7f7;
}
.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #5bb5da;
}
.datesubjectcomment a:hover {
color: #999999;
}
.commentboxpartial {
padding: 10px;
margin: 10px;
background-color: #f7f7f7;
}
.commentinfo {
margin-top: 10px;
width: 100%;
}
/* ------ MAINCONTENT -- YEAR/ACHIVE PAGES ------ */
ul.year {
text-align: center;
padding: 20px 0 20px 0;
}
ul.year li {
display: inline;
}
table.yeartable {
background-color: #f7f7f7;
padding: 20px;
}
table.yeartable td.yeardate, table.yeartable td.yearday {
border: 1px #999999 solid;
color: #666666;
}
table.yeartable td.yearday {
text-align: center;
color: #e2477a;
}
td.yearmonth {
color: #9ada5b;
border-style: none;
}
/* ------ MISC ------ */
.clear {
height: 10px;
font-size: 0.01px;
}
.skiplinks {
text-transform: lowercase;
text-align: center;
padding: 10px 0 10px 0;
}
.ljuser img {
width: 0px;
height: 0px;
background-repeat: no-repeat;
/*so that IE users will still see an image*/
background: transparent url(
http://i9.photobucket.com/albums/a56/mercscilla/Layouts/rainbow_user.png)
no-repeat 0 0 !important;
padding: 16px 0px 0px 16px !important;
}
.ljuser img[src*="userinfo.gif"] {
background: transparent url(
http://i9.photobucket.com/albums/a56/mercscilla/Layouts/rainbow_user.png)
no-repeat 0 0 !important;
padding: 16px 0px 0px 16px !important;
}
.ljuser img[src*="community.gif"] {
background: transparent url(
http://i9.photobucket.com/albums/a56/mercscilla/Layouts/rainbow_community.png)
no-repeat scroll 0 0 !important;
padding: 16px 0px 0px 17px !important;
}
span.ljuser a b {
padding: 2px 0 2px 0;
color: #5bb5da;
font-weight: lighter;
}
span.ljuser a:hover b {
padding-top: 2px;
padding-bottom: 2px;
color: #999999;
font-weight: lighter;
}
img[src*="icon_protected.gif"] {
width: 0;
height: 0;
padding: 16px 16px 0 0 !important;
background: url(
http://i9.photobucket.com/albums/a56/mercscilla/Layouts/rainbow_lock.png); }
table#lj_controlstrip td
{
border: 1px solid #777777;
background-color: #222222;
color: #9ada5b;
border-left: none;
}
#lj_controlstrip input
{
background-color: #282828;
color: #999999;
}
#lj_controlstrip a
{
color: #e2477a;
}
#lj_controlstrip_statustext
{
color: #777777;
}
#lj_controlstrip.ljuser a b
{
color: #5bb5da;
}
#lj_controlstrip_userpic
{
display:none;
}
.headerimage {
position: relative;
width: 100%;
height: 207px; /* the height of your header */
margin-left: auto;
margin-right: auto;
margin-top: 0px;
background-image: url(
http://i9.photobucket.com/albums/a56/mercscilla/Layouts/rainbow_header.jpg); background-position: center top;
background-repeat: no-repeat;
}
.separator {
margin: 10px 0px 10px 0px;
}
Stylesheet without header
/*------------------------------------------------
LAYOUT: "Original - Neon Rainbow (with header)"
BY: Mercy @ street_of_mercy
STYLE: S2 Flexible Squares
NOTE: Mini icons by street_of_mercy"
------------------------------------------------*/
/* ------ MAIN ------ */
body {
background-image: url(
http://i9.photobucket.com/albums/a56/mercscilla/Layouts/rainbow_background.png); background-position: left top;
background-repeat: repeat;
color: #666666;
font-family: "Arial";
font-size: 12px;
margin: 0px;
}
a, a:link, a:visited {
font-family: "Tahoma", sans-serif;
font-size: 12px;
color: #5bb5da;
text-decoration: none;
}
a:hover {
color: #999999;
text-decoration: none;
}
b {
color: #9ada5b;
font-family: "Tahoma", sans-serif;
font-size: 12px;
}
i {
color: #e2477a;
font-family: "Tahoma", sans-serif;
font-size: 12px;
}
u {
color: #e2b13c;
font-family: "Tahoma", sans-serif;
font-size: 12px;
}
s {
color: #bbbbbb;
font-family: "Tahoma", sans-serif;
font-size: 12px;
}
blockquote {
font-family: "Tahoma", sans-serif;
font-size: 12px;
color: #888888;
padding: 10px;
background-color: #eeeeee;
border-left: 6px solid #e2477a;
border-right: 6px solid #9ada5b;
}
blockquote:first-letter {
font-family: "Georgia", sans-serif;
font-size: 14px;
font-style: italic;
color: #5bb5da;
}
::-moz-selection {
color: #222222;
background: #e2b13c;
}
input, textarea {
background-color: #f7f7f7;
color: #666666;
}
h2 {
padding: 10px;
font-family: Palatino Linotype, Palatino, serif;
font-size: 14px;
font-style: italic;
text-transform: uppercase;
color: #e2477a;
}
p, td {
}
code, kbd, pre, tt {
font-family: monospace;
}
/* ------ CONTAINING ELEMENTS ------ */
#content-outer
{
width: 100%;
margin: 0 auto;
padding: 0px;
background-color: #e9e9e9;
background-image: url(
http://i9.photobucket.com/albums/a56/mercscilla/Layouts/rainbow_background.png); background-position: left top;
background-repeat: repeat-x;
}
#content {
width: 860px;
background-color: #e9e9e9;
margin-left: auto;
margin-right: auto;
padding: 0px 0px 0px 0px;
text-align: justify;
}
#maincontent {
font-family: "Arial";
font-size: 12px;
color: #666666;
text-align: center;
margin-left: 270px;
margin-top: 20px;
}
#sidebar {
padding: 0px 5px 0px 5px;
margin-top: 8px;
font-family: "Arial";
font-size: 12px;
color: #666666;
width: 240px;
float: left;
text-align: left;
}
#header {
width: 100%;
position: relative;
background-image: url(
http://i9.photobucket.com/albums/a56/mercscilla/Layouts/rainbow_background.png); background-position: left top;
background-repeat: repeat-x;
border-bottom: 30px solid #e9e9e9;
position: relative;
color: #cccccc;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
padding: 8px 0px 5px 0px;
text-transform: uppercase;
letter-spacing: 1px;
text-align: center;
clear: both;
}
#footer
{
width: 100%;
bottom: 0px;
padding: 5px 0px 5px 0px;
text-align: center;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
text-transform: uppercase;
letter-spacing: 1px;
color: #5bb5da;
z-index: 100;
}
/* ------ HEADER ------ */
div#header a, div#header a:link, div#header a:visited {
color: #aaaaaa;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
div#header a:hover {
color: #222222 !Important;
background-color: #bbbbbb;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
ul.navheader
{
padding: 0px;
margin: 0px;
}
ul.navheader li {
display: inline;
}
/* ------ HEADER NAV ------ */
div#header a[href*=".livejournal.com/"] {
color: #aaaaaa;
border-bottom: 4px solid #5bb5da !Important;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
div#header a:hover[href*=".livejournal.com/"], body.lj-view-recent div#header li.view {
color: #222222 !Important;
background-color: #5bb5da !Important;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
div#header a[href*="/calendar"] {
color: #aaaaaa;
border-bottom: 4px solid #9ada5b !Important;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
div#header a:hover[href*="/calendar"], body.lj-view-archive div#header li.view {
color: #222222 !Important;
background-color: #9ada5b !Important;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
div#header a[href*="/friends"] {
color: #aaaaaa;
border-bottom: 4px solid #e2477a !Important;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
div#header a:hover[href*="/friends"], body.lj-view-friends div#header li.view {
color: #222222 !Important;
background-color: #e2477a !Important;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
div#header a[href*="/profile"] {
color: #aaaaaa;
border-bottom: 4px solid #e2b13c !Important;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
div#header a:hover[href*="/profile"] {
color: #222222 !Important;
background-color: #e2b13c !Important;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
div#header a[href*="
http://community.livejournal.com/street_of_mercy/"] {
color: #aaaaaa;
border-bottom: 4px solid #bbbbbb !Important;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
div#header a:hover[href*="
http://community.livejournal.com/street_of_mercy/"] {
color: #222222 !Important;
background-color: #bbbbbb !Important;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
/* ------ FOOTER ------ */
div#footer a, div#footer a:link, div#footer a:visited {
color: #e2477a;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
div#footer a:hover {
color: #9ada5b;
padding: 8px 10px 5px 10px;
text-decoration: none;
font-family: Palatino Linotype, Palatino, serif;
font-size: 15px;
}
ul.navfooter{
padding: 0px;
margin: 0px;
}
ul.navfooter li {
margin: 0px;
display: inline;
}
.clearfoot {
clear: both;
}
/* ------ TITLE -- SUBTITLE ------ */
.title
{
display: none;
}
.subtitle
{
display: none;
}
/* ------ SIDEBAR MAIN ------ */
.defaultuserpic {
padding: 10px 10px 10px 10px;
text-align: center;
display: none;
}
.defaultuserpic img{
padding: 10px;
background-color: #F8F8F8;
display: none;
}
li.sbartitle, #sidebar_calendar li.sbartitle, #sidebar_linklist li.sbartitle, #sidebar_tags li.sbartitle, #sidebar_summary
li.sbartitle {
background-color: #222222;
font-family: "Georgia", sans-serif;
font-size: 16px;
font-style: italic;
color: #cccccc;
text-align: center;
padding: 10px 0px 10px 5px;
}
.sbartitle:first-letter {
color: #5bb5da;
font-size: 20px;
}
#sidebar_linklist li.sbartitle:first-letter {
color: #e2477a;
font-size: 20px;
}
#sidebar_tags li.sbartitle:first-letter {
color: #9ada5b;
font-size: 20px;
}
#sidebar_summary li.sbartitle:first-letter {
color: #e2b13c;
font-size: 20px;
}
#sidebar_calendar, #sidebar_linklist, #sidebar_tags, #sidebar_summary {
margin: 20px 0px 0px 0px;
}
.sbarheader {
background-color: #222222;
padding: 0px;
}
.sbarbody {
background-color: #f7f7f7;
padding: 0px 0px 5px 0px;
}
.sbarbody2 {
background-color: #f7f7f7;
padding: 0px 5px 5px 12px;
}
li.sbaritem {
font-family: "Tahoma", sans-serif;
font-size: 12px;
border-bottom: 1px solid #dddddd;
text-align: left;
text-transform: lowercase;
list-style: none;
margin: 3px 5px 0px 5px;
padding: 3px 2px 2px 0px;
}
li.sbaritem a
{
list-style: none;
color: #5bb5da;
}
li.sbaritem a:hover
{
list-style: none;
color: #999999;
}
ul.sbarlist {
padding-left: 0px;
margin-left: 0px;
list-style: none;
}
/* ------ SIDEBAR CALENDAR ------ */
#sidebar_calendar
{
display: none;
font-family: "Tahoma", sans-serif;
font-size: 12px;
}
.sbarcalendar, .sbarcalendarposts {
text-align: center;
border: 1px solid #dddddd;
padding: 2px 2px 2px 10px;
}
#sidebar .sbarcalendarposts a, #sidebar .sbarcalendarposts a:link, #sidebar .sbarcalendarposts a:visited {
font-family: "Tahoma", sans-serif;
font-size: 12px;
color: #aaaaaa;
padding: 0px;
text-align: center;
}
#sidebar .sbarcalendarposts a:hover {
font-family: "Tahoma", sans-serif;
font-size: 12px;
color: #999999;
padding: 0px;
text-align: center;
}
table.calendar {
margin-right: auto;
margin-left: auto;
}
/* ------ SIDEBAR FREE BOX ------ */
div#sidebar a, div#sidebar a:link, div#sidebar a:visited {
font-family: "Tahoma", sans-serif;
font-size: 12px;
color: #5bb5da;
padding: 3px 5px 2px 3px;
text-decoration: none;
}
div#sidebar a:hover {
padding: 3px 5px 2px 3px;
color: #999999;
}
/* ------ SIDEBAR LINK LIST ------ */
div#sidebar_linklist a, div#sidebar_linklist a:link, div#sidebar_linklist a:visited {
font-family: "Tahoma", sans-serif;
font-size: 12px;
padding: 3px 5px 2px 3px;
color: #e2477a;
}
div#sidebar_linklist a:hover {
padding: 3px 5px 2px 3px;
color: #999999;
}
/* ------ SIDEBAR TAGS ------ */
div#sidebar_tags a, div#sidebar_tags a:link, div#sidebar_tags a:visited {
font-family: "Tahoma", sans-serif;
font-size: 12px;
padding: 3px 5px 2px 3px;
color: #9ada5b;
text-decoration: none;
}
div#sidebar_tags a:hover {
padding: 3px 5px 2px 3px;
color: #999999;
text-decoration: none;
}
#sidebar_tags ul.sbarcontent {
}
/* ------ SIDEBAR SUMMARY ------ */
div#sidebar_summary a, div#sidebar_summary a:link, div#sidebar_summary a:visited {
font-family: "Tahoma", sans-serif;
font-size: 12px;
padding: 3px 5px 2px 3px;
color: #e2b13c;
text-decoration: none;
}
div#sidebar_summary a:hover {
padding: 3px 5px 2px 3px;
color: #999999;
text-decoration: none;
}
/* ------ MAINCONTENT ------ */
ul.ljtaglist li {
list-style: none;
text-align: justify;
margin-bottom: 5px;
margin-left: 10px;
}
ul.ljtaglist {
background-color: #f7f7f7;
border-top: 10px solid #222222;
color: #666666;
font-family: "Arial", sans-serif;
font-size: 12px;
padding: 12px 0px 12px 20px;
}
.subcontent {
background-color: #f7f7f7;
min-height: 120px;
}
.entry {
padding: 15px 15px 0px 15px;
color: #666666;
font-family: "Arial", sans-serif;
font-size: 12px;
text-align: justify;
}
hr {
color: transparent;
height: 1px;
border-style : none;
border-bottom: 2px dotted #CCCCCC;
}
.entry ul li, ol li, li
{
padding-left: 0px;
margin-left: 0px;
}
/* ------ USERPICS ------ */
.userpic
{
position: relative;
float: right;
margin: 0px -130px 10px 10px;
z-index: 15;
border: 10px solid #222222;
background-color: #222222 !important;
font-family: "Verdana", sans-serif;
font-size: 11px;
text-align: center;
}
.userpic a font, .userpic a:link font, .userpic a:visited font
{
color: #bbbbbb !important;
text-align: center !important;
}
.userpic a:hover font
{
color: #999999 !important;
text-decoration: none;
}
.userpicfriends
{
position: relative;
float: right;
margin: 0px -130px 10px 10px;
border: 10px solid #222222;
background-color: #222222 !important;
font-family: "Verdana", sans-serif;
font-size: 11px;
z-index: 15;
text-align: center;
}
.userpicfriends a font, .userpicfriends a:link font, .userpicfriends a:visited font
{
color: #bbbbbb !important;
text-align: center !important;
}
.userpicfriends a:hover font
{
color: #999999 !important;
text-decoration: none;
}
/* ------ DATE SUBJECT ------ */
.date {
padding: 5px 5px 0px 0px;
text-align: right;
color: #9ada5b;
top: 5px;
font-family: Palatino Linotype, Palatino, serif;
font-size: 12px;
font-style: italic;
text-transform: lowercase;
letter-spacing: 1px;
background-color: #222222;
}
.subject, .subject a, .subject a:link, .subject a:visited, .subject a:hover {
padding: 0px 0px 5px 6px;
color: #e2477a;
font-family: "Georgia", sans-serif;
font-size: 16px;
font-style: italic;
letter-spacing: 1px;
background-color: #222222;
}
.datesubject {
background-color: transparent;
padding: 0px;
text-align: left;
}
/* ------ CURRENTS ------ */
.ljtags
{
margin-top: 20px;
color: #888888;
font-weight: lighter;
text-transform: lowercase;
font-family: "Tahoma", sans-serif;
font-size: 11px;
font-style: normal;
padding: 5px 0px 5px 0px;
border-top: 1px solid #e2b13c;
border-bottom: 1px solid #e2b13c;
}
.currentlocation
{
background: url(
http://i9.photobucket.com/albums/a56/mercscilla/Layouts/rainbow_location.png) no-repeat left
center;
padding: 8px 0px 0px 18px;
}
.currentmood
{
background: url(
http://i9.photobucket.com/albums/a56/mercscilla/Layouts/rainbow_mood.png) no-repeat left
center;
padding: 8px 0px 0px 18px;
}
.currentmusic
{
background: url(
http://i9.photobucket.com/albums/a56/mercscilla/Layouts/rainbow_music.png) no-repeat left
center;
padding: 8px 0px 0px 18px;
}
.currents strong, .currentmood strong, .currentmusic .currentlocation, .ljtags strong
{
display: none;
color: #777777;
font-weight: lighter;
text-transform: lowercase;
font-family: "Tahoma", sans-serif;
font-size: 11px;
font-style: normal;
padding: 4px 0 4px 0;
}
.currents, .currentmood, .currentmusic, .currentlocation {
color: #888888;
font-weight: lighter;
font-family: "Tahoma", sans-serif;
font-size: 11px;
font-style: normal;
}
.ljtags a, .ljtags a:link, .ljtags a:visited {
color: #e2b13c;
font-weight: lighter;
font-family: "Tahoma", sans-serif;
font-size: 11px;
font-style: normal;
}
.currentlocation a, .currentlocation a:link, .currentlocation a:visited {
color: #9ada5b;
font-weight: lighter;
font-family: "Tahoma", sans-serif;
font-size: 11px;
font-style: normal;
}
.currentmusic a, .currentmusic a:link, .currentmusic a:visited
{
color: #5bb5da;
font-weight: lighter;
font-family: "Tahoma", sans-serif;
font-size: 11px;
font-style: normal;
}
.ljtags a:hover, .currentlocation a:hover, .currentmusic a:hover
{
color: #999999;
font-weight: lighter;
font-family: "Tahoma", sans-serif;
font-size: 11px;
font-style: normal;
}
/* ------ COMMENTS ------ */
.comments
{
line-height: .2;
font-style: italic;
font-family: "Georgia", sans-serif;
font-size: 14px;
color: #f7f7f7;
text-align: right;
padding: 0px 0px 10px 0px;
position: relative;
margin: 0 -150px 0 0;
text-transform: lowercase;
clear: right;
border: 0px;
}
div.comments a, div.comments a:link, div.comments a:visited
{
line-height: 2;
padding: 1px 10px;
display: block;
color: #5bb5da;
background-color: #222222;
width: 100px;
margin: 0 3px 0 auto;
border-right: 4px solid #9ada5b;
}
div.comments a:hover
{
color: #e2477a;
border-right: 4px solid #e2b13c;
}
/* ------MAINCONTENT -- ENTRY, REPLY PAGES ------ */
.datesubjectcomment {
margin-top: 20px;
text-align: left;
padding: 5px;
color: #cccccc;
background-color: #222222;
}
.userpiccomment {
border: 5px #222222 solid;
background-color: #222222 !important;
position: relative;
top: -30px;
left: 0px;
padding: 5px;
margin: 25px 10px -20px 10px;
z-index: 15;
float: right;
}
.box {
width: 650px;
margin-left: auto;
margin-right: auto;
padding: 10px;
margin-top: 0px;
text-align: left;
clear: right;
}
form div.box {
text-align:center;
}
div#content input, div#content textarea, div#content select {
color: #666666;
}
.reply {
background-color: #f7f7f7;
position: relative;
margin: 20px 30px 10px 30px;
padding: 25px 10px 10px 10px;
text-align: left;
font-family: "Arial", sans-serif;
font-size: 12px;
line-height: 125%;
color: #666666;
border: 0px;
}
.replytosubject {
padding: 10px 0px 3px 6px;
color: #e2477a;
font-family: "Georgia", sans-serif;
font-size: 12px;
letter-spacing: 1px;
background-color: #222222;
}
.replytoposter {
color: #666666;
background-color: #222222;
text-transform: lowercase;
padding: 5px;
}
/* ------MAINCONTENT -- COMMENTS ------ */
.commentreply {
text-align: justify;
position: relative;
margin: 10px;
font-family: "Arial", sans-serif;
font-size: 12px;
color: #666666;
}
.commentbox {
padding: 0px;
margin: 0px;
text-align: left;
background-color: #f7f7f7;
}
.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #5bb5da;
}
.datesubjectcomment a:hover {
color: #999999;
}
.commentboxpartial {
padding: 10px;
margin: 10px;
background-color: #f7f7f7;
}
.commentinfo {
margin-top: 10px;
width: 100%;
}
/* ------ MAINCONTENT -- YEAR/ACHIVE PAGES ------ */
ul.year {
text-align: center;
padding: 20px 0 20px 0;
}
ul.year li {
display: inline;
}
table.yeartable {
background-color: #f7f7f7;
padding: 20px;
}
table.yeartable td.yeardate, table.yeartable td.yearday {
border: 1px #999999 solid;
color: #666666;
}
table.yeartable td.yearday {
text-align: center;
color: #e2477a;
}
td.yearmonth {
color: #9ada5b;
border-style: none;
}
/* ------ MISC ------ */
.clear {
height: 10px;
font-size: 0.01px;
}
.skiplinks {
text-transform: lowercase;
text-align: center;
padding: 10px 0 10px 0;
}
.ljuser img {
width: 0px;
height: 0px;
background-repeat: no-repeat;
/*so that IE users will still see an image*/
background: transparent url(
http://i9.photobucket.com/albums/a56/mercscilla/Layouts/rainbow_user.png)
no-repeat 0 0 !important;
padding: 16px 0px 0px 16px !important;
}
.ljuser img[src*="userinfo.gif"] {
background: transparent url(
http://i9.photobucket.com/albums/a56/mercscilla/Layouts/rainbow_user.png)
no-repeat 0 0 !important;
padding: 16px 0px 0px 16px !important;
}
.ljuser img[src*="community.gif"] {
background: transparent url(
http://i9.photobucket.com/albums/a56/mercscilla/Layouts/rainbow_community.png)
no-repeat scroll 0 0 !important;
padding: 16px 0px 0px 17px !important;
}
span.ljuser a b {
padding: 2px 0 2px 0;
color: #5bb5da;
font-weight: lighter;
}
span.ljuser a:hover b {
padding-top: 2px;
padding-bottom: 2px;
color: #999999;
font-weight: lighter;
}
img[src*="icon_protected.gif"] {
width: 0;
height: 0;
padding: 16px 16px 0 0 !important;
background: url(
http://i9.photobucket.com/albums/a56/mercscilla/Layouts/rainbow_lock.png); }
table#lj_controlstrip td
{
border: 1px solid #777777;
background-color: #222222;
color: #9ada5b;
border-left: none;
}
#lj_controlstrip input
{
background-color: #282828;
color: #999999;
}
#lj_controlstrip a
{
color: #e2477a;
}
#lj_controlstrip_statustext
{
color: #777777;
}
#lj_controlstrip.ljuser a b
{
color: #5bb5da;
}
#lj_controlstrip_userpic
{
display:none;
}
.headerimage {
height: 50px;
}
.separator {
margin: 10px 0px 10px 0px;
}
Images
header |
background -> user |
-> community |
-> locked entry
-> mood |
-> music |
-> location
Please upload the images to your own account, copy the code into a simple text editor and do a Find&ReplaceAll for every URL (see
grrliz's
tutorial).
Sidebar
This layout has the sidebar on the left side.
The sidebar-calendar and user-picture are disabled.
Ads
Set the
ads placement to between entries.
Navbar
Works with or without the navigation bar.
Installation
Find the instructions for the set-up guide
HERE.
Website Link
In the section of the code named HEADER NAV, put your website link between the quotation marks of
div#header a[href*="YOUR-URL-HERE"] and div#header a:hover[href*="YOUR-URL-HERE"]
If my website link is
http://mercscilla.livejournal.com/, it would look like:
div#header a[href*="
http://mercscilla.livejournal.com/"]
FAQ
Should you encounter any problems, please don't hesitate and ask me. :)
enjoy!