s2 Flexible Squares: #005 "FUnkY"

S2 Flexible Squares
Tested in Chrome, Firefox, Opera & Safari. Looks horrible in Explorer, dunno why.

&Code

/* Cleaned CSS: */

/*-------------------------------------------------------
LAYOUT: #005 "Funky"
by JUSTCYANIDE @ community.livejournal.com/hiddencolours/ 
***Credit is LOVE*** 
--------------------------------------------------------*/

/*-----------------BODY-----------------*/		
	
	body	{
		background-color: #0e0e0e;
		background: url(http://i49.tinypic.com/jax6va.png)repeat;
		font-family: "courier new", sans-serif;
		font-size: 20px;
		margin: 10px 0 9px 0;
		text-align: justify;
		}

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

a:hover {
		color: #fee300;
		}
	
	blockquote {
		background: url(http://i49.tinypic.com/2w3yiip.jpg) -9px -35px no-repeat; 
		border-bottom-width: 4px;
		border-bottom-style: double;
		border-bottom-color: #2cd1f4;
		color: #585858;
		font-size: 11px;
		line-height: 12px; 
                padding: 8px 15px 7px 49px; 
		text-align: justify;
				}
		
	code, kbd, pre, tt {
	    	font-family: courier new;
		}

/*-----------------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 {
		text-transform: uppercase;
		font-style: italic;
		font-size: 23px;
		color: #404040;
		float: left;
		background: url(http://i48.tinypic.com/2wn1q87.jpg);
		}

div#header li {
		border-bottom: 4px solid #2cd1f4;
		border-top: 4px solid #fb5593;
		background: url(http://i48.tinypic.com/2wn1q87.jpg);		
		text-transform: uppercase;
		font-style: italic;
		font-size: 23px;
		float: left;
		margin-left: 10px;
			}

div#header li + li{
		text-transform: uppercase;
		font-style: italic;
		font-size: 23px;
		float: left;
		border-top: 4px solid #fff000;
		border-bottom: 4px solid #8bed09;
					}

div#header li + li + li {
		border-top: 4px solid #8bed09;
		border-bottom: 4px solid #fb5593;
		color: #fb5593; 
		}

div#header li + li + li +  li{
		border-top: 4px solid #2cd1f4;
		border-bottom: 4px solid #fff000;
		color: #a7f442;
		}

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

ul.navheader 
		{	
		text-align: center;
		float: center important!;
		padding: 0px;	
			}
	
	ul.navheader li  {
		display: inline;			
		padding: 0px 10px 0px 10px;
		}

.title{
		background: url(http://i48.tinypic.com/2wn1q87.jpg);		
		height: 39px;
		color: #2cd1f4;
		width: 850px;
		padding-left: -10px; 
		margin-top: -75px;
		font-weight: bold;
		font-size: 30px;
		text-transform: uppercase;
		font-family: garamond;
		float: right;
		border-top: 4px solid #fff000;
		}
	
	.subtitle{
		text-transform: uppercase;
		color: #fb5593;
		width: 120%;
		margin-top: -48px;
		font-weight: bold;
		font-size: 13px;
		font-family: arial;
		float: right;
		}

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

#content {  	
		width: 650px;
		padding: 35px;
		margin-left: 210px; margin-right: auto;
		}

#maincontent {	 	
		margin-top: 125px;
		font-family: "Verdana", sans-serif;
		font-size: 11px;
		background-color: 
		color: #;
		margin-right: auto;
		text-align: left;
		}

.clear {		
		height: 35px;
		}
		
	.skiplinks {
		text-align: center;
		color: #a6a6a6;
		background: url(http://i45.tinypic.com/2zh4m8j.png);
		padding: 10px;
		margin: 0px 10px 0px 10px; 
		}
		
	.separator{
		height: 100%;
		}

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

/*-----------------SIDEBAR-----------------*/
	#sidebar { 
		border-bottom: 5px dashed #fff000;   
		border-top: 16px solid #8bed09; 
		float: left; 
		width: 160px;
		background: url(http://i48.tinypic.com/2wn1q87.jpg);
		font-size: 11px; 
		font-family: "courier new", serif;
		color: #7c7c7c;
		text-transform: uppercase;
		text-align: center; 
		margin: 100px 0px 0px -220px; 
		padding: 20px;
		position: absolute;
		}

div#sidebar a, div#sidebar a:link, div#sidebar a:visited{
		color: #8bed09;	
		font-weight: bold;
		text-transform: uppercase;
 		}

div#sidebar a:hover {
		color: #2cd1f4;
			}
	
	.defaultuserpic {
		margin: 10px;
		float: right;
	        margin: 5px 20px 10px 10px; 
	        background-color: #8bed09 important;
		border-width: 10px;
			border-color: #2cd1f4;
		border-style: solid;
				}
			
	.sbarheader {
		padding: 0px 5px 0px 5px;
		}
	
	.sbarbody {
		padding: 0px 5px 0px -5px;		
		}
	
	.sbarbody2 {
		padding: 0 5px 0 15px;
		}

ul.sbarlist {
		padding-left: 0px;
		margin-left: 0px;
		list-style: none;
		}

.sbarcalendar {
               	background-color: #fb5593;	
		font-size: 17px;
		color: #fff000;	
		font-weight: bold;
		padding: -5px;
		text-align: center;
		               }

.sbarcalendarposts{ 
	 	background-color: #fb5593;
		font-size: 17px;  
		}

#sidebar_tags 	{
		display: none;
		 }

#sidebar_summary {
		display: none;
		}

li.sbaritem {
		list-style: none;
		font-size: 18px;
		color: #faf1de;		
		}

li.sbartitle {
		display: none;
		}

.lj-view-tags #sidebar{
		display: none;
		}

.lj-view-archive #sidebar{
		display: none;
		}

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

.entry	{
		margin: 10px 10px 20px 10px;
		padding: 35px;
		background: url(http://i48.tinypic.com/2wn1q87.jpg);
		color: #7d7d7d;
		font-family: "courier new", serif;
		font-size: 13px;
		text-align: justify;
				}

.entrytext {
		padding: 20px;
		}

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

i {font: italic 14px courier new; color: #2cd1f4; }
	a {text-decoration: none;}
	b {font: bold 14px courier new; color: #fb5593;}
	strike {font-size: 14px; font-weight: bold; color: #fee300; }
	u {font-size: 14px; color: #8bed09; }

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

.userpic {
		margin: 10px;
		float: right;
	        margin: 5px 20px 10px 10px; 
	        background-color: #8bed09 important;
		border-width: 6px;
			border-color: #8bed09;
			border-style: solid;
			}

.userpicfriends {
		float: right;
	        margin: 70px 20px 10px 10px;
 		border-width: 6px;
		border-color: #8bed09;
		border-style: solid;
		}

.userpicfriends font {
		font-size: 10px;
		text-transform: uppercase;
		color: #898989;
		background: url(http://i48.tinypic.com/2wn1q87.jpg);
		text-align: center;
		background-color: transparent #important;
		}

/*-----------------DATE & SUBJECT-----------------*/
	.date {		
		text-align: center;
		top: 15px;
		color: #2cd1f4;
		font-family: "Verdana", sans-serif;
		font-size: 13px;
		padding-left: 20px; 
		margin-left: 10px;
		margin-bottom: -5px;
		font-family: courier new;
		text-transform: uppercase;
		margin-right: 10px;
		background: url(http://i45.tinypic.com/2zh4m8j.png);
		font-weight: bold;
		}
	
	.subject,  .subject a {	
		background: url(http://i45.tinypic.com/2zh4m8j.png);
		text-align: left;	
		margin-left: 10px;
		margin-top: 1px;
		margin-right: 10px;
		padding-bottom: -20px;	
		margin-bottom: -10px; 
		padding-left: 10px;
		color: #fb5593;
		font-weight: bold;
		border-bottom: 4px double #acacac; 
		text-transform: uppercase; 
		font-size:  17pt; 
		letter-spacing: -1px;
		}
	
	.subject a:hover {
		color: #fff000;
		}

.lj-view-entry .title, .subtitle {
		display: none;
		}

.lj-view-friends .title, .subtitle{
		display: none;
		}

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

.comments {
		text-align: left;
		text-transform: uppercase;
		font-family: courier new;
		margin: 9px 15 9px -10px;
		padding-right: -5px;
		}

div.comments a, div.comments a:link, div.comments a:visited{
		color: #8bed09;
		font-weight: bold;
		font-size: 13px;
		font-family: courier new;
		padding: 1px -5px 1px 15px;
		text-transform: uppercase;
		font-weight: bold;
	        }

div.comments a:hover {
		color: #fb5593;
		}

.datesubjectcomment {	
		text-transform: uppercase;	
		font-size: 12px;		
		background-color: transparent;
		padding: 3px;
		color: #8bed09;
		border-bottom: 4px double #7c7c7c;
		margin-top: 20px;
		}

.userpiccomment {
		float: left;
                margin: 5px 20px 10px 10px; 
	        background-color: #a6a6a6;
		border-width: 8px;
		border-color: #fff000;
		border-style: solid;	
		}

.skiplinks {
                color: #b1b1b1;
                }
 
	.box {
		padding: 10px;
		clear: left;
		}

input, textarea {
		background: url(http://i45.tinypic.com/2zh4m8j.png);
		background-color: #0e0e0e;
		color: #404040;
		}
		
	textarea.textbox  {
		background: url(http://i48.tinypic.com/2wn1q87.jpg);
      		width: 100% !important;
		color: #404040; 
   		}
	
	.reply	{
		background: url();
		margin: 0px 10px 10px 10px;
		padding: 20px;
		background-color: #;
		color: #585858;
		border-bottom-width: 10px;
		border-bottom-style: solid;
		border-bottom-color: #0c0c0c;
		font-family: "courier new", serif;
		font-size: 13px;
		text-align: left; 
		}
		
	.replytosubject {
		font-weight: bold;
		}
			
		
	.commentreply {
		position: relative;
		margin: 10px;
		font-size: 14px;
		font-family: "courier new", serif;
		color: #7c7c7c;
		}

.commentbox {
		background-color: #0e0e0e;
		background: url(http://i48.tinypic.com/2wn1q87.jpg);
		font-size: 15px;
		margin: 10px 0 9px 0;
		text-align: justify;
		}
			
	.datesubjectcomment a:link, .datesubjectcomment a:visited {
		color: #404040;
		}
		
	.datesubjectcomment a:hover {
		color: #767676;
		}
	
	.commentboxpartial {
		border-color: #a6a6a6; 
		border-width: 1px; 
		border-style: solid; 
		padding: 10px; 
		margin: 10px; 
		background-color: #;
		}

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

/*-----------------CALENDAR/ARCHIVE PAGE-----------------*/
		
	ul.year {
		text-align: center;
		padding-bottom: 40px;
		color: #fb5593;
		font-family: "times new roman", serif;
		font-size: 25px;
		font-style: italic;
		font-weight: bold;
		}
	
	ul.year li {
		background: url(http://i48.tinypic.com/2wn1q87.jpg);
		display: inline;
		border-bottom: 5px solid #8bed09;
		}
	
	table.yeartable {
		background: url(http://i48.tinypic.com/2wn1q87.jpg);
		margin-right: auto;
		}
		
	table.yeartable td.yearday {
		border-bottom: dashed 3px #;
		background: url(http://i48.tinypic.com/2wn1q87.jpg);
		padding: 15px;
		color: #8bed09;
		font-family: courier new;
		font-size: 23px;
		text-align: left;
		
		}
	
	td.yearmonth {
		font-size: 17px;
		font-weight: bold;
		padding-left: 10px; 
		text-transform: uppercase;
		color: #fb5593;
		font-family: "courier new", serif;
			}

td.yearday {
		font-size: 15px;
		color: #2cd1f4;
		font-family: "courier new", serif;
		font-style: italic;
		font-weight: bold;
		}

td.yeardate {
		border-bottom: 2px dashed #fff000; 
		font-size: 14px;
		background: url();
		color: #fb5593;
		font-family: "courier new", serif;
		font-style: italic;
		font-weight: bold;
		}

.yeardate a {
		font-size: 15px;
		margin-left: 50px;
		margin-top: 25px;
		font-style: normal;
		color: #2cd1f4;
					}

.yeardate a:hover {
		color: #8bed09;
		}

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

#footer {			
		width: 100%;
		text-align: center;
		font-family: "courier new", 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: 10px 00px 5px 0px;
		  margin-right: -3px;
		  background-image: url(http://i45.tinypic.com/noyhrn.jpg);
		  background-repeat: no-repeat;
		  background-position: left center;
	          }

/*----------------LJ CONTROL STRIP---------------*/

#lj_controlstrip  { 
		  height: 0;
		  padding: 10px 00px 5px 0px;
         	  margin-right: -3px; 
		  color: #898989;
		  background-color: transparent;
		background: url(http://i48.tinypic.com/2wn1q87.jpg);
		  background-position: left center;
	          }

#lj_controlstrip a {
		color: #898989;
		}

#lj_controlstrip a:hover {
		color: #767676;
		}

#lj_controlstrip_statustext {
		color: #898989;
		}

.ljuser img[src*="userinfo.gif"] {
		background: transparent url(http://i45.tinypic.com/noyhrn.jpg) no-repeat center left !important;  
		padding: 18px 4px 0 0px !important; 
		margin-right: -8px !important; 
		}

.ljuser img[src*="community.gif"] {
		background: transparent url(http://i45.tinypic.com/noyhrn.jpg) no-repeat center left !important;  
		padding: 18px 4px 0 0px !important; 
		margin-right: -8px !important; 
		}

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

.currents {
		background-color: transparent;
		}

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

.currentlocation {
		padding-left: 14px;
		padding-top: 8px;
		font-size: 8pt;
		color: #333;
		background: url('http://i46.tinypic.com/xqjfgy.png') 0px 11px no-repeat;
		}

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

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

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

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

.ljtaglist { 
border-bottom: 6px solid #fb5593; 
background: url(http://i48.tinypic.com/2wn1q87.jpg);
		margin-right: auto;
		color: #8bed09; 
		font-size: 18px;
		text-transform: none; 
		}

H2 { 
border-bottom: 6px solid #fee300; 
background: url(http://i48.tinypic.com/2wn1q87.jpg);
		padding: 8px; 
		color: #fb5593; 
		font-size: 20pt; 
font-family: courier new;
		text-transform: uppercase; 
		}

/*-----------------BACKGROUND, TINY & METADATA ICONS CREDIT-----------------*/
	Metadataicons by community.livejournal.com/graphicsbyjulz
	TinyIcons by  pinvoke.com

#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
~I don't know why this looks so bad in Explorer, I have had my fair share of trouble with explorer and its stubbornness against layouts (hehe) before, but never like this. HUGH. Sorry if you use IE, I wish I knew what the hell is wrong with my code :(

~Editing is fine as long as I'm credited for the original layout <3

~If you want to add a header just paste this where it says "header" :)

~Metadata icons by graphicsbyjulz & tiny icons by Pinvoke.

Hope you like it <3
Watch

hiddencolours for updates :)
Comments are &hearts ~

Kam~

ETA: I re-uploaded the code 'cause I had forgotten to code the name and community links in the friends page. OOPS ^^U

layouts

Follow us:

Applications

COMPANY

PRODUCTS

COMMUNITY

CHOOSE LANGUAGE