[layouts] rivers flowing into towns

[alpenglowe]

Layout Style: S2, Flexible Squares
Account types: Free, Paid, Plus




click on the thumbnail for a bigger screen shot.



Theme
Flexible Squares

Style
Set "Background color of the entries" to #fff

Display: Wrap Entry text under userinfo

Yes

Custom CSS

select-all (CTRL+A), copy (CTRL+C), then paste (CTRL+V)

body {
background-color: #101010;
text-align: center;
color: #7d9499;
font-family: "Verdana", sans-serif;
font-size: 11px;
line-height: 16px;
margin: 0;
}

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

a:hover {
color: #094942;
text-decoration: underline;
}

p, td, blockquote {
font-size: 11px;
}

blockquote { background : #f1f1f1;
border-right: 1px solid #d0d0d0;
border-bottom: 1px solid #d0d0d0;
padding: 10px;
}

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

i, em {color: #8a3a2a;}
b, strong {color: #2b8699; font-weight: bold;}
b a, a b, strong a, a strong {color: #d75623; text-decoration: none;}

#content
{
width: 870px;
margin-left: auto; margin-right: 0px;
background-color: #fff;
border: 0;
border-top: 40px solid #151515;
border-bottom: 5px solid #582716;
padding: 15px;
}

#maincontent {
margin-top: 10px;
font-family: "Verdana", sans-serif;
font-size: 11px;
background: none;
border: 0;
text-align: left;
}

#sidebar {

padding-top: 50px;
margin-top: -15px;
background: url("http://eljay.seventhgenesis.net/layouts/layout-16/eljay-alpenglowe16side.jpg") top center no-repeat #fff;
border-color: #3b4c58;
border-width: 0px;
border-style: solid;
font-size: 11px;
font-family: "Verdana", sans-serif;
color: #363f41;
width: 200px;
float: left;
text-align: left;
}

#header {
padding: 10px 10px 10px 10px;
margin: 0px;
margin-top: -260px;
position: absolute;
right: 373px;
text-align: right;
font-family: "georgia", "times new roman", serif;
font-size: 12px;
font-weight: normal;
letter-spacing: 0px;
border: 0;
background: none;
color: #000;
width: 160px;
}

#footer {
text-align: center;
font-family: "times new roman", serif;
font-size: 16px;
font-weight: bold;
letter-spacing: 0px;
background: none;
color: #000000;
border-color: #999999;
border-width: 0px;
border-style: solid;
z-index: 100;
clear: both;
font-style: italic;
}

/* header -- links to views; title of journal; subtitle of journal */

div#header a, div#header a:link, div#header a:visited {
color: #000;
}

div#footer a, div#footer a:link, div#footer a:visited {
color: #586f43;
}

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

ul.navheader
{
padding: 0px;
margin: 0px;
width: 180px;
border-top: 1px solid #fff;
}

ul.navheader li {
display: block;
padding: 5px 10px 5px 10px;
border-bottom: 1px solid #fff;
position: relative;
width: 160px;
height: 12px;
}

ul.navheader li:hover {
border-bottom: 1px solid #8f6e52;
color: #fff;
background: #191a1c;
}

.title {
font-family: "Georgia", times new roman, serif;
font-style: italic;
font-size: 28px;
font-weight: normal;
line-height: 100%;
top: 35px;
position: relative;
text-align: left;
left: -300px;
width: 500px;
}

.subtitle{
font-family: "Verdana", sans-serif;
font-size: 11px;
font-weight: normal;
top: 10px;
display: none;
}

/* sidebar */

div#sidebar a, div#sidebar a:link, div#sidebar a:visited{
color: #777777;
}

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

.defaultuserpic {
text-align: center;
}

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

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

.sbarbody2 {
padding: 0 15px 0 15px;
font-size: 11px;
line-height: 14px;
text-align: center;
}

#sidebar_tags {
text-align: left;
}

#sidebar_tags .sbaritem {
padding: 2px;
border-bottom: 1px solid #ccbba0;
padding-left: 7px;
}

#sidebar_summary li.sbaritem {
margin: 10px 10px;
padding: 3px 0;
border-bottom: 1px #788d92 solid;
text-align: left;
}

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

.sbarcalendar {
border-color: #31534e;
border-width: 0px;
border-style: solid;
text-align: center;
font-family: "Verdana", sans-serif;
font-size: 11px;
background: #ccc;
color: #676767;
}

.sbarcalendarposts {
border: 0;
background-color: #303030;
text-align: center;
font-family: "Verdana", sans-serif;
font-size: 11px;
}

.sbarcalendarposts:hover {background: #fff;}

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

ul.sbarlist2
{
padding-left: 0px;
margin-left: 0px;
}

li.sbaritem2
{
padding-left: 0px;
list-style: none;
margin-left: -35px;
padding: 3px;
border-bottom: 1px solid #dceaed;
text-align: left;
}

li.sbaritem2:hover {background: #e3e3e3;}
li.sbaritem:hover {background: #e3e3e3;}

li.sbaritem, .tagcloud
{
list-style: none;
padding: 3px;
border-bottom: 1px solid #dceaed;
padding-left: 5px;
margin-right: 10px;
margin-left: 10px;
}

li.sbartitle
{
padding: 5px;
list-style: none;
border-style: solid;
border-color: #6a1e1e;
border-width: 0;
background: none;
margin-bottom: 10px;
margin-top: 10px;
font-family: "times new roman", serif;
text-align: left;
font-size: 16px;
font-weight: bold;
letter-spacing: 0px;
color: #0d312b;
text-transform: lowercase;
font-style: italic;
}

li.sbartitle2
{
padding: 0px;
list-style: none;
border-style: solid;
border-color: #6a1e1e;
border-width: 0;
background: none;
margin-bottom: 10px;
margin-top: 10px;
margin-left: -5px;
font-family: "times new roman", serif;
text-align: left;
font-size: 16px;
font-weight: bold;
letter-spacing: 0px;
font-style: italic;
color: #0d312b;
}

/* maincontent */

.subcontent {
margin-right: 0px;
margin-left: 10px;
}

.entry {
margin: 0px 0px 10px 30px;
padding: 10px;
padding-top: 30px;
padding-left: 20px;
background: url("http://eljay.seventhgenesis.net/layouts/layout-16/eljay-alpenglowe16entry.jpg") top left no-repeat;
color: #313741;
font-family: "Verdana", sans-serif;
font-size: 11px;
text-align: left;
border-width: 0px;
border-color: #647983;
border-style: solid;
}

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

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

.userpic {
position: relative;
float: right;
background-color: #e2edeb;
padding: 10px;
margin: 10px;
z-index: 15;
border-width: 0px;
border-color: #919bad;
border-style: solid;
}

.userpicfriends {
position: relative;
float: right;
padding: 5px;
margin: 10px;
text-align: center;
border-style: solid;
border-width: 1px;
border-color: #293b3f;
font-family: "Verdana", sans-serif;
font-size: 11px;
z-index: 15;
background-color: #35414d;
}

.subcontent .userpicfriends {background-color: #35414d; }

.userpicfriends a {
color: #b8a7a1;
}

.date {
line-height: 100%;
top: 5px;
color: #000;
font-family: "Verdana", sans-serif;
font-size: 10px;
}

.replytoposter {
line-height: 100%;
top: 5px;
color: #424a4c;
font-family: "Verdana", sans-serif;
font-size: 10px;
}

.subject {
font-weight: normal;
padding: 2px;
color: #a0472a;
font-family: "times new roman", serif;
font-size: 24px;
}

.replytosubject {
font-weight: normal;
padding: 2px;
color: #a0472a;
font-family: "times new roman", serif;
font-size: 24px;
}

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

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

.datesubject {
background: none;
padding: 10px;
margin-left: 10px;
}

.currents, .currentmood, .currentmusic {
font-family: "Verdana", sans-serif;
font-size: 11px;
color: #a0472a;
}

.comments {
font-family: "times new roman", serif;
font-size: 18px;
text-align: right;
background: none;
padding: 0px 5px 0px 5px;
font-weight: bold;
color: #ccc;
margin-top: -25px;
}

div.comments a, div.comments a:link, div.comments a:visited{
color: #cf654c;
font-style: italic;
}

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

/* maincontent -- entry, reply pages */

.datesubjectcomment {
background-color: #fff;
padding: 5px;
margin-top: 20px;
font-size: 10px;
color: #000;
}

.userpiccomment {
position: relative;
border-width: 0px;
border-style: solid;
border-color: #fff;
background-color: #fff;
top: -30px;
left: 0px;
padding: 5px;
margin: 10px 10px -20px 10px;
z-index: 15;
float: left;
border-width: 1px;
}

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

textarea.textbox {
width: 95% !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: #3f575d;
color: #000000;
}

.commentreply {
position: relative;
margin: 10px;
font-size: 11px;
line-height: 12px;
font-family: "Verdana", sans-serif;
color: #383a3e;
}

.commentbox {
border-color: #d4d4d4;
border-width: 1px;
border-style: solid;
padding: 0px;
margin: 10px;
margin-right: 20px;
background-color: #efefef;
}

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

.datesubjectcomment a:hover {
color: #5c5c5c;
}

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

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

/* maincontent -- year/achive pages */

ul.year {
text-align: center;
padding-bottom: 40px;
font-size: 14px;
color: #232e31;
}

ul.year li.active {
font-weight: bold;
}

ul.year li {
display: inline;
}

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

table.yeartable td.yeardate, table.yeartable td.yearday {
border-width: 0px;
border-style: solid;
border-color: #999999;
background: #5b747a;
padding: 5px;
}

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

td.yearmonth {
border-style: none;
font-size: 12px;
font-family: "trebuchet ms", verdana, sans-serif;
}

/* footer */

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

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

.clearfoot {
clear: both;
}

/* misc */

.clear {
height: 10px;
}

.skiplinks {
text-align: center;
}

.headerimage {
background: url("http://eljay.seventhgenesis.net/layouts/layout-16/eljay-16.jpg") top right no-repeat #f0d0b4;
width: 870px;
height: 300px;
margin-left: auto;
margin-right: 0px;
border-left: 10px solid #223936;
padding: 0px 15px 0px 15px;
}

.separator{
/* for formatting separators between entries */
height: 35px;
}

* html div.subcontent {
/* fixes an IE reply page bug */
height: 1%;
clear: none;
}

* html div.box#commentform {
/* fixes an IE reply page bug */
position: absolute;
border-width: 1px;
border-style: solid;
border-color: #999999;
background-color: #c2cde0;
}

input, .textbox, option, select {
background: #7b7b7b;
border: 0;
color: #000;
font-size: 11px;
font-family: verdana, helvetica, sans-serif;
padding: 5px;
}

input:hover, .textbox:hover {
background: #222222;
color: #fff;
}

option, select {
background: #d2d2d2;
border: 0;
color: #000;
padding: 3px;
}

.ljtags {
font-weight: bold;
font-size: 10px;
color: #a0472a;
margin-top: 20px;
margin-bottom: -8px;
}

.ljtags a {color: #525252; font-weight: normal;}

.currents, .currentmood {
font-weight: normal;
font-size: 10px;
color: #a0472a;
margin-top: -10px;
}

.ljtaglist {margin-left: 100px;}

.ljuser img
{
/* fallback code for older browsers */
width: 0;
height: 0;
padding: 17px 20px 0 0;
/* for some reason IE doesn't understand
background shortcuts for this one */
background-image: url('http://eljay.seventhgenesis.net/layouts/layout-16/alpenglowe16user.gif');
background-repeat: no-repeat;
background-position: left middle;
}

.ljuser img[src="http://stat.livejournal.com/img/userinfo.gif"]
{
width: 0;
height: 0;
padding: 0 0 13px 10px;
background-image: url('http://eljay.seventhgenesis.net/layouts/layout-16/alpenglowe16user.gif');
background-repeat: no-repeat;
background-position: left middle;
}

.ljuser img[src="http://stat.livejournal.com/img/community.gif"]
{
width: 0;
height: 0;
padding: 12px 10px 0 10px;
background-image: url('http://eljay.seventhgenesis.net/layouts/layout-16/alpenglowe16com.gif');
background-repeat: no-repeat;
background-position: top middle;
}

.datesubject img[src="http://stat.livejournal.com/img/icon_protected.gif"]
{
width: 0;
height: 0;
padding: 13px 10px 0 0;
background-image: url('http://eljay.seventhgenesis.net/layouts/layout-16/alpenglowe16lock.gif');
background-repeat: no-repeat;
background-position: left middle;
}

.summaryList img[src="http://stat.livejournal.com/img/icon_protected.gif"]
{
width: 0;
height: 0;
padding: 13px 10px 0px 0px;
background-image: url('http://eljay.seventhgenesis.net/layouts/layout-16/alpenglowe16lock.gif');
background-repeat: no-repeat;
background-position: left middle;
}

.daysubjects img[src="http://stat.livejournal.com/img/icon_protected.gif"]
{
width: 0;
height: 0;
padding: 13px 10px 0px 0px;
background-image: url('http://eljay.seventhgenesis.net/layouts/layout-16/alpenglowe16lock.gif');
background-repeat: no-repeat;
background-position: left middle;
}

dd img[src="http://stat.livejournal.com/img/icon_protected.gif"]
{
width: 0;
height: 0;
padding: 13px 10px 0px 0px;
background-image: url('http://eljay.seventhgenesis.net/layouts/layout-16/alpenglowe16lock.gif');
background-repeat: no-repeat;
background-position: left middle;
}

Account Types
Free, Paid, Plus (Horizontal Placement)

Page Setup
2 Column (sidebar on left)

Use layout's stylesheet(s)
Yes

Screen Resolutions
1024 x 768 and larger

Tested in Browsers
Firefox, Internet Explorer, Opera

Credit
fanmedley or alpenglowe if ever you decide to use the layout. You could put something like "Layout by..." in your userinfo page or Link List: layout by fanmedley