Weiss layout

[fuesch]

In general news: New and improved layout table \o/ with all the info I wanted to give you for ages, but for whatever reason hadn't.

What we have here specifically is a layout with my favorite Alias character (My god, it’s reeeally time for a rewatch!). I started this layout ages ago, this one's older than my other old layouts, because it didn't even start out as an LJ layout, it's from when I still had a blog.

Weiss

preview



Click here for live preview, then click on the layout's icon.



layout info
Based on Flexible Squares.
Works for all account types.
Tested in Firefox 7, Google Chrome 14 and Internet Explorer 8.

This layout's width is flexible, you can make #content-outer (and with that the maincontent) wider if you want - if you do that, you'll have to change the width of #header too.

how to implement this layout
Go to the Customize Journal page.

Make sure Style System is S2.

Choose the Flexible Squares layout.

Go to Custom CSS
» Use layout's stylesheet(s): No
» Use layout's stylesheet(s) when including custom external stylesheet: No
» Use external stylesheets: No
insert custom stylesheet

/* Weiss
http://fuesch.livejournal.com/26155.html */

body {
margin: 0px;
padding: 0px;
text-align: center;
font-family: "Verdana", sans-serif;
color: #55472D;
font-size: 12px;
background: #A99F79;
}

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

a:visited {
color: #9C483B;
text-decoration: none;
}

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

a:active {
color:#E10000;
text-decoration: none;
}

code, kbd, pre, tt {
font-family: "Courier New", Courier, monospace;
font-size: 12px;
}

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

blockquote {
padding: 10px;
background: url(http://fatfrog.info/Ma/A/layout/weiss/blockquote.gif);
}

q {
font-style: italic;
}

q i {
font-style: normal;
}

/* ------- GENERAL ------- */

.clear {
height: 15px;
}

#content-outer {
width: 900px;
margin: 0px auto;
padding: 0px;
background: #BDAE7B url(http://fatfrog.info/Ma/A/layout/weiss/content-outer.gif) left repeat-y;
}

#content {
margin: 0px;
padding: 0px;
background: url(http://fatfrog.info/Ma/A/layout/weiss/content.gif) right repeat-y;
}

#header {
height: 223px;
width: 819px;
margin: 0px auto 0px 0px;
padding: 35px 10px 0px 10px;
text-align: left;
color: #948465;
background: url(http://fatfrog.info/Ma/A/layout/weiss/header.jpg) left top no-repeat;
}

ul.navheader {
margin: 0px 0px 147px 325px;
padding: 0px;
font-weight: bold;
text-transform: uppercase;
letter-spacing: 1px;
}

ul.navheader a, ul.navheader a:link, ul.navheader a:visited {
color: #D4C593;
}

ul.navheader a:hover {
color: #811111;
}

ul.navheader a:active, {
color: #AC1313;
}

ul.navheader li {
display: inline;
padding: 0px 3px;
}

.title {
width: 360px;
margin: 0px 0px 0px 370px;
padding: 0px;
text-align: right;
font-style: italic;
}

.subtitle {
width: 365px;
margin: 0px 0px 0px 370px;
font-size: 10px;
text-align: right;
font-style: italic;
}

#sidebar {
float: left;
width: 243px;
margin: 0px 0px 0px 90px;
padding: 0px;
text-align: left;
background: url(http://fatfrog.info/Ma/A/layout/weiss/sidebar.gif);
}

.sbarbody {
padding: 0px;
background: url(http://fatfrog.info/Ma/A/layout/weiss/sbarbody.gif) top no-repeat;
}

.sbarbody2 {
margin: 0px;
padding: 10px 15px 25px 15px;
background: url(http://fatfrog.info/Ma/A/layout/weiss/sbarlist.gif) bottom no-repeat;
}

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

ul.sbarlist + .sbarlist {
margin: 0px;
padding: 10px 15px 20px 15px;
list-style: none;
background: url(http://fatfrog.info/Ma/A/layout/weiss/sbarlist.gif) bottom no-repeat;
}

li.sbartitle {
margin: 0px;
padding: 15px 10px 0px 10px;
list-style: none;
text-align: center;
font-weight: bold;
text-transform: uppercase;
}

.tagcloud {
padding: 0px;
list-style: none;
}

li.sbaritem {
margin: 0px;
padding: 5px 0px;
}

.defaultuserpic {
height: 110px;
margin: 0px;
padding: 10px;
text-align: center;
background: url(http://fatfrog.info/Ma/A/layout/weiss/defaultuserpic.gif);
}

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

.sbarcalendar {
padding: 3px 5px;
text-align: center;
background: #C3B481;
}

.sbarcalendarposts {
padding: 3px 5px;
text-align: center;
font-weight: bold;
background: #CBBC8A;
}

#maincontent {
margin: 0px 61px 0px 70px;
padding: 0px 0px 0px 273px;
text-align: left;
}

#footer {
height: 35px;
margin: -20px 50px 0px 50px;
padding: 25px 0px 0px 0px;
text-align: center;
font-weight: bold;
letter-spacing: 1px;
text-transform: uppercase;
background: url(http://fatfrog.info/Ma/A/layout/weiss/footer.png);
z-index: 100;
clear: both;
}

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

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

.clearfoot {
display: none;
clear: both;
}

/* ------- ENTRIES & FRIENDS ------- */

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

.userpic {
margin: 30px 10px 10px 0px;
padding: 0px 10px 10px 10px;
position: relative;
float: left;
background: url(http://fatfrog.info/Ma/A/layout/weiss/userpic.gif);
z-index: 15;
}

.userpicfriends {
margin: 30px 10px 10px 0px;
padding: 0px 10px 7px 10px;
position: relative;
float: left;
text-align: center;
color: #A8614D;
font-size: 10px;
background: url(http://fatfrog.info/Ma/A/layout/weiss/userpic.gif);
z-index: 15;
}

.userpicfriends img {
padding-bottom: 3px;
}

.userpicfriends font {
color: #E2D3A2;
}

.datesubject {
margin: 0px -61px 0px 0px;
padding: 0px;
text-align: right;
background: url(http://fatfrog.info/Ma/A/layout/weiss/subject.jpg) right bottom no-repeat;
}

.date {
padding: 0px 70px 0px 0px;
color: #811111;
text-transform: uppercase;
}

.subject {
height: 48px;
margin: -2px 0px 0px 0px;
padding: 23px 20px 0px 0px;
color: #E2D3A2;
font-weight: bold;
text-transform: uppercase;
}

.subject a, .subject a:link {
color: #E2D3A2;
}

.subject a:visited {
color: #CBBC8A;
}

.subject a:hover, .subject a:active {
color: #E2D3A2;
}

.entry {
margin: 0px;
padding: 10px 10px 0px 0px;
text-align: left;
}

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

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

.ljtags {
margin-top: 15px;
padding: 5px 5px 5px 10px;
font-size: 11px;
background: url(http://fatfrog.info/Ma/A/layout/weiss/tagscurrents.gif) left no-repeat;
}

.entry .clear {
height: 15px;
}

.currents {
margin-top: -15px;
padding: 5px 5px 5px 10px;
font-size: 11px;
background: url(http://fatfrog.info/Ma/A/layout/weiss/tagscurrents.gif) left no-repeat;
}

.currents strong {
font-weight: normal;
}

.comments {
height: 37px;
width: 352px;
margin: 0px -71px 0px auto;
padding: 23px 0px 0px 10px;
text-align: center;
color: #CDBE8C;
font-weight: bold;
background: url(http://fatfrog.info/Ma/A/layout/weiss/comments.jpg) right no-repeat;
}

.separator {
height: 35px;
}

/* ------- COMMENTS ------- */

.skiplinks {
padding: 10px;
text-align: center;
color: #A8614D;
background: url(http://fatfrog.info/Ma/A/layout/weiss/userpic.gif);
}

.skiplinks a, .skiplinks a:link {
color: #E2D3A2;
}

.skiplinks a:visited {
color: #CBBC8A;
}

.skiplinks a:hover, .skiplinks a:active {
color: #E2D3A2;
}

.box {
padding: 0px 0px 20px 0px;
}

.box center {
padding-bottom: 10px;
}

.commentbox {
margin: 10px 0px 20px 0px;
padding: 0px;
border: 1px solid #811111;
}

.datesubjectcomment {
margin: 0px;
padding: 5px;
color: #AD8D67;
background: url(http://fatfrog.info/Ma/A/layout/weiss/userpic.gif);
}

.datesubjectcomment a, .datesubjectcomment a:link {
color: #E2D3A2;
}

.datesubjectcomment a:visited {
color: #CBBC8A;
}

.datesubjectcomment a:hover, .datesubjectcomment a:active {
color: #E2D3A2;
}

.datesubjectcomment strong {
font-size: 16px;
}

.userpiccomment {
position: relative;
margin: -5px 10px 5px -5px;
z-index: 15;
float: left;
}

.commentreply {
position: relative;
margin: 10px;
}

.commentreply + div {
padding: 5px 5px 0px 5px;
border-top: 1px dashed #CBBC8A;
}

.commentboxpartial {
margin: 10px 0px 20px 0px;
padding: 10px;
color: #AD8D67;
background: url(http://fatfrog.info/Ma/A/layout/weiss/userpic.gif);
}

.commentboxpartial a, .commentboxpartial a:link {
color: #E2D3A2;
}

.commentboxpartia a:visited {
color: #CBBC8A;
}

.commentboxpartial a:hover, .commentboxpartial a:active {
color: #E2D3A2;
}

.box + .separator {
display: none;
}

#content + div {
background-color: transparent!important;
border: none!important;
}

/* ------- COMMENTING ------- */

.replytoposter {
padding: 0px 70px 0px 0px;
color: #811111;
text-transform: uppercase;
}

.replytosubject {
height: 48px;
margin: -2px 0px 0px 0px;
padding: 23px 20px 0px 0px;
color: #E2D3A2;
font-weight: bold;
text-transform: uppercase;
background: url(http://fatfrog.info/Ma/A/layout/weiss/subject.jpg) right top;
}

.replytosubject a, .replytosubject a:link {
color: #E2D3A2;
}

.replytosubject a:visited {
color: #CBBC8A;
}

.replytosubject a:hover, .replytosubject a:active {
color: #E2D3A2;
}

* html div.box#commentform {
/* fixes an IE reply page bug */
position: absolute;
}

input, textarea {
background: #CBBC8A;
color: #55472D;
}

textarea.textbox {
width: 95% !important;
}

#postform td {
padding: 3px;
background: url(http://fatfrog.info/Ma/A/layout/weiss/tagscurrents.gif) left repeat-y;
}

/* ------- CALENDAR ------- */

ul.year {
margin: 0px 0px 40px 0px;
padding: 10px;
text-align: center;
color: #AD8D67;
font-weight: bold;
text-transform: uppercase;
background: url(http://fatfrog.info/Ma/A/layout/weiss/userpic.gif);
}

ul.year a, ul.year a:link {
color: #E2D3A2;
}

ul.year a:visited {
color: #CBBC8A;
}

ul.year a:hover, ul.year a:active {
color: #E2D3A2;
}

ul.year li {
display: inline;
padding: 0px 2px;
}

.active {
font-size: 16px;
}

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

td.yearmonth {
font-weight: bold;
text-transform: uppercase;
border-style: none;
}

td.yearmonth a {
font-weight: normal;
text-transform: none;
border-style: none;
}

table.yeartable td.yearday {
padding: 10px;
text-align: center;
color: #E2D3A2;
font-weight: bold;
text-transform: uppercase;
background: url(http://fatfrog.info/Ma/A/layout/weiss/userpic.gif);
}

table.yeartable td.yeardate {
padding: 2px 4px;
background: url(http://fatfrog.info/Ma/A/layout/weiss/blockquote.gif);
}

table.yeartable td.yeardate a {
padding: 0px 10px;
font-weight: bold;
}

.lj-view-day .separator + .clear + .clear + .skiplinks {
margin-top: -50px;
}

.lj-view-month #maincontent form {
padding: 0px 0px 10px 0px;
color: #AD8D67;
background: url(http://fatfrog.info/Ma/A/layout/weiss/userpic.gif);
}

.lj-view-month form a, .lj-view-month form a:link {
color: #E2D3A2;
}

.lj-view-month form a:visited {
color: #CBBC8A;
}

.lj-view-month form a:hover, .lj-view-month form a:active {
color: #E2D3A2;
}

.lj-view-month .entry {
padding-bottom: 20px;
}

.lj-view-month dt {
margin: 10px 0px -14px 0px;
padding: 0px;
}

.lj-view-month dd {
padding: 5px;
background: url(http://fatfrog.info/Ma/A/layout/weiss/tagscurrents.gif) left repeat-y;
}

/* ------- TAGS ------- */

.lj-view-tags #maincontent {
padding: 5px 50px 5px 273px;
}

.lj-view-tags h2 {
margin-left: 40px;
font-size: 16px;
}

.ljtaglist {
margin-left: 0px;
}

ul.ljtaglist {
list-style: none;
}

ul.ljtaglist li {
margin-bottom: 5px;
padding: 5px 0px;
}

/* ------- EXTRAS ------- */

.caption img {
margin-bottom: 7px;
}

.caption {
margin: 0px auto;
padding: 20px 20px 7px 20px;
text-align: right;
font-size: 11px;
background: url(http://fatfrog.info/Ma/A/layout/weiss/blockquote.gif);
border: 1px solid #E2D3A2;
}

.captionless {
margin: 0px auto;
padding: 20px;
background: url(http://fatfrog.info/Ma/A/layout/weiss/blockquote.gif);
border: 1px solid #E2D3A2;
}

.spoiler {
padding: 2px;
background: #BDAE7B!important;
color: #BDAE7B!important;
}

.spoiler a, .spoiler a:link, .spoiler a:visited, .spoiler a:hover, .spoiler a:active {
color: #BDAE7B!important;
}