A long time ago, I used to dabble in making websites and stuff like that when it was cool to have to your own domain and show off your layout skills. It might still be cool, but I've left that online community a few years back.
Therefore I decided to try and make my own layout for livejournal! Aren't you excited for me?
Style: S2, Flexible Squares
Works With: Free Accounts
/* Cleaned CSS: */
/* BY: soundthrustereo
STYLE: S2 Flexible Squares
WORKS WITH: Free Accounts */
body {
background: #FEFEFE;
text-align: center;
color: #FFFFFF;
font-family: "Tahoma",Helvetica, sans-serif;
font-size: 7pt;
margin: 8px 0 8px 0;
background-image: url('
http://i252.photobucket.com/albums/hh14/ltys/ltyoo1/bgstripe.jpg');
background-repeat: repeat;
background-attachment: fixed;
}
a, a:link, a:visited {
font-family: "Tahoma", Tahoma, Helvetica, sans-serif;
cursor: default;
font-size: 7pt;
color: #61be9e;
text-decoration: none;
padding: 1px;
}
a:hover {
font-family: "Tahoma", Tahoma, Helvetica, sans-serif;
cursor: default;
font-size: 7pt;
color: #ffffff;
background: #61be9e;
text-decoration: none;
padding: 1px;
}
::-moz-selection {
background: #eadfce;
color: #666666;
}
blockquote {
margin: 0px 10px 0px 20px;
padding: 18px;
color: #333333;
line-height: 13px;
font-size: 7pt;
font-family: "Tahoma", Tahoma, Helvetica, sans-serif;
border: 0px solid #b35a3e;
background: #efefef;
text-align: justify;
}
p, td {
font-size: 7pt;
}
code, kbd, pre, tt {
font-family: monospace;
}
#content {
width: 658px;
margin-left: auto;
margin-right: auto;
background: transparent;
padding: 08px;
}
#maincontent {
margin: 08px auto 0 180px;
background: transparent;
}
#sidebar {
width: 170px;
padding: 15px 0 15px 0;
margin-top: 08px;
background: #FFF;
border: 0px solid #b35a3e;
color: #313131;
line-height: 11px;
font-family: "Tahoma", Tahoma, Helvetica, sans-serif;
font-size: 7.5pt;
text-align: justify;
float: left;
}
#header {
width: auto;
padding: 20px 0px 20px 0px;
text-align: center;
font-family: "Century Gothic", Tahoma, Helvetica, sans-serif;
font-size: 13pt;
text-transform: lowercase;
color: #61be9e;
line-height: 12px;
letter-spacing: 2px;
background: #FFF;
border: 0px solid #b35a3e;
}
#footer {
padding: 20px 0px 20px 0px;
width: auto;
text-align: center;
font-family: "Tahoma", Tahoma, Helvetica, sans-serif;
font-size: 7pt;
color: #000000;
background: #FFF;
border: 0px solid #b35a3e;
z-index: 100;
clear: both;
}
/* header -- links to views; title of journal; subtitle of journal */
div#header a, div#header a:link, div#header a:visited, div#footer a, div#footer a:link, div#footer a:visited {
color: #333333;
font-family: "Tahoma", Tahoma, Helvetica, sans-serif;
font-size: 7pt;
padding: 10px;
}
div#header a:hover, div#footer a:hover {
color: #FEFEFE;
background: #61be9e;
font-family: "Tahoma", Tahoma, Helvetica, sans-serif;
font-size: 7pt;
padding: 10px;
}
ul.navheader {
padding: 0px;
margin: 0px;
}
ul.navheader li {
display: inline;
padding: 0 3px 0 3px;
}
.title {
display: none;
line-height: 200%;
top: 10px;
}
.subtitle {
display: none;
top: 10px;
}
/* sidebar */
div#sidebar a, div#sidebar a:link, div#sidebar a:visited{
font-size: 7.5pt;
line-height: 11px;
font-family: "arial", sans-serif;
color: #e4c47d;
}
div#sidebar a:hover {
color:#FFFFFF;
text-decoration: none;
}
.defaultuserpic {
text-align: center;
padding: 5px;
}
.sbarheader {
padding: 0px 5px 0px 5px;
color: #000000;
text-align: center;
}
.sbarbody {
padding: 0 2px 0 2px;
}
.sbarbody2 {
padding: 0 2px 0 2px;
}
table.calendar {
margin-right: auto;
margin-left: auto;
}
.sbarcalendar {
width:15px;
height:15px;
color: #313131;
background: #FEFEFE;
text-align: center;
font-family: "arial", sans-serif;
font-size: 7.5pt;
}
.sbarcalendarposts {
width:15px;
height:15px;
border-width: 0px;
color: #313131;
background-color:#FEFEFE;
text-align: center;
font-family: "Arial", sans-serif;
font-size: 7.5pt;
}
ul.sbarlist {
padding-left: 0px;
margin-left: 0px;
list-style: none;
}
li.sbaritem {
padding-left: 0px;
list-style: none;
}
li.sbartitle {
padding: 2px;
list-style: none;
text-align: center;
border: 0px;
color: #61be9e;
font-weight: bold;
margin: 10px 0 10px 0;
background: transparent;
}
/* maincontent */
.subject img[src="
http://stat.livejournal.com/img/icon_protected.gif"] {
width: 0;
height: 0;
padding: 0 08px 10px 0;
background: url(lock.gif);
}
.subject img[src="
http://stat.livejournal.com/img/icon_private.gif"] {
width: 0;
height: 0;
padding: 0 08px 10px 0;
background: url(lock.gif);
}
span.ljuser img {
visibility: hidden;
}
span.ljuser a {
width: 16px;
height: 5px;
background: url(
http://i252.photobucket.com/albums/hh14/ltys/ltyoo1/icon.jpg) no-repeat center left;
padding: 2px 0 2px 0;
margin-right: 0px;
}
.ljuser a img {
width: 16px;
height: 16px;
padding: 02px 0 02px 0;
}
span.ljuser a b {
padding: 02px 0 02px 0;
background: #FFF;
}
ul.ljtaglist li {
list-style: none;
}
ul.ljtaglist {
color: #999;
font-family: "Tahoma", Helvetica, sans-serif;
font-size: 7pt;
padding: 08px 08px 08px 12px;
border: 0px solid #b35a3e;
background: #FFF;
}
.subcontent {
padding: 16px;
background: #FFF;
border: 0px solid #b35a3e
}
.entry {
padding-top: 08px;
color: #313131;
font-family: "Tahoma", Tahoma, Helvetica, sans-serif;
font-size: 7pt;
text-align: justify;
}
.entry ul li {
padding-left: 5px;
margin-left: 15px;
}
.entry ol li {
padding-left: 5px;
margin-left: 15px;
}
.userpic {
display: none;
position: relative;
float: left;
background-color: #333333;
background-image: url('');
background-repeat: repeat;
padding: 1px;
margin-right: 0px;
margin-left: 5px;
z-index: 15;
border-width: 5px;
border-color: #333333;
border-style: solid;
}
.userpicfriends {
position: relative;
float: left;
padding: 1px;
margin: 10px;
text-align: center;
border-style: solid;
background-color: #e5e5e5!important;
background-image: url('');
background-repeat: repeat;
border-width: 5px;
border-color: #e5e5e5;
font-family: "arial", sans-serif;
font-size: 10px;
z-index: 15;
}
.userpicfriends font {
color: #333333 !important;
}
.userpicfriends br {
display: block;
height: 0;
}
.date {
padding-top: 05px;
text-align: left;
top: 5px;
color: #e4c47d;
font-family: "Tahoma", Tahoma, Helvetica, sans-serif;
font-size: 7pt;
text-transform: uppercase;
}
.subject {
text-align: left;
font-weight: none;
padding-bottom: 05px;
color: #61be9e;
font-family: "Century Gothic", Tahoma, Helvetica, sans-serif;
font-size: 10pt;
text-transform: lowercase;
}
.subject a, .subject a:link, .subject a:visited {
color: #61be9e;
}
.subject a:hover {
color: #323232;
}
.datesubject {
background: transparent;
}
.ljtags {
margin-top: 20px;
margin-bottom: 20px;
color: #333333;
font-weight: bold;
text-transform: lowercase;
}
.currents strong, .currentmood strong, .currentmusic .currentlocation, .ljtags strong {
color: #333333;
font-weight: bold;
text-transform: lowercase;
}
.currents, .currentmood, .currentmusic, .currentlocation {
color: #333333;
font-weight: lighter;
text-transform: lowercase;
}
.ljtags a, .ljtags a:link, .ljtags a:visited {
color: #61be9e;
text-transform: none;
font-weight: normal;
}
.ljtags a:hover {
color: #fefefe;
text-transform: none;
font-weight: normal;
}
.currentlocation a, .currentlocation a:link, .currentlocation a:visited {
color: #61be9e;
text-transform: none;
font-weight: normal;
}
.currentlocation a:hover {
color: #fefefe;
text-transform: none;
font-weight: normal;
}
.comments {
font-family: "Century Gothic", Helvetica, sans-serif;
font-size: 7pt;
text-align: right;
color: #FEFEFE;
clear: right;
position: relative;
padding: 0 20px 20px 0;
text-transform: lowercase;
top: 15px;
}
div.comments a, div.comments a:link, div.comments a:visited {
font-family: "Century Gothic", Helvetica, sans-serif;
font-size: 10pt;
letter-spacing: -1px;
color: #FEFEFE;
background: #61be9e;
padding: 3px;
}
div.comments a:hover {
font-family: "Century Gothic", Helvetica, sans-serif;
font-size: 10pt;
letter-spacing: -1px;
color: #333333;
text-decoration: none;
background: #e4c47d;
padding: 3px;
}
/* maincontent -- year/achive pages */
ul.year {
text-align: center;
padding: 20px 0 20px 0;
border: 0px;
background: #ffffff;
}
ul.year li {
color: #000000;
display: inline;
font-family: "Century Gothic", Helvetica, sans-serif;
font-size: 10pt;
padding: 5px;
background: #61be9e;
}
table.yeartable {
margin-left: auto;
margin-right: auto;
padding: 05px;
border: 0px;
background: #ffffff;
}
table.yeartable td.yeardate {
color: #000000;
border: 0px;
}
table.yeartable td.yearday {
color: #e4c47d;
border: 0px;
font-weight: bold;
}
table.yeartable td.yearday {
background: #ffffff;
text-align: center;
}
td.yearmonth {
color: #000000;
border-style: none;
}
/* footer */
ul.navfooter {
padding: 0px;
margin: 0px;
}
ul.navfooter li {
display: inline;
margin: 0 0px 0 0px;
}
.clearfoot {
display: none;
clear: both;
}
/* misc */
.clear {
display: none;
height: 15px;
}
/* for formatting header image */
.headerimage {
position: relative;
width: 658px;
height: 210px;
margin-left: auto;
margin-right: auto;
margin-bottom: 0px;
background-image: url('
http://i252.photobucket.com/albums/hh14/ltys/ltyoo1/header.jpg');
background-repeat: no-repeat;
}
/* for formatting separators between entries */
.separator {
background: ;
height: 8px;
}