Alias S4 Cast layout & profile layout

[fuesch]

I make an Alias layout and what do I do? Put a color with the code #474747 in, of course. I just couldn't resist! That's why the layout is so gray. This layout was actually started, because I saw that an Alias icon community had no layout, it was completely CSSless. But then I had abandoned the layout, because that's what I used to do.

Alias S4 Cast

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 maincontent isn't flexible.

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

/* Alias S4 Cast
http://fuesch.livejournal.com/29769.html */

body {
margin: 0px;
padding: 50px 0px 0px 0px;
text-align: center;
font-family: Georgia, "Times New Roman", Times, serif;
color: #FFFFFF;
font-size: 13px;
background: #474747 url(http://fatfrog.info/Ma/A/layout/aliass4cast/bg.gif) center repeat-y;
}

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

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

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

a:active {
color:#000000;
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;
border: 1px solid #6B6B6B;
-moz-box-shadow: #6B6B6B 0px 0px 10px;
-webkit-box-shadow: #6B6B6B 0px 0px 10px;
}

q {
font-style: italic;
}

q i {
font-style: normal;
}

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

.clear {
height: 15px;
}

#content-outer {
background: url(http://fatfrog.info/Ma/A/layout/aliass4cast/cast.jpg) center 50px no-repeat;
}

#content {
width: 950px;
margin: 0px auto;
padding: 0px;
}

#header {
margin: 0px 175px 40px 175px;
padding: 9px 0px 0px 0px;
text-align: right;
background: url(http://fatfrog.info/Ma/A/layout/aliass4cast/navheader-top.jpg) center top no-repeat;
}

ul.navheader {
margin: 0px;
padding: 4px 10px 13px 10px;
background: url(http://fatfrog.info/Ma/A/layout/aliass4cast/navheader-bottom.jpg) bottom repeat-x;
}

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

.title {
margin: -6px 10px 0px 10px;
font-size: 24px;
color: #474747;
text-transform: lowercase;
letter-spacing: 2px;
}

.subtitle {
margin: -1px 10px 0px 10px;
font-size: 20px;
color: #474747;
text-transform: lowercase;
letter-spacing: 2px;
}

#sidebar {
float: left;
width: 165px;
margin: 210px 0px 0px 0px;
padding: 0px;
text-align: right;
color: #1E1E1E;
}

div#sidebar a, div#sidebar a:link {
color: #A0A0A0;
}

div#sidebar a:visited {
color: #919191;
}

div#sidebar a:hover {
color: #E7E7E7;
}

div#sidebar a:active {
color: #FFFFFF;
}

.sbarbody {
padding: 0px;
}

.sbarbody2 {
margin: 0px 0px 15px 0px;
padding: 5px 0px 0px 0px;
}

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

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

li.sbartitle {
margin: 0px;
padding: 0px;
font-size: 20px;
list-style: none;
}

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

li.sbaritem {
margin: 0px;
padding: 0px 10px 6px 0px;
background: url(http://fatfrog.info/Ma/A/layout/aliass4cast/lessthan.png) right 5px no-repeat;
}

.defaultuserpic {
margin: 0px 0px 15px 0px;
}

.defaultuserpic img {
padding: 10px;
background: url(http://fatfrog.info/Ma/A/layout/aliass4cast/iconbg.gif);
-moz-box-shadow: #373737 0px 0px 10px;
-webkit-box-shadow: #373737 0px 0px 10px;
}

table.calendar {
margin: 0px auto;
}

.sbarcalendar {
padding: 1px 2px;
text-align: center;
border: 1px solid #1E1E1E;
}

.sbarcalendarposts {
padding: 1px 2px;
text-align: center;
font-weight: bold;
border: 1px solid #1E1E1E;
}

#maincontent {
margin: 0px 195px;
text-align: left;
}

#footer {
margin: 20px 175px;
padding: 9px 0px 0px 0px;
text-align: right;
text-transform: capitalize;
background: url(http://fatfrog.info/Ma/A/layout/aliass4cast/navheader-top.jpg) center top no-repeat;
z-index: 100;
clear: both;
}

ul.navfooter{
margin: 0px;
padding: 4px 10px 13px 10px;
background: url(http://fatfrog.info/Ma/A/layout/aliass4cast/navheader-bottom.jpg) bottom repeat-x;
}

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

.clearfoot {
clear: both;
}

.lj-view-recent .clearfoot, .lj-view-friends .clearfoot {
display: none;
}

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

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

.userpic {
position: relative;
float: right;
margin: 0px 0px 10px 10px;
padding: 10px;
background: url(http://fatfrog.info/Ma/A/layout/aliass4cast/iconbg.gif);
-moz-box-shadow: #6B6B6B 0px 0px 10px;
-webkit-box-shadow: #6B6B6B 0px 0px 10px;
z-index: 15;
}

.userpicfriends {
position: relative;
float: right;
margin: 0px 0px 10px 10px;
text-align: right;
font-size: 10px;
color: #616161;
background: none!important;
z-index: 15;
}

.userpicfriends img {
margin: 0px 0px 2px 0px;
padding: 10px;
background: url(http://fatfrog.info/Ma/A/layout/aliass4cast/iconbg.gif);
-moz-box-shadow: #6B6B6B 0px 0px 10px;
-webkit-box-shadow: #6B6B6B 0px 0px 10px;
}

.userpicfriends font {
color: #313131;
}

.userpicfriends font:hover {
color: #1E1E1E;
}

.datesubject {
margin-bottom: 15px;
padding: 0px;
}

.date, .replytoposter {
padding: 0px;
color: #616161;
font-size: 16px;
}

.subject, .replytosubject {
margin-top: -10px;
font-size: 20px;
}

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

.ljtags {
margin: 15px 0px 0px 0px;
padding: 0px 0px 0px 10px;
font-size: 12px;
background: url(http://fatfrog.info/Ma/A/layout/aliass4cast/greaterthan.png) left 5px no-repeat;
}

.currents {
margin: -15px 0px 0px 0px;
font-size: 12px;
}

.currents strong {
font-weight: normal;
}

.currentmood, .currentmusic, .currentlocation {
padding: 0px 0px 0px 10px;
background: url(http://fatfrog.info/Ma/A/layout/aliass4cast/greaterthan.png) left 5px no-repeat;
}

.comments {
font-size: 20px;
text-align: right;
color: #777777;
}

.separator {
height: 50px;
}

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

.lj-view-entry .separator {
display: none;
}

.skiplinks {
margin: 0px 0px -5px 0px;
padding: 0px 0px 10px 0px;
text-align: center;
color: #777777;
border-bottom: 1px solid #616161;
}

.skiplinks a {
margin: 0px 2px;
}

.box {
margin: -5px 0px 0px 0px;
padding: 10px 0px 0px 0px;
border-top: 1px solid #616161;
}

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

.box + .box center {
margin-top: 10px;
}

.commentbox {
margin: 10px 0px 30px 0px;
padding: 0px;
}

.datesubjectcomment {
margin: 0px;
padding: 5px 5px 14px 5px;
font-size: 11px;
background: url(http://fatfrog.info/Ma/A/layout/aliass4cast/navheader-bottom.jpg) bottom center;
}

.userpiccomment {
position: relative;
float: left;
margin: -5px 10px 10px 5px;
padding: 10px;
background: url(http://fatfrog.info/Ma/A/layout/aliass4cast/iconbg.gif);
-moz-box-shadow: #6B6B6B 0px 0px 10px;
-webkit-box-shadow: #6B6B6B 0px 0px 10px;
z-index: 15;
}

.commentreply {
margin: 0px;
}

.commentreply + div {
padding: 5px 0px 0px 0px;
text-align: right!important;
}

.commentreply + div div {
padding: 5px 0px 0px 0px!important;
text-align: right!important;
}

.commentboxpartial {
margin: 10px 0px 30px 0px;
padding: 5px;
font-size: 11px;
background: #919191;
}

.box + .separator, .box + .separator + .clear {
display: none;
}

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

.lj-view-reply .separator, .lj-view-reply .separator + .clear + div, .lj-view-reply .subcontent + .clear + div {
display: none;
}

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

#postform table, #qrform table {
border: none!important;
}

input, textarea {
background: #919191;
color: #1E1E1E;
}

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

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

ul.year {
margin: 0px 0px 10px 0px;
padding: 0px 0px 10px 0px;
text-align: center;
font-size: 16px;
border-bottom: 1px solid #616161;
}

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

table.yeartable {
margin: 0px auto;
}

td.yearmonth {
font-size: 20px;
border-style: none;
}

td.yearmonth a {
font-size: 12px;
border-style: none;
}

table.yeartable td.yearday {
padding: 10px;
text-align: center;
font-size: 16px;
background: #919191;
}

table.yeartable td.yeardate {
padding: 2px 4px;
background: #919191 url(http://fatfrog.info/Ma/A/layout/aliass4cast/iconbg.gif) center repeat-y;
}

table.yeartable td.yeardate a {
font-weight: bold;
}

.lj-view-month #maincontent form {
margin: 0px 0px 15px 0px;
padding: 0px 0px 15px 0px;
border-bottom: 1px solid #616161;
}

.lj-view-month #maincontent form br, .lj-view-month #maincontent form + br , .lj-view-month #maincontent form + br + br {
display: none;
}

.lj-view-month dt {
margin: 0px;
padding: 0px;
font-size: 20px;
}

.lj-view-month dt b {
font-weight: normal;
}

.lj-view-month dd + dt {
margin: 15px 0px 0px 0px;
}

.lj-view-month dd {
margin: -3px 0px 0px 20px;
}

.lj-view-day .skiplinks {
margin-bottom: 30px;
}

.lj-view-day .separator + .clear + .clear + .skiplinks {
margin-top: -40px;
padding: 10px 0px 0px 0px;
border-bottom: none;
border-top: 1px solid #616161;
}

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

.lj-view-tags #maincontent {
padding: 0px;
}

.lj-view-tags h2 {
margin: 0px;
font-size: 20px;
color: #616161;
font-weight: normal;
}

.ljtaglist {
margin: -12px 0px 0px 0px;
padding: 0px;
}

ul.ljtaglist {
list-style: none;
}

ul.ljtaglist li {
margin-bottom: 5px;
padding: 0px 0px 0px 10px;
background: url(http://fatfrog.info/Ma/A/layout/aliass4cast/greaterthan.png) left 5px no-repeat;
}



This profile layout's width is flexible.

Go to Edit Profile and insert the code into the Bio part.
To copy the code, click in the text area and then press Ctrl+A and Ctrl+C.

http://fatfrog.info/Ma/A/layout/aliass4cast/profile-left.gif" valign="top">		http://fatfrog.info/Ma/A/layout/aliass4cast/profile-right.gif" valign="top">
http://fatfrog.info/Ma/A/layout/aliass4cast/profile-left.gif" valign="top">http://fatfrog.info/Ma/A/layout/aliass4cast/profile-left.jpg" />	TEXT GOES HERE	http://fatfrog.info/Ma/A/layout/aliass4cast/profile-right.gif" valign="top">http://fatfrog.info/Ma/A/layout/aliass4cast/profile-right.jpg" />
http://fatfrog.info/Ma/A/layout/aliass4cast/profile-left.gif" valign="top">		http://fatfrog.info/Ma/A/layout/aliass4cast/profile-right.gif" valign="top">

You don't have to use the lj-raw tags. With them you can only make line breaks/new paragraphs with
and
. Without the lj-raw tags you can also create line breaks and new paragraphs just by hitting the enter key.

If you want to change the link color, put a font tag with a different color in your link. Like so:
LINK TEXT