A Layout made for 41 Days of Metallicar
A simple layout (Apart from the header it only contains 2 tiny pictures!), you could use it for anything, really - just change the header.
Because of problems with a couple of things on the comment page, I just gave up trying to make the CSS work for both Internet Explorer and Firefox (Once again IE isn't doing what it's supposed to. I swear, those browsers are trying to make me go crazy. I'm telling you people, it's a conspiracy! *ahem*), and just made a CSS for IE and one for FF. I don't know what it looks like in other browsers, but I guess the Firefox version should work.
Edit (October 13, 2017): I replaced the old Photobucket links, so images are back now. And I got rid of the IE version.
Beige is the New Black
info
based on Flexible Squares
works for all account types
tested in Internet Explorer 6 and Firefox 2
how to
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
/* Beige is the New Black
http://fuesch.livejournal.com/17808.html */
body {
background: #E0CDA1;
text-align: center;
color: #562802;
font-family: "Verdana", sans-serif;
font-size: 12px;
margin: 0px 0 20px 0;
}
a, a:link {
color: #716E22;
text-decoration: none;
}
a:visited, a:active {
color: #7D7B44;
text-decoration: none;
}
a:hover {
color: #716E22;
text-decoration: underline;
}
code, kbd, pre, tt {
font-family: monospace;
font-size: 12px;
}
code {
background: #D3B891;
}
p, td, blockquote {
font-size: 12px;
}
blockquote {
border-left: 3px double #562802;
padding-left: 5px;
}
q {
font-style: italic;
}
/* GENERAL ----------------------------------------------------------------------------------------------------------------------------------------------------- */
.clear {
height: 15px;
}
.headerimage {
background: #BFA663 url(http://fatfrog.info/Ma/A/SN/Banner/header_1x01Impala-Tanke.jpg) bottom center no-repeat;
height: 340px;
}
#header {
padding: 6px 0px 25px 0px;
margin: 0px;
text-align: center;
font-family: Georgia, "Times New Roman", Times, serif;
text-transform: uppercase;
font-size: 20px;
color: #BFA663;
}
ul.navheader {
padding: 0px 0px 5px 0px;
margin: 0px;
background: #E0CDA1 url(http://fatfrog.info/Ma/A/layout/beigeisthenewblack/navi.gif) bottom repeat-x;
}
ul.navheader li {
display: inline;
padding: 0 10px 0 10px;
}
div#header a, div#header a:link, div#header a:visited, div#header a:hover {
color: #E0CDA1;
text-decoration: none;
}
.title {
display: none;
}
.subtitle {
display: none;
}
#sidebar {
padding-left: 15px;
margin-right: 50px;
border-left: #BFA663 1px solid;
font-size: 12px;
font-family: "Verdana", sans-serif;
width: 200px;
float: right;
text-align: left;
}
.sbarbody {
padding: 0px;
}
.sbarbody2 {
padding: 0px;
}
ul.sbarlist {
padding-left: 0px;
margin-left: 0px;
list-style: none;
}
li.sbartitle {
background: url(http://fatfrog.info/Ma/A/layout/beigeisthenewblack/sidebar.gif) bottom repeat-x;
padding-bottom: 1px;
color: #E0CDA1;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 14px;
text-transform: uppercase;
letter-spacing: 1px;
text-align: center;
list-style: none;
margin-bottom: -10px;
margin-top: 10px;
}
.tagcloud {
padding-left: 5px;
list-style: none;
}
li.sbaritem {
margin: 0px;
padding: 5px 0;
border-bottom: 1px #BA794E solid;
}
.defaultuserpic {
text-align: center;
}
table.calendar {
margin-right: auto;
margin-left: auto;
}
.sbarcalendar {
padding: 1px 3px 1px 3px;
background: #562802;
color: #E0CDA1;
text-align: center;
font-family: "Verdana", sans-serif;
font-size: 12px;
}
.sbarcalendarposts {
background: #716E22;
text-align: center;
font-family: "Verdana", sans-serif;
font-size: 12px;
font-weight: bold;
}
div#sidebar_calendar a, div#sidebar_calendar a:link, div#sidebar_calendar a:active, div#sidebar_calendar a:visited, div#sidebar_calendar a:hover {
color: #E0CDA1;
}
#maincontent {
margin: 0px 280px 0px 50px;
font-family: "Verdana", sans-serif;
font-size: 12px;
text-align: left;
}
#footer {
padding: 6px 0px 25px 0px;
margin: 0px;
text-align: center;
font-family: Georgia, "Times New Roman", Times, serif;
text-transform: uppercase;
font-size: 20px;
color: #BFA663;
z-index: 100;
clear: both;
}
ul.navfooter{
padding: 0px 0px 5px 0px;
margin: 0px;
background: #E0CDA1 url(http://fatfrog.info/Ma/A/layout/beigeisthenewblack/navi.gif) bottom repeat-x;
}
ul.navfooter li {
display: inline;
margin: 0 10px 0 10px;
}
div#footer a, div#footer a:link, div#footer a:visited, div#footer a:hover {
color: #E0CDA1;
text-decoration: none;
}
.clearfoot {
clear: both;
}
/* ENTRIES & FRIENDS ------------------------------------------------------------------------------------------------------------------------------------------- */
.subcontent {
margin-top: 20px;
}
* html div.subcontent {
/* fixes an IE reply page bug */
height: 1%;
clear: none;
}
.userpic {
position: relative;
float: left;
margin: 0px 10px 10px 0px;
z-index: 15;
}
.userpicfriends {
position: relative;
float: left;
margin: 0px 10px 10px 0px;
z-index: 15;
text-align: right;
font-family: Georgia, "Times New Roman", Times, serif;
font-style: italic;
font-size: 10px;
background: #E0CDA1!important;
}
.userpicfriends, .userpicfriends font {
color: #716E22;
}
.datesubject {
margin-left: 110px;
border-left: 1px solid #BA794E;
}
.date {
color: #BA794E;
font-family: "Verdana", sans-serif;
font-size: 12px;
padding-left: 10px;
}
.subject {
padding: 10px 0px 10px 10px;
color: #9B2C02;
font-family: Georgia, "Times New Roman", Times, serif;
font-style: italic;
font-size: 20px;
}
.entry {
margin-left: 110px;
padding: 10px 0px 0px 10px;
font-family: "Verdana", sans-serif;
font-size: 12px;
text-align: left;
border-left: 1px solid #BA794E;
}
.entry ul li {
padding-left: 5px;
margin-left: 15px;
}
.entry ol li {
padding-left: 5px;
margin-left: 15px;
}
.ljtags {
margin-top: 16px;
border-top: 1px solid #BFA663;
padding: 3px;
}
.currents {
font-family: "Verdana", sans-serif;
font-size: 12px;
margin-top: -16px;
border-top: 1px solid #BFA663;
padding: 3px;
}
.comments {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 14px;
text-transform: uppercase;
text-align: left;
}
div.comments a, div.comments a:link, div.comments a:visited, div.comments a:hover {
color: #9B2C02;
}
.separator {
height: 35px;
}
/* COMMENTS ---------------------------------------------------------------------------------------------------------------------------------------------------- */
.skiplinks {
background: url(http://fatfrog.info/Ma/A/layout/beigeisthenewblack/sidebar.gif) bottom;
line-height: 14px;
padding-bottom: 3px;
color: #E0CDA1;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 14px;
text-transform: uppercase;
letter-spacing: 1px;
text-align: center;
}
.skiplinks a, .skiplinks a:link, .skiplinks a:active, .skiplinks a:visited {
color: #E0CDA1;
}
.skiplinks a:hover {
color: #BA794E;
text-decoration: none;
}
.box {
clear: left;
padding-left: 0px;
}
.commentbox {
border-left: 1px solid #BA794E;
margin: 20px 0px 20px 110px;
}
.datesubjectcomment {
color: #9B2C02;
font-family: Georgia, "Times New Roman", Times, serif;
font-style: italic;
font-size: 16px;
padding: 0px 5px 0px 10px;
border-bottom: 1px solid #BA794E;
}
.userpiccomment {
position: relative;
margin: 0px 0px 0px -120px;
z-index: 15;
float: left;
}
.commentreply {
position: relative;
margin: 10px 0px 10px 10px;
font-size: 12px;
font-family: "Verdana", sans-serif;
}
.commentboxpartial {
border: 1px solid #BA794E;
padding: 10px;
margin: 20px 0px 20px 0px;
font-family: Georgia, "Times New Roman", Times, serif;
font-style: italic;
font-size: 14px;
}
#content + div {
background-color: #E0CDA1!important;
border: none!important;
}
/* COMMENTING ------------------------------------------------------------------------------------------------------------------------------------------------- */
.replytoposter {
color: #BA794E;
font-family: "Verdana", sans-serif;
font-size: 12px;
padding-left: 10px;
}
.replytosubject {
padding: 10px 0px 10px 10px;
color: #9B2C02;
font-family: Georgia, "Times New Roman", Times, serif;
font-style: italic;
font-size: 20px;
}
* html div.box#commentform {
/* fixes an IE reply page bug */
position: absolute;
}
input, textarea {
background-color: #EAE1CB;
color: #562802;
}
textarea.textbox {
width: 95% !important;
}
/* CALENDAR ---------------------------------------------------------------------------------------------------------------------------------------------------- */
ul.year {
text-align: center;
padding-bottom: 40px;
}
ul.year li {
display: inline;
font-family: Georgia, "Times New Roman", Times, serif;
font-style: italic;
font-size: 20px;
}
table.yeartable {
margin-left: auto;
margin-right: auto;
}
td.yearmonth {
border-style: none;
}
table.yeartable td.yearday {
background: url(http://fatfrog.info/Ma/A/layout/beigeisthenewblack/sidebar.gif) bottom repeat-x;
padding-bottom: 1px;
color: #E0CDA1;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 14px;
text-transform: uppercase;
letter-spacing: 1px;
text-align: center;
}
table.yeartable td.yeardate {
background: #562802;
color: #E0CDA1;
}
table.yeartable td.yeardate a {
font-weight: bold;
}
The ads of a plus account take their color from the Custom Options. If you want to adjust the colors, go to Style and change Page - Background color of the outer table and Entries - Border color of the content and header/footer boxes to #E0CDA1.
Because of problems with a couple of things on the comment page, I just gave up trying to make the CSS work for both Internet Explorer and Firefox (Once again IE isn't doing what it's supposed to. I swear, those browsers are trying to make me go crazy. I'm telling you people, it's a conspiracy! *ahem*), and just made a CSS for IE and one for FF. I don't know what it looks like in other browsers, but I guess the Firefox version should work.
Edit (October 13, 2017): I replaced the old Photobucket links, so images are back now. And I got rid of the IE version.
Beige is the New Black
info
based on Flexible Squares
works for all account types
tested in Internet Explorer 6 and Firefox 2
how to
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
/* Beige is the New Black
http://fuesch.livejournal.com/17808.html */
body {
background: #E0CDA1;
text-align: center;
color: #562802;
font-family: "Verdana", sans-serif;
font-size: 12px;
margin: 0px 0 20px 0;
}
a, a:link {
color: #716E22;
text-decoration: none;
}
a:visited, a:active {
color: #7D7B44;
text-decoration: none;
}
a:hover {
color: #716E22;
text-decoration: underline;
}
code, kbd, pre, tt {
font-family: monospace;
font-size: 12px;
}
code {
background: #D3B891;
}
p, td, blockquote {
font-size: 12px;
}
blockquote {
border-left: 3px double #562802;
padding-left: 5px;
}
q {
font-style: italic;
}
/* GENERAL ----------------------------------------------------------------------------------------------------------------------------------------------------- */
.clear {
height: 15px;
}
.headerimage {
background: #BFA663 url(http://fatfrog.info/Ma/A/SN/Banner/header_1x01Impala-Tanke.jpg) bottom center no-repeat;
height: 340px;
}
#header {
padding: 6px 0px 25px 0px;
margin: 0px;
text-align: center;
font-family: Georgia, "Times New Roman", Times, serif;
text-transform: uppercase;
font-size: 20px;
color: #BFA663;
}
ul.navheader {
padding: 0px 0px 5px 0px;
margin: 0px;
background: #E0CDA1 url(http://fatfrog.info/Ma/A/layout/beigeisthenewblack/navi.gif) bottom repeat-x;
}
ul.navheader li {
display: inline;
padding: 0 10px 0 10px;
}
div#header a, div#header a:link, div#header a:visited, div#header a:hover {
color: #E0CDA1;
text-decoration: none;
}
.title {
display: none;
}
.subtitle {
display: none;
}
#sidebar {
padding-left: 15px;
margin-right: 50px;
border-left: #BFA663 1px solid;
font-size: 12px;
font-family: "Verdana", sans-serif;
width: 200px;
float: right;
text-align: left;
}
.sbarbody {
padding: 0px;
}
.sbarbody2 {
padding: 0px;
}
ul.sbarlist {
padding-left: 0px;
margin-left: 0px;
list-style: none;
}
li.sbartitle {
background: url(http://fatfrog.info/Ma/A/layout/beigeisthenewblack/sidebar.gif) bottom repeat-x;
padding-bottom: 1px;
color: #E0CDA1;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 14px;
text-transform: uppercase;
letter-spacing: 1px;
text-align: center;
list-style: none;
margin-bottom: -10px;
margin-top: 10px;
}
.tagcloud {
padding-left: 5px;
list-style: none;
}
li.sbaritem {
margin: 0px;
padding: 5px 0;
border-bottom: 1px #BA794E solid;
}
.defaultuserpic {
text-align: center;
}
table.calendar {
margin-right: auto;
margin-left: auto;
}
.sbarcalendar {
padding: 1px 3px 1px 3px;
background: #562802;
color: #E0CDA1;
text-align: center;
font-family: "Verdana", sans-serif;
font-size: 12px;
}
.sbarcalendarposts {
background: #716E22;
text-align: center;
font-family: "Verdana", sans-serif;
font-size: 12px;
font-weight: bold;
}
div#sidebar_calendar a, div#sidebar_calendar a:link, div#sidebar_calendar a:active, div#sidebar_calendar a:visited, div#sidebar_calendar a:hover {
color: #E0CDA1;
}
#maincontent {
margin: 0px 280px 0px 50px;
font-family: "Verdana", sans-serif;
font-size: 12px;
text-align: left;
}
#footer {
padding: 6px 0px 25px 0px;
margin: 0px;
text-align: center;
font-family: Georgia, "Times New Roman", Times, serif;
text-transform: uppercase;
font-size: 20px;
color: #BFA663;
z-index: 100;
clear: both;
}
ul.navfooter{
padding: 0px 0px 5px 0px;
margin: 0px;
background: #E0CDA1 url(http://fatfrog.info/Ma/A/layout/beigeisthenewblack/navi.gif) bottom repeat-x;
}
ul.navfooter li {
display: inline;
margin: 0 10px 0 10px;
}
div#footer a, div#footer a:link, div#footer a:visited, div#footer a:hover {
color: #E0CDA1;
text-decoration: none;
}
.clearfoot {
clear: both;
}
/* ENTRIES & FRIENDS ------------------------------------------------------------------------------------------------------------------------------------------- */
.subcontent {
margin-top: 20px;
}
* html div.subcontent {
/* fixes an IE reply page bug */
height: 1%;
clear: none;
}
.userpic {
position: relative;
float: left;
margin: 0px 10px 10px 0px;
z-index: 15;
}
.userpicfriends {
position: relative;
float: left;
margin: 0px 10px 10px 0px;
z-index: 15;
text-align: right;
font-family: Georgia, "Times New Roman", Times, serif;
font-style: italic;
font-size: 10px;
background: #E0CDA1!important;
}
.userpicfriends, .userpicfriends font {
color: #716E22;
}
.datesubject {
margin-left: 110px;
border-left: 1px solid #BA794E;
}
.date {
color: #BA794E;
font-family: "Verdana", sans-serif;
font-size: 12px;
padding-left: 10px;
}
.subject {
padding: 10px 0px 10px 10px;
color: #9B2C02;
font-family: Georgia, "Times New Roman", Times, serif;
font-style: italic;
font-size: 20px;
}
.entry {
margin-left: 110px;
padding: 10px 0px 0px 10px;
font-family: "Verdana", sans-serif;
font-size: 12px;
text-align: left;
border-left: 1px solid #BA794E;
}
.entry ul li {
padding-left: 5px;
margin-left: 15px;
}
.entry ol li {
padding-left: 5px;
margin-left: 15px;
}
.ljtags {
margin-top: 16px;
border-top: 1px solid #BFA663;
padding: 3px;
}
.currents {
font-family: "Verdana", sans-serif;
font-size: 12px;
margin-top: -16px;
border-top: 1px solid #BFA663;
padding: 3px;
}
.comments {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 14px;
text-transform: uppercase;
text-align: left;
}
div.comments a, div.comments a:link, div.comments a:visited, div.comments a:hover {
color: #9B2C02;
}
.separator {
height: 35px;
}
/* COMMENTS ---------------------------------------------------------------------------------------------------------------------------------------------------- */
.skiplinks {
background: url(http://fatfrog.info/Ma/A/layout/beigeisthenewblack/sidebar.gif) bottom;
line-height: 14px;
padding-bottom: 3px;
color: #E0CDA1;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 14px;
text-transform: uppercase;
letter-spacing: 1px;
text-align: center;
}
.skiplinks a, .skiplinks a:link, .skiplinks a:active, .skiplinks a:visited {
color: #E0CDA1;
}
.skiplinks a:hover {
color: #BA794E;
text-decoration: none;
}
.box {
clear: left;
padding-left: 0px;
}
.commentbox {
border-left: 1px solid #BA794E;
margin: 20px 0px 20px 110px;
}
.datesubjectcomment {
color: #9B2C02;
font-family: Georgia, "Times New Roman", Times, serif;
font-style: italic;
font-size: 16px;
padding: 0px 5px 0px 10px;
border-bottom: 1px solid #BA794E;
}
.userpiccomment {
position: relative;
margin: 0px 0px 0px -120px;
z-index: 15;
float: left;
}
.commentreply {
position: relative;
margin: 10px 0px 10px 10px;
font-size: 12px;
font-family: "Verdana", sans-serif;
}
.commentboxpartial {
border: 1px solid #BA794E;
padding: 10px;
margin: 20px 0px 20px 0px;
font-family: Georgia, "Times New Roman", Times, serif;
font-style: italic;
font-size: 14px;
}
#content + div {
background-color: #E0CDA1!important;
border: none!important;
}
/* COMMENTING ------------------------------------------------------------------------------------------------------------------------------------------------- */
.replytoposter {
color: #BA794E;
font-family: "Verdana", sans-serif;
font-size: 12px;
padding-left: 10px;
}
.replytosubject {
padding: 10px 0px 10px 10px;
color: #9B2C02;
font-family: Georgia, "Times New Roman", Times, serif;
font-style: italic;
font-size: 20px;
}
* html div.box#commentform {
/* fixes an IE reply page bug */
position: absolute;
}
input, textarea {
background-color: #EAE1CB;
color: #562802;
}
textarea.textbox {
width: 95% !important;
}
/* CALENDAR ---------------------------------------------------------------------------------------------------------------------------------------------------- */
ul.year {
text-align: center;
padding-bottom: 40px;
}
ul.year li {
display: inline;
font-family: Georgia, "Times New Roman", Times, serif;
font-style: italic;
font-size: 20px;
}
table.yeartable {
margin-left: auto;
margin-right: auto;
}
td.yearmonth {
border-style: none;
}
table.yeartable td.yearday {
background: url(http://fatfrog.info/Ma/A/layout/beigeisthenewblack/sidebar.gif) bottom repeat-x;
padding-bottom: 1px;
color: #E0CDA1;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 14px;
text-transform: uppercase;
letter-spacing: 1px;
text-align: center;
}
table.yeartable td.yeardate {
background: #562802;
color: #E0CDA1;
}
table.yeartable td.yeardate a {
font-weight: bold;
}
The ads of a plus account take their color from the Custom Options. If you want to adjust the colors, go to Style and change Page - Background color of the outer table and Entries - Border color of the content and header/footer boxes to #E0CDA1.