s2 Flexible Squares Layout: #001 "Woodyness" + Matching Profile Code

[justcyanide]

Hi there :)



live preview (temporary)


S2 Flexible Squares
Tested in Firefox & Explorer

&Code

/* Cleaned CSS: */
/* Cleaned CSS: */

/*-------------------------------------------------------
LAYOUT: #001 "Woodyness"
by JUSTCYANIDE @ community.livejournal.com/hiddencolours/
***Credit is ***
--------------------------------------------------------*/

/*-----------------BODY-----------------*/

body {
background-color: #1e1e1e;
background: url(http://i46.tinypic.com/n3m5gj.png) repeat scroll;
text-align: justify;
color: #f5f4ef;
font-family: "Verdana", sans-serif;
font-size: 11px;
margin: 9px 0 9px 0;
}

a, a:link, a:visited {
color: #580007;
text-decoration: none;
}

a:hover {
color: #58040a;
text-decoration: none;
}

p, blockquote {
background: url(http://i48.tinypic.com/vifrm0.png);
font-size: 10px;
padding: 18px;
line-height: 13px;
-moz-opacity: .9;
opacity: .6;
filter:alpha(opacity=90);
text-align: justify;
border-top:2px dashed #340004;
}

code, kbd, pre, tt {
font-family: monospace;
}

/*-----------------VIEWS, TITLE & SUBTITLE-----------------*/

div#header a, div#header a:link, div#header a:visited, div#footer a, div#footer a:link, div#footer a:visited {
color: #70030b;
text-transform: uppercase;
font-weight: bold;
font-size: 15px;
padding: 4px;
float: center;
}

div#header a:hover, div#footer a:hover {
color: #70030b;
text-decoration: none;
}

ul.navheader
{
text-align: center;
float: center important!;
padding: 0px;
margin: 0px;
}

ul.navheader li {
float: center important!;
display: inline;
padding: 0 3px 0 3px;
}

.title, .subtitle{
display: none;
}

/*-----------------CONTENT-----------------*/

#content {
width: 720px;
margin-left: auto; margin-right: auto;
background-color: #0b0809
background: url(http://i50.tinypic.com/12149ac.jpg);
padding: 15px;
}

#maincontent {
margin-top: 15px;
font-family: "Verdana", sans-serif;
font-size: 11px;
background-color: #0b0809;
background: url();
color: #70030b;
margin-right: auto;
text-align: left;
}

.clear {
height: 15px;
}

.skiplinks {
text-align: center;
}

.separator{
height: 25px;
}

/*----------------HEADER IMAGE----------------*/

.headerimage {
position: relative;
align: center;
width: 720px;
height: 348px;
margin-bottom: 0px;
margin-left: auto;
margin-right: auto;
background-image: url(http://i48.tinypic.com/2dc7rxl.jpg);
background-position: center;
background-repeat: no-repeat;
}

/*-----------------SIDEBAR-----------------*/

#sidebar {
padding: 15px;
margin-top: 8px;
height: 130px;
background: #1A1A1A;
background: url();
color: #8d8d8d;
text-align: justify;
}

div#sidebar a, div#sidebar a:link, div#sidebar a:visited{
color: #8d8d8d;
font-weight: bold;
}

div#sidebar a:hover {
color: #70030b;
text-decoration: none;
}

.defaultuserpic {
display: none;
}

.sbarheader {
padding: 0px 5px 0px 5px;
}

.sbarbody {
padding: 0px 5px 0px 5px;
}

.sbarbody2 {
padding: 0 15px 0 15px;
}

ul.sbarlist {
display: inline;
text-transform: uppercase;
padding-left: 0px;
margin-left: 20px;
list-style: none;
}
.sbarcalendar {
display: none;
}

.sbarcalendarposts{
display: none;
}

#sidebar_tags {
display: none;
}

#sidebar_summary {
display: none;
}

li.sbaritem {
display: inline;
padding-left: 15px;
list-style: none;
}

li.sbartitle {
display: none;
}

/*-----------------ENTRY-------------*/

.entry {
background: url(http://i48.tinypic.com/34506j6.png);
margin: 0px 10px 10px 30px;
padding: 10px;
background-color: #70030b;
color: #555555;
font-family: "Verdana", sans-serif;
font-size: 11px;
text-align: left;
border-width: 3px;
border-color: #191818;
border-style: dashed;
}

.entry ul li, .entry ol li
{
padding-left: 5px;
margin-left: 15px;
}

/*-----------------USERPICS & FriendsUSERPICS------------*/

.userpic {
position: relative;
float: left;
margin: 0px 10px 0px 10px;
margin-bottom: 20px;
background-color: #080707! important;
padding: 2px;
margin: 10px;
z-index: 15;
border-width: 5px;
border-color: #340004;
border-style: dashed ;
}

.userpicfriends {
position: relative;
float: left;
background-color: #080707 !important;
margin: auto 10px 10px 0px;
border-width: 5px;
border-color: #340004;
border-style: dashed ;
}

.userpicfriends font {
color: #580007;
text-transform: uppercase;
text-align: center;
background-color: #080707;
}

/*-----------------DATE & SUBJECT-----------------*/
.date {
line-height: 50%;
text-transform: uppercase;
text-align: center;
top: 5px;
color: #580007;
font-family: "Verdana", sans-serif;
font-size: 12px;
font-weight: bold;
}

.subject {
text-align: center;
padding-bottom: 5px;
font-size: 20pt;
text-transform: uppercase;
}

.subject a, .subject a:link, .subject a:visited {
color: #70030b;
}

.subject a:hover {
color: #340004;
}

.datesubject {
background-color: #340004;
padding: 5px;
background: url();
}

/*-----------------COMMENT & REPLY-----------------*/

.comments {
font-family: "Verdana", sans-serif;
font-size: 11px;
text-align: right;
background-color: #340004;
padding: 15px 15px 0px 5px;
position: relative;
top: 15px;
}

div.comments a, div.comments a:link, div.comments a:visited{
color: #080707;
font-size: 14px;
padding: 15px -5px 15px 5px;
font-weight: bold;
}

div.comments a:hover {
color: #191818;
text-decoration: none;
}

.datesubjectcomment {
background-color: transparent;
padding: 5px;
margin-top: 20px;
}

.userpiccomment {
position: relative;
float: left;
margin: 0px 10px 0px 10px;
margin-bottom: 20px;
background-color: #080707;
padding: 2px;
margin: 10px;
z-index: 15;
border-width: 5px;
border-color: #340004;
border-style: dashed ;
}

.box {
border-style: solid;
border-width: 1px 0px 0px 0px;
border-color: #999999;
padding: 10px;
clear: left;
}

input, textarea {
background-color: #;
color: #000000;
}

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

.reply {
position: relative;
margin: 20px 30px 10px 30px;
padding: 25px 10px 10px 10px;
text-align: left;
font-family: "Verdana", sans-serif;
font-size: 11px;
line-height: 125%;
background-color: #;
color: #000000;
}

.replytosubject {
font-weight: bold;
}

.commentreply {
position: relative;
margin: 10px;
font-size: 11px;
font-family: "Verdana", sans-serif;
color: #555555;
}

.commentbox {
background: url(http://i48.tinypic.com/34506j6.png);
margin: 0px 10px 10px 30px;
padding: 10px;
background-color: #70030b;
color: #555555;
font-family: "Verdana", sans-serif;
font-size: 11px;
text-align: left;
border-width: 3px;
border-color: #191818;
border-style: dashed;
}

.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #580007;
}

.datesubjectcomment a:hover {
color: #b0b9c8;
}

.commentboxpartial {
border-color: #999999;
border-width: 1px;
border-style: solid;
padding: 10px;
margin: 10px;
background-color: #;
}

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

/*-----------------CALENDAR/ARCHIVE PAGE-----------------*/

ul.year {
text-align: center;
padding-bottom: 40px;
font-weight: bold;
font-size: 15px;
}

ul.year li {
display: inline;
}

table.yeartable {
margin-left: auto;
margin-right: auto;
}

table.yeartable td.yearday {
background-color: transparent important!;
font-weight: bold;
font-size: 12px;
text-transform: uppercase;
text-align: center;
}

td.yearmonth {
border-style: none;
}

/*-----------------FOOTER-----------------*/

#footer {
width: 100%;
text-align: center;
font-family: "Verdana", sans-serif;
font-size: 12px;
font-weight: bold;
letter-spacing: 1px;
background-color: #;
color: transparent;
z-index: 100;
clear: both;
}

ul.navfooter{
padding: 0px;
margin: 0px;
}

ul.navfooter li {
display: inline;
margin: 0 5px 0 5px;
}

.clearfoot {
clear: both;
}

/*----------------LJ USER & COMM ICON ----------------*/
.ljuser img {
height: 0;
padding: 17px 0 0 3px;
background-image: url(http://i47.tinypic.com/10mtu9s.png);
background-repeat: no-repeat;
background-position: left center;
}

/*----------------CURRENTS - MOOD, MUSIC, TAGS----------------*/
.currents, .currentmood, .currentmusic {
font-family: "Verdana", sans-serif;
font-size: 11px;
}

.currents {
background-color: transparent;
}

.currents strong{
font-weight: normal;
font-size: 8pt;
color: #555;
text-transform: lowercase;
}

.currentlocation {
padding-left: 19px;
padding-right: 9px;
padding-bottom: 2px;
padding-top: 8px;
font-size: 8pt;
color: #333;
background: url('http://i46.tinypic.com/xqjfgy.png') 10px 10px no-repeat;
}

.currentmood {
padding-left: 14px;
padding-bottom: 0px;
font-size: 8pt;
color: #333;
background: url('http://i47.tinypic.com/33wkxeq.png') 2px 5px no-repeat;
}

.currentmusic {
padding-left: 16px;
padding-top: 2px;
font-size: 8pt;
color: #333;
background: url('http://i49.tinypic.com/2i8by20.png') 0px 0px no-repeat;
}

.ljtags {
margin-top: 18px;
padding-left: 19px;
padding-bottom: 5px;
padding-top: 2px;
text-transform: lowercase;
font-size: 8pt;
color: #555;
background: url('http://i50.tinypic.com/ffbpro.png') 0px 0px no-repeat;
}

.ljtags a, .ljtags a:link, .ljtags a:visited {
color: #333;
font-size: 11px;
text-transform: none;
}

H2 {
padding: 8px;
color: #70030b;
font-size: 14pt;
text-transform: uppercase;
}

/*-----------------TINY & METADATA ICONS CREDIT-----------------*/
Metadataicons by community.livejournal.com/graphicsbyjulz
TinyIcons can be found here gosquared.com/liquidicity/archives/122

&Instructions (1,2,3!)

#01 Go to Select Journal Stlyle choose any Flexible Squares Layout and Apply Theme.
#02 Go to Customize Your Theme and then go to the Custom CSS section. Select NO in all three options and then paste the code in the Custom Stylesheet Box. Save changes.
#03 Credit justcyanide or hiddencolours. ENJOY &hearts

&Notes
Editing is fine as long as I'm credited for the original layout <3
Metadata icons by graphicsbyjulz & tiny icons can be found here





&Code
http://i46.tinypic.com/n3m5gj.png">


http://i45.tinypic.com/f9ij5e.png" tr height="95" width="400" colspan="20">

#01. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam velit mauris, rhoncus eget ullamcorper nec, volutpat id lorem. Vivamus ornare interdum bibendum. Suspendisse egestas vulputate dignissim. Sed ornare justo nec nisi rhoncus suscipit at sollicitudin nisl.

#02. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam velit mauris, rhoncus eget ullamcorper nec, volutpat id lorem. Vivamus ornare interdum bibendum. Suspendisse egestas vulputate dignissim. Sed ornare justo nec nisi rhoncus suscipit at sollicitudin nisl.

#03. http://community.livejournal.com/hiddencolours/">profilecode x link x link x link

~This is my very first layout, I hope you like it <33
Comments are &hearts ~

Kammie<3