Where the Leaves Turn Red - A S2 Flexible Squares Layout
Well, for the first time in a while, I come bringing a new layout. I wanted to do something fall themed, but that you just involved colors and not leaves. The coloring was actually inspired by the icon I'm using, and I determined the main colors using COLOURlovers, and a palette I came up with that I'll include in the bottom of this post. Without further ado:
Style: S2 Flexible Squares
Looks best in: All Browsers (tested in Firefox, Opera & IE)
Works with: Basic, Paid & Sponsored (ads are ugly, though)
Live Preview: Where the Leaves Turn Red Preview
Code & Instructions:
instructions to use;
Don't forget to please credit tomorrow_brings in your userinfo if using this layout.
1) Go to the CUSTOMIZE page.
2) Make sure you have "S2" selected.
3) In the Search bar on the first page, type "Flexible Squares". Find any theme (I usually use basic blue) and select "Apply".
4) On the very bottom of the page, under "Choose a Page Setup", select "2 Column (sidebar on left)".
5) To the right of that, click: "Customize Your Theme".
6) Next go to "Custom CSS". Make sure that all drop-down options are set to "No".
7) Copy the codes from the textarea below and paste them into the box. Hit save and voila!
css code;
/*---------------------------------------------------
Layout: Where The Leaves Turn Red
Stylesheet Created By: Amy of Tomorrow Brings (http://community.livejournal.com/tomorrow_brings)
Style: S2 Flexible Squares
Works best with: Free & Paid accounts
Browsers: Firefox, Opera and IE
-----------------------------------------------------*/
body {
background-color: #000000;
text-align: center;
color: #592e18;
font-family: "georgia", sans-serif;
font-size: 7.5pt;
margin: 0px 0 0px 0;
}
a, a:link, a:visited {
color: #CC1100;
text-decoration: none;
}
a:hover {
color: #FF660D;
text-decoration: underline;
}
p, td, blockquote {
font-size: 7.5pt;
}
code, kbd, pre, tt {
font-family: monospace;
}
blockquote {
margin: 10px 20px;
padding: 10px;
color: #592e18;
line-height: 16px;
font-size: 7.5pt;
font-family: georgia;
border: 1px dotted #592e18;
background-color: #f1f1f1;
text-align: left;
}
/*---------------------------------------------------------------------
General page alignment and width
------------------------------------------------------------------------*/
#content
{
width: 800px;
background-color: #000000;
margin-left: auto;
margin-right: auto;
}
#maincontent {
margin-top: 0px;
padding-left: 0px;
font-family: "georgia", sans-serif;
font-size: 7.5pt;
background-color: #ffffff;
color: #592e18;
border-style: solid;
border-color:#ffffff;
border-width: 1px;
margin-left: 200px;
text-align: justify;
}
#sidebar {
padding-right: 0px;
padding-top: 5px;
margin-top: 0px;
background-color: #e68600;
border-color:#592e18;
border-width: 0px;
border-style: solid;
font-size: 7.5pt;
font-family: "georgia", sans-serif;
color: #592e18;
width: 200px;
float: left;
text-align: justify;
}
/*-----------------------------------------------------------------------------
Header - you can add a header image with either #header or .headerimage
--------------------------------------------------------------------------------*/
#header {
width: auto;
margin: 0px;
text-align: center;
color: #ffffff;
background-image: url('http://i34.tinypic.com/a0j811.png');
background-position: left;
background-repeat: no-repeat;
text-transform: lowercase;
word-spacing: 2px;
font-size: 14pt;
padding: 35px;
clear: both;
}
.headerimage {
position: relative;
background-image: url('');
background-repeat: no-repeat;
width: 0px;
height: 0px;
margin-left: auto;
margin-right: auto;
margin-bottom: 20px;
}
/*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 {
color: #ffffff;
}
div#header a:hover, div#footer a:hover {
color: #CC1100;
text-decoration: none;
}
.title, .subtitle {
display: none;
}
/*-----------------------------------------------------------------------------
Header - top navigation
--------------------------------------------------------------------------------*/
/* header -- links to views; title of journal; subtitle of journal */
ul.navheader
{
padding: 0px;
margin: 0px;
}
ul.navheader li {
display: inline;
padding: 0 0px 0 0px;
}
/*-----------------------------------------------------------------------------
Entry stuff
------------------------------------------------------------------------*/
.subcontent { min-height: 150px; }
.entry {
margin: 0px 10px 10px 10px;
padding: 5px;
background-color: #ffffff;
color: #592e18;
font-family: "georgia", sans-serif;
font-size: 7.5pt;
text-align: justify;
border-width: 1px;
border-color: #ffffff;
border-style: solid;
}
.entry_text {
background-color:#ffffff;
padding-bottom: 10px;
}
.userpic {
position: relative;
float: right;
background-color: #ffffff;
padding: 5px;
margin: 10px;
z-index: 15;
border-width: 5px;
border-color: #bd0202;
border-style: solid;
}
.subject {
padding-left: 3px;
list-style: none;
background-color: #e68600;
margin-bottom: 10px;
margin-top: 5px;
border-color: #592e18;
border-bottom: 1px dotted #592e18;
color: #592e18;
font-family: "georgia", sans-serif;
font-size: 15pt;
text-transform: lowercase;
}
.subject a, .subject a:link, .subject a:visited {
color: #ffffff;
}
.subject a:hover {
color: #b0b9c8;
}
.date {
line-height: 150%;
text-transform: uppercase;
top: 5px;
color: #c4c4c4;
font-family: "georgia", sans-serif;
font-size: 10px;
}
.datesubject {
background-color: #ffffff;
padding: 5px;
}
.entry ul li
{
padding-left: 5px;
margin-left: 15px;
}
.entry ol li
{
padding-left: 5px;
margin-left: 15px;
}
.ljtags {
margin-top: 15px;
margin-bottom: 0px;
padding-left: 16px;
text-transform: lowercase;
font-size: 9px;
color: #592e18;
background: url('http://i35.tinypic.com/mwqzx3.png') left no-repeat;
}
/*---------------------------------------------------------------------
Entry Stuff - Current Mood, Music and Location
------------------------------------------------------------------------*/
.currents {
margin: 0px;
background-color: transparent;
}
.currents strong{
font-weight: normal;
font-size: 9px;
color: #592e18;
}
.currentlocation {
padding-left: 16px;
font-size: 9px;
color: #592e18;
background: url('http://i35.tinypic.com/mwqzx3.png') left no-repeat;
}
.currentmood {
padding-left: 16px;
font-size: 9px;
color: #592e18;
background: url('http://i35.tinypic.com/mwqzx3.png') left no-repeat;
}
.currentmusic {
padding-left: 16px;
font-size: 9px;
color: #592e18;
background: url('http://i35.tinypic.com/mwqzx3.png') left no-repeat;
}
/*---------------------------------------------------------------------
Entry Stuff - Comments
------------------------------------------------------------------------*/
.comments {
font-family: "georgia", sans-serif;
text-transform: uppercase;
font-size: 7.5pt;
text-align: left;
background-color: #ffffff;
padding: 0px 5px 0px 5px;
position: relative;
top: 15px;
}
div.comments a, div.comments a:link, div.comments a:visited{
color: #CC1100;
}
div.comments a:hover {
color: #FF660D;
text-decoration: none;
}
/*---------------------------------------------------------------------
Entry Stuff - Separator
------------------------------------------------------------------------*/
.separator{
/* for formatting separators between entries */
height: 10px;
width: auto;
border-bottom: 0px dashed #e6a100;
padding: 5px 5px 5px 5px;
}
/*------------------------------------------------------------
Special friends page customization
-------------------------------------------------------------------------------*/
.userpicfriends {
position: relative;
float: right;
background-color: #ffffff;
padding: 5px;
margin: 10px;
z-index: 15;
border-width: 5px;
border-color: #bd0202;
border-style: solid;
}
/*------------------------------------------------------------
Sidebar
-------------------------------------------------------------------------------*/
.defaultuserpic {
text-align: center;
}
.sbarheader {
padding: 0px 5px 0px 5px;
}
.sbarbody {
padding: 0px 5px 0px 5px;
}
.sbarbody2 {
padding: 0 15px 0 15px;
}
div#sidebar a, div#sidebar a:link, div#sidebar a:visited{
color: #CC1100;
}
div#sidebar a:hover {
color: #FFFFFF;
text-decoration: none;
}
#sidebar_tags span a {font-size: 7.5pt}
/*------------------------------------------------------------
Sidebar - Calendar
-------------------------------------------------------------------------------*/
table.calendar {
margin-right: auto;
margin-left: auto;
}
.sbarcalendar {
border-color: #592e18;
border-width: 1px;
border-style: solid;
text-align: center;
font-family: "georgia", sans-serif;
font-size: 7.5pt;
}
.sbarcalendarposts {
border-color: #592e18;
border-width: 1px;
border-style: solid;
background-color: goldenrod;
text-align: center;
font-family: "georgia", sans-serif;
font-size: 7.5pt;
}
/*------------------------------------------------------------
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;
list-style: none;
background-color: #e68600;
margin-bottom: 10px;
margin-top: 10px;
border-color: #592e18;
border-bottom: 1px dotted #592e18;
color: #592e18;
font-family: "georgia", sans-serif;
font-size: 15pt;
text-transform: lowercase;
}
/*----------------------------------------------------
footer
----------------------------------------------------------------*/
#footer {
width: 100%;
text-align: center;
font-family: "georgia", sans-serif;
font-size: 7.5pt;
font-weight: bold;
letter-spacing: 1px;
background-color: #000000;
color: #ffffff;
border-color:#592e18;
border-width: 0px;
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:#CC1100;
}
table.yeartable td.yearday {
background-color: #ffffff;
text-align: center;
}
td.yearmonth {
border-style: none;
}
/*----------------------------------------------------
Comments pages
----------------------------------------------------------------*/
.datesubjectcomment {
background-color: #ffffff;
padding: 5px;
margin-top: 20px;
}
.userpiccomment {
position: relative;
border-width: 5px;
border-style: solid;
border-color: #bd0202;
background-color: #ffffff;
top: -30px;
left: 0px;
padding: 5px;
margin: 10px 10px -20px 10px;
z-index: 15;
float: left;
}
.box {
width: auto;
clear: left;
padding: 10px;
border-left: 1px solid #592e18;
background-color: #FFFFFF;
}
input, textarea {
background-color: #f1f1f1;
color: #592e18;
border-left: 1px solid #f9f9f9;
}
textarea.textbox{
border: 0px solid #ffffff;
width: 100% !important;
}
.reply {
font-size: 10px;
line-height: 125%;
color: #592e18;
text-align: left;
position: relative;
margin: 20px 30px 10px 30px;
padding: 25px 10px 10px 10px;
}
.replytosubject {
font-weight: bold;
}
.commentreply {
position: relative;
margin: 10px;
font-size: 7.5pt;
font-family: "georgia", sans-serif;
color: #592e18;
}
.commentbox {
border-color: #592e18;
border-width: 1px;
border-style: solid;
padding: 10px;
margin: 10px;
background-color: #ffffff;
}
.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #CC1100;
}
.datesubjectcomment a:hover {
color: #b0b9c8;
}
.commentboxpartial {
padding: 10px;
margin: 10px;
background-color: #ffffff;
}
.commentinfo {
margin-top: 10px;
width: 100%;
}
.skiplinks {
text-align: center;
}
/*--------------------------------------------
Misc
-----------------------------------------*/
.ljuser img {
width: 0;
height: 0;
background-repeat: no-repeat;
background-image: url(http://i37.tinypic.com/2h36djo.png);
padding: 7px 0px 2px 7px;
}
.ljuser A:link, A:visited, A:active {
color: #CC1100;
text-decoration: none;
font-weight: bold;
}
.ljuser A:hover {
color: #FF660D;
text-decoration: none;
font-weight: bold;
}
.clear {
display: none;
}
layout images;
All the images used in the layout are uploaded to tinypic, so you do not have to re-upload them unless you want to. However if you do, here are links to all the images used in the layout:
Autumn Striped Header. { Made by me using photoshop and COLOURlovers}
LJ User Icon. {Made by FamFamFam.)
And that is it. There shouldn't be any problems, I tested the layout on my own journal, in all the browsers, including the custom comment page, tags page and calender page. I hope you all like the layout, I encourage you to comment and let me know what you think. And of course, feel free to comment if you have any questions.
Oh, and here is the COLOURlovers palette I create that inspired this layout. Feel free to give it some votes, etc, that would be great!
Color by COLOURlovers
Style: S2 Flexible Squares
Looks best in: All Browsers (tested in Firefox, Opera & IE)
Works with: Basic, Paid & Sponsored (ads are ugly, though)
Live Preview: Where the Leaves Turn Red Preview
Code & Instructions:
instructions to use;
Don't forget to please credit tomorrow_brings in your userinfo if using this layout.
1) Go to the CUSTOMIZE page.
2) Make sure you have "S2" selected.
3) In the Search bar on the first page, type "Flexible Squares". Find any theme (I usually use basic blue) and select "Apply".
4) On the very bottom of the page, under "Choose a Page Setup", select "2 Column (sidebar on left)".
5) To the right of that, click: "Customize Your Theme".
6) Next go to "Custom CSS". Make sure that all drop-down options are set to "No".
7) Copy the codes from the textarea below and paste them into the box. Hit save and voila!
css code;
/*---------------------------------------------------
Layout: Where The Leaves Turn Red
Stylesheet Created By: Amy of Tomorrow Brings (http://community.livejournal.com/tomorrow_brings)
Style: S2 Flexible Squares
Works best with: Free & Paid accounts
Browsers: Firefox, Opera and IE
-----------------------------------------------------*/
body {
background-color: #000000;
text-align: center;
color: #592e18;
font-family: "georgia", sans-serif;
font-size: 7.5pt;
margin: 0px 0 0px 0;
}
a, a:link, a:visited {
color: #CC1100;
text-decoration: none;
}
a:hover {
color: #FF660D;
text-decoration: underline;
}
p, td, blockquote {
font-size: 7.5pt;
}
code, kbd, pre, tt {
font-family: monospace;
}
blockquote {
margin: 10px 20px;
padding: 10px;
color: #592e18;
line-height: 16px;
font-size: 7.5pt;
font-family: georgia;
border: 1px dotted #592e18;
background-color: #f1f1f1;
text-align: left;
}
/*---------------------------------------------------------------------
General page alignment and width
------------------------------------------------------------------------*/
#content
{
width: 800px;
background-color: #000000;
margin-left: auto;
margin-right: auto;
}
#maincontent {
margin-top: 0px;
padding-left: 0px;
font-family: "georgia", sans-serif;
font-size: 7.5pt;
background-color: #ffffff;
color: #592e18;
border-style: solid;
border-color:#ffffff;
border-width: 1px;
margin-left: 200px;
text-align: justify;
}
#sidebar {
padding-right: 0px;
padding-top: 5px;
margin-top: 0px;
background-color: #e68600;
border-color:#592e18;
border-width: 0px;
border-style: solid;
font-size: 7.5pt;
font-family: "georgia", sans-serif;
color: #592e18;
width: 200px;
float: left;
text-align: justify;
}
/*-----------------------------------------------------------------------------
Header - you can add a header image with either #header or .headerimage
--------------------------------------------------------------------------------*/
#header {
width: auto;
margin: 0px;
text-align: center;
color: #ffffff;
background-image: url('http://i34.tinypic.com/a0j811.png');
background-position: left;
background-repeat: no-repeat;
text-transform: lowercase;
word-spacing: 2px;
font-size: 14pt;
padding: 35px;
clear: both;
}
.headerimage {
position: relative;
background-image: url('');
background-repeat: no-repeat;
width: 0px;
height: 0px;
margin-left: auto;
margin-right: auto;
margin-bottom: 20px;
}
/*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 {
color: #ffffff;
}
div#header a:hover, div#footer a:hover {
color: #CC1100;
text-decoration: none;
}
.title, .subtitle {
display: none;
}
/*-----------------------------------------------------------------------------
Header - top navigation
--------------------------------------------------------------------------------*/
/* header -- links to views; title of journal; subtitle of journal */
ul.navheader
{
padding: 0px;
margin: 0px;
}
ul.navheader li {
display: inline;
padding: 0 0px 0 0px;
}
/*-----------------------------------------------------------------------------
Entry stuff
------------------------------------------------------------------------*/
.subcontent { min-height: 150px; }
.entry {
margin: 0px 10px 10px 10px;
padding: 5px;
background-color: #ffffff;
color: #592e18;
font-family: "georgia", sans-serif;
font-size: 7.5pt;
text-align: justify;
border-width: 1px;
border-color: #ffffff;
border-style: solid;
}
.entry_text {
background-color:#ffffff;
padding-bottom: 10px;
}
.userpic {
position: relative;
float: right;
background-color: #ffffff;
padding: 5px;
margin: 10px;
z-index: 15;
border-width: 5px;
border-color: #bd0202;
border-style: solid;
}
.subject {
padding-left: 3px;
list-style: none;
background-color: #e68600;
margin-bottom: 10px;
margin-top: 5px;
border-color: #592e18;
border-bottom: 1px dotted #592e18;
color: #592e18;
font-family: "georgia", sans-serif;
font-size: 15pt;
text-transform: lowercase;
}
.subject a, .subject a:link, .subject a:visited {
color: #ffffff;
}
.subject a:hover {
color: #b0b9c8;
}
.date {
line-height: 150%;
text-transform: uppercase;
top: 5px;
color: #c4c4c4;
font-family: "georgia", sans-serif;
font-size: 10px;
}
.datesubject {
background-color: #ffffff;
padding: 5px;
}
.entry ul li
{
padding-left: 5px;
margin-left: 15px;
}
.entry ol li
{
padding-left: 5px;
margin-left: 15px;
}
.ljtags {
margin-top: 15px;
margin-bottom: 0px;
padding-left: 16px;
text-transform: lowercase;
font-size: 9px;
color: #592e18;
background: url('http://i35.tinypic.com/mwqzx3.png') left no-repeat;
}
/*---------------------------------------------------------------------
Entry Stuff - Current Mood, Music and Location
------------------------------------------------------------------------*/
.currents {
margin: 0px;
background-color: transparent;
}
.currents strong{
font-weight: normal;
font-size: 9px;
color: #592e18;
}
.currentlocation {
padding-left: 16px;
font-size: 9px;
color: #592e18;
background: url('http://i35.tinypic.com/mwqzx3.png') left no-repeat;
}
.currentmood {
padding-left: 16px;
font-size: 9px;
color: #592e18;
background: url('http://i35.tinypic.com/mwqzx3.png') left no-repeat;
}
.currentmusic {
padding-left: 16px;
font-size: 9px;
color: #592e18;
background: url('http://i35.tinypic.com/mwqzx3.png') left no-repeat;
}
/*---------------------------------------------------------------------
Entry Stuff - Comments
------------------------------------------------------------------------*/
.comments {
font-family: "georgia", sans-serif;
text-transform: uppercase;
font-size: 7.5pt;
text-align: left;
background-color: #ffffff;
padding: 0px 5px 0px 5px;
position: relative;
top: 15px;
}
div.comments a, div.comments a:link, div.comments a:visited{
color: #CC1100;
}
div.comments a:hover {
color: #FF660D;
text-decoration: none;
}
/*---------------------------------------------------------------------
Entry Stuff - Separator
------------------------------------------------------------------------*/
.separator{
/* for formatting separators between entries */
height: 10px;
width: auto;
border-bottom: 0px dashed #e6a100;
padding: 5px 5px 5px 5px;
}
/*------------------------------------------------------------
Special friends page customization
-------------------------------------------------------------------------------*/
.userpicfriends {
position: relative;
float: right;
background-color: #ffffff;
padding: 5px;
margin: 10px;
z-index: 15;
border-width: 5px;
border-color: #bd0202;
border-style: solid;
}
/*------------------------------------------------------------
Sidebar
-------------------------------------------------------------------------------*/
.defaultuserpic {
text-align: center;
}
.sbarheader {
padding: 0px 5px 0px 5px;
}
.sbarbody {
padding: 0px 5px 0px 5px;
}
.sbarbody2 {
padding: 0 15px 0 15px;
}
div#sidebar a, div#sidebar a:link, div#sidebar a:visited{
color: #CC1100;
}
div#sidebar a:hover {
color: #FFFFFF;
text-decoration: none;
}
#sidebar_tags span a {font-size: 7.5pt}
/*------------------------------------------------------------
Sidebar - Calendar
-------------------------------------------------------------------------------*/
table.calendar {
margin-right: auto;
margin-left: auto;
}
.sbarcalendar {
border-color: #592e18;
border-width: 1px;
border-style: solid;
text-align: center;
font-family: "georgia", sans-serif;
font-size: 7.5pt;
}
.sbarcalendarposts {
border-color: #592e18;
border-width: 1px;
border-style: solid;
background-color: goldenrod;
text-align: center;
font-family: "georgia", sans-serif;
font-size: 7.5pt;
}
/*------------------------------------------------------------
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;
list-style: none;
background-color: #e68600;
margin-bottom: 10px;
margin-top: 10px;
border-color: #592e18;
border-bottom: 1px dotted #592e18;
color: #592e18;
font-family: "georgia", sans-serif;
font-size: 15pt;
text-transform: lowercase;
}
/*----------------------------------------------------
footer
----------------------------------------------------------------*/
#footer {
width: 100%;
text-align: center;
font-family: "georgia", sans-serif;
font-size: 7.5pt;
font-weight: bold;
letter-spacing: 1px;
background-color: #000000;
color: #ffffff;
border-color:#592e18;
border-width: 0px;
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:#CC1100;
}
table.yeartable td.yearday {
background-color: #ffffff;
text-align: center;
}
td.yearmonth {
border-style: none;
}
/*----------------------------------------------------
Comments pages
----------------------------------------------------------------*/
.datesubjectcomment {
background-color: #ffffff;
padding: 5px;
margin-top: 20px;
}
.userpiccomment {
position: relative;
border-width: 5px;
border-style: solid;
border-color: #bd0202;
background-color: #ffffff;
top: -30px;
left: 0px;
padding: 5px;
margin: 10px 10px -20px 10px;
z-index: 15;
float: left;
}
.box {
width: auto;
clear: left;
padding: 10px;
border-left: 1px solid #592e18;
background-color: #FFFFFF;
}
input, textarea {
background-color: #f1f1f1;
color: #592e18;
border-left: 1px solid #f9f9f9;
}
textarea.textbox{
border: 0px solid #ffffff;
width: 100% !important;
}
.reply {
font-size: 10px;
line-height: 125%;
color: #592e18;
text-align: left;
position: relative;
margin: 20px 30px 10px 30px;
padding: 25px 10px 10px 10px;
}
.replytosubject {
font-weight: bold;
}
.commentreply {
position: relative;
margin: 10px;
font-size: 7.5pt;
font-family: "georgia", sans-serif;
color: #592e18;
}
.commentbox {
border-color: #592e18;
border-width: 1px;
border-style: solid;
padding: 10px;
margin: 10px;
background-color: #ffffff;
}
.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #CC1100;
}
.datesubjectcomment a:hover {
color: #b0b9c8;
}
.commentboxpartial {
padding: 10px;
margin: 10px;
background-color: #ffffff;
}
.commentinfo {
margin-top: 10px;
width: 100%;
}
.skiplinks {
text-align: center;
}
/*--------------------------------------------
Misc
-----------------------------------------*/
.ljuser img {
width: 0;
height: 0;
background-repeat: no-repeat;
background-image: url(http://i37.tinypic.com/2h36djo.png);
;){kind=link}
padding: 7px 0px 2px 7px;
}
.ljuser A:link, A:visited, A:active {
color: #CC1100;
text-decoration: none;
font-weight: bold;
}
.ljuser A:hover {
color: #FF660D;
text-decoration: none;
font-weight: bold;
}
.clear {
display: none;
}
layout images;
All the images used in the layout are uploaded to tinypic, so you do not have to re-upload them unless you want to. However if you do, here are links to all the images used in the layout:
Autumn Striped Header. { Made by me using photoshop and COLOURlovers}
LJ User Icon. {Made by FamFamFam.)
And that is it. There shouldn't be any problems, I tested the layout on my own journal, in all the browsers, including the custom comment page, tags page and calender page. I hope you all like the layout, I encourage you to comment and let me know what you think. And of course, feel free to comment if you have any questions.
Oh, and here is the COLOURlovers palette I create that inspired this layout. Feel free to give it some votes, etc, that would be great!
Color by COLOURlovers