Flexible Squares - fatal depression

[niewiadoma]



Finally, I did this! Yeah, it's my first layout. I will appreciate if you, I don't know, perhaps you will comment? =) It's a little dark, because I had badly mood when I did this. But I hope that somebody will get to like it. My inspiratian was (if you watched "Breakfast at Tiffany's" and you cried at the last scene, you know what I mean) "Poor slob without a name". =P Basic informations:Name of Style Sheet:fatal depressionLayout:Flexible SquaresStyle:S2Sidebar:WithoutTested on:Opera, IE (some properties doesn't work) in other browser it also looks good, but I can't tested it. (Firefox, Safari and Chrome)Header:Without How to install?01.Choose a Flexible Squares layout.02.Select 1 Column (no sidebar) and set Ad Placement to Between Entries.03.Go to Customize Journal Theme.04.In Text -> Entries, you can clear 'current music/mood/location/friends group'.05.In Custom Css select NO in the dropdowns.06.Leave "Custom External Stylesheet" empty.07.Paste the CSS that I give you in the "Custom Stylesheet" box.08.Remember to save changes! Used images: http://i762.photobucket.com/albums/xx261/niewiadomadeux/tlo1.png http://i762.photobucket.com/albums/xx261/niewiadomadeux/UTF-8Qcomposition5Fbook.png
  Used fonts: Palatino Linotype Bradley Hand ITC Verdana Times New Roman Broadway Used colors: 
 Used tiny icons set: Download from here Rules:01.Credit niewiadoma if you use.02.Comment. =)03.If you want to change something, it's ok, but don't change too much. But do it if you know how to do it. Seriously.04.Better upload all images to your own account.05.Do you have any problem with my layout? Check here.  

Live preview | Image PreviewCode CSS/***Stylesheet fatal depression -- http://niewiadoma.livejournal.com***/

/********************BASIC**********************/

body { background:#000 url(http://i762.photobucket.com/albums/xx261/niewiadomadeux/tlo1.png) top left no-repeat;
color:#FFFFFF;
font-family:Palatino Linotype, Book Antiqua, Palatino, serif;
font-size:18px;
line-height:104%;
}

a, a:link, a:visited {
color:#91D9FF;
font-weight:normal;
text-decoration:none;
text-transform:none;
}

a:hover {
color:#EDFF87;
font-weight:normal;
text-decoration:overline;
text-transform:none;
text-shadow: 3px 3px 10px #fff;
}

#content {
background:#transparent;
margin:0 auto;
padding:0;
}

u { text-decoration:none;
border-bottom: 1px dashed #FF85A7;}

blockquote {
font-size:1.0833em/*13px*/;
font-style:italic;
text-align:right;
padding:10px;
border-left: 5px ridge #FF85A7;
border-top:2px groove #EDFF87;
border-right:2px groove #EDFF87;
border-bottom:2px groove #EDFF87;
}

/******************HEADER**********************/

#header {
background:transparent;
height:450px;
margin:0;
font-family:Broadway;
font-size:22px;
text-align:center;
}

.title {color: #FFFFFF;
position:relative;
top:270px;
left:360px;
font-family:Times New Roman, Times, serif;
font-size:40px;
text-transform:lowercase;
}

.title:first-letter
{
color:#FFFFFF;
font-size:180px;
font-style:italic;
text-shadow:none;
}

.subtitle{
position:relative;
top:220px;
left:610px;
color: #6E6E6E;
font-size:16px;
font-variant: small-caps;
font-family:Palatino Linotype;}

ul.navheader {
display: block;
list-style: none;
margin-top: 350px;
}

ul.navheader {

float: right;
width: 50%;
}

ul.navheader li{
float: left;
margin-right: 5px;
}

#header a:link, ul a:visited {
text-decoration: none;
display: block;
color: #6E6E6E;
padding:5px 5px 20px 5px;
}

#header a:hover {
color: #fff;
border-bottom: 5px dashed #FF85A7 ;
text-shadow: 3px 3px 10px #91D9FF;
}

#header li.view {
display: block;
text-decoration: none;
color: #fff;
padding:5px 5px 20px 5px;
border-bottom: 5px solid #91D9FF;
}

/******************ENTRY********************/

#maincontent {
text-align: justify;
width:80%;
background:transparent;
font-size:12px;
marging:20px;
}

.subcontent {
background:#000;
overflow:auto;
margin-left:280px;
padding:10px;
width:80%;

}

.entry {
border: 1px dashed #FFFFFF;
margin-left:50px;}

.userpic, .userpicfriends {
background:transparent url(http://i762.photobucket.com/albums/xx261/niewiadomadeux/UTF-8Qcomposition5Fbook.png) top left;
float:left;
margin:0 10px 10px 0;
position: relative;
font-size:0.8333em/*10px*/;
text-align:center;
text-transform:lowercase;
}

.userpic img, .userpicfriends img {
padding:10px;
border: 1px dotted #FF85A7;}

.entry_text {
background-color:#000;
padding:15px;
margin-left: 130px;
}

.userpicfriends font{
color:#91D9FF;
font-size:10px;
text-align:center;
text-transform:lowercase;
}

.userpic a, .userpic a:link, .userpic a:visited, .userpicfriends a, .userpicfriends a:link, .userpicfriends a:visited, userpicfriends font{
background:transparent;
color:#FF85A7!important;
text-decoration: none;
text-transform:upercase;
}

.userpic a, .userpicfriends a:hover, userpicfriends a:hover font {
background:transparent;
color:#EDFF87!important;
text-decoration:line-through;
text-transform:lowercase;
}

.datesubject {
background:transparent!important;
padding:5px;
}

.date{
color:#6E6E6E;
font-size:10px;
text-align:right;
text-transform:lowercase;
margin:0;
}

.subject {
color:#EDFF87;
font-family:"Bradley Hand ITC";
font-size:35px;
font-weight:normal;
text-align:left;
text-transform:none;
padding-bottom:10px;
padding-top:10px;
}

.subject a, .subject a:link, .subject a:visited {
color:#EDFF87;
font-weight:normal;
text-align:left;
text-transform:lowercase;
}

.subject a:hover {
color:#FF85A7;
text-decoration:none;
text-shadow:none;
text-transform:uppercase;
}

.entry ul li {
list-style:square;
margin-left:20px;
padding-left:0;
}

.entry ol li {
list-style:decimal-leading-zero;
margin-left:20px;
padding-left:0;
}

.currents {margin-left:20px;}

.currents strong, .ljtags strong {
color:#666;
font-weight:normal;
}

.currentlocation {
background:url(http://i762.photobucket.com/albums/xx261/niewiadomadeux/web_16x16.gif) no-repeat left center;
margin:0px 0px 0px 0px;
padding:10px 1px 1px 20px;
}

.currentmood {
background:url(http://i762.photobucket.com/albums/xx261/niewiadomadeux/photo_16x16.gif) no-repeat left center;
margin:0px 0px 0px 0px;
padding:10px 1px 1px 20px;
}

.currentmusic {
background:url(http://i762.photobucket.com/albums/xx261/niewiadomadeux/music_16x16.gif) no-repeat left center;
margin:0px 0px 0px 0px;
padding:10px 1px 1px 20px;
}

.ljtags {
margin-top:10px;
color:#6E6E6E;
font-size:11px;
font-weight:normal;
text-align:left;
}

.ljtags a, .ljtags a:link, .ljtags a:visited, .currents a, .currents a:link, .currents a:visited {
background:transparent;
color:#FF85A7;
font-weight:normal;
text-decoration:none;
}

.ljtags a:hover, .currents a:hover {
color:#91D9FF;
text-decoration:underline overline;
font-weight:bold;

}

.comments {
border-top:1px dashed #fff;
margin-top:10px;
color:#EDFF87;
font-size:20px;
padding:5px;
font-weight:normal;
text-align:center;
}

.comments a, .comments a:link, .comments a:visited {
background:transparent;
color:#FF85A7;
font-weight:normal;
text-decoration:overline;
text-transform:uppercase;
}

.comments a:hover {
color:#fff;
text-decoration:underline;
text-transform:lowercase;
}

/********************FOOTER**********************/

#footer {
background:transparent;
font-size:12px;
text-align:left;
margin-left:325px;
}

/*********************TAG PAGE*******************/

h2{
background:#000;
list-style:none;
padding:10px;
color: #EDFF87;
font-family:Tahoma, Geneva, sans-serif;
font-size:22px;
font-weight:normal;
line-height:1em;
text-align:right;
text-transform:none;
font-variant: small-caps;
}

.ljtaglist {
background:#000;
list-style:none;
border:1px dashed #fff;
width:80%;
margin-left:280px;
padding:5px;
}

.ljtaglist li {
margin-top:10px;
color:#6E6E6E;
font-size:11px;
font-weight:normal;
text-align:left;
}

.ljtaglist a, .ljtaglist a:link, .ljtaglist a:visited {
background:transparent;
color:#FF85A7;
font-weight:normal;
text-decoration:none;
}

.ljtaglist a:hover {
color:#91D9FF;
text-decoration:underline overline;
font-weight:bold;
}

.ljtags {
margin:20px 20px 0px 0px;
padding:10px 10px 10px 25px;
background:url(http://i762.photobucket.com/albums/xx261/niewiadomadeux/label_16x16.gif) no-repeat center left;
}

/*********************ARCHIVE********************/

ul.year{list-style:none;
margin: 0 auto;
padding:15px;
border:0;
text-align:center;
display:inline;
}

ul.year a, ul.year a:link, ul.year a:visited {
padding:5px;
color:#fff;
text-decoration:none;
text-transform:none;
display:inline;
}

ul.year a:hover {
border-top: 2px solid #EDFF87;
}

ul.year li {
background:#a9d5c6;
display:inline;
border:0;
color:#ef9018;
}

ul.year li.active {
background:#28e;
padding:5px;
color:#f3f7e8;
font-size:1.1538em/*15px*/;
font-weight:normal;
display:inline;
}

table.yeartable {
margin-left:280px;
width:80%;
padding:20px;
background:transparent;
}
table.yeartable td.yeardate{
background: transparent;
height:4em;
padding:2px;
text-align:center;
}

table.yeartable td.yearday {
color:#FF85A7;
text-align:center;
font-weight:bold;
border-bottom: 2px ridge #EDFF87;
}

td.yearmonth {color:#91D9FF ; text-align:center; font-variant: small-caps; font-size:16px;}

.yearmonth a, .yearmonth a:link, .yearmonth a:visited {
background:transparent;
padding:3px;
color:#FFFFFF;
text-transform:none;
font-variant: normal;
}

.yearmonth a:hover {
color:#6E6E6E;
text-transform:lowercase;
text-decoration:none;
}
table.yeartable td.yeardate a, table.yeartable td.yeardate a:link, table.yeartable td.yeardate a:visited {background:#transparent;
color: #EDFF87;
text-transform:none;
text-decoration:none;
font-size:12px;
}

table.yeartable td.yeardate a:hover {
color:#FF85A7;
font-size:22px;
text-decoration:none;
}

/****************COMMENTS VIEW*******************/

.datesubjectcomment {
padding:0;
border-bottom: 2px ridge #EDFF87;
}

.userpiccomment {
background:transparent url(http://i762.photobucket.com/albums/xx261/niewiadomadeux/UTF-8Qcomposition5Fbook.png) top left;
float:right;
margin:0 10px 10px 0;
position: relative;
}

.box { margin-left:280px;
font-size:12px;
clear:left;
}

input, textarea:focus {
background-color:#6E6E6E;
color:#FFFFFF;
}

textarea.textbox {width:100%!important;}

.reply{
background:#fff;
margin:5px;
padding:5px;
position:relative;
color:#91D9FF;
text-align:center;
}

.replytosubject {
font-weight:normal;
color:#EDFF87;
font-size:14px;
}

.commentreply {
padding:20px 5px 5px 5px;
color:#91D9FF;
}

.commentbox, .commentboxpartial {
background:#000;
padding:10px;
margin-left:280px;
overflow:auto;
width:80%;
}

.datesubjectcomment a:link, .datesubjectcomment a:visited {
color:#FF85A7;
text-decoration:none;
}

.datesubjectcomment a:hover {
color:#f3f7e8;
font-variant:small-caps;
}

.commentinfo {
background-color:#000;
margin-top:10px;
width: 100%;
}

#qrform table {
border:1px solid #fff!important;
padding:10px;
height:auto;
}

/*************FOOTER, CLEARS & SKIPLINKS*********/

ul.navfooter { padding:5px;
margin:10px; display:inline;}

ul.navfooter li {
display:inline;
list-style:none;
margin-left:0px;
}

#footer li.viewing {
background:#000;
color:#91D9FF;
text-transform:uppercase;
text-decoration:none;
margin:0;
padding:10px;
font-weight:bold;
border:2px groove #6E6E6E;
}

#footer a, #footer a:link, #footer a:visited {
background:#000;
color:#FFFFFF;
text-transform:uppercase;
text-decoration:underline;
font-weight:normal;
margin:0;
padding:10px;
border:2px groove #6E6E6E;
display:inline;
}

#footer a:hover {
background:#6E6E6E;
color:#FF85A7;
font-weight:normal;
text-transform:lowercase;
text-decoration:overline;
border:2px dashed #91D9FF;
}

.clear{
height:0;
background:transparent;
}

.clearfoot {
clear: both;
height:0;
background:transparent;
}

.separator {
height:0;
background:transparent;
}

.skiplinks {
background:transparent;
margin-top:20px;
margin-left:280px;
padding:10px;
color:#000;
font-size:14px;
text-transform:none;
text-align:right;
}

.skiplinks a, .skiplinks a:link, .skiplinks a:visited {
padding:10px;
color:#FFFFFF;
text-decoration:none;
text-transform:none;
border: 1px dashed #fff;
}

.skiplinks a:hover {
color:#FF85A7;
text-transform:uppercase;
text-decoration:none;
}

/***************TINY ICONS & OTHER***************/

.ljuser img {
width: 0;
height: 0;
background: transparent url('http://i762.photobucket.com/albums/xx261/niewiadomadeux/user2_16x16.gif') no-repeat center left;
padding: 17px 16px 0 2px !important;
}

.ljuser img[src*="userinfo.gif"] {
background: transparent url('http://i762.photobucket.com/albums/xx261/niewiadomadeux/user2_16x16.gif') no-repeat center left;
padding: 17px 16px 0 2px !important;
}

.ljuser img[src*="community.gif"] {
background-color:transparent;
background-image: url('http://i762.photobucket.com/albums/xx261/niewiadomadeux/home_16x16.gif');
padding: 17px 15px 0 2px !important;
}

img[src*="syndicated.gif"] {
background-color:transparent;
background-image: url('http://i83.photobucket.com/albums/j302/sansespoir/livejournal/feed.png');
padding: 17px 16px 0 2px !important;
background-position: center left;
background-repeat: no-repeat;
width: 0px;
height: 0px;
}

img[src*="newsinfo.gif"] {
background: transparent url('http://i83.photobucket.com/albums/j302/sansespoir/livejournal/gear.png') no-repeat;
padding: 17px 16px 0 2px !important;
background-repeat: no-repeat;
width: 0px;
height: 0px;
}

img[src="http://l-stat.livejournal.com/img/anonymous.gif"] {
height: 0;
width: 0;
background: url('http://i762.photobucket.com/albums/xx261/niewiadomadeux/anonymous_16x16.gif') no-repeat;
padding: 0px 0px 16px 16px !important;
}

img[src*="openid-profile.gif"] {
height: 0;
width: 0;
background: url('http://i762.photobucket.com/albums/xx261/niewiadomadeux/view_16x16.gif') no-repeat;
padding: 0px 0px 16px 16px !important;
}

img[src="http://l-stat.livejournal.com/img/talk/none.gif"] {
height: 0;
width: 0;
background: url('http://i762.photobucket.com/albums/xx261/niewiadomadeux/attention3_16x16.gif') no-repeat;
padding: 0px 0px 16px 16px !important;
}

#ljuser_row img[src="http://l-stat.livejournal.com/img/userinfo.gif"]{
height: 0;
width: 0;
background: url('http://i762.photobucket.com/albums/xx261/niewiadomadeux/user2_16x16.gif') no-repeat;
padding: 0px 0px 16px 16px !important;

}

img[src*="help.gif"] {
height: 0px;
width: 0px;
padding: 0px 0px 16px 16px !important;
background: url('http://i762.photobucket.com/albums/xx261/niewiadomadeux/support1_16x16.gif') no-repeat scroll 50% 50%;
}

img[src*="pencil.gif"] {
height: 0;
width: 0;
background: url('http://i762.photobucket.com/albums/xx261/niewiadomadeux/edit_16x16.gif') no-repeat;
padding: 0px 0px 16px 16px !important;
}

img[src*="btn_del.gif"] {
height: 0;
width: 0;
background: url('http://i762.photobucket.com/albums/xx261/niewiadomadeux/trash_16x16.gif') no-repeat;
padding: 0px 0px 16px 16px !important;
}

img[src*="btn_edit.gif"] {
height: 0;
width: 0;
background: url('http://i762.photobucket.com/albums/xx261/niewiadomadeux/settings2_16x16.gif') no-repeat;
padding: 0px 0px 16px 16px !important;
}

img[src*="btn_scr.gif"] {
height: 0;
width: 0;
background: url('http://i762.photobucket.com/albums/xx261/niewiadomadeux/image_16x16.gif') no-repeat;
padding: 0px 0px 16px 16px !important;
}

img[src*="btn_unscr.gif"] {
height: 0;
width: 0;
background: url('http://i762.photobucket.com/albums/xx261/niewiadomadeux/image_delete_16x16.gif') no-repeat;
padding: 0px 0px 16px 16px !important;
}

img[src*="btn_track.gif"] {
height: 0;
width: 0;
background: url('http://i762.photobucket.com/albums/xx261/niewiadomadeux/anchor_16x16.gif') no-repeat;
padding: 0px 0px 16px 16px !important;
}

img[src*="btn_tracking.gif"] {
height: 0;
width: 0;
background: url('http://i762.photobucket.com/albums/xx261/niewiadomadeux/anchor_add_16x16.gif') no-repeat;
padding: 0px 0px 16px 16px !important;
}

img[src*="btn_freeze.gif"] {
height: 0;
width: 0;
background: url('http://i762.photobucket.com/albums/xx261/niewiadomadeux/backup_stop_16x16.gif') no-repeat;
padding: 0px 0px 16px 16px !important;
}

img[src*="btn_unfreeze.gif"] {
height: 0;
width: 0;
background: url('http://i762.photobucket.com/albums/xx261/niewiadomadeux/backup_delete_16x16.gif') no-repeat;
padding: 0px 0px 16px 16px !important;
}

img[src*="icon_protected.gif"]{
width: 0;
height: 0;
padding: 0 0 16px 18px;
background: url('http://i762.photobucket.com/albums/xx261/niewiadomadeux/lock_16x16.gif') no-repeat;
}

img[src*="icon_private.gif"]{
width: 0;
height: 0;
padding: 0 0 16px 18px;
background: url('http://i762.photobucket.com/albums/xx261/niewiadomadeux/access_16x16.gif') no-repeat;
}

img[src*="icon_groups.gif"]{
width: 0;
height: 0;
padding: 0 0 16px 16px;
background: url('http://i762.photobucket.com/albums/xx261/niewiadomadeux/lock_16x16.gif');
}

div.ContextualPopup div.Inner {
background:transparent!important;
color: #ababab!important;
border:none;
padding:10px;
width: 250px;
font-family:trebuchet ms;
}

div.ContextualPopup .Content {
padding:7px 10px 7px 10px;
margin-right:80px;
line-height: 1.4;
background:#f3f7e8;
border:1px solid #cccccc;
}

div.ContextualPopup .Userpic {
padding:10px;
background:#f3f7e8;
margin:0px;
border:1px solid #cccccc;
}

div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited {
text-decoration: none !important;
font-weight: normal;
color: #ef9018 !important;
}

div.ContextualPopup .Relation {
letter-spacing:1px;
border-bottom: 1px dashed #cccccc;
margin-bottom:4px;
padding-bottom:4px;
}