layout #04
Info
Style: Flexible Squares
Works with: Basic, Paid, maybe Sponsored
Works in: AOL Browser, IE, maybe others
Best view: 800x600 and up
Sidebar: Yes
Directions
Go to manage and select customize.
In the 'basic' tab make sure 's2' is selected.
In the 'look and feel' tab select 'flexible squares' under layout and language drop-down.
In the 'custom options' tab:
--under 'sidebar' make sure 'show sidebar' is set to 'yes.'
--go to 'custom css' and put all the drop down boxes to 'no.'
--paste the layout code in the stylesheet box.
Stylesheet
/*---------------------------------------------------
Custom layout by: keb91
Style: Flexible Squares
-----------------------------------------------------*/
body {
background-color: #668b00;
background-image: url();
background-position: center;
background-attachment: scroll;
text-align: center;
color: #888888;
font-family: "arial", sans-serif;
font-size: 11px;
margin-top: 10px;
}
a, a:link, a:visited {
color: #669900;
text-decoration: none;
}
a:hover {
color: #669900;
font-weight: none;
text-decoration: none;
}
p, td, blockquote {
font-size: 11px;
}
b, i, s, u, emphasise, abbr, strong, strike {
color: #669900;
}
code, kbd, pre, tt {
font-family: monospace;
}
/*---------------------------------------------------------------------
General page alignment and width
------------------------------------------------------------------------*/
#content
{
width: 780px;
margin-top: 10px;
margin-left: auto; margin-right: auto;
background-color: #ffffff;
border-top: solid 0px #ffffff;
border-bottom: solid 0px #ffffff;
padding: 15px;
text-align: justify;
}
#maincontent {
margin-top: 30px;
font-family: "arial", sans-serif;
font-size: 11px;
background-color: #ffffff;
color: #888888;
margin-right: 190px; /*width of sidebar*/
text-align: justify;
}
#sidebar {
padding: 10px 10px 10px 10px;
border-left: solid #dddddd 1px;
margin-top: 30px;
margin-right: 0px;
background-color: #ffffff;
font-size: 11px;
font-family: "arial", sans-serif;
color: #888888;
width: 150px;
float: right;
text-align: left;
}
/*-----------------------------------------------------------------------------
Header - you can add a header image with either #header or .headerimage
--------------------------------------------------------------------------------*/
#header {
padding-top: 15px;
padding-bottom: 8px;
margin-right: 0px;
text-align: center;
font-family: "times new roman", sans-serif;
line-height: 15px;
font-size: 14px;
font-weight: none;
letter-spacing: 2px;
text-transform: lowercase;
background-color: #ffffff;
color: #669900;
}
/*look and color of links (also partly for footer)*/
div#header a, div#header a:link, div#header a:visited, div#footer a, div#footer a:link, div#footer a:visited {
text-transform: lowercase;
font-size: 14px;
color: #999999;
}
div#header a:hover, div#footer a:hover {
text-transform: lowercase;
font-size: 14px;
color: #669900;
text-decoration: none;
}
/*title and subtitle*/
.title {
display: none;
font-family: "arial", sans-serif;
font-size: 13px;
color: #888888;
font-weight: normal;
text-transform: uppercase;
letter-spacing: 1px;
margin-top: 10px;
}
.subtitle{
display: none;
font-family: "trebuchet ms", sans-serif;
color: #888888;
font-size: 11px;
font-weight: normal;
letter-spacing: 1px;
}
/*-----------------------------------------------------------------------------
Header - top navigation
--------------------------------------------------------------------------------*/
/* header -- links to views; title of journal; subtitle of journal */
ul.navheader
{
padding: 0px;
margin: 0px;
font-size: 17px;
text-transform: uppercase;
}
ul.navheader li {
display: inline;
padding: 0 3px 0 3px;
}
/*-----------------------------------------------------------------------------
Entry stuff
------------------------------------------------------------------------*/
.subcontent {
}
.entry {
margin: 0px 0px 0px 0px;
margin-left: 125px;
margin-right: 190px /*width of sidebar*/
padding: 8px;
background-color: #ffffff;
color: #888888;
font-family: "arial", sans-serif;
font-size: 11px;
text-align: justify;
border-bottom: solid #dddddd 1px;
}
.userpic {
float: left;
text-align: center;
padding: 0px;
margin: 10px;
z-index: 15;
font-size: 8px
border-width: 1px;
border-color: #ffffff;
border-style: solid;
}
.date {
line-height: 200%;
top: 5px;
color: #999999;
text-transform: uppercase;
text-align: left;
font-family: "arial", sans-serif;
font-size: 10px;
}
.subject {
margin-left: 6px;
font-weight: none;
padding: 1px;
text-align: left;
text-transform: lowercase;
letter-spacing: 1px;
color: #669900;
font-family: "times new roman", sans-serif;
font-size: 20px;
border-bottom: 1px solid #dddddd;
}
.subject a, .subject a:link, .subject a:visited {
color: #888888;
}
.subject a:hover {
color: #669900;
}
.datesubject {
background-color: #ffffff;
padding: 5px;
}
.entry ul li
{
padding-left: 5px;
margin-left: 10px;
}
.entry ol li
{
padding-left: 5px;
margin-left: 10px;
}
/*---------------------------------------------------------------------
Entry Stuff - Current Mood, Music and Location
------------------------------------------------------------------------*/
.currents, .currentmood, .currentmusic {
margin-top: 0px
font-family: "arial", sans-serif;
font-size: 10px;
color: #AAAAAA;
text-align: left;
}
.ljtags {
font-family: "arial", sans-serif;
font-size: 10px;
color: #7F7F7F;
margin-top: 14px;
margin-bottom: 0px;
text-transform: lowercase;
font-weight: none;
position: left;
}
/*---------------------------------------------------------------------
Entry Stuff - Comments
------------------------------------------------------------------------*/
.comments {
font-family: "times new roman", sans-serif;
font-size: 12px;
text-align: center;
text-transform: lowercase;
background-color: #ffffff;
padding: 0px 5px 0px 5px;
position: relative;
top: 15px;
}
div.comments a, div.comments a:link, div.comments a:visited{
color: #888888;
}
div.comments a:hover {
color: #669900;
text-decoration: none;
font-size: 14px;
padding: 3px
}
/*---------------------------------------------------------------------
Entry Stuff - Separator
------------------------------------------------------------------------*/
.separator{
/* for formatting separators between entries */
height: 9px;
}
/*------------------------------------------------------------
Special friends page customization
-------------------------------------------------------------------------------*/
.userpicfriends {
background-color:#ffffff !important;
position: relative;
float: left;
padding: 5px;
margin: 10px;
text-wrap: none;
text-align: center;
font-family: "Verdana", sans-serif;
font-size: 11px;
z-index: 15;
}
/*------------------------------------------------------------
Sidebar
-------------------------------------------------------------------------------*/
.defaultuserpic {
text-align: center;
}
.sbarheader {
padding: 0px 5px 0px 5px;
}
.sbarbody {
padding: 0px 5px 0px 5px;
}
.sbarbody2 {
padding: 0 10px 0 10px;
}
div#sidebar a, div#sidebar a:link, div#sidebar a:visited{
color: #888888;
}
div#sidebar a:hover {
color: #669900;
text-decoration: none;
}
/*------------------------------------------------------------
Sidebar - Calendar
-------------------------------------------------------------------------------*/
table.calendar {
margin-right: auto;
margin-left: auto;
}
.sbarcalendar {
border-color: #ffffff;
border-width: 1px;
border-style: solid;
text-align: center;
font-family: "trebuchet ms", sans-serif;
font-size: 10px;
}
.sbarcalendarposts {
border-color: #ffffff;
border-width: 1px;
border-style: solid;
background-color: #ffffff;
text-align: center;
font-family: "trebuchet ms", sans-serif;
font-size: 10px;
}
/*------------------------------------------------------------
Sidebar - link box contents and sidebar box titles
-------------------------------------------------------------------------------*/
ul.sbarlist
{
padding-left: 0px;
margin-left: 0px;
list-style: none;
}
li.sbaritem
{
padding-left: 15px;
list-style: none;
}
li.sbartitle
{
padding-left: 0px;
margin-right: 0px;
text-align: left;
list-style: none;
background-color: #ffffff;
margin-bottom: 2px;
margin-top: 15px;
font-family: "times new roman", sans-serif;
font-size: 13px;
text-transform: lowercase;
color: #669900;
border-bottom: 0px dotted #888888;
}
/*----------------------------------------------------
footer
----------------------------------------------------------------*/
#footer {
width: 100%;
text-align: center;
font-family: "arial", sans-serif;
font-size: 11px;
font-weight: none;
letter-spacing: 1px;
background-color: #ffffff;
color: #888888;
border-color: #ffffff;
border-width: 1px;
border-style: solid;
z-index: 100;
clear: both;
}
ul.navfooter{
padding: 0px;
margin: 0px;
}
ul.navfooter li {
display: inline;
margin: 0 5px 0 5px;
}
.clearfoot {
clear: both;
}
/*----------------------------------------------------
Archive Pages
----------------------------------------------------------------*/
ul.year {
text-align: center;
padding-bottom: 40px;
}
ul.year li {
display: inline;
}
table.yeartable {
margin-left: auto;
margin-right: auto;
}
table.yeartable td.yeardate, table.yeartable td.yearday {
border-width: 1px;
border-style: solid;
border-color: #999999;
}
table.yeartable td.yearday {
background-color: #000000;
text-align: center;
}
td.yearmonth {
border-style: none;
}
/*----------------------------------------------------
Comments pages
----------------------------------------------------------------*/
.datesubjectcomment {
background-color: #ffffff;
padding: 5px;
margin-top: 20px;
}
.userpiccomment {
position: relative;
background-color: #ffffff;
top: -30px;
left: 0px;
padding: 5px;
margin: 10px 10px -20px 10px;
z-index: 15;
float: left;
}
.box {
border-style: solid;
border-width: 1px 0px 0px 0px;
border-color: #999999;
padding: 10px;
clear: left;
}
input, textarea {
background-color: #ffffff;
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: "arial", sans-serif;
font-size: 11px;
line-height: 125%;
background-color: #ffffff;
color: #000000;
}
.replytosubject {
font-weight: bold;
}
.commentreply {
position: relative;
margin: 10px;
font-size: 11px;
font-family: "arial", sans-serif;
color: #000000;
}
.commentbox {
border-color: #999999;
border-width: 1px;
border-style: solid;
padding: 10px;
margin: 10px;
background-color: #ffffff;
}
.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #888888;
}
.datesubjectcomment a:hover {
color: #669900;
}
.commentboxpartial {
border-color: #999999;
border-width: 1px;
border-style: solid;
padding: 10px;
margin: 10px;
background-color: #ffffff;
}
.commentinfo {
background-color: #ffffff;
margin-top: 10px;
width: 100%;
}
.skiplinks {
text-align: center;
}
/*--------------------------------------------
Misc
-----------------------------------------*/
.clear {
height: 15px;
}
.headerimage {
position: relative;
width: 0px;
height: 0px;
margin-left: auto;
margin-right: auto;
margin-bottom: 0px;
background-image: url("");
background-repeat: no-repeat;
}
Extra Stuff
---comments are awesome
---credit keb91 or painfuldefeat
---customize to your liking
---do not repost as your own
---enjoy!
Layouts will now be posted at vapores.
Watch there instead of here for further updates, thanks! :)