layoutlounge | 26. Supernatural Wintery Mist

sireesanwar.livejournal.com posting in

Layout Style: S2 Flexible Squares - with sidebar
Use Layout Stylesheet?: No
Custom external stylesheet?: No
Use external stylesheets?: No
Layout Width: 750 px
Requested By:

flexible_square
Header Credit:

serenitysangel!!!

Click for Live Preview or Click Here to see a version with bigger text.

Small Text Layout

/*------------------------------------------------------------------
S2 Flexible Squares
Layout by sireesanwar @ http://community.livejournal.com/layout_lounge/
PLEASE DO NOT REMOVE THIS SECTION 
--------------------------------------------------------------------*/

body{
	background-color: #222222;
        background-image: url(BACKGROUND IMAGE URL HERE);
        background-repeat: repeat;
	color: #565656;
	font-family: "Trebuchet ms", arial, verdana, sans-serif;
	font-size: 12px;
        margin: 20px 0 20px 0;
	}

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

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

blockquote {
		padding: 18px; 
		border: 0px dotted #022d4c; 
		color: #565656;
		font-size: 12px;
		line-height: 13px;
		font-family: "Trebuchet ms", arial, verdana, sans-serif;
		background: #212121;
		text-align: justify;
		}
b, i, s, u, em, strong
{
color: #055d9d;
}

p, td{
	}
	
code, kbd, pre, tt {
		font-family: monospace;
	}
	
ul.ljtaglist {
	text-align: left;
	padding-left: 5px;
}

/*-----------------------
SECTION: In General
-------------------------*/
	
#content {  	
	width: 750px;	
	margin-left: auto; 
        margin-right: auto;  
	text-align: justify;
        padding: 0px;
        background-color: #191919;
	border-color: #444444;
	border-style: dotted;
	border-width: 0px 1px 1px 1px;
}

#maincontent {
	width: 530px;
	float: right;
	margin: 10px 0px 0px 10px;
	font-family: "Trebuchet ms", arial, verdana, sans-serif;
	font-size: 11px;
	color: #565656;
	text-align: center;
	}

.subcontent {
        background-color: #191919;
        width: 512px;
	border-top: 0px dotted #022d4c;
	border-bottom: 1px dotted #022d4c;
	border-left: 0px dotted #022d4c;
	border-right: 0px dotted #022d4c;
}

/*-----------------------
SECTION: Header
-----------------------*/

#header {		
	position: relative;
	line-height: 35px;
	text-align: center;
        color: #555555;
	font-family: "Dirty Ego";
	font-size: 15px;
	width: 100%;
	padding: 0px 0px 10px 0px;
	margin-bottom: 15px;
	text-align: center;
	letter-spacing: 1px;
        text-transform: uppercase;
	border-bottom: 0px dotted #022d4c;
}

div#header a, div#header a:link, div#header a:visited, div#footer a,

div#footer

div#header a, div#header a:link, div#header a:visited, div#header a:active {
	padding: 9px;
	font-family: "Dirty Ego";
	font-size: 15px;
	font-weight: normal;
	text-transform: uppercase;
	letter-spacing: -1px;
	color: #555555;
	text-align: center;
	background-color: #191919;
}

div#header a:hover {
	padding: 9px;
	color: #000000;
	background-color: #30658c;
	border-bottom: 0px dotted;
}

ul.navheader 
	{	
	padding: 10px 0px 0px 0px;
        background-color: #191919;	
	margin: 0px;
	}

ul.navheader li  {
	display: inline;
	padding: 10px 0px 0px 0px;
        background-color: #191919;
	margin: 0 2px;
	}
	
.title, .subtitle {
		display: none;
		}

/*-----------------------
SECTION: Footer
-----------------------*/

#footer {			
	width: 100%;
	margin: 0px;
	text-align: center;
	font-family: "georgia";
	font-size: 10px;
	color: #555555;
	z-index: 100;
	}

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

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

.clearfoot {		
	clear: both;
	}

/*-----------------------
SECTION: Sidebar
-------------------------*/

#sidebar {
	padding: 0px 0 10px 0; 
        background-color: #191919;
	margin-left: 5px;
	font-family: "Trebuchet ms", arial, verdana, sans-serif;
	font-size: 10px;
	color: #565656;
	width: 200px;
	float: left;
	text-align: left;
        text-transform: normal;
	border-top: 0px dotted #022d4c;
	border-bottom: 1px dotted #022d4c;
	border-left: 0px dotted #022d4c;
	border-right: 1px dotted #022d4c;
	}

#sidebar .sbarcalendarposts a, #sidebar .sbarcalendarposts a:link,

.sbarcalendarposts

a:visited{
	padding: 0px;
	text-align: center;
	}

#sidebar .sbarcalendarposts a:hover {
	padding: 0px;
	text-align: center;
	}
		
#sidebar_tags .sbarcontent {
         height: 300px;
         overflow:auto;
}

div#sidebar a, div#sidebar a:link, div#sidebar a:visited{
	color: #30658c;
	display: block;
	padding: 1px 1px 1px 0px;
	text-decoration: none;
		}

div#sidebar a:hover {
	padding: 1px 1px 1px 0px;
	color: #777777;
}

.defaultuserpic {
	text-align: center;
	}

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

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

.sbarbody2 {
	padding: 0 15px 0 15px;
	}
		
table.calendar {
	margin-right: auto;
	margin-left: auto;
	}
	
.sbarcalendar {
	padding: 1px;
	border: 1px dotted #022d4c;
	text-align: center;
	font-family: "Trebuchet ms", arial, verdana, sans-serif;
	font-size: 9px;
	}

.sbarcalendarposts {
	padding: 1px;
        border: 1px dotted #022d4c;
	background-color: #191919;
	text-align: center;
	font-family: "Trebuchet ms", arial, verdana, sans-serif;
	font-size: 9px;
	}
	
ul.sbarlist {
	padding-left: 0px;
	margin-left: 0px;		
        list-style: none;
	}

li.sbaritem {
	padding-left: 0px;
        border-bottom: 0px dotted #022d4c;
	list-style: none;
        }

li.sbartitle {
	padding: 3px 5px 3px 5px;
	margin: 10px 0 10px 0;
        background-color: #222222;
	list-style: none;
	text-align: center;
	color: #555555;
        border-top: 0px dotted #022d4c;
        text-transform: normal;
	font-family: "Pea Alesa";
	font-size: 12px;
		}

ul.tagList {width: 100%;}
    .tagBox {
      height: 300px;
      overflow-x: hidden;
      overflow-y: scroll; 
      scrollbar-arrow-color: #30658c;
      scrollbar-base-color: #191919;
      scrollbar-face-color: #191919;
      scrollbar-highlight-color: #30658c;
      scrollbar-darkshadow-color: #555555;
      scrollbar-shadow-color: #555555;
}

#sidebar_summary li.sbaritem {
	color: #555555;
	border: 1px dotted #022d4c;
	background-color: #191919;
	padding: 3px;
	text-transform: normal;
	margin: 3px 0px;
	}

#sidebar_summary li.sbaritem a {
	text-decoration: none;
	display: inline !important;
	color: #555555;
	border: 0px dotted #022d4c !important;
	background-color: transparent !important;
	}

#sidebar_summary li.sbaritem a: hover{
	text-decoration: none;
	color: #007ba7;
	border: 0px dotted #022d4c;
	background-color: transparent !important;
	}

/*-----------------------
SECTION: Entries
-------------------------*/

.entry	{
        padding: 10px;
	margin: 0px;
	color: #565656;
	font-family: "arial";
	font-size: 11px;
	text-align: justify;
	}
	
hr {
	color: transparent;
	height: 1px;
	border-style : none; 
	border-bottom: 2px dotted #022d4c;
	}

.entry ul li, ol li, li {
	padding-left: 5px;
	margin-left: 5px;
	list-style: normal;
	list-style-position: outside;
	}

.userpic {
	background-color: #191919 !important;
	position: relative;
	float: right;
	padding: 5px;
	margin: 10px;
	z-index: 15;
        color: #555555 !important;
	border: 1px #115578 dotted;
	}

.userpicfriends {
	background-color: #191919 !important;
	position: relative;
	float: right;
	padding: 5px;
	margin: 10px;
	text-align: center;
	font-family: "Trebuchet ms", arial, verdana, sans-serif;
	font-size: 12px;
	z-index: 15;
	border: 1px #115578 dotted;
	}

.userpicfriends a font {
	color: #5898c6;
}

.date {
	padding-top: 5px;
	padding-bottom: 5px;
	text-align: left;
        color: #565656;
	top: 5px;
	font-family: "Trebuchet ms", arial, verdana, sans-serif;
	font-size: 9px;
	text-transform: uppercase;
	}

.subject {
        background-color: #191919;
	font-weight: none;
	padding-bottom: 5px;
	padding-top: 5px;
        padding-left: 10px;
	color: #30658c;
	font-family: "Pea Alesa";
	font-size: 14px;
	text-transform: normal;
        text-decoration: underline;
	border-bottom: 0px dotted #022d4c;
	border-right: 0px dotted #022d4c;
	}
	
.subject a, .subject a:link, .subject a:visited {
	color: #30658c;
	}

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

.datesubject {
	background-color: transparent;
	padding: 0px;
	text-align: left;
	border-left: 0px dotted #022d4c;
	border-right: 0px dotted #022d4c;
	border-top: 0px dotted #022d4c;
        }

span.ljuser a b {
	padding: 2px 0 2px 0;
	color: #30658c;
	font-weight: bold;
	}

span.ljuser a:hover b {
	padding-top: 2px;
	padding-bottom: 2px;
	color: #777777;
	font-weight: lighter;
	}

/*-----------------------
SECTION: Currents, tags, comment links
-------------------------*/

.ljtags {
	margin-top: 5px;
	color: #555555;
	font-weight: lighter;
	text-transform: lowercase;
        margin: 15px 0px 0px 0px;
        padding: 5px 0px 5px 17px;
        background:

url(http://i77.photobucket.com/albums/j49/SireesAnwar/TinyIcons/tag_orange.png)

no-repeat center left;
	}
	
.currents strong, .currentmood strong, .currentmusic .currentlocation,

.ljtags strong

{
	font-family: "Silkscreen";
	font-size: 10px;
	color: #555555;
	font-weight: lighter;
	text-transform: lowercase;
	}

.currents, .currentmood, .currentmusic, .currentlocation {
	font-family: "Silkscreen";
	font-size: 10px;
	color: #555555;
	font-weight: lighter;
	text-transform: lowercase;
	}

.ljtags a, .ljtags a:link, .ljtags a:visited {
	font-family: "Silkscreen";
	font-size: 10px;
	color: #30658c;
	text-transform: lowercase;
	font-weight: lighter;
	}

.currentlocation a, .currentlocation a:link, .currentlocation a:visited {
	font-family: "Silkscreen";
	font-size: 10px;
	color: #30658c;
	text-transform: lowercase;
	font-weight: lighter;
	}
	
.currentlocation a:hover, .ljtags a:hover {
	font-family: "Silkscreen";
	font-size: 10px;
	color: #777777;
	font-weight: lighter;
	text-transform: lowercase;
	}

.comments {
	font-family: "king cool KC";
	font-size: 12px;
	text-align: center;
	padding: 5px 5px 5px 5px;
	position: relative;
	clear: center;
	margin-top: 5px;
	text-transform: lowercase;
	border-bottom: 1px #191919 dotted;
	}
	
div.comments a, div.comments a:link, div.comments a:visited{
	color: #30658c;
}

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

/*-----------------------
SECTION: Comments Page
-------------------------*/

.box {
	padding: 10px;
	margin-top: 0px;
	text-align: left;
        clear:right;
	}

form div.box {
	text-align:center;
}

.skiplinks {
	text-transform: normal;
	text-align: center;
	padding: 10px 0 10px 0;
	}

.datesubjectcomment {
	margin-top: 20px;
	text-align: right;
	padding: 5px;
        background-color: #222222;
        color: #dddddd;
	}	
	
.userpiccomment {
	background-color: #222222 !important;
	position: relative;
	top: -30px;
	left: 0px;
	padding: 5px;
	margin: 20px 10px -20px 10px;
	z-index: 15;
	float: right;
	border: 1px #115578 dotted;
	color: $555555;
	}

div#content input,
div#content textarea,
div#content select {
	color: #555555;
	border: 1px dotted #022d4c;
	background-color:#222222;
	}
	
textarea.textbox  {
	width: 100% !important;
	}

.reply	{
	position: relative;
	margin: 20px 30px 10px 30px;
	padding: 25px 10px 10px 10px;
	text-align: left;
	font-family: "Trebuchet ms", arial, verdana, sans-serif;
	font-size: 12px;
	line-height: 125%;
	color: #565656;
	}
	
.replytosubject {
	color: #666666;
	font-weight: bold;
	text-transform: normal;
        padding: 5px;
        background-color: #222222;
	}

.replytoposter {
        background-color: #222222;
	color: #565656;
	text-transform: normal;
        padding: 5px;
}

.commentreply {
        text-align: justify;
	position: relative;
	margin: 10px;
	font-family: "Trebuchet ms", arial, verdana, sans-serif;
	font-size: 12px;
	color: #565656;
	}
	
.commentbox {
	padding: 5px;
	margin: 10px;
	text-align: left;
        background-color: #222222;
	border: 1px dotted #022d4c;
	}
	
.datesubjectcomment a:link, .datesubjectcomment a:visited {
	color: #30658c;
	}
	
.datesubjectcomment a:hover {
	color: #777777;
	}

.commentboxpartial {
	padding: 10px; 
	margin: 10px; 
        background-color: #222222;
	}

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

/*-----------------------
SECTION: Year/Archive Page
-------------------------*/

ul.year {
	text-align: center;
	padding: 20px 0 20px 0;
	}

ul.year li {
	display: inline;		
	}

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

table.yeartable td.yeardate, table.yeartable td.yearday {
	border: 1px dotted #022d4c;
	color: #555555;
	}

table.yeartable td.yearday {
	text-align: center;
	color: #555555;
	}

td.yearmonth {
	color: #555555;
	border-style: none;
	}

/*-----------------------
SECTION: Tags Page
-------------------------*/

ul.ljtaglist {
	color: #555555;
	font-family: "Trebuchet ms", arial, verdana, sans-serif;
	font-size: 10pt;
	padding-left: 12px;
	padding: 8px;
	}

ul.ljtaglist li  {
	list-style: none;
	}

/*-----------------------
SECTION: Tiny Icons
-------------------------*/

.subject img[src=http://stat.livejournal.com/img/icon_protected.gif]{
	width: 0;
	height: 0;
	padding: 12px 9px 0px 0px !important;
	background: url();
	}

.subject img[src=http://stat.livejournal.com/img/icon_private.gif]{
	width: 0;
	height: 0;
	padding: 9px 9px 0px 0px !important;
	background: url();
	}

.ljuser img { 
	width: 0;
	height: 0;
	background-repeat: no-repeat;
	background-color:transparent;
	background-image: url(); 
	padding: 12px 7px 0 2px !important;
	}

.ljuser img[src=http://stat.livejournal.com/img/userinfo.gif] {
	background-color:transparent;
	background-image: url(); 
	padding: 12px 7px 0 2px !important;
	}

.ljuser img[src=http://stat.livejournal.com/img/community.gif] {
	background-color:transparent;
	background-image: url(); 
	padding: 11px 11px 0 2px !important;
	}

/*-----------------------
SECTION: Mics
-------------------------*/

.clear {
	height: 7px;
	font-size: 0.01px;
	}
	
#lj_controlstrip td {
	font-family: georgia !important;
	font-size: 10px;
	background-color: #191919 !important;
	border: 1px solid #333333;
	}

#lj_controlstrip a {
	font-family: georgia !important;
	font-size: 10px;
	color: #666666!important;
	text-transform: lowercase;
	}

.headerimage {
          position: relative;
	border-color: #444444;
	border-style: dotted;
	border-width: 1px 1px 0px 1px;
	 width: 750px;
	 height: 300px;
         padding-left: 0px;
         padding-right: 0x;
         padding-bottom: 0px;
         padding-top: 0px;
         margin-left: auto;
         margin-right: auto;
         margin-top: 1px;
         background-color: #191919;
	 background-image: url(YOUR HEADER URL HERE);
	 background-position: center;         
         background-repeat: no-repeat;
            }

.separator {
          height: 20px;
         }

Larger Text Layout

body{
	background-color: #222222;
        background-image: url(BACKGROUND URL HERE);
        background-repeat: repeat;
	color: #565656;
	font-family: "Trebuchet ms", arial, verdana, sans-serif;
	font-size: 12px;
        margin: 20px 0 20px 0;
	}

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

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

p, td{
	}
	
code, kbd, pre, tt {
		font-family: monospace;
	}
	
ul.ljtaglist {
	text-align: left;
	padding-left: 5px;
}

#maincontent {
	width: 530px;
	float: right;
	margin: 10px 0px 0px 10px;
	font-family: "Trebuchet ms", arial, verdana, sans-serif;
	font-size: 12px;
	color: #565656;
	text-align: center;
	}

/*-----------------------
SECTION: Header
-----------------------*/

#header {		
	position: relative;
	line-height: 35px;
	text-align: center;
        color: #555555;
	font-family: "Dirty Ego";
	font-size: 25px;
	width: 100%;
	padding: 0px 0px 10px 0px;
	margin-bottom: 15px;
	text-align: center;
	letter-spacing: 1px;
        text-transform: uppercase;
	border-bottom: 0px dotted #022d4c;
}

div#header a, div#header a:link, div#header a:visited, div#footer a,

div#footer

div#header a, div#header a:link, div#header a:visited, div#header a:active {
	padding: 9px;
	font-family: "Dirty Ego";
	font-size: 25px;
	font-weight: normal;
	text-transform: uppercase;
	letter-spacing: -1px;
	color: #555555;
	text-align: center;
	background-color: #191919;
}

div#header a:hover {
	padding: 9px;
	color: #000000;
	background-color: #30658c;
	border-bottom: 0px dotted;
}

ul.navheader 
	{	
	padding: 10px 0px 0px 0px;
        background-color: #191919;	
	margin: 0px;
	}

ul.navheader li  {
	display: inline;
	padding: 10px 0px 0px 0px;
        background-color: #191919;
	margin: 0 2px;
	}
	
.title, .subtitle {
		display: none;
		}

/*-----------------------
SECTION: Footer
-----------------------*/

#footer {			
	width: 100%;
	margin: 0px;
	text-align: center;
	font-family: "georgia";
	font-size: 10px;
	color: #555555;
	z-index: 100;
	}

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

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

.clearfoot {		
	clear: both;
	}

/*-----------------------
SECTION: Sidebar
-------------------------*/

#sidebar {
	padding: 0px 0 10px 0; 
        background-color: #191919;
	margin-left: 5px;
	font-family: "Trebuchet ms", arial, verdana, sans-serif;
	font-size: 11px;
	color: #565656;
	width: 200px;
	float: left;
	text-align: left;
        text-transform: normal;
	border-top: 0px dotted #022d4c;
	border-bottom: 1px dotted #022d4c;
	border-left: 0px dotted #022d4c;
	border-right: 1px dotted #022d4c;
	}

#sidebar .sbarcalendarposts a, #sidebar .sbarcalendarposts a:link,

.sbarcalendarposts

a:visited{
	padding: 0px;
	text-align: center;
	}

#sidebar .sbarcalendarposts a:hover {
	padding: 0px;
	text-align: center;
	}
		
#sidebar_tags .sbarcontent {
         height: 300px;
         overflow:auto;
}

div#sidebar a, div#sidebar a:link, div#sidebar a:visited{
	color: #30658c;
	display: block;
	padding: 1px 1px 1px 0px;
	text-decoration: none;
		}

div#sidebar a:hover {
	padding: 1px 1px 1px 0px;
	color: #777777;
}

.defaultuserpic {
	text-align: center;
	}

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

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

li.sbaritem {
	padding-left: 0px;
        border-bottom: 0px dotted #022d4c;
	list-style: none;
        }

#sidebar_summary li.sbaritem {
	color: #555555;
	border: 1px dotted #022d4c;
	background-color: #191919;
	padding: 3px;
	text-transform: normal;
	margin: 3px 0px;
	}

#sidebar_summary li.sbaritem a {
	text-decoration: none;
	display: inline !important;
	color: #555555;
	border: 0px dotted #022d4c !important;
	background-color: transparent !important;
	}

#sidebar_summary li.sbaritem a: hover{
	text-decoration: none;
	color: #007ba7;
	border: 0px dotted #022d4c;
	background-color: transparent !important;
	}

/*-----------------------
SECTION: Entries
-------------------------*/

.entry	{
        padding: 10px;
	margin: 0px;
	color: #565656;
	font-family: "arial";
	font-size: 12px;
	text-align: justify;
	}
	
hr {
	color: transparent;
	height: 1px;
	border-style : none; 
	border-bottom: 2px dotted #022d4c;
	}

.entry ul li, ol li, li {
	padding-left: 5px;
	margin-left: 5px;
	list-style: normal;
	list-style-position: outside;
	}

.userpic {
	background-color: #191919 !important;
	position: relative;
	float: right;
	padding: 5px;
	margin: 10px;
	z-index: 15;
        color: #555555 !important;
	border: 1px #115578 dotted;
	}

.userpicfriends a font {
	color: #5898c6;
}

.date {
	padding-top: 5px;
	padding-bottom: 5px;
	text-align: left;
        color: #565656;
	top: 5px;
	font-family: "Trebuchet ms", arial, verdana, sans-serif;
	font-size: 10px;
	text-transform: uppercase;
	}

.subject {
        background-color: #191919;
	font-weight: none;
	padding-bottom: 5px;
	padding-top: 5px;
        padding-left: 10px;
	color: #30658c;
	font-family: "Pea Alesa";
	font-size: 16px;
	text-transform: normal;
        text-decoration: underline;
	border-bottom: 0px dotted #022d4c;
	border-right: 0px dotted #022d4c;
	}
	
.subject a, .subject a:link, .subject a:visited {
	color: #30658c;
	}

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

.datesubject {
	background-color: transparent;
	padding: 0px;
	text-align: left;
	border-left: 0px dotted #022d4c;
	border-right: 0px dotted #022d4c;
	border-top: 0px dotted #022d4c;
        }

span.ljuser a b {
	padding: 2px 0 2px 0;
	color: #30658c;
	font-weight: bold;
	}

span.ljuser a:hover b {
	padding-top: 2px;
	padding-bottom: 2px;
	color: #777777;
	font-weight: lighter;
	}

/*-----------------------
SECTION: Currents, tags, comment links
-------------------------*/

.ljtags {
	margin-top: 5px;
	color: #555555;
	font-weight: lighter;
	text-transform: lowercase;
        margin: 15px 0px 0px 0px;
        padding: 5px 0px 5px 17px;
        background:

url(http://i77.photobucket.com/albums/j49/SireesAnwar/TinyIcons/tag_orange.png)

no-repeat center left;
	}
	
.currents strong, .currentmood strong, .currentmusic .currentlocation,

.ljtags strong

{
	font-family: "Silkscreen";
	font-size: 10px;
	color: #555555;
	font-weight: lighter;
	text-transform: lowercase;
	}

.currents, .currentmood, .currentmusic, .currentlocation {
	font-family: "Silkscreen";
	font-size: 10px;
	color: #555555;
	font-weight: lighter;
	text-transform: lowercase;
	}

.ljtags a, .ljtags a:link, .ljtags a:visited {
	font-family: "Silkscreen";
	font-size: 10px;
	color: #30658c;
	text-transform: lowercase;
	font-weight: lighter;
	}

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

/*-----------------------
SECTION: Comments Page
-------------------------*/

.box {
	padding: 10px;
	margin-top: 0px;
	text-align: left;
        clear:right;
	}

form div.box {
	text-align:center;
}

.skiplinks {
	text-transform: normal;
	text-align: center;
	padding: 10px 0 10px 0;
	}

div#content input,
div#content textarea,
div#content select {
	color: #555555;
	border: 1px dotted #022d4c;
	background-color:#222222;
	}
	
textarea.textbox  {
	width: 100% !important;
	}

.replytoposter {
        background-color: #222222;
	color: #565656;
	text-transform: normal;
        padding: 5px;
}

.commentboxpartial {
	padding: 10px; 
	margin: 10px; 
        background-color: #222222;
	}

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

/*-----------------------
SECTION: Year/Archive Page
-------------------------*/

ul.year {
	text-align: center;
	padding: 20px 0 20px 0;
	}

ul.year li {
	display: inline;		
	}

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

table.yeartable td.yeardate, table.yeartable td.yearday {
	border: 1px dotted #022d4c;
	color: #555555;
	}

table.yeartable td.yearday {
	text-align: center;
	color: #555555;
	}

td.yearmonth {
	color: #555555;
	border-style: none;
	}

/*-----------------------
SECTION: Tags Page
-------------------------*/

ul.ljtaglist {
	color: #555555;
	font-family: "Trebuchet ms", arial, verdana, sans-serif;
	font-size: 10pt;
	padding-left: 12px;
	padding: 8px;
	}

ul.ljtaglist li  {
	list-style: none;
	}

/*-----------------------
SECTION: Tiny Icons
-------------------------*/

.subject img[src=http://stat.livejournal.com/img/icon_protected.gif]{
	width: 0;
	height: 0;
	padding: 12px 9px 0px 0px !important;
	background: url();
	}

.subject img[src=http://stat.livejournal.com/img/icon_private.gif]{
	width: 0;
	height: 0;
	padding: 9px 9px 0px 0px !important;
	background: url();
	}

.ljuser img { 
	width: 0;
	height: 0;
	background-repeat: no-repeat;
	background-color:transparent;
	background-image: url(); 
	padding: 12px 7px 0 2px !important;
	}

.ljuser img[src=http://stat.livejournal.com/img/userinfo.gif] {
	background-color:transparent;
	background-image: url(); 
	padding: 12px 7px 0 2px !important;
	}

.ljuser img[src=http://stat.livejournal.com/img/community.gif] {
	background-color:transparent;

background-image: url(); 
	padding: 11px 11px 0 2px !important;
	}

/*-----------------------
SECTION: Mics
-------------------------*/

.clear {
	height: 7px;
	font-size: 0.01px;
	}
	
#lj_controlstrip td {
	font-family: georgia !important;
	font-size: 11px;
	background-color: #191919 !important;
	border: 1px solid #333333;
	}

#lj_controlstrip a {
	font-family: georgia !important;
	font-size: 11px;
	color: #666666!important;
	text-transform: lowercase;
	}

.headerimage {
          position: relative;
	border-color: #444444;
	border-style: dotted;
	border-width: 1px 1px 0px 1px;
	 width: 750px;
	 height: 300px;
         padding-left: 0px;
         padding-right: 0x;
         padding-bottom: 0px;
         padding-top: 0px;
         margin-left: auto;
         margin-right: auto;
         margin-top: 1px;
         background-color: #191919;
	 background-image: url(HEADER IMAGE URL);
	 background-position: center;         
         background-repeat: no-repeat;
            }

.separator {
          height: 20px;
         }

Header 750 x 300 made by

serenitysangel

Header 750 x 300 made by

serenitysangel

Background - insert at top of coding, looks nice behind layout

Fonts Used:
Dirty Ego
Pea Alesa
king cool KC

See the Font Tutorial if you need help adding these fonts to your computer system.

Check out Using Layouts on the sidebar for any extra assistance.
Please direct people to

layout_lounge. Please credit

serenitysangel for the lovely headers.

Flat | Top-Level Comments Only

From:

angi-is-altered.livejournal.com

It's SO perfect!

From:

sireesanwar.livejournal.com

I'm so glad you are enjoying it. I hope it makes you go to your journal to just stare. *lol*

From:

sireesanwar.livejournal.com

In case you are interested serenitysangel made some icons to go along with the layout/header over at
http://community.livejournal.com/graffitigraphic/56084.html

From:

sireesanwar.livejournal.com

Hi I just wanted to let you know that I realized that some of the fonts I used on the layout might not show up if you don't have them downloaded and in your computer. I've posted the font links above in the layout post.

From:

angi-is-altered.livejournal.com

Thanks

From:

birggitt.livejournal.com

OMG! I love it!
I'm looking for something more Christmassy right now, but, girl! I'm gonna put this one in my memories, and come back in January =D

From:

sireesanwar.livejournal.com

Thanks. I'm glad you like it.

From:

breakinporcelan.livejournal.com

This is absolutely gorgeous and I love it! Will be snagging this to use with proper credit. Thank you so much!

ETA: I'm having a tiny problem - I can't get the headers to download. Am I missing a step? Thanks in advance.

Edited Date: 2008-12-14 03:53 pm (UTC)

From:

sireesanwar.livejournal.com

Cool!

So strange. You should be able to just right click and it will save in the proper size but try these...

http://i77.photobucket.com/albums/j49/SireesAnwar/HeaderByFriends/bannerntext2mk2-serenitysangel.png

http://i77.photobucket.com/albums/j49/SireesAnwar/HeaderByFriends/bannerntextha4-serenitysangel.png

If you still have trouble saving them you might have to empty your Temporary Files Folder and try again.

From:

breakinporcelan.livejournal.com

Thank you so very much for your help, it's working perfectly now.

I took the code for the red SPN layout as well, since I love them both and will probably alternate between them. Thank you again for your help.

From:

sireesanwar.livejournal.com

Oh good! No problem. And no worries because this group will be here and I've got everything memorized and tagged so things can be found.

I'm glad you are enjoying them.

You are very welcome!

From:

77mrsbrooks.livejournal.com

and i'm snagging one more:) the bigger one

From:

sireesanwar.livejournal.com

Sounds good to me. Enjoy it.

From:

starshines.livejournal.com

Hey, it's me again. I love your layouts. So much, in fact, that I'm gonna be using this one. However, I messed something up. I made my header 700px wide instead of 750px. Instead of having to redo the headers, which took me forever to work out, I tried redoing the coding. By making it 700px. With this screw up the coding? Sorry to bug you! If you wanna see, the community is [Bad username or site: @ livejournal.com].

From:

sireesanwar.livejournal.com

It might mess with the coding unless you change all the widths that need to be changed. Give me a few... I'm going to make changes and test it.

From:

sireesanwar.livejournal.com

Got to

workshop_rees for the layout code.

From:

kj-svala.livejournal.com

Hello, I`ve just added this LJ to my list. I found you by accident while searching for a new layout.

I took this SPN layout, it looks just awesome.

The first Header included, since my own are still in 800x300

But, the background images doesn`t show up, just a dark background. I`ve downloaded the background image, uploaded to photobucket, and copied the direkt link into the layout code. But it is not there.

I have no idea why. I`m a zero when it comes with anything computer, and this is actually the first layout change I do on my own. Or, try to do that is.

Sorry to ask, but do you have an idea what I could have done wrong?

From:

sireesanwar.livejournal.com

I'm so glad you like the layout and serenitysangel's header. Now for the background image.

It looks like you figured out the problem as when I go to your journal it is visible. Am I right?

From:

kj-svala.livejournal.com

Thank you for getting back to me.

Yes, I figured it out for myself.

There was a ; missing after I copied the layout code, for whatever the reason.

but, it is working now *g*

From:

sireesanwar.livejournal.com

You are welcome. I'm glad you were able to figure it out and half the time it is a missing ;. I do it all the time. Enjoy.

From:

vargesz.livejournal.com

I'm in love... Thanks for making this. =)

From:

sireesanwar.livejournal.com

I'm really glad you like it. I bet the artist who made the header is too.

From:

phoebe2008.livejournal.com

the perfect layout!!!

From:

sireesanwar.livejournal.com

Glad you like it so much. I love your header on your journal.

From:

phoebe2008.livejournal.com

thanks =) i wanted to male seomthing that looks like the original header but that didn't work out so i thought something in b/w at least ^^

From:

sireesanwar.livejournal.com

You did fine. I like it.

(deleted comment)

From:

sireesanwar.livejournal.com

Glad you like.

From:

etherealsparkle.livejournal.com

Absolutely brilliant layout! The header is so very well done. It really captures the feeling of the show. Thank you so much for sharing. I love it! I also grabbed one of the matching icons. Thank you again. Gorgeous work! Will credit both community and you :)

From:

sireesanwar.livejournal.com

I'm so glad you like!

From:

simplycassie.livejournal.com

I love this layout! <3 I changed the header and background but kept everything the same. Thanks so much for this! ^___^

From:

sireesanwar.livejournal.com

Sounds good to me. Enjoy.

From:

underspell102.livejournal.com

Thank you so much! I was looking for a Supernatural layout! Will credit!

From:

sireesanwar.livejournal.com

I'm glad you like it. Enjoy.

From:

babyrishin.livejournal.com

I like this layout :) I've been searching for a layout like this since then~ Continue to make more layouts! ^^ So perfect~ Will use it on mine :))

From:

sireesanwar.livejournal.com

I will. I've made a lot since. I'm glad you like it. Enjoy.

From:

autumn-meadows.livejournal.com

Using, and will credit. ;)

From:

sireesanwar.livejournal.com

Great. Enjoy!

Flat | Top-Level Comments Only

About

Welcome to the Lounge. Our tutorials are saved here. These are currently all for LJ and Flexible Squares. Should you have general questions about us check out our FAQ. I do NOT customize layouts for individuals.

Layout Change Quick Guide

If you like Flexible Squares, I have tons of layouts for you, and still create them.

I've been creating Layouts for DW's Transmogrified. Here's how to use them:
1. Go to Transmogrified Layouts.
2. Choose Basic.
3. Go to Custom CSS.
4. Make sure all boxes are unchecked
5. Copy Coding to Stylesheet Box.
6. Make sure to update with your own images/image urls. Imgur images are okay to be used.
7.Click Save.

Tips Welcome:

You can also find layout_lounge at LiveJournal.

Summary

April 2025

S	M	T	W	T	F	S
		1	2	3	4	5
6	7	8	9	10	11	12
13	14	15	16	17	18	19
20	21	22	23	24	25	26
27	28	29	30

Layouts, Tutorials, Help, and more

About

Links

Summary