XXIX | IMMORTALITY (FOREVER YOUNG)
XXIX; IMMORTALITY (FOREVER YOUNG)
LIVE PREVIEWS
forever young style
S2; Flexible Squares
accounts
Basic & Paid
browsers
Firefox, Safari, Chrome, Opera (does not work well in IE)
Resolutions
works in all
disabled features
subtitle, repost option, date, control strip, sidear, repost option
INSTALLATION
HOW TO INSTALL if you need help installing your S2 layout, click the "how to install" link for a detailed guide on how to install any S2 layout.
install the code /*-------------------------------------------
NAME: Immortality (Forever Young)
STYLE: S2 | Flexible Squares
ACCOUNTS: Basic & Paid
CREDIT: apologize @ jealouss
---------------------------------------------*/
/*---------page--------*/
body {
background: #f8f8f8 url() repeat fixed;
text-align: center;
color: #000000;
font-family: "Verdana", sans-serif;
font-size: 11px;
margin: 20px 0 20px 0;
}
/*---------body--------*/
#content{
width: 65%;
margin-left: auto; margin-right: auto;
background-color: transparent!important;
border: none;
padding: 15px;
margin-top: 290px;}
#maincontent {
margin-top: 15px;
font-family: "Verdana", sans-serif;
font-size: 11px;
background-color: transparent!important;
color: #000000;
border: none;
margin-right:0px;
text-align: left;}
/*---------header--------*/
#header {
width: 100%;
padding: 70px 0px 75px 0px;
margin: 0px;
border: none;
background: #ececec;
position: absolute;
top: 0px;
left: 0px;}
.headerimage {
}
div#header a, div#header a:link, div#header a:visited, div#footer a, div#footer a:link, div#footer a:visited {color: #888;}
div#header a:hover, div#footer a:hover {
color: #5B5F62;
border-bottom: 1px solid #ddd;
padding-bottom: 7px;
text-decoration: none;}
.title {
position: absolute;
top: 10px;
left: 0px;
font: normal normal 61px arial black, sans-serif;
text-align: center;
text-transform: uppercase;
letter-spacing: -6px;
line-height: 60%;
width: 100%;
background:transparent!important;
color: #5B5F62;
padding: 20px 0 65px 0;
z-index: 1;
}
.subtitle{
position: absolute;
top: 80px;
left: 0px;
text-align: center;
width: 100%;
font: normal bold 15px calibri, sans-serif;
text-transform: uppercase;
letter-spacing: 3px;
background: transparent!important;
color: #8C8F91;
z-index: 1;
}
ul.navheader{
position: absolute;
top: 141px;
left: 0px;
font: normal bold 18px calibri, sans-serif;
text-transform: uppercase;
letter-spacing: 1px;
text-align: center;
width: 100%;
background: #f4f4f4;
padding: 15px 0 30px 0;
margin: 0px;
z-index: 3;
}
ul.navheader li {
display: inline;
padding: 0 3px 7px 3px;
}
li.view{
border-bottom: 3px solid #5B5F62; }
/*---------entries--------*/
.subcontent {background: #f5f5f5;}
.entry {
margin: 0;
padding: 10px;
background-color: #ececec;
color: #555;
font: normal normal 11px helvetica, sans-serif;
text-align: justify;
border-bottom: 30px solid #f5f5f5;
}
.entry_text img{border: 1px solid #ddd; padding: 15px;}
span .ljuser img{padding: 0px;}
.userpic {
position: relative;
float: left;
background: #ececec;
padding: 15px;
margin: 10px;
z-index: 15;
border-top: 25px solid #f5f5f5;;
margin: 1px 0 0 -150px;
text-align: left;
}
.userpic img{}
.subject {
padding: 0px;
color: #5B5F62;
font: normal normal 20px calibri, sans-serif;
text-transform: uppercase;
text-align: center;
letter-spacing: -1px;
}
.subject a, .subject a:link, .subject a:visited {color: #888;}
.subject a:hover {color: #bebebe; text-decoration: none;}
.datesubject {
background-color: transparent!important;
padding: 0px;
}
.entry ul li{
padding-left: 5px;
margin-left: 15px;
}
.entry ol li{
padding-left: 5px;
margin-left: 15px;
}
/*---------tags--------*/
.ljtags, .currenttags {font: normal normal 11px helvetica, sans-serif; text-transform: lowercase; color: #5B5F62; }
.ljtags, .currenttags{background: url(
http://i51.tinypic.com/2lszdso.png)left no-repeat;
padding: 3px 5px 1px 17px;
margin-top: 0px;
color: #1d1b1b;
text-transform: lowercase;
line-height: 7px;
text-align: left;}
/*---------currents--------*/
.currents{
font: normal normal 11px helvetica, sans-serif;
text-transform: lowercase;
margin-top: 20px;
border-top: 2px solid #5B5F62;
}
.currentmood{
padding: 5px 15px 3px 17px;
line-height: 2px;
margin-top: 0px;
background: url(
http://i56.tinypic.com/2ljq5pw.png)left no-repeat;}
.currentmusic {
padding: 5px 15px 3px 17px;
margin-top: 0px;
line-height: 10px;
background: url(
http://i56.tinypic.com/15x9xnc.png)left no-repeat;
}
.currentlocation {
padding: 5px 15px 3px 17px;
margin-top: 0px;
line-height: 8px;
background: url(
http://i52.tinypic.com/sltuyv.png) left no-repeat;
}
/*---------comments--------*/
.comments {
font: normal normal 18px calibri, sans-serif;
text-align: center;
background-color: transparent!important;
padding: 0px 5px 0px 5px;
position: relative;
top: 35px;
text-transform: uppercase;
}
div.comments a, div.comments a:link, div.comments a:visited{color: #888;}
div.comments a:hover {
color: #bebebe;
text-decoration: none;
}
/*---------separator--------*/
.separator{height: 75px;}
/*---------friends page--------*/
.userpicfriends {
position: relative;
float: left;
background: transparent!important;
margin: 10px;
z-index: 15;
border-top: 25px solid #f5f5f5;;
margin: 1px 0 0 -150px;
text-align: right;
font: normal normal 11px helvetica, sans-serif;
color: #f1f1f1;
}
.userpicfriends img{background: #ececec; padding:15px;}
.userpicfriends a font{color: #bebebe;}
.userpicfriends a font:hover{color: #222;}
/*---------sidebar--------*/
#sidebar {
padding-top: 15px;
margin-top: 15px;
background-color: transparent!important;
border: mpme;
font-size: 11px;
font: normal normal 10px helvetica, sans-serif;
color: #555;
width: 160px;
float: right;
text-align: justify;
}
.defaultuserpic {
text-align: center;
position: absolute;
top: 230px;
left: 350px;
border: 1px solid #ccc;
padding: 10px;
background: rgba(0, 0, 0, .08);
}
.sbarheader {}
.sbarbody {
padding: 0px;
position: absolute;
top: 222px;
left: 255px;
width: auto;
height: 130px;
overflow: auto;
text-align: right;
}
.sbarbody2 {
padding: 0 5px 0 5px;
position: absolute;
top: 232px;
right: 250px;
width: 525px;
height: 120px;
overflow: hidden;
text-align: justify:
font: normal normal 12px helvetica, sans-serif;
}
div#sidebar a, div#sidebar a:link, div#sidebar a:visited{color: #888;}
div#sidebar a:hover {
color: #5B5F62;
text-decoration: none;
}
table.calendar {
margin-right: auto;
margin-left: auto;
}
.sbarcalendar {
border-color: #000000;
border-width: 1px;
border-style: solid;
text-align: center;
font-family: "Verdana", sans-serif;
font-size: 11px;
}
.sbarcalendarposts {
border-color: #000000;
border-width: 1px;
border-style: solid;
background-color: #d4dce8;
text-align: center;
font-family: "Verdana", sans-serif;
font-size: 11px;
}
ul.sbarlist{
padding-left: 0px;
margin-left: 0px;
list-style: none;
}
li.sbaritem{
padding-left: 15px;
list-style: none;
}
li.sbartitle{
padding-left: 15px;
list-style: none;
border-style: solid;
border-width: 1px;
border-color: #999999;
background-color: #919bad;
margin-bottom: 10px;
margin-top: 10px;
}
/*---------footer--------*/
#footer {
position: absolute;
left: 0px;
width: 100%;
padding: 20px 0 20px 0;
text-align: center;
font: normal normal 20px helvetica, sans-serif;
letter-spacing: -1px;
background-color: #ececec;
color: #bebebe;
border-top: 30px solid #f4f4f4;
z-index: 100;
clear: both;
}
#footer .viewing {}
ul.navfooter{
padding: 0px;
margin: 0px;
}
ul.navfooter li {
display: inline;
margin: 0 5px 0 5px;
}
.clearfoot {clear: both;}
/*---------archive page--------*/
ul.year {
text-align: left;
padding-bottom: 0px;
font: normal normal 26px arial black, sans-serif;
border-bottom: 1px solid #444;
letter-spacing: -3px;
color: #5B5F62;
}
ul.year li {
display: inline;
}
table.yeartable {
margin-left: auto;
margin-right: auto;
}
table.yeartable td.yeardate, table.yeartable td.yearday {
border-left: 1px solid #e8e8e8;
background: #f4f4f4;
font: normal normal 11px helvetica, sans-serif;
}
table.yeartable td.yearday {
background-color: #ececec;
text-align: center;
padding: 5px;
font: normal normal 12px calibri, sans-serif;
}
td.yearmonth {
border-style: none;
font: normal normal 12px helvetica, sans-serif;
color: #555;
}
/*---------comment page--------*/
.datesubjectcomment {
background: #f5f5f5;
padding: 5px;
margin-top: 20px;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
font: normal normal 12px helvetica, sans-serif;
color: #222;
}
.userpiccomment {
position: relative;
background-color: #ececec;
top: -35px;
left: 0px;
padding: 10px;
margin: 0px 10px -20px -120px;
z-index: 15;
float: left;
border-top: 10px solid #f5f5f5;
height: 75px;
width: 75px;
}
.box {
border-style: solid;
border-width: 1px 0px 0px 0px;
border-color: #eee;
padding: 10px;
clear: left;
}
input, textarea {
background-color: #ececec;
color: #555;
font: normal normal 12px helvetica, sans-serif;
}
textarea.textbox {
width: 100% !important;
}
.reply{
position: relative;
margin: 20px 30px 10px 30px;
padding: 25px 10px 10px 10px;
text-align: left;
font: normal normal 11px helvetica, sans-serif;
line-height: 125%;
background-color: #ececec;
color: #555;
}
.replytosubject {font-weight: bold;}
.commentreply {
position: relative;
margin: 10px;
font: normal normal 11px helvetica, sans-serif;
color: #555;
}
.commentbox {
border: none;
padding: 10px;
margin: 10px;
background-color: #ececec;
}
.datesubjectcomment a:link, .datesubjectcomment a:visited {color: #888;}
.datesubjectcomment a:hover {color: #bebebe;}
.commentboxpartial {
border: none;
padding: 10px;
margin: 10px;
background-color: #ececec;
}
.commentinfo {
background-color: #ececec;
margin-top: 10px;
width: 100%;
}
.skiplinks {text-align: center; font: normal normal 11px helvetica, sans-serif; text-transform: lowercase; border-bottom: 1px solid #eee; padding-bottom: 5px;}
/*----------disabled------------*/
.b-repost-item, #lj_controlstrip, #sidebar, li.sbartitle, #sidebar_tags, #sidebar_calendar, #sidebar_summary, .date, .currenttags strong, .currents strong{display: none;}
/*---------misc--------*/
.clear {height: 15px;}
div.ContextualPopup {
margin: 10px 0 0 50px;
font: normal 11px helvetica, sans-serif !important;
}
div.ContextualPopup img {
border: 1px solid #ddd;
padding: 10px;
background: #f2f2f2;
}
div.ContextualPopup div.Inner {
background-color: #ececec !important;
color: #828282 !important;
border-top: 15px solid #f5f5f5;
border-bottom: 1px solid #ddd;
border-left: none; border-right: none;
padding: 10px;
width: 250px;
}
div.ContextualPopup .Relation {
font: normal normal 15px calibri, sans-serif;
color:#555;
letter-spacing:-1px;
border-bottom:1px solid #cccccc;
padding:0;
margin:0px 0px 4px 0px;
}
div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited {
text-decoration: none !important;
font-weight: normal;
color: #555 !important;
}
/*----------links----------------*/
a, a:link, a:visited {
color: #b3b3b3;
text-decoration: none;
}
a:hover {
color: #222;
text-decoration: none;
}
blockquote {
font: normal normal 12px calibri, sans-serif;
border: 1px solid #ddd;
color: #959595;
border-left: none; border-right: none;
padding: 10px 0 10px 0;
}
code, kbd, pre, tt {
font-family: monospace;
}
b, s, i, u{color: #222; font-family: helvetica, sans-serif; font-size: 11px; letter-spacing: 0px;}
big, small{color: #222; font-family: calibri, sans-serif;}
/*---------tiny icons--------*/
/* Generated by Malionette's Tiny Icon Generator */
img[src*="img/userinfo.gif"] {width: 0 !important; height: 0 !important;
background: transparent url(
http://i53.tinypic.com/iglx5z.jpg) no-repeat !important; padding: 16px 0 0 16px !important; }
img[src*="img/community.gif"] {width: 0 !important; height: 0 !important;
background: transparent url(
http://i56.tinypic.com/j15wr6.png) no-repeat !important; padding: 16px 0 0 16px !important; }
img[src*="img/syndicated.gif"] {width: 0 !important; height: 0 !important;
background: transparent url(
http://i52.tinypic.com/2i9pmrb.png) no-repeat !important; padding: 16px 0 0 16px !important; }
img[src*="img/icon_protected.gif"] {width: 0 !important; height: 0 !important;
background: transparent url(
http://i54.tinypic.com/2dqon4k.jpg) no-repeat !important; padding: 16px 0 0 18px !important; }
img[src*="img/icon_private.gif"] {width: 0 !important; height: 0 !important;
background: transparent url(
http://i54.tinypic.com/jj0hns.jpg) no-repeat !important; padding: 16px 0 0 18px !important; }
img[src*="img/icon_groups.gif"] {width: 0 !important; height: 0 !important;
background: transparent url(
http://i55.tinypic.com/i1k9xs.png) no-repeat !important; padding: 16px 0 0 18px !important; }
img[src*="userinfo.gif"], img[src*="user_ontd.gif"], img[src*="userinfo-support.gif"], img[src*="openid-profile.gif"], img[src*="anonymous.gif"], img[src*="userhead"] {
background:url("
http://i53.tinypic.com/iglx5z.jpg") no-repeat !important;
height:0; padding: 16px 0 0 15px !important; width:0;}
Features
NONE
Additional Customization
The metadata in the layout is not the typical metadata found on standard livejournal styles, to get your metadata like it is in the layout you must have a paid account, and use layers. To learn more about layers see
this tutorial, to learn about how to cusotmize your metadata using your layers, see
this tutorial.
Credits
tiny icons by
brsev @ deviantart Questions
If you have a questions, please make sure you read through all the information provided here, and the FAQ before you ask. I will not answer/help if you don't take the time out to find an answer before coming to me.
FAQ |
HOW TO CREDIT like what you see?
watch |
more layouts