layoutlounge | 40. 2 Star Trek Geektastic Layouts

Layout Style: S2 Flexible Squares
Features: Sidebar, Scrolling Tags, Custom Page Summary
Layout Width: 800px
Requested By:

Click to see larger image - Live Preview

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

body{
	background-color: #000000;
        background-image: url(BACKGROUND IMAGE URL);
        background-repeat: repeat;
	color: #f9e7b5;
	font-family: "Verdana", arial, verdana, sans-serif;
	font-size: 12px;
        margin: 10px 0 20px 0;
	}

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

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

blockquote {
		width: 400px;
                padding: 15px; 
		border: 0px solid #e6d6b7; 
		color: #f9e7b5;
		font-size: 12px;
		line-height: 100%;
		font-family: "Verdana", arial, verdana, sans-serif;
		background: #333333;
		text-align: left;
 -moz-border-radius: 35px;
 border-radius: 35px;
 -webkit-border-radius: 35px;
 -khtml-border-radius: 35px;
		}

b, strong {
color: #246ca6;
}

i, em {
color: #ffffff;
}

s, u {
color: #9363c6;
}

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

/*-----------------------
SECTION: In General
-------------------------*/
	
#content {  	
	width: 800px;	
	margin-left: auto; 
        margin-right: auto;  
	text-align: left;
        padding: 0px;
        background-color: transparent !important;
	border-color: #888888;
	border-style: solid;
	border-width: 0px;
}

#maincontent {
	width: 565px;
	float: right;
	margin: 0px 0px 0px 0px;
	font-family: "Verdana", arial, verdana, sans-serif;
	font-size: 12px;
	color: #888888;
	text-align: center;
	}

.subcontent {
        background-color: #000000;
        width: 563px;
	border: 0px solid #cccccc;
	margin-right: 0px;
}

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

#header {		
	position: relative;
	line-height: 25px;
	text-align: right;
        color: #000000;
	font-family: "Swiss911 XCm BT", Arial;
	font-size: 20px;
	width: 100%;
	padding: 0px 0px 10px 0px;
	margin-bottom: 0px;
	letter-spacing: 1px;
        text-transform: uppercase;
	border-bottom: 0px solid #cccccc;
	background-color: #000000;
        background-image: url(HEADER LINK IMAGE);
        background-repeat: no-repeat;

}

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: 13px 5px 14px 5px;
	font-family: "Swiss911 XCm BT", Arial;
	font-size: 20px;
	font-weight: normal;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #DC9D30;
	text-align: left;
	background-color: #000000;
}

div#header a:hover {
	padding: 13px 5px 14px 5px;
	color: #246ca6;
	background-color: #000000;
	border-bottom: 0px solid;
        play-during: url("http://layout-lounge.weebly.com/files/theme/214.wav");
}

ul.navheader 
	{	
	padding: 10px;
        background-color: transparent !important;	
	margin: 0px;
	}

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

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

#footer {			
	width: 100%;
	margin: 0px;
	text-align: center;
	font-family: "Swiss911 XCm BT", Arial;
	text-transform: uppercase;
	font-size: 15px;
	color: #ffffff;
	z-index: 100;
	}

div#footer a {
	padding: 5px;
	font-family: "Swiss911 XCm BT", Arial;
	font-size: 15px;
	font-weight: normal;
	text-transform: uppercase;
	letter-spacing: -1px;
	color: #000000;
	text-align: center;
        background-color: #c9dcea;
 -moz-border-radius: 35px;
 border-radius: 35px;
 -webkit-border-radius: 35px;
 -khtml-border-radius: 35px;
}

div#footer a:hover {
	padding: 5px;
	color: #ffffff;
	border-bottom: 0px solid;
        background-color: #79b0cf;
 -moz-border-radius: 35px;
 border-radius: 35px;
 -webkit-border-radius: 35px;
 -khtml-border-radius: 35px;
}

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

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

.clearfoot {		
        height: 0px;
	clear: both;
	}

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

#sidebar {
	padding: 0px 0 10px 0; 
        background-color: #000000;
	margin-left: 0px;
	font-family: "Verdana", arial, verdana, sans-serif;
	font-size: 10px;
	color: #f9e7b5;
	width: 215px;
	float: left;
	text-align: right;
        text-transform: normal;
	border: 0px solid #cccccc;
	}

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

.sbarcalendarposts

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

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

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

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

.defaultuserpic {
	text-align: center;
	}

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

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

.sbarbody2 {
	padding: 0 5px 0 5px;
	}
		
table.calendar {
	margin-right: auto;
	margin-left: auto;
        text-align: right;
	}
	
.sbarcalendar {
	padding: 1px;
	border: 0px solid #cccccc;
	text-align: right;
	font-family: "Verdana", arial, verdana, sans-serif;
	font-size: 9px;
	}

.sbarcalendarposts {
	padding: 1px;
        border: 0px solid #cccccc;
	background-color: #000000;
	text-align: right;
	font-family: "Verdana", arial, verdana, sans-serif;
	font-size: 9px;
	}
	
ul.sbarlist {
	padding-left: 0px;
	margin-left: 0px;		
        list-style: none;
        text-align: right;
	}

li.sbaritem {
	padding-right: 5px;
        border-bottom: 0px solid #cccccc;
	list-style: none;
        }

li.sbaritem a {
	padding: 3px 3px 3px 3px;
        margin: 0px 2px 5px 0px;
	list-style: none;
        text-transform: lowercase;
        border-right: 5px #000000 solid;
	}

li.sbaritem a:hover 
        {
        border-right: solid 5px #f9e7b5;
        background-color: #000000;
        }

li.sbartitle {
	padding: 3px 5px 3px 5px;
	margin: 10px 0 10px 0;
	list-style: none;
	text-align: center;
	color: #000000;
        border-bottom: 0px solid #cccccc;
        text-transform: uppercase;
	font-weight: none;
	font-family: "Swiss911 XCm BT", Arial;
	font-size: 25px;
        background-color: #2c9486;
 -moz-border-radius: 35px;
 border-radius: 35px;
 -webkit-border-radius: 35px;
 -khtml-border-radius: 35px;
		}

ul.tagList {width: 100%;}
    .tagBox {
      height: 250px;
      overflow-x: hidden;
      overflow-y: scroll; 
      scrollbar-arrow-color: #96abac;
      scrollbar-base-color: #ffffff;
      scrollbar-face-color: #ffffff;
      scrollbar-highlight-color: #96abac;
      scrollbar-darkshadow-color: #cccccc;
      scrollbar-shadow-color: #cccccc;
}

#sidebar_summary li.sbaritem {
	color: #ffffff;
	border: 0px solid #cccccc;
	background-color: #000000;
 -moz-border-radius: 35px;
 border-radius: 35px;
 -webkit-border-radius: 35px;
 -khtml-border-radius: 35px;
	padding: 3px;
	text-transform: normal;
	margin: 3px 0px;
	}

#sidebar_summary li.sbaritem a {
	text-decoration: none;
	display: inline !important;
	color: #ffffff;
	border: 0px solid #96abac !important;
	background-color: transparent !important;
	}

#sidebar_summary li.sbaritem a: hover{
	text-decoration: none;
	color: #ffffff;
	border: 0px solid #333333;
 -moz-border-radius: 35px;
 border-radius: 35px;
 -webkit-border-radius: 35px;
 -khtml-border-radius: 35px;
	background-color: transparent !important;
	}

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

.entry	{
        padding: 10px;
	margin: 0px;
	color: #f9e7b5;
	font-family: "Verdana", Arial;
	font-size: 12px;
	text-align: left;
	}
	
hr {
	color: transparent;
	height: 1px;
	border-style : none; 
	border-bottom: 2px solid #cccccc;
	}

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

.userpic {
	background-color: #accde0 !important;
	position: relative;
	float: right;
	padding: 5px;
	margin: 10px;
	z-index: 15;
        color: #000000 !important;
	border: 0px #e6d6b7 solid;
 -moz-border-radius: 10px;
 border-radius: 10px;
 -webkit-border-radius: 10px;
 -khtml-border-radius: 10px;
	}

.userpicfriends {
	background-color: #accde0 !important;
	position: relative;
	float: right;
	padding: 5px;
	margin: 10px;
	text-align: right;
	font-family: "Verdana", arial, verdana, sans-serif;
	font-size: 12px;
	z-index: 15;
	border: 0px #e6d6b7 solid;
 -moz-border-radius: 10px;
 border-radius: 10px;
 -webkit-border-radius: 10px;
 -khtml-border-radius: 10px;
	}

.userpicfriends a font {
	color: #ffffff;
}

.date {
	margin: 5px 0 0 5px;
	text-align: right;
        color: #555555;
	top: 5px;
	font-family: "Swiss911 UCm BT", arial, verdana, sans-serif;
	font-size: 14px;
        letter-spacing: 1px;
	text-transform: uppercase;
	}

.subject {
        background-color: #7d79b7;
	font-weight: none;
	padding-bottom: 5px;
	padding-top: 5px;
        padding-left: 10px;
        margin-right: 130px;
	color: #000000;
	font-family: "Swiss911 XCm BT", Arial;
	font-size: 25px;
	text-transform: uppercase;
        text-decoration: normal;
	border-bottom: 0px solid #cccccc;
 -moz-border-radius: 35px;
 border-radius: 35px;
 -webkit-border-radius: 35px;
 -khtml-border-radius: 35px;
	}
	
.subject a, .subject a:link, .subject a:visited {
	color: #ffffff;
	}

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

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

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

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

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

.ljtags {
	margin-top: 5px;
	color: #cccccc;
	font-weight: lighter;
	text-transform: lowercase;
	font-size: 10px;
        margin: 15px 0px 0px 0px;
        padding: 5px 0px 5px 3px;
        background: url() no-repeat center left;
	}
	
.currents strong, .currentmood strong, .currentmusic .currentlocation,

.ljtags strong

{
	font-family: "Verdana", arial;
	font-size: 10px;
	color: #cccccc;
	font-weight: lighter;
	text-transform: lowercase;
	}

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

.ljtags a, .ljtags a:link, .ljtags a:visited {
	font-family: "Verdana", arial;
	font-size: 10px;
	color: #246ca6;
	text-transform: lowercase;
	font-weight: lighter;
	}

.currentlocation a, .currentlocation a:link, .currentlocation a:visited {
	font-family: "Verdana", arial;
	font-size: 10px;
	color: #246ca6;
	text-transform: lowercase;
	font-weight: lighter;
	}
	
.currentlocation a:hover, .ljtags a:hover {
	font-family: "Verdana", arial;
	font-size: 10px;
	color: #414144;
	font-weight: lighter;
	text-transform: lowercase;
	}

.comments {
	font-family: "Verdana", arial;
	font-size: 10px;
	font-weight: normal;
	text-align: right;
	padding: 5px 5px 5px 5px;
	position: relative;
	clear: center;
	margin-top: 5px;
        margin-left: 200px;
	text-transform: lowercase;
	border-bottom: 0px #e6d6b7 solid;
        background-color: #c9dcea;
 -moz-border-radius: 35px;
 border-radius: 35px;
 -webkit-border-radius: 35px;
 -khtml-border-radius: 35px;
	}
	
div.comments a, div.comments a:link, div.comments a:visited{
	color: #414144;
}

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

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

.box {
	padding: 5px;
	margin-top: 0px;
	text-align: left;
        clear:right;
	background-color: #000000;
	width: 557px;
	}

form div.box {
	text-align:center;
	background-color: #000000;
	width: 557px;
}

.skiplinks {
	text-align: right;
	margin-bottom: 3px;
	font-family: "Verdana", arial;
	padding: 10px;
	font-size: 9px;
	letter-spacing: 1px;
	color: #dddddd;
	background-color: #000000;
	border: 0px solid #cccccc;
	}

.datesubjectcomment {
	margin-top: 20px;
	text-align: right;
	padding: 5px;
        background-color: #333333;
        color: #f9e7b5;
	}	
	
.userpiccomment {
	background-color: #accde0 !important;
	position: relative;
	top: -30px;
	left: 0px;
	padding: 5px;
	margin: 20px 10px -20px 10px;
	z-index: 15;
	float: right;
	border: 0px #e6d6b7 solid;
	color: #f9e7b5;
 -moz-border-radius: 10px;
 border-radius: 10px;
 -webkit-border-radius: 10px;
 -khtml-border-radius: 10px;
	}

div#content input,
div#content textarea,
div#content select {
        padding: 10px;
        margin: 10px;
	color: #96abac;
	border: 0px solid #cccccc;
	background-color:#333333;
 -moz-border-radius: 35px;
 border-radius: 35px;
 -webkit-border-radius: 35px;
 -khtml-border-radius: 35px;
	}
	
textarea.textbox  {
	width: 100% !important;
	}

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

.replytoposter {
        background-color: #000000;
	color: #246ca6;
	text-transform: normal;
        padding: 5px;
}

.commentreply {
        text-align: left;
	position: relative;
	margin: 10px;
	font-family: "Verdana", arial, verdana, sans-serif;
	font-size: 10px;
	color: #f9e7b5;
	}
	
.commentbox {
	padding: 5px;
	margin: 10px;
	text-align: left;
        background-color: #333333;
	border: 0px solid #cccccc;
 -moz-border-radius: 35px;
 border-radius: 35px;
 -webkit-border-radius: 35px;
 -khtml-border-radius: 35px;
	}
	
.datesubjectcomment a:link, .datesubjectcomment a:visited {
	color: #96abac;
	}
	
.datesubjectcomment a:hover {
	color: #414144;
	}

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

.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 solid #cccccc;
	color: #cccccc;
	}

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

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

/*-----------------------

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

ul.ljtaglist {
	color: #cccccc;
	font-family: "Verdana", arial, verdana, sans-serif;
	font-size: 12px;
	padding-left: 12px;
	padding: 8px;
	}

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

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

.currentlocation
       {
       background: url() no-repeat left center;
       padding: 2px 0px 5px 3px;
       }

.currentmood 
       {
       background: url() no-repeat left center;
       padding: 2px 0px 5px 3px;
       }

.currentmusic 
       {
       background: url() no-repeat left center;
       padding: 2px 0px 5px 3px;
       }

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

.clear {
	height: 0px;
	font-size: 0.01px;
	}
	
#lj_controlstrip td {
	font-family: "Verdana", arial !important;
	font-size: 12px;
	background-color: #226086 !important;
	border: 0px solid #eeeeee;
	}

#lj_controlstrip a, .lj_controlstrip a:link, .lj_controlstrip a:visited, {
	font-family: "Verdana", arial !important;
	font-size: 12px;
	color: #e6d6b7 !important;
	text-transform: lowercase;
	}

.headerimage {
          position: relative;
	border-color: #888888;
	border-style: solid;
	border-width: 0px;
	 width: 800px;
	 height: 241px;
         padding-left: 0px;
         padding-right: 0x;
         padding-bottom: 0px;
         padding-top: 0px;
         margin-left: auto;
         margin-right: auto;
         margin-top: 1px;
         background-color: #000000;
	 background-image: url(HEADER IMAGE URL);
	 background-position: center;         
         background-repeat: no-repeat;
            }

.separator {
          height: 20px;
         }

Header 800 x 241

Header Link Background

Click to see larger image - Live Preview

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

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

blockquote {
		width: 400px;
                padding: 10px; 
		border: 0px solid #e6d6b7; 
		color: #f9e7b5;
		font-size: 12px;
		line-height: 100%;
		font-family: "Verdana", arial, verdana, sans-serif;
		background: #333333;
		text-align: left;
-moz-border-radius: 35px; -webkit-border-radius: 35px; border-radius: 35px; -khtml-border-radius: 35px; 
		}

b, strong {
color: #246ca6;
}

i, em {
color: #ffffff;
}

s, u {
color: #9363c6;
}

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

#maincontent {
	width: 565px;
	float: right;
	margin: 0px 0px 0px 0px;
	font-family: "Verdana", arial, verdana, sans-serif;
	font-size: 12px;
	color: #888888;
	text-align: center;
	}

.subcontent {
        background-color: #000000;
        width: 563px;
	border: 0px solid #cccccc;
	margin-right: 0px;
}

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

#header {		
	position: relative;
	line-height: 25px;
	text-align: center;
        color: #000000;
	font-family: "Swiss911 XCm BT", Arial;
	font-size: 20px;
	width: 100%;
	padding: 0px 0px 10px 0px;
	margin: 5px 0 0 20px;
	letter-spacing: 1px;
        text-transform: uppercase;
	border-bottom: 0px solid #cccccc;
	background-color: #000000;
        background-image: url(HEADER LINK IMAGE);
        background-repeat: no-repeat;

}

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

div#footer

div#header a:hover {
	padding: 13px 5px 14px 5px;
	color: #ffffff;
	border-bottom: 0px solid;
        play-during: url("http://layout-lounge.weebly.com/files/theme/214.wav");
}

ul.navheader 
	{	
	padding: 10px;
        background-color: transparent !important;	
	margin: 0px;
	}

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

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

#footer {			
	width: 100%;
	margin: 0px;
	text-align: center;
	font-family: "Swiss911 XCm BT", Arial;
	text-transform: uppercase;
	font-size: 15px;
	color: #ffffff;
	z-index: 100;
	}

div#footer a {
	padding: 5px;
	font-family: "Swiss911 XCm BT", Arial;
	font-size: 15px;
	font-weight: normal;
	text-transform: uppercase;
	letter-spacing: -1px;
	color: #000000;
	text-align: center;
        background-color: #c9dcea;
-moz-border-radius: 35px; -webkit-border-radius: 35px; border-radius: 35px; -khtml-border-radius: 35px; 
}

div#footer a:hover {
	padding: 5px;
	color: #ffffff;
	border-bottom: 0px solid;
        background-color: #79b0cf;
-moz-border-radius: 35px; -webkit-border-radius: 35px; border-radius: 35px; -khtml-border-radius: 35px; 
}

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

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

.clearfoot {		
        height: 0px;
	clear: both;
	}

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

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

.sbarcalendarposts

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

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

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

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

.defaultuserpic {
	text-align: center;
	}

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

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

li.sbaritem {
	padding-right: 5px;
        border-bottom: 0px solid #cccccc;
	list-style: none;
        }

li.sbaritem a {
	padding: 3px 3px 3px 3px;
        margin: 0px 2px 5px 0px;
	list-style: none;
        text-transform: lowercase;
        border-right: 5px #000000 solid;
	}

li.sbaritem a:hover 
        {
        border-right: solid 5px #f9e7b5;
        background-color: #000000;
        }

li.sbartitle {
	padding: 3px 5px 3px 5px;
	margin: 10px 0 10px 0;
	list-style: none;
	text-align: center;
	color: #000000;
        border-bottom: 0px solid #cccccc;
        text-transform: uppercase;
	font-weight: none;
	font-family: "Swiss911 XCm BT", Arial;
	font-size: 25px;
        background-color: #2c9486;
-moz-border-radius: 35px; -webkit-border-radius: 35px; border-radius: 35px; -khtml-border-radius: 35px; 
		}

#sidebar_summary li.sbaritem {
	color: #ffffff;
	border: 0px solid #cccccc;
	background-color: #000000;
-moz-border-radius: 35px; -webkit-border-radius: 35px; border-radius: 35px; -khtml-border-radius: 35px; 
	padding: 3px;
	text-transform: normal;
	margin: 3px 0px;
	}

#sidebar_summary li.sbaritem a {
	text-decoration: none;
	display: inline !important;
	color: #ffffff;
	border: 0px solid #96abac !important;
	background-color: transparent !important;
	}

#sidebar_summary li.sbaritem a: hover{
	text-decoration: none;
	color: #ffffff;
	border: 0px solid #333333;
-moz-border-radius: 35px; -webkit-border-radius: 35px; border-radius: 35px; -khtml-border-radius: 35px; 
	background-color: transparent !important;
	}

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

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

.userpic {
	background-color: #accde0 !important;
	position: relative;
	float: right;
	padding: 5px;
	margin: 10px;
	z-index: 15;
        color: #000000 !important;
	border: 0px #e6d6b7 solid;
-moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; -khtml-border-radius: 10px; 
	}

.userpicfriends {
	background-color: #accde0 !important;
	position: relative;
	float: right;
	padding: 5px;
	margin: 10px;
	text-align: right;
	font-family: "Verdana", arial, verdana, sans-serif;
	font-size: 12px;
	z-index: 15;
	border: 0px #e6d6b7 solid;
-moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; -khtml-border-radius: 10px; 
	}

.userpicfriends a font {
	color: #ffffff;
}

.subject {
        background-color: #7d79b7;
	font-weight: none;
	padding-bottom: 5px;
	padding-top: 5px;
        padding-left: 10px;
        margin-right: 130px;
	color: #000000;
	font-family: "Swiss911 XCm BT", Arial;
	font-size: 25px;
	text-transform: uppercase;
        text-decoration: normal;
	border-bottom: 0px solid #cccccc;
-moz-border-radius: 35px; -webkit-border-radius: 35px; border-radius: 35px; -khtml-border-radius: 35px; 
	}
	
.subject a, .subject a:link, .subject a:visited {
	color: #ffffff;
	}

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

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

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

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

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

.ljtags strong

{
	font-family: "Verdana", arial;
	font-size: 10px;
	color: #cccccc;
	font-weight: lighter;
	text-transform: lowercase;
	}

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

.ljtags a, .ljtags a:link, .ljtags a:visited {
	font-family: "Verdana", arial;
	font-size: 10px;
	color: #246ca6;
	text-transform: lowercase;
	font-weight: lighter;
	}

.comments {
	font-family: "Verdana", arial;
	font-size: 10px;
	font-weight: normal;
	text-align: right;
	padding: 5px 5px 5px 5px;
	position: relative;
	clear: center;
	margin-top: 5px;
        margin-left: 200px;
	text-transform: lowercase;
	border-bottom: 0px #e6d6b7 solid;
        background-color: #c9dcea;
-moz-border-radius: 35px; -webkit-border-radius: 35px; border-radius: 35px; -khtml-border-radius: 35px; 
	}
	
div.comments a, div.comments a:link, div.comments a:visited{
	color: #414144;
}

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

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

.box {
	padding: 5px;
	margin-top: 0px;
	text-align: left;
        clear:right;
	background-color: #000000;
	width: 557px;
	}

form div.box {
	text-align:center;
	background-color: #000000;
	width: 557px;
}

.datesubjectcomment {
	margin-top: 20px;
	text-align: right;
	padding: 5px;
        background-color: #333333;
        color: #f9e7b5;
	}	
	
.userpiccomment {
	background-color: #accde0 !important;
	position: relative;
	top: -30px;
	left: 0px;
	padding: 5px;
	margin: 20px 10px -20px 10px;
	z-index: 15;
	float: right;
	border: 0px #e6d6b7 solid;
	color: #f9e7b5;
-moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; -khtml-border-radius: 10px; 
	}

div#content input,
div#content textarea,
div#content select {
        padding: 10px;
        margin: 10px;
	color: #96abac;
	border: 0px solid #cccccc;
	background-color:#333333;
-moz-border-radius: 35px; -webkit-border-radius: 35px; border-radius: 35px; -khtml-border-radius: 35px; 
	}
	
textarea.textbox  {
	width: 100% !important;
	}

.replytoposter {
        background-color: #000000;
	color: #246ca6;
	text-transform: normal;
        padding: 5px;
}

.commentreply {
        text-align: left;
	position: relative;
	margin: 10px;
	font-family: "Verdana", arial, verdana, sans-serif;
	font-size: 10px;
	color: #f9e7b5;
	}
	
.commentbox {
	padding: 5px;
	margin: 10px;
	text-align: left;
        background-color: #333333;
	border: 0px solid #cccccc;
-moz-border-radius: 35px; -webkit-border-radius: 35px; border-radius: 35px; -khtml-border-radius: 35px; 
	}
	
.datesubjectcomment a:link, .datesubjectcomment a:visited {
	color: #96abac;
	}
	
.datesubjectcomment a:hover {
	color: #414144;
	}

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

.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 solid #cccccc;
	color: #cccccc;
	}

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

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

/*-----------------------

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

ul.ljtaglist {
	color: #cccccc;
	font-family: "Verdana", arial, verdana, sans-serif;
	font-size: 12px;
	padding-left: 12px;
	padding: 8px;
	}

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

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

.currentlocation
       {
       background: url() no-repeat left center;
       padding: 2px 0px 5px 3px;
       }

.currentmood 
       {
       background: url() no-repeat left center;
       padding: 2px 0px 5px 3px;
       }

.currentmusic 
       {
       background: url() no-repeat left center;
       padding: 2px 0px 5px 3px;
       }

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

#lj_controlstrip a, .lj_controlstrip a:link, .lj_controlstrip a:visited, {
	font-family: "Verdana", arial !important;
	font-size: 12px;
	color: #e6d6b7 !important;
	text-transform: lowercase;
	}

.headerimage {
          position: relative;
	border-color: #888888;
	border-style: solid;
	border-width: 0px;
	 width: 800px;
	 height: 184px;
         padding-left: 0px;
         padding-right: 0x;
         padding-bottom: 0px;
         padding-top: 0px;
         margin-left: auto;
         margin-right: auto;
         margin-top: 1px;
         background-color: #000000;
	 background-image: url(HEADER IMAGE URL);
	 background-position: center;         
         background-repeat: no-repeat;
            }

.separator {
          height: 20px;
         }

Header 800 x 184

Header Link Background

Fonts Used:
Swiss911 XCm BT
Swiss911 UCm BT

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 or

graffitigraphic.

Flat | Top-Level Comments Only

From:

lordoflorien.livejournal.com

I realize this is a very old post, but I only just stumbled upon it and thought the layout(s) were fun. But I have absolutely no idea how to make it work without looking like a great big mess. Been poking at it for two hours now. And I'm unclear on what I'm supposed to be using as a "background image" given there's only two linked images -- Header, and Header Link.

Help, if anyone is still watching? Otherwise I'll keep looking for something else. Thanks.

sireesanwar.livejournal.com

The background image is just if you want one in there. Say you had a star scape which I think I do have over at http://layout-lounge.weebly.com/dark-backgrounds.html.

The backgrounds can remain black. Do you need help piecing together the layout? I can help with that if you like. I also have tutorials about how to implement layouts if that is needed.

Thank you for responding, and clearing that up for me! I appreciate it.

Yes, piecing the layout together isn't going as smoothly as I thought. I have experience with HTML, and granted I didn't keep poking at things very long, but some help would be appreciated. Here's the journal, so you can see what's going on: http://mr-laforge.livejournal.com

The top of the graphic gets sliced off, the two sandwich together so tightly that it cuts off part of the bottom, and the sidebar/entry headers are rectangular rather than circular. Which are the main problems I'm seeing.

It might be worth mentioning I run Chrome primarily, Firefox secondary. I'm not sure how the layout looks in both. But -- thank you in advance!

I can tell you the problem with the header is the height of the header image. It should be 241 rather than 184. As for the rectangular rather than circular. That is because of changes within the browsers. Let me see what I can do to alter that.

Hmm. I just double-checked the code, and the size of the header image isn't defined anywhere in pixels. It should auto-adjust, given the code you used. I didn't alter it in any way, just copy-pasted it straight from the text box above.

I could define the header image size in the code, but I think that might just add a new problem when it comes to rendering the image properties in different browsers. Still, might work? For science, and all.

Try re-copying the coding above and pasting it. You'll have to add in the header image and the navbar image again but it should be working now.

Yes! It's working perfectly in both browsers! :D

Thank you so much for the help; it looks gorgeous. Great work! ♥

I'm so glad! Enjoy!

(And I have to say: I've gained a lot of smiles from watching you answer my icons with the perfect icons from your own account! Clearly we are secretly the same person. XD)

Clearly. *lol* What are icons for! I love sharing icons I love especially when someone is clearly a fan of the same thing! *lol*

And sometime they just fit.

Layout Lounge

Layouts, Tutorials, Help, and more

40. 2 Star Trek Geektastic Layouts

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

About

Links

Tags

Summary

April 2025